@teppen/react-ui 0.7.4 → 0.7.5

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.
Files changed (80) hide show
  1. package/dist/cjs/src/table/base.js +1 -1
  2. package/dist/cjs/src/table/filter/components.js +3 -0
  3. package/dist/cjs/src/table/filter/components.js.map +1 -0
  4. package/dist/cjs/src/table/filter/constants.js +2 -0
  5. package/dist/cjs/src/table/filter/constants.js.map +1 -0
  6. package/dist/cjs/src/table/filter/filter-icon.js.map +1 -0
  7. package/dist/cjs/src/table/filter/hooks.js +2 -0
  8. package/dist/cjs/src/table/filter/hooks.js.map +1 -0
  9. package/dist/cjs/src/table/filter/provider.js +3 -0
  10. package/dist/cjs/src/table/filter/provider.js.map +1 -0
  11. package/dist/cjs/src/table/hook.js +1 -1
  12. package/dist/cjs/src/table/hook.js.map +1 -1
  13. package/dist/cjs/src/table/pagenation/components.js +3 -0
  14. package/dist/cjs/src/table/pagenation/components.js.map +1 -0
  15. package/dist/cjs/src/table/pagenation/constants.js +2 -0
  16. package/dist/cjs/src/table/pagenation/constants.js.map +1 -0
  17. package/dist/cjs/src/table/pagenation/hooks.js +2 -0
  18. package/dist/cjs/src/table/pagenation/hooks.js.map +1 -0
  19. package/dist/cjs/src/table/pagenation/providers.js +3 -0
  20. package/dist/cjs/src/table/pagenation/providers.js.map +1 -0
  21. package/dist/cjs/src/table/sort/components.js +3 -0
  22. package/dist/cjs/src/table/sort/components.js.map +1 -0
  23. package/dist/cjs/src/table/sort/hooks.js +2 -0
  24. package/dist/cjs/src/table/sort/hooks.js.map +1 -0
  25. package/dist/cjs/src/table/{sort-icon.js → sort/icon.js} +1 -1
  26. package/dist/cjs/src/table/sort/icon.js.map +1 -0
  27. package/dist/cjs/src/table/sort/provider.js +3 -0
  28. package/dist/cjs/src/table/sort/provider.js.map +1 -0
  29. package/dist/esm/src/table/base.js +1 -1
  30. package/dist/esm/src/table/filter/components.js +3 -0
  31. package/dist/esm/src/table/filter/components.js.map +1 -0
  32. package/dist/esm/src/table/filter/constants.js +2 -0
  33. package/dist/esm/src/table/filter/constants.js.map +1 -0
  34. package/dist/esm/src/table/filter/filter-icon.js.map +1 -0
  35. package/dist/esm/src/table/filter/hooks.js +2 -0
  36. package/dist/esm/src/table/filter/hooks.js.map +1 -0
  37. package/dist/esm/src/table/filter/provider.js +3 -0
  38. package/dist/esm/src/table/filter/provider.js.map +1 -0
  39. package/dist/esm/src/table/hook.js +1 -1
  40. package/dist/esm/src/table/hook.js.map +1 -1
  41. package/dist/esm/src/table/pagenation/components.js +3 -0
  42. package/dist/esm/src/table/pagenation/components.js.map +1 -0
  43. package/dist/esm/src/table/pagenation/constants.js +2 -0
  44. package/dist/esm/src/table/pagenation/constants.js.map +1 -0
  45. package/dist/esm/src/table/pagenation/hooks.js +2 -0
  46. package/dist/esm/src/table/pagenation/hooks.js.map +1 -0
  47. package/dist/esm/src/table/pagenation/providers.js +3 -0
  48. package/dist/esm/src/table/pagenation/providers.js.map +1 -0
  49. package/dist/esm/src/table/sort/components.js +3 -0
  50. package/dist/esm/src/table/sort/components.js.map +1 -0
  51. package/dist/esm/src/table/sort/hooks.js +2 -0
  52. package/dist/esm/src/table/sort/hooks.js.map +1 -0
  53. package/dist/esm/src/table/{sort-icon.js → sort/icon.js} +1 -1
  54. package/dist/esm/src/table/sort/icon.js.map +1 -0
  55. package/dist/esm/src/table/sort/provider.js +3 -0
  56. package/dist/esm/src/table/sort/provider.js.map +1 -0
  57. package/dist/index.d.ts +6 -0
  58. package/package.json +1 -2
  59. package/dist/cjs/src/table/filter-form.js +0 -2
  60. package/dist/cjs/src/table/filter-form.js.map +0 -1
  61. package/dist/cjs/src/table/filter-icon.js.map +0 -1
  62. package/dist/cjs/src/table/filter.js +0 -2
  63. package/dist/cjs/src/table/filter.js.map +0 -1
  64. package/dist/cjs/src/table/page.js +0 -2
  65. package/dist/cjs/src/table/page.js.map +0 -1
  66. package/dist/cjs/src/table/sort-icon.js.map +0 -1
  67. package/dist/cjs/src/table/sort.js +0 -2
  68. package/dist/cjs/src/table/sort.js.map +0 -1
  69. package/dist/esm/src/table/filter-form.js +0 -2
  70. package/dist/esm/src/table/filter-form.js.map +0 -1
  71. package/dist/esm/src/table/filter-icon.js.map +0 -1
  72. package/dist/esm/src/table/filter.js +0 -2
  73. package/dist/esm/src/table/filter.js.map +0 -1
  74. package/dist/esm/src/table/page.js +0 -2
  75. package/dist/esm/src/table/page.js.map +0 -1
  76. package/dist/esm/src/table/sort-icon.js.map +0 -1
  77. package/dist/esm/src/table/sort.js +0 -2
  78. package/dist/esm/src/table/sort.js.map +0 -1
  79. /package/dist/cjs/src/table/{filter-icon.js → filter/filter-icon.js} +0 -0
  80. /package/dist/esm/src/table/{filter-icon.js → filter/filter-icon.js} +0 -0
@@ -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"),l=require("./hook.js"),t=require("./cell.js"),s=require("./sort.js"),n=require("./header.js"),i=require("./page.js"),o=require("./filter.js"),a=require("react"),c=require("./filter-form.js");function d(d){var u=l.useTable(d),x=u.cols,j=u.rows,m=u.rowCount,h=u.sortKey,v=u.sortOrder,p=u.page,f=p.count,b=p.current,y=p.from,g=p.to,k=p.next,N=p.prev,C=p.jump,q=a.useState(!1),w=q[0],T=q[1];return r.jsxs("div",{className:"w-full",children:[r.jsx("div",{className:"flex justify-end",children:r.jsx(o.TableFilterRemoveButton,{children:"remove all filters"})}),r.jsx("div",{className:"relative w-full h-full max-h-[80vh] border border-gray-200 rounded-md overflow-auto",children:r.jsxs("table",{className:"table table-auto w-full",children:[r.jsx("thead",{children:r.jsx("tr",{className:"sticky top-0 border-gray-200 z-20",children:x.map((function(e){return r.jsx(n.TableHeaderElement,{label:e.label,sortConponent:"component"!==e.type?r.jsx(s.Sort,{onClick:e.onClick,isSortedByThis:h===e.key,sortOrder:v}):void 0,filterComponent:"component"!==e.type?r.jsx(o.TableFilter,{keyName:e.key,onClick:function(e){e.preventDefault(),T((function(e){return!e}))}}):void 0},e.key)}))})}),r.jsxs("tbody",{children:[w&&r.jsx("tr",{children:r.jsx("td",{colSpan:x.length,className:"sticky top-8 left-0 bg-gray-300 w-full shadow-lg rounded-b-2xl py-5 px-2 z-20",children:r.jsx("div",{className:"container max-w-[768px] mx-auto",children:r.jsxs("div",{className:"relative",children:[r.jsx("div",{className:"absolute top-0 right-0",children:r.jsx("button",{onClick:function(e){e.preventDefault(),T(!1)},children:"close"})}),r.jsx("div",{children:r.jsx(c.TableFilterForm,{cols:x})})]})})})}),0===j.length&&r.jsx("tr",{children:r.jsx("td",{colSpan:x.length,className:"py-5",children:r.jsx("p",{className:"text-center font-bold text-lg",children:"NO DATA"})})}),j.map((function(l){var s;return r.jsx("tr",{className:"border border-gray-200 hover:bg-gray-100 ".concat((null===(s=j[0])||void 0===s?void 0:s.onClick)?"hover:cursor-pointer":""),onClick:l.onClick,"data-testid":l.id,children:x.map((function(s){var n=s.key,i=e.__rest(s,["key"]);return r.jsx(t.TableCell,e.__assign({},i,{columnKey:null==s?void 0:s.key,currentRecord:l,children:l[null==s?void 0:s.key]}),n)}))},l.id)}))]})]})}),r.jsxs("div",{className:"mt-1",children:[r.jsxs("p",{className:"text-center text-sm text-gray-600",children:[y+1," - ",g<m?g:m," of ",m]}),r.jsx("div",{className:"mt-2",children:r.jsx(i.Pagenation,{count:f,current:b,jump:C,next:k,prev:N})})]})]})}module.exports=function(l){return r.jsx(o.TableFilterProvider,{children:r.jsx(d,e.__assign({},l))})};
2
+ "use strict";var e=require("../../node_modules/tslib/tslib.es6.js"),r=require("react/jsx-runtime"),l=require("react"),n=require("./hook.js"),i=require("./cell.js"),s=require("./header.js"),t=require("./pagenation/providers.js"),o=require("./pagenation/components.js"),a=require("./filter/provider.js"),d=require("./filter/components.js"),c=require("./sort/components.js"),u=require("./sort/provider.js");function j(t){var a=n.useTable(t),u=a.cols,j=a.rows,x=l.useState(!1),h=x[0],m=x[1];return r.jsxs("div",{className:"w-full",children:[r.jsx("div",{className:"flex justify-end",children:r.jsx(d.TableFilterRemoveButton,{children:"remove all filters"})}),r.jsx("div",{className:"relative w-full h-full max-h-[80vh] border border-gray-200 rounded-md overflow-auto",children:r.jsxs("table",{className:"table table-auto w-full",children:[r.jsx("thead",{children:r.jsx("tr",{className:"sticky top-0 border-gray-200 z-20",children:u.map((function(e){return r.jsx(s.TableHeaderElement,{label:e.label,sortConponent:"component"!==e.type?r.jsx(c.SortButton,{keyName:e.key}):void 0,filterComponent:"component"!==e.type?r.jsx(d.TableFilter,{keyName:e.key,onClick:function(e){e.preventDefault(),m((function(e){return!e}))}}):void 0},e.key)}))})}),r.jsxs("tbody",{children:[h&&r.jsx("tr",{children:r.jsx("td",{colSpan:u.length,className:"sticky top-8 left-0 bg-gray-300 w-full shadow-lg rounded-b-2xl py-5 px-2 z-20",children:r.jsx("div",{className:"container max-w-[768px] mx-auto",children:r.jsxs("div",{className:"relative",children:[r.jsx("div",{className:"absolute top-0 right-0",children:r.jsx("button",{onClick:function(e){e.preventDefault(),m(!1)},children:"close"})}),r.jsx("div",{children:r.jsx(d.TableFilterForm,{cols:u})})]})})})}),0===j.length&&r.jsx("tr",{children:r.jsx("td",{colSpan:u.length,className:"py-5",children:r.jsx("p",{className:"text-center font-bold text-lg",children:"NO DATA"})})}),j.map((function(l){var n;return r.jsx("tr",{className:"border border-gray-200 hover:bg-gray-100 ".concat((null===(n=j[0])||void 0===n?void 0:n.onClick)?"hover:cursor-pointer":""),onClick:l.onClick,"data-testid":l.id,children:u.map((function(n){var s=n.key,t=e.__rest(n,["key"]);return r.jsx(i.TableCell,e.__assign({},t,{columnKey:null==n?void 0:n.key,currentRecord:l,children:l[null==n?void 0:n.key]}),s)}))},l.id)}))]})]})}),r.jsxs("div",{className:"mt-1",children:[r.jsx(o.DisplayRange,{}),r.jsx("div",{className:"mt-2",children:r.jsx(o.Pagenation,{})})]})]})}module.exports=function(l){var n;return r.jsx(a.FilterProvider,{children:r.jsx(u.SortProvider,{initialCondition:null===(n=l.initialCondition)||void 0===n?void 0:n.sort,children:r.jsx(t.PagenationProvider,{rowCount:l.rows.length,children:r.jsx(j,e.__assign({},l))})})})};
3
3
  //# sourceMappingURL=base.js.map
