amotify 0.1.31 → 0.1.32

package/dist/fn/Table/Data.js

@@ -1 +1,974 @@
-import{b as s,c as R,d as q}from"../../chunk-VY3566IV.js";import{Fragment as W,jsx as n,jsxs as x}from"react/jsx-runtime";import{useState as F,useEffect as G}from"react";import{$$ as I,useStore as L}from"../../@utils/_";import B from"../../atoms/Box";import M from"../../atoms/Flex";import K from"../../atoms/FAI";import Y from"../../atoms/Span";import Z from"../../mols/Column";import A from"../../mols/Row";import E from"../Button";import U from"../Sheet";import O from"../Input/_";import{faArrowUp as ee}from"@fortawesome/free-solid-svg-icons/faArrowUp";import{faArrowDown as te}from"@fortawesome/free-solid-svg-icons/faArrowDown";import{faArrowRight as re}from"@fortawesome/free-solid-svg-icons/faArrowRight";import{faFilter as oe}from"@fortawesome/free-solid-svg-icons/faFilter";import P from"./Parts";import ne from"./Wrapper";import{DefaultCellSystemStyles as V}from"./cellStyling";import{TableClasses as b}from"../../@styles/componentClasses/_";const f={__memoryID:I.uuid.gen(),Header:t=>{let{val_status:e,set_status:r,KeywordFilterRows:i}=s({},t),{order:u,filter:o}=e,[w,S]=u.current,c=[],g=[...e.head];e.checker&&c.push(n(P.TH,R(s(s(R(s({},e.cellStyles),{fontWeight:"2.normal",position:"sticky",top:0,unitWidth:4,padding:0}),V({top:!0,bottom:!e.rows.length,left:!0,right:!e.colLength})),e.cellStylesCallback?e.cellStylesCallback({top:!0,bottom:!e.rows.length,left:!0,right:!e.colLength,rowIndex:0,colIndex:0,isBody:!1,isHeader:!0}):{}),{className:[b("Cell"),e.cellClassName].join(" "),freeCSS:{zIndex:2},children:n(B,{flexCenter:!0,children:n(O.Checker,{label:null,value:!1,onUpdateValidValue:({value:l})=>{let h=e.rows;h.forEach(C=>{C.checked=l}),r(R(s({},e),{rows:h}))}})})})));for(let l=0;l<e.colLength;l++){let h=g[l];if(!h)continue;let C=h.children||h.data,a=u.enabled&&u.column[l],d=o.enabled&&o.column[l],p=a?n(K,{fontSize:"1.mini",fontColor:l==w?"1.clear":"5.translucent",icon:l==w?S=="DESC"?te:ee:re}):null,_=n(W,{});if(d){let k=i.map(T=>{var N;return(N=T[l])==null?void 0:N.data});k=[...new Set(k)].order({direction:"ASC"});let v=o.current[l];if(v){let T=k.filter(y=>!v.includes(y)),N=[];k.forEach(y=>{y&&N.push({value:y,label:n(B,{flexSizing:"auto",children:y})})});let j="BUTTON-"+e.componentID+"-"+l,J=e.componentID+"-"+l,X={sheetID:J,parent:"#"+j,gravityPoint:23,type:"custom",content:x(M,{flexType:"col",border:!0,boxShadow:"3.remark",backgroundColor:"1.layer.base",borderRadius:1,freeCSS:{minWidth:12*20,maxWidth:12*30},children:[n(Z,{gap:"1/3",overflow:"auto",padding:"2/3",freeCSS:{maxHeight:12*30},children:n(O.Checkbox,{tone:"cloud",icon:!0,value:T,display:"flex",gap:"1/2",override:"force",options:N,hideInput:!0,name:"DTFilter-col-"+l+"-table-"+e.componentID,cellStyles:{flexSizing:"auto",padding:"2/3"},onUpdateValidValue:({value:y})=>{let H=k.filter(Q=>!y.includes(Q)),$=s({},e);$.filter.current[l]=H,r($)}})}),x(A.Separate,{gap:"2/3",padding:"2/3",horizontalAlign:"right",children:[n(E.Button.Border.S,{isRounded:!0,onClick:()=>{U.close(J)},children:"\u9589\u3058\u308B"}),n(E.Button.Prime.S,{color:"theme",isRounded:!0,ssEffectsOnActive:"shrink",onClick:()=>{let y=[];v.length||(y=k);let H=s({},e);H.filter.current[l]=y,r(H)},children:"\u5168\u9078\u629E"})]})]})};U.refresh(X,!0),_=n(B,{className:b("FilterRegion"),children:n(E.Button.Sub.S,{ssSphere:2.5,fontSize:"1.mini",className:b("Filtering_"+!!v.length),id:j,onClick:y=>{y.stopPropagation(),U.open(X)},children:n(K,{icon:oe})})})}}h=R(s(s(s(s({},e.cellStyles),h),V({top:!0,bottom:!e.rows.length,left:l==Number(e.checker),right:l==e.colLength-1})),e.cellStylesCallback?e.cellStylesCallback({top:!0,bottom:!e.rows.length,left:l==Number(e.checker),right:l==e.colLength-1,rowIndex:0,colIndex:l,isBody:!1,isHeader:!0}):{}),{ssPushable:a,className:[b("Cell"),e.cellClassName,h.className].join(" ")}),c.push(n(P.TH,R(s({fontWeight:"2.normal",position:"sticky",top:0},h),{freeCSS:s({zIndex:2},h.freeCSS),onClick:k=>{if(a){let v=s({},e),T=[l,w===l&&S=="ASC"?"DESC":"ASC"];v.order.current=T,r(v),e.onOrderChanged&&e.onOrderChanged(T)}},children:x(M,{flexType:"row-r",flexWrap:!1,height:1,borderRadius:"inherit",flexCenter:!0,children:[_,x(M,{flexSizing:0,position:"relative",borderRadius:"inherit",gap:"1/3",flexWrap:!1,horizontalAlign:"center",children:[p,C]})]})})))}return n(P.Row,{className:[b("Row"),b("HeadRow")].join(" "),children:c})},Body:t=>{let{val_status:e,PageRows:r}=t,i=[];if(r.forEach((u,o)=>{let w=[...u],S=[];e.checker&&S.push(n(P.TH,R(s(s(s({unitWidth:4,padding:0,borderRight:!0},e.cellStyles),V({top:o==0&&!e.head,bottom:o==r.length-1,left:!0,right:!e.colLength})),e.cellStylesCallback?e.cellStylesCallback({top:o==0&&!e.head,bottom:o==r.length-1,left:!0,right:!e.colLength,rowIndex:o,colIndex:0,isBody:!0,isHeader:!1}):{}),{className:[b("Cell"),e.cellClassName].join(" "),children:n(B,{flexCenter:!0,children:n(O.Checker,{label:null,value:u.checked,override:"force",onUpdateValidValue:({value:c})=>{let g=e.rows;g[o].checked=c,t.set_status(R(s({},e),{rows:g}))}})})}))),w.forEach((c,g)=>{if(!c)return;let a=c,{type:l="td"}=a,h=q(a,["type"]);h=R(s(s(s(s({},e.cellStyles),h),V({top:o==0&&!e.head,bottom:o==r.length-1,left:e.checker?!1:g==0,right:g==e.colLength-1})),e.cellStylesCallback?e.cellStylesCallback({top:o==0&&!e.head,bottom:o==r.length-1,left:e.checker?!1:g==0,right:g==e.colLength-1,rowIndex:o,colIndex:g,isBody:!0,isHeader:!1}):{}),{className:[b("Cell"),e.cellClassName,h.className].join(" ")});let C=P[l=="td"?"TD":"TH"];S.push(n(C,s({},h),g))}),i.push(n(P.Row,{className:[b("Row"),b("BodyRow")].join(" "),children:S,onClick:c=>{e.onRowClick&&e.onRowClick(JSON.parse(u.rowID),c)}},o))}),!r.length){let u=n(B,{padding:2,fontColor:"4.thin",freeCSS:{textAlign:"center"},borderTop:"1.thin",children:"\u30C6\u30FC\u30D6\u30EB\u304C\u3042\u308A\u307E\u305B\u3093"});e.noRecords&&(u=n(W,{children:e.noRecords})),i.push(n(P.Row,{className:[b("Row"),b("BodyRow"),b("DataNotFound")].join(" "),children:n(P.TD,{colSpan:e.colLength,className:b("Cell"),children:u})},"dataNotFound"))}return n(W,{children:i})},Core:t=>{let{val_status:e,set_status:r}=t,{searchKeyword:i,filter:u,order:o,paging:w}=e,S=[...e.rows],c=[...e.rows],g=[...e.rows],l=[...e.rows];if(i&&(c=S.filter(a=>(a.__sys4SearchKey||"").match(new RegExp(i,"i"))?1:0),g=[...c],l=[...c]),u.enabled)for(let a=0;a<e.colLength;a++){let d=u.column[a],p=u.current[a];d&&p&&p.length&&(g=g.filter(_=>!p.includes(_[a].data)),l=[...g])}o.enabled&&(g=g.order({direction:o.current[1],keys:[o.current[0],"orderIndex"]}),l=[...g]);{let{currentPageIndex:a,rowLength:d}=w;l=[...l].splice((a-1)*d,d)}let h=f.__memoryID+"_"+e.tableID,C={tableComponentDidMount:!0,totalRows:S.length,pageRows:l.length,filteredRows:g.length,filter:e.filter,order:e.order,paging:e.paging,searchKeyword:e.searchKeyword};return L.update({key:h,value:{status:C,updatePageIndex:a=>{let d=Math.min(Math.max(1,a),e.paging.pageLength),p=s({},e);p.paging.currentPageIndex=d,r(p)},updateRowLength:a=>{let d=s({},e);d.paging={rowLength:a,currentPageIndex:1,pageLength:Math.ceil(g.length/a)},r(d)},updateKeyword:a=>{I.interval.clear("InputSearchTime"),I.interval.standBy("InputSearchTime",200,()=>{let d=s({},e);d.searchKeyword=a,d.paging.currentPageIndex=1,d.filter.current=d.filter.current.map(()=>[]),r(d)})},getRowData:()=>{let a=[...S];return o.enabled&&(a=a.order({direction:o.current[1],keys:[o.current[0],"orderIndex"]})),a.forEach(d=>{d.currentPage=!1,d.filtered=!1}),l.forEach(d=>{let{rowID:p}=d;a.find(_=>_.rowID==p).currentPage=!0}),g.forEach(d=>{let{rowID:p}=d;a.find(_=>_.rowID==p).filtered=!0}),a}}}),G(()=>{let a=f.Propagations[e.tableID]||[];Object.keys(a).forEach(d=>{let p=L.get(d);p!=null&&p.refresh&&p.refresh()})}),n(B,{className:b("TableBase"),children:x(P.Table,{className:b("Table"),children:[n(f.Header,{val_status:e,set_status:r,KeywordFilterRows:c}),n(f.Body,{val_status:e,set_status:r,PageRows:l})]})})},Propagations:{},DataLeveler:t=>{var e,r;return t=s({},t),t.filter=(e=t.filter)!=null?e:!1,t.filter=Array.from({length:t.colLength}).map((i,u)=>{var o;return I.is.boolean(t.filter)?t.filter:(o=t.filter[u])!=null?o:!1}),t.order=(r=t.order)!=null?r:!0,t.order=Array.from({length:t.colLength}).map((i,u)=>{var o;return I.is.boolean(t.order)?t.order:(o=t.order[u])!=null?o:!0}),t=s({checker:!1,searchKeyword:"",filter:!1,order:!0,defaultOrder:[0,"ASC"]},t),t.rows.forEach((i,u)=>{i.rowID=JSON.stringify(i.rowID||u);let o=[];i.forEach((w,S)=>{let{data:c,children:g,orderIndex:l}=w;w.orderIndex=I.is.exist(l)?String(l):String(c),w.children=g||String(c),o.push(String(w.data))}),i.__sys4SearchKey=o.join("/")}),n(f.StateManager,s({eventID:I.uuid.gen()},t))},StateManager:t=>{let{colLength:e,eventID:r,checker:i=!1,searchKeyword:u="",filter:o,order:w,defaultOrder:S=[0,"ASC"],pageRowLength:c=30}=t,[g]=F(I.uuid.gen()),l={tableID:t.tableID||g,componentID:g,colLength:e,checker:i,searchKeyword:u,filter:{enabled:o!==!1,column:o,current:Array.from({length:e},()=>[])},order:{enabled:w!==!1,column:w,current:S},paging:{rowLength:c,pageLength:Math.ceil(t.rows.length/c),currentPageIndex:1},head:t.head,rows:t.rows,noRecords:t.noRecords,cellStyles:t.cellStyles||{},cellClassName:t.cellClassName||"",cellStylesCallback:t.cellStylesCallback,onRowClick:t.onRowClick,onOrderChanged:t.onOrderChanged},[h,C]=F(l),[a,d]=F(t.eventID);return a!=t.eventID&&(d(t.eventID),C(l)),n(f.Core,{val_status:h,set_status:C})}},m={__memoryID:f.__memoryID,useStatus:t=>{var o;let[e]=F(I.uuid.gen()),[r,i]=F(I.uuid.gen()),u=f.__memoryID+"_"+t;return G(()=>(f.Propagations[t]=R(s({},f.Propagations[t]),{[e]:1}),L.set({key:e,value:{refresh:()=>{i(I.uuid.gen())}}}),()=>{delete f.Propagations[t][e]}),[]),((o=L.get(u))==null?void 0:o.status)||{tableComponentDidMount:!1}},getRowData:t=>{let e=L.get(f.__memoryID+"_"+t);if(e!=null&&e.getRowData)return e.getRowData()},setPageIndex:(t,e)=>{let r=L.get(f.__memoryID+"_"+t);r!=null&&r.updatePageIndex&&r.updatePageIndex(e)},setRowLength:(t,e)=>{let r=L.get(f.__memoryID+"_"+t);r!=null&&r.updateRowLength&&r.updateRowLength(e)},setSearchKeyword:(t,e)=>{let r=L.get(f.__memoryID+"_"+t);r!=null&&r.updateKeyword&&r.updateKeyword(e)}},z={SearchInput:t=>{let e=m.useStatus(t.tableID);return e.tableComponentDidMount?n(O.Text.Normal,{placeholder:"\u691C\u7D22...",clearButton:!0,padding:"2/3",paddingRight:3,rightIcon:n(O.Comps.RightIcon,{fontColor:"5.translucent",right:"2/3",children:n(K.Search,{})}),override:"force",value:e.searchKeyword,onUpdateValidValue:({value:r})=>{m.setSearchKeyword(t.tableID,r)}}):null},Info:t=>{let e=m.useStatus(t.tableID);if(!e.tableComponentDidMount)return null;let r=e.filteredRows.ratio(e.totalRows)||0;return x(M,{verticalAlign:"baseline",gap:"1/2",fontSize:"1.mini",fontColor:"3.blur",children:[n(Y,{fontSize:"4.thirdTitle",fontColor:"theme",children:e.filteredRows.toLocaleString()}),"/ ",e.totalRows.toLocaleString(),"\u4EF6 (",r,"%)"]})},Paging:t=>{let e=m.useStatus(t.tableID);if(!e.tableComponentDidMount)return null;let r=[];for(let i=0;i<e.paging.pageLength;i++)r.push({value:i+1,label:(i+1).toString()});return x(A.Center,{children:[x(A.Center,{gap:"1/2",children:["\u30DA\u30FC\u30B8 :",n(O.Select,{enableUnSelected:!1,padding:["1/3","2/3"],rightIcon:!1,placeholder:"",override:"force",value:e.paging.currentPageIndex,options:r,onUpdateValidValue:({value:i})=>{m.setPageIndex(t.tableID,i)}}),"/ ",e.paging.pageLength]}),x(A.Right,{gap:"1/2",children:[n(E.Button.Sub.R,{ssSphere:3,onClick:()=>{if(e.paging.currentPageIndex==1){m.setPageIndex(t.tableID,e.paging.pageLength);return}m.setPageIndex(t.tableID,e.paging.currentPageIndex-1)},children:n(K.ChevronLeft,{})}),n(E.Button.Sub.R,{ssSphere:3,onClick:()=>{if(e.paging.currentPageIndex==e.paging.pageLength){m.setPageIndex(t.tableID,1);return}m.setPageIndex(t.tableID,e.paging.currentPageIndex+1)},children:n(K.ChevronRight,{})})]})]})},RowLength:t=>{let e=m.useStatus(t.tableID);if(!e.tableComponentDidMount)return null;let r=e.paging.rowLength,i=0,u=t.lengthSelect.map(o=>(i|=+(o==r),{value:o,label:o.toString()}));return i||u.push({value:r,label:r.toString()}),u=u.order({direction:"ASC",keys:["value"]}),x(A.Center,{gap:"1/2",children:["\u4EF6\u6570 :",n(O.Select,{enableUnSelected:!1,rightIcon:!1,placeholder:"\u9078\u629E",override:"force",padding:["1/3","2/3"],value:e.paging.rowLength,options:u,onUpdateValidValue:({value:o})=>{m.setRowLength(t.tableID,o)}})]})}},le=t=>n(ne,R(s({},t),{type:"data",JSXChildren:f.DataLeveler})),D=le;D.__memoryID=f.__memoryID,D.useStatus=m.useStatus,D.getRowData=m.getRowData,D.setPageIndex=m.setPageIndex,D.setRowLength=m.setRowLength,D.setSearchKeyword=m.setSearchKeyword,D.Info=z.Info,D.Paging=z.Paging,D.RowLength=z.RowLength,D.SearchInput=z.SearchInput;export{D as Data,D as default};
+import {
+  __objRest,
+  __spreadProps,
+  __spreadValues
+} from "../../chunk-JJ3PEWPN.js";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import {
+  useState,
+  useEffect
+} from "react";
+import {
+  $$,
+  useStore
+} from "../../@utils/_";
+import Box from "../../atoms/Box";
+import Flex from "../../atoms/Flex";
+import FAI from "../../atoms/FAI";
+import Span from "../../atoms/Span";
+import Column from "../../mols/Column";
+import Row from "../../mols/Row";
+import Button from "../Button";
+import Sheet from "../Sheet";
+import Input from "../Input/_";
+import { faArrowUp } from "@fortawesome/free-solid-svg-icons/faArrowUp";
+import { faArrowDown } from "@fortawesome/free-solid-svg-icons/faArrowDown";
+import { faArrowRight } from "@fortawesome/free-solid-svg-icons/faArrowRight";
+import { faFilter } from "@fortawesome/free-solid-svg-icons/faFilter";
+import TableParts from "./Parts";
+import Wrapper from "./Wrapper";
+import {
+  DefaultCellSystemStyles
+} from "./cellStyling";
+import { TableClasses } from "../../@styles/componentClasses/_";
+const Comps = {
+  __memoryID: $$.uuid.gen(),
+  Header: (params) => {
+    let {
+      val_status,
+      set_status,
+      KeywordFilterRows
+    } = __spreadValues({}, params);
+    let {
+      order,
+      filter
+    } = val_status;
+    let [orderIndex, orderDirection] = order.current;
+    let Cols = [];
+    let HEAD = [...val_status.head];
+    if (val_status.checker) {
+      Cols.push(/* @__PURE__ */ jsx(
+        TableParts.TH,
+        __spreadProps(__spreadValues(__spreadValues(__spreadProps(__spreadValues({}, val_status.cellStyles), {
+          fontWeight: "2.normal",
+          position: "sticky",
+          top: 0,
+          unitWidth: 4,
+          padding: 0
+        }), DefaultCellSystemStyles({
+          top: true,
+          bottom: !val_status.rows.length,
+          left: true,
+          right: !val_status.colLength
+        })), val_status.cellStylesCallback ? val_status.cellStylesCallback({
+          top: true,
+          bottom: !val_status.rows.length,
+          left: true,
+          right: !val_status.colLength,
+          rowIndex: 0,
+          colIndex: 0,
+          isBody: false,
+          isHeader: true
+        }) : {}), {
+          className: [
+            TableClasses("Cell"),
+            val_status.cellClassName
+          ].join(" "),
+          freeCSS: {
+            zIndex: 2
+          },
+          children: /* @__PURE__ */ jsx(Box, { flexCenter: true, children: /* @__PURE__ */ jsx(
+            Input.Checker,
+            {
+              label: null,
+              value: false,
+              onUpdateValidValue: ({ value }) => {
+                let newRows = val_status.rows;
+                newRows.forEach((rows) => {
+                  rows.checked = value;
+                });
+                set_status(__spreadProps(__spreadValues({}, val_status), {
+                  rows: newRows
+                }));
+              }
+            }
+          ) })
+        })
+      ));
+    }
+    for (let colIndex = 0; colIndex < val_status.colLength; colIndex++) {
+      let col = HEAD[colIndex];
+      if (!col)
+        continue;
+      let DisplayLabel = col.children || col.data;
+      let orderable = order.enabled && order.column[colIndex];
+      let filterable = filter.enabled && filter.column[colIndex];
+      let OrderButton = orderable ? /* @__PURE__ */ jsx(
+        FAI,
+        {
+          fontSize: "1.mini",
+          fontColor: colIndex == orderIndex ? "1.clear" : "5.translucent",
+          icon: colIndex == orderIndex ? orderDirection == "DESC" ? faArrowDown : faArrowUp : faArrowRight
+        }
+      ) : null;
+      let FilterButton = /* @__PURE__ */ jsx(Fragment, {});
+      if (filterable) {
+        let ColumnDatas = KeywordFilterRows.map((row) => {
+          var _a;
+          return (_a = row[colIndex]) == null ? void 0 : _a.data;
+        });
+        ColumnDatas = [...new Set(ColumnDatas)].order({
+          direction: "ASC"
+        });
+        let filterList = filter.current[colIndex];
+        if (filterList) {
+          let ValueList = ColumnDatas.filter((data) => !filterList.includes(data));
+          let SelectList = [];
+          ColumnDatas.forEach((data) => {
+            if (!data)
+              return;
+            SelectList.push({
+              value: data,
+              label: /* @__PURE__ */ jsx(
+                Box,
+                {
+                  flexSizing: "auto",
+                  children: data
+                }
+              )
+            });
+          });
+          let FilterModaButtonID = "BUTTON-" + val_status.componentID + "-" + colIndex;
+          let FilterSheetID = val_status.componentID + "-" + colIndex;
+          let SheetParams = {
+            sheetID: FilterSheetID,
+            parent: "#" + FilterModaButtonID,
+            gravityPoint: 23,
+            type: "custom",
+            content: /* @__PURE__ */ jsxs(
+              Flex,
+              {
+                flexType: "col",
+                border: true,
+                boxShadow: "3.remark",
+                backgroundColor: "1.layer.base",
+                borderRadius: 1,
+                freeCSS: {
+                  minWidth: 12 * 20,
+                  maxWidth: 12 * 30
+                },
+                children: [
+                  /* @__PURE__ */ jsx(
+                    Column,
+                    {
+                      gap: "1/3",
+                      overflow: "auto",
+                      padding: "2/3",
+                      freeCSS: {
+                        maxHeight: 12 * 30
+                      },
+                      children: /* @__PURE__ */ jsx(
+                        Input.Checkbox,
+                        {
+                          tone: "cloud",
+                          icon: true,
+                          value: ValueList,
+                          display: "flex",
+                          gap: "1/2",
+                          override: "force",
+                          options: SelectList,
+                          hideInput: true,
+                          name: "DTFilter-col-" + colIndex + "-table-" + val_status.componentID,
+                          cellStyles: {
+                            flexSizing: "auto",
+                            padding: "2/3"
+                          },
+                          onUpdateValidValue: ({ value }) => {
+                            let DropValues = ColumnDatas.filter((data) => !value.includes(data));
+                            let newOptions = __spreadValues({}, val_status);
+                            newOptions.filter.current[colIndex] = DropValues;
+                            set_status(newOptions);
+                          }
+                        }
+                      )
+                    }
+                  ),
+                  /* @__PURE__ */ jsxs(
+                    Row.Separate,
+                    {
+                      gap: "2/3",
+                      padding: "2/3",
+                      horizontalAlign: "right",
+                      children: [
+                        /* @__PURE__ */ jsx(
+                          Button.Button.Border.S,
+                          {
+                            isRounded: true,
+                            onClick: () => {
+                              Sheet.close(FilterSheetID);
+                            },
+                            children: "\u9589\u3058\u308B"
+                          }
+                        ),
+                        /* @__PURE__ */ jsx(
+                          Button.Button.Prime.S,
+                          {
+                            color: "theme",
+                            isRounded: true,
+                            ssEffectsOnActive: "shrink",
+                            onClick: () => {
+                              let newFilterList = [];
+                              if (!filterList.length)
+                                newFilterList = ColumnDatas;
+                              let newOptions = __spreadValues({}, val_status);
+                              newOptions.filter.current[colIndex] = newFilterList;
+                              set_status(newOptions);
+                            },
+                            children: "\u5168\u9078\u629E"
+                          }
+                        )
+                      ]
+                    }
+                  )
+                ]
+              }
+            )
+          };
+          Sheet.refresh(SheetParams, true);
+          FilterButton = /* @__PURE__ */ jsx(Box, { className: TableClasses("FilterRegion"), children: /* @__PURE__ */ jsx(
+            Button.Button.Sub.S,
+            {
+              ssSphere: 2.5,
+              fontSize: "1.mini",
+              className: TableClasses("Filtering_" + !!filterList.length),
+              id: FilterModaButtonID,
+              onClick: (event) => {
+                event.stopPropagation();
+                Sheet.open(SheetParams);
+              },
+              children: /* @__PURE__ */ jsx(FAI, { icon: faFilter })
+            }
+          ) });
+        }
+      }
+      col = __spreadProps(__spreadValues(__spreadValues(__spreadValues(__spreadValues({}, val_status.cellStyles), col), DefaultCellSystemStyles({
+        top: true,
+        bottom: !val_status.rows.length,
+        left: colIndex == Number(val_status.checker),
+        right: colIndex == val_status.colLength - 1
+      })), val_status.cellStylesCallback ? val_status.cellStylesCallback({
+        top: true,
+        bottom: !val_status.rows.length,
+        left: colIndex == Number(val_status.checker),
+        right: colIndex == val_status.colLength - 1,
+        rowIndex: 0,
+        colIndex,
+        isBody: false,
+        isHeader: true
+      }) : {}), {
+        ssPushable: orderable,
+        className: [
+          TableClasses("Cell"),
+          val_status.cellClassName,
+          col.className
+        ].join(" ")
+      });
+      Cols.push(/* @__PURE__ */ jsx(
+        TableParts.TH,
+        __spreadProps(__spreadValues({
+          fontWeight: "2.normal",
+          position: "sticky",
+          top: 0
+        }, col), {
+          freeCSS: __spreadValues({
+            zIndex: 2
+          }, col.freeCSS),
+          onClick: (event) => {
+            if (orderable) {
+              let newOptions = __spreadValues({}, val_status);
+              let orderObject = [colIndex, orderIndex === colIndex && orderDirection == "ASC" ? "DESC" : "ASC"];
+              newOptions.order.current = orderObject;
+              set_status(newOptions);
+              val_status.onOrderChanged && val_status.onOrderChanged(orderObject);
+            }
+          },
+          children: /* @__PURE__ */ jsxs(
+            Flex,
+            {
+              flexType: "row-r",
+              flexWrap: false,
+              height: 1,
+              borderRadius: "inherit",
+              flexCenter: true,
+              children: [
+                FilterButton,
+                /* @__PURE__ */ jsxs(
+                  Flex,
+                  {
+                    flexSizing: 0,
+                    position: "relative",
+                    borderRadius: "inherit",
+                    gap: "1/3",
+                    flexWrap: false,
+                    horizontalAlign: "center",
+                    children: [
+                      OrderButton,
+                      DisplayLabel
+                    ]
+                  }
+                )
+              ]
+            }
+          )
+        })
+      ));
+    }
+    return /* @__PURE__ */ jsx(
+      TableParts.Row,
+      {
+        className: [TableClasses("Row"), TableClasses("HeadRow")].join(" "),
+        children: Cols
+      }
+    );
+  },
+  Body: (params) => {
+    let {
+      val_status,
+      PageRows
+    } = params;
+    let BodyRows = [];
+    PageRows.forEach((row, rowIndex) => {
+      let ROW = [...row];
+      let Cols = [];
+      if (val_status.checker) {
+        Cols.push(/* @__PURE__ */ jsx(
+          TableParts.TH,
+          __spreadProps(__spreadValues(__spreadValues(__spreadValues({
+            unitWidth: 4,
+            padding: 0,
+            borderRight: true
+          }, val_status.cellStyles), DefaultCellSystemStyles({
+            top: rowIndex == 0 && !val_status.head,
+            bottom: rowIndex == PageRows.length - 1,
+            left: true,
+            right: !val_status.colLength
+          })), val_status.cellStylesCallback ? val_status.cellStylesCallback({
+            top: rowIndex == 0 && !val_status.head,
+            bottom: rowIndex == PageRows.length - 1,
+            left: true,
+            right: !val_status.colLength,
+            rowIndex,
+            colIndex: 0,
+            isBody: true,
+            isHeader: false
+          }) : {}), {
+            className: [
+              TableClasses("Cell"),
+              val_status.cellClassName
+            ].join(" "),
+            children: /* @__PURE__ */ jsx(Box, { flexCenter: true, children: /* @__PURE__ */ jsx(
+              Input.Checker,
+              {
+                label: null,
+                value: row.checked,
+                override: "force",
+                onUpdateValidValue: ({ value }) => {
+                  let newRows = val_status.rows;
+                  newRows[rowIndex].checked = value;
+                  params.set_status(__spreadProps(__spreadValues({}, val_status), {
+                    rows: newRows
+                  }));
+                }
+              }
+            ) })
+          })
+        ));
+      }
+      ROW.forEach((col, colIndex) => {
+        if (!col)
+          return;
+        let _a = col, {
+          type = "td"
+        } = _a, Params = __objRest(_a, [
+          "type"
+        ]);
+        Params = __spreadProps(__spreadValues(__spreadValues(__spreadValues(__spreadValues({}, val_status.cellStyles), Params), DefaultCellSystemStyles({
+          top: rowIndex == 0 && !val_status.head,
+          bottom: rowIndex == PageRows.length - 1,
+          left: val_status.checker ? false : colIndex == 0,
+          right: colIndex == val_status.colLength - 1
+        })), val_status.cellStylesCallback ? val_status.cellStylesCallback({
+          top: rowIndex == 0 && !val_status.head,
+          bottom: rowIndex == PageRows.length - 1,
+          left: val_status.checker ? false : colIndex == 0,
+          right: colIndex == val_status.colLength - 1,
+          rowIndex,
+          colIndex,
+          isBody: true,
+          isHeader: false
+        }) : {}), {
+          className: [
+            TableClasses("Cell"),
+            val_status.cellClassName,
+            Params.className
+          ].join(" ")
+        });
+        let Cell = TableParts[type == "td" ? "TD" : "TH"];
+        Cols.push(/* @__PURE__ */ jsx(
+          Cell,
+          __spreadValues({}, Params),
+          colIndex
+        ));
+      });
+      BodyRows.push(/* @__PURE__ */ jsx(
+        TableParts.Row,
+        {
+          className: [TableClasses("Row"), TableClasses("BodyRow")].join(" "),
+          children: Cols,
+          onClick: (event) => {
+            if (!val_status.onRowClick)
+              return;
+            val_status.onRowClick(JSON.parse(row.rowID), event);
+          }
+        },
+        rowIndex
+      ));
+    });
+    if (!PageRows.length) {
+      let Content = /* @__PURE__ */ jsx(
+        Box,
+        {
+          padding: 2,
+          fontColor: "4.thin",
+          freeCSS: {
+            textAlign: "center"
+          },
+          borderTop: "1.thin",
+          children: "\u30C6\u30FC\u30D6\u30EB\u304C\u3042\u308A\u307E\u305B\u3093"
+        }
+      );
+      if (val_status.noRecords) {
+        Content = /* @__PURE__ */ jsx(Fragment, { children: val_status.noRecords });
+      }
+      BodyRows.push(/* @__PURE__ */ jsx(
+        TableParts.Row,
+        {
+          className: [
+            TableClasses("Row"),
+            TableClasses("BodyRow"),
+            TableClasses("DataNotFound")
+          ].join(" "),
+          children: /* @__PURE__ */ jsx(
+            TableParts.TD,
+            {
+              colSpan: val_status.colLength,
+              className: TableClasses("Cell"),
+              children: Content
+            }
+          )
+        },
+        "dataNotFound"
+      ));
+    }
+    return /* @__PURE__ */ jsx(Fragment, { children: BodyRows });
+  },
+  Core: (params) => {
+    let {
+      val_status,
+      set_status
+    } = params;
+    let {
+      searchKeyword,
+      filter,
+      order,
+      paging
+    } = val_status;
+    let MotherRows = [...val_status.rows];
+    let KeywordFilterRows = [...val_status.rows];
+    let FilterRows = [...val_status.rows];
+    let PageRows = [...val_status.rows];
+    if (searchKeyword) {
+      KeywordFilterRows = MotherRows.filter((row) => {
+        if ((row.__sys4SearchKey || "").match(new RegExp(searchKeyword, "i")))
+          return 1;
+        return 0;
+      });
+      FilterRows = [...KeywordFilterRows];
+      PageRows = [...KeywordFilterRows];
+    }
+    if (filter.enabled) {
+      for (let i = 0; i < val_status.colLength; i++) {
+        let enabled = filter.column[i];
+        let current = filter.current[i];
+        if (enabled && current && current.length) {
+          FilterRows = FilterRows.filter((row) => !current.includes(row[i].data));
+          PageRows = [...FilterRows];
+        }
+      }
+    }
+    if (order.enabled) {
+      FilterRows = FilterRows.order({
+        direction: order.current[1],
+        keys: [
+          order.current[0],
+          "orderIndex"
+        ]
+      });
+      PageRows = [...FilterRows];
+    }
+    {
+      let {
+        currentPageIndex,
+        rowLength
+      } = paging;
+      PageRows = [...PageRows].splice((currentPageIndex - 1) * rowLength, rowLength);
+    }
+    let tableObjectID = Comps.__memoryID + "_" + val_status.tableID;
+    let useStatusOutput = {
+      tableComponentDidMount: true,
+      totalRows: MotherRows.length,
+      pageRows: PageRows.length,
+      filteredRows: FilterRows.length,
+      filter: val_status.filter,
+      order: val_status.order,
+      paging: val_status.paging,
+      searchKeyword: val_status.searchKeyword
+    };
+    useStore.update({
+      key: tableObjectID,
+      value: {
+        status: useStatusOutput,
+        updatePageIndex: (index) => {
+          let Index = Math.min(Math.max(1, index), val_status.paging.pageLength);
+          let newOptions = __spreadValues({}, val_status);
+          newOptions.paging.currentPageIndex = Index;
+          set_status(newOptions);
+        },
+        updateRowLength: (index) => {
+          let newOptions = __spreadValues({}, val_status);
+          newOptions.paging = {
+            rowLength: index,
+            currentPageIndex: 1,
+            pageLength: Math.ceil(FilterRows.length / index)
+          };
+          set_status(newOptions);
+        },
+        updateKeyword: (keyword) => {
+          $$.interval.clear("InputSearchTime");
+          $$.interval.standBy("InputSearchTime", 200, () => {
+            let newOptions = __spreadValues({}, val_status);
+            newOptions.searchKeyword = keyword;
+            newOptions.paging.currentPageIndex = 1;
+            newOptions.filter.current = newOptions.filter.current.map(() => []);
+            set_status(newOptions);
+          });
+        },
+        getRowData: () => {
+          let ReturnRows = [...MotherRows];
+          if (order.enabled) {
+            ReturnRows = ReturnRows.order({
+              direction: order.current[1],
+              keys: [
+                order.current[0],
+                "orderIndex"
+              ]
+            });
+          }
+          ReturnRows.forEach((row) => {
+            row.currentPage = false;
+            row.filtered = false;
+          });
+          PageRows.forEach((row) => {
+            let { rowID } = row;
+            ReturnRows.find((row2) => row2.rowID == rowID).currentPage = true;
+          });
+          FilterRows.forEach((row) => {
+            let { rowID } = row;
+            ReturnRows.find((row2) => row2.rowID == rowID).filtered = true;
+          });
+          return ReturnRows;
+        }
+      }
+    });
+    useEffect(() => {
+      let Propagations = Comps.Propagations[val_status.tableID] || [];
+      Object.keys(Propagations).forEach((key) => {
+        let propagationObject = useStore.get(key);
+        if (!(propagationObject == null ? void 0 : propagationObject.refresh))
+          return;
+        propagationObject.refresh();
+      });
+    });
+    return /* @__PURE__ */ jsx(
+      Box,
+      {
+        className: TableClasses("TableBase"),
+        children: /* @__PURE__ */ jsxs(TableParts.Table, { className: TableClasses("Table"), children: [
+          /* @__PURE__ */ jsx(
+            Comps.Header,
+            {
+              val_status,
+              set_status,
+              KeywordFilterRows
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            Comps.Body,
+            {
+              val_status,
+              set_status,
+              PageRows
+            }
+          )
+        ] })
+      }
+    );
+  },
+  Propagations: {},
+  DataLeveler: (params) => {
+    var _a, _b;
+    params = __spreadValues({}, params);
+    params.filter = (_a = params.filter) != null ? _a : false;
+    params.filter = Array.from({ length: params.colLength }).map((a, index) => {
+      var _a2;
+      if ($$.is.boolean(params.filter)) {
+        return params.filter;
+      }
+      return (_a2 = params.filter[index]) != null ? _a2 : false;
+    });
+    params.order = (_b = params.order) != null ? _b : true;
+    params.order = Array.from({ length: params.colLength }).map((a, index) => {
+      var _a2;
+      if ($$.is.boolean(params.order)) {
+        return params.order;
+      }
+      return (_a2 = params.order[index]) != null ? _a2 : true;
+    });
+    params = __spreadValues({
+      checker: false,
+      searchKeyword: "",
+      filter: false,
+      order: true,
+      defaultOrder: [0, "ASC"]
+    }, params);
+    params.rows.forEach((row, rowIndex) => {
+      row.rowID = JSON.stringify(row.rowID || rowIndex);
+      let __sys4SearchKey = [];
+      row.forEach((col, colIndex) => {
+        let {
+          data,
+          children,
+          orderIndex
+        } = col;
+        col.orderIndex = $$.is.exist(orderIndex) ? String(orderIndex) : String(data);
+        col.children = children || String(data);
+        __sys4SearchKey.push(String(col.data));
+      });
+      row.__sys4SearchKey = __sys4SearchKey.join("/");
+    });
+    return /* @__PURE__ */ jsx(
+      Comps.StateManager,
+      __spreadValues({
+        eventID: $$.uuid.gen()
+      }, params)
+    );
+  },
+  StateManager: (params) => {
+    let {
+      colLength,
+      eventID,
+      checker = false,
+      searchKeyword = "",
+      filter,
+      order,
+      defaultOrder = [0, "ASC"],
+      pageRowLength = 30
+    } = params;
+    let [val_componentID] = useState($$.uuid.gen());
+    let DefStatus = {
+      tableID: params.tableID || val_componentID,
+      componentID: val_componentID,
+      colLength,
+      checker,
+      searchKeyword,
+      filter: {
+        enabled: filter !== false,
+        column: filter,
+        current: Array.from({ length: colLength }, () => [])
+      },
+      order: {
+        enabled: order !== false,
+        column: order,
+        current: defaultOrder
+      },
+      paging: {
+        rowLength: pageRowLength,
+        pageLength: Math.ceil(params.rows.length / pageRowLength),
+        currentPageIndex: 1
+      },
+      head: params.head,
+      rows: params.rows,
+      noRecords: params.noRecords,
+      cellStyles: params.cellStyles || {},
+      cellClassName: params.cellClassName || "",
+      cellStylesCallback: params.cellStylesCallback,
+      onRowClick: params.onRowClick,
+      onOrderChanged: params.onOrderChanged
+    };
+    let [val_status, set_status] = useState(DefStatus);
+    let [val_eventID, set_eventID] = useState(params.eventID);
+    if (val_eventID != params.eventID) {
+      set_eventID(params.eventID);
+      set_status(DefStatus);
+    }
+    return /* @__PURE__ */ jsx(
+      Comps.Core,
+      {
+        val_status,
+        set_status
+      }
+    );
+  }
+};
+const fn = {
+  __memoryID: Comps.__memoryID,
+  useStatus: (tableID) => {
+    var _a;
+    let [val_statusID] = useState($$.uuid.gen());
+    let [val_refresh, set_refresh] = useState($$.uuid.gen());
+    let tableObjectID = Comps.__memoryID + "_" + tableID;
+    useEffect(() => {
+      Comps.Propagations[tableID] = __spreadProps(__spreadValues({}, Comps.Propagations[tableID]), {
+        [val_statusID]: 1
+      });
+      useStore.set({
+        key: val_statusID,
+        value: {
+          refresh: () => {
+            set_refresh($$.uuid.gen());
+          }
+        }
+      });
+      return () => {
+        delete Comps.Propagations[tableID][val_statusID];
+      };
+    }, []);
+    return ((_a = useStore.get(tableObjectID)) == null ? void 0 : _a.status) || {
+      tableComponentDidMount: false
+    };
+  },
+  getRowData: (tableID) => {
+    let tableObject = useStore.get(Comps.__memoryID + "_" + tableID);
+    if (!(tableObject == null ? void 0 : tableObject.getRowData))
+      return;
+    return tableObject.getRowData();
+  },
+  setPageIndex: (tableID, pageIndex) => {
+    let tableObject = useStore.get(Comps.__memoryID + "_" + tableID);
+    if (!(tableObject == null ? void 0 : tableObject.updatePageIndex))
+      return;
+    tableObject.updatePageIndex(pageIndex);
+  },
+  setRowLength: (tableID, rowLength) => {
+    let tableObject = useStore.get(Comps.__memoryID + "_" + tableID);
+    if (!(tableObject == null ? void 0 : tableObject.updateRowLength))
+      return;
+    tableObject.updateRowLength(rowLength);
+  },
+  setSearchKeyword: (tableID, keyword) => {
+    let tableObject = useStore.get(Comps.__memoryID + "_" + tableID);
+    if (!(tableObject == null ? void 0 : tableObject.updateKeyword))
+      return;
+    tableObject.updateKeyword(keyword);
+  }
+};
+const Parts = {
+  SearchInput: (params) => {
+    let status = fn.useStatus(params.tableID);
+    if (!status.tableComponentDidMount)
+      return null;
+    return /* @__PURE__ */ jsx(
+      Input.Text.Normal,
+      {
+        placeholder: "\u691C\u7D22...",
+        clearButton: true,
+        padding: "2/3",
+        paddingRight: 3,
+        rightIcon: /* @__PURE__ */ jsx(
+          Input.Comps.RightIcon,
+          {
+            fontColor: "5.translucent",
+            right: "2/3",
+            children: /* @__PURE__ */ jsx(FAI.Search, {})
+          }
+        ),
+        override: "force",
+        value: status.searchKeyword,
+        onUpdateValidValue: ({ value }) => {
+          fn.setSearchKeyword(params.tableID, value);
+        }
+      }
+    );
+  },
+  Info: (params) => {
+    let status = fn.useStatus(params.tableID);
+    if (!status.tableComponentDidMount)
+      return null;
+    let Ratio = status.filteredRows.ratio(status.totalRows) || 0;
+    return /* @__PURE__ */ jsxs(
+      Flex,
+      {
+        verticalAlign: "baseline",
+        gap: "1/2",
+        fontSize: "1.mini",
+        fontColor: "3.blur",
+        children: [
+          /* @__PURE__ */ jsx(
+            Span,
+            {
+              fontSize: "4.thirdTitle",
+              fontColor: "theme",
+              children: status.filteredRows.toLocaleString()
+            }
+          ),
+          "/ ",
+          status.totalRows.toLocaleString(),
+          "\u4EF6 (",
+          Ratio,
+          "%)"
+        ]
+      }
+    );
+  },
+  Paging: (params) => {
+    let status = fn.useStatus(params.tableID);
+    if (!status.tableComponentDidMount)
+      return null;
+    let PageSelect = [];
+    for (let index = 0; index < status.paging.pageLength; index++) {
+      PageSelect.push({ value: index + 1, label: (index + 1).toString() });
+    }
+    return /* @__PURE__ */ jsxs(Row.Center, { children: [
+      /* @__PURE__ */ jsxs(
+        Row.Center,
+        {
+          gap: "1/2",
+          children: [
+            "\u30DA\u30FC\u30B8 :",
+            /* @__PURE__ */ jsx(
+              Input.Select,
+              {
+                enableUnSelected: false,
+                padding: ["1/3", "2/3"],
+                rightIcon: false,
+                placeholder: "",
+                override: "force",
+                value: status.paging.currentPageIndex,
+                options: PageSelect,
+                onUpdateValidValue: ({ value }) => {
+                  fn.setPageIndex(params.tableID, value);
+                }
+              }
+            ),
+            "/ ",
+            status.paging.pageLength
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsxs(Row.Right, { gap: "1/2", children: [
+        /* @__PURE__ */ jsx(
+          Button.Button.Sub.R,
+          {
+            ssSphere: 3,
+            onClick: () => {
+              if (status.paging.currentPageIndex == 1) {
+                fn.setPageIndex(params.tableID, status.paging.pageLength);
+                return;
+              }
+              fn.setPageIndex(params.tableID, status.paging.currentPageIndex - 1);
+            },
+            children: /* @__PURE__ */ jsx(FAI.ChevronLeft, {})
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Button.Button.Sub.R,
+          {
+            ssSphere: 3,
+            onClick: () => {
+              if (status.paging.currentPageIndex == status.paging.pageLength) {
+                fn.setPageIndex(params.tableID, 1);
+                return;
+              }
+              fn.setPageIndex(params.tableID, status.paging.currentPageIndex + 1);
+            },
+            children: /* @__PURE__ */ jsx(FAI.ChevronRight, {})
+          }
+        )
+      ] })
+    ] });
+  },
+  RowLength: (params) => {
+    let status = fn.useStatus(params.tableID);
+    if (!status.tableComponentDidMount)
+      return null;
+    let currentLength = status.paging.rowLength;
+    let ExistCurrentLength = 0;
+    let LengthList = params.lengthSelect.map((l) => {
+      ExistCurrentLength |= Number(l == currentLength);
+      return { value: l, label: l.toString() };
+    });
+    if (!ExistCurrentLength) {
+      LengthList.push({ value: currentLength, label: currentLength.toString() });
+    }
+    LengthList = LengthList.order({
+      direction: "ASC",
+      keys: ["value"]
+    });
+    return /* @__PURE__ */ jsxs(
+      Row.Center,
+      {
+        gap: "1/2",
+        children: [
+          "\u4EF6\u6570 :",
+          /* @__PURE__ */ jsx(
+            Input.Select,
+            {
+              enableUnSelected: false,
+              rightIcon: false,
+              placeholder: "\u9078\u629E",
+              override: "force",
+              padding: ["1/3", "2/3"],
+              value: status.paging.rowLength,
+              options: LengthList,
+              onUpdateValidValue: ({ value }) => {
+                fn.setRowLength(params.tableID, value);
+              }
+            }
+          )
+        ]
+      }
+    );
+  }
+};
+const Component = (params) => /* @__PURE__ */ jsx(
+  Wrapper,
+  __spreadProps(__spreadValues({}, params), {
+    type: "data",
+    JSXChildren: Comps.DataLeveler
+  })
+);
+const Data = Component;
+Data.__memoryID = Comps.__memoryID;
+Data.useStatus = fn.useStatus;
+Data.getRowData = fn.getRowData;
+Data.setPageIndex = fn.setPageIndex;
+Data.setRowLength = fn.setRowLength;
+Data.setSearchKeyword = fn.setSearchKeyword;
+Data.Info = Parts.Info;
+Data.Paging = Parts.Paging;
+Data.RowLength = Parts.RowLength;
+Data.SearchInput = Parts.SearchInput;
+export {
+  Data,
+  Data as default
+};