@teppen/react-ui 1.5.8 → 1.5.10
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/src/table/cell/hooks.js +1 -1
- package/dist/cjs/src/table/cell/hooks.js.map +1 -1
- package/dist/cjs/src/table/cell/ui/cell.js +1 -1
- package/dist/cjs/src/table/cell/ui/edit-button.js +1 -1
- package/dist/cjs/src/table/edit/ui/select-input.js +1 -1
- package/dist/cjs/src/table/focus/hooks.js +1 -1
- package/dist/cjs/src/table/focus/hooks.js.map +1 -1
- package/dist/cjs/src/table/focus/provider.js +1 -1
- package/dist/cjs/src/table/focus/provider.js.map +1 -1
- package/dist/cjs/src/table/libs/id-generator.js +1 -1
- package/dist/cjs/src/table/libs/id-generator.js.map +1 -1
- package/dist/cjs/src/table/sheet/components.js +1 -1
- package/dist/cjs/src/table/sheet/components.js.map +1 -1
- package/dist/cjs/src/table/table/base.js +1 -1
- package/dist/esm/src/table/cell/hooks.js +1 -1
- package/dist/esm/src/table/cell/hooks.js.map +1 -1
- package/dist/esm/src/table/cell/ui/cell.js +1 -1
- package/dist/esm/src/table/cell/ui/edit-button.js +1 -1
- package/dist/esm/src/table/edit/ui/select-input.js +1 -1
- package/dist/esm/src/table/focus/hooks.js +1 -1
- package/dist/esm/src/table/focus/hooks.js.map +1 -1
- package/dist/esm/src/table/focus/provider.js +1 -1
- package/dist/esm/src/table/focus/provider.js.map +1 -1
- package/dist/esm/src/table/libs/id-generator.js +1 -1
- package/dist/esm/src/table/libs/id-generator.js.map +1 -1
- package/dist/esm/src/table/sheet/components.js +1 -1
- package/dist/esm/src/table/sheet/components.js.map +1 -1
- package/dist/esm/src/table/table/base.js +1 -1
- package/package.json +1 -1
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var e=require("react"),t=require("../edit/provider.js"),
|
|
1
|
+
"use strict";var e=require("react"),t=require("../edit/provider.js"),r=require("../focus/provider.js"),n=require("../sheet/providers.js"),o=require("../libs/id-generator.js");exports.useCell=function(i,u){var l,s,d=r.useFocusActionContext(),c=d.move,a=d.focus,p=t.useEditActionContext().startEditing,v=o.IdGenerator.getCellIndex(i),f=v[0],C=v[1],b=n.useColumnsContext()[C],m=u[b.key],q="select"===b.type?null===(s=null===(l=b.options)||void 0===l?void 0:l.find((function(e){return e.value===m})))||void 0===s?void 0:s.label:m,x=e.useMemo((function(){return b.editable?q:b.render?b.render(m,u):q}),[b.editable,q,m,u]);return{type:!b.editable&&b.render?"component":b.type,component:x,onClickCell:function(e){e.preventDefault(),e.stopPropagation(),a(f,C),c(f,C)},onDoubleClick:function(e){e.preventDefault(),a(f,C),c(f,C),p()}}};
|
|
2
2
|
//# sourceMappingURL=hooks.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"hooks.js","sources":["../../../../../src/table/cell/hooks.ts"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"file":"hooks.js","sources":["../../../../../src/table/cell/hooks.ts"],"sourcesContent":["import { useMemo } from \"react\";\nimport { useEditActionContext } from \"../edit/provider\";\nimport { useFocusActionContext } from \"../focus/provider\";\nimport { useColumnsContext } from \"../sheet/providers\";\nimport { DataObject, DataRecord, TColumnType } from \"../table/type\";\nimport { IdGenerator } from \"../libs\";\n\nexport function useCell(id: string, row: DataObject<DataRecord>) {\n const { move, focus } = useFocusActionContext();\n const { startEditing } = useEditActionContext();\n const [rowIndex, colIndex] = IdGenerator.getCellIndex(id);\n const col = useColumnsContext()[colIndex];\n const value = row[col.key as string];\n\n const label =\n col.type === \"select\"\n ? col.options?.find((op) => op.value === value)?.label\n : value;\n\n const component = useMemo(() => {\n if (col.editable) {\n return label;\n } else {\n return col.render ? col.render(value as never, row) : label;\n }\n }, [col.editable, label, value, row]);\n\n const type: TColumnType | \"component\" =\n !col.editable && col.render ? \"component\" : col.type;\n\n const onDoubleClick: React.MouseEventHandler<HTMLDivElement> = (e) => {\n e.preventDefault();\n focus(rowIndex, colIndex);\n move(rowIndex, colIndex);\n startEditing();\n };\n\n const onClickCell: React.MouseEventHandler<HTMLDivElement> = (e) => {\n e.preventDefault();\n e.stopPropagation();\n focus(rowIndex, colIndex);\n move(rowIndex, colIndex);\n };\n\n return {\n type,\n component,\n onClickCell,\n onDoubleClick,\n };\n}\n"],"names":["id","row","_c","useFocusActionContext","move","focus","startEditing","useEditActionContext","_d","IdGenerator","getCellIndex","rowIndex","colIndex","col","useColumnsContext","value","key","label","type","_a","options","find","op","_b","component","useMemo","editable","render","onClickCell","e","preventDefault","stopPropagation","onDoubleClick"],"mappings":"+LAOgB,SAAQA,EAAYC,WAC5BC,EAAkBC,EAAqBA,wBAArCC,EAAIF,EAAAE,KAAEC,EAAKH,EAAAG,MACXC,EAAiBC,sCACnBC,EAAuBC,EAAAA,YAAYC,aAAaV,GAA/CW,EAAQH,EAAA,GAAEI,OACXC,EAAMC,EAAAA,oBAAoBF,GAC1BG,EAAQd,EAAIY,EAAIG,KAEhBC,EACS,WAAbJ,EAAIK,KAC6C,UAAlC,QAAXC,EAAAN,EAAIO,eAAO,IAAAD,OAAA,EAAAA,EAAEE,MAAK,SAACC,GAAO,OAAAA,EAAGP,QAAUA,CAAb,WAAmB,IAAAQ,OAAA,EAAAA,EAAEN,MAC/CF,EAEAS,EAAYC,EAAAA,SAAQ,WACxB,OAAIZ,EAAIa,SACCT,EAEAJ,EAAIc,OAASd,EAAIc,OAAOZ,EAAgBd,GAAOgB,CAE1D,GAAG,CAACJ,EAAIa,SAAUT,EAAOF,EAAOd,IAmBhC,MAAO,CACLiB,MAjBCL,EAAIa,UAAYb,EAAIc,OAAS,YAAcd,EAAIK,KAkBhDM,UAASA,EACTI,YAV2D,SAACC,GAC5DA,EAAEC,iBACFD,EAAEE,kBACF1B,EAAMM,EAAUC,GAChBR,EAAKO,EAAUC,EACjB,EAMEoB,cAlB6D,SAACH,GAC9DA,EAAEC,iBACFzB,EAAMM,EAAUC,GAChBR,EAAKO,EAAUC,GACfN,GACF,EAeF"}
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
"use strict";var e=require("react/jsx-runtime"),l=require("
|
|
2
|
+
"use strict";var e=require("react/jsx-runtime"),l=require("react"),i=require("../hooks.js");function r(e){return Object.freeze({__proto__:null,default:e})}var t=l.lazy((function(){return Promise.resolve().then((function(){return r(require("./edit-button.js"))}))}));exports.TableCell=function(r){var n=i.useCell(r.id,r.row),c=n.type,o=n.component,s=n.onClickCell,a=n.onDoubleClick;return e.jsx("td",{id:r.id,className:"".concat(r.cellFormatClassName),onClick:r.isExistOnClickRow?void 0:s,onDoubleClick:r.isExistOnClickRow?void 0:a,children:e.jsxs("div",{className:"flex items-center gap-3 w-fit p-2 cursor-default",onClick:s,children:["component"===c?o:e.jsx("div",{onDoubleClick:a,children:e.jsx("p",{className:"cell-data text-left whitespace-nowrap",children:o})}),e.jsx(l.Suspense,{fallback:null,children:r.editable&&e.jsx(t,{})})]})})};
|
|
3
3
|
//# sourceMappingURL=cell.js.map
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
"use strict";var
|
|
2
|
+
"use strict";var e=require("react/jsx-runtime"),t=require("react"),r=require("../../edit/provider.js"),i=require("../../../icon/edit-icon.js"),n=t.memo((function(){var t=r.useEditActionContext().startEditing;return e.jsx("button",{className:"w-fit h-fit p-1 rounded-full text-gray-500 hover:bg-gray-200",onClick:function(e){e.preventDefault(),t()},children:e.jsx(i.EditIcon,{size:12})})}));module.exports=n;
|
|
3
3
|
//# sourceMappingURL=edit-button.js.map
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
"use strict";var e=require("react/jsx-runtime"),t=require("react"),n=require("../provider.js"),r=require("../../../icon/cancel-icon.js");exports.SelectCellInput=function(
|
|
2
|
+
"use strict";var e=require("react/jsx-runtime"),t=require("react"),n=require("../provider.js"),r=require("../../../icon/cancel-icon.js");exports.SelectCellInput=function(u){var l=u.col,o=n.useEditActionContext().endEditing,i=u.row[l.key],a=t.useState(i),c=a[0],s=a[1],f=t.useRef(null);return t.useEffect((function(){f.current&&f.current.focus()}),[f]),l.editable?e.jsxs("div",{className:"flex justify-between gap-1 w-full items-center",children:[e.jsxs("select",{ref:f,className:"w-full py-1 px-2 bg-white text-gray-900",value:c,onChange:function(e){e.preventDefault(),s(e.target.value)},onBlur:function(e){e.preventDefault(),c!==i?function(e){l.editable&&l.onCellBlur(l.key,e,u.row,o)}(c):o()},onKeyDown:function(e){"Enter"===e.key&&e.preventDefault()},onKeyUp:function(e){e.preventDefault(),"Enter"===e.key?e.target.blur():"Escape"===e.key&&(s(i),o())},children:[l.allowEmpty&&e.jsx("option",{value:"",children:""==i?"-- 未選択 --":"-- 選択解除 --"},"TEPPEN/ReactUI Empty Option"),l.options.map((function(t){return e.jsx("option",{value:t.value,children:t.label},t.value)}))]}),e.jsx("button",{onMouseDown:function(e){e.preventDefault(),e.stopPropagation(),setTimeout((function(){s(i),o()}),300)},children:e.jsx(r.CancelIcon,{size:16})})]}):e.jsx(e.Fragment,{})};
|
|
3
3
|
//# sourceMappingURL=select-input.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var e=require("../../../node_modules/tslib/tslib.es6.js"),o=require("react"),n=require("../libs/id-generator.js"),
|
|
1
|
+
"use strict";var e=require("../../../node_modules/tslib/tslib.es6.js"),o=require("react"),n=require("../libs/id-generator.js"),t=function(o,n){switch(n.type){case"focus":return o.isFocus?o:{isFocus:!0,rowIndex:n.payload.rowIndex,colIndex:n.payload.colIndex};case"unfocus":return o.isFocus?{isFocus:!1}:o;case"move":return o.isFocus?{isFocus:!0,rowIndex:n.payload.rowIndex,colIndex:n.payload.colIndex}:o;case"moveLeft":return o.isFocus?e.__assign(e.__assign({},o),{colIndex:o.colIndex-1}):o;case"moveRight":return o.isFocus?e.__assign(e.__assign({},o),{colIndex:o.colIndex+1}):o;case"moveUp":return o.isFocus?e.__assign(e.__assign({},o),{rowIndex:o.rowIndex-1}):o;case"moveDown":return o.isFocus?e.__assign(e.__assign({},o),{rowIndex:o.rowIndex+1}):o}};exports.useFocusReducer=function(){var e=o.useReducer(t,{isFocus:!1}),s=e[0],u=e[1],c=o.useMemo((function(){return{focus:function(e,o){u({type:"focus",payload:{rowIndex:e,colIndex:o}})},unfocus:function(){u({type:"unfocus"})},move:function(e,o){u({type:"move",payload:{rowIndex:e,colIndex:o}})},moveLeft:function(){u({type:"moveLeft"})},moveRight:function(){u({type:"moveRight"})},moveUp:function(){u({type:"moveUp"})},moveDown:function(){u({type:"moveDown"})}}}),[]);return o.useEffect((function(){var e=function(e){var o=document.getElementById("table-frame"),n=e.target;n instanceof Node&&(null==o?void 0:o.contains(n))||c.unfocus()};return document.addEventListener("click",e),function(){document.removeEventListener("click",e)}}),[]),o.useEffect((function(){if(s.isFocus){var e=document.getElementById(n.IdGenerator.getTableCellId(s.rowIndex,s.colIndex));null==e||e.style.setProperty("outline-style","solid"),null==e||e.style.setProperty("outline-width","1px"),null==e||e.style.setProperty("outline-offset","-1px"),null==e||e.style.setProperty("outline-color","#9ca3af"),null==e||e.scrollIntoView({behavior:"smooth",block:"nearest",inline:"nearest"}),null==e||e.focus()}return function(){if(s.isFocus){var e=document.getElementById(n.IdGenerator.getTableCellId(s.rowIndex,s.colIndex));null==e||e.style.setProperty("outline-style","none")}}}),[s]),{state:s,actions:c}};
|
|
2
2
|
//# sourceMappingURL=hooks.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"hooks.js","sources":["../../../../../src/table/focus/hooks.ts"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"file":"hooks.js","sources":["../../../../../src/table/focus/hooks.ts"],"sourcesContent":["import { useEffect, useMemo, useReducer } from \"react\";\nimport { TFocusReducer, TReturnFocusReducer } from \"./types\";\nimport { IdGenerator } from \"../libs\";\n\nconst reducer: TFocusReducer = (state, action) => {\n switch (action.type) {\n case \"focus\":\n if (state.isFocus) {\n return state;\n }\n\n return {\n isFocus: true,\n rowIndex: action.payload.rowIndex,\n colIndex: action.payload.colIndex,\n };\n case \"unfocus\":\n if (!state.isFocus) {\n return state;\n }\n\n return {\n isFocus: false,\n };\n case \"move\":\n if (!state.isFocus) {\n return state;\n }\n\n return {\n isFocus: true,\n rowIndex: action.payload.rowIndex,\n colIndex: action.payload.colIndex,\n };\n case \"moveLeft\":\n if (!state.isFocus) {\n return state;\n }\n\n return {\n ...state,\n colIndex: state.colIndex - 1,\n };\n case \"moveRight\":\n if (!state.isFocus) {\n return state;\n }\n\n return {\n ...state,\n colIndex: state.colIndex + 1,\n };\n case \"moveUp\":\n if (!state.isFocus) {\n return state;\n }\n\n return {\n ...state,\n rowIndex: state.rowIndex - 1,\n };\n case \"moveDown\":\n if (!state.isFocus) {\n return state;\n }\n\n return {\n ...state,\n rowIndex: state.rowIndex + 1,\n };\n }\n};\n\nexport function useFocusReducer(): TReturnFocusReducer {\n const [state, dispatch] = useReducer(reducer, {\n isFocus: false,\n });\n\n const actions = useMemo(\n () => ({\n focus: (rowIndex: number, colIndex: number) => {\n dispatch({ type: \"focus\", payload: { rowIndex, colIndex } });\n },\n unfocus: () => {\n dispatch({ type: \"unfocus\" });\n },\n move: (rowIndex: number, colIndex: number) => {\n dispatch({ type: \"move\", payload: { rowIndex, colIndex } });\n },\n moveLeft: () => {\n dispatch({ type: \"moveLeft\" });\n },\n moveRight: () => {\n dispatch({ type: \"moveRight\" });\n },\n moveUp: () => {\n dispatch({ type: \"moveUp\" });\n },\n moveDown: () => {\n dispatch({ type: \"moveDown\" });\n },\n }),\n []\n );\n\n useEffect(() => {\n const onClickOutOfTable = (e: MouseEvent) => {\n const element = document.getElementById(\"table-frame\");\n const ele = e.target;\n if (ele instanceof Node && element?.contains(ele)) return;\n actions.unfocus();\n };\n\n document.addEventListener(\"click\", onClickOutOfTable);\n\n return () => {\n document.removeEventListener(\"click\", onClickOutOfTable);\n };\n }, []);\n\n useEffect(() => {\n if (state.isFocus) {\n const element = document.getElementById(\n IdGenerator.getTableCellId(state.rowIndex, state.colIndex)\n );\n element?.style.setProperty(\"outline-style\", \"solid\");\n element?.style.setProperty(\"outline-width\", \"1px\");\n element?.style.setProperty(\"outline-offset\", \"-1px\");\n element?.style.setProperty(\"outline-color\", \"#9ca3af\");\n\n element?.scrollIntoView({\n behavior: \"smooth\",\n block: \"nearest\",\n inline: \"nearest\",\n });\n element?.focus();\n }\n\n return () => {\n if (state.isFocus) {\n const element = document.getElementById(\n IdGenerator.getTableCellId(state.rowIndex, state.colIndex)\n );\n element?.style.setProperty(\"outline-style\", \"none\");\n }\n };\n }, [state]);\n\n return {\n state,\n actions,\n };\n}\n"],"names":["reducer","state","action","type","isFocus","rowIndex","payload","colIndex","__assign","_a","useReducer","dispatch","actions","useMemo","focus","unfocus","move","moveLeft","moveRight","moveUp","moveDown","useEffect","onClickOutOfTable","e","element","document","getElementById","ele","target","Node","contains","addEventListener","removeEventListener","IdGenerator","getTableCellId","style","setProperty","scrollIntoView","behavior","block","inline"],"mappings":"+HAIMA,EAAyB,SAACC,EAAOC,GACrC,OAAQA,EAAOC,MACb,IAAK,QACH,OAAIF,EAAMG,QACDH,EAGF,CACLG,SAAS,EACTC,SAAUH,EAAOI,QAAQD,SACzBE,SAAUL,EAAOI,QAAQC,UAE7B,IAAK,UACH,OAAKN,EAAMG,QAIJ,CACLA,SAAS,GAJFH,EAMX,IAAK,OACH,OAAKA,EAAMG,QAIJ,CACLA,SAAS,EACTC,SAAUH,EAAOI,QAAQD,SACzBE,SAAUL,EAAOI,QAAQC,UANlBN,EAQX,IAAK,WACH,OAAKA,EAAMG,QAKNI,WAAAA,EAAAA,SAAA,CAAA,EAAAP,IACHM,SAAUN,EAAMM,SAAW,IALpBN,EAOX,IAAK,YACH,OAAKA,EAAMG,QAKNI,WAAAA,EAAAA,SAAA,CAAA,EAAAP,IACHM,SAAUN,EAAMM,SAAW,IALpBN,EAOX,IAAK,SACH,OAAKA,EAAMG,QAKNI,WAAAA,EAAAA,SAAA,CAAA,EAAAP,IACHI,SAAUJ,EAAMI,SAAW,IALpBJ,EAOX,IAAK,WACH,OAAKA,EAAMG,QAKNI,WAAAA,EAAAA,SAAA,CAAA,EAAAP,IACHI,SAAUJ,EAAMI,SAAW,IALpBJ,EAQf,qCAGQ,IAAAQ,EAAoBC,EAAUA,WAACV,EAAS,CAC5CI,SAAS,IADJH,EAAKQ,EAAA,GAAEE,OAIRC,EAAUC,WACd,WAAM,MAAC,CACLC,MAAO,SAACT,EAAkBE,GACxBI,EAAS,CAAER,KAAM,QAASG,QAAS,CAAED,WAAUE,aAChD,EACDQ,QAAS,WACPJ,EAAS,CAAER,KAAM,WAClB,EACDa,KAAM,SAACX,EAAkBE,GACvBI,EAAS,CAAER,KAAM,OAAQG,QAAS,CAAED,WAAUE,aAC/C,EACDU,SAAU,WACRN,EAAS,CAAER,KAAM,YAClB,EACDe,UAAW,WACTP,EAAS,CAAER,KAAM,aAClB,EACDgB,OAAQ,WACNR,EAAS,CAAER,KAAM,UAClB,EACDiB,SAAU,WACRT,EAAS,CAAER,KAAM,YAClB,EArBG,GAuBN,IA8CF,OA3CAkB,EAAAA,WAAU,WACR,IAAMC,EAAoB,SAACC,GACzB,IAAMC,EAAUC,SAASC,eAAe,eAClCC,EAAMJ,EAAEK,OACVD,aAAeE,OAAQL,aAAA,EAAAA,EAASM,SAASH,KAC7Cf,EAAQG,SACV,EAIA,OAFAU,SAASM,iBAAiB,QAAST,GAE5B,WACLG,SAASO,oBAAoB,QAASV,EACxC,CACD,GAAE,IAEHD,EAAAA,WAAU,WACR,GAAIpB,EAAMG,QAAS,CACjB,IAAMoB,EAAUC,SAASC,eACvBO,cAAYC,eAAejC,EAAMI,SAAUJ,EAAMM,WAEnDiB,SAAAA,EAASW,MAAMC,YAAY,gBAAiB,SAC5CZ,SAAAA,EAASW,MAAMC,YAAY,gBAAiB,OAC5CZ,SAAAA,EAASW,MAAMC,YAAY,iBAAkB,QAC7CZ,SAAAA,EAASW,MAAMC,YAAY,gBAAiB,WAE5CZ,SAAAA,EAASa,eAAe,CACtBC,SAAU,SACVC,MAAO,UACPC,OAAQ,YAEVhB,SAAAA,EAASV,OACV,CAED,OAAO,WACL,GAAIb,EAAMG,QAAS,CACjB,IAAMoB,EAAUC,SAASC,eACvBO,cAAYC,eAAejC,EAAMI,SAAUJ,EAAMM,WAEnDiB,SAAAA,EAASW,MAAMC,YAAY,gBAAiB,OAC7C,CACH,CACF,GAAG,CAACnC,IAEG,CACLA,MAAKA,EACLW,QAAOA,EAEX"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var e=require("../../../node_modules/tslib/tslib.es6.js"),
|
|
1
|
+
"use strict";var e=require("../../../node_modules/tslib/tslib.es6.js"),t=require("react/jsx-runtime"),o=require("react"),n=require("./hooks.js"),u=o.createContext({isFocus:!1}),r=o.createContext({focus:function(){},unfocus:function(){},move:function(){},moveLeft:function(){},moveRight:function(){},moveUp:function(){},moveDown:function(){}});function s(){return o.useContext(u)}function i(){return o.useContext(r)}exports.FocusProvider=function(e){var o=n.useFocusReducer(),s=o.state,i=o.actions;return t.jsx(u.Provider,{value:s,children:t.jsx(r.Provider,{value:i,children:e.children})})},exports.useFocusActionContext=i,exports.useFocusContext=function(){return e.__assign(e.__assign({},s()),i())},exports.useFocusStateContext=s;
|
|
2
2
|
//# sourceMappingURL=provider.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"provider.js","sources":["../../../../../src/table/focus/provider.tsx"],"sourcesContent":["import { createContext, useContext
|
|
1
|
+
{"version":3,"file":"provider.js","sources":["../../../../../src/table/focus/provider.tsx"],"sourcesContent":["import { createContext, useContext } from \"react\";\nimport { TFocusActionContext, TFocusStateContext } from \"./types\";\nimport { useFocusReducer } from \"./hooks\";\n\nconst FocusStateContext = createContext<TFocusStateContext>({\n isFocus: false,\n});\n\nconst FocusActionContext = createContext<TFocusActionContext>({\n focus: () => {},\n unfocus: () => {},\n move: () => {},\n moveLeft: () => {},\n moveRight: () => {},\n moveUp: () => {},\n moveDown: () => {},\n});\n\nexport function FocusProvider(props: { children: React.ReactNode }) {\n const { state, actions } = useFocusReducer();\n\n return (\n <FocusStateContext.Provider value={state}>\n <FocusActionContext.Provider value={actions}>\n {props.children}\n </FocusActionContext.Provider>\n </FocusStateContext.Provider>\n );\n}\n\nexport function useFocusStateContext() {\n return useContext(FocusStateContext);\n}\n\nexport function useFocusActionContext() {\n return useContext(FocusActionContext);\n}\n\nexport function useFocusContext() {\n return { ...useFocusStateContext(), ...useFocusActionContext() };\n}\n"],"names":["FocusStateContext","createContext","isFocus","FocusActionContext","focus","unfocus","move","moveLeft","moveRight","moveUp","moveDown","useFocusStateContext","useContext","useFocusActionContext","props","_a","useFocusReducer","state","actions","_jsx","Provider","value","children","__assign"],"mappings":"iJAIMA,EAAoBC,EAAAA,cAAkC,CAC1DC,SAAS,IAGLC,EAAqBF,EAAAA,cAAmC,CAC5DG,MAAO,WAAQ,EACfC,QAAS,WAAQ,EACjBC,KAAM,WAAQ,EACdC,SAAU,WAAQ,EAClBC,UAAW,WAAQ,EACnBC,OAAQ,WAAQ,EAChBC,SAAU,WAAQ,aAeJC,IACd,OAAOC,EAAAA,WAAWZ,EACpB,UAEgBa,IACd,OAAOD,EAAAA,WAAWT,EACpB,uBAlBM,SAAwBW,GACtB,IAAAC,EAAqBC,EAAeA,kBAAlCC,EAAKF,EAAAE,MAAEC,EAAOH,EAAAG,QAEtB,OACEC,EAAAA,IAACnB,EAAkBoB,UAASC,MAAOJ,EAAKK,SACtCH,MAAChB,EAAmBiB,SAAQ,CAACC,MAAOH,EAAOI,SACxCR,EAAMQ,YAIf,qEAWE,OAAAC,EAAAA,SAAAA,EAAAA,SAAA,CAAA,EAAYZ,KAA2BE,IACzC"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";
|
|
1
|
+
"use strict";var e={getTableCellId:function(e,t){return"table-cell-".concat(e,"-").concat(t)},getCellIndex:function(e){var t=e.split("-");t[0],t[1];var r=t[2],n=t[3];return[Number(r),Number(n)]},getTableColId:function(e){return"table-col-".concat(e)}};exports.IdGenerator=e;
|
|
2
2
|
//# sourceMappingURL=id-generator.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"id-generator.js","sources":["../../../../../src/table/libs/id-generator.ts"],"sourcesContent":["export const IdGenerator = {\n getTableCellId: (rowIndex: number, columnIndex: number) =>\n `table-cell-${rowIndex}-${columnIndex}`,\n getTableColId: (columnIndex: number) => `table-col-${columnIndex}`,\n};\n"],"names":["getTableCellId","rowIndex","columnIndex","concat","getTableColId"],"mappings":"
|
|
1
|
+
{"version":3,"file":"id-generator.js","sources":["../../../../../src/table/libs/id-generator.ts"],"sourcesContent":["export const IdGenerator = {\n getTableCellId: (rowIndex: number, columnIndex: number) =>\n `table-cell-${rowIndex}-${columnIndex}`,\n getCellIndex: (id: string) => {\n const [_t, _c, rowIndex, columnIndex] = id.split(\"-\");\n return [Number(rowIndex), Number(columnIndex)];\n },\n getTableColId: (columnIndex: number) => `table-col-${columnIndex}`,\n};\n"],"names":["IdGenerator","getTableCellId","rowIndex","columnIndex","concat","getCellIndex","id","_a","split","Number","getTableColId"],"mappings":"aAAa,IAAAA,EAAc,CACzBC,eAAgB,SAACC,EAAkBC,GACjC,MAAA,cAAcC,OAAAF,EAAY,KAAAE,OAAAD,EAAa,EACzCE,aAAc,SAACC,GACP,IAAAC,EAAkCD,EAAGE,MAAM,eAAlC,IAAAN,OAAUC,OACzB,MAAO,CAACM,OAAOP,GAAWO,OAAON,GAClC,EACDO,cAAe,SAACP,GAAwB,MAAA,aAAaC,OAAAD,EAAa"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var e=require("react/jsx-runtime"),r=require("react"),
|
|
1
|
+
"use strict";var e=require("react/jsx-runtime"),r=require("react"),t=require("../focus/provider.js"),o=require("../checkbox/components.js"),i=require("../cell/ui/cell.js"),a=require("../libs/id-generator.js"),n=r.memo((function(r){var n=t.useFocusActionContext().unfocus,l=JSON.parse(r.dataString),c=r.conditionalFormattingString.split(",");return e.jsxs("tr",{className:"relative border border-gray-200 after:absolute after:w-full after:h-full after:top-0 after:left-0 after:pointer-events-none after:hover:bg-gray-500/10 ".concat(r.onClickRow?"hover:cursor-pointer":""," ").concat(r.applyRowFormatting?r.applyRowFormatting(l):""),onClick:function(e){e.preventDefault(),r.onClickRow&&(r.onClickRow(l),n())},"data-testid":l.id,children:[r.existCheckbox&&e.jsx("td",{children:e.jsx(o.Checkbox,{row:l})}),r.cols.map((function(t,o){var n;return e.jsx(i.TableCell,{id:a.IdGenerator.getTableCellId(r.rowIndex,o),row:l,isExistOnClickRow:!!r.onClickRow,cellFormatClassName:c[o],editable:null!==(n=t.editable)&&void 0!==n&&n},t.key)}))]})}));exports.Row=n;
|
|
2
2
|
//# sourceMappingURL=components.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"components.js","sources":["../../../../../src/table/sheet/components.tsx"],"sourcesContent":["import { memo } from \"react\";\nimport { useFocusActionContext } from \"../focus/provider\";\nimport { DataRecord, TTableColumn } from \"../table/type\";\nimport { Checkbox } from \"../checkbox/components\";\nimport { TableCell } from \"../cell/ui/cell\";\n\ninterface TPropsRow<T extends DataRecord> {\n dataString: string;\n cols: TTableColumn<T>[];\n existCheckbox?: boolean;\n rowIndex: number;\n conditionalFormattingString: string;\n onClickRow?: (row: any) => void;\n applyRowFormatting?: (row: any) => string;\n
|
|
1
|
+
{"version":3,"file":"components.js","sources":["../../../../../src/table/sheet/components.tsx"],"sourcesContent":["import { memo } from \"react\";\nimport { useFocusActionContext } from \"../focus/provider\";\nimport { DataRecord, TTableColumn } from \"../table/type\";\nimport { Checkbox } from \"../checkbox/components\";\nimport { TableCell } from \"../cell/ui/cell\";\nimport { IdGenerator } from \"../libs\";\n\ninterface TPropsRow<T extends DataRecord> {\n dataString: string;\n cols: TTableColumn<T>[];\n existCheckbox?: boolean;\n rowIndex: number;\n conditionalFormattingString: string;\n onClickRow?: (row: any) => void;\n applyRowFormatting?: (row: any) => string;\n}\n\nexport const Row = memo(function R<T extends DataRecord>(props: TPropsRow<T>) {\n const { unfocus } = useFocusActionContext();\n const row = JSON.parse(props.dataString);\n const conditionalFormatting = props.conditionalFormattingString.split(\",\");\n\n return (\n <tr\n className={`relative border border-gray-200 after:absolute after:w-full after:h-full after:top-0 after:left-0 after:pointer-events-none after:hover:bg-gray-500/10 ${\n !!props.onClickRow ? \"hover:cursor-pointer\" : \"\"\n } ${props.applyRowFormatting ? props.applyRowFormatting(row) : \"\"}`}\n onClick={(e) => {\n e.preventDefault();\n\n if (!!props.onClickRow) {\n props.onClickRow(row);\n unfocus();\n }\n }}\n data-testid={row.id}\n >\n {props.existCheckbox && (\n <td>\n <Checkbox row={row} />\n </td>\n )}\n {props.cols.map((col, j) => {\n return (\n <TableCell\n key={col.key as string}\n id={IdGenerator.getTableCellId(props.rowIndex, j)}\n row={row}\n isExistOnClickRow={!!props.onClickRow}\n cellFormatClassName={conditionalFormatting[j]}\n editable={col.editable ?? false}\n />\n );\n })}\n </tr>\n );\n});\n"],"names":["Row","memo","props","unfocus","useFocusActionContext","row","JSON","parse","dataString","conditionalFormatting","conditionalFormattingString","split","_jsxs","className","concat","onClickRow","applyRowFormatting","onClick","e","preventDefault","id","children","existCheckbox","_jsx","jsx","Checkbox","cols","map","col","j","TableCell","IdGenerator","getTableCellId","rowIndex","isExistOnClickRow","cellFormatClassName","editable","_a","key"],"mappings":"iNAiBaA,EAAMC,EAAIA,MAAC,SAAiCC,GAC/C,IAAAC,EAAYC,kCACdC,EAAMC,KAAKC,MAAML,EAAMM,YACvBC,EAAwBP,EAAMQ,4BAA4BC,MAAM,KAEtE,OACEC,OACE,KAAA,CAAAC,UAAW,0JACTC,OAAEZ,EAAMa,WAAa,uBAAyB,GAC5C,KAAAD,OAAAZ,EAAMc,mBAAqBd,EAAMc,mBAAmBX,GAAO,IAC/DY,QAAS,SAACC,GACRA,EAAEC,iBAEIjB,EAAMa,aACVb,EAAMa,WAAWV,GACjBF,IAEH,EACY,cAAAE,EAAIe,GAEhBC,SAAA,CAAAnB,EAAMoB,eACLC,EACEC,IAAA,KAAA,CAAAH,SAAAE,EAAAA,IAACE,EAAQA,SAAC,CAAApB,IAAKA,MAGlBH,EAAMwB,KAAKC,KAAI,SAACC,EAAKC,SACpB,OACEN,EAAAA,IAACO,EAAAA,UAAS,CAERV,GAAIW,EAAWA,YAACC,eAAe9B,EAAM+B,SAAUJ,GAC/CxB,IAAKA,EACL6B,oBAAqBhC,EAAMa,WAC3BoB,oBAAqB1B,EAAsBoB,GAC3CO,SAAsB,UAAZR,EAAIQ,gBAAQ,IAAAC,GAAAA,GALjBT,EAAIU,UAWrB"}
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
"use strict";var e=require("../../../node_modules/tslib/tslib.es6.js"),r=require("react/jsx-runtime"),o=require("./hook.js"),i=require("../header/header.js"),t=require("../pagenation/providers.js"),s=require("../pagenation/components.js"),n=require("../filter/provider.js"),l=require("../filter/components.js");require("../sort/icon.js");var a=require("../sort/provider.js"),d=require("../sheet/providers.js"),c=require("../focus/provider.js"),u=require("../checkbox/provider.js"),x=require("../checkbox/components.js"),j=require("../libs/id-generator.js"),h=require("../edit/provider.js"),p=require("../table-property/provider.js"),g=require("../operation/components/keyboard-setting.js"),m=require("../sheet/components.js"),v=require("../paste/provider.js"),b=require("../libs/conditional-formatting.js"),w=require("../edit/ui/editor.js"),f=require("../filter/hooks/selectedFilteringColumn/provider.js");function q(e){var t=o.useTable(e),n=t.cols,a=t.rowMaps,d=t.pageRowIds,c=f.useFilteringColumnStateContext(),u=v.usePasteActionContext().onPaste;return r.jsxs("div",{className:"w-full",children:[r.jsx("div",{className:"flex justify-end mb-1 mr-3",children:r.jsx(l.TableFilterRemoveButton,{children:r.jsx("p",{className:"text-xs underline text-gray-500 hover:text-gray-700",children:"全てのフィルタリング条件を解除する"})})}),r.jsxs("div",{id:"table-frame",className:"relative h-full max-w-full max-h-[80vh] border border-gray-200 rounded-md overflow-auto",children:[r.jsx(w.Editor,{rowMaps:a,pageRowIds:d}),r.jsxs("table",{className:"table",onPaste:function(e){e.preventDefault();var r=e.clipboardData.getData("Text");u(r.replace(/\t/g,",").trim().replace(/\r\n/g,"\n").split("\n").map((function(e){return e.split(",")})))},children:[r.jsx("thead",{children:r.jsxs("tr",{className:"sticky top-0 border-gray-200 z-20 bg-gray-200 text-gray-600 h-[32px]",children:[e.checkbox&&r.jsx("th",{children:r.jsx(x.AllCheckbox,{rows:e.rows})}),n.map((function(e,o){return r.jsx(i.TableHeaderElement,{id:j.IdGenerator.getTableColId(o),col:e},e.key.toString())}))]})}),r.jsxs("tbody",{children:[!!c&&r.jsx("tr",{children:r.jsx("td",{colSpan:n.length,className:"sticky top-8 left-0 bg-gray-300 w-full shadow-lg rounded-b-2xl z-20 p-0 overflow-hidden",children:r.jsx(l.TableFilterForm,{})})}),0===d.length&&r.jsx("tr",{children:r.jsx("td",{colSpan:n.length,className:"py-5",children:r.jsx("p",{className:"text-center font-bold text-lg",children:"NO DATA"})})}),d.map((function(o,i){return r.jsx(m.Row,{existCheckbox:!!e.checkbox,rowIndex:i,dataString:a[o].stringValue,cols:e.cols,onClickRow:e.onClickRow,applyRowFormatting:e.applyRowFormatting,conditionalFormattingString:b.generateFormattingString(a[o].data,n,e.conditionalFormattings)
|
|
2
|
+
"use strict";var e=require("../../../node_modules/tslib/tslib.es6.js"),r=require("react/jsx-runtime"),o=require("./hook.js"),i=require("../header/header.js"),t=require("../pagenation/providers.js"),s=require("../pagenation/components.js"),n=require("../filter/provider.js"),l=require("../filter/components.js");require("../sort/icon.js");var a=require("../sort/provider.js"),d=require("../sheet/providers.js"),c=require("../focus/provider.js"),u=require("../checkbox/provider.js"),x=require("../checkbox/components.js"),j=require("../libs/id-generator.js"),h=require("../edit/provider.js"),p=require("../table-property/provider.js"),g=require("../operation/components/keyboard-setting.js"),m=require("../sheet/components.js"),v=require("../paste/provider.js"),b=require("../libs/conditional-formatting.js"),w=require("../edit/ui/editor.js"),f=require("../filter/hooks/selectedFilteringColumn/provider.js");function q(e){var t=o.useTable(e),n=t.cols,a=t.rowMaps,d=t.pageRowIds,c=f.useFilteringColumnStateContext(),u=v.usePasteActionContext().onPaste;return r.jsxs("div",{className:"w-full",children:[r.jsx("div",{className:"flex justify-end mb-1 mr-3",children:r.jsx(l.TableFilterRemoveButton,{children:r.jsx("p",{className:"text-xs underline text-gray-500 hover:text-gray-700",children:"全てのフィルタリング条件を解除する"})})}),r.jsxs("div",{id:"table-frame",className:"relative h-full max-w-full max-h-[80vh] border border-gray-200 rounded-md overflow-auto",children:[r.jsx(w.Editor,{rowMaps:a,pageRowIds:d}),r.jsxs("table",{className:"table",onPaste:function(e){e.preventDefault();var r=e.clipboardData.getData("Text");u(r.replace(/\t/g,",").trim().replace(/\r\n/g,"\n").split("\n").map((function(e){return e.split(",")})))},children:[r.jsx("thead",{children:r.jsxs("tr",{className:"sticky top-0 border-gray-200 z-20 bg-gray-200 text-gray-600 h-[32px]",children:[e.checkbox&&r.jsx("th",{children:r.jsx(x.AllCheckbox,{rows:e.rows})}),n.map((function(e,o){return r.jsx(i.TableHeaderElement,{id:j.IdGenerator.getTableColId(o),col:e},e.key.toString())}))]})}),r.jsxs("tbody",{children:[!!c&&r.jsx("tr",{children:r.jsx("td",{colSpan:n.length,className:"sticky top-8 left-0 bg-gray-300 w-full shadow-lg rounded-b-2xl z-20 p-0 overflow-hidden",children:r.jsx(l.TableFilterForm,{})})}),0===d.length&&r.jsx("tr",{children:r.jsx("td",{colSpan:n.length,className:"py-5",children:r.jsx("p",{className:"text-center font-bold text-lg",children:"NO DATA"})})}),d.map((function(o,i){return r.jsx(m.Row,{existCheckbox:!!e.checkbox,rowIndex:i,dataString:a[o].stringValue,cols:e.cols,onClickRow:e.onClickRow,applyRowFormatting:e.applyRowFormatting,conditionalFormattingString:b.generateFormattingString(a[o].data,n,e.conditionalFormattings)},o)}))]})]})]}),r.jsxs("div",{className:"mt-1",children:[r.jsx(s.DisplayRange,{}),r.jsx("div",{className:"mt-2",children:r.jsx(s.Pagenation,{})})]})]})}module.exports=function(o){var i,s,l;return r.jsx(n.FilterProvider,{children:r.jsx(a.SortProvider,{initialCondition:null===(i=o.initialCondition)||void 0===i?void 0:i.sort,children:r.jsx(t.PagenationProvider,{rowCount:o.rows.length,perPage:null===(l=null===(s=o.initialCondition)||void 0===s?void 0:s.pagenation)||void 0===l?void 0:l.rowCountPerPage,children:r.jsx(u.CheckboxProvider,{checkbox:o.checkbox,children:r.jsx(u.CheckboxStatusProvider,{checkboxCount:o.rows.length,children:r.jsx(d.ColumnsProvider,{cols:o.cols,errorHandler:o.errorHandler,children:r.jsx(c.FocusProvider,{children:r.jsx(h.EditProvider,{children:r.jsx(p.TablePropertyProvider,{children:r.jsxs(v.PasteProvider,{rows:o.rows,cols:o.cols,onUpdateRowFunction:o.onUpdateRow,children:[r.jsx(g.KeyboardSetting,{}),r.jsx(q,e.__assign({},o))]})})})})})})})})})})};
|
|
3
3
|
//# sourceMappingURL=base.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{useMemo as e
|
|
1
|
+
import{useMemo as e}from"react";import{useEditActionContext as o}from"../edit/provider.js";import{useFocusActionContext as t}from"../focus/provider.js";import{useColumnsContext as r}from"../sheet/providers.js";import{IdGenerator as n}from"../libs/id-generator.js";function i(i,l){var p,d,u=t(),f=u.move,a=u.focus,c=o().startEditing,m=n.getCellIndex(i),s=m[0],v=m[1],b=r()[v],g=l[b.key],j="select"===b.type?null===(d=null===(p=b.options)||void 0===p?void 0:p.find((function(e){return e.value===g})))||void 0===d?void 0:d.label:g,y=e((function(){return b.editable?j:b.render?b.render(g,l):j}),[b.editable,j,g,l]);return{type:!b.editable&&b.render?"component":b.type,component:y,onClickCell:function(e){e.preventDefault(),e.stopPropagation(),a(s,v),f(s,v)},onDoubleClick:function(e){e.preventDefault(),a(s,v),f(s,v),c()}}}export{i as useCell};
|
|
2
2
|
//# sourceMappingURL=hooks.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"hooks.js","sources":["../../../../../src/table/cell/hooks.ts"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"file":"hooks.js","sources":["../../../../../src/table/cell/hooks.ts"],"sourcesContent":["import { useMemo } from \"react\";\nimport { useEditActionContext } from \"../edit/provider\";\nimport { useFocusActionContext } from \"../focus/provider\";\nimport { useColumnsContext } from \"../sheet/providers\";\nimport { DataObject, DataRecord, TColumnType } from \"../table/type\";\nimport { IdGenerator } from \"../libs\";\n\nexport function useCell(id: string, row: DataObject<DataRecord>) {\n const { move, focus } = useFocusActionContext();\n const { startEditing } = useEditActionContext();\n const [rowIndex, colIndex] = IdGenerator.getCellIndex(id);\n const col = useColumnsContext()[colIndex];\n const value = row[col.key as string];\n\n const label =\n col.type === \"select\"\n ? col.options?.find((op) => op.value === value)?.label\n : value;\n\n const component = useMemo(() => {\n if (col.editable) {\n return label;\n } else {\n return col.render ? col.render(value as never, row) : label;\n }\n }, [col.editable, label, value, row]);\n\n const type: TColumnType | \"component\" =\n !col.editable && col.render ? \"component\" : col.type;\n\n const onDoubleClick: React.MouseEventHandler<HTMLDivElement> = (e) => {\n e.preventDefault();\n focus(rowIndex, colIndex);\n move(rowIndex, colIndex);\n startEditing();\n };\n\n const onClickCell: React.MouseEventHandler<HTMLDivElement> = (e) => {\n e.preventDefault();\n e.stopPropagation();\n focus(rowIndex, colIndex);\n move(rowIndex, colIndex);\n };\n\n return {\n type,\n component,\n onClickCell,\n onDoubleClick,\n };\n}\n"],"names":["useCell","id","row","_c","useFocusActionContext","move","focus","startEditing","useEditActionContext","_d","IdGenerator","getCellIndex","rowIndex","colIndex","col","useColumnsContext","value","key","label","type","_a","options","find","op","_b","component","useMemo","editable","render","onClickCell","e","preventDefault","stopPropagation","onDoubleClick"],"mappings":"wQAOgB,SAAAA,EAAQC,EAAYC,WAC5BC,EAAkBC,IAAhBC,EAAIF,EAAAE,KAAEC,EAAKH,EAAAG,MACXC,EAAiBC,iBACnBC,EAAuBC,EAAYC,aAAaV,GAA/CW,EAAQH,EAAA,GAAEI,OACXC,EAAMC,IAAoBF,GAC1BG,EAAQd,EAAIY,EAAIG,KAEhBC,EACS,WAAbJ,EAAIK,KAC6C,UAAlC,QAAXC,EAAAN,EAAIO,eAAO,IAAAD,OAAA,EAAAA,EAAEE,MAAK,SAACC,GAAO,OAAAA,EAAGP,QAAUA,CAAb,WAAmB,IAAAQ,OAAA,EAAAA,EAAEN,MAC/CF,EAEAS,EAAYC,GAAQ,WACxB,OAAIZ,EAAIa,SACCT,EAEAJ,EAAIc,OAASd,EAAIc,OAAOZ,EAAgBd,GAAOgB,CAE1D,GAAG,CAACJ,EAAIa,SAAUT,EAAOF,EAAOd,IAmBhC,MAAO,CACLiB,MAjBCL,EAAIa,UAAYb,EAAIc,OAAS,YAAcd,EAAIK,KAkBhDM,UAASA,EACTI,YAV2D,SAACC,GAC5DA,EAAEC,iBACFD,EAAEE,kBACF1B,EAAMM,EAAUC,GAChBR,EAAKO,EAAUC,EACjB,EAMEoB,cAlB6D,SAACH,GAC9DA,EAAEC,iBACFzB,EAAMM,EAAUC,GAChBR,EAAKO,EAAUC,GACfN,GACF,EAeF"}
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import{jsx as e,jsxs as
|
|
2
|
+
import{jsx as e,jsxs as i}from"react/jsx-runtime";import{lazy as o,Suspense as l}from"react";import{useCell as t}from"../hooks.js";var c=o((function(){return import("./edit-button.js")}));function n(o){var n=t(o.id,o.row),r=n.type,a=n.component,s=n.onClickCell,d=n.onDoubleClick;return e("td",{id:o.id,className:"".concat(o.cellFormatClassName),onClick:o.isExistOnClickRow?void 0:s,onDoubleClick:o.isExistOnClickRow?void 0:d,children:i("div",{className:"flex items-center gap-3 w-fit p-2 cursor-default",onClick:s,children:["component"===r?a:e("div",{onDoubleClick:d,children:e("p",{className:"cell-data text-left whitespace-nowrap",children:a})}),e(l,{fallback:null,children:o.editable&&e(c,{})})]})})}export{n as TableCell};
|
|
3
3
|
//# sourceMappingURL=cell.js.map
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import{jsx as r}from"react/jsx-runtime";import{memo as t}from"react";import{useEditActionContext as i}from"../../edit/provider.js";import{EditIcon as
|
|
2
|
+
import{jsx as r}from"react/jsx-runtime";import{memo as t}from"react";import{useEditActionContext as i}from"../../edit/provider.js";import{EditIcon as e}from"../../../icon/edit-icon.js";var o=t((function(){var t=i().startEditing;return r("button",{className:"w-fit h-fit p-1 rounded-full text-gray-500 hover:bg-gray-200",onClick:function(r){r.preventDefault(),t()},children:r(e,{size:12})})}));export{o as default};
|
|
3
3
|
//# sourceMappingURL=edit-button.js.map
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import{jsx as e,Fragment as t,jsxs as n}from"react/jsx-runtime";import{useState as o}from"react";import{useEditActionContext as
|
|
2
|
+
import{jsx as e,Fragment as t,jsxs as n}from"react/jsx-runtime";import{useState as o,useRef as r,useEffect as l}from"react";import{useEditActionContext as i}from"../provider.js";import{CancelIcon as u}from"../../../icon/cancel-icon.js";function a(a){var c=a.col,f=i().endEditing,p=a.row[c.key],s=o(p),m=s[0],v=s[1],y=r(null);l((function(){y.current&&y.current.focus()}),[y]);return c.editable?n("div",{className:"flex justify-between gap-1 w-full items-center",children:[n("select",{ref:y,className:"w-full py-1 px-2 bg-white text-gray-900",value:m,onChange:function(e){e.preventDefault(),v(e.target.value)},onBlur:function(e){e.preventDefault(),m!==p?function(e){c.editable&&c.onCellBlur(c.key,e,a.row,f)}(m):f()},onKeyDown:function(e){"Enter"===e.key&&e.preventDefault()},onKeyUp:function(e){e.preventDefault(),"Enter"===e.key?e.target.blur():"Escape"===e.key&&(v(p),f())},children:[c.allowEmpty&&e("option",{value:"",children:""==p?"-- 未選択 --":"-- 選択解除 --"},"TEPPEN/ReactUI Empty Option"),c.options.map((function(t){return e("option",{value:t.value,children:t.label},t.value)}))]}),e("button",{onMouseDown:function(e){e.preventDefault(),e.stopPropagation(),setTimeout((function(){v(p),f()}),300)},children:e(u,{size:16})})]}):e(t,{})}export{a as SelectCellInput};
|
|
3
3
|
//# sourceMappingURL=select-input.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{__assign as e}from"../../../node_modules/tslib/tslib.es6.js";import{useReducer as o,
|
|
1
|
+
import{__assign as e}from"../../../node_modules/tslib/tslib.es6.js";import{useReducer as o,useMemo as n,useEffect as t}from"react";import{IdGenerator as c}from"../libs/id-generator.js";var s=function(o,n){switch(n.type){case"focus":return o.isFocus?o:{isFocus:!0,rowIndex:n.payload.rowIndex,colIndex:n.payload.colIndex};case"unfocus":return o.isFocus?{isFocus:!1}:o;case"move":return o.isFocus?{isFocus:!0,rowIndex:n.payload.rowIndex,colIndex:n.payload.colIndex}:o;case"moveLeft":return o.isFocus?e(e({},o),{colIndex:o.colIndex-1}):o;case"moveRight":return o.isFocus?e(e({},o),{colIndex:o.colIndex+1}):o;case"moveUp":return o.isFocus?e(e({},o),{rowIndex:o.rowIndex-1}):o;case"moveDown":return o.isFocus?e(e({},o),{rowIndex:o.rowIndex+1}):o}};function r(){var e=o(s,{isFocus:!1}),r=e[0],u=e[1],l=n((function(){return{focus:function(e,o){u({type:"focus",payload:{rowIndex:e,colIndex:o}})},unfocus:function(){u({type:"unfocus"})},move:function(e,o){u({type:"move",payload:{rowIndex:e,colIndex:o}})},moveLeft:function(){u({type:"moveLeft"})},moveRight:function(){u({type:"moveRight"})},moveUp:function(){u({type:"moveUp"})},moveDown:function(){u({type:"moveDown"})}}}),[]);return t((function(){var e=function(e){var o=document.getElementById("table-frame"),n=e.target;n instanceof Node&&(null==o?void 0:o.contains(n))||l.unfocus()};return document.addEventListener("click",e),function(){document.removeEventListener("click",e)}}),[]),t((function(){if(r.isFocus){var e=document.getElementById(c.getTableCellId(r.rowIndex,r.colIndex));null==e||e.style.setProperty("outline-style","solid"),null==e||e.style.setProperty("outline-width","1px"),null==e||e.style.setProperty("outline-offset","-1px"),null==e||e.style.setProperty("outline-color","#9ca3af"),null==e||e.scrollIntoView({behavior:"smooth",block:"nearest",inline:"nearest"}),null==e||e.focus()}return function(){if(r.isFocus){var e=document.getElementById(c.getTableCellId(r.rowIndex,r.colIndex));null==e||e.style.setProperty("outline-style","none")}}}),[r]),{state:r,actions:l}}export{r as useFocusReducer};
|
|
2
2
|
//# sourceMappingURL=hooks.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"hooks.js","sources":["../../../../../src/table/focus/hooks.ts"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"file":"hooks.js","sources":["../../../../../src/table/focus/hooks.ts"],"sourcesContent":["import { useEffect, useMemo, useReducer } from \"react\";\nimport { TFocusReducer, TReturnFocusReducer } from \"./types\";\nimport { IdGenerator } from \"../libs\";\n\nconst reducer: TFocusReducer = (state, action) => {\n switch (action.type) {\n case \"focus\":\n if (state.isFocus) {\n return state;\n }\n\n return {\n isFocus: true,\n rowIndex: action.payload.rowIndex,\n colIndex: action.payload.colIndex,\n };\n case \"unfocus\":\n if (!state.isFocus) {\n return state;\n }\n\n return {\n isFocus: false,\n };\n case \"move\":\n if (!state.isFocus) {\n return state;\n }\n\n return {\n isFocus: true,\n rowIndex: action.payload.rowIndex,\n colIndex: action.payload.colIndex,\n };\n case \"moveLeft\":\n if (!state.isFocus) {\n return state;\n }\n\n return {\n ...state,\n colIndex: state.colIndex - 1,\n };\n case \"moveRight\":\n if (!state.isFocus) {\n return state;\n }\n\n return {\n ...state,\n colIndex: state.colIndex + 1,\n };\n case \"moveUp\":\n if (!state.isFocus) {\n return state;\n }\n\n return {\n ...state,\n rowIndex: state.rowIndex - 1,\n };\n case \"moveDown\":\n if (!state.isFocus) {\n return state;\n }\n\n return {\n ...state,\n rowIndex: state.rowIndex + 1,\n };\n }\n};\n\nexport function useFocusReducer(): TReturnFocusReducer {\n const [state, dispatch] = useReducer(reducer, {\n isFocus: false,\n });\n\n const actions = useMemo(\n () => ({\n focus: (rowIndex: number, colIndex: number) => {\n dispatch({ type: \"focus\", payload: { rowIndex, colIndex } });\n },\n unfocus: () => {\n dispatch({ type: \"unfocus\" });\n },\n move: (rowIndex: number, colIndex: number) => {\n dispatch({ type: \"move\", payload: { rowIndex, colIndex } });\n },\n moveLeft: () => {\n dispatch({ type: \"moveLeft\" });\n },\n moveRight: () => {\n dispatch({ type: \"moveRight\" });\n },\n moveUp: () => {\n dispatch({ type: \"moveUp\" });\n },\n moveDown: () => {\n dispatch({ type: \"moveDown\" });\n },\n }),\n []\n );\n\n useEffect(() => {\n const onClickOutOfTable = (e: MouseEvent) => {\n const element = document.getElementById(\"table-frame\");\n const ele = e.target;\n if (ele instanceof Node && element?.contains(ele)) return;\n actions.unfocus();\n };\n\n document.addEventListener(\"click\", onClickOutOfTable);\n\n return () => {\n document.removeEventListener(\"click\", onClickOutOfTable);\n };\n }, []);\n\n useEffect(() => {\n if (state.isFocus) {\n const element = document.getElementById(\n IdGenerator.getTableCellId(state.rowIndex, state.colIndex)\n );\n element?.style.setProperty(\"outline-style\", \"solid\");\n element?.style.setProperty(\"outline-width\", \"1px\");\n element?.style.setProperty(\"outline-offset\", \"-1px\");\n element?.style.setProperty(\"outline-color\", \"#9ca3af\");\n\n element?.scrollIntoView({\n behavior: \"smooth\",\n block: \"nearest\",\n inline: \"nearest\",\n });\n element?.focus();\n }\n\n return () => {\n if (state.isFocus) {\n const element = document.getElementById(\n IdGenerator.getTableCellId(state.rowIndex, state.colIndex)\n );\n element?.style.setProperty(\"outline-style\", \"none\");\n }\n };\n }, [state]);\n\n return {\n state,\n actions,\n };\n}\n"],"names":["reducer","state","action","type","isFocus","rowIndex","payload","colIndex","__assign","useFocusReducer","_a","useReducer","dispatch","actions","useMemo","focus","unfocus","move","moveLeft","moveRight","moveUp","moveDown","useEffect","onClickOutOfTable","e","element","document","getElementById","ele","target","Node","contains","addEventListener","removeEventListener","IdGenerator","getTableCellId","style","setProperty","scrollIntoView","behavior","block","inline"],"mappings":"yLAIA,IAAMA,EAAyB,SAACC,EAAOC,GACrC,OAAQA,EAAOC,MACb,IAAK,QACH,OAAIF,EAAMG,QACDH,EAGF,CACLG,SAAS,EACTC,SAAUH,EAAOI,QAAQD,SACzBE,SAAUL,EAAOI,QAAQC,UAE7B,IAAK,UACH,OAAKN,EAAMG,QAIJ,CACLA,SAAS,GAJFH,EAMX,IAAK,OACH,OAAKA,EAAMG,QAIJ,CACLA,SAAS,EACTC,SAAUH,EAAOI,QAAQD,SACzBE,SAAUL,EAAOI,QAAQC,UANlBN,EAQX,IAAK,WACH,OAAKA,EAAMG,QAKNI,EAAAA,EAAA,CAAA,EAAAP,IACHM,SAAUN,EAAMM,SAAW,IALpBN,EAOX,IAAK,YACH,OAAKA,EAAMG,QAKNI,EAAAA,EAAA,CAAA,EAAAP,IACHM,SAAUN,EAAMM,SAAW,IALpBN,EAOX,IAAK,SACH,OAAKA,EAAMG,QAKNI,EAAAA,EAAA,CAAA,EAAAP,IACHI,SAAUJ,EAAMI,SAAW,IALpBJ,EAOX,IAAK,WACH,OAAKA,EAAMG,QAKNI,EAAAA,EAAA,CAAA,EAAAP,IACHI,SAAUJ,EAAMI,SAAW,IALpBJ,EAQf,WAEgBQ,IACR,IAAAC,EAAoBC,EAAWX,EAAS,CAC5CI,SAAS,IADJH,EAAKS,EAAA,GAAEE,OAIRC,EAAUC,GACd,WAAM,MAAC,CACLC,MAAO,SAACV,EAAkBE,GACxBK,EAAS,CAAET,KAAM,QAASG,QAAS,CAAED,WAAUE,aAChD,EACDS,QAAS,WACPJ,EAAS,CAAET,KAAM,WAClB,EACDc,KAAM,SAACZ,EAAkBE,GACvBK,EAAS,CAAET,KAAM,OAAQG,QAAS,CAAED,WAAUE,aAC/C,EACDW,SAAU,WACRN,EAAS,CAAET,KAAM,YAClB,EACDgB,UAAW,WACTP,EAAS,CAAET,KAAM,aAClB,EACDiB,OAAQ,WACNR,EAAS,CAAET,KAAM,UAClB,EACDkB,SAAU,WACRT,EAAS,CAAET,KAAM,YAClB,EArBG,GAuBN,IA8CF,OA3CAmB,GAAU,WACR,IAAMC,EAAoB,SAACC,GACzB,IAAMC,EAAUC,SAASC,eAAe,eAClCC,EAAMJ,EAAEK,OACVD,aAAeE,OAAQL,aAAA,EAAAA,EAASM,SAASH,KAC7Cf,EAAQG,SACV,EAIA,OAFAU,SAASM,iBAAiB,QAAST,GAE5B,WACLG,SAASO,oBAAoB,QAASV,EACxC,CACD,GAAE,IAEHD,GAAU,WACR,GAAIrB,EAAMG,QAAS,CACjB,IAAMqB,EAAUC,SAASC,eACvBO,EAAYC,eAAelC,EAAMI,SAAUJ,EAAMM,WAEnDkB,SAAAA,EAASW,MAAMC,YAAY,gBAAiB,SAC5CZ,SAAAA,EAASW,MAAMC,YAAY,gBAAiB,OAC5CZ,SAAAA,EAASW,MAAMC,YAAY,iBAAkB,QAC7CZ,SAAAA,EAASW,MAAMC,YAAY,gBAAiB,WAE5CZ,SAAAA,EAASa,eAAe,CACtBC,SAAU,SACVC,MAAO,UACPC,OAAQ,YAEVhB,SAAAA,EAASV,OACV,CAED,OAAO,WACL,GAAId,EAAMG,QAAS,CACjB,IAAMqB,EAAUC,SAASC,eACvBO,EAAYC,eAAelC,EAAMI,SAAUJ,EAAMM,WAEnDkB,SAAAA,EAASW,MAAMC,YAAY,gBAAiB,OAC7C,CACH,CACF,GAAG,CAACpC,IAEG,CACLA,MAAKA,EACLY,QAAOA,EAEX"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{__assign as o}from"../../../node_modules/tslib/tslib.es6.js";import{jsx as n}from"react/jsx-runtime";import{createContext as
|
|
1
|
+
import{__assign as o}from"../../../node_modules/tslib/tslib.es6.js";import{jsx as n}from"react/jsx-runtime";import{createContext as t,useContext as r}from"react";import{useFocusReducer as i}from"./hooks.js";var e=t({isFocus:!1}),u=t({focus:function(){},unfocus:function(){},move:function(){},moveLeft:function(){},moveRight:function(){},moveUp:function(){},moveDown:function(){}});function c(o){var t=i(),r=t.state,c=t.actions;return n(e.Provider,{value:r,children:n(u.Provider,{value:c,children:o.children})})}function f(){return r(e)}function m(){return r(u)}function s(){return o(o({},f()),m())}export{c as FocusProvider,m as useFocusActionContext,s as useFocusContext,f as useFocusStateContext};
|
|
2
2
|
//# sourceMappingURL=provider.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"provider.js","sources":["../../../../../src/table/focus/provider.tsx"],"sourcesContent":["import { createContext, useContext
|
|
1
|
+
{"version":3,"file":"provider.js","sources":["../../../../../src/table/focus/provider.tsx"],"sourcesContent":["import { createContext, useContext } from \"react\";\nimport { TFocusActionContext, TFocusStateContext } from \"./types\";\nimport { useFocusReducer } from \"./hooks\";\n\nconst FocusStateContext = createContext<TFocusStateContext>({\n isFocus: false,\n});\n\nconst FocusActionContext = createContext<TFocusActionContext>({\n focus: () => {},\n unfocus: () => {},\n move: () => {},\n moveLeft: () => {},\n moveRight: () => {},\n moveUp: () => {},\n moveDown: () => {},\n});\n\nexport function FocusProvider(props: { children: React.ReactNode }) {\n const { state, actions } = useFocusReducer();\n\n return (\n <FocusStateContext.Provider value={state}>\n <FocusActionContext.Provider value={actions}>\n {props.children}\n </FocusActionContext.Provider>\n </FocusStateContext.Provider>\n );\n}\n\nexport function useFocusStateContext() {\n return useContext(FocusStateContext);\n}\n\nexport function useFocusActionContext() {\n return useContext(FocusActionContext);\n}\n\nexport function useFocusContext() {\n return { ...useFocusStateContext(), ...useFocusActionContext() };\n}\n"],"names":["FocusStateContext","createContext","isFocus","FocusActionContext","focus","unfocus","move","moveLeft","moveRight","moveUp","moveDown","FocusProvider","props","_a","useFocusReducer","state","actions","_jsx","Provider","value","children","useFocusStateContext","useContext","useFocusActionContext","useFocusContext","__assign"],"mappings":"+MAIA,IAAMA,EAAoBC,EAAkC,CAC1DC,SAAS,IAGLC,EAAqBF,EAAmC,CAC5DG,MAAO,WAAQ,EACfC,QAAS,WAAQ,EACjBC,KAAM,WAAQ,EACdC,SAAU,WAAQ,EAClBC,UAAW,WAAQ,EACnBC,OAAQ,WAAQ,EAChBC,SAAU,WAAQ,IAGd,SAAUC,EAAcC,GACtB,IAAAC,EAAqBC,IAAnBC,EAAKF,EAAAE,MAAEC,EAAOH,EAAAG,QAEtB,OACEC,EAACjB,EAAkBkB,UAASC,MAAOJ,EAAKK,SACtCH,EAACd,EAAmBe,SAAQ,CAACC,MAAOH,EAAOI,SACxCR,EAAMQ,YAIf,UAEgBC,IACd,OAAOC,EAAWtB,EACpB,UAEgBuB,IACd,OAAOD,EAAWnB,EACpB,UAEgBqB,IACd,OAAAC,EAAAA,EAAA,CAAA,EAAYJ,KAA2BE,IACzC"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
var
|
|
1
|
+
var e={getTableCellId:function(e,t){return"table-cell-".concat(e,"-").concat(t)},getCellIndex:function(e){var t=e.split("-");t[0],t[1];var l=t[2],n=t[3];return[Number(l),Number(n)]},getTableColId:function(e){return"table-col-".concat(e)}};export{e as IdGenerator};
|
|
2
2
|
//# sourceMappingURL=id-generator.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"id-generator.js","sources":["../../../../../src/table/libs/id-generator.ts"],"sourcesContent":["export const IdGenerator = {\n getTableCellId: (rowIndex: number, columnIndex: number) =>\n `table-cell-${rowIndex}-${columnIndex}`,\n getTableColId: (columnIndex: number) => `table-col-${columnIndex}`,\n};\n"],"names":["IdGenerator","getTableCellId","rowIndex","columnIndex","concat","getTableColId"],"mappings":"AAAa,IAAAA,EAAc,CACzBC,eAAgB,SAACC,EAAkBC,GACjC,MAAA,cAAcC,OAAAF,EAAY,KAAAE,OAAAD,EAAa,EACzCE,cAAe,
|
|
1
|
+
{"version":3,"file":"id-generator.js","sources":["../../../../../src/table/libs/id-generator.ts"],"sourcesContent":["export const IdGenerator = {\n getTableCellId: (rowIndex: number, columnIndex: number) =>\n `table-cell-${rowIndex}-${columnIndex}`,\n getCellIndex: (id: string) => {\n const [_t, _c, rowIndex, columnIndex] = id.split(\"-\");\n return [Number(rowIndex), Number(columnIndex)];\n },\n getTableColId: (columnIndex: number) => `table-col-${columnIndex}`,\n};\n"],"names":["IdGenerator","getTableCellId","rowIndex","columnIndex","concat","getCellIndex","id","_a","split","Number","getTableColId"],"mappings":"AAAa,IAAAA,EAAc,CACzBC,eAAgB,SAACC,EAAkBC,GACjC,MAAA,cAAcC,OAAAF,EAAY,KAAAE,OAAAD,EAAa,EACzCE,aAAc,SAACC,GACP,IAAAC,EAAkCD,EAAGE,MAAM,eAAlC,IAAAN,OAAUC,OACzB,MAAO,CAACM,OAAOP,GAAWO,OAAON,GAClC,EACDO,cAAe,SAACP,GAAwB,MAAA,aAAaC,OAAAD,EAAa"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsxs as
|
|
1
|
+
import{jsxs as r,jsx as o}from"react/jsx-runtime";import{memo as t}from"react";import{useFocusActionContext as e}from"../focus/provider.js";import{Checkbox as i}from"../checkbox/components.js";import{TableCell as a}from"../cell/ui/cell.js";import{IdGenerator as n}from"../libs/id-generator.js";var l=t((function(t){var l=e().unfocus,c=JSON.parse(t.dataString),s=t.conditionalFormattingString.split(",");return r("tr",{className:"relative border border-gray-200 after:absolute after:w-full after:h-full after:top-0 after:left-0 after:pointer-events-none after:hover:bg-gray-500/10 ".concat(t.onClickRow?"hover:cursor-pointer":""," ").concat(t.applyRowFormatting?t.applyRowFormatting(c):""),onClick:function(r){r.preventDefault(),t.onClickRow&&(t.onClickRow(c),l())},"data-testid":c.id,children:[t.existCheckbox&&o("td",{children:o(i,{row:c})}),t.cols.map((function(r,e){var i;return o(a,{id:n.getTableCellId(t.rowIndex,e),row:c,isExistOnClickRow:!!t.onClickRow,cellFormatClassName:s[e],editable:null!==(i=r.editable)&&void 0!==i&&i},r.key)}))]})}));export{l as Row};
|
|
2
2
|
//# sourceMappingURL=components.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"components.js","sources":["../../../../../src/table/sheet/components.tsx"],"sourcesContent":["import { memo } from \"react\";\nimport { useFocusActionContext } from \"../focus/provider\";\nimport { DataRecord, TTableColumn } from \"../table/type\";\nimport { Checkbox } from \"../checkbox/components\";\nimport { TableCell } from \"../cell/ui/cell\";\n\ninterface TPropsRow<T extends DataRecord> {\n dataString: string;\n cols: TTableColumn<T>[];\n existCheckbox?: boolean;\n rowIndex: number;\n conditionalFormattingString: string;\n onClickRow?: (row: any) => void;\n applyRowFormatting?: (row: any) => string;\n
|
|
1
|
+
{"version":3,"file":"components.js","sources":["../../../../../src/table/sheet/components.tsx"],"sourcesContent":["import { memo } from \"react\";\nimport { useFocusActionContext } from \"../focus/provider\";\nimport { DataRecord, TTableColumn } from \"../table/type\";\nimport { Checkbox } from \"../checkbox/components\";\nimport { TableCell } from \"../cell/ui/cell\";\nimport { IdGenerator } from \"../libs\";\n\ninterface TPropsRow<T extends DataRecord> {\n dataString: string;\n cols: TTableColumn<T>[];\n existCheckbox?: boolean;\n rowIndex: number;\n conditionalFormattingString: string;\n onClickRow?: (row: any) => void;\n applyRowFormatting?: (row: any) => string;\n}\n\nexport const Row = memo(function R<T extends DataRecord>(props: TPropsRow<T>) {\n const { unfocus } = useFocusActionContext();\n const row = JSON.parse(props.dataString);\n const conditionalFormatting = props.conditionalFormattingString.split(\",\");\n\n return (\n <tr\n className={`relative border border-gray-200 after:absolute after:w-full after:h-full after:top-0 after:left-0 after:pointer-events-none after:hover:bg-gray-500/10 ${\n !!props.onClickRow ? \"hover:cursor-pointer\" : \"\"\n } ${props.applyRowFormatting ? props.applyRowFormatting(row) : \"\"}`}\n onClick={(e) => {\n e.preventDefault();\n\n if (!!props.onClickRow) {\n props.onClickRow(row);\n unfocus();\n }\n }}\n data-testid={row.id}\n >\n {props.existCheckbox && (\n <td>\n <Checkbox row={row} />\n </td>\n )}\n {props.cols.map((col, j) => {\n return (\n <TableCell\n key={col.key as string}\n id={IdGenerator.getTableCellId(props.rowIndex, j)}\n row={row}\n isExistOnClickRow={!!props.onClickRow}\n cellFormatClassName={conditionalFormatting[j]}\n editable={col.editable ?? false}\n />\n );\n })}\n </tr>\n );\n});\n"],"names":["Row","memo","props","unfocus","useFocusActionContext","row","JSON","parse","dataString","conditionalFormatting","conditionalFormattingString","split","_jsxs","className","concat","onClickRow","applyRowFormatting","onClick","e","preventDefault","id","children","existCheckbox","_jsx","Checkbox","cols","map","col","j","TableCell","IdGenerator","getTableCellId","rowIndex","isExistOnClickRow","cellFormatClassName","editable","_a","key"],"mappings":"0SAiBaA,EAAMC,GAAK,SAAiCC,GAC/C,IAAAC,EAAYC,YACdC,EAAMC,KAAKC,MAAML,EAAMM,YACvBC,EAAwBP,EAAMQ,4BAA4BC,MAAM,KAEtE,OACEC,EACE,KAAA,CAAAC,UAAW,0JACTC,OAAEZ,EAAMa,WAAa,uBAAyB,GAC5C,KAAAD,OAAAZ,EAAMc,mBAAqBd,EAAMc,mBAAmBX,GAAO,IAC/DY,QAAS,SAACC,GACRA,EAAEC,iBAEIjB,EAAMa,aACVb,EAAMa,WAAWV,GACjBF,IAEH,EACY,cAAAE,EAAIe,GAEhBC,SAAA,CAAAnB,EAAMoB,eACLC,EACE,KAAA,CAAAF,SAAAE,EAACC,EAAS,CAAAnB,IAAKA,MAGlBH,EAAMuB,KAAKC,KAAI,SAACC,EAAKC,SACpB,OACEL,EAACM,EAAS,CAERT,GAAIU,EAAYC,eAAe7B,EAAM8B,SAAUJ,GAC/CvB,IAAKA,EACL4B,oBAAqB/B,EAAMa,WAC3BmB,oBAAqBzB,EAAsBmB,GAC3CO,SAAsB,UAAZR,EAAIQ,gBAAQ,IAAAC,GAAAA,GALjBT,EAAIU,UAWrB"}
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import{__assign as
|
|
2
|
+
import{__assign as r}from"../../../node_modules/tslib/tslib.es6.js";import{jsx as o,jsxs as e}from"react/jsx-runtime";import{useTable as t}from"./hook.js";import{TableHeaderElement as i}from"../header/header.js";import{PagenationProvider as n}from"../pagenation/providers.js";import{DisplayRange as l,Pagenation as a}from"../pagenation/components.js";import{FilterProvider as s}from"../filter/provider.js";import{TableFilterRemoveButton as d,TableFilterForm as c}from"../filter/components.js";import"../sort/icon.js";import{SortProvider as m}from"../sort/provider.js";import{ColumnsProvider as p}from"../sheet/providers.js";import{FocusProvider as h}from"../focus/provider.js";import{CheckboxProvider as f,CheckboxStatusProvider as g}from"../checkbox/provider.js";import{AllCheckbox as u}from"../checkbox/components.js";import{IdGenerator as v}from"../libs/id-generator.js";import{EditProvider as b}from"../edit/provider.js";import{TablePropertyProvider as w}from"../table-property/provider.js";import{KeyboardSetting as x}from"../operation/components/keyboard-setting.js";import{Row as j}from"../sheet/components.js";import{PasteProvider as y,usePasteActionContext as k}from"../paste/provider.js";import{generateFormattingString as N}from"../libs/conditional-formatting.js";import{Editor as C}from"../edit/ui/editor.js";import{useFilteringColumnStateContext as R}from"../filter/hooks/selectedFilteringColumn/provider.js";function F(t){var i,l,a;return o(s,{children:o(m,{initialCondition:null===(i=t.initialCondition)||void 0===i?void 0:i.sort,children:o(n,{rowCount:t.rows.length,perPage:null===(a=null===(l=t.initialCondition)||void 0===l?void 0:l.pagenation)||void 0===a?void 0:a.rowCountPerPage,children:o(f,{checkbox:t.checkbox,children:o(g,{checkboxCount:t.rows.length,children:o(p,{cols:t.cols,errorHandler:t.errorHandler,children:o(h,{children:o(b,{children:o(w,{children:e(y,{rows:t.rows,cols:t.cols,onUpdateRowFunction:t.onUpdateRow,children:[o(x,{}),o(P,r({},t))]})})})})})})})})})})}function P(r){var n=t(r),s=n.cols,m=n.rowMaps,p=n.pageRowIds,h=R(),f=k().onPaste;return e("div",{className:"w-full",children:[o("div",{className:"flex justify-end mb-1 mr-3",children:o(d,{children:o("p",{className:"text-xs underline text-gray-500 hover:text-gray-700",children:"全てのフィルタリング条件を解除する"})})}),e("div",{id:"table-frame",className:"relative h-full max-w-full max-h-[80vh] border border-gray-200 rounded-md overflow-auto",children:[o(C,{rowMaps:m,pageRowIds:p}),e("table",{className:"table",onPaste:function(r){r.preventDefault();var o=r.clipboardData.getData("Text");f(o.replace(/\t/g,",").trim().replace(/\r\n/g,"\n").split("\n").map((function(r){return r.split(",")})))},children:[o("thead",{children:e("tr",{className:"sticky top-0 border-gray-200 z-20 bg-gray-200 text-gray-600 h-[32px]",children:[r.checkbox&&o("th",{children:o(u,{rows:r.rows})}),s.map((function(r,e){return o(i,{id:v.getTableColId(e),col:r},r.key.toString())}))]})}),e("tbody",{children:[!!h&&o("tr",{children:o("td",{colSpan:s.length,className:"sticky top-8 left-0 bg-gray-300 w-full shadow-lg rounded-b-2xl z-20 p-0 overflow-hidden",children:o(c,{})})}),0===p.length&&o("tr",{children:o("td",{colSpan:s.length,className:"py-5",children:o("p",{className:"text-center font-bold text-lg",children:"NO DATA"})})}),p.map((function(e,t){return o(j,{existCheckbox:!!r.checkbox,rowIndex:t,dataString:m[e].stringValue,cols:r.cols,onClickRow:r.onClickRow,applyRowFormatting:r.applyRowFormatting,conditionalFormattingString:N(m[e].data,s,r.conditionalFormattings)},e)}))]})]})]}),e("div",{className:"mt-1",children:[o(l,{}),o("div",{className:"mt-2",children:o(a,{})})]})]})}export{F as default};
|
|
3
3
|
//# sourceMappingURL=base.js.map
|