@@ -0,0 +1,3 @@
1
+ "use client";
2
+ "use strict";var e=require("react/jsx-runtime"),n=require("./filter-icon.js"),t=require("./provider.js"),l=require("react"),r=require("../cancel-icon.js"),i=require("./constants.js");function a(n){var l=n.children,r=t.useFilterContext(),i=r.clearFilter;if(0!==r.filterConditions.length)return e.jsx("button",{onClick:function(e){e.preventDefault(),i()},children:l})}exports.TableFilter=function(l){var r=t.useFilterContext().filterConditions;return e.jsx("div",{className:"relative cursor-pointer",onClick:l.onClick,children:e.jsx(n.FIlterIcon,{isFilterActive:r.filter((function(e){return e.key===l.keyName})).length>0})})},exports.TableFilterForm=function(n){var s=t.useFilterContext(),o=s.addFilter,u=s.removeFilter,c=s.filterConditions,d=l.useState(""),f=d[0],v=d[1],x=l.useState(""),p=x[0],h=x[1],j=l.useState(""),y=j[0],m=j[1],b=l.useState("string"),g=b[0],k=b[1],C=n.cols.find((function(e){return e.key===f}));return l.useEffect((function(){m(""),h("")}),[f]),e.jsxs(e.Fragment,{children:[e.jsxs("div",{className:"flex flex-col gap-2 mb-5",children:[e.jsx("p",{className:"font-bold text-lg",children:"フィルタ追加"}),e.jsxs("div",{className:"flex flex-wrap gap-1",children:[e.jsxs("select",{value:f,onChange:function(e){var t;e.preventDefault(),v(e.target.value);var l=null===(t=n.cols.find((function(n){return n.key===e.target.value})))||void 0===t?void 0:t.type;k(l)},children:[e.jsx("option",{value:"",children:"-- 列を選択 --"}),n.cols.filter((function(e){return!!e.label&&!!e.type})).map((function(n){return e.jsx("option",{value:n.key,children:n.label},n.key)}))]}),e.jsxs("select",{value:p,onChange:function(e){e.preventDefault(),h(e.target.value)},disabled:!f,children:[e.jsx("option",{value:"",children:f?"-- 条件を選択 --":"-- 列を選択してください --"}),"string"===g&&i.STRING_FILTER_OPERATOR.map((function(n){return e.jsx("option",{value:n.key,children:n.label},n.key)})),"number"===g&&i.NUMBER_FILTER_OPERATOR.map((function(n){return e.jsx("option",{value:n.key,children:n.label},n.key)})),"select"===g&&i.SELECT_FILTER_OPERATOR.map((function(n){return e.jsx("option",{value:n.key,children:n.label},n.key)}))]}),"select"===g?e.jsxs("select",{value:y,onChange:function(e){e.preventDefault(),m(e.target.value)},children:[e.jsx("option",{value:"",children:"-- 未選択 --"}),"select"===C.type&&C.options.map((function(n){return e.jsx("option",{value:n.value,children:n.label},n.value)}))]}):e.jsx("input",{type:"text",value:y,onChange:function(e){e.preventDefault(),m(e.target.value)},placeholder:"-- 値を入力 --"})]}),e.jsx("div",{className:"flex justify-end",children:e.jsx("button",{className:"bg-gray-900 text-white py-1 px-2 rounded-md",onClick:function(e){var t;if(e.preventDefault(),f&&p&&("select"===C.type||y)){var l=n.cols.find((function(e){return e.key===f}));o("string"===g?{key:f,operator:p,value:[y]}:"select"===g?{key:f,operator:p,value:y,label:"select"===l.type?null===(t=l.options.find((function(e){return e.value===y})))||void 0===t?void 0:t.label:void 0}:{key:f,operator:p,value:Number(y)})}else alert("全ての項目を入力してください")},children:"追加"})})]}),e.jsxs("div",{children:[c.length>0&&e.jsx("p",{className:"font-bold text-lg",children:"フィルタ一覧"}),e.jsx("ul",{className:"flex flex-col gap-1 my-2",children:c.map((function(t){var l,a;return e.jsxs("li",{className:"flex justify-between",children:[e.jsxs("p",{children:["「",e.jsx("strong",{children:null===(l=n.cols.find((function(e){return e.key===t.key})))||void 0===l?void 0:l.label}),"」 は",e.jsx("span",{children:null===(a=i.FILTER_OPERATOR.find((function(e){return e.key===t.operator})))||void 0===a?void 0:a.label}),":",e.jsx("span",{children:t.label?t.label:t.value})]}),e.jsx("button",{onClick:function(e){e.preventDefault(),u(t.id)},children:e.jsx(r.CancelIcon,{size:16})})]},t.id)}))}),e.jsx("div",{className:"flex justify-center",children:e.jsx(a,{children:e.jsx("p",{className:"text-gray-600 underline hover:text-gray-800",children:"remove all filters"})})})]})]})},exports.TableFilterRemoveButton=a;
3
+ //# sourceMappingURL=components.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"components.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
@@ -0,0 +1,2 @@
1
+ "use strict";var e=require("../../../node_modules/tslib/tslib.es6.js"),l=[{key:"includeText",label:"次の値を含む"}],r=[{key:"eq",label:"次の値と等しい"},{key:"ne",label:"次の値と等しくない"},{key:"gt",label:"次の値より大きい"},{key:"lt",label:"次の値より小さい"},{key:"gte",label:"次の値以上"},{key:"lte",label:"次の値以下"}],a=[{key:"selected",label:"次の値と等しい"},{key:"notSelected",label:"次の値と等しくない"}],t=e.__spreadArray(e.__spreadArray(e.__spreadArray([],l,!0),r,!0),a,!0);exports.FILTER_OPERATOR=t,exports.NUMBER_FILTER_OPERATOR=r,exports.SELECT_FILTER_OPERATOR=a,exports.STRING_FILTER_OPERATOR=l;
2
+ //# sourceMappingURL=constants.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"constants.js","sources":["../../../../../src/table/filter/constants.ts"],"sourcesContent":["export const STRING_FILTER_OPERATOR = [\n { key: \"includeText\", label: \"次の値を含む\" },\n] as const;\n\nexport const NUMBER_FILTER_OPERATOR = [\n { key: \"eq\", label: \"次の値と等しい\" },\n { key: \"ne\", label: \"次の値と等しくない\" },\n { key: \"gt\", label: \"次の値より大きい\" },\n { key: \"lt\", label: \"次の値より小さい\" },\n { key: \"gte\", label: \"次の値以上\" },\n { key: \"lte\", label: \"次の値以下\" },\n] as const;\n\nexport const SELECT_FILTER_OPERATOR = [\n { key: \"selected\", label: \"次の値と等しい\" },\n { key: \"notSelected\", label: \"次の値と等しくない\" },\n] as const;\n\nexport const FILTER_OPERATOR = [\n ...STRING_FILTER_OPERATOR,\n ...NUMBER_FILTER_OPERATOR,\n ...SELECT_FILTER_OPERATOR,\n] as const;\n"],"names":["STRING_FILTER_OPERATOR","key","label","NUMBER_FILTER_OPERATOR","SELECT_FILTER_OPERATOR","FILTER_OPERATOR","__spreadArray"],"mappings":"uEAAaA,EAAyB,CACpC,CAAEC,IAAK,cAAeC,MAAO,WAGlBC,EAAyB,CACpC,CAAEF,IAAK,KAAMC,MAAO,WACpB,CAAED,IAAK,KAAMC,MAAO,aACpB,CAAED,IAAK,KAAMC,MAAO,YACpB,CAAED,IAAK,KAAMC,MAAO,YACpB,CAAED,IAAK,MAAOC,MAAO,SACrB,CAAED,IAAK,MAAOC,MAAO,UAGVE,EAAyB,CACpC,CAAEH,IAAK,WAAYC,MAAO,WAC1B,CAAED,IAAK,cAAeC,MAAO,cAGlBG,EAAkBC,EAAAA,cAAAA,gBAAAA,EAAAA,cAAA,GAC1BN,GAAsB,GACtBG,GAAsB,GACtBC,GAAsB"}
@@ -0,0 +1 @@
1
+ {"version":3,"file":"filter-icon.js","sources":["../../../../../src/table/filter/filter-icon.tsx"],"sourcesContent":["type TPropsFIlterIcon = {\n size?: number;\n isFilterActive?: boolean;\n};\n\nexport function FIlterIcon(props: TPropsFIlterIcon) {\n const size = props.size ?? 16;\n return (\n <div\n className={`duration-300 ${\n props.isFilterActive ? \"text-gray-700\" : \"text-gray-500\"\n }`}\n >\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n xmlnsXlink=\"http://www.w3.org/1999/xlink\"\n version=\"1.1\"\n width={`${size}px`}\n height={`${size}px`}\n viewBox=\"0 0 256 256\"\n xmlSpace=\"preserve\"\n >\n <defs></defs>\n {props.isFilterActive ? (\n <g\n style={{\n stroke: \"none\",\n strokeWidth: 0,\n strokeDasharray: \"none\",\n strokeLinecap: \"butt\",\n strokeLinejoin: \"miter\",\n strokeMiterlimit: 10,\n fill: \"none\",\n fillRule: \"nonzero\",\n opacity: 1,\n }}\n transform=\"translate(1.4065934065934016 1.4065934065934016) scale(2.81 2.81)\"\n >\n <path\n d=\"M 52.537 80.466 V 45.192 L 84.53 2.999 C 85.464 1.768 84.586 0 83.041 0 H 6.959 C 5.414 0 4.536 1.768 5.47 2.999 l 31.994 42.192 v 43.441 c 0 1.064 1.163 1.719 2.073 1.167 l 11.758 -7.127 C 52.065 82.205 52.537 81.368 52.537 80.466 z\"\n style={{\n stroke: \"none\",\n strokeWidth: 1,\n strokeDasharray: \"none\",\n strokeLinecap: \"butt\",\n strokeLinejoin: \"miter\",\n strokeMiterlimit: 10,\n fill: \"currentColor\",\n fillRule: \"nonzero\",\n opacity: 1,\n }}\n transform=\" matrix(1 0 0 1 0 0) \"\n strokeLinecap=\"round\"\n />\n </g>\n ) : (\n <g\n style={{\n stroke: \"none\",\n strokeWidth: 0,\n strokeDasharray: \"none\",\n strokeLinecap: \"butt\",\n strokeLinejoin: \"miter\",\n strokeMiterlimit: 10,\n fill: \"none\",\n fillRule: \"nonzero\",\n opacity: 1,\n }}\n transform=\"translate(1.4065934065934016 1.4065934065934016) scale(2.81 2.81)\"\n >\n <path\n d=\"M 37.882 90 c -0.338 0 -0.676 -0.086 -0.981 -0.258 c -0.629 -0.354 -1.019 -1.02 -1.019 -1.742 V 45.354 L 3.923 3.208 C 3.464 2.604 3.388 1.791 3.726 1.11 S 4.758 0 5.517 0 h 78.966 c 0.76 0 1.453 0.43 1.791 1.11 s 0.262 1.493 -0.197 2.098 L 54.118 45.354 V 79.37 c 0 0.699 -0.365 1.348 -0.963 1.71 l -14.237 8.63 C 38.601 89.903 38.241 90 37.882 90 z M 9.543 4 l 29.932 39.474 c 0.264 0.348 0.406 0.772 0.406 1.208 v 39.767 l 10.236 -6.205 V 44.682 c 0 -0.437 0.143 -0.861 0.406 -1.208 L 80.457 4 H 9.543 z M 52.118 79.37 h 0.01 H 52.118 z\"\n style={{\n stroke: \"none\",\n strokeWidth: 1,\n strokeDasharray: \"none\",\n strokeLinecap: \"butt\",\n strokeLinejoin: \"miter\",\n strokeMiterlimit: 10,\n fill: \"currentColor\",\n fillRule: \"nonzero\",\n opacity: 1,\n }}\n transform=\" matrix(1 0 0 1 0 0) \"\n strokeLinecap=\"round\"\n />\n </g>\n )}\n </svg>\n </div>\n );\n}\n"],"names":["props","size","_a","_jsx","jsx","className","concat","isFilterActive","children","_jsxs","xmlns","xmlnsXlink","version","width","height","viewBox","xmlSpace","style","stroke","strokeWidth","strokeDasharray","strokeLinecap","strokeLinejoin","strokeMiterlimit","fill","fillRule","opacity","transform","d"],"mappings":"mEAKM,SAAqBA,SACnBC,EAAiB,QAAVC,EAAAF,EAAMC,YAAI,IAAAC,EAAAA,EAAI,GAC3B,OACEC,EAAAC,IAAA,MAAA,CACEC,UAAW,gBACTC,OAAAN,EAAMO,eAAiB,gBAAkB,iBACzCC,SAEFC,EAAAA,KACE,MAAA,CAAAC,MAAM,6BACNC,WAAW,+BACXC,QAAQ,MACRC,MAAO,GAAGP,OAAAL,EAAQ,MAClBa,OAAQ,GAAGR,OAAAL,EAAQ,MACnBc,QAAQ,cACRC,SAAS,WAAUR,SAAA,CAEnBL,EAAAA,IAAa,OAAA,IACZH,EAAMO,eACLJ,EAAAC,IAAA,IAAA,CACEa,MAAO,CACLC,OAAQ,OACRC,YAAa,EACbC,gBAAiB,OACjBC,cAAe,OACfC,eAAgB,QAChBC,iBAAkB,GAClBC,KAAM,OACNC,SAAU,UACVC,QAAS,GAEXC,UAAU,oEAEVnB,SAAAL,EAAAA,IAAA,OAAA,CACEyB,EAAE,4OACFX,MAAO,CACLC,OAAQ,OACRC,YAAa,EACbC,gBAAiB,OACjBC,cAAe,OACfC,eAAgB,QAChBC,iBAAkB,GAClBC,KAAM,eACNC,SAAU,UACVC,QAAS,GAEXC,UAAU,wBACVN,cAAc,YAIlBlB,EAAAC,IAAA,IAAA,CACEa,MAAO,CACLC,OAAQ,OACRC,YAAa,EACbC,gBAAiB,OACjBC,cAAe,OACfC,eAAgB,QAChBC,iBAAkB,GAClBC,KAAM,OACNC,SAAU,UACVC,QAAS,GAEXC,UAAU,oEAEVnB,SAAAL,EAAAA,IAAA,OAAA,CACEyB,EAAE,8hBACFX,MAAO,CACLC,OAAQ,OACRC,YAAa,EACbC,gBAAiB,OACjBC,cAAe,OACfC,eAAgB,QAChBC,iBAAkB,GAClBC,KAAM,eACNC,SAAU,UACVC,QAAS,GAEXC,UAAU,wBACVN,cAAc,gBAO5B"}
@@ -0,0 +1,2 @@
1
+ "use strict";var e=require("../../../node_modules/tslib/tslib.es6.js"),r=require("react"),t=function(r,t){switch(t.type){case"add":return{filters:e.__spreadArray(e.__spreadArray([],r.filters,!0),[e.__assign({id:(new Date).getTime()},t.payload.filter)],!1)};case"remove":return{filters:r.filters.filter((function(e){return e.id!==t.payload.id}))};case"clear":return{filters:[]}}};exports.useFilterReducer=function(){var e=r.useReducer(t,{filters:[]}),n=e[0],u=e[1];return{addFilter:r.useCallback((function(e){return u({type:"add",payload:{filter:e}})}),[u]),removeFilter:r.useCallback((function(e){return u({type:"remove",payload:{id:e}})}),[u]),clearFilter:r.useCallback((function(){return u({type:"clear"})}),[u]),filter:r.useCallback((function(e){return n.filters.reduce((function(e,r){switch(r.operator){case"includeText":return e.filter((function(e){var t=e[r.key];return"string"==typeof t&&r.value.some((function(e){return t.includes(e)}))}));case"eq":case"selected":return e.filter((function(e){return e[r.key]===r.value}));case"ne":case"notSelected":return e.filter((function(e){return e[r.key]!==r.value}));case"gt":return e.filter((function(e){return e[r.key]>r.value}));case"lt":return e.filter((function(e){return e[r.key]<r.value}));case"gte":return e.filter((function(e){return e[r.key]>=r.value}));case"lte":return e.filter((function(e){return e[r.key]<=r.value}))}}),e)}),[n]),filterConditions:n.filters}};
2
+ //# sourceMappingURL=hooks.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"hooks.js","sources":["../../../../../src/table/filter/hooks.ts"],"sourcesContent":["import { useCallback, useReducer } from \"react\";\nimport { TFilter, TFilterReducer, TReturnUseFilterReducer } from \"./types\";\nimport { DataObject } from \"../type\";\n\nconst reducer: TFilterReducer = (state, action) => {\n switch (action.type) {\n case \"add\":\n return {\n filters: [\n ...state.filters,\n { id: new Date().getTime(), ...action.payload.filter },\n ],\n };\n case \"remove\":\n return {\n filters: state.filters.filter((f) => f.id !== action.payload.id),\n };\n case \"clear\":\n return { filters: [] };\n }\n};\n\nexport function useFilterReducer(): TReturnUseFilterReducer {\n const [state, dispatch] = useReducer(reducer, { filters: [] });\n\n const addFilter = useCallback(\n (filter: TFilter) => dispatch({ type: \"add\", payload: { filter } }),\n [dispatch]\n );\n const removeFilter = useCallback(\n (id: number) => dispatch({ type: \"remove\", payload: { id } }),\n [dispatch]\n );\n const clearFilter = useCallback(\n () => dispatch({ type: \"clear\" }),\n [dispatch]\n );\n\n const filter = useCallback(\n <T extends DataObject>(rows: T[]): T[] => {\n return state.filters.reduce((acc, filter) => {\n switch (filter.operator) {\n case \"includeText\":\n return acc.filter((row) => {\n const value = row[filter.key];\n if (typeof value === \"string\") {\n return filter.value.some((v) => value.includes(v));\n }\n return false;\n });\n case \"eq\":\n return acc.filter((row) => row[filter.key] === filter.value);\n case \"ne\":\n return acc.filter((row) => row[filter.key] !== filter.value);\n case \"gt\":\n return acc.filter((row) => row[filter.key] > filter.value);\n case \"lt\":\n return acc.filter((row) => row[filter.key] < filter.value);\n case \"gte\":\n return acc.filter((row) => row[filter.key] >= filter.value);\n case \"lte\":\n return acc.filter((row) => row[filter.key] <= filter.value);\n case \"selected\":\n return acc.filter((row) => row[filter.key] === filter.value);\n case \"notSelected\":\n return acc.filter((row) => row[filter.key] !== filter.value);\n }\n }, rows);\n },\n [state]\n );\n\n return {\n addFilter,\n removeFilter,\n clearFilter,\n filter,\n filterConditions: state.filters,\n };\n}\n"],"names":["reducer","state","action","type","filters","__spreadArray","__assign","id","Date","getTime","payload","filter","f","_a","useReducer","dispatch","addFilter","useCallback","removeFilter","clearFilter","rows","reduce","acc","operator","row","value","key","some","v","includes","filterConditions"],"mappings":"0FAIMA,EAA0B,SAACC,EAAOC,GACtC,OAAQA,EAAOC,MACb,IAAK,MACH,MAAO,CACLC,QAAOC,EAAAA,cAAAA,gBAAA,GACFJ,EAAMG,SAAO,GAAA,CACdE,WAAA,CAAAC,IAAI,IAAIC,MAAOC,WAAcP,EAAOQ,QAAQC,UAC/C,IAEL,IAAK,SACH,MAAO,CACLP,QAASH,EAAMG,QAAQO,QAAO,SAACC,GAAM,OAAAA,EAAEL,KAAOL,EAAOQ,QAAQH,EAAxB,KAEzC,IAAK,QACH,MAAO,CAAEH,QAAS,IAExB,sCAGQ,IAAAS,EAAoBC,EAAUA,WAACd,EAAS,CAAEI,QAAS,KAAlDH,OAAOc,OAiDd,MAAO,CACLC,UAhDgBC,EAAAA,aAChB,SAACN,GAAoB,OAAAI,EAAS,CAAEZ,KAAM,MAAOO,QAAS,CAAEC,OAAMA,OAC9D,CAACI,IA+CDG,aA7CmBD,EAAAA,aACnB,SAACV,GAAe,OAAAQ,EAAS,CAAEZ,KAAM,SAAUO,QAAS,CAAEH,GAAEA,OACxD,CAACQ,IA4CDI,YA1CkBF,EAAAA,aAClB,WAAM,OAAAF,EAAS,CAAEZ,KAAM,SAAjB,GACN,CAACY,IAyCDJ,OAtCaM,eACb,SAAuBG,GACrB,OAAOnB,EAAMG,QAAQiB,QAAO,SAACC,EAAKX,GAChC,OAAQA,EAAOY,UACb,IAAK,cACH,OAAOD,EAAIX,QAAO,SAACa,GACjB,IAAMC,EAAQD,EAAIb,EAAOe,KACzB,MAAqB,iBAAVD,GACFd,EAAOc,MAAME,MAAK,SAACC,GAAM,OAAAH,EAAMI,SAASD,EAAE,GAGrD,IACF,IAAK,KAYL,IAAK,WACH,OAAON,EAAIX,QAAO,SAACa,GAAQ,OAAAA,EAAIb,EAAOe,OAASf,EAAOc,KAAK,IAX7D,IAAK,KAYL,IAAK,cACH,OAAOH,EAAIX,QAAO,SAACa,GAAQ,OAAAA,EAAIb,EAAOe,OAASf,EAAOc,KAAK,IAX7D,IAAK,KACH,OAAOH,EAAIX,QAAO,SAACa,GAAQ,OAAAA,EAAIb,EAAOe,KAAOf,EAAOc,KAAK,IAC3D,IAAK,KACH,OAAOH,EAAIX,QAAO,SAACa,GAAQ,OAAAA,EAAIb,EAAOe,KAAOf,EAAOc,KAAK,IAC3D,IAAK,MACH,OAAOH,EAAIX,QAAO,SAACa,GAAQ,OAAAA,EAAIb,EAAOe,MAAQf,EAAOc,KAAK,IAC5D,IAAK,MACH,OAAOH,EAAIX,QAAO,SAACa,GAAQ,OAAAA,EAAIb,EAAOe,MAAQf,EAAOc,KAAK,IAM/D,GAAEL,EACL,GACA,CAACnB,IAQD6B,iBAAkB7B,EAAMG,QAE5B"}
@@ -0,0 +1,3 @@
1
+ "use client";
2
+ "use strict";var e=require("react/jsx-runtime"),r=require("react"),t=require("./hooks.js"),i=r.createContext({addFilter:function(){},removeFilter:function(){},clearFilter:function(){},filter:function(){return[]},filterConditions:[]});exports.FilterProvider=function(r){var n=r.children;return e.jsx(i.Provider,{value:t.useFilterReducer(),children:n})},exports.useFilterContext=function(){return r.useContext(i)};
3
+ //# sourceMappingURL=provider.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"provider.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
@@ -1,2 +1,2 @@
1
- "use strict";var e=require("../../node_modules/tslib/tslib.es6.js"),r=require("react"),t=require("./page.js"),o=require("./filter.js");exports.useTable=function(n){var u=r.useState({key:"id",order:"ASC"}),s=u[0],i=u[1],a=o.useTableFilterContext(),l=a.filter,c=a.addFilter,d=a.removeFilter,f=a.clearFilter,y=a.filterConditions,k=t.usePageReducer({perPage:50,currentPage:1,rowCount:n.rows.length}),C=k.currentPage,g=k.pageCount,p=k.from,m=k.to,v=k.next,S=k.prev,w=k.jump,A=k.setRowCount,_=n.cols,j=r.useMemo((function(){return l(n.rows)}),[l,n.rows]);r.useEffect((function(){A(j.length)}),[j.length]);var b=r.useMemo((function(){return e.__spreadArray([],j,!0).sort((function(e,r){return e[s.key]<r[s.key]?"ASC"===s.order?-1:1:e[s.key]>r[s.key]?"ASC"===s.order?1:-1:0}))}),[j,s.key,s.order]),h=r.useMemo((function(){return b.slice(p,m)}),[p,m,b]);return{cols:_.map((function(r){return e.__assign(e.__assign({},r),{onClick:function(e){e.preventDefault(),s.key===r.key?i({key:r.key,order:"ASC"===s.order?"DESC":"ASC"}):i({key:r.key,order:"ASC"})}})})),rows:h,rowCount:j.length,sortKey:s.key,sortOrder:s.order,page:{from:p,to:m,count:g,current:C,next:v,prev:S,jump:w},filter:{add:c,remove:d,clear:f,conditions:y}}};
1
+ "use strict";var e=require("react"),r=require("./pagenation/providers.js");require("react/jsx-runtime");var t=require("./filter/provider.js");require("./filter/constants.js"),require("./sort/icon.js");var o=require("./sort/provider.js");exports.useTable=function(s){var u=t.useFilterContext().filter,n=o.useSortContext().sort,i=r.usePageContext(),a=i.setRowCount,c=i.pageFilter,f=e.useMemo((function(){return u(s.rows)}),[u,s.rows]);e.useEffect((function(){a(f.length)}),[f.length]);var l=e.useMemo((function(){return n(f)}),[f,n]),v=e.useMemo((function(){return c(l)}),[c,l]);return{cols:s.cols,rows:v}};
2
2
  //# sourceMappingURL=hook.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"hook.js","sources":["../../../../src/table/hook.ts"],"sourcesContent":["import { useEffect, useMemo, useState } from \"react\";\nimport { DataObject, TPropsTable } from \"./type\";\nimport { usePageReducer } from \"./page\";\nimport { useTableFilterContext } from \"./filter\";\n\ntype State = {\n key: string;\n order: \"ASC\" | \"DESC\";\n};\n\nexport function useTable<T extends DataObject>(props: TPropsTable<T>) {\n const [key, changeKey] = useState<State>({ key: \"id\", order: \"ASC\" });\n const { filter, addFilter, removeFilter, clearFilter, filterConditions } =\n useTableFilterContext();\n const { currentPage, pageCount, from, to, next, prev, jump, setRowCount } =\n usePageReducer({\n perPage: 50,\n currentPage: 1,\n rowCount: props.rows.length,\n });\n\n const { cols } = props;\n\n const filteredRows = useMemo(() => filter(props.rows), [filter, props.rows]);\n\n useEffect(() => {\n setRowCount(filteredRows.length);\n }, [filteredRows.length]);\n\n const sortedRows = useMemo(\n () =>\n [...filteredRows].sort((a, b) => {\n if (a[key.key] < b[key.key]) {\n return key.order === \"ASC\" ? -1 : 1;\n }\n if (a[key.key] > b[key.key]) {\n return key.order === \"ASC\" ? 1 : -1;\n }\n return 0;\n }),\n [filteredRows, key.key, key.order]\n );\n\n const pagedRows = useMemo(\n () => sortedRows.slice(from, to),\n [from, to, sortedRows]\n );\n\n const colsWithSort = cols.map((col) => ({\n ...col,\n onClick: (e: React.MouseEvent<HTMLElement>) => {\n e.preventDefault();\n if (key.key === col.key) {\n changeKey({\n key: col.key,\n order: key.order === \"ASC\" ? \"DESC\" : \"ASC\",\n });\n } else {\n changeKey({ key: col.key, order: \"ASC\" });\n }\n },\n }));\n\n return {\n cols: colsWithSort,\n rows: pagedRows,\n rowCount: filteredRows.length,\n sortKey: key.key,\n sortOrder: key.order,\n page: {\n from,\n to,\n count: pageCount,\n current: currentPage,\n next,\n prev,\n jump,\n },\n filter: {\n add: addFilter,\n remove: removeFilter,\n clear: clearFilter,\n conditions: filterConditions,\n },\n };\n}\n"],"names":["props","_a","useState","key","order","changeKey","_b","useTableFilterContext","filter","addFilter","removeFilter","clearFilter","filterConditions","_c","usePageReducer","perPage","currentPage","rowCount","rows","length","pageCount","from","to","next","prev","jump","setRowCount","cols","filteredRows","useMemo","useEffect","sortedRows","__spreadArray","sort","a","b","pagedRows","slice","map","col","onClick","e","preventDefault","sortKey","sortOrder","page","count","current","add","remove","clear","conditions"],"mappings":"wJAUM,SAAyCA,GACvC,IAAAC,EAAmBC,EAAAA,SAAgB,CAAEC,IAAK,KAAMC,MAAO,QAAtDD,OAAKE,OACNC,EACJC,EAAAA,wBADMC,EAAMF,EAAAE,OAAEC,EAASH,EAAAG,UAAEC,iBAAcC,gBAAaC,qBAEhDC,EACJC,EAAAA,eAAe,CACbC,QAAS,GACTC,YAAa,EACbC,SAAUjB,EAAMkB,KAAKC,SAJjBH,EAAWH,EAAAG,YAAEI,cAAWC,EAAIR,EAAAQ,KAAEC,EAAET,EAAAS,GAAEC,EAAIV,EAAAU,KAAEC,EAAIX,EAAAW,KAAEC,EAAIZ,EAAAY,KAAEC,EAAWb,EAAAa,YAO/DC,EAAS3B,EAAK2B,KAEhBC,EAAeC,EAAOA,SAAC,WAAM,OAAArB,EAAOR,EAAMkB,KAAK,GAAE,CAACV,EAAQR,EAAMkB,OAEtEY,EAAAA,WAAU,WACRJ,EAAYE,EAAaT,OAC3B,GAAG,CAACS,EAAaT,SAEjB,IAAMY,EAAaF,EAAAA,SACjB,WACE,OAAAG,EAAAA,cAAA,GAAIJ,GAAc,GAAAK,MAAK,SAACC,EAAGC,GACzB,OAAID,EAAE/B,EAAIA,KAAOgC,EAAEhC,EAAIA,KACA,QAAdA,EAAIC,OAAmB,EAAI,EAEhC8B,EAAE/B,EAAIA,KAAOgC,EAAEhC,EAAIA,KACA,QAAdA,EAAIC,MAAkB,GAAK,EAE7B,CACT,GARA,GASF,CAACwB,EAAczB,EAAIA,IAAKA,EAAIC,QAGxBgC,EAAYP,EAAOA,SACvB,WAAM,OAAAE,EAAWM,MAAMhB,EAAMC,EAAG,GAChC,CAACD,EAAMC,EAAIS,IAkBb,MAAO,CACLJ,KAhBmBA,EAAKW,KAAI,SAACC,GAAQ,gCAClCA,GAAG,CACNC,QAAS,SAACC,GACRA,EAAEC,iBACEvC,EAAIA,MAAQoC,EAAIpC,IAClBE,EAAU,CACRF,IAAKoC,EAAIpC,IACTC,MAAqB,QAAdD,EAAIC,MAAkB,OAAS,QAGxCC,EAAU,CAAEF,IAAKoC,EAAIpC,IAAKC,MAAO,OAErC,GACA,IAIAc,KAAMkB,EACNnB,SAAUW,EAAaT,OACvBwB,QAASxC,EAAIA,IACbyC,UAAWzC,EAAIC,MACfyC,KAAM,CACJxB,KAAIA,EACJC,GAAEA,EACFwB,MAAO1B,EACP2B,QAAS/B,EACTO,KAAIA,EACJC,KAAIA,EACJC,KAAIA,GAENjB,OAAQ,CACNwC,IAAKvC,EACLwC,OAAQvC,EACRwC,MAAOvC,EACPwC,WAAYvC,GAGlB"}
1
+ {"version":3,"file":"hook.js","sources":["../../../../src/table/hook.ts"],"sourcesContent":["import { useEffect, useMemo } from \"react\";\nimport { DataObject, TPropsTable } from \"./type\";\nimport { usePageContext } from \"./pagenation/providers\";\nimport { useFilterContext } from \"./filter\";\nimport { useSortContext } from \"./sort\";\n\nexport function useTable<T extends DataObject>(props: TPropsTable<T>) {\n const { filter } = useFilterContext();\n const { sort } = useSortContext();\n const { setRowCount, pageFilter } = usePageContext();\n\n const filteredRows = useMemo(() => filter(props.rows), [filter, props.rows]);\n\n useEffect(() => {\n setRowCount(filteredRows.length);\n }, [filteredRows.length]);\n\n const sortedRows = useMemo(() => sort(filteredRows), [filteredRows, sort]);\n\n const pageRows = useMemo(\n () => pageFilter(sortedRows),\n [pageFilter, sortedRows]\n );\n\n return {\n cols: props.cols,\n rows: pageRows,\n };\n}\n"],"names":["props","filter","useFilterContext","sort","useSortContext","_a","usePageContext","setRowCount","pageFilter","filteredRows","useMemo","rows","useEffect","length","sortedRows","pageRows","cols"],"mappings":"8PAMM,SAAyCA,GACrC,IAAAC,EAAWC,4BACXC,EAASC,wBACXC,EAA8BC,EAAcA,iBAA1CC,EAAWF,EAAAE,YAAEC,EAAUH,EAAAG,WAEzBC,EAAeC,EAAOA,SAAC,WAAM,OAAAT,EAAOD,EAAMW,KAAK,GAAE,CAACV,EAAQD,EAAMW,OAEtEC,EAAAA,WAAU,WACRL,EAAYE,EAAaI,OAC3B,GAAG,CAACJ,EAAaI,SAEjB,IAAMC,EAAaJ,EAAAA,SAAQ,WAAM,OAAAP,EAAKM,KAAe,CAACA,EAAcN,IAE9DY,EAAWL,EAAAA,SACf,WAAM,OAAAF,EAAWM,KACjB,CAACN,EAAYM,IAGf,MAAO,CACLE,KAAMhB,EAAMgB,KACZL,KAAMI,EAEV"}
@@ -0,0 +1,3 @@
1
+ "use client";
2
+ "use strict";var t=require("react/jsx-runtime"),e=require("./providers.js");exports.DisplayRange=function(){var n=e.usePageContext(),r=n.from,s=n.to,u=n.rowCount;return t.jsxs("p",{className:"text-center text-sm text-gray-600",children:[r+1," - ",s<u?s:u," of ",u]})},exports.Pagenation=function(){var n=e.usePageContext(),r=n.current,s=n.pageCount,u=n.jump,c=n.prev,i=n.next;return t.jsxs("div",{className:"flex justify-center gap-2",children:[t.jsx("button",{className:"text-sm",onClick:function(){return u(1)},disabled:1===r,children:"≪"}),t.jsx("button",{className:"text-sm",onClick:function(){return c()},disabled:1===r,children:"<"}),Array.from({length:s},(function(t,e){return e+1})).filter((function(t){return r-2<=t&&t<=r+2})).map((function(e){return t.jsx("button",{className:"text-sm ".concat(r===e?"text-blue-600":""),onClick:function(){return u(e)},children:e},e)})),t.jsx("button",{className:"text-sm",onClick:function(){return i()},disabled:r===s,children:">"}),t.jsx("button",{className:"text-sm",onClick:function(){return u(s)},disabled:r===s,children:"≫"})]})};
3
+ //# sourceMappingURL=components.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"components.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
@@ -0,0 +1,2 @@
1
+ "use strict";exports.INITIAL_PAGE_STATE={perPage:50,currentPage:1,rowCount:0};
2
+ //# sourceMappingURL=constants.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"constants.js","sources":["../../../../../src/table/pagenation/constants.ts"],"sourcesContent":["import { TPageState } from \"./types\";\n\nexport const INITIAL_PAGE_STATE: TPageState = {\n perPage: 50,\n currentPage: 1,\n rowCount: 0,\n};\n"],"names":["perPage","currentPage","rowCount"],"mappings":"wCAE8C,CAC5CA,QAAS,GACTC,YAAa,EACbC,SAAU"}
@@ -0,0 +1,2 @@
1
+ "use strict";var e=require("../../../node_modules/tslib/tslib.es6.js"),r=require("react"),a=require("./constants.js");function t(r,a){switch(a.type){case"setRowCount":return e.__assign(e.__assign({},r),{currentPage:1,rowCount:a.payload.rowCount});case"setPerPage":return e.__assign(e.__assign({},r),{perPage:a.payload.perPage});case"next":return r.currentPage===Math.ceil(r.rowCount/r.perPage)?r:e.__assign(e.__assign({},r),{currentPage:r.currentPage+1});case"prev":return 1===r.currentPage?r:e.__assign(e.__assign({},r),{currentPage:r.currentPage-1});case"jump":return a.payload.pageNumber<1||a.payload.pageNumber>Math.ceil(r.rowCount/r.perPage)||r.currentPage===a.payload.pageNumber?r:e.__assign(e.__assign({},r),{currentPage:a.payload.pageNumber});default:return r}}exports.usePageReducer=function(e){var n=r.useReducer(t,null!=e?e:a.INITIAL_PAGE_STATE),u=n[0],s=n[1],o=r.useCallback((function(){return s({type:"next"})}),[s]),c=r.useCallback((function(){return s({type:"prev"})}),[s]),g=r.useCallback((function(e){return s({type:"jump",payload:{pageNumber:e}})}),[s]),p=r.useCallback((function(e){return s({type:"setRowCount",payload:{rowCount:e}})}),[s]),i=r.useMemo((function(){return(u.currentPage-1)*u.perPage}),[u]),l=r.useMemo((function(){return u.currentPage*u.perPage}),[u]),P=r.useCallback((function(e){return e.slice(i,l)}),[i,l]);return{perPage:u.perPage,current:u.currentPage,rowCount:u.rowCount,pageCount:Math.ceil(u.rowCount/u.perPage),from:i,to:l,next:o,prev:c,jump:g,setRowCount:p,pageFilter:P}};
2
+ //# sourceMappingURL=hooks.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"hooks.js","sources":["../../../../../src/table/pagenation/hooks.ts"],"sourcesContent":["import { useCallback, useMemo, useReducer } from \"react\";\nimport { TPageAction, TPageState } from \"./types\";\nimport { INITIAL_PAGE_STATE } from \"./constants\";\n\nfunction pagenationReducer(state: TPageState, action: TPageAction): TPageState {\n switch (action.type) {\n case \"setRowCount\":\n return {\n ...state,\n currentPage: 1,\n rowCount: action.payload.rowCount,\n };\n case \"setPerPage\":\n return {\n ...state,\n perPage: action.payload.perPage,\n };\n case \"next\":\n if (state.currentPage === Math.ceil(state.rowCount / state.perPage)) {\n return state;\n }\n\n return {\n ...state,\n currentPage: state.currentPage + 1,\n };\n case \"prev\":\n if (state.currentPage === 1) {\n return state;\n }\n\n return {\n ...state,\n currentPage: state.currentPage - 1,\n };\n case \"jump\":\n if (\n action.payload.pageNumber < 1 ||\n action.payload.pageNumber > Math.ceil(state.rowCount / state.perPage) ||\n state.currentPage === action.payload.pageNumber\n ) {\n return state;\n }\n\n return {\n ...state,\n currentPage: action.payload.pageNumber,\n };\n default:\n return state;\n }\n}\n\nexport function usePageReducer(initialState?: TPageState) {\n const [state, dispatch] = useReducer(\n pagenationReducer,\n initialState ?? INITIAL_PAGE_STATE\n );\n\n const next = useCallback(() => dispatch({ type: \"next\" }), [dispatch]);\n const prev = useCallback(() => dispatch({ type: \"prev\" }), [dispatch]);\n const jump = useCallback(\n (pageNumber: number) => dispatch({ type: \"jump\", payload: { pageNumber } }),\n [dispatch]\n );\n\n const setRowCount = useCallback(\n (rowCount: number) =>\n dispatch({ type: \"setRowCount\", payload: { rowCount } }),\n [dispatch]\n );\n\n const from = useMemo(() => (state.currentPage - 1) * state.perPage, [state]);\n const to = useMemo(() => state.currentPage * state.perPage, [state]);\n\n const pageFilter = useCallback(\n <T>(data: T[]): T[] => {\n return data.slice(from, to);\n },\n [from, to]\n );\n\n return {\n perPage: state.perPage,\n current: state.currentPage,\n rowCount: state.rowCount,\n pageCount: Math.ceil(state.rowCount / state.perPage),\n from,\n to,\n next,\n prev,\n jump,\n setRowCount,\n pageFilter,\n };\n}\n"],"names":["pagenationReducer","state","action","type","__assign","currentPage","rowCount","payload","perPage","Math","ceil","pageNumber","initialState","_a","useReducer","INITIAL_PAGE_STATE","dispatch","next","useCallback","prev","jump","setRowCount","from","useMemo","to","pageFilter","data","slice","current","pageCount"],"mappings":"sHAIA,SAASA,EAAkBC,EAAmBC,GAC5C,OAAQA,EAAOC,MACb,IAAK,cACH,OAAAC,EAAAA,SAAAA,EAAAA,SAAA,GACKH,GAAK,CACRI,YAAa,EACbC,SAAUJ,EAAOK,QAAQD,WAE7B,IAAK,aACH,OACKF,WAAAA,EAAAA,SAAA,CAAA,EAAAH,IACHO,QAASN,EAAOK,QAAQC,UAE5B,IAAK,OACH,OAAIP,EAAMI,cAAgBI,KAAKC,KAAKT,EAAMK,SAAWL,EAAMO,SAClDP,EAIJG,WAAAA,EAAAA,SAAA,CAAA,EAAAH,IACHI,YAAaJ,EAAMI,YAAc,IAErC,IAAK,OACH,OAA0B,IAAtBJ,EAAMI,YACDJ,EAIJG,WAAAA,EAAAA,SAAA,CAAA,EAAAH,IACHI,YAAaJ,EAAMI,YAAc,IAErC,IAAK,OACH,OACEH,EAAOK,QAAQI,WAAa,GAC5BT,EAAOK,QAAQI,WAAaF,KAAKC,KAAKT,EAAMK,SAAWL,EAAMO,UAC7DP,EAAMI,cAAgBH,EAAOK,QAAQI,WAE9BV,EAIJG,WAAAA,EAAAA,SAAA,CAAA,EAAAH,IACHI,YAAaH,EAAOK,QAAQI,aAEhC,QACE,OAAOV,EAEb,wBAEM,SAAyBW,GACvB,IAAAC,EAAoBC,EAAAA,WACxBd,EACAY,QAAAA,EAAgBG,EAAAA,oBAFXd,OAAOe,OAKRC,EAAOC,EAAAA,aAAY,WAAM,OAAAF,EAAS,CAAEb,KAAM,QAAjB,GAA4B,CAACa,IACtDG,EAAOD,EAAAA,aAAY,WAAM,OAAAF,EAAS,CAAEb,KAAM,QAAjB,GAA4B,CAACa,IACtDI,EAAOF,EAAAA,aACX,SAACP,GAAuB,OAAAK,EAAS,CAAEb,KAAM,OAAQI,QAAS,CAAEI,WAAUA,OACtE,CAACK,IAGGK,EAAcH,eAClB,SAACZ,GACC,OAAAU,EAAS,CAAEb,KAAM,cAAeI,QAAS,CAAED,SAAQA,IAAnD,GACF,CAACU,IAGGM,EAAOC,EAAOA,SAAC,WAAM,OAACtB,EAAMI,YAAc,GAAKJ,EAAMO,OAAO,GAAE,CAACP,IAC/DuB,EAAKD,EAAAA,SAAQ,WAAM,OAAAtB,EAAMI,YAAcJ,EAAMO,UAAS,CAACP,IAEvDwB,EAAaP,eACjB,SAAIQ,GACF,OAAOA,EAAKC,MAAML,EAAME,EAC1B,GACA,CAACF,EAAME,IAGT,MAAO,CACLhB,QAASP,EAAMO,QACfoB,QAAS3B,EAAMI,YACfC,SAAUL,EAAMK,SAChBuB,UAAWpB,KAAKC,KAAKT,EAAMK,SAAWL,EAAMO,SAC5Cc,KAAIA,EACJE,GAAEA,EACFP,KAAIA,EACJE,KAAIA,EACJC,KAAIA,EACJC,YAAWA,EACXI,WAAUA,EAEd"}
@@ -0,0 +1,3 @@
1
+ "use client";
2
+ "use strict";var e=require("react/jsx-runtime"),r=require("react"),n=require("./hooks.js"),t=r.createContext({perPage:0,current:0,pageCount:0,from:0,to:0,rowCount:0,next:function(){throw new Error("Function not implemented.")},prev:function(){throw new Error("Function not implemented.")},jump:function(e){throw new Error("Function not implemented.")},setRowCount:function(e){throw new Error("Function not implemented.")},pageFilter:function(e){throw new Error("Function not implemented.")}});exports.PagenationProvider=function(r){var o,u;return e.jsx(t.Provider,{value:n.usePageReducer({perPage:null!==(o=r.perPage)&&void 0!==o?o:50,currentPage:null!==(u=r.currentPage)&&void 0!==u?u:1,rowCount:r.rowCount}),children:r.children})},exports.usePageContext=function(){return r.useContext(t)};
3
+ //# sourceMappingURL=providers.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"providers.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
@@ -0,0 +1,3 @@
1
+ "use client";
2
+ "use strict";var e=require("react/jsx-runtime"),r=require("./icon.js"),t=require("./provider.js");exports.SortButton=function(n){var o=t.useSortContext(),i=o.key,s=o.asc,c=o.changeKey,u=o.changeOrder,a=i===n.keyName;return e.jsx("div",{onClick:function(e){e.preventDefault(),a?u():c(n.keyName)},className:"cursor-pointer",children:e.jsx(r.SortIcon,{sortOrder:a?s?"ASC":"DESC":"ASC",isSortActive:a})})};
3
+ //# sourceMappingURL=components.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"components.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
@@ -0,0 +1,2 @@
1
+ "use strict";var e=require("../../../node_modules/tslib/tslib.es6.js"),r=require("react"),a=function(r,a){switch(a.type){case"changeKey":return{key:a.payload.key,asc:!0};case"changeOrder":return e.__assign(e.__assign({},r),{asc:!r.asc})}};exports.useSortReducer=function(n){var s,c,t=r.useReducer(a,{key:null!==(s=null==n?void 0:n.key)&&void 0!==s?s:"id",asc:null===(c=null==n?void 0:n.asc)||void 0===c||c}),u=t[0],y=t[1],i=r.useCallback((function(r){return e.__spreadArray([],r,!0).sort((function(e,r){return e[u.key]<r[u.key]?u.asc?-1:1:e[u.key]>r[u.key]?u.asc?1:-1:0}))}),[u]);return{key:u.key,asc:u.asc,changeKey:function(e){y({type:"changeKey",payload:{key:e}})},changeOrder:function(){y({type:"changeOrder"})},sort:i}};
2
+ //# sourceMappingURL=hooks.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"hooks.js","sources":["../../../../../src/table/sort/hooks.ts"],"sourcesContent":["import { useCallback, useReducer } from \"react\";\nimport { TReturnSortReducer, TSortReducer } from \"./types\";\nimport { DataObject } from \"../type\";\n\nconst reducer: TSortReducer = (state, action) => {\n switch (action.type) {\n case \"changeKey\":\n return { key: action.payload.key, asc: true };\n case \"changeOrder\":\n return { ...state, asc: !state.asc };\n }\n};\n\nexport function useSortReducer(initial?: {\n key: string;\n asc?: boolean;\n}): TReturnSortReducer {\n const [state, dispatch] = useReducer(reducer, {\n key: initial?.key ?? \"id\",\n asc: initial?.asc ?? true,\n });\n\n const changeKey = (key: string) => {\n dispatch({ type: \"changeKey\", payload: { key } });\n };\n\n const changeOrder = () => {\n dispatch({ type: \"changeOrder\" });\n };\n\n const sort = useCallback(\n <T extends DataObject>(rows: T[]) =>\n [...rows].sort((a, b) => {\n if (a[state.key] < b[state.key]) {\n return state.asc ? -1 : 1;\n }\n if (a[state.key] > b[state.key]) {\n return state.asc ? 1 : -1;\n }\n return 0;\n }),\n [state]\n );\n\n return { key: state.key, asc: state.asc, changeKey, changeOrder, sort };\n}\n"],"names":["reducer","state","action","type","key","payload","asc","__assign","initial","_c","useReducer","_a","_b","dispatch","sort","useCallback","rows","__spreadArray","a","b","changeKey","changeOrder"],"mappings":"0FAIMA,EAAwB,SAACC,EAAOC,GACpC,OAAQA,EAAOC,MACb,IAAK,YACH,MAAO,CAAEC,IAAKF,EAAOG,QAAQD,IAAKE,KAAK,GACzC,IAAK,cACH,OAAYC,EAAAA,SAAAA,WAAA,CAAA,EAAAN,IAAOK,KAAML,EAAMK,MAErC,yBAEM,SAAyBE,WAIvBC,EAAoBC,EAAUA,WAACV,EAAS,CAC5CI,IAAiB,QAAZO,EAAAH,eAAAA,EAASJ,WAAG,IAAAO,EAAAA,EAAI,KACrBL,IAAiB,QAAZM,EAAAJ,eAAAA,EAASF,WAAG,IAAAM,GAAAA,IAFZX,EAAKQ,EAAA,GAAEI,OAaRC,EAAOC,eACX,SAAuBC,GACrB,OAAAC,EAAAA,cAAA,GAAID,GAAM,GAAAF,MAAK,SAACI,EAAGC,GACjB,OAAID,EAAEjB,EAAMG,KAAOe,EAAElB,EAAMG,KAClBH,EAAMK,KAAO,EAAI,EAEtBY,EAAEjB,EAAMG,KAAOe,EAAElB,EAAMG,KAClBH,EAAMK,IAAM,GAAK,EAEnB,CACT,GARA,GASF,CAACL,IAGH,MAAO,CAAEG,IAAKH,EAAMG,IAAKE,IAAKL,EAAMK,IAAKc,UAtBvB,SAAChB,GACjBS,EAAS,CAAEV,KAAM,YAAaE,QAAS,CAAED,IAAGA,IAC9C,EAoBoDiB,YAlBhC,WAClBR,EAAS,CAAEV,KAAM,eACnB,EAgBiEW,KAAIA,EACvE"}
@@ -1,2 +1,2 @@
1
1
  "use strict";var r=require("react/jsx-runtime"),t=require("react").memo((function(t){var a=t.size||16,e=t.sortOrder||"ASC";return r.jsxs("div",{className:"relative",style:{width:"".concat(a,"px"),height:"".concat(a,"px")},children:[r.jsx("div",{className:"absolute top-1/2 right-0 w-[40%] h-[20%] duration-300 ".concat("ASC"===e?"-translate-y-[250%]":"translate-y-[150%]"," ").concat(t.isSortActive?"bg-gray-700":"bg-gray-200 border border-gray-500")}),r.jsx("div",{className:"absolute top-1/2 right-0 w-[70%] h-[20%] duration-300 -translate-y-1/2 ".concat(t.isSortActive?"bg-gray-700":"bg-gray-200 border border-gray-500")}),r.jsx("div",{className:"absolute top-1/2 right-0 w-full h-[20%] duration-300 ".concat("ASC"===e?"translate-y-[150%]":"-translate-y-[250%]"," ").concat(t.isSortActive?"bg-gray-700":"bg-gray-200 border border-gray-500")})]})}));exports.SortIcon=t;
