@lanaco/lnc-react-ui/dist/EditableTable.cjs

React component library

"use strict";const a=require("react/jsx-runtime"),l=require("react"),w=require("./utils-BK6B_Y9X.cjs"),V=require("./Table.cjs"),S=require("./emotion-styled.browser.esm-DwHBgTPn.cjs"),B=require("./TextInput.cjs"),z=require("./NumberInput.cjs"),K=require("./DecimalInput.cjs"),H=require("./CheckBoxInput.cjs"),W=require("./Dropdown.cjs"),J=require("./DecimalInputV2.cjs"),Q=require("./emotion-element-f0de968e.browser.esm-B7k6i6lC.cjs"),g={BOOLEAN:"BOOLEAN",STRING:"STRING",INTEGER:"INTEGER",DECIMAL:"DECIMAL",DECIMAL2:"DECIMAL2",DATE:"DATE",SELECT:"SELECT"},U=S.styled.td`
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: ${r=>r.width};
  padding: ${r=>r.focused&&!r.isBoolean?"0.5rem 0.5rem 0.5rem 0.7rem":"0.5rem 0.5rem 0.5rem 1.5rem"};
  ${r=>r.bgColor}

  ${r=>w.getComponentTypographyCss(r.theme,"TableCell",r.size,"enabled")};
`,X=S.styled.div`
  ${r=>w.getComponentTypographyCss(r.theme,"TableSpecialLastRow",r.size,"enabled")};
  padding: ${r=>r.hasRender?"0":"9.5px 6px 9.5px 0"};
  cursor: ${r=>r.tabIndex!==-1?"pointer":"auto"};
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;

  &:focus {
    outline: none;
  }
`,q=r=>{const[i,A]=l.useState(!1);var c=l.useRef(),y=l.useRef(),v=l.useRef(!0);const{Column:e={},ColumnsToRender:d,RowData:n={},Index:T=0,RowIndex:f,EnableSelection:x=!1,TabIndexOffset:I=100,onFocusChanged:D,onDiscard:F,onMount:R,onChange:t,className:o="",size:b="small",color:m="primary"}=r,p=Q.useTheme(),L={className:o,size:b,color:m,theme:p};l.useEffect(()=>{R(f,T,y)},[]),l.useEffect(()=>{i||R(f,T,y)},[i]),l.useEffect(()=>{i&&c&&c.current&&c.current.focus()},[i]);const k=()=>e&&e.width?e.width+"%":"auto",O=()=>{if(e.editable!==!0)return-1;var s=d.filter(h=>h.editable),E=s.find(h=>h.id===e.id);return I+f*s.length+s.indexOf(E)},j=(s,E)=>{D(s,E,f,T),E||A(E)},N=s=>{s.key==="Escape"&&(v.current=!1,c.current.blur(),v.current=!0,F(s,f,T,n))},_=()=>{var s=null,E=(u,G)=>{t(u,G,f,T,e,n)},h=u=>{t(null,u,f,T,e,n)},C={...L,debounceTime:0,...e.inputProps,value:e!=null&&e.objectAccessor?n[e.accessor][e==null?void 0:e.objectAccessor]:n[e.accessor],defaultChecked:e!=null&&e.objectAccessor?n[e.accessor][e==null?void 0:e.objectAccessor]:n[e.accessor],focused:i,onChange:E,onBlur:u=>j(u,!1),onFocus:u=>j(u,!0),onKeyDown:u=>N(u),tabIndex:O()};switch(e.inputType){case g.STRING:s=a.jsx(B,{...C,ref:c});break;case g.INTEGER:s=a.jsx(z,{...C,ref:c});break;case g.DECIMAL:s=a.jsx(K,{...C,ref:c});break;case g.DECIMAL2:s=a.jsx(J,{...C,ref:c});break;case g.DATE:s=a.jsx(B,{...C,ref:c});break;case g.BOOLEAN:s=a.jsx(H,{...C,ref:c});break;case g.SELECT:s=a.jsx(W.default,{...C,value:e.inputProps.options.find(u=>u.value===(e==null?void 0:e.objectAccessor)?n[e.accessor][e==null?void 0:e.objectAccessor]:n[e.accessor]),onChange:h,ref:c});break;default:s=a.jsx(B,{...C,ref:c})}return s},M=s=>{v.current===!0?j(s,!1):A(!1)},$=()=>{var s=_();if(e.editable===!0&&e.editComponent){var E={};e.inputType===g.SELECT&&(E={items:e.selectItems,mapNameTo:e.selectProps.mapNameTo,mapValueTo:e.selectProps.mapValueTo}),s=a.jsx(e.editComponent,{ref:c,tabIndex:O(),value:e!=null&&e.objectAccessor?n[e.accessor][e==null?void 0:e.objectAccessor]:n[e.accessor],onChange:(h,C,u)=>{t(h,C,f,T,e,n,u)},focused:i,onBlur:M,onFocus:h=>j(h,!0),onKeyDown:h=>N(h),...E})}if(e.editable===!0&&i)return s;if(!i||e.editable!==!0)return a.jsx(X,{ref:y,tabIndex:O(),onFocus:()=>A(!0),hasRender:!!e.readonlyComponent,...L,children:e.readonlyComponent?a.jsx(e.readonlyComponent,{rowData:n,value:e!=null&&e.objectAccessor?n[e.accessor][e==null?void 0:e.objectAccessor]:n[e.accessor],fullValue:n[e.accessor],disabled:!0}):e!=null&&e.objectAccessor?n[e.accessor][e==null?void 0:e.objectAccessor]:n[e.accessor]})};return l.createElement(U,{"data-rowindex":f,...L,selection:x,width:k(),key:T,focused:i,isBoolean:e.inputType===g.BOOLEAN},$())};q.displayName="TABLE_CELL";const P=l.forwardRef((r,i)=>{var{Data:A=[],onRowFocusChange:c=()=>{},onDiscard:y=()=>{},onInputChange:v=()=>{}}=r;const e=l.useRef({FocusedCell:null,PreviousFocusedCell:null}),d=l.useRef([]),n=l.useRef(null),T=l.useRef();l.useImperativeHandle(i,()=>({focusFirstCellOfLastRow:()=>{n.current&&n.current.focus()},focusLastActiveCell:()=>{try{var t=d.current.find(o=>o.row===e.current.PreviousFocusedCell.row&&o.cell===e.current.PreviousFocusedCell.cell);t.ref&&t.ref.focus()}catch{}}}),[r]);const f=(t,o,b,m,p,L)=>{v&&v(t,o,b,m,p,L)},x=(t,o,b,m,p)=>{o&&(e.current={...e.current,FocusedCell:{row:b,cell:m,ref:p}}),o||(e.current={PreviousFocusedCell:e.current.FocusedCell,FocusedCell:null},I(t,b))},I=(t,o)=>{(t.relatedTarget===null||t.relatedTarget.closest("tbody")===null||!t.relatedTarget.closest("tbody").hasAttribute("data-tbody"))&&c(t,o,-1),t.relatedTarget&&t.relatedTarget.closest("tbody")&&t.relatedTarget.closest("tbody").hasAttribute("data-tbody")&&parseInt(t.relatedTarget.closest("td").getAttribute("data-rowindex"))!==o&&c(t,o,parseInt(t.relatedTarget.closest("td").getAttribute("data-rowindex")))},D=(t,o,b)=>{if(t===A.length-1&&o===0&&(n.current=b.current),d.current.length===0&&(d.current=[{row:t,cell:o,ref:b.current}]),d.current.length>0&&d.current.find(p=>p.row===t&&p.cell===o)){var m=d.current.find(p=>p.row===t&&p.cell===o);m.ref=b.current}else d.current.length>0&&(d.current=[...d.current,{row:t,cell:o,ref:b.current}])},F=()=>w.renderCustomElement(w.getCustomRender("TABLE_SPECIAL_LAST_ROW",r.children),{TabIndexOffset:50})||a.jsx(a.Fragment,{}),R=()=>{var t={TabIndexOffset:50,onFocusChanged:x,onChange:f,onDiscard:y,onMount:D};return w.renderCustomElement(w.getCustomRender("TABLE_CELL",r.children),t)||a.jsx(q,{...t})};return a.jsx(a.Fragment,{children:a.jsxs(V.default,{ref:T,...r,Data:A,VisibilityPattern:null,children:[r.children,R(),F()]})})});P.displayName="EDITABLE_TABLE";module.exports=P;