2
- //# sourceMappingURL=sort-icon.js.map
2
+ //# sourceMappingURL=icon.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"icon.js","sources":["../../../../../src/table/sort/icon.tsx"],"sourcesContent":["import { memo } from \"react\";\n\ntype TPropsSortIcon = {\n sortOrder?: \"ASC\" | \"DESC\";\n isSortActive?: boolean;\n size?: number;\n};\n\nconst SortIcon = memo(function SI(props: TPropsSortIcon) {\n const size = props.size || 16;\n const order = props.sortOrder || \"ASC\";\n\n return (\n <div\n className=\"relative\"\n style={{ width: `${size}px`, height: `${size}px` }}\n >\n <div\n className={`absolute top-1/2 right-0 w-[40%] h-[20%] duration-300 ${\n order === \"ASC\" ? \"-translate-y-[250%]\" : \"translate-y-[150%]\"\n } ${\n props.isSortActive\n ? \"bg-gray-700\"\n : \"bg-gray-200 border border-gray-500\"\n }`}\n ></div>\n <div\n className={`absolute top-1/2 right-0 w-[70%] h-[20%] duration-300 -translate-y-1/2 ${\n props.isSortActive\n ? \"bg-gray-700\"\n : \"bg-gray-200 border border-gray-500\"\n }`}\n ></div>\n <div\n className={`absolute top-1/2 right-0 w-full h-[20%] duration-300 ${\n order === \"ASC\" ? \"translate-y-[150%]\" : \"-translate-y-[250%]\"\n } ${\n props.isSortActive\n ? \"bg-gray-700\"\n : \"bg-gray-200 border border-gray-500\"\n }`}\n ></div>\n </div>\n );\n});\n\nexport { SortIcon };\n"],"names":["SortIcon","memo","props","size","order","sortOrder","_jsxs","className","style","width","height","children","_jsx","concat","isSortActive"],"mappings":"gDAQMA,mBAAeC,MAAC,SAAYC,GAChC,IAAMC,EAAOD,EAAMC,MAAQ,GACrBC,EAAQF,EAAMG,WAAa,MAEjC,OACEC,EAAAA,KACE,MAAA,CAAAC,UAAU,WACVC,MAAO,CAAEC,MAAO,UAAGN,EAAI,MAAMO,OAAQ,UAAGP,EAAI,OAAMQ,SAAA,CAElDC,EAAAA,WACEL,UAAW,gEACC,QAAVH,EAAkB,sBAAwB,qBAE1C,KAAAS,OAAAX,EAAMY,aACF,cACA,wCAGRF,EAAAA,IACE,MAAA,CAAAL,UAAW,2EAAAM,OACTX,EAAMY,aACF,cACA,wCAGRF,EAAAA,IACE,MAAA,CAAAL,UAAW,wDAAAM,OACC,QAAVT,EAAkB,qBAAuB,sBAAqB,MAAAS,OAE9DX,EAAMY,aACF,cACA,0CAKd"}
@@ -0,0 +1,3 @@
1
+ "use client";
2
+ "use strict";var e=require("react/jsx-runtime"),r=require("react"),t=require("./hooks.js"),n=r.createContext({key:"",asc:!1,changeKey:function(){throw new Error("Function not implemented.")},changeOrder:function(){throw new Error("Function not implemented.")},sort:function(){throw new Error("Function not implemented.")}});exports.SortProvider=function(r){return e.jsx(n.Provider,{value:t.useSortReducer(r.initialCondition),children:r.children})},exports.useSortContext=function(){return r.useContext(n)};
3
+ //# sourceMappingURL=provider.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"provider.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
@@ -1,3 +1,3 @@
1
1
  "use client";
2
- import{__assign as e,__rest as r}from"../../node_modules/tslib/tslib.es6.js";import{jsx as t,jsxs as o}from"react/jsx-runtime";import{useTable as l}from"./hook.js";import{TableCell as n}from"./cell.js";import{Sort as i}from"./sort.js";import{TableHeaderElement as c}from"./header.js";import{Pagenation as a}from"./page.js";import{TableFilterProvider as d,TableFilterRemoveButton as s,TableFilter as m}from"./filter.js";import{useState as u}from"react";import{TableFilterForm as p}from"./filter-form.js";function f(r){return t(d,{children:t(h,e({},r))})}function h(d){var f=l(d),h=f.cols,v=f.rows,y=f.rowCount,b=f.sortKey,k=f.sortOrder,N=f.page,g=N.count,x=N.current,j=N.from,C=N.to,w=N.next,D=N.prev,O=N.jump,S=u(!1),z=S[0],A=S[1];return o("div",{className:"w-full",children:[t("div",{className:"flex justify-end",children:t(s,{children:"remove all filters"})}),t("div",{className:"relative w-full h-full max-h-[80vh] border border-gray-200 rounded-md overflow-auto",children:o("table",{className:"table table-auto w-full",children:[t("thead",{children:t("tr",{className:"sticky top-0 border-gray-200 z-20",children:h.map((function(e){return t(c,{label:e.label,sortConponent:"component"!==e.type?t(i,{onClick:e.onClick,isSortedByThis:b===e.key,sortOrder:k}):void 0,filterComponent:"component"!==e.type?t(m,{keyName:e.key,onClick:function(e){e.preventDefault(),A((function(e){return!e}))}}):void 0},e.key)}))})}),o("tbody",{children:[z&&t("tr",{children:t("td",{colSpan:h.length,className:"sticky top-8 left-0 bg-gray-300 w-full shadow-lg rounded-b-2xl py-5 px-2 z-20",children:t("div",{className:"container max-w-[768px] mx-auto",children:o("div",{className:"relative",children:[t("div",{className:"absolute top-0 right-0",children:t("button",{onClick:function(e){e.preventDefault(),A(!1)},children:"close"})}),t("div",{children:t(p,{cols:h})})]})})})}),0===v.length&&t("tr",{children:t("td",{colSpan:h.length,className:"py-5",children:t("p",{className:"text-center font-bold text-lg",children:"NO DATA"})})}),v.map((function(o){var l;return t("tr",{className:"border border-gray-200 hover:bg-gray-100 ".concat((null===(l=v[0])||void 0===l?void 0:l.onClick)?"hover:cursor-pointer":""),onClick:o.onClick,"data-testid":o.id,children:h.map((function(l){var i=l.key,c=r(l,["key"]);return t(n,e({},c,{columnKey:null==l?void 0:l.key,currentRecord:o,children:o[null==l?void 0:l.key]}),i)}))},o.id)}))]})]})}),o("div",{className:"mt-1",children:[o("p",{className:"text-center text-sm text-gray-600",children:[j+1," - ",C<y?C:y," of ",y]}),t("div",{className:"mt-2",children:t(a,{count:g,current:x,jump:O,next:w,prev:D})})]})]})}export{f as default};
2
+ import{__assign as e,__rest as r}from"../../node_modules/tslib/tslib.es6.js";import{jsx as o,jsxs as t}from"react/jsx-runtime";import{useState as l}from"react";import{useTable as n}from"./hook.js";import{TableCell as i}from"./cell.js";import{TableHeaderElement as a}from"./header.js";import{PagenationProvider as c}from"./pagenation/providers.js";import{DisplayRange as d,Pagenation as s}from"./pagenation/components.js";import{FilterProvider as m}from"./filter/provider.js";import{TableFilterRemoveButton as p,TableFilter as u,TableFilterForm as h}from"./filter/components.js";import{SortButton as f}from"./sort/components.js";import{SortProvider as v}from"./sort/provider.js";function y(r){var t;return o(m,{children:o(v,{initialCondition:null===(t=r.initialCondition)||void 0===t?void 0:t.sort,children:o(c,{rowCount:r.rows.length,children:o(b,e({},r))})})})}function b(c){var m=n(c),v=m.cols,y=m.rows,b=l(!1),k=b[0],N=b[1];return t("div",{className:"w-full",children:[o("div",{className:"flex justify-end",children:o(p,{children:"remove all filters"})}),o("div",{className:"relative w-full h-full max-h-[80vh] border border-gray-200 rounded-md overflow-auto",children:t("table",{className:"table table-auto w-full",children:[o("thead",{children:o("tr",{className:"sticky top-0 border-gray-200 z-20",children:v.map((function(e){return o(a,{label:e.label,sortConponent:"component"!==e.type?o(f,{keyName:e.key}):void 0,filterComponent:"component"!==e.type?o(u,{keyName:e.key,onClick:function(e){e.preventDefault(),N((function(e){return!e}))}}):void 0},e.key)}))})}),t("tbody",{children:[k&&o("tr",{children:o("td",{colSpan:v.length,className:"sticky top-8 left-0 bg-gray-300 w-full shadow-lg rounded-b-2xl py-5 px-2 z-20",children:o("div",{className:"container max-w-[768px] mx-auto",children:t("div",{className:"relative",children:[o("div",{className:"absolute top-0 right-0",children:o("button",{onClick:function(e){e.preventDefault(),N(!1)},children:"close"})}),o("div",{children:o(h,{cols:v})})]})})})}),0===y.length&&o("tr",{children:o("td",{colSpan:v.length,className:"py-5",children:o("p",{className:"text-center font-bold text-lg",children:"NO DATA"})})}),y.map((function(t){var l;return o("tr",{className:"border border-gray-200 hover:bg-gray-100 ".concat((null===(l=y[0])||void 0===l?void 0:l.onClick)?"hover:cursor-pointer":""),onClick:t.onClick,"data-testid":t.id,children:v.map((function(l){var n=l.key,a=r(l,["key"]);return o(i,e({},a,{columnKey:null==l?void 0:l.key,currentRecord:t,children:t[null==l?void 0:l.key]}),n)}))},t.id)}))]})]})}),t("div",{className:"mt-1",children:[o(d,{}),o("div",{className:"mt-2",children:o(s,{})})]})]})}export{y as default};
3
3
  //# sourceMappingURL=base.js.map
@@ -0,0 +1,3 @@
1
+ "use client";
2
+ import{jsx as e,jsxs as n,Fragment as l}from"react/jsx-runtime";import{FIlterIcon as t}from"./filter-icon.js";import{useFilterContext as r}from"./provider.js";import{useState as i,useEffect as o}from"react";import{CancelIcon as a}from"../cancel-icon.js";import{STRING_FILTER_OPERATOR as c,NUMBER_FILTER_OPERATOR as u,SELECT_FILTER_OPERATOR as d,FILTER_OPERATOR as f}from"./constants.js";function s(n){var l=r().filterConditions;return e("div",{className:"relative cursor-pointer",onClick:n.onClick,children:e(t,{isFilterActive:l.filter((function(e){return e.key===n.keyName})).length>0})})}function v(n){var l=n.children,t=r(),i=t.clearFilter;if(0!==t.filterConditions.length)return e("button",{onClick:function(e){e.preventDefault(),i()},children:l})}function p(t){var s=r(),p=s.addFilter,h=s.removeFilter,m=s.filterConditions,y=i(""),g=y[0],k=y[1],b=i(""),x=b[0],N=b[1],C=i(""),j=C[0],D=C[1],F=i("string"),w=F[0],z=F[1],A=t.cols.find((function(e){return e.key===g}));return o((function(){D(""),N("")}),[g]),n(l,{children:[n("div",{className:"flex flex-col gap-2 mb-5",children:[e("p",{className:"font-bold text-lg",children:"フィルタ追加"}),n("div",{className:"flex flex-wrap gap-1",children:[n("select",{value:g,onChange:function(e){var n;e.preventDefault(),k(e.target.value);var l=null===(n=t.cols.find((function(n){return n.key===e.target.value})))||void 0===n?void 0:n.type;z(l)},children:[e("option",{value:"",children:"-- 列を選択 --"}),t.cols.filter((function(e){return!!e.label&&!!e.type})).map((function(n){return e("option",{value:n.key,children:n.label},n.key)}))]}),n("select",{value:x,onChange:function(e){e.preventDefault(),N(e.target.value)},disabled:!g,children:[e("option",{value:"",children:g?"-- 条件を選択 --":"-- 列を選択してください --"}),"string"===w&&c.map((function(n){return e("option",{value:n.key,children:n.label},n.key)})),"number"===w&&u.map((function(n){return e("option",{value:n.key,children:n.label},n.key)})),"select"===w&&d.map((function(n){return e("option",{value:n.key,children:n.label},n.key)}))]}),"select"===w?n("select",{value:j,onChange:function(e){e.preventDefault(),D(e.target.value)},children:[e("option",{value:"",children:"-- 未選択 --"}),"select"===A.type&&A.options.map((function(n){return e("option",{value:n.value,children:n.label},n.value)}))]}):e("input",{type:"text",value:j,onChange:function(e){e.preventDefault(),D(e.target.value)},placeholder:"-- 値を入力 --"})]}),e("div",{className:"flex justify-end",children:e("button",{className:"bg-gray-900 text-white py-1 px-2 rounded-md",onClick:function(e){var n;if(e.preventDefault(),g&&x&&("select"===A.type||j)){var l=t.cols.find((function(e){return e.key===g}));p("string"===w?{key:g,operator:x,value:[j]}:"select"===w?{key:g,operator:x,value:j,label:"select"===l.type?null===(n=l.options.find((function(e){return e.value===j})))||void 0===n?void 0:n.label:void 0}:{key:g,operator:x,value:Number(j)})}else alert("全ての項目を入力してください")},children:"追加"})})]}),n("div",{children:[m.length>0&&e("p",{className:"font-bold text-lg",children:"フィルタ一覧"}),e("ul",{className:"flex flex-col gap-1 my-2",children:m.map((function(l){var r,i;return n("li",{className:"flex justify-between",children:[n("p",{children:["「",e("strong",{children:null===(r=t.cols.find((function(e){return e.key===l.key})))||void 0===r?void 0:r.label}),"」 は",e("span",{children:null===(i=f.find((function(e){return e.key===l.operator})))||void 0===i?void 0:i.label}),":",e("span",{children:l.label?l.label:l.value})]}),e("button",{onClick:function(e){e.preventDefault(),h(l.id)},children:e(a,{size:16})})]},l.id)}))}),e("div",{className:"flex justify-center",children:e(v,{children:e("p",{className:"text-gray-600 underline hover:text-gray-800",children:"remove all filters"})})})]})]})}export{s as TableFilter,p as TableFilterForm,v as TableFilterRemoveButton};
3
+ //# sourceMappingURL=components.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"components.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
@@ -0,0 +1,2 @@
1
+ import{__spreadArray as e}from"../../../node_modules/tslib/tslib.es6.js";var l=[{key:"includeText",label:"次の値を含む"}],t=[{key:"eq",label:"次の値と等しい"},{key:"ne",label:"次の値と等しくない"},{key:"gt",label:"次の値より大きい"},{key:"lt",label:"次の値より小さい"},{key:"gte",label:"次の値以上"},{key:"lte",label:"次の値以下"}],b=[{key:"selected",label:"次の値と等しい"},{key:"notSelected",label:"次の値と等しくない"}],a=e(e(e([],l,!0),t,!0),b,!0);export{a as FILTER_OPERATOR,t as NUMBER_FILTER_OPERATOR,b as SELECT_FILTER_OPERATOR,l as STRING_FILTER_OPERATOR};
2
+ //# sourceMappingURL=constants.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"constants.js","sources":["../../../../../src/table/filter/constants.ts"],"sourcesContent":["export const STRING_FILTER_OPERATOR = [\n { key: \"includeText\", label: \"次の値を含む\" },\n] as const;\n\nexport const NUMBER_FILTER_OPERATOR = [\n { key: \"eq\", label: \"次の値と等しい\" },\n { key: \"ne\", label: \"次の値と等しくない\" },\n { key: \"gt\", label: \"次の値より大きい\" },\n { key: \"lt\", label: \"次の値より小さい\" },\n { key: \"gte\", label: \"次の値以上\" },\n { key: \"lte\", label: \"次の値以下\" },\n] as const;\n\nexport const SELECT_FILTER_OPERATOR = [\n { key: \"selected\", label: \"次の値と等しい\" },\n { key: \"notSelected\", label: \"次の値と等しくない\" },\n] as const;\n\nexport const FILTER_OPERATOR = [\n ...STRING_FILTER_OPERATOR,\n ...NUMBER_FILTER_OPERATOR,\n ...SELECT_FILTER_OPERATOR,\n] as const;\n"],"names":["STRING_FILTER_OPERATOR","key","label","NUMBER_FILTER_OPERATOR","SELECT_FILTER_OPERATOR","FILTER_OPERATOR","__spreadArray"],"mappings":"yEAAa,IAAAA,EAAyB,CACpC,CAAEC,IAAK,cAAeC,MAAO,WAGlBC,EAAyB,CACpC,CAAEF,IAAK,KAAMC,MAAO,WACpB,CAAED,IAAK,KAAMC,MAAO,aACpB,CAAED,IAAK,KAAMC,MAAO,YACpB,CAAED,IAAK,KAAMC,MAAO,YACpB,CAAED,IAAK,MAAOC,MAAO,SACrB,CAAED,IAAK,MAAOC,MAAO,UAGVE,EAAyB,CACpC,CAAEH,IAAK,WAAYC,MAAO,WAC1B,CAAED,IAAK,cAAeC,MAAO,cAGlBG,EAAkBC,EAAAA,EAAAA,EAAA,GAC1BN,GAAsB,GACtBG,GAAsB,GACtBC,GAAsB"}
@@ -0,0 +1 @@
1
+ {"version":3,"file":"filter-icon.js","sources":["../../../../../src/table/filter/filter-icon.tsx"],"sourcesContent":["type TPropsFIlterIcon = {\n size?: number;\n isFilterActive?: boolean;\n};\n\nexport function FIlterIcon(props: TPropsFIlterIcon) {\n const size = props.size ?? 16;\n return (\n <div\n className={`duration-300 ${\n props.isFilterActive ? \"text-gray-700\" : \"text-gray-500\"\n }`}\n >\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n xmlnsXlink=\"http://www.w3.org/1999/xlink\"\n version=\"1.1\"\n width={`${size}px`}\n height={`${size}px`}\n viewBox=\"0 0 256 256\"\n xmlSpace=\"preserve\"\n >\n <defs></defs>\n {props.isFilterActive ? (\n <g\n style={{\n stroke: \"none\",\n strokeWidth: 0,\n strokeDasharray: \"none\",\n strokeLinecap: \"butt\",\n strokeLinejoin: \"miter\",\n strokeMiterlimit: 10,\n fill: \"none\",\n fillRule: \"nonzero\",\n opacity: 1,\n }}\n transform=\"translate(1.4065934065934016 1.4065934065934016) scale(2.81 2.81)\"\n >\n <path\n d=\"M 52.537 80.466 V 45.192 L 84.53 2.999 C 85.464 1.768 84.586 0 83.041 0 H 6.959 C 5.414 0 4.536 1.768 5.47 2.999 l 31.994 42.192 v 43.441 c 0 1.064 1.163 1.719 2.073 1.167 l 11.758 -7.127 C 52.065 82.205 52.537 81.368 52.537 80.466 z\"\n style={{\n stroke: \"none\",\n strokeWidth: 1,\n strokeDasharray: \"none\",\n strokeLinecap: \"butt\",\n strokeLinejoin: \"miter\",\n strokeMiterlimit: 10,\n fill: \"currentColor\",\n fillRule: \"nonzero\",\n opacity: 1,\n }}\n transform=\" matrix(1 0 0 1 0 0) \"\n strokeLinecap=\"round\"\n />\n </g>\n ) : (\n <g\n style={{\n stroke: \"none\",\n strokeWidth: 0,\n strokeDasharray: \"none\",\n strokeLinecap: \"butt\",\n strokeLinejoin: \"miter\",\n strokeMiterlimit: 10,\n fill: \"none\",\n fillRule: \"nonzero\",\n opacity: 1,\n }}\n transform=\"translate(1.4065934065934016 1.4065934065934016) scale(2.81 2.81)\"\n >\n <path\n d=\"M 37.882 90 c -0.338 0 -0.676 -0.086 -0.981 -0.258 c -0.629 -0.354 -1.019 -1.02 -1.019 -1.742 V 45.354 L 3.923 3.208 C 3.464 2.604 3.388 1.791 3.726 1.11 S 4.758 0 5.517 0 h 78.966 c 0.76 0 1.453 0.43 1.791 1.11 s 0.262 1.493 -0.197 2.098 L 54.118 45.354 V 79.37 c 0 0.699 -0.365 1.348 -0.963 1.71 l -14.237 8.63 C 38.601 89.903 38.241 90 37.882 90 z M 9.543 4 l 29.932 39.474 c 0.264 0.348 0.406 0.772 0.406 1.208 v 39.767 l 10.236 -6.205 V 44.682 c 0 -0.437 0.143 -0.861 0.406 -1.208 L 80.457 4 H 9.543 z M 52.118 79.37 h 0.01 H 52.118 z\"\n style={{\n stroke: \"none\",\n strokeWidth: 1,\n strokeDasharray: \"none\",\n strokeLinecap: \"butt\",\n strokeLinejoin: \"miter\",\n strokeMiterlimit: 10,\n fill: \"currentColor\",\n fillRule: \"nonzero\",\n opacity: 1,\n }}\n transform=\" matrix(1 0 0 1 0 0) \"\n strokeLinecap=\"round\"\n />\n </g>\n )}\n </svg>\n </div>\n );\n}\n"],"names":["FIlterIcon","props","size","_a","_jsx","className","concat","isFilterActive","children","_jsxs","xmlns","xmlnsXlink","version","width","height","viewBox","xmlSpace","style","stroke","strokeWidth","strokeDasharray","strokeLinecap","strokeLinejoin","strokeMiterlimit","fill","fillRule","opacity","transform","d"],"mappings":"kDAKM,SAAUA,EAAWC,SACnBC,EAAiB,QAAVC,EAAAF,EAAMC,YAAI,IAAAC,EAAAA,EAAI,GAC3B,OACEC,EAAA,MAAA,CACEC,UAAW,gBACTC,OAAAL,EAAMM,eAAiB,gBAAkB,iBACzCC,SAEFC,EACE,MAAA,CAAAC,MAAM,6BACNC,WAAW,+BACXC,QAAQ,MACRC,MAAO,GAAGP,OAAAJ,EAAQ,MAClBY,OAAQ,GAAGR,OAAAJ,EAAQ,MACnBa,QAAQ,cACRC,SAAS,WAAUR,SAAA,CAEnBJ,EAAa,OAAA,IACZH,EAAMM,eACLH,EAAA,IAAA,CACEa,MAAO,CACLC,OAAQ,OACRC,YAAa,EACbC,gBAAiB,OACjBC,cAAe,OACfC,eAAgB,QAChBC,iBAAkB,GAClBC,KAAM,OACNC,SAAU,UACVC,QAAS,GAEXC,UAAU,oEAEVnB,SAAAJ,EAAA,OAAA,CACEwB,EAAE,4OACFX,MAAO,CACLC,OAAQ,OACRC,YAAa,EACbC,gBAAiB,OACjBC,cAAe,OACfC,eAAgB,QAChBC,iBAAkB,GAClBC,KAAM,eACNC,SAAU,UACVC,QAAS,GAEXC,UAAU,wBACVN,cAAc,YAIlBjB,EAAA,IAAA,CACEa,MAAO,CACLC,OAAQ,OACRC,YAAa,EACbC,gBAAiB,OACjBC,cAAe,OACfC,eAAgB,QAChBC,iBAAkB,GAClBC,KAAM,OACNC,SAAU,UACVC,QAAS,GAEXC,UAAU,oEAEVnB,SAAAJ,EAAA,OAAA,CACEwB,EAAE,8hBACFX,MAAO,CACLC,OAAQ,OACRC,YAAa,EACbC,gBAAiB,OACjBC,cAAe,OACfC,eAAgB,QAChBC,iBAAkB,GAClBC,KAAM,eACNC,SAAU,UACVC,QAAS,GAEXC,UAAU,wBACVN,cAAc,gBAO5B"}
@@ -0,0 +1,2 @@
1
+ import{__spreadArray as e,__assign as r}from"../../../node_modules/tslib/tslib.es6.js";import{useReducer as t,useCallback as n}from"react";var i=function(t,n){switch(n.type){case"add":return{filters:e(e([],t.filters,!0),[r({id:(new Date).getTime()},n.payload.filter)],!1)};case"remove":return{filters:t.filters.filter((function(e){return e.id!==n.payload.id}))};case"clear":return{filters:[]}}};function u(){var e=t(i,{filters:[]}),r=e[0],u=e[1],l=n((function(e){return u({type:"add",payload:{filter:e}})}),[u]);return{addFilter:l,removeFilter:n((function(e){return u({type:"remove",payload:{id:e}})}),[u]),clearFilter:n((function(){return u({type:"clear"})}),[u]),filter:n((function(e){return r.filters.reduce((function(e,r){switch(r.operator){case"includeText":return e.filter((function(e){var t=e[r.key];return"string"==typeof t&&r.value.some((function(e){return t.includes(e)}))}));case"eq":case"selected":return e.filter((function(e){return e[r.key]===r.value}));case"ne":case"notSelected":return e.filter((function(e){return e[r.key]!==r.value}));case"gt":return e.filter((function(e){return e[r.key]>r.value}));case"lt":return e.filter((function(e){return e[r.key]<r.value}));case"gte":return e.filter((function(e){return e[r.key]>=r.value}));case"lte":return e.filter((function(e){return e[r.key]<=r.value}))}}),e)}),[r]),filterConditions:r.filters}}export{u as useFilterReducer};
2
+ //# sourceMappingURL=hooks.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"hooks.js","sources":["../../../../../src/table/filter/hooks.ts"],"sourcesContent":["import { useCallback, useReducer } from \"react\";\nimport { TFilter, TFilterReducer, TReturnUseFilterReducer } from \"./types\";\nimport { DataObject } from \"../type\";\n\nconst reducer: TFilterReducer = (state, action) => {\n switch (action.type) {\n case \"add\":\n return {\n filters: [\n ...state.filters,\n { id: new Date().getTime(), ...action.payload.filter },\n ],\n };\n case \"remove\":\n return {\n filters: state.filters.filter((f) => f.id !== action.payload.id),\n };\n case \"clear\":\n return { filters: [] };\n }\n};\n\nexport function useFilterReducer(): TReturnUseFilterReducer {\n const [state, dispatch] = useReducer(reducer, { filters: [] });\n\n const addFilter = useCallback(\n (filter: TFilter) => dispatch({ type: \"add\", payload: { filter } }),\n [dispatch]\n );\n const removeFilter = useCallback(\n (id: number) => dispatch({ type: \"remove\", payload: { id } }),\n [dispatch]\n );\n const clearFilter = useCallback(\n () => dispatch({ type: \"clear\" }),\n [dispatch]\n );\n\n const filter = useCallback(\n <T extends DataObject>(rows: T[]): T[] => {\n return state.filters.reduce((acc, filter) => {\n switch (filter.operator) {\n case \"includeText\":\n return acc.filter((row) => {\n const value = row[filter.key];\n if (typeof value === \"string\") {\n return filter.value.some((v) => value.includes(v));\n }\n return false;\n });\n case \"eq\":\n return acc.filter((row) => row[filter.key] === filter.value);\n case \"ne\":\n return acc.filter((row) => row[filter.key] !== filter.value);\n case \"gt\":\n return acc.filter((row) => row[filter.key] > filter.value);\n case \"lt\":\n return acc.filter((row) => row[filter.key] < filter.value);\n case \"gte\":\n return acc.filter((row) => row[filter.key] >= filter.value);\n case \"lte\":\n return acc.filter((row) => row[filter.key] <= filter.value);\n case \"selected\":\n return acc.filter((row) => row[filter.key] === filter.value);\n case \"notSelected\":\n return acc.filter((row) => row[filter.key] !== filter.value);\n }\n }, rows);\n },\n [state]\n );\n\n return {\n addFilter,\n removeFilter,\n clearFilter,\n filter,\n filterConditions: state.filters,\n };\n}\n"],"names":["reducer","state","action","type","filters","__spreadArray","__assign","id","Date","getTime","payload","filter","f","useFilterReducer","_a","useReducer","dispatch","addFilter","useCallback","removeFilter","clearFilter","rows","reduce","acc","operator","row","value","key","some","v","includes","filterConditions"],"mappings":"2IAIA,IAAMA,EAA0B,SAACC,EAAOC,GACtC,OAAQA,EAAOC,MACb,IAAK,MACH,MAAO,CACLC,QAAOC,EAAAA,EAAA,GACFJ,EAAMG,SAAO,GAAA,CACdE,EAAA,CAAAC,IAAI,IAAIC,MAAOC,WAAcP,EAAOQ,QAAQC,UAC/C,IAEL,IAAK,SACH,MAAO,CACLP,QAASH,EAAMG,QAAQO,QAAO,SAACC,GAAM,OAAAA,EAAEL,KAAOL,EAAOQ,QAAQH,EAAxB,KAEzC,IAAK,QACH,MAAO,CAAEH,QAAS,IAExB,WAEgBS,IACR,IAAAC,EAAoBC,EAAWf,EAAS,CAAEI,QAAS,KAAlDH,OAAOe,OAERC,EAAYC,GAChB,SAACP,GAAoB,OAAAK,EAAS,CAAEb,KAAM,MAAOO,QAAS,CAAEC,OAAMA,OAC9D,CAACK,IA6CH,MAAO,CACLC,UAASA,EACTE,aA7CmBD,GACnB,SAACX,GAAe,OAAAS,EAAS,CAAEb,KAAM,SAAUO,QAAS,CAAEH,GAAEA,OACxD,CAACS,IA4CDI,YA1CkBF,GAClB,WAAM,OAAAF,EAAS,CAAEb,KAAM,SAAjB,GACN,CAACa,IAyCDL,OAtCaO,GACb,SAAuBG,GACrB,OAAOpB,EAAMG,QAAQkB,QAAO,SAACC,EAAKZ,GAChC,OAAQA,EAAOa,UACb,IAAK,cACH,OAAOD,EAAIZ,QAAO,SAACc,GACjB,IAAMC,EAAQD,EAAId,EAAOgB,KACzB,MAAqB,iBAAVD,GACFf,EAAOe,MAAME,MAAK,SAACC,GAAM,OAAAH,EAAMI,SAASD,EAAE,GAGrD,IACF,IAAK,KAYL,IAAK,WACH,OAAON,EAAIZ,QAAO,SAACc,GAAQ,OAAAA,EAAId,EAAOgB,OAAShB,EAAOe,KAAK,IAX7D,IAAK,KAYL,IAAK,cACH,OAAOH,EAAIZ,QAAO,SAACc,GAAQ,OAAAA,EAAId,EAAOgB,OAAShB,EAAOe,KAAK,IAX7D,IAAK,KACH,OAAOH,EAAIZ,QAAO,SAACc,GAAQ,OAAAA,EAAId,EAAOgB,KAAOhB,EAAOe,KAAK,IAC3D,IAAK,KACH,OAAOH,EAAIZ,QAAO,SAACc,GAAQ,OAAAA,EAAId,EAAOgB,KAAOhB,EAAOe,KAAK,IAC3D,IAAK,MACH,OAAOH,EAAIZ,QAAO,SAACc,GAAQ,OAAAA,EAAId,EAAOgB,MAAQhB,EAAOe,KAAK,IAC5D,IAAK,MACH,OAAOH,EAAIZ,QAAO,SAACc,GAAQ,OAAAA,EAAId,EAAOgB,MAAQhB,EAAOe,KAAK,IAM/D,GAAEL,EACL,GACA,CAACpB,IAQD8B,iBAAkB9B,EAAMG,QAE5B"}
@@ -0,0 +1,3 @@
1
+ "use client";
2
+ import{jsx as r}from"react/jsx-runtime";import{createContext as t,useContext as i}from"react";import{useFilterReducer as n}from"./hooks.js";var e=t({addFilter:function(){},removeFilter:function(){},clearFilter:function(){},filter:function(){return[]},filterConditions:[]});function o(t){var i=t.children;return r(e.Provider,{value:n(),children:i})}function c(){return i(e)}export{o as FilterProvider,c as useFilterContext};
3
+ //# sourceMappingURL=provider.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"provider.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
@@ -1,2 +1,2 @@
1
- import{__spreadArray as r,__assign as e}from"../../node_modules/tslib/tslib.es6.js";import{useState as o,useMemo as t,useEffect as n}from"react";import{usePageReducer as i}from"./page.js";import{useTableFilterContext as u}from"./filter.js";function l(l){var c=o({key:"id",order:"ASC"}),s=c[0],f=c[1],d=u(),m=d.filter,a=d.addFilter,p=d.removeFilter,k=d.clearFilter,y=d.filterConditions,C=i({perPage:50,currentPage:1,rowCount:l.rows.length}),g=C.currentPage,v=C.pageCount,w=C.from,S=C.to,A=C.next,j=C.prev,h=C.jump,x=C.setRowCount,F=l.cols,P=t((function(){return m(l.rows)}),[m,l.rows]);n((function(){x(P.length)}),[P.length]);var b=t((function(){return r([],P,!0).sort((function(r,e){return r[s.key]<e[s.key]?"ASC"===s.order?-1:1:r[s.key]>e[s.key]?"ASC"===s.order?1:-1:0}))}),[P,s.key,s.order]),D=t((function(){return b.slice(w,S)}),[w,S,b]);return{cols:F.map((function(r){return e(e({},r),{onClick:function(e){e.preventDefault(),s.key===r.key?f({key:r.key,order:"ASC"===s.order?"DESC":"ASC"}):f({key:r.key,order:"ASC"})}})})),rows:D,rowCount:P.length,sortKey:s.key,sortOrder:s.order,page:{from:w,to:S,count:v,current:g,next:A,prev:j,jump:h},filter:{add:a,remove:p,clear:k,conditions:y}}}export{l as useTable};
1
+ import{useMemo as r,useEffect as t}from"react";import{usePageContext as o}from"./pagenation/providers.js";import"react/jsx-runtime";import{useFilterContext as n}from"./filter/provider.js";import"./filter/constants.js";import"./sort/icon.js";import{useSortContext as i}from"./sort/provider.js";function e(e){var s=n().filter,p=i().sort,f=o(),m=f.setRowCount,c=f.pageFilter,u=r((function(){return s(e.rows)}),[s,e.rows]);t((function(){m(u.length)}),[u.length]);var a=r((function(){return p(u)}),[u,p]),l=r((function(){return c(a)}),[c,a]);return{cols:e.cols,rows:l}}export{e as useTable};
2
2
  //# sourceMappingURL=hook.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"hook.js","sources":["../../../../src/table/hook.ts"],"sourcesContent":["import { useEffect, useMemo, useState } from \"react\";\nimport { DataObject, TPropsTable } from \"./type\";\nimport { usePageReducer } from \"./page\";\nimport { useTableFilterContext } from \"./filter\";\n\ntype State = {\n key: string;\n order: \"ASC\" | \"DESC\";\n};\n\nexport function useTable<T extends DataObject>(props: TPropsTable<T>) {\n const [key, changeKey] = useState<State>({ key: \"id\", order: \"ASC\" });\n const { filter, addFilter, removeFilter, clearFilter, filterConditions } =\n useTableFilterContext();\n const { currentPage, pageCount, from, to, next, prev, jump, setRowCount } =\n usePageReducer({\n perPage: 50,\n currentPage: 1,\n rowCount: props.rows.length,\n });\n\n const { cols } = props;\n\n const filteredRows = useMemo(() => filter(props.rows), [filter, props.rows]);\n\n useEffect(() => {\n setRowCount(filteredRows.length);\n }, [filteredRows.length]);\n\n const sortedRows = useMemo(\n () =>\n [...filteredRows].sort((a, b) => {\n if (a[key.key] < b[key.key]) {\n return key.order === \"ASC\" ? -1 : 1;\n }\n if (a[key.key] > b[key.key]) {\n return key.order === \"ASC\" ? 1 : -1;\n }\n return 0;\n }),\n [filteredRows, key.key, key.order]\n );\n\n const pagedRows = useMemo(\n () => sortedRows.slice(from, to),\n [from, to, sortedRows]\n );\n\n const colsWithSort = cols.map((col) => ({\n ...col,\n onClick: (e: React.MouseEvent<HTMLElement>) => {\n e.preventDefault();\n if (key.key === col.key) {\n changeKey({\n key: col.key,\n order: key.order === \"ASC\" ? \"DESC\" : \"ASC\",\n });\n } else {\n changeKey({ key: col.key, order: \"ASC\" });\n }\n },\n }));\n\n return {\n cols: colsWithSort,\n rows: pagedRows,\n rowCount: filteredRows.length,\n sortKey: key.key,\n sortOrder: key.order,\n page: {\n from,\n to,\n count: pageCount,\n current: currentPage,\n next,\n prev,\n jump,\n },\n filter: {\n add: addFilter,\n remove: removeFilter,\n clear: clearFilter,\n conditions: filterConditions,\n },\n };\n}\n"],"names":["useTable","props","_a","useState","key","order","changeKey","_b","useTableFilterContext","filter","addFilter","removeFilter","clearFilter","filterConditions","_c","usePageReducer","perPage","currentPage","rowCount","rows","length","pageCount","from","to","next","prev","jump","setRowCount","cols","filteredRows","useMemo","useEffect","sortedRows","__spreadArray","sort","a","b","pagedRows","slice","map","col","onClick","e","preventDefault","sortKey","sortOrder","page","count","current","add","remove","clear","conditions"],"mappings":"gPAUM,SAAUA,EAA+BC,GACvC,IAAAC,EAAmBC,EAAgB,CAAEC,IAAK,KAAMC,MAAO,QAAtDD,OAAKE,OACNC,EACJC,IADMC,EAAMF,EAAAE,OAAEC,EAASH,EAAAG,UAAEC,iBAAcC,gBAAaC,qBAEhDC,EACJC,EAAe,CACbC,QAAS,GACTC,YAAa,EACbC,SAAUjB,EAAMkB,KAAKC,SAJjBH,EAAWH,EAAAG,YAAEI,cAAWC,EAAIR,EAAAQ,KAAEC,EAAET,EAAAS,GAAEC,EAAIV,EAAAU,KAAEC,EAAIX,EAAAW,KAAEC,EAAIZ,EAAAY,KAAEC,EAAWb,EAAAa,YAO/DC,EAAS3B,EAAK2B,KAEhBC,EAAeC,GAAQ,WAAM,OAAArB,EAAOR,EAAMkB,KAAK,GAAE,CAACV,EAAQR,EAAMkB,OAEtEY,GAAU,WACRJ,EAAYE,EAAaT,OAC3B,GAAG,CAACS,EAAaT,SAEjB,IAAMY,EAAaF,GACjB,WACE,OAAAG,EAAA,GAAIJ,GAAc,GAAAK,MAAK,SAACC,EAAGC,GACzB,OAAID,EAAE/B,EAAIA,KAAOgC,EAAEhC,EAAIA,KACA,QAAdA,EAAIC,OAAmB,EAAI,EAEhC8B,EAAE/B,EAAIA,KAAOgC,EAAEhC,EAAIA,KACA,QAAdA,EAAIC,MAAkB,GAAK,EAE7B,CACT,GARA,GASF,CAACwB,EAAczB,EAAIA,IAAKA,EAAIC,QAGxBgC,EAAYP,GAChB,WAAM,OAAAE,EAAWM,MAAMhB,EAAMC,EAAG,GAChC,CAACD,EAAMC,EAAIS,IAkBb,MAAO,CACLJ,KAhBmBA,EAAKW,KAAI,SAACC,GAAQ,cAClCA,GAAG,CACNC,QAAS,SAACC,GACRA,EAAEC,iBACEvC,EAAIA,MAAQoC,EAAIpC,IAClBE,EAAU,CACRF,IAAKoC,EAAIpC,IACTC,MAAqB,QAAdD,EAAIC,MAAkB,OAAS,QAGxCC,EAAU,CAAEF,IAAKoC,EAAIpC,IAAKC,MAAO,OAErC,GACA,IAIAc,KAAMkB,EACNnB,SAAUW,EAAaT,OACvBwB,QAASxC,EAAIA,IACbyC,UAAWzC,EAAIC,MACfyC,KAAM,CACJxB,KAAIA,EACJC,GAAEA,EACFwB,MAAO1B,EACP2B,QAAS/B,EACTO,KAAIA,EACJC,KAAIA,EACJC,KAAIA,GAENjB,OAAQ,CACNwC,IAAKvC,EACLwC,OAAQvC,EACRwC,MAAOvC,EACPwC,WAAYvC,GAGlB"}
1
+ {"version":3,"file":"hook.js","sources":["../../../../src/table/hook.ts"],"sourcesContent":["import { useEffect, useMemo } from \"react\";\nimport { DataObject, TPropsTable } from \"./type\";\nimport { usePageContext } from \"./pagenation/providers\";\nimport { useFilterContext } from \"./filter\";\nimport { useSortContext } from \"./sort\";\n\nexport function useTable<T extends DataObject>(props: TPropsTable<T>) {\n const { filter } = useFilterContext();\n const { sort } = useSortContext();\n const { setRowCount, pageFilter } = usePageContext();\n\n const filteredRows = useMemo(() => filter(props.rows), [filter, props.rows]);\n\n useEffect(() => {\n setRowCount(filteredRows.length);\n }, [filteredRows.length]);\n\n const sortedRows = useMemo(() => sort(filteredRows), [filteredRows, sort]);\n\n const pageRows = useMemo(\n () => pageFilter(sortedRows),\n [pageFilter, sortedRows]\n );\n\n return {\n cols: props.cols,\n rows: pageRows,\n };\n}\n"],"names":["useTable","props","filter","useFilterContext","sort","useSortContext","_a","usePageContext","setRowCount","pageFilter","filteredRows","useMemo","rows","useEffect","length","sortedRows","pageRows","cols"],"mappings":"qSAMM,SAAUA,EAA+BC,GACrC,IAAAC,EAAWC,WACXC,EAASC,SACXC,EAA8BC,IAA5BC,EAAWF,EAAAE,YAAEC,EAAUH,EAAAG,WAEzBC,EAAeC,GAAQ,WAAM,OAAAT,EAAOD,EAAMW,KAAK,GAAE,CAACV,EAAQD,EAAMW,OAEtEC,GAAU,WACRL,EAAYE,EAAaI,OAC3B,GAAG,CAACJ,EAAaI,SAEjB,IAAMC,EAAaJ,GAAQ,WAAM,OAAAP,EAAKM,KAAe,CAACA,EAAcN,IAE9DY,EAAWL,GACf,WAAM,OAAAF,EAAWM,KACjB,CAACN,EAAYM,IAGf,MAAO,CACLE,KAAMhB,EAAMgB,KACZL,KAAMI,EAEV"}
@@ -0,0 +1,3 @@
1
+ "use client";
2
+ import{jsxs as t,jsx as n}from"react/jsx-runtime";import{usePageContext as e}from"./providers.js";function r(){var r=e(),c=r.current,o=r.pageCount,i=r.jump,u=r.prev,s=r.next;return t("div",{className:"flex justify-center gap-2",children:[n("button",{className:"text-sm",onClick:function(){return i(1)},disabled:1===c,children:"≪"}),n("button",{className:"text-sm",onClick:function(){return u()},disabled:1===c,children:"<"}),Array.from({length:o},(function(t,n){return n+1})).filter((function(t){return c-2<=t&&t<=c+2})).map((function(t){return n("button",{className:"text-sm ".concat(c===t?"text-blue-600":""),onClick:function(){return i(t)},children:t},t)})),n("button",{className:"text-sm",onClick:function(){return s()},disabled:c===o,children:">"}),n("button",{className:"text-sm",onClick:function(){return i(o)},disabled:c===o,children:"≫"})]})}function c(){var n=e(),r=n.from,c=n.to,o=n.rowCount;return t("p",{className:"text-center text-sm text-gray-600",children:[r+1," - ",c<o?c:o," of ",o]})}export{c as DisplayRange,r as Pagenation};
3
+ //# sourceMappingURL=components.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"components.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
@@ -0,0 +1,2 @@
1
+ var r={perPage:50,currentPage:1,rowCount:0};export{r as INITIAL_PAGE_STATE};
2
+ //# sourceMappingURL=constants.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"constants.js","sources":["../../../../../src/table/pagenation/constants.ts"],"sourcesContent":["import { TPageState } from \"./types\";\n\nexport const INITIAL_PAGE_STATE: TPageState = {\n perPage: 50,\n currentPage: 1,\n rowCount: 0,\n};\n"],"names":["INITIAL_PAGE_STATE","perPage","currentPage","rowCount"],"mappings":"AAEa,IAAAA,EAAiC,CAC5CC,QAAS,GACTC,YAAa,EACbC,SAAU"}
@@ -0,0 +1,2 @@
1
+ import{__assign as e}from"../../../node_modules/tslib/tslib.es6.js";import{useReducer as r,useCallback as t,useMemo as n}from"react";import{INITIAL_PAGE_STATE as u}from"./constants.js";function a(r,t){switch(t.type){case"setRowCount":return e(e({},r),{currentPage:1,rowCount:t.payload.rowCount});case"setPerPage":return e(e({},r),{perPage:t.payload.perPage});case"next":return r.currentPage===Math.ceil(r.rowCount/r.perPage)?r:e(e({},r),{currentPage:r.currentPage+1});case"prev":return 1===r.currentPage?r:e(e({},r),{currentPage:r.currentPage-1});case"jump":return t.payload.pageNumber<1||t.payload.pageNumber>Math.ceil(r.rowCount/r.perPage)||r.currentPage===t.payload.pageNumber?r:e(e({},r),{currentPage:t.payload.pageNumber});default:return r}}function o(e){var o=r(a,null!=e?e:u),p=o[0],c=o[1],g=t((function(){return c({type:"next"})}),[c]),P=t((function(){return c({type:"prev"})}),[c]),i=t((function(e){return c({type:"jump",payload:{pageNumber:e}})}),[c]),l=t((function(e){return c({type:"setRowCount",payload:{rowCount:e}})}),[c]),s=n((function(){return(p.currentPage-1)*p.perPage}),[p]),m=n((function(){return p.currentPage*p.perPage}),[p]),f=t((function(e){return e.slice(s,m)}),[s,m]);return{perPage:p.perPage,current:p.currentPage,rowCount:p.rowCount,pageCount:Math.ceil(p.rowCount/p.perPage),from:s,to:m,next:g,prev:P,jump:i,setRowCount:l,pageFilter:f}}export{o as usePageReducer};
2
+ //# sourceMappingURL=hooks.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"hooks.js","sources":["../../../../../src/table/pagenation/hooks.ts"],"sourcesContent":["import { useCallback, useMemo, useReducer } from \"react\";\nimport { TPageAction, TPageState } from \"./types\";\nimport { INITIAL_PAGE_STATE } from \"./constants\";\n\nfunction pagenationReducer(state: TPageState, action: TPageAction): TPageState {\n switch (action.type) {\n case \"setRowCount\":\n return {\n ...state,\n currentPage: 1,\n rowCount: action.payload.rowCount,\n };\n case \"setPerPage\":\n return {\n ...state,\n perPage: action.payload.perPage,\n };\n case \"next\":\n if (state.currentPage === Math.ceil(state.rowCount / state.perPage)) {\n return state;\n }\n\n return {\n ...state,\n currentPage: state.currentPage + 1,\n };\n case \"prev\":\n if (state.currentPage === 1) {\n return state;\n }\n\n return {\n ...state,\n currentPage: state.currentPage - 1,\n };\n case \"jump\":\n if (\n action.payload.pageNumber < 1 ||\n action.payload.pageNumber > Math.ceil(state.rowCount / state.perPage) ||\n state.currentPage === action.payload.pageNumber\n ) {\n return state;\n }\n\n return {\n ...state,\n currentPage: action.payload.pageNumber,\n };\n default:\n return state;\n }\n}\n\nexport function usePageReducer(initialState?: TPageState) {\n const [state, dispatch] = useReducer(\n pagenationReducer,\n initialState ?? INITIAL_PAGE_STATE\n );\n\n const next = useCallback(() => dispatch({ type: \"next\" }), [dispatch]);\n const prev = useCallback(() => dispatch({ type: \"prev\" }), [dispatch]);\n const jump = useCallback(\n (pageNumber: number) => dispatch({ type: \"jump\", payload: { pageNumber } }),\n [dispatch]\n );\n\n const setRowCount = useCallback(\n (rowCount: number) =>\n dispatch({ type: \"setRowCount\", payload: { rowCount } }),\n [dispatch]\n );\n\n const from = useMemo(() => (state.currentPage - 1) * state.perPage, [state]);\n const to = useMemo(() => state.currentPage * state.perPage, [state]);\n\n const pageFilter = useCallback(\n <T>(data: T[]): T[] => {\n return data.slice(from, to);\n },\n [from, to]\n );\n\n return {\n perPage: state.perPage,\n current: state.currentPage,\n rowCount: state.rowCount,\n pageCount: Math.ceil(state.rowCount / state.perPage),\n from,\n to,\n next,\n prev,\n jump,\n setRowCount,\n pageFilter,\n };\n}\n"],"names":["pagenationReducer","state","action","type","__assign","currentPage","rowCount","payload","perPage","Math","ceil","pageNumber","usePageReducer","initialState","_a","useReducer","INITIAL_PAGE_STATE","dispatch","next","useCallback","prev","jump","setRowCount","from","useMemo","to","pageFilter","data","slice","current","pageCount"],"mappings":"yLAIA,SAASA,EAAkBC,EAAmBC,GAC5C,OAAQA,EAAOC,MACb,IAAK,cACH,OAAAC,EAAAA,EAAA,GACKH,GAAK,CACRI,YAAa,EACbC,SAAUJ,EAAOK,QAAQD,WAE7B,IAAK,aACH,OACKF,EAAAA,EAAA,CAAA,EAAAH,IACHO,QAASN,EAAOK,QAAQC,UAE5B,IAAK,OACH,OAAIP,EAAMI,cAAgBI,KAAKC,KAAKT,EAAMK,SAAWL,EAAMO,SAClDP,EAIJG,EAAAA,EAAA,CAAA,EAAAH,IACHI,YAAaJ,EAAMI,YAAc,IAErC,IAAK,OACH,OAA0B,IAAtBJ,EAAMI,YACDJ,EAIJG,EAAAA,EAAA,CAAA,EAAAH,IACHI,YAAaJ,EAAMI,YAAc,IAErC,IAAK,OACH,OACEH,EAAOK,QAAQI,WAAa,GAC5BT,EAAOK,QAAQI,WAAaF,KAAKC,KAAKT,EAAMK,SAAWL,EAAMO,UAC7DP,EAAMI,cAAgBH,EAAOK,QAAQI,WAE9BV,EAIJG,EAAAA,EAAA,CAAA,EAAAH,IACHI,YAAaH,EAAOK,QAAQI,aAEhC,QACE,OAAOV,EAEb,CAEM,SAAUW,EAAeC,GACvB,IAAAC,EAAoBC,EACxBf,EACAa,QAAAA,EAAgBG,GAFXf,OAAOgB,OAKRC,EAAOC,GAAY,WAAM,OAAAF,EAAS,CAAEd,KAAM,QAAjB,GAA4B,CAACc,IACtDG,EAAOD,GAAY,WAAM,OAAAF,EAAS,CAAEd,KAAM,QAAjB,GAA4B,CAACc,IACtDI,EAAOF,GACX,SAACR,GAAuB,OAAAM,EAAS,CAAEd,KAAM,OAAQI,QAAS,CAAEI,WAAUA,OACtE,CAACM,IAGGK,EAAcH,GAClB,SAACb,GACC,OAAAW,EAAS,CAAEd,KAAM,cAAeI,QAAS,CAAED,SAAQA,IAAnD,GACF,CAACW,IAGGM,EAAOC,GAAQ,WAAM,OAACvB,EAAMI,YAAc,GAAKJ,EAAMO,OAAO,GAAE,CAACP,IAC/DwB,EAAKD,GAAQ,WAAM,OAAAvB,EAAMI,YAAcJ,EAAMO,UAAS,CAACP,IAEvDyB,EAAaP,GACjB,SAAIQ,GACF,OAAOA,EAAKC,MAAML,EAAME,EAC1B,GACA,CAACF,EAAME,IAGT,MAAO,CACLjB,QAASP,EAAMO,QACfqB,QAAS5B,EAAMI,YACfC,SAAUL,EAAMK,SAChBwB,UAAWrB,KAAKC,KAAKT,EAAMK,SAAWL,EAAMO,SAC5Ce,KAAIA,EACJE,GAAEA,EACFP,KAAIA,EACJE,KAAIA,EACJC,KAAIA,EACJC,YAAWA,EACXI,WAAUA,EAEd"}
@@ -0,0 +1,3 @@
1
+ "use client";
2
+ import{jsx as n}from"react/jsx-runtime";import{createContext as r,useContext as o}from"react";import{usePageReducer as t}from"./hooks.js";var e=r({perPage:0,current:0,pageCount:0,from:0,to:0,rowCount:0,next:function(){throw new Error("Function not implemented.")},prev:function(){throw new Error("Function not implemented.")},jump:function(n){throw new Error("Function not implemented.")},setRowCount:function(n){throw new Error("Function not implemented.")},pageFilter:function(n){throw new Error("Function not implemented.")}});function i(r){var o,i;return n(e.Provider,{value:t({perPage:null!==(o=r.perPage)&&void 0!==o?o:50,currentPage:null!==(i=r.currentPage)&&void 0!==i?i:1,rowCount:r.rowCount}),children:r.children})}function u(){return o(e)}export{i as PagenationProvider,u as usePageContext};
3
+ //# sourceMappingURL=providers.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"providers.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
@@ -0,0 +1,3 @@
1
+ "use client";
2
+ import{jsx as r}from"react/jsx-runtime";import{SortIcon as e}from"./icon.js";import{useSortContext as o}from"./provider.js";function t(t){var i=o(),n=i.key,c=i.asc,a=i.changeKey,m=i.changeOrder,s=n===t.keyName;return r("div",{onClick:function(r){r.preventDefault(),s?m():a(t.keyName)},className:"cursor-pointer",children:r(e,{sortOrder:s?c?"ASC":"DESC":"ASC",isSortActive:s})})}export{t as SortButton};
3
+ //# sourceMappingURL=components.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"components.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
@@ -0,0 +1,2 @@
1
+ import{__spreadArray as e,__assign as n}from"../../../node_modules/tslib/tslib.es6.js";import{useReducer as r,useCallback as c}from"react";var a=function(e,r){switch(r.type){case"changeKey":return{key:r.payload.key,asc:!0};case"changeOrder":return n(n({},e),{asc:!e.asc})}};function t(n){var t,o,s=r(a,{key:null!==(t=null==n?void 0:n.key)&&void 0!==t?t:"id",asc:null===(o=null==n?void 0:n.asc)||void 0===o||o}),y=s[0],i=s[1],u=c((function(n){return e([],n,!0).sort((function(e,n){return e[y.key]<n[y.key]?y.asc?-1:1:e[y.key]>n[y.key]?y.asc?1:-1:0}))}),[y]);return{key:y.key,asc:y.asc,changeKey:function(e){i({type:"changeKey",payload:{key:e}})},changeOrder:function(){i({type:"changeOrder"})},sort:u}}export{t as useSortReducer};
2
+ //# sourceMappingURL=hooks.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"hooks.js","sources":["../../../../../src/table/sort/hooks.ts"],"sourcesContent":["import { useCallback, useReducer } from \"react\";\nimport { TReturnSortReducer, TSortReducer } from \"./types\";\nimport { DataObject } from \"../type\";\n\nconst reducer: TSortReducer = (state, action) => {\n switch (action.type) {\n case \"changeKey\":\n return { key: action.payload.key, asc: true };\n case \"changeOrder\":\n return { ...state, asc: !state.asc };\n }\n};\n\nexport function useSortReducer(initial?: {\n key: string;\n asc?: boolean;\n}): TReturnSortReducer {\n const [state, dispatch] = useReducer(reducer, {\n key: initial?.key ?? \"id\",\n asc: initial?.asc ?? true,\n });\n\n const changeKey = (key: string) => {\n dispatch({ type: \"changeKey\", payload: { key } });\n };\n\n const changeOrder = () => {\n dispatch({ type: \"changeOrder\" });\n };\n\n const sort = useCallback(\n <T extends DataObject>(rows: T[]) =>\n [...rows].sort((a, b) => {\n if (a[state.key] < b[state.key]) {\n return state.asc ? -1 : 1;\n }\n if (a[state.key] > b[state.key]) {\n return state.asc ? 1 : -1;\n }\n return 0;\n }),\n [state]\n );\n\n return { key: state.key, asc: state.asc, changeKey, changeOrder, sort };\n}\n"],"names":["reducer","state","action","type","key","payload","asc","__assign","useSortReducer","initial","_c","useReducer","_a","_b","dispatch","sort","useCallback","rows","__spreadArray","a","b","changeKey","changeOrder"],"mappings":"2IAIA,IAAMA,EAAwB,SAACC,EAAOC,GACpC,OAAQA,EAAOC,MACb,IAAK,YACH,MAAO,CAAEC,IAAKF,EAAOG,QAAQD,IAAKE,KAAK,GACzC,IAAK,cACH,OAAYC,EAAAA,EAAA,CAAA,EAAAN,IAAOK,KAAML,EAAMK,MAErC,EAEM,SAAUE,EAAeC,WAIvBC,EAAoBC,EAAWX,EAAS,CAC5CI,IAAiB,QAAZQ,EAAAH,eAAAA,EAASL,WAAG,IAAAQ,EAAAA,EAAI,KACrBN,IAAiB,QAAZO,EAAAJ,eAAAA,EAASH,WAAG,IAAAO,GAAAA,IAFZZ,EAAKS,EAAA,GAAEI,OAaRC,EAAOC,GACX,SAAuBC,GACrB,OAAAC,EAAA,GAAID,GAAM,GAAAF,MAAK,SAACI,EAAGC,GACjB,OAAID,EAAElB,EAAMG,KAAOgB,EAAEnB,EAAMG,KAClBH,EAAMK,KAAO,EAAI,EAEtBa,EAAElB,EAAMG,KAAOgB,EAAEnB,EAAMG,KAClBH,EAAMK,IAAM,GAAK,EAEnB,CACT,GARA,GASF,CAACL,IAGH,MAAO,CAAEG,IAAKH,EAAMG,IAAKE,IAAKL,EAAMK,IAAKe,UAtBvB,SAACjB,GACjBU,EAAS,CAAEX,KAAM,YAAaE,QAAS,CAAED,IAAGA,IAC9C,EAoBoDkB,YAlBhC,WAClBR,EAAS,CAAEX,KAAM,eACnB,EAgBiEY,KAAIA,EACvE"}
@@ -1,2 +1,2 @@
1
1
  import{jsxs as r,jsx as t}from"react/jsx-runtime";import{memo as a}from"react";var e=a((function(a){var e=a.size||16,o=a.sortOrder||"ASC";return r("div",{className:"relative",style:{width:"".concat(e,"px"),height:"".concat(e,"px")},children:[t("div",{className:"absolute top-1/2 right-0 w-[40%] h-[20%] duration-300 ".concat("ASC"===o?"-translate-y-[250%]":"translate-y-[150%]"," ").concat(a.isSortActive?"bg-gray-700":"bg-gray-200 border border-gray-500")}),t("div",{className:"absolute top-1/2 right-0 w-[70%] h-[20%] duration-300 -translate-y-1/2 ".concat(a.isSortActive?"bg-gray-700":"bg-gray-200 border border-gray-500")}),t("div",{className:"absolute top-1/2 right-0 w-full h-[20%] duration-300 ".concat("ASC"===o?"translate-y-[150%]":"-translate-y-[250%]"," ").concat(a.isSortActive?"bg-gray-700":"bg-gray-200 border border-gray-500")})]})}));export{e as SortIcon};
2
- //# sourceMappingURL=sort-icon.js.map
2
+ //# sourceMappingURL=icon.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"icon.js","sources":["../../../../../src/table/sort/icon.tsx"],"sourcesContent":["import { memo } from \"react\";\n\ntype TPropsSortIcon = {\n sortOrder?: \"ASC\" | \"DESC\";\n isSortActive?: boolean;\n size?: number;\n};\n\nconst SortIcon = memo(function SI(props: TPropsSortIcon) {\n const size = props.size || 16;\n const order = props.sortOrder || \"ASC\";\n\n return (\n <div\n className=\"relative\"\n style={{ width: `${size}px`, height: `${size}px` }}\n >\n <div\n className={`absolute top-1/2 right-0 w-[40%] h-[20%] duration-300 ${\n order === \"ASC\" ? \"-translate-y-[250%]\" : \"translate-y-[150%]\"\n } ${\n props.isSortActive\n ? \"bg-gray-700\"\n : \"bg-gray-200 border border-gray-500\"\n }`}\n ></div>\n <div\n className={`absolute top-1/2 right-0 w-[70%] h-[20%] duration-300 -translate-y-1/2 ${\n props.isSortActive\n ? \"bg-gray-700\"\n : \"bg-gray-200 border border-gray-500\"\n }`}\n ></div>\n <div\n className={`absolute top-1/2 right-0 w-full h-[20%] duration-300 ${\n order === \"ASC\" ? \"translate-y-[150%]\" : \"-translate-y-[250%]\"\n } ${\n props.isSortActive\n ? \"bg-gray-700\"\n : \"bg-gray-200 border border-gray-500\"\n }`}\n ></div>\n </div>\n );\n});\n\nexport { SortIcon };\n"],"names":["SortIcon","memo","props","size","order","sortOrder","_jsxs","className","style","width","height","children","_jsx","concat","isSortActive"],"mappings":"+EAQA,IAAMA,EAAWC,GAAK,SAAYC,GAChC,IAAMC,EAAOD,EAAMC,MAAQ,GACrBC,EAAQF,EAAMG,WAAa,MAEjC,OACEC,EACE,MAAA,CAAAC,UAAU,WACVC,MAAO,CAAEC,MAAO,UAAGN,EAAI,MAAMO,OAAQ,UAAGP,EAAI,OAAMQ,SAAA,CAElDC,SACEL,UAAW,gEACC,QAAVH,EAAkB,sBAAwB,qBAE1C,KAAAS,OAAAX,EAAMY,aACF,cACA,wCAGRF,EACE,MAAA,CAAAL,UAAW,2EAAAM,OACTX,EAAMY,aACF,cACA,wCAGRF,EACE,MAAA,CAAAL,UAAW,wDAAAM,OACC,QAAVT,EAAkB,qBAAuB,sBAAqB,MAAAS,OAE9DX,EAAMY,aACF,cACA,0CAKd"}
@@ -0,0 +1,3 @@
1
+ "use client";
2
+ import{jsx as n}from"react/jsx-runtime";import{createContext as r,useContext as o}from"react";import{useSortReducer as t}from"./hooks.js";var e=r({key:"",asc:!1,changeKey:function(){throw new Error("Function not implemented.")},changeOrder:function(){throw new Error("Function not implemented.")},sort:function(){throw new Error("Function not implemented.")}});function i(r){return n(e.Provider,{value:t(r.initialCondition),children:r.children})}function c(){return o(e)}export{i as SortProvider,c as useSortContext};
3
+ //# sourceMappingURL=provider.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"provider.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
package/dist/index.d.ts CHANGED
@@ -55,6 +55,12 @@ type TTableColumn<T extends DataObject> = {
55
55
  type TPropsTable<T extends DataObject> = {
56
56
  cols: TTableColumn<T>[];
57
57
  rows: T[];
58
+ initialCondition?: {
59
+ sort?: {
60
+ key: string;
61
+ asc?: boolean;
62
+ };
63
+ };
58
64
  };
59
65
 
60
66
  declare function Table<T extends DataObject>(props: TPropsTable<T>): react_jsx_runtime.JSX.Element;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@teppen/react-ui",
3
- "version": "0.7.4",
3
+ "version": "0.7.5",
4
4
  "description": "React UI Component",
5
5
  "main": "dist/cjs/src/index.js",
6
6
  "module": "dist/esm/src/index.js",
@@ -26,7 +26,6 @@
26
26
  "@storybook/addon-essentials": "^7.6.17",
27
27
  "@storybook/addon-interactions": "^7.6.17",
28
28
  "@storybook/addon-links": "^7.6.17",
29
- "@storybook/addon-onboarding": "^1.0.11",
30
29
  "@storybook/blocks": "^7.6.17",
31
30
  "@storybook/react": "^7.6.17",
32
31
  "@storybook/react-vite": "^7.6.17",
@@ -1,2 +0,0 @@
1
- "use strict";var e=require("react/jsx-runtime"),l=require("react"),n=require("./filter.js"),t=require("./cancel-icon.js");exports.TableFilterForm=function(r){var i=n.useTableFilterContext(),a=i.addFilter,s=i.removeFilter,u=i.filterConditions,o=l.useState(""),c=o[0],d=o[1],v=l.useState(""),f=v[0],x=v[1],p=l.useState(""),h=p[0],j=p[1],y=l.useState("string"),m=y[0],b=y[1],g=r.cols.find((function(e){return e.key===c}));return l.useEffect((function(){j(""),x("")}),[c]),e.jsxs(e.Fragment,{children:[e.jsxs("div",{className:"flex flex-col gap-2 mb-5",children:[e.jsx("p",{className:"font-bold text-lg",children:"フィルタ追加"}),e.jsxs("div",{className:"flex flex-wrap gap-1",children:[e.jsxs("select",{value:c,onChange:function(e){var l;e.preventDefault(),d(e.target.value);var n=null===(l=r.cols.find((function(l){return l.key===e.target.value})))||void 0===l?void 0:l.type;b(n)},children:[e.jsx("option",{value:"",children:"-- 列を選択 --"}),r.cols.filter((function(e){return!!e.label&&!!e.type})).map((function(l){return e.jsx("option",{value:l.key,children:l.label},l.key)}))]}),e.jsxs("select",{value:f,onChange:function(e){e.preventDefault(),x(e.target.value)},disabled:!c,children:[e.jsx("option",{value:"",children:c?"-- 条件を選択 --":"-- 列を選択してください --"}),"string"===m&&n.STRING_FILTER_OPERATOR.map((function(l){return e.jsx("option",{value:l.key,children:l.label},l.key)})),"number"===m&&n.NUMBER_FILTER_OPERATOR.map((function(l){return e.jsx("option",{value:l.key,children:l.label},l.key)})),"select"===m&&n.SELECT_FILTER_OPERATOR.map((function(l){return e.jsx("option",{value:l.key,children:l.label},l.key)}))]}),"select"===m?e.jsxs("select",{value:h,onChange:function(e){e.preventDefault(),j(e.target.value)},children:[e.jsx("option",{value:"",children:"-- 未選択 --"}),"select"===g.type&&g.options.map((function(l){return e.jsx("option",{value:l.value,children:l.label},l.value)}))]}):e.jsx("input",{type:"text",value:h,onChange:function(e){e.preventDefault(),j(e.target.value)},placeholder:"-- 値を入力 --"})]}),e.jsx("div",{className:"flex justify-end",children:e.jsx("button",{className:"bg-gray-900 text-white py-1 px-2 rounded-md",onClick:function(e){var l;if(e.preventDefault(),c&&f&&("select"===g.type||h)){var n=r.cols.find((function(e){return e.key===c}));a("string"===m?{key:c,operator:f,value:[h]}:"select"===m?{key:c,operator:f,value:h,label:"select"===n.type?null===(l=n.options.find((function(e){return e.value===h})))||void 0===l?void 0:l.label:void 0}:{key:c,operator:f,value:Number(h)})}else alert("全ての項目を入力してください")},children:"追加"})})]}),e.jsxs("div",{children:[u.length>0&&e.jsx("p",{className:"font-bold text-lg",children:"フィルタ一覧"}),e.jsx("ul",{className:"flex flex-col gap-1 my-2",children:u.map((function(l){var i,a;return e.jsxs("li",{className:"flex justify-between",children:[e.jsxs("p",{children:["「",e.jsx("strong",{children:null===(i=r.cols.find((function(e){return e.key===l.key})))||void 0===i?void 0:i.label}),"」 は",e.jsx("span",{children:null===(a=n.FILTER_OPERATOR.find((function(e){return e.key===l.operator})))||void 0===a?void 0:a.label}),":",e.jsx("span",{children:l.label?l.label:l.value})]}),e.jsx("button",{onClick:function(e){e.preventDefault(),s(l.id)},children:e.jsx(t.CancelIcon,{size:16})})]},l.id)}))}),e.jsx("div",{className:"flex justify-center",children:e.jsx(n.TableFilterRemoveButton,{children:e.jsx("p",{className:"text-gray-600 underline hover:text-gray-800",children:"remove all filters"})})})]})]})};
2
- //# sourceMappingURL=filter-form.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"filter-form.js","sources":["../../../../src/table/filter-form.tsx"],"sourcesContent":["import { useEffect, useState } from \"react\";\nimport {\n FILTER_OPERATOR,\n NUMBER_FILTER_OPERATOR,\n SELECT_FILTER_OPERATOR,\n STRING_FILTER_OPERATOR,\n TNumberFilterOperator,\n TSelectFilterOperator,\n TStringFilterOperator,\n TableFilterRemoveButton,\n useTableFilterContext,\n} from \"./filter\";\nimport { DataObject, TColumnType, TTableColumn } from \"./type\";\nimport { CancelIcon } from \"./cancel-icon\";\n\ntype TPropsFilterForm<T extends DataObject> = {\n cols: TTableColumn<T>[];\n};\n\nexport function TableFilterForm<T extends DataObject>(\n props: TPropsFilterForm<T>\n) {\n const { addFilter, removeFilter, filterConditions } = useTableFilterContext();\n const [selectingKey, setSelectingKey] = useState<string>(\"\");\n const [selectingOperator, setSelectingOperator] = useState<string>(\"\");\n const [value, setValue] = useState<string>(\"\");\n const [filterType, setFilterType] = useState<TColumnType>(\"string\");\n\n const filterColumn = props.cols.find((col) => col.key === selectingKey)!;\n\n useEffect(() => {\n setValue(\"\");\n setSelectingOperator(\"\");\n }, [selectingKey]);\n\n return (\n <>\n <div className=\"flex flex-col gap-2 mb-5\">\n <p className=\"font-bold text-lg\">フィルタ追加</p>\n <div className=\"flex flex-wrap gap-1\">\n <select\n value={selectingKey}\n onChange={(e) => {\n e.preventDefault();\n setSelectingKey(e.target.value);\n const columnType = props.cols.find(\n (col) => col.key === e.target.value\n )?.type as TColumnType;\n setFilterType(columnType);\n }}\n >\n <option value=\"\">-- 列を選択 --</option>\n {props.cols\n .filter((col) => !!col.label && !!col.type)\n .map((col) => (\n <option key={col.key} value={col.key}>\n {col.label}\n </option>\n ))}\n </select>\n <select\n value={selectingOperator}\n onChange={(e) => {\n e.preventDefault();\n setSelectingOperator(e.target.value);\n }}\n disabled={!selectingKey}\n >\n <option value=\"\">\n {selectingKey ? \"-- 条件を選択 --\" : \"-- 列を選択してください --\"}\n </option>\n {filterType === \"string\" &&\n STRING_FILTER_OPERATOR.map((op) => (\n <option key={op.key} value={op.key}>\n {op.label}\n </option>\n ))}\n {filterType === \"number\" &&\n NUMBER_FILTER_OPERATOR.map((op) => (\n <option key={op.key} value={op.key}>\n {op.label}\n </option>\n ))}\n {filterType === \"select\" &&\n SELECT_FILTER_OPERATOR.map((op) => (\n <option key={op.key} value={op.key}>\n {op.label}\n </option>\n ))}\n </select>\n {filterType === \"select\" ? (\n <select\n value={value}\n onChange={(e) => {\n e.preventDefault();\n setValue(e.target.value);\n }}\n >\n <option value=\"\">-- 未選択 --</option>\n {filterColumn.type === \"select\" &&\n filterColumn.options.map((op) => (\n <option key={op.value} value={op.value}>\n {op.label}\n </option>\n ))}\n </select>\n ) : (\n <input\n type=\"text\"\n value={value}\n onChange={(e) => {\n e.preventDefault();\n setValue(e.target.value);\n }}\n placeholder=\"-- 値を入力 --\"\n />\n )}\n </div>\n <div className=\"flex justify-end\">\n <button\n className=\"bg-gray-900 text-white py-1 px-2 rounded-md\"\n onClick={(e) => {\n e.preventDefault();\n if (\n !selectingKey ||\n !selectingOperator ||\n (filterColumn.type !== \"select\" && !value)\n ) {\n alert(\"全ての項目を入力してください\");\n return;\n }\n\n const addFilterColumn = props.cols.find(\n (col) => col.key === selectingKey\n )!;\n\n addFilter(\n filterType === \"string\"\n ? {\n key: selectingKey,\n operator: selectingOperator as TStringFilterOperator,\n value: [value],\n }\n : filterType === \"select\"\n ? {\n key: selectingKey,\n operator: selectingOperator as TSelectFilterOperator,\n value: value,\n label:\n addFilterColumn.type === \"select\"\n ? addFilterColumn.options.find(\n (op) => op.value === value\n )?.label\n : undefined,\n }\n : {\n key: selectingKey,\n operator: selectingOperator as TNumberFilterOperator,\n value: Number(value),\n }\n );\n }}\n >\n 追加\n </button>\n </div>\n </div>\n <div>\n {filterConditions.length > 0 && (\n <p className=\"font-bold text-lg\">フィルタ一覧</p>\n )}\n <ul className=\"flex flex-col gap-1 my-2\">\n {filterConditions.map((f) => (\n <li key={f.id} className=\"flex justify-between\">\n <p>\n 「\n <strong>\n {props.cols.find((col) => col.key === f.key)?.label}\n </strong>\n 」 は\n <span>\n {FILTER_OPERATOR.find((op) => op.key === f.operator)?.label}\n </span>\n :<span>{f.label ? f.label : f.value}</span>\n </p>\n <button\n onClick={(e) => {\n e.preventDefault();\n removeFilter(f.id);\n }}\n >\n <CancelIcon size={16} />\n </button>\n </li>\n ))}\n </ul>\n <div className=\"flex justify-center\">\n <TableFilterRemoveButton>\n <p className=\"text-gray-600 underline hover:text-gray-800\">\n remove all filters\n </p>\n </TableFilterRemoveButton>\n </div>\n </div>\n </>\n );\n}\n"],"names":["props","_a","useTableFilterContext","addFilter","removeFilter","filterConditions","_b","useState","selectingKey","setSelectingKey","_c","selectingOperator","setSelectingOperator","_d","value","setValue","_e","filterType","setFilterType","filterColumn","cols","find","col","key","useEffect","_jsxs","_Fragment","children","className","_jsx","jsxs","onChange","e","preventDefault","target","columnType","type","filter","label","map","jsx","disabled","STRING_FILTER_OPERATOR","op","NUMBER_FILTER_OPERATOR","SELECT_FILTER_OPERATOR","options","placeholder","onClick","addFilterColumn","operator","undefined","Number","alert","length","f","FILTER_OPERATOR","id","CancelIcon","size","TableFilterRemoveButton"],"mappings":"kJAmBM,SACJA,GAEM,IAAAC,EAAgDC,EAAAA,wBAA9CC,EAASF,EAAAE,UAAEC,EAAYH,EAAAG,aAAEC,EAAgBJ,EAAAI,iBAC3CC,EAAkCC,EAAAA,SAAiB,IAAlDC,EAAYF,EAAA,GAAEG,EAAeH,EAAA,GAC9BI,EAA4CH,EAAAA,SAAiB,IAA5DI,EAAiBD,EAAA,GAAEE,EAAoBF,EAAA,GACxCG,EAAoBN,EAAAA,SAAiB,IAApCO,EAAKD,EAAA,GAAEE,EAAQF,EAAA,GAChBG,EAA8BT,EAAAA,SAAsB,UAAnDU,EAAUD,EAAA,GAAEE,EAAaF,EAAA,GAE1BG,EAAenB,EAAMoB,KAAKC,MAAK,SAACC,GAAQ,OAAAA,EAAIC,MAAQf,CAAY,IAOtE,OALAgB,EAAAA,WAAU,WACRT,EAAS,IACTH,EAAqB,GACvB,GAAG,CAACJ,IAGFiB,EAAAA,KACEC,EAAAA,SAAA,CAAAC,SAAA,CAAAF,EAAAA,KAAA,MAAA,CAAKG,UAAU,2BAA0BD,SAAA,CACvCE,EAAAA,IAAG,IAAA,CAAAD,UAAU,oBAA8BD,SAAA,WAC3CF,cAAKG,UAAU,uBAAsBD,SAAA,CACnCF,EACEK,KAAA,SAAA,CAAAhB,MAAON,EACPuB,SAAU,SAACC,SACTA,EAAEC,iBACFxB,EAAgBuB,EAAEE,OAAOpB,OACzB,IAAMqB,EAEH,QAFgBlC,EAAAD,EAAMoB,KAAKC,MAC5B,SAACC,GAAQ,OAAAA,EAAIC,MAAQS,EAAEE,OAAOpB,gBAC7B,IAAAb,OAAA,EAAAA,EAAAmC,KACHlB,EAAciB,EACf,EAAAR,SAAA,CAEDE,gBAAQf,MAAM,GAAsBa,SAAA,eACnC3B,EAAMoB,KACJiB,QAAO,SAACf,GAAQ,QAAEA,EAAIgB,SAAWhB,EAAIc,QACrCG,KAAI,SAACjB,GAAQ,OACZO,EAAAW,IAAA,SAAA,CAAsB1B,MAAOQ,EAAIC,IAC9BI,SAAAL,EAAIgB,OADMhB,EAAIC,WAKvBE,EAAAA,KACE,SAAA,CAAAX,MAAOH,EACPoB,SAAU,SAACC,GACTA,EAAEC,iBACFrB,EAAqBoB,EAAEE,OAAOpB,QAEhC2B,UAAWjC,YAEXqB,EAAAA,IAAQ,SAAA,CAAAf,MAAM,GACXa,SAAAnB,EAAe,cAAgB,qBAElB,WAAfS,GACCyB,yBAAuBH,KAAI,SAACI,GAAO,OACjCd,EAAAA,IAAqB,SAAA,CAAAf,MAAO6B,EAAGpB,IAAGI,SAC/BgB,EAAGL,OADOK,EAAGpB,IAGjB,IACa,WAAfN,GACC2B,yBAAuBL,KAAI,SAACI,GAAO,OACjCd,EAAAA,IAAqB,SAAA,CAAAf,MAAO6B,EAAGpB,IAAGI,SAC/BgB,EAAGL,OADOK,EAAGpB,IAGjB,IACa,WAAfN,GACC4B,EAAAA,uBAAuBN,KAAI,SAACI,GAAO,OACjCd,EAAAA,IAAqB,SAAA,CAAAf,MAAO6B,EAAGpB,IAC5BI,SAAAgB,EAAGL,OADOK,EAAGpB,IAGjB,OAEW,WAAfN,EACCQ,OAAA,SAAA,CACEX,MAAOA,EACPiB,SAAU,SAACC,GACTA,EAAEC,iBACFlB,EAASiB,EAAEE,OAAOpB,MACnB,EAAAa,SAAA,CAEDE,MAAQ,SAAA,CAAAf,MAAM,GAAqBa,SAAA,cACZ,WAAtBR,EAAaiB,MACZjB,EAAa2B,QAAQP,KAAI,SAACI,GAAO,OAC/Bd,gBAAuBf,MAAO6B,EAAG7B,eAC9B6B,EAAGL,OADOK,EAAG7B,aAMtBe,EAAAA,IAAA,QAAA,CACEO,KAAK,OACLtB,MAAOA,EACPiB,SAAU,SAACC,GACTA,EAAEC,iBACFlB,EAASiB,EAAEE,OAAOpB,QAEpBiC,YAAY,kBAIlBlB,EAAAA,IAAK,MAAA,CAAAD,UAAU,mBAAkBD,SAC/BE,gBACED,UAAU,8CACVoB,QAAS,SAAChB,SAER,GADAA,EAAEC,iBAECzB,GACAG,IACsB,WAAtBQ,EAAaiB,MAAsBtB,GAHtC,CASA,IAAMmC,EAAkBjD,EAAMoB,KAAKC,MACjC,SAACC,GAAQ,OAAAA,EAAIC,MAAQf,CAAY,IAGnCL,EACiB,WAAfc,EACI,CACEM,IAAKf,EACL0C,SAAUvC,EACVG,MAAO,CAACA,IAEK,WAAfG,EACA,CACEM,IAAKf,EACL0C,SAAUvC,EACVG,MAAOA,EACPwB,MAC2B,WAAzBW,EAAgBb,KAGX,UAFDa,EAAgBH,QAAQzB,MACtB,SAACsB,GAAO,OAAAA,EAAG7B,QAAUA,CAAK,WAC3B,IAAAb,OAAA,EAAAA,EAAEqC,WACHa,GAER,CACE5B,IAAKf,EACL0C,SAAUvC,EACVG,MAAOsC,OAAOtC,IA5BrB,MAFCuC,MAAM,iBAiCT,EAGM1B,SAAA,YAGbF,EAAAA,KACG,MAAA,CAAAE,SAAA,CAAAtB,EAAiBiD,OAAS,GACzBzB,EAAAA,IAAG,IAAA,CAAAD,UAAU,oBAA8BD,SAAA,WAE7CE,EAAAA,IAAA,KAAA,CAAID,UAAU,2BAA0BD,SACrCtB,EAAiBkC,KAAI,SAACgB,WAAM,OAC3B9B,EAAAA,KAAe,KAAA,CAAAG,UAAU,iCACvBH,EAAAA,KAEE,IAAA,CAAAE,SAAA,CAAA,IAAAE,EAAAA,IAAA,SAAA,CAAAF,SACgD,QAA7C1B,EAAAD,EAAMoB,KAAKC,MAAK,SAACC,GAAQ,OAAAA,EAAIC,MAAQgC,EAAEhC,GAAG,WAAG,IAAAtB,OAAA,EAAAA,EAAAqC,QAGhD,MAAAT,EAAAA,IAAA,OAAA,CAAAF,SACwD,UAArD6B,kBAAgBnC,MAAK,SAACsB,GAAO,OAAAA,EAAGpB,MAAQgC,EAAEL,QAAb,WAAwB,IAAA5C,OAAA,EAAAA,EAAAgC,QAEvD,IAAAT,EAAAW,IAAA,OAAA,CAAAb,SAAO4B,EAAEjB,MAAQiB,EAAEjB,MAAQiB,EAAEzC,WAEhCe,EAAAA,cACEmB,QAAS,SAAChB,GACRA,EAAEC,iBACF7B,EAAamD,EAAEE,GAChB,EAED9B,SAAAE,EAAAA,IAAC6B,EAAUA,WAAA,CAACC,KAAM,SAlBbJ,EAAEE,GAqBZ,MAEH5B,MAAK,MAAA,CAAAD,UAAU,sBAAqBD,SAClCE,EAAAA,IAAC+B,EAAuBA,wBAAA,CAAAjC,SACtBE,EAAAA,SAAGD,UAAU,8CAETD,SAAA,gCAMhB"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"filter-icon.js","sources":["../../../../src/table/filter-icon.tsx"],"sourcesContent":["type TPropsFIlterIcon = {\n size?: number;\n isFilterActive?: boolean;\n};\n\nexport function FIlterIcon(props: TPropsFIlterIcon) {\n const size = props.size ?? 16;\n return (\n <div\n className={`duration-300 ${\n props.isFilterActive ? \"text-gray-700\" : \"text-gray-500\"\n }`}\n >\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n xmlnsXlink=\"http://www.w3.org/1999/xlink\"\n version=\"1.1\"\n width={`${size}px`}\n height={`${size}px`}\n viewBox=\"0 0 256 256\"\n xmlSpace=\"preserve\"\n >\n <defs></defs>\n {props.isFilterActive ? (\n <g\n style={{\n stroke: \"none\",\n strokeWidth: 0,\n strokeDasharray: \"none\",\n strokeLinecap: \"butt\",\n strokeLinejoin: \"miter\",\n strokeMiterlimit: 10,\n fill: \"none\",\n fillRule: \"nonzero\",\n opacity: 1,\n }}\n transform=\"translate(1.4065934065934016 1.4065934065934016) scale(2.81 2.81)\"\n >\n <path\n d=\"M 52.537 80.466 V 45.192 L 84.53 2.999 C 85.464 1.768 84.586 0 83.041 0 H 6.959 C 5.414 0 4.536 1.768 5.47 2.999 l 31.994 42.192 v 43.441 c 0 1.064 1.163 1.719 2.073 1.167 l 11.758 -7.127 C 52.065 82.205 52.537 81.368 52.537 80.466 z\"\n style={{\n stroke: \"none\",\n strokeWidth: 1,\n strokeDasharray: \"none\",\n strokeLinecap: \"butt\",\n strokeLinejoin: \"miter\",\n strokeMiterlimit: 10,\n fill: \"currentColor\",\n fillRule: \"nonzero\",\n opacity: 1,\n }}\n transform=\" matrix(1 0 0 1 0 0) \"\n strokeLinecap=\"round\"\n />\n </g>\n ) : (\n <g\n style={{\n stroke: \"none\",\n strokeWidth: 0,\n strokeDasharray: \"none\",\n strokeLinecap: \"butt\",\n strokeLinejoin: \"miter\",\n strokeMiterlimit: 10,\n fill: \"none\",\n fillRule: \"nonzero\",\n opacity: 1,\n }}\n transform=\"translate(1.4065934065934016 1.4065934065934016) scale(2.81 2.81)\"\n >\n <path\n d=\"M 37.882 90 c -0.338 0 -0.676 -0.086 -0.981 -0.258 c -0.629 -0.354 -1.019 -1.02 -1.019 -1.742 V 45.354 L 3.923 3.208 C 3.464 2.604 3.388 1.791 3.726 1.11 S 4.758 0 5.517 0 h 78.966 c 0.76 0 1.453 0.43 1.791 1.11 s 0.262 1.493 -0.197 2.098 L 54.118 45.354 V 79.37 c 0 0.699 -0.365 1.348 -0.963 1.71 l -14.237 8.63 C 38.601 89.903 38.241 90 37.882 90 z M 9.543 4 l 29.932 39.474 c 0.264 0.348 0.406 0.772 0.406 1.208 v 39.767 l 10.236 -6.205 V 44.682 c 0 -0.437 0.143 -0.861 0.406 -1.208 L 80.457 4 H 9.543 z M 52.118 79.37 h 0.01 H 52.118 z\"\n style={{\n stroke: \"none\",\n strokeWidth: 1,\n strokeDasharray: \"none\",\n strokeLinecap: \"butt\",\n strokeLinejoin: \"miter\",\n strokeMiterlimit: 10,\n fill: \"currentColor\",\n fillRule: \"nonzero\",\n opacity: 1,\n }}\n transform=\" matrix(1 0 0 1 0 0) \"\n strokeLinecap=\"round\"\n />\n </g>\n )}\n </svg>\n </div>\n );\n}\n"],"names":["props","size","_a","_jsx","jsx","className","concat","isFilterActive","children","_jsxs","xmlns","xmlnsXlink","version","width","height","viewBox","xmlSpace","style","stroke","strokeWidth","strokeDasharray","strokeLinecap","strokeLinejoin","strokeMiterlimit","fill","fillRule","opacity","transform","d"],"mappings":"mEAKM,SAAqBA,SACnBC,EAAiB,QAAVC,EAAAF,EAAMC,YAAI,IAAAC,EAAAA,EAAI,GAC3B,OACEC,EAAAC,IAAA,MAAA,CACEC,UAAW,gBACTC,OAAAN,EAAMO,eAAiB,gBAAkB,iBACzCC,SAEFC,EAAAA,KACE,MAAA,CAAAC,MAAM,6BACNC,WAAW,+BACXC,QAAQ,MACRC,MAAO,GAAGP,OAAAL,EAAQ,MAClBa,OAAQ,GAAGR,OAAAL,EAAQ,MACnBc,QAAQ,cACRC,SAAS,WAAUR,SAAA,CAEnBL,EAAAA,IAAa,OAAA,IACZH,EAAMO,eACLJ,EAAAC,IAAA,IAAA,CACEa,MAAO,CACLC,OAAQ,OACRC,YAAa,EACbC,gBAAiB,OACjBC,cAAe,OACfC,eAAgB,QAChBC,iBAAkB,GAClBC,KAAM,OACNC,SAAU,UACVC,QAAS,GAEXC,UAAU,oEAEVnB,SAAAL,EAAAA,IAAA,OAAA,CACEyB,EAAE,4OACFX,MAAO,CACLC,OAAQ,OACRC,YAAa,EACbC,gBAAiB,OACjBC,cAAe,OACfC,eAAgB,QAChBC,iBAAkB,GAClBC,KAAM,eACNC,SAAU,UACVC,QAAS,GAEXC,UAAU,wBACVN,cAAc,YAIlBlB,EAAAC,IAAA,IAAA,CACEa,MAAO,CACLC,OAAQ,OACRC,YAAa,EACbC,gBAAiB,OACjBC,cAAe,OACfC,eAAgB,QAChBC,iBAAkB,GAClBC,KAAM,OACNC,SAAU,UACVC,QAAS,GAEXC,UAAU,oEAEVnB,SAAAL,EAAAA,IAAA,OAAA,CACEyB,EAAE,8hBACFX,MAAO,CACLC,OAAQ,OACRC,YAAa,EACbC,gBAAiB,OACjBC,cAAe,OACfC,eAAgB,QAChBC,iBAAkB,GAClBC,KAAM,eACNC,SAAU,UACVC,QAAS,GAEXC,UAAU,wBACVN,cAAc,gBAO5B"}
@@ -1,2 +0,0 @@
1
- "use strict";var e=require("../../node_modules/tslib/tslib.es6.js"),r=require("react/jsx-runtime"),t=require("react"),n=require("./filter-icon.js"),l=[{key:"includeText",label:"次の値を含む"}],i=[{key:"eq",label:"次の値と等しい"},{key:"ne",label:"次の値と等しくない"},{key:"gt",label:"次の値より大きい"},{key:"lt",label:"次の値より小さい"},{key:"gte",label:"次の値以上"},{key:"lte",label:"次の値以下"}],u=[{key:"selected",label:"次の値と等しい"},{key:"notSelected",label:"次の値と等しくない"}],a=e.__spreadArray(e.__spreadArray(e.__spreadArray([],l,!0),i,!0),u,!0);function c(r,t){switch(t.type){case"add":return{filters:e.__spreadArray(e.__spreadArray([],r.filters,!0),[e.__assign({id:(new Date).getTime()},t.payload.filter)],!1)};case"remove":return{filters:r.filters.filter((function(e){return e.id!==t.payload.id}))};case"clear":return{filters:[]}}}function o(){var e=t.useReducer(c,{filters:[]}),r=e[0],n=e[1],l=t.useCallback((function(e){return n({type:"add",payload:{filter:e}})}),[n]);return{addFilter:l,removeFilter:t.useCallback((function(e){return n({type:"remove",payload:{id:e}})}),[n]),clearFilter:t.useCallback((function(){return n({type:"clear"})}),[n]),filter:t.useCallback((function(e){return r.filters.reduce((function(e,r){switch(r.operator){case"includeText":return e.filter((function(e){var t=e[r.key];return"string"==typeof t&&r.value.some((function(e){return t.includes(e)}))}));case"eq":case"selected":return e.filter((function(e){return e[r.key]===r.value}));case"ne":case"notSelected":return e.filter((function(e){return e[r.key]!==r.value}));case"gt":return e.filter((function(e){return e[r.key]>r.value}));case"lt":return e.filter((function(e){return e[r.key]<r.value}));case"gte":return e.filter((function(e){return e[r.key]>=r.value}));case"lte":return e.filter((function(e){return e[r.key]<=r.value}))}}),e)}),[r]),filterConditions:r.filters}}var s=t.createContext({addFilter:function(){},removeFilter:function(){},clearFilter:function(){},filter:function(){return[]},filterConditions:[]});function f(){return t.useContext(s)}exports.FILTER_OPERATOR=a,exports.NUMBER_FILTER_OPERATOR=i,exports.SELECT_FILTER_OPERATOR=u,exports.STRING_FILTER_OPERATOR=l,exports.TableFilter=function(e){var t=f().filterConditions;return r.jsx("div",{className:"relative cursor-pointer",onClick:e.onClick,children:r.jsx(n.FIlterIcon,{isFilterActive:t.filter((function(r){return r.key===e.keyName})).length>0})})},exports.TableFilterProvider=function(e){var t=e.children;return r.jsx(s.Provider,{value:o(),children:t})},exports.TableFilterRemoveButton=function(e){var t=e.children,n=f(),l=n.clearFilter;if(0!==n.filterConditions.length)return r.jsx("button",{onClick:function(e){e.preventDefault(),l()},children:t})},exports.filterReducer=c,exports.useTableFilterContext=f;
2
- //# sourceMappingURL=filter.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"filter.js","sources":["../../../../src/table/filter.tsx"],"sourcesContent":["import { createContext, useCallback, useContext, useReducer } from \"react\";\nimport { DataObject } from \"./type\";\nimport { FIlterIcon } from \"./filter-icon\";\n\nexport const STRING_FILTER_OPERATOR = [\n { key: \"includeText\", label: \"次の値を含む\" },\n] as const;\n\nexport const NUMBER_FILTER_OPERATOR = [\n { key: \"eq\", label: \"次の値と等しい\" },\n { key: \"ne\", label: \"次の値と等しくない\" },\n { key: \"gt\", label: \"次の値より大きい\" },\n { key: \"lt\", label: \"次の値より小さい\" },\n { key: \"gte\", label: \"次の値以上\" },\n { key: \"lte\", label: \"次の値以下\" },\n] as const;\n\nexport const SELECT_FILTER_OPERATOR = [\n { key: \"selected\", label: \"次の値と等しい\" },\n { key: \"notSelected\", label: \"次の値と等しくない\" },\n] as const;\n\nexport const FILTER_OPERATOR = [\n ...STRING_FILTER_OPERATOR,\n ...NUMBER_FILTER_OPERATOR,\n ...SELECT_FILTER_OPERATOR,\n] as const;\n\nexport type TStringFilterOperator =\n (typeof STRING_FILTER_OPERATOR)[number][\"key\"];\nexport type TNumberFilterOperator =\n (typeof NUMBER_FILTER_OPERATOR)[number][\"key\"];\nexport type TSelectFilterOperator =\n (typeof SELECT_FILTER_OPERATOR)[number][\"key\"];\nexport type TFilterOperator =\n | TStringFilterOperator\n | TNumberFilterOperator\n | TSelectFilterOperator;\n\ntype TStringFilter = {\n key: string;\n operator: TStringFilterOperator;\n value: string[];\n label?: string;\n};\n\ntype TNumberFilter = {\n key: string;\n operator: TNumberFilterOperator;\n value: number;\n label?: string;\n};\n\ntype TSelectFilter = {\n key: string;\n operator: TSelectFilterOperator;\n value: string;\n label?: string;\n};\n\ntype TFilter = TStringFilter | TNumberFilter | TSelectFilter;\n\ntype TFilterState = {\n filters: ({ id: number } & TFilter)[];\n};\n\ntype TFilterAction =\n | { type: \"add\"; payload: { filter: TFilter } }\n | { type: \"remove\"; payload: { id: number } }\n | { type: \"clear\" };\n\nexport function filterReducer(\n state: TFilterState,\n action: TFilterAction\n): TFilterState {\n switch (action.type) {\n case \"add\":\n return {\n filters: [\n ...state.filters,\n { id: new Date().getTime(), ...action.payload.filter },\n ],\n };\n case \"remove\":\n return {\n filters: state.filters.filter((f) => f.id !== action.payload.id),\n };\n case \"clear\":\n return { filters: [] };\n }\n}\n\nfunction useFilterReducer() {\n const [state, dispatch] = useReducer(filterReducer, { filters: [] });\n\n const addFilter = useCallback(\n (filter: TFilter) => dispatch({ type: \"add\", payload: { filter } }),\n [dispatch]\n );\n const removeFilter = useCallback(\n (id: number) => dispatch({ type: \"remove\", payload: { id } }),\n [dispatch]\n );\n const clearFilter = useCallback(\n () => dispatch({ type: \"clear\" }),\n [dispatch]\n );\n\n const filter = useCallback(\n <T extends DataObject>(rows: T[]): T[] => {\n return state.filters.reduce((acc, filter) => {\n switch (filter.operator) {\n case \"includeText\":\n return acc.filter((row) => {\n const value = row[filter.key];\n if (typeof value === \"string\") {\n return filter.value.some((v) => value.includes(v));\n }\n return false;\n });\n case \"eq\":\n return acc.filter((row) => row[filter.key] === filter.value);\n case \"ne\":\n return acc.filter((row) => row[filter.key] !== filter.value);\n case \"gt\":\n return acc.filter((row) => row[filter.key] > filter.value);\n case \"lt\":\n return acc.filter((row) => row[filter.key] < filter.value);\n case \"gte\":\n return acc.filter((row) => row[filter.key] >= filter.value);\n case \"lte\":\n return acc.filter((row) => row[filter.key] <= filter.value);\n case \"selected\":\n return acc.filter((row) => row[filter.key] === filter.value);\n case \"notSelected\":\n return acc.filter((row) => row[filter.key] !== filter.value);\n }\n }, rows);\n },\n [state]\n );\n\n return {\n addFilter,\n removeFilter,\n clearFilter,\n filter,\n filterConditions: state.filters,\n };\n}\n\nconst TableFilterContext = createContext<ReturnType<typeof useFilterReducer>>({\n addFilter: () => {},\n removeFilter: () => {},\n clearFilter: () => {},\n filter: () => [],\n filterConditions: [],\n});\n\nexport function TableFilterProvider({\n children,\n}: {\n children: JSX.Element | JSX.Element[];\n}) {\n return (\n <TableFilterContext.Provider value={useFilterReducer()}>\n {children}\n </TableFilterContext.Provider>\n );\n}\n\nexport function useTableFilterContext() {\n return useContext(TableFilterContext);\n}\n\ntype TPropsTableFilter = {\n keyName: string;\n onClick: React.MouseEventHandler<HTMLDivElement>;\n};\n\nexport function TableFilter(props: TPropsTableFilter) {\n const { filterConditions } = useTableFilterContext();\n\n return (\n <div className=\"relative cursor-pointer\" onClick={props.onClick}>\n <FIlterIcon\n isFilterActive={\n filterConditions.filter((f) => f.key === props.keyName).length > 0\n }\n />\n </div>\n );\n}\n\nexport function TableFilterRemoveButton({\n children,\n}: {\n children: React.ReactNode;\n}) {\n const { clearFilter, filterConditions } = useTableFilterContext();\n\n if (filterConditions.length === 0) {\n return;\n }\n\n return (\n <button\n onClick={(e) => {\n e.preventDefault();\n clearFilter();\n }}\n >\n {children}\n </button>\n );\n}\n"],"names":["STRING_FILTER_OPERATOR","key","label","NUMBER_FILTER_OPERATOR","SELECT_FILTER_OPERATOR","FILTER_OPERATOR","__spreadArray","filterReducer","state","action","type","filters","__assign","id","Date","getTime","payload","filter","f","useFilterReducer","_a","useReducer","dispatch","addFilter","useCallback","removeFilter","clearFilter","rows","reduce","acc","operator","row","value","some","v","includes","filterConditions","TableFilterContext","createContext","useTableFilterContext","useContext","props","_jsx","jsx","className","onClick","children","FIlterIcon","isFilterActive","keyName","length","Provider","_b","e","preventDefault"],"mappings":"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"}
@@ -1,2 +0,0 @@
1
- "use strict";var e=require("../../node_modules/tslib/tslib.es6.js"),r=require("react/jsx-runtime"),t=require("react");function n(r,t){switch(t.type){case"setRowCount":return e.__assign(e.__assign({},r),{rowCount:t.payload.rouCount});case"setPerPage":return e.__assign(e.__assign({},r),{perPage:t.payload.perPage});case"next":return r.currentPage===Math.ceil(r.rowCount/r.perPage)?r:e.__assign(e.__assign({},r),{currentPage:r.currentPage+1});case"prev":return 1===r.currentPage?r:e.__assign(e.__assign({},r),{currentPage:r.currentPage-1});case"jump":return t.payload.pageNumber<1||t.payload.pageNumber>Math.ceil(r.rowCount/r.perPage)||r.currentPage===t.payload.pageNumber?r:e.__assign(e.__assign({},r),{currentPage:t.payload.pageNumber});default:return r}}var u={perPage:50,currentPage:1,rowCount:0};var a=t.memo((function(e){return r.jsxs("div",{className:"flex justify-center gap-2",children:[r.jsx("button",{className:"text-sm",onClick:function(){return e.jump(1)},disabled:1===e.current,children:"≪"}),r.jsx("button",{className:"text-sm",onClick:function(){return e.prev()},disabled:1===e.current,children:"<"}),Array.from({length:e.count},(function(e,r){return r+1})).filter((function(r){return e.current-2<=r&&r<=e.current+2})).map((function(t){return r.jsx("button",{className:"text-sm ".concat(e.current===t?"text-blue-600":""),onClick:function(){return e.jump(t)},children:t},t)})),r.jsx("button",{className:"text-sm",onClick:function(){return e.next()},disabled:e.current===e.count,children:">"}),r.jsx("button",{className:"text-sm",onClick:function(){return e.jump(e.count)},disabled:e.current===e.count,children:"≫"})]})}));exports.Pagenation=a,exports.usePageReducer=function(e){var r=t.useReducer(n,null!=e?e:u),a=r[0],c=r[1],s=t.useCallback((function(){return c({type:"next"})}),[c]),o=t.useCallback((function(){return c({type:"prev"})}),[c]),i=t.useCallback((function(e){return c({type:"jump",payload:{pageNumber:e}})}),[c]),l=t.useCallback((function(e){return c({type:"setRowCount",payload:{rouCount:e}})}),[c]);return{perPage:a.perPage,currentPage:a.currentPage,rowCount:a.rowCount,pageCount:Math.ceil(a.rowCount/a.perPage),from:(a.currentPage-1)*a.perPage,to:a.currentPage*a.perPage,next:s,prev:o,jump:i,setRowCount:l}};
2
- //# sourceMappingURL=page.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"page.js","sources":["../../../../src/table/page.tsx"],"sourcesContent":["import { memo, useCallback, useReducer } from \"react\";\n\ntype TPage = {\n perPage: number;\n currentPage: number;\n rowCount: number;\n};\n\ntype TPageMoveAction =\n | { type: \"setRowCount\"; payload: { rouCount: number } }\n | { type: \"setPerPage\"; payload: { perPage: number } }\n | {\n type: \"next\";\n }\n | {\n type: \"prev\";\n }\n | {\n type: \"jump\";\n payload: { pageNumber: number };\n };\n\nfunction pageReducer(state: TPage, action: TPageMoveAction): TPage {\n switch (action.type) {\n case \"setRowCount\":\n return {\n ...state,\n rowCount: action.payload.rouCount,\n };\n case \"setPerPage\":\n return {\n ...state,\n perPage: action.payload.perPage,\n };\n case \"next\":\n if (state.currentPage === Math.ceil(state.rowCount / state.perPage)) {\n return state;\n }\n\n return {\n ...state,\n currentPage: state.currentPage + 1,\n };\n case \"prev\":\n if (state.currentPage === 1) {\n return state;\n }\n\n return {\n ...state,\n currentPage: state.currentPage - 1,\n };\n case \"jump\":\n if (\n action.payload.pageNumber < 1 ||\n action.payload.pageNumber > Math.ceil(state.rowCount / state.perPage) ||\n state.currentPage === action.payload.pageNumber\n ) {\n return state;\n }\n\n return {\n ...state,\n currentPage: action.payload.pageNumber,\n };\n default:\n return state;\n }\n}\n\nconst InitialPageState: TPage = {\n perPage: 50,\n currentPage: 1,\n rowCount: 0,\n};\n\nexport function usePageReducer(initialState?: TPage) {\n const [state, dispatch] = useReducer(\n pageReducer,\n initialState ?? InitialPageState\n );\n\n const next = useCallback(() => dispatch({ type: \"next\" }), [dispatch]);\n const prev = useCallback(() => dispatch({ type: \"prev\" }), [dispatch]);\n const jump = useCallback(\n (pageNumber: number) => dispatch({ type: \"jump\", payload: { pageNumber } }),\n [dispatch]\n );\n const setRowCount = useCallback(\n (rouCount: number) =>\n dispatch({ type: \"setRowCount\", payload: { rouCount } }),\n [dispatch]\n );\n\n return {\n perPage: state.perPage,\n currentPage: state.currentPage,\n rowCount: state.rowCount,\n pageCount: Math.ceil(state.rowCount / state.perPage),\n from: (state.currentPage - 1) * state.perPage,\n to: state.currentPage * state.perPage,\n next,\n prev,\n jump,\n setRowCount,\n };\n}\n\ntype TPropsPagenation = {\n count: number;\n current: number;\n jump: (pageNumber: number) => void;\n next: () => void;\n prev: () => void;\n};\n\nexport const Pagenation = memo(function TablePagenation(\n props: TPropsPagenation\n) {\n return (\n <div className=\"flex justify-center gap-2\">\n <button\n className=\"text-sm\"\n onClick={() => props.jump(1)}\n disabled={props.current === 1}\n >\n &#x226A;\n </button>\n <button\n className=\"text-sm\"\n onClick={() => props.prev()}\n disabled={props.current === 1}\n >\n &lt;\n </button>\n {Array.from({ length: props.count }, (_, i) => i + 1)\n .filter((i) => props.current - 2 <= i && i <= props.current + 2)\n .map((i) => (\n <button\n key={i}\n className={`text-sm ${props.current === i ? \"text-blue-600\" : \"\"}`}\n onClick={() => props.jump(i)}\n >\n {i}\n </button>\n ))}\n <button\n className=\"text-sm\"\n onClick={() => props.next()}\n disabled={props.current === props.count}\n >\n &gt;\n </button>\n <button\n className=\"text-sm\"\n onClick={() => props.jump(props.count)}\n disabled={props.current === props.count}\n >\n &#x226B;\n </button>\n </div>\n );\n});\n"],"names":["pageReducer","state","action","type","__assign","rowCount","payload","rouCount","perPage","currentPage","Math","ceil","pageNumber","InitialPageState","Pagenation","memo","props","_jsxs","jsxs","className","_jsx","jsx","onClick","jump","disabled","current","prev","children","Array","from","length","count","_","i","filter","map","concat","next","initialState","_a","useReducer","dispatch","useCallback","setRowCount","pageCount","to"],"mappings":"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"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"sort-icon.js","sources":["../../../../src/table/sort-icon.tsx"],"sourcesContent":["import { memo } from \"react\";\n\ntype TPropsSortIcon = {\n sortOrder?: \"ASC\" | \"DESC\";\n isSortActive?: boolean;\n size?: number;\n};\n\nconst SortIcon = memo(function SI(props: TPropsSortIcon) {\n const size = props.size || 16;\n const order = props.sortOrder || \"ASC\";\n\n return (\n <div\n className=\"relative\"\n style={{ width: `${size}px`, height: `${size}px` }}\n >\n <div\n className={`absolute top-1/2 right-0 w-[40%] h-[20%] duration-300 ${\n order === \"ASC\" ? \"-translate-y-[250%]\" : \"translate-y-[150%]\"\n } ${\n props.isSortActive\n ? \"bg-gray-700\"\n : \"bg-gray-200 border border-gray-500\"\n }`}\n ></div>\n <div\n className={`absolute top-1/2 right-0 w-[70%] h-[20%] duration-300 -translate-y-1/2 ${\n props.isSortActive\n ? \"bg-gray-700\"\n : \"bg-gray-200 border border-gray-500\"\n }`}\n ></div>\n <div\n className={`absolute top-1/2 right-0 w-full h-[20%] duration-300 ${\n order === \"ASC\" ? \"translate-y-[150%]\" : \"-translate-y-[250%]\"\n } ${\n props.isSortActive\n ? \"bg-gray-700\"\n : \"bg-gray-200 border border-gray-500\"\n }`}\n ></div>\n </div>\n );\n});\n\nexport { SortIcon };\n"],"names":["SortIcon","memo","props","size","order","sortOrder","_jsxs","className","style","width","height","children","_jsx","concat","isSortActive"],"mappings":"gDAQMA,mBAAeC,MAAC,SAAYC,GAChC,IAAMC,EAAOD,EAAMC,MAAQ,GACrBC,EAAQF,EAAMG,WAAa,MAEjC,OACEC,EAAAA,KACE,MAAA,CAAAC,UAAU,WACVC,MAAO,CAAEC,MAAO,UAAGN,EAAI,MAAMO,OAAQ,UAAGP,EAAI,OAAMQ,SAAA,CAElDC,EAAAA,WACEL,UAAW,gEACC,QAAVH,EAAkB,sBAAwB,qBAE1C,KAAAS,OAAAX,EAAMY,aACF,cACA,wCAGRF,EAAAA,IACE,MAAA,CAAAL,UAAW,2EAAAM,OACTX,EAAMY,aACF,cACA,wCAGRF,EAAAA,IACE,MAAA,CAAAL,UAAW,wDAAAM,OACC,QAAVT,EAAkB,qBAAuB,sBAAqB,MAAAS,OAE9DX,EAAMY,aACF,cACA,0CAKd"}
@@ -1,2 +0,0 @@
1
- "use strict";var r=require("react/jsx-runtime"),s=require("./sort-icon.js");exports.Sort=function(e){return r.jsx("div",{onClick:e.onClick,className:"cursor-pointer",children:r.jsx(s.SortIcon,{sortOrder:e.isSortedByThis?e.sortOrder:"ASC",isSortActive:e.isSortedByThis})})};
2
- //# sourceMappingURL=sort.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"sort.js","sources":["../../../../src/table/sort.tsx"],"sourcesContent":["import { SortIcon } from \"./sort-icon\";\n\ntype TPropsSort = {\n onClick: (e: React.MouseEvent<HTMLDivElement>) => void;\n isSortedByThis: boolean;\n sortOrder: \"ASC\" | \"DESC\";\n};\n\nexport function Sort(props: TPropsSort) {\n return (\n <div onClick={props.onClick} className=\"cursor-pointer\">\n <SortIcon\n sortOrder={props.isSortedByThis ? props.sortOrder : \"ASC\"}\n isSortActive={props.isSortedByThis}\n />\n </div>\n );\n}\n"],"names":["props","_jsx","onClick","className","children","SortIcon","sortOrder","isSortedByThis","isSortActive"],"mappings":"yFAQM,SAAeA,GACnB,OACEC,MAAK,MAAA,CAAAC,QAASF,EAAME,QAASC,UAAU,iBACrCC,SAAAH,EAAAA,IAACI,EAAQA,SACP,CAAAC,UAAWN,EAAMO,eAAiBP,EAAMM,UAAY,MACpDE,aAAcR,EAAMO,kBAI5B"}
@@ -1,2 +0,0 @@
1
- import{jsxs as e,Fragment as l,jsx as n}from"react/jsx-runtime";import{useState as t,useEffect as r}from"react";import{useTableFilterContext as i,STRING_FILTER_OPERATOR as a,NUMBER_FILTER_OPERATOR as o,SELECT_FILTER_OPERATOR as c,FILTER_OPERATOR as u,TableFilterRemoveButton as d}from"./filter.js";import{CancelIcon as f}from"./cancel-icon.js";function s(s){var v=i(),p=v.addFilter,h=v.removeFilter,m=v.filterConditions,y=t(""),g=y[0],b=y[1],k=t(""),x=k[0],N=k[1],C=t(""),j=C[0],D=C[1],w=t("string"),F=w[0],z=w[1],q=s.cols.find((function(e){return e.key===g}));return r((function(){D(""),N("")}),[g]),e(l,{children:[e("div",{className:"flex flex-col gap-2 mb-5",children:[n("p",{className:"font-bold text-lg",children:"フィルタ追加"}),e("div",{className:"flex flex-wrap gap-1",children:[e("select",{value:g,onChange:function(e){var l;e.preventDefault(),b(e.target.value);var n=null===(l=s.cols.find((function(l){return l.key===e.target.value})))||void 0===l?void 0:l.type;z(n)},children:[n("option",{value:"",children:"-- 列を選択 --"}),s.cols.filter((function(e){return!!e.label&&!!e.type})).map((function(e){return n("option",{value:e.key,children:e.label},e.key)}))]}),e("select",{value:x,onChange:function(e){e.preventDefault(),N(e.target.value)},disabled:!g,children:[n("option",{value:"",children:g?"-- 条件を選択 --":"-- 列を選択してください --"}),"string"===F&&a.map((function(e){return n("option",{value:e.key,children:e.label},e.key)})),"number"===F&&o.map((function(e){return n("option",{value:e.key,children:e.label},e.key)})),"select"===F&&c.map((function(e){return n("option",{value:e.key,children:e.label},e.key)}))]}),"select"===F?e("select",{value:j,onChange:function(e){e.preventDefault(),D(e.target.value)},children:[n("option",{value:"",children:"-- 未選択 --"}),"select"===q.type&&q.options.map((function(e){return n("option",{value:e.value,children:e.label},e.value)}))]}):n("input",{type:"text",value:j,onChange:function(e){e.preventDefault(),D(e.target.value)},placeholder:"-- 値を入力 --"})]}),n("div",{className:"flex justify-end",children:n("button",{className:"bg-gray-900 text-white py-1 px-2 rounded-md",onClick:function(e){var l;if(e.preventDefault(),g&&x&&("select"===q.type||j)){var n=s.cols.find((function(e){return e.key===g}));p("string"===F?{key:g,operator:x,value:[j]}:"select"===F?{key:g,operator:x,value:j,label:"select"===n.type?null===(l=n.options.find((function(e){return e.value===j})))||void 0===l?void 0:l.label:void 0}:{key:g,operator:x,value:Number(j)})}else alert("全ての項目を入力してください")},children:"追加"})})]}),e("div",{children:[m.length>0&&n("p",{className:"font-bold text-lg",children:"フィルタ一覧"}),n("ul",{className:"flex flex-col gap-1 my-2",children:m.map((function(l){var t,r;return e("li",{className:"flex justify-between",children:[e("p",{children:["「",n("strong",{children:null===(t=s.cols.find((function(e){return e.key===l.key})))||void 0===t?void 0:t.label}),"」 は",n("span",{children:null===(r=u.find((function(e){return e.key===l.operator})))||void 0===r?void 0:r.label}),":",n("span",{children:l.label?l.label:l.value})]}),n("button",{onClick:function(e){e.preventDefault(),h(l.id)},children:n(f,{size:16})})]},l.id)}))}),n("div",{className:"flex justify-center",children:n(d,{children:n("p",{className:"text-gray-600 underline hover:text-gray-800",children:"remove all filters"})})})]})]})}export{s as TableFilterForm};
2
- //# sourceMappingURL=filter-form.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"filter-form.js","sources":["../../../../src/table/filter-form.tsx"],"sourcesContent":["import { useEffect, useState } from \"react\";\nimport {\n FILTER_OPERATOR,\n NUMBER_FILTER_OPERATOR,\n SELECT_FILTER_OPERATOR,\n STRING_FILTER_OPERATOR,\n TNumberFilterOperator,\n TSelectFilterOperator,\n TStringFilterOperator,\n TableFilterRemoveButton,\n useTableFilterContext,\n} from \"./filter\";\nimport { DataObject, TColumnType, TTableColumn } from \"./type\";\nimport { CancelIcon } from \"./cancel-icon\";\n\ntype TPropsFilterForm<T extends DataObject> = {\n cols: TTableColumn<T>[];\n};\n\nexport function TableFilterForm<T extends DataObject>(\n props: TPropsFilterForm<T>\n) {\n const { addFilter, removeFilter, filterConditions } = useTableFilterContext();\n const [selectingKey, setSelectingKey] = useState<string>(\"\");\n const [selectingOperator, setSelectingOperator] = useState<string>(\"\");\n const [value, setValue] = useState<string>(\"\");\n const [filterType, setFilterType] = useState<TColumnType>(\"string\");\n\n const filterColumn = props.cols.find((col) => col.key === selectingKey)!;\n\n useEffect(() => {\n setValue(\"\");\n setSelectingOperator(\"\");\n }, [selectingKey]);\n\n return (\n <>\n <div className=\"flex flex-col gap-2 mb-5\">\n <p className=\"font-bold text-lg\">フィルタ追加</p>\n <div className=\"flex flex-wrap gap-1\">\n <select\n value={selectingKey}\n onChange={(e) => {\n e.preventDefault();\n setSelectingKey(e.target.value);\n const columnType = props.cols.find(\n (col) => col.key === e.target.value\n )?.type as TColumnType;\n setFilterType(columnType);\n }}\n >\n <option value=\"\">-- 列を選択 --</option>\n {props.cols\n .filter((col) => !!col.label && !!col.type)\n .map((col) => (\n <option key={col.key} value={col.key}>\n {col.label}\n </option>\n ))}\n </select>\n <select\n value={selectingOperator}\n onChange={(e) => {\n e.preventDefault();\n setSelectingOperator(e.target.value);\n }}\n disabled={!selectingKey}\n >\n <option value=\"\">\n {selectingKey ? \"-- 条件を選択 --\" : \"-- 列を選択してください --\"}\n </option>\n {filterType === \"string\" &&\n STRING_FILTER_OPERATOR.map((op) => (\n <option key={op.key} value={op.key}>\n {op.label}\n </option>\n ))}\n {filterType === \"number\" &&\n NUMBER_FILTER_OPERATOR.map((op) => (\n <option key={op.key} value={op.key}>\n {op.label}\n </option>\n ))}\n {filterType === \"select\" &&\n SELECT_FILTER_OPERATOR.map((op) => (\n <option key={op.key} value={op.key}>\n {op.label}\n </option>\n ))}\n </select>\n {filterType === \"select\" ? (\n <select\n value={value}\n onChange={(e) => {\n e.preventDefault();\n setValue(e.target.value);\n }}\n >\n <option value=\"\">-- 未選択 --</option>\n {filterColumn.type === \"select\" &&\n filterColumn.options.map((op) => (\n <option key={op.value} value={op.value}>\n {op.label}\n </option>\n ))}\n </select>\n ) : (\n <input\n type=\"text\"\n value={value}\n onChange={(e) => {\n e.preventDefault();\n setValue(e.target.value);\n }}\n placeholder=\"-- 値を入力 --\"\n />\n )}\n </div>\n <div className=\"flex justify-end\">\n <button\n className=\"bg-gray-900 text-white py-1 px-2 rounded-md\"\n onClick={(e) => {\n e.preventDefault();\n if (\n !selectingKey ||\n !selectingOperator ||\n (filterColumn.type !== \"select\" && !value)\n ) {\n alert(\"全ての項目を入力してください\");\n return;\n }\n\n const addFilterColumn = props.cols.find(\n (col) => col.key === selectingKey\n )!;\n\n addFilter(\n filterType === \"string\"\n ? {\n key: selectingKey,\n operator: selectingOperator as TStringFilterOperator,\n value: [value],\n }\n : filterType === \"select\"\n ? {\n key: selectingKey,\n operator: selectingOperator as TSelectFilterOperator,\n value: value,\n label:\n addFilterColumn.type === \"select\"\n ? addFilterColumn.options.find(\n (op) => op.value === value\n )?.label\n : undefined,\n }\n : {\n key: selectingKey,\n operator: selectingOperator as TNumberFilterOperator,\n value: Number(value),\n }\n );\n }}\n >\n 追加\n </button>\n </div>\n </div>\n <div>\n {filterConditions.length > 0 && (\n <p className=\"font-bold text-lg\">フィルタ一覧</p>\n )}\n <ul className=\"flex flex-col gap-1 my-2\">\n {filterConditions.map((f) => (\n <li key={f.id} className=\"flex justify-between\">\n <p>\n 「\n <strong>\n {props.cols.find((col) => col.key === f.key)?.label}\n </strong>\n 」 は\n <span>\n {FILTER_OPERATOR.find((op) => op.key === f.operator)?.label}\n </span>\n :<span>{f.label ? f.label : f.value}</span>\n </p>\n <button\n onClick={(e) => {\n e.preventDefault();\n removeFilter(f.id);\n }}\n >\n <CancelIcon size={16} />\n </button>\n </li>\n ))}\n </ul>\n <div className=\"flex justify-center\">\n <TableFilterRemoveButton>\n <p className=\"text-gray-600 underline hover:text-gray-800\">\n remove all filters\n </p>\n </TableFilterRemoveButton>\n </div>\n </div>\n </>\n );\n}\n"],"names":["TableFilterForm","props","_a","useTableFilterContext","addFilter","removeFilter","filterConditions","_b","useState","selectingKey","setSelectingKey","_c","selectingOperator","setSelectingOperator","_d","value","setValue","_e","filterType","setFilterType","filterColumn","cols","find","col","key","useEffect","_jsxs","_Fragment","children","className","_jsx","onChange","e","preventDefault","target","columnType","type","filter","label","map","disabled","STRING_FILTER_OPERATOR","op","NUMBER_FILTER_OPERATOR","SELECT_FILTER_OPERATOR","options","placeholder","onClick","addFilterColumn","operator","undefined","Number","alert","length","f","FILTER_OPERATOR","id","CancelIcon","size","TableFilterRemoveButton"],"mappings":"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"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"filter-icon.js","sources":["../../../../src/table/filter-icon.tsx"],"sourcesContent":["type TPropsFIlterIcon = {\n size?: number;\n isFilterActive?: boolean;\n};\n\nexport function FIlterIcon(props: TPropsFIlterIcon) {\n const size = props.size ?? 16;\n return (\n <div\n className={`duration-300 ${\n props.isFilterActive ? \"text-gray-700\" : \"text-gray-500\"\n }`}\n >\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n xmlnsXlink=\"http://www.w3.org/1999/xlink\"\n version=\"1.1\"\n width={`${size}px`}\n height={`${size}px`}\n viewBox=\"0 0 256 256\"\n xmlSpace=\"preserve\"\n >\n <defs></defs>\n {props.isFilterActive ? (\n <g\n style={{\n stroke: \"none\",\n strokeWidth: 0,\n strokeDasharray: \"none\",\n strokeLinecap: \"butt\",\n strokeLinejoin: \"miter\",\n strokeMiterlimit: 10,\n fill: \"none\",\n fillRule: \"nonzero\",\n opacity: 1,\n }}\n transform=\"translate(1.4065934065934016 1.4065934065934016) scale(2.81 2.81)\"\n >\n <path\n d=\"M 52.537 80.466 V 45.192 L 84.53 2.999 C 85.464 1.768 84.586 0 83.041 0 H 6.959 C 5.414 0 4.536 1.768 5.47 2.999 l 31.994 42.192 v 43.441 c 0 1.064 1.163 1.719 2.073 1.167 l 11.758 -7.127 C 52.065 82.205 52.537 81.368 52.537 80.466 z\"\n style={{\n stroke: \"none\",\n strokeWidth: 1,\n strokeDasharray: \"none\",\n strokeLinecap: \"butt\",\n strokeLinejoin: \"miter\",\n strokeMiterlimit: 10,\n fill: \"currentColor\",\n fillRule: \"nonzero\",\n opacity: 1,\n }}\n transform=\" matrix(1 0 0 1 0 0) \"\n strokeLinecap=\"round\"\n />\n </g>\n ) : (\n <g\n style={{\n stroke: \"none\",\n strokeWidth: 0,\n strokeDasharray: \"none\",\n strokeLinecap: \"butt\",\n strokeLinejoin: \"miter\",\n strokeMiterlimit: 10,\n fill: \"none\",\n fillRule: \"nonzero\",\n opacity: 1,\n }}\n transform=\"translate(1.4065934065934016 1.4065934065934016) scale(2.81 2.81)\"\n >\n <path\n d=\"M 37.882 90 c -0.338 0 -0.676 -0.086 -0.981 -0.258 c -0.629 -0.354 -1.019 -1.02 -1.019 -1.742 V 45.354 L 3.923 3.208 C 3.464 2.604 3.388 1.791 3.726 1.11 S 4.758 0 5.517 0 h 78.966 c 0.76 0 1.453 0.43 1.791 1.11 s 0.262 1.493 -0.197 2.098 L 54.118 45.354 V 79.37 c 0 0.699 -0.365 1.348 -0.963 1.71 l -14.237 8.63 C 38.601 89.903 38.241 90 37.882 90 z M 9.543 4 l 29.932 39.474 c 0.264 0.348 0.406 0.772 0.406 1.208 v 39.767 l 10.236 -6.205 V 44.682 c 0 -0.437 0.143 -0.861 0.406 -1.208 L 80.457 4 H 9.543 z M 52.118 79.37 h 0.01 H 52.118 z\"\n style={{\n stroke: \"none\",\n strokeWidth: 1,\n strokeDasharray: \"none\",\n strokeLinecap: \"butt\",\n strokeLinejoin: \"miter\",\n strokeMiterlimit: 10,\n fill: \"currentColor\",\n fillRule: \"nonzero\",\n opacity: 1,\n }}\n transform=\" matrix(1 0 0 1 0 0) \"\n strokeLinecap=\"round\"\n />\n </g>\n )}\n </svg>\n </div>\n );\n}\n"],"names":["FIlterIcon","props","size","_a","_jsx","className","concat","isFilterActive","children","_jsxs","xmlns","xmlnsXlink","version","width","height","viewBox","xmlSpace","style","stroke","strokeWidth","strokeDasharray","strokeLinecap","strokeLinejoin","strokeMiterlimit","fill","fillRule","opacity","transform","d"],"mappings":"kDAKM,SAAUA,EAAWC,SACnBC,EAAiB,QAAVC,EAAAF,EAAMC,YAAI,IAAAC,EAAAA,EAAI,GAC3B,OACEC,EAAA,MAAA,CACEC,UAAW,gBACTC,OAAAL,EAAMM,eAAiB,gBAAkB,iBACzCC,SAEFC,EACE,MAAA,CAAAC,MAAM,6BACNC,WAAW,+BACXC,QAAQ,MACRC,MAAO,GAAGP,OAAAJ,EAAQ,MAClBY,OAAQ,GAAGR,OAAAJ,EAAQ,MACnBa,QAAQ,cACRC,SAAS,WAAUR,SAAA,CAEnBJ,EAAa,OAAA,IACZH,EAAMM,eACLH,EAAA,IAAA,CACEa,MAAO,CACLC,OAAQ,OACRC,YAAa,EACbC,gBAAiB,OACjBC,cAAe,OACfC,eAAgB,QAChBC,iBAAkB,GAClBC,KAAM,OACNC,SAAU,UACVC,QAAS,GAEXC,UAAU,oEAEVnB,SAAAJ,EAAA,OAAA,CACEwB,EAAE,4OACFX,MAAO,CACLC,OAAQ,OACRC,YAAa,EACbC,gBAAiB,OACjBC,cAAe,OACfC,eAAgB,QAChBC,iBAAkB,GAClBC,KAAM,eACNC,SAAU,UACVC,QAAS,GAEXC,UAAU,wBACVN,cAAc,YAIlBjB,EAAA,IAAA,CACEa,MAAO,CACLC,OAAQ,OACRC,YAAa,EACbC,gBAAiB,OACjBC,cAAe,OACfC,eAAgB,QAChBC,iBAAkB,GAClBC,KAAM,OACNC,SAAU,UACVC,QAAS,GAEXC,UAAU,oEAEVnB,SAAAJ,EAAA,OAAA,CACEwB,EAAE,8hBACFX,MAAO,CACLC,OAAQ,OACRC,YAAa,EACbC,gBAAiB,OACjBC,cAAe,OACfC,eAAgB,QAChBC,iBAAkB,GAClBC,KAAM,eACNC,SAAU,UACVC,QAAS,GAEXC,UAAU,wBACVN,cAAc,gBAO5B"}
@@ -1,2 +0,0 @@
1
- import{__spreadArray as e,__assign as t}from"../../node_modules/tslib/tslib.es6.js";import{jsx as r}from"react/jsx-runtime";import{createContext as n,useReducer as i,useCallback as l,useContext as u}from"react";import{FIlterIcon as c}from"./filter-icon.js";var o=[{key:"includeText",label:"次の値を含む"}],a=[{key:"eq",label:"次の値と等しい"},{key:"ne",label:"次の値と等しくない"},{key:"gt",label:"次の値より大きい"},{key:"lt",label:"次の値より小さい"},{key:"gte",label:"次の値以上"},{key:"lte",label:"次の値以下"}],f=[{key:"selected",label:"次の値と等しい"},{key:"notSelected",label:"次の値と等しくない"}],s=e(e(e([],o,!0),a,!0),f,!0);function d(r,n){switch(n.type){case"add":return{filters:e(e([],r.filters,!0),[t({id:(new Date).getTime()},n.payload.filter)],!1)};case"remove":return{filters:r.filters.filter((function(e){return e.id!==n.payload.id}))};case"clear":return{filters:[]}}}function y(){var e=i(d,{filters:[]}),t=e[0],r=e[1],n=l((function(e){return r({type:"add",payload:{filter:e}})}),[r]);return{addFilter:n,removeFilter:l((function(e){return r({type:"remove",payload:{id:e}})}),[r]),clearFilter:l((function(){return r({type:"clear"})}),[r]),filter:l((function(e){return t.filters.reduce((function(e,t){switch(t.operator){case"includeText":return e.filter((function(e){var r=e[t.key];return"string"==typeof r&&t.value.some((function(e){return r.includes(e)}))}));case"eq":case"selected":return e.filter((function(e){return e[t.key]===t.value}));case"ne":case"notSelected":return e.filter((function(e){return e[t.key]!==t.value}));case"gt":return e.filter((function(e){return e[t.key]>t.value}));case"lt":return e.filter((function(e){return e[t.key]<t.value}));case"gte":return e.filter((function(e){return e[t.key]>=t.value}));case"lte":return e.filter((function(e){return e[t.key]<=t.value}))}}),e)}),[t]),filterConditions:t.filters}}var v=n({addFilter:function(){},removeFilter:function(){},clearFilter:function(){},filter:function(){return[]},filterConditions:[]});function k(e){var t=e.children;return r(v.Provider,{value:y(),children:t})}function m(){return u(v)}function p(e){var t=m().filterConditions;return r("div",{className:"relative cursor-pointer",onClick:e.onClick,children:r(c,{isFilterActive:t.filter((function(t){return t.key===e.keyName})).length>0})})}function b(e){var t=e.children,n=m(),i=n.clearFilter;if(0!==n.filterConditions.length)return r("button",{onClick:function(e){e.preventDefault(),i()},children:t})}export{s as FILTER_OPERATOR,a as NUMBER_FILTER_OPERATOR,f as SELECT_FILTER_OPERATOR,o as STRING_FILTER_OPERATOR,p as TableFilter,k as TableFilterProvider,b as TableFilterRemoveButton,d as filterReducer,m as useTableFilterContext};
2
- //# sourceMappingURL=filter.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"filter.js","sources":["../../../../src/table/filter.tsx"],"sourcesContent":["import { createContext, useCallback, useContext, useReducer } from \"react\";\nimport { DataObject } from \"./type\";\nimport { FIlterIcon } from \"./filter-icon\";\n\nexport const STRING_FILTER_OPERATOR = [\n { key: \"includeText\", label: \"次の値を含む\" },\n] as const;\n\nexport const NUMBER_FILTER_OPERATOR = [\n { key: \"eq\", label: \"次の値と等しい\" },\n { key: \"ne\", label: \"次の値と等しくない\" },\n { key: \"gt\", label: \"次の値より大きい\" },\n { key: \"lt\", label: \"次の値より小さい\" },\n { key: \"gte\", label: \"次の値以上\" },\n { key: \"lte\", label: \"次の値以下\" },\n] as const;\n\nexport const SELECT_FILTER_OPERATOR = [\n { key: \"selected\", label: \"次の値と等しい\" },\n { key: \"notSelected\", label: \"次の値と等しくない\" },\n] as const;\n\nexport const FILTER_OPERATOR = [\n ...STRING_FILTER_OPERATOR,\n ...NUMBER_FILTER_OPERATOR,\n ...SELECT_FILTER_OPERATOR,\n] as const;\n\nexport type TStringFilterOperator =\n (typeof STRING_FILTER_OPERATOR)[number][\"key\"];\nexport type TNumberFilterOperator =\n (typeof NUMBER_FILTER_OPERATOR)[number][\"key\"];\nexport type TSelectFilterOperator =\n (typeof SELECT_FILTER_OPERATOR)[number][\"key\"];\nexport type TFilterOperator =\n | TStringFilterOperator\n | TNumberFilterOperator\n | TSelectFilterOperator;\n\ntype TStringFilter = {\n key: string;\n operator: TStringFilterOperator;\n value: string[];\n label?: string;\n};\n\ntype TNumberFilter = {\n key: string;\n operator: TNumberFilterOperator;\n value: number;\n label?: string;\n};\n\ntype TSelectFilter = {\n key: string;\n operator: TSelectFilterOperator;\n value: string;\n label?: string;\n};\n\ntype TFilter = TStringFilter | TNumberFilter | TSelectFilter;\n\ntype TFilterState = {\n filters: ({ id: number } & TFilter)[];\n};\n\ntype TFilterAction =\n | { type: \"add\"; payload: { filter: TFilter } }\n | { type: \"remove\"; payload: { id: number } }\n | { type: \"clear\" };\n\nexport function filterReducer(\n state: TFilterState,\n action: TFilterAction\n): TFilterState {\n switch (action.type) {\n case \"add\":\n return {\n filters: [\n ...state.filters,\n { id: new Date().getTime(), ...action.payload.filter },\n ],\n };\n case \"remove\":\n return {\n filters: state.filters.filter((f) => f.id !== action.payload.id),\n };\n case \"clear\":\n return { filters: [] };\n }\n}\n\nfunction useFilterReducer() {\n const [state, dispatch] = useReducer(filterReducer, { filters: [] });\n\n const addFilter = useCallback(\n (filter: TFilter) => dispatch({ type: \"add\", payload: { filter } }),\n [dispatch]\n );\n const removeFilter = useCallback(\n (id: number) => dispatch({ type: \"remove\", payload: { id } }),\n [dispatch]\n );\n const clearFilter = useCallback(\n () => dispatch({ type: \"clear\" }),\n [dispatch]\n );\n\n const filter = useCallback(\n <T extends DataObject>(rows: T[]): T[] => {\n return state.filters.reduce((acc, filter) => {\n switch (filter.operator) {\n case \"includeText\":\n return acc.filter((row) => {\n const value = row[filter.key];\n if (typeof value === \"string\") {\n return filter.value.some((v) => value.includes(v));\n }\n return false;\n });\n case \"eq\":\n return acc.filter((row) => row[filter.key] === filter.value);\n case \"ne\":\n return acc.filter((row) => row[filter.key] !== filter.value);\n case \"gt\":\n return acc.filter((row) => row[filter.key] > filter.value);\n case \"lt\":\n return acc.filter((row) => row[filter.key] < filter.value);\n case \"gte\":\n return acc.filter((row) => row[filter.key] >= filter.value);\n case \"lte\":\n return acc.filter((row) => row[filter.key] <= filter.value);\n case \"selected\":\n return acc.filter((row) => row[filter.key] === filter.value);\n case \"notSelected\":\n return acc.filter((row) => row[filter.key] !== filter.value);\n }\n }, rows);\n },\n [state]\n );\n\n return {\n addFilter,\n removeFilter,\n clearFilter,\n filter,\n filterConditions: state.filters,\n };\n}\n\nconst TableFilterContext = createContext<ReturnType<typeof useFilterReducer>>({\n addFilter: () => {},\n removeFilter: () => {},\n clearFilter: () => {},\n filter: () => [],\n filterConditions: [],\n});\n\nexport function TableFilterProvider({\n children,\n}: {\n children: JSX.Element | JSX.Element[];\n}) {\n return (\n <TableFilterContext.Provider value={useFilterReducer()}>\n {children}\n </TableFilterContext.Provider>\n );\n}\n\nexport function useTableFilterContext() {\n return useContext(TableFilterContext);\n}\n\ntype TPropsTableFilter = {\n keyName: string;\n onClick: React.MouseEventHandler<HTMLDivElement>;\n};\n\nexport function TableFilter(props: TPropsTableFilter) {\n const { filterConditions } = useTableFilterContext();\n\n return (\n <div className=\"relative cursor-pointer\" onClick={props.onClick}>\n <FIlterIcon\n isFilterActive={\n filterConditions.filter((f) => f.key === props.keyName).length > 0\n }\n />\n </div>\n );\n}\n\nexport function TableFilterRemoveButton({\n children,\n}: {\n children: React.ReactNode;\n}) {\n const { clearFilter, filterConditions } = useTableFilterContext();\n\n if (filterConditions.length === 0) {\n return;\n }\n\n return (\n <button\n onClick={(e) => {\n e.preventDefault();\n clearFilter();\n }}\n >\n {children}\n </button>\n );\n}\n"],"names":["STRING_FILTER_OPERATOR","key","label","NUMBER_FILTER_OPERATOR","SELECT_FILTER_OPERATOR","FILTER_OPERATOR","__spreadArray","filterReducer","state","action","type","filters","__assign","id","Date","getTime","payload","filter","f","useFilterReducer","_a","useReducer","dispatch","addFilter","useCallback","removeFilter","clearFilter","rows","reduce","acc","operator","row","value","some","v","includes","filterConditions","TableFilterContext","createContext","TableFilterProvider","children","_jsx","Provider","useTableFilterContext","useContext","TableFilter","props","className","onClick","FIlterIcon","isFilterActive","keyName","length","TableFilterRemoveButton","_b","e","preventDefault"],"mappings":"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"}
@@ -1,2 +0,0 @@
1
- import{__assign as e}from"../../node_modules/tslib/tslib.es6.js";import{jsxs as r,jsx as t}from"react/jsx-runtime";import{memo as n,useReducer as u,useCallback as a}from"react";function o(r,t){switch(t.type){case"setRowCount":return e(e({},r),{rowCount:t.payload.rouCount});case"setPerPage":return e(e({},r),{perPage:t.payload.perPage});case"next":return r.currentPage===Math.ceil(r.rowCount/r.perPage)?r:e(e({},r),{currentPage:r.currentPage+1});case"prev":return 1===r.currentPage?r:e(e({},r),{currentPage:r.currentPage-1});case"jump":return t.payload.pageNumber<1||t.payload.pageNumber>Math.ceil(r.rowCount/r.perPage)||r.currentPage===t.payload.pageNumber?r:e(e({},r),{currentPage:t.payload.pageNumber});default:return r}}var c={perPage:50,currentPage:1,rowCount:0};function p(e){var r=u(o,null!=e?e:c),t=r[0],n=r[1],p=a((function(){return n({type:"next"})}),[n]),i=a((function(){return n({type:"prev"})}),[n]),l=a((function(e){return n({type:"jump",payload:{pageNumber:e}})}),[n]),s=a((function(e){return n({type:"setRowCount",payload:{rouCount:e}})}),[n]);return{perPage:t.perPage,currentPage:t.currentPage,rowCount:t.rowCount,pageCount:Math.ceil(t.rowCount/t.perPage),from:(t.currentPage-1)*t.perPage,to:t.currentPage*t.perPage,next:p,prev:i,jump:l,setRowCount:s}}var i=n((function(e){return r("div",{className:"flex justify-center gap-2",children:[t("button",{className:"text-sm",onClick:function(){return e.jump(1)},disabled:1===e.current,children:"≪"}),t("button",{className:"text-sm",onClick:function(){return e.prev()},disabled:1===e.current,children:"<"}),Array.from({length:e.count},(function(e,r){return r+1})).filter((function(r){return e.current-2<=r&&r<=e.current+2})).map((function(r){return t("button",{className:"text-sm ".concat(e.current===r?"text-blue-600":""),onClick:function(){return e.jump(r)},children:r},r)})),t("button",{className:"text-sm",onClick:function(){return e.next()},disabled:e.current===e.count,children:">"}),t("button",{className:"text-sm",onClick:function(){return e.jump(e.count)},disabled:e.current===e.count,children:"≫"})]})}));export{i as Pagenation,p as usePageReducer};
2
- //# sourceMappingURL=page.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"page.js","sources":["../../../../src/table/page.tsx"],"sourcesContent":["import { memo, useCallback, useReducer } from \"react\";\n\ntype TPage = {\n perPage: number;\n currentPage: number;\n rowCount: number;\n};\n\ntype TPageMoveAction =\n | { type: \"setRowCount\"; payload: { rouCount: number } }\n | { type: \"setPerPage\"; payload: { perPage: number } }\n | {\n type: \"next\";\n }\n | {\n type: \"prev\";\n }\n | {\n type: \"jump\";\n payload: { pageNumber: number };\n };\n\nfunction pageReducer(state: TPage, action: TPageMoveAction): TPage {\n switch (action.type) {\n case \"setRowCount\":\n return {\n ...state,\n rowCount: action.payload.rouCount,\n };\n case \"setPerPage\":\n return {\n ...state,\n perPage: action.payload.perPage,\n };\n case \"next\":\n if (state.currentPage === Math.ceil(state.rowCount / state.perPage)) {\n return state;\n }\n\n return {\n ...state,\n currentPage: state.currentPage + 1,\n };\n case \"prev\":\n if (state.currentPage === 1) {\n return state;\n }\n\n return {\n ...state,\n currentPage: state.currentPage - 1,\n };\n case \"jump\":\n if (\n action.payload.pageNumber < 1 ||\n action.payload.pageNumber > Math.ceil(state.rowCount / state.perPage) ||\n state.currentPage === action.payload.pageNumber\n ) {\n return state;\n }\n\n return {\n ...state,\n currentPage: action.payload.pageNumber,\n };\n default:\n return state;\n }\n}\n\nconst InitialPageState: TPage = {\n perPage: 50,\n currentPage: 1,\n rowCount: 0,\n};\n\nexport function usePageReducer(initialState?: TPage) {\n const [state, dispatch] = useReducer(\n pageReducer,\n initialState ?? InitialPageState\n );\n\n const next = useCallback(() => dispatch({ type: \"next\" }), [dispatch]);\n const prev = useCallback(() => dispatch({ type: \"prev\" }), [dispatch]);\n const jump = useCallback(\n (pageNumber: number) => dispatch({ type: \"jump\", payload: { pageNumber } }),\n [dispatch]\n );\n const setRowCount = useCallback(\n (rouCount: number) =>\n dispatch({ type: \"setRowCount\", payload: { rouCount } }),\n [dispatch]\n );\n\n return {\n perPage: state.perPage,\n currentPage: state.currentPage,\n rowCount: state.rowCount,\n pageCount: Math.ceil(state.rowCount / state.perPage),\n from: (state.currentPage - 1) * state.perPage,\n to: state.currentPage * state.perPage,\n next,\n prev,\n jump,\n setRowCount,\n };\n}\n\ntype TPropsPagenation = {\n count: number;\n current: number;\n jump: (pageNumber: number) => void;\n next: () => void;\n prev: () => void;\n};\n\nexport const Pagenation = memo(function TablePagenation(\n props: TPropsPagenation\n) {\n return (\n <div className=\"flex justify-center gap-2\">\n <button\n className=\"text-sm\"\n onClick={() => props.jump(1)}\n disabled={props.current === 1}\n >\n &#x226A;\n </button>\n <button\n className=\"text-sm\"\n onClick={() => props.prev()}\n disabled={props.current === 1}\n >\n &lt;\n </button>\n {Array.from({ length: props.count }, (_, i) => i + 1)\n .filter((i) => props.current - 2 <= i && i <= props.current + 2)\n .map((i) => (\n <button\n key={i}\n className={`text-sm ${props.current === i ? \"text-blue-600\" : \"\"}`}\n onClick={() => props.jump(i)}\n >\n {i}\n </button>\n ))}\n <button\n className=\"text-sm\"\n onClick={() => props.next()}\n disabled={props.current === props.count}\n >\n &gt;\n </button>\n <button\n className=\"text-sm\"\n onClick={() => props.jump(props.count)}\n disabled={props.current === props.count}\n >\n &#x226B;\n </button>\n </div>\n );\n});\n"],"names":["pageReducer","state","action","type","__assign","rowCount","payload","rouCount","perPage","currentPage","Math","ceil","pageNumber","InitialPageState","usePageReducer","initialState","_a","useReducer","dispatch","next","useCallback","prev","jump","setRowCount","pageCount","from","to","Pagenation","memo","props","_jsxs","className","_jsx","onClick","disabled","current","children","Array","length","count","_","i","filter","map","concat"],"mappings":"iLAsBA,SAASA,EAAYC,EAAcC,GACjC,OAAQA,EAAOC,MACb,IAAK,cACH,OACKC,EAAAA,EAAA,CAAA,EAAAH,IACHI,SAAUH,EAAOI,QAAQC,WAE7B,IAAK,aACH,OACKH,EAAAA,EAAA,CAAA,EAAAH,IACHO,QAASN,EAAOI,QAAQE,UAE5B,IAAK,OACH,OAAIP,EAAMQ,cAAgBC,KAAKC,KAAKV,EAAMI,SAAWJ,EAAMO,SAClDP,EAIJG,EAAAA,EAAA,CAAA,EAAAH,IACHQ,YAAaR,EAAMQ,YAAc,IAErC,IAAK,OACH,OAA0B,IAAtBR,EAAMQ,YACDR,EAIJG,EAAAA,EAAA,CAAA,EAAAH,IACHQ,YAAaR,EAAMQ,YAAc,IAErC,IAAK,OACH,OACEP,EAAOI,QAAQM,WAAa,GAC5BV,EAAOI,QAAQM,WAAaF,KAAKC,KAAKV,EAAMI,SAAWJ,EAAMO,UAC7DP,EAAMQ,cAAgBP,EAAOI,QAAQM,WAE9BX,EAIJG,EAAAA,EAAA,CAAA,EAAAH,IACHQ,YAAaP,EAAOI,QAAQM,aAEhC,QACE,OAAOX,EAEb,CAEA,IAAMY,EAA0B,CAC9BL,QAAS,GACTC,YAAa,EACbJ,SAAU,GAGN,SAAUS,EAAeC,GACvB,IAAAC,EAAoBC,EACxBjB,EACAe,QAAAA,EAAgBF,GAFXZ,OAAOiB,OAKRC,EAAOC,GAAY,WAAM,OAAAF,EAAS,CAAEf,KAAM,QAAjB,GAA4B,CAACe,IACtDG,EAAOD,GAAY,WAAM,OAAAF,EAAS,CAAEf,KAAM,QAAjB,GAA4B,CAACe,IACtDI,EAAOF,GACX,SAACR,GAAuB,OAAAM,EAAS,CAAEf,KAAM,OAAQG,QAAS,CAAEM,WAAUA,OACtE,CAACM,IAEGK,EAAcH,GAClB,SAACb,GACC,OAAAW,EAAS,CAAEf,KAAM,cAAeG,QAAS,CAAEC,SAAQA,IAAnD,GACF,CAACW,IAGH,MAAO,CACLV,QAASP,EAAMO,QACfC,YAAaR,EAAMQ,YACnBJ,SAAUJ,EAAMI,SAChBmB,UAAWd,KAAKC,KAAKV,EAAMI,SAAWJ,EAAMO,SAC5CiB,MAAOxB,EAAMQ,YAAc,GAAKR,EAAMO,QACtCkB,GAAIzB,EAAMQ,YAAcR,EAAMO,QAC9BW,KAAIA,EACJE,KAAIA,EACJC,KAAIA,EACJC,YAAWA,EAEf,KAUaI,EAAaC,GAAK,SAC7BC,GAEA,OACEC,EAAK,MAAA,CAAAC,UAAU,sCACbC,EACE,SAAA,CAAAD,UAAU,UACVE,QAAS,WAAM,OAAAJ,EAAMP,KAAK,EAAE,EAC5BY,SAA4B,IAAlBL,EAAMM,uBAIlBH,EAAA,SAAA,CACED,UAAU,UACVE,QAAS,WAAM,OAAAJ,EAAMR,MAAM,EAC3Ba,SAA4B,IAAlBL,EAAMM,QAGTC,SAAA,MACRC,MAAMZ,KAAK,CAAEa,OAAQT,EAAMU,QAAS,SAACC,EAAGC,GAAM,OAAAA,EAAI,CAAC,IACjDC,QAAO,SAACD,GAAM,OAAAZ,EAAMM,QAAU,GAAKM,GAAKA,GAAKZ,EAAMM,QAAU,CAA/C,IACdQ,KAAI,SAACF,GAAM,OACVT,EAAA,SAAA,CAEED,UAAW,WAAWa,OAAAf,EAAMM,UAAYM,EAAI,gBAAkB,IAC9DR,QAAS,WAAM,OAAAJ,EAAMP,KAAKmB,EAAX,EAEdL,SAAAK,GAJIA,EAMR,IACHT,EACE,SAAA,CAAAD,UAAU,UACVE,QAAS,WAAM,OAAAJ,EAAMV,MAAM,EAC3Be,SAAUL,EAAMM,UAAYN,EAAMU,MAAKH,SAAA,MAIzCJ,EACE,SAAA,CAAAD,UAAU,UACVE,QAAS,WAAM,OAAAJ,EAAMP,KAAKO,EAAMU,MAAM,EACtCL,SAAUL,EAAMM,UAAYN,EAAMU,MAAKH,SAAA,QAM/C"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"sort-icon.js","sources":["../../../../src/table/sort-icon.tsx"],"sourcesContent":["import { memo } from \"react\";\n\ntype TPropsSortIcon = {\n sortOrder?: \"ASC\" | \"DESC\";\n isSortActive?: boolean;\n size?: number;\n};\n\nconst SortIcon = memo(function SI(props: TPropsSortIcon) {\n const size = props.size || 16;\n const order = props.sortOrder || \"ASC\";\n\n return (\n <div\n className=\"relative\"\n style={{ width: `${size}px`, height: `${size}px` }}\n >\n <div\n className={`absolute top-1/2 right-0 w-[40%] h-[20%] duration-300 ${\n order === \"ASC\" ? \"-translate-y-[250%]\" : \"translate-y-[150%]\"\n } ${\n props.isSortActive\n ? \"bg-gray-700\"\n : \"bg-gray-200 border border-gray-500\"\n }`}\n ></div>\n <div\n className={`absolute top-1/2 right-0 w-[70%] h-[20%] duration-300 -translate-y-1/2 ${\n props.isSortActive\n ? \"bg-gray-700\"\n : \"bg-gray-200 border border-gray-500\"\n }`}\n ></div>\n <div\n className={`absolute top-1/2 right-0 w-full h-[20%] duration-300 ${\n order === \"ASC\" ? \"translate-y-[150%]\" : \"-translate-y-[250%]\"\n } ${\n props.isSortActive\n ? \"bg-gray-700\"\n : \"bg-gray-200 border border-gray-500\"\n }`}\n ></div>\n </div>\n );\n});\n\nexport { SortIcon };\n"],"names":["SortIcon","memo","props","size","order","sortOrder","_jsxs","className","style","width","height","children","_jsx","concat","isSortActive"],"mappings":"+EAQA,IAAMA,EAAWC,GAAK,SAAYC,GAChC,IAAMC,EAAOD,EAAMC,MAAQ,GACrBC,EAAQF,EAAMG,WAAa,MAEjC,OACEC,EACE,MAAA,CAAAC,UAAU,WACVC,MAAO,CAAEC,MAAO,UAAGN,EAAI,MAAMO,OAAQ,UAAGP,EAAI,OAAMQ,SAAA,CAElDC,SACEL,UAAW,gEACC,QAAVH,EAAkB,sBAAwB,qBAE1C,KAAAS,OAAAX,EAAMY,aACF,cACA,wCAGRF,EACE,MAAA,CAAAL,UAAW,2EAAAM,OACTX,EAAMY,aACF,cACA,wCAGRF,EACE,MAAA,CAAAL,UAAW,wDAAAM,OACC,QAAVT,EAAkB,qBAAuB,sBAAqB,MAAAS,OAE9DX,EAAMY,aACF,cACA,0CAKd"}
@@ -1,2 +0,0 @@
1
- import{jsx as r}from"react/jsx-runtime";import{SortIcon as o}from"./sort-icon.js";function i(i){return r("div",{onClick:i.onClick,className:"cursor-pointer",children:r(o,{sortOrder:i.isSortedByThis?i.sortOrder:"ASC",isSortActive:i.isSortedByThis})})}export{i as Sort};
2
- //# sourceMappingURL=sort.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"sort.js","sources":["../../../../src/table/sort.tsx"],"sourcesContent":["import { SortIcon } from \"./sort-icon\";\n\ntype TPropsSort = {\n onClick: (e: React.MouseEvent<HTMLDivElement>) => void;\n isSortedByThis: boolean;\n sortOrder: \"ASC\" | \"DESC\";\n};\n\nexport function Sort(props: TPropsSort) {\n return (\n <div onClick={props.onClick} className=\"cursor-pointer\">\n <SortIcon\n sortOrder={props.isSortedByThis ? props.sortOrder : \"ASC\"}\n isSortActive={props.isSortedByThis}\n />\n </div>\n );\n}\n"],"names":["Sort","props","_jsx","onClick","className","children","SortIcon","sortOrder","isSortedByThis","isSortActive"],"mappings":"kFAQM,SAAUA,EAAKC,GACnB,OACEC,EAAK,MAAA,CAAAC,QAASF,EAAME,QAASC,UAAU,iBACrCC,SAAAH,EAACI,EACC,CAAAC,UAAWN,EAAMO,eAAiBP,EAAMM,UAAY,MACpDE,aAAcR,EAAMO,kBAI5B"}