@teppen/react-ui 1.8.0 → 1.8.1

package/dist/cjs/src/search-bar/condition-search-bar/base.js

@@ -1,3 +1,3 @@
 "use client";
-"use strict";var e=require("react/jsx-runtime"),r=require("react"),i=require("../../select-box/provider.js");require("../id-generator/context.js");var t=require("../id-generator/provider.js"),n=require("./condition-input-management/provider.js");require("./condition-input-management/context.js");var s=require("./condition-list.js"),o=require("./input-form.js"),a=require("../../../node_modules/react-icons/bi/index.js"),c=r.memo((function(r){return e.jsx(i.SelectBoxProvider,{children:e.jsx(t.IdGeneratorProvider,{id:r.id,children:e.jsx(n.ConditionInputProvider,{targets:r.targets,onChangeCondition:r.onChangeCondition,children:e.jsx(d,{size:r.size,conditions:r.conditions})})})})}));function d(i){var t=r.useRef(null);return r.useEffect((function(){if(t.current){var e=t.current,r=function(r){0!==r.deltaY&&(r.preventDefault(),e.scrollLeft+=r.deltaY)};return e.addEventListener("wheel",r),function(){e.removeEventListener("wheel",r)}}}),[t]),e.jsxs("div",{className:"flex items-center gap-1 w-full px-2 py-1 bg-white border border-slate-700 rounded-md text-gray-800 ".concat("small"===i.size?"text-sm":"large"===i.size?"text-lg":""),children:[e.jsx("div",{className:"px-2",children:e.jsx(a.BiSearchAlt,{className:"text-slate-600"})}),e.jsxs("div",{ref:t,className:"relative flex w-full items-center gap-1 overflow-x-auto no_scrollbar",children:[e.jsx(s.ConditionList,{conditions:i.conditions}),e.jsx("div",{className:"flex items-center min-w-64 w-full",children:e.jsx(o.SearchBarInputForm,{size:i.size})})]})]})}exports.ConditionSearchBar=c,exports.SearchBar=d;
+"use strict";var e=require("react/jsx-runtime"),r=require("react"),n=require("../../select-box/provider.js");require("../id-generator/context.js");var i=require("../id-generator/provider.js"),t=require("./condition-input-management/provider.js");require("./condition-input-management/context.js");var s=require("./condition-list.js"),o=require("./input-form.js"),l=require("../../../node_modules/react-icons/bi/index.js"),a=r.memo((function(r){return e.jsx(n.SelectBoxProvider,{children:e.jsx(i.IdGeneratorProvider,{id:r.id,children:e.jsx(t.ConditionInputProvider,{targets:r.targets,onChangeCondition:r.onChangeCondition,children:e.jsx(c,{size:r.size,conditions:r.conditions})})})})}));function c(n){var i=r.useRef(null);return r.useEffect((function(){if(i.current){var e=i.current,r=function(r){0!==r.deltaY&&(r.preventDefault(),e.scrollLeft+=r.deltaY)};return e.addEventListener("wheel",r),function(){e.removeEventListener("wheel",r)}}}),[i]),e.jsxs("div",{className:"flex items-center gap-1 w-full px-2 py-1 bg-white border border-slate-700 rounded-md text-gray-800 ".concat("small"===n.size?"text-sm":"large"===n.size?"text-lg":""),children:[e.jsx("div",{className:"px-2",children:e.jsx(l.BiSearchAlt,{className:"text-slate-600"})}),e.jsxs("div",{ref:i,className:"relative flex w-full items-center gap-1 overflow-x-auto teppen-no-scrollbar",children:[e.jsx("style",{children:"\n          .teppen-no-scrollbar {\n            -ms-overflow-style: none;\n            scrollbar-width: none;\n          }\n          .teppen-no-scrollbar::-webkit-scrollbar {\n            display: none;\n          }\n        "}),e.jsx(s.ConditionList,{conditions:n.conditions}),e.jsx("div",{className:"flex items-center min-w-64 w-full",children:e.jsx(o.SearchBarInputForm,{size:n.size})})]})]})}exports.ConditionSearchBar=a,exports.SearchBar=c;
 //# sourceMappingURL=base.js.map

package/dist/cjs/src/search-bar/condition-search-bar/condition-input-management/hook.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("react"),t=require("./reducer.js");exports.useConditionInputHook=function(n,r){var o=e.useReducer(t.conditionInputReducer,{targets:n,onChangeCondition:r,status:"waiting for input"}),u=o[0],a=o[1],i=e.useMemo((function(){return{inputTarget:function(e){a({type:"inputTarget",payload:{targetKey:e}})},inputOperator:function(e){a({type:"inputOperator",payload:{operatorKey:e}})},inputValue:function(e){a({type:"inputValue",payload:e})},deleteCondition:function(e){a({type:"deleteCondition",payload:{index:e}})},reset:function(){a({type:"reset"})},updateTargets:function(e){a({type:"updateTargets",payload:{targets:e}})},removeInputedTarget:function(){a({type:"removeInputedTarget"})},removeInputedOperator:function(){a({type:"removeInputedOperator"})}}}),[]);return{state:u,actions:i}};
+"use strict";var e=require("react"),t=require("./reducer.js");exports.useConditionInputHook=function(n,o){var r=e.useReducer(t.conditionInputReducer,{targets:n,status:"waiting for input"}),u=r[0],a=r[1];e.useEffect((function(){u.changeAction&&(o(u.changeAction),a({type:"executedChangeAction"}))}),[u.changeAction]);var i=e.useMemo((function(){return{inputTarget:function(e){a({type:"inputTarget",payload:{targetKey:e}})},inputOperator:function(e){a({type:"inputOperator",payload:{operatorKey:e}})},inputValue:function(e){a({type:"inputValue",payload:e})},deleteCondition:function(e){a({type:"deleteCondition",payload:{index:e}})},reset:function(){a({type:"reset"})},updateTargets:function(e){a({type:"updateTargets",payload:{targets:e}})},removeInputedTarget:function(){a({type:"removeInputedTarget"})},removeInputedOperator:function(){a({type:"removeInputedOperator"})}}}),[]);return{state:u,actions:i}};
 //# sourceMappingURL=hook.js.map

package/dist/cjs/src/search-bar/condition-search-bar/condition-input-management/hook.js.map

@@ -1 +1 @@
-{"version":3,"file":"hook.js","sources":["../../../../../../src/search-bar/condition-search-bar/condition-input-management/hook.ts"],"sourcesContent":["import { useMemo, useReducer } from \"react\";\nimport { SearchInput, Target, TConditionInputHook } from \"./type\";\nimport { conditionInputReducer } from \"./reducer\";\n\nexport const useConditionInputHook: TConditionInputHook = (\n  targets,\n  onChangeCondition\n) => {\n  const [state, dispatch] = useReducer(conditionInputReducer, {\n    targets,\n    onChangeCondition,\n    status: \"waiting for input\",\n  });\n\n  const actions = useMemo(\n    () => ({\n      inputTarget: (targetKey: string) => {\n        dispatch({ type: \"inputTarget\", payload: { targetKey } });\n      },\n      inputOperator: (operatorKey: string) => {\n        dispatch({ type: \"inputOperator\", payload: { operatorKey } });\n      },\n      inputValue: (value: SearchInput) => {\n        dispatch({ type: \"inputValue\", payload: value });\n      },\n      deleteCondition: (index: number) => {\n        dispatch({ type: \"deleteCondition\", payload: { index } });\n      },\n      reset: () => {\n        dispatch({ type: \"reset\" });\n      },\n      updateTargets: (targets: Target[]) => {\n        dispatch({ type: \"updateTargets\", payload: { targets } });\n      },\n      removeInputedTarget: () => {\n        dispatch({ type: \"removeInputedTarget\" });\n      },\n      removeInputedOperator: () => {\n        dispatch({ type: \"removeInputedOperator\" });\n      },\n    }),\n    []\n  );\n\n  return {\n    state,\n    actions,\n  };\n};\n"],"names":["targets","onChangeCondition","_a","useReducer","conditionInputReducer","status","state","dispatch","actions","useMemo","inputTarget","targetKey","type","payload","inputOperator","operatorKey","inputValue","value","deleteCondition","index","reset","updateTargets","removeInputedTarget","removeInputedOperator"],"mappings":"4FAI0D,SACxDA,EACAC,GAEM,IAAAC,EAAoBC,EAAUA,WAACC,wBAAuB,CAC1DJ,QAAOA,EACPC,kBAAiBA,EACjBI,OAAQ,sBAHHC,EAAKJ,EAAA,GAAEK,OAMRC,EAAUC,WACd,WAAM,MAAC,CACLC,YAAa,SAACC,GACZJ,EAAS,CAAEK,KAAM,cAAeC,QAAS,CAAEF,UAASA,IACrD,EACDG,cAAe,SAACC,GACdR,EAAS,CAAEK,KAAM,gBAAiBC,QAAS,CAAEE,YAAWA,IACzD,EACDC,WAAY,SAACC,GACXV,EAAS,CAAEK,KAAM,aAAcC,QAASI,GACzC,EACDC,gBAAiB,SAACC,GAChBZ,EAAS,CAAEK,KAAM,kBAAmBC,QAAS,CAAEM,MAAKA,IACrD,EACDC,MAAO,WACLb,EAAS,CAAEK,KAAM,SAClB,EACDS,cAAe,SAACrB,GACdO,EAAS,CAAEK,KAAM,gBAAiBC,QAAS,CAAEb,QAAOA,IACrD,EACDsB,oBAAqB,WACnBf,EAAS,CAAEK,KAAM,uBAClB,EACDW,sBAAuB,WACrBhB,EAAS,CAAEK,KAAM,yBAClB,EAxBG,GA0BN,IAGF,MAAO,CACLN,MAAKA,EACLE,QAAOA,EAEX"}
+{"version":3,"file":"hook.js","sources":["../../../../../../src/search-bar/condition-search-bar/condition-input-management/hook.ts"],"sourcesContent":["import { useEffect, useMemo, useReducer } from \"react\";\nimport { SearchInput, Target, TConditionInputHook } from \"./type\";\nimport { conditionInputReducer } from \"./reducer\";\n\nexport const useConditionInputHook: TConditionInputHook = (\n  targets,\n  onChangeCondition\n) => {\n  const [state, dispatch] = useReducer(conditionInputReducer, {\n    targets,\n    status: \"waiting for input\",\n  });\n\n  useEffect(() => {\n    if (state.changeAction) {\n      onChangeCondition(state.changeAction);\n      dispatch({ type: \"executedChangeAction\" });\n    }\n  }, [state.changeAction]);\n\n  const actions = useMemo(\n    () => ({\n      inputTarget: (targetKey: string) => {\n        dispatch({ type: \"inputTarget\", payload: { targetKey } });\n      },\n      inputOperator: (operatorKey: string) => {\n        dispatch({ type: \"inputOperator\", payload: { operatorKey } });\n      },\n      inputValue: (value: SearchInput) => {\n        dispatch({ type: \"inputValue\", payload: value });\n      },\n      deleteCondition: (index: number) => {\n        dispatch({ type: \"deleteCondition\", payload: { index } });\n      },\n      reset: () => {\n        dispatch({ type: \"reset\" });\n      },\n      updateTargets: (targets: Target[]) => {\n        dispatch({ type: \"updateTargets\", payload: { targets } });\n      },\n      removeInputedTarget: () => {\n        dispatch({ type: \"removeInputedTarget\" });\n      },\n      removeInputedOperator: () => {\n        dispatch({ type: \"removeInputedOperator\" });\n      },\n    }),\n    []\n  );\n\n  return {\n    state,\n    actions,\n  };\n};\n"],"names":["targets","onChangeCondition","_a","useReducer","conditionInputReducer","status","state","dispatch","useEffect","changeAction","type","actions","useMemo","inputTarget","targetKey","payload","inputOperator","operatorKey","inputValue","value","deleteCondition","index","reset","updateTargets","removeInputedTarget","removeInputedOperator"],"mappings":"4FAI0D,SACxDA,EACAC,GAEM,IAAAC,EAAoBC,EAAUA,WAACC,wBAAuB,CAC1DJ,QAAOA,EACPK,OAAQ,sBAFHC,EAAKJ,EAAA,GAAEK,OAKdC,EAAAA,WAAU,WACJF,EAAMG,eACRR,EAAkBK,EAAMG,cACxBF,EAAS,CAAEG,KAAM,yBAErB,GAAG,CAACJ,EAAMG,eAEV,IAAME,EAAUC,WACd,WAAM,MAAC,CACLC,YAAa,SAACC,GACZP,EAAS,CAAEG,KAAM,cAAeK,QAAS,CAAED,UAASA,IACrD,EACDE,cAAe,SAACC,GACdV,EAAS,CAAEG,KAAM,gBAAiBK,QAAS,CAAEE,YAAWA,IACzD,EACDC,WAAY,SAACC,GACXZ,EAAS,CAAEG,KAAM,aAAcK,QAASI,GACzC,EACDC,gBAAiB,SAACC,GAChBd,EAAS,CAAEG,KAAM,kBAAmBK,QAAS,CAAEM,MAAKA,IACrD,EACDC,MAAO,WACLf,EAAS,CAAEG,KAAM,SAClB,EACDa,cAAe,SAACvB,GACdO,EAAS,CAAEG,KAAM,gBAAiBK,QAAS,CAAEf,QAAOA,IACrD,EACDwB,oBAAqB,WACnBjB,EAAS,CAAEG,KAAM,uBAClB,EACDe,sBAAuB,WACrBlB,EAAS,CAAEG,KAAM,yBAClB,EAxBG,GA0BN,IAGF,MAAO,CACLJ,MAAKA,EACLK,QAAOA,EAEX"}

package/dist/cjs/src/search-bar/condition-search-bar/condition-input-management/reducer.js

@@ -1,2 +1,2 @@
-"use strict";var t=require("../../../share/search-operator/constant.js");exports.conditionInputReducer=function(n,e){switch(e.type){case"inputTarget":if("waiting for input"!==n.status)return n;var i=n.targets.find((function(t){return t.key===e.payload.targetKey}));return i?{targets:n.targets,onChangeCondition:n.onChangeCondition,status:"inputted target",inputtingCondition:{type:i.type,target:i},useableOperators:t.DEFAULT_SEARCH_OPERATOR.filter((function(t){return t.type===i.type}))}:n;case"inputOperator":if("inputted target"!==n.status)return n;var o=t.DEFAULT_SEARCH_OPERATOR.find((function(t){return t.key===e.payload.operatorKey}));return o?o.type!==n.inputtingCondition.target.type?n:"none"===o.inputType?(n.onChangeCondition({type:"add",payload:{condition:{target:n.inputtingCondition.target,operator:o,input:{type:"none"}}}}),{targets:n.targets,onChangeCondition:n.onChangeCondition,status:"waiting for input"}):{targets:n.targets,onChangeCondition:n.onChangeCondition,status:"inputted operator",inputtingCondition:{type:n.inputtingCondition.target.type,target:n.inputtingCondition.target,operator:o}}:n;case"inputValue":return"inputted operator"!==n.status?n:(n.onChangeCondition({type:"add",payload:{condition:{target:n.inputtingCondition.target,operator:n.inputtingCondition.operator,input:e.payload}}}),{targets:n.targets,onChangeCondition:n.onChangeCondition,status:"waiting for input"});case"deleteCondition":return n.onChangeCondition({type:"remove",payload:{index:e.payload.index}}),n;case"reset":return{targets:n.targets,onChangeCondition:n.onChangeCondition,status:"waiting for input"};case"updateTargets":return{targets:e.payload.targets,onChangeCondition:n.onChangeCondition,status:"waiting for input"};case"removeInputedTarget":return"inputted target"!=n.status&&"inputted operator"!=n.status?n:{targets:n.targets,onChangeCondition:n.onChangeCondition,status:"waiting for input"};case"removeInputedOperator":return"inputted operator"!==n.status?n:{targets:n.targets,onChangeCondition:n.onChangeCondition,status:"inputted target",inputtingCondition:{type:n.inputtingCondition.target.type,target:n.inputtingCondition.target},useableOperators:t.DEFAULT_SEARCH_OPERATOR.filter((function(t){return t.type===n.inputtingCondition.target.type}))}}};
+"use strict";var t=require("../../../../node_modules/tslib/tslib.es6.js"),e=require("../../../share/search-operator/constant.js");exports.conditionInputReducer=function(n,r){switch(r.type){case"inputTarget":if("waiting for input"!==n.status)return n;var a=n.targets.find((function(t){return t.key===r.payload.targetKey}));return a?{targets:n.targets,status:"inputted target",inputtingCondition:{type:a.type,target:a},useableOperators:e.DEFAULT_SEARCH_OPERATOR.filter((function(t){return t.type===a.type}))}:n;case"inputOperator":if("inputted target"!==n.status)return n;var i=e.DEFAULT_SEARCH_OPERATOR.find((function(t){return t.key===r.payload.operatorKey}));return i?i.type!==n.inputtingCondition.target.type?n:"none"===i.inputType?{targets:n.targets,changeAction:{type:"add",payload:{condition:{target:n.inputtingCondition.target,operator:i,input:{type:"none"}}}},status:"waiting for input"}:{targets:n.targets,status:"inputted operator",inputtingCondition:{type:n.inputtingCondition.target.type,target:n.inputtingCondition.target,operator:i}}:n;case"inputValue":return"inputted operator"!==n.status?n:{targets:n.targets,changeAction:{type:"add",payload:{condition:{target:n.inputtingCondition.target,operator:n.inputtingCondition.operator,input:r.payload}}},status:"waiting for input"};case"deleteCondition":return t.__assign(t.__assign({},n),{changeAction:{type:"remove",payload:{index:r.payload.index}}});case"reset":return{targets:n.targets,status:"waiting for input"};case"updateTargets":return{targets:r.payload.targets,status:"waiting for input"};case"removeInputedTarget":return"inputted target"!=n.status&&"inputted operator"!=n.status?n:{targets:n.targets,status:"waiting for input"};case"removeInputedOperator":return"inputted operator"!==n.status?n:{targets:n.targets,status:"inputted target",inputtingCondition:{type:n.inputtingCondition.target.type,target:n.inputtingCondition.target},useableOperators:e.DEFAULT_SEARCH_OPERATOR.filter((function(t){return t.type===n.inputtingCondition.target.type}))};case"executedChangeAction":return t.__assign(t.__assign({},n),{changeAction:void 0})}};
 //# sourceMappingURL=reducer.js.map

package/dist/cjs/src/search-bar/condition-search-bar/condition-input-management/reducer.js.map

@@ -1 +1 @@
-{"version":3,"file":"reducer.js","sources":["../../../../../../src/search-bar/condition-search-bar/condition-input-management/reducer.ts"],"sourcesContent":["import { DEFAULT_SEARCH_OPERATOR } from \"../../../share/search-operator\";\nimport { TConditionInputReducer } from \"./type\";\n\nexport const conditionInputReducer: TConditionInputReducer = (\n  state,\n  action\n) => {\n  switch (action.type) {\n    case \"inputTarget\": {\n      if (state.status !== \"waiting for input\") {\n        return state;\n      }\n\n      const target = state.targets.find(\n        (t) => t.key === action.payload.targetKey\n      );\n\n      if (!target) {\n        return state;\n      }\n\n      return {\n        targets: state.targets,\n        onChangeCondition: state.onChangeCondition,\n        status: \"inputted target\",\n        inputtingCondition: {\n          type: target.type,\n          target,\n        },\n        useableOperators: DEFAULT_SEARCH_OPERATOR.filter(\n          (o) => o.type === target.type\n        ),\n      };\n    }\n\n    case \"inputOperator\": {\n      if (state.status !== \"inputted target\") {\n        return state;\n      }\n\n      const operator = DEFAULT_SEARCH_OPERATOR.find(\n        (o) => o.key === action.payload.operatorKey\n      );\n\n      if (!operator) {\n        return state;\n      }\n\n      if (operator.type !== state.inputtingCondition.target.type) {\n        return state;\n      }\n\n      if (operator.inputType === \"none\") {\n        state.onChangeCondition({\n          type: \"add\",\n          payload: {\n            condition: {\n              target: state.inputtingCondition.target,\n              operator,\n              input: {\n                type: \"none\",\n              },\n            },\n          },\n        });\n\n        return {\n          targets: state.targets,\n          onChangeCondition: state.onChangeCondition,\n          status: \"waiting for input\",\n        };\n      }\n\n      return {\n        targets: state.targets,\n        onChangeCondition: state.onChangeCondition,\n        status: \"inputted operator\",\n        inputtingCondition: {\n          type: state.inputtingCondition.target.type,\n          target: state.inputtingCondition.target,\n          operator,\n        },\n      };\n    }\n\n    case \"inputValue\": {\n      if (state.status !== \"inputted operator\") {\n        return state;\n      }\n\n      state.onChangeCondition({\n        type: \"add\",\n        payload: {\n          condition: {\n            target: state.inputtingCondition.target,\n            operator: state.inputtingCondition.operator,\n            input: action.payload,\n          },\n        },\n      });\n\n      return {\n        targets: state.targets,\n        onChangeCondition: state.onChangeCondition,\n        status: \"waiting for input\",\n      };\n    }\n\n    case \"deleteCondition\": {\n      state.onChangeCondition({\n        type: \"remove\",\n        payload: {\n          index: action.payload.index,\n        },\n      });\n\n      return state;\n    }\n\n    case \"reset\": {\n      return {\n        targets: state.targets,\n        onChangeCondition: state.onChangeCondition,\n        status: \"waiting for input\",\n      };\n    }\n\n    case \"updateTargets\": {\n      return {\n        targets: action.payload.targets,\n        onChangeCondition: state.onChangeCondition,\n        status: \"waiting for input\",\n      };\n    }\n\n    case \"removeInputedTarget\": {\n      if (\n        !(\n          state.status == \"inputted target\" ||\n          state.status == \"inputted operator\"\n        )\n      ) {\n        return state;\n      }\n\n      return {\n        targets: state.targets,\n        onChangeCondition: state.onChangeCondition,\n        status: \"waiting for input\",\n      };\n    }\n\n    case \"removeInputedOperator\": {\n      if (state.status !== \"inputted operator\") {\n        return state;\n      }\n\n      return {\n        targets: state.targets,\n        onChangeCondition: state.onChangeCondition,\n        status: \"inputted target\",\n        inputtingCondition: {\n          type: state.inputtingCondition.target.type,\n          target: state.inputtingCondition.target,\n        },\n        useableOperators: DEFAULT_SEARCH_OPERATOR.filter(\n          (o) => o.type === state.inputtingCondition.target.type\n        ),\n      };\n    }\n  }\n};\n"],"names":["state","action","type","status","target_1","targets","find","t","key","payload","targetKey","onChangeCondition","inputtingCondition","target","useableOperators","DEFAULT_SEARCH_OPERATOR","filter","o","operator","operatorKey","inputType","condition","input","index"],"mappings":"uGAG6D,SAC3DA,EACAC,GAEA,OAAQA,EAAOC,MACb,IAAK,cACH,GAAqB,sBAAjBF,EAAMG,OACR,OAAOH,EAGT,IAAMI,EAASJ,EAAMK,QAAQC,MAC3B,SAACC,GAAM,OAAAA,EAAEC,MAAQP,EAAOQ,QAAQC,SAAS,IAG3C,OAAKN,EAIE,CACLC,QAASL,EAAMK,QACfM,kBAAmBX,EAAMW,kBACzBR,OAAQ,kBACRS,mBAAoB,CAClBV,KAAME,EAAOF,KACbW,OAAMT,GAERU,iBAAkBC,EAAuBA,wBAACC,QACxC,SAACC,GAAM,OAAAA,EAAEf,OAASE,EAAOF,SAZpBF,EAiBX,IAAK,gBACH,GAAqB,oBAAjBA,EAAMG,OACR,OAAOH,EAGT,IAAMkB,EAAWH,EAAuBA,wBAACT,MACvC,SAACW,GAAM,OAAAA,EAAET,MAAQP,EAAOQ,QAAQU,WAAW,IAG7C,OAAKD,EAIDA,EAAShB,OAASF,EAAMY,mBAAmBC,OAAOX,KAC7CF,EAGkB,SAAvBkB,EAASE,WACXpB,EAAMW,kBAAkB,CACtBT,KAAM,MACNO,QAAS,CACPY,UAAW,CACTR,OAAQb,EAAMY,mBAAmBC,OACjCK,SAAQA,EACRI,MAAO,CACLpB,KAAM,YAMP,CACLG,QAASL,EAAMK,QACfM,kBAAmBX,EAAMW,kBACzBR,OAAQ,sBAIL,CACLE,QAASL,EAAMK,QACfM,kBAAmBX,EAAMW,kBACzBR,OAAQ,oBACRS,mBAAoB,CAClBV,KAAMF,EAAMY,mBAAmBC,OAAOX,KACtCW,OAAQb,EAAMY,mBAAmBC,OACjCK,SAAQA,IAnCHlB,EAwCX,IAAK,aACH,MAAqB,sBAAjBA,EAAMG,OACDH,GAGTA,EAAMW,kBAAkB,CACtBT,KAAM,MACNO,QAAS,CACPY,UAAW,CACTR,OAAQb,EAAMY,mBAAmBC,OACjCK,SAAUlB,EAAMY,mBAAmBM,SACnCI,MAAOrB,EAAOQ,YAKb,CACLJ,QAASL,EAAMK,QACfM,kBAAmBX,EAAMW,kBACzBR,OAAQ,sBAIZ,IAAK,kBAQH,OAPAH,EAAMW,kBAAkB,CACtBT,KAAM,SACNO,QAAS,CACPc,MAAOtB,EAAOQ,QAAQc,SAInBvB,EAGT,IAAK,QACH,MAAO,CACLK,QAASL,EAAMK,QACfM,kBAAmBX,EAAMW,kBACzBR,OAAQ,qBAIZ,IAAK,gBACH,MAAO,CACLE,QAASJ,EAAOQ,QAAQJ,QACxBM,kBAAmBX,EAAMW,kBACzBR,OAAQ,qBAIZ,IAAK,sBACH,MAEoB,mBAAhBH,EAAMG,QACU,qBAAhBH,EAAMG,OAGDH,EAGF,CACLK,QAASL,EAAMK,QACfM,kBAAmBX,EAAMW,kBACzBR,OAAQ,qBAIZ,IAAK,wBACH,MAAqB,sBAAjBH,EAAMG,OACDH,EAGF,CACLK,QAASL,EAAMK,QACfM,kBAAmBX,EAAMW,kBACzBR,OAAQ,kBACRS,mBAAoB,CAClBV,KAAMF,EAAMY,mBAAmBC,OAAOX,KACtCW,OAAQb,EAAMY,mBAAmBC,QAEnCC,iBAAkBC,EAAAA,wBAAwBC,QACxC,SAACC,GAAM,OAAAA,EAAEf,OAASF,EAAMY,mBAAmBC,OAAOX,IAA3C,KAKjB"}
+{"version":3,"file":"reducer.js","sources":["../../../../../../src/search-bar/condition-search-bar/condition-input-management/reducer.ts"],"sourcesContent":["import { DEFAULT_SEARCH_OPERATOR } from \"../../../share/search-operator\";\nimport { TConditionInputReducer } from \"./type\";\n\nexport const conditionInputReducer: TConditionInputReducer = (\n  state,\n  action\n) => {\n  switch (action.type) {\n    case \"inputTarget\": {\n      if (state.status !== \"waiting for input\") {\n        return state;\n      }\n\n      const target = state.targets.find(\n        (t) => t.key === action.payload.targetKey\n      );\n\n      if (!target) {\n        return state;\n      }\n\n      return {\n        targets: state.targets,\n        status: \"inputted target\",\n        inputtingCondition: {\n          type: target.type,\n          target,\n        },\n        useableOperators: DEFAULT_SEARCH_OPERATOR.filter(\n          (o) => o.type === target.type\n        ),\n      };\n    }\n\n    case \"inputOperator\": {\n      if (state.status !== \"inputted target\") {\n        return state;\n      }\n\n      const operator = DEFAULT_SEARCH_OPERATOR.find(\n        (o) => o.key === action.payload.operatorKey\n      );\n\n      if (!operator) {\n        return state;\n      }\n\n      if (operator.type !== state.inputtingCondition.target.type) {\n        return state;\n      }\n\n      if (operator.inputType === \"none\") {\n        return {\n          targets: state.targets,\n          changeAction: {\n            type: \"add\",\n            payload: {\n              condition: {\n                target: state.inputtingCondition.target,\n                operator,\n                input: {\n                  type: \"none\",\n                },\n              },\n            },\n          },\n          status: \"waiting for input\",\n        };\n      }\n\n      return {\n        targets: state.targets,\n        status: \"inputted operator\",\n        inputtingCondition: {\n          type: state.inputtingCondition.target.type,\n          target: state.inputtingCondition.target,\n          operator,\n        },\n      };\n    }\n\n    case \"inputValue\": {\n      if (state.status !== \"inputted operator\") {\n        return state;\n      }\n\n      return {\n        targets: state.targets,\n        changeAction: {\n          type: \"add\",\n          payload: {\n            condition: {\n              target: state.inputtingCondition.target,\n              operator: state.inputtingCondition.operator,\n              input: action.payload,\n            },\n          },\n        },\n        status: \"waiting for input\",\n      };\n    }\n\n    case \"deleteCondition\": {\n      return {\n        ...state,\n        changeAction: {\n          type: \"remove\",\n          payload: {\n            index: action.payload.index,\n          },\n        },\n      };\n    }\n\n    case \"reset\": {\n      return {\n        targets: state.targets,\n        status: \"waiting for input\",\n      };\n    }\n\n    case \"updateTargets\": {\n      return {\n        targets: action.payload.targets,\n        status: \"waiting for input\",\n      };\n    }\n\n    case \"removeInputedTarget\": {\n      if (\n        !(\n          state.status == \"inputted target\" ||\n          state.status == \"inputted operator\"\n        )\n      ) {\n        return state;\n      }\n\n      return {\n        targets: state.targets,\n        status: \"waiting for input\",\n      };\n    }\n\n    case \"removeInputedOperator\": {\n      if (state.status !== \"inputted operator\") {\n        return state;\n      }\n\n      return {\n        targets: state.targets,\n        status: \"inputted target\",\n        inputtingCondition: {\n          type: state.inputtingCondition.target.type,\n          target: state.inputtingCondition.target,\n        },\n        useableOperators: DEFAULT_SEARCH_OPERATOR.filter(\n          (o) => o.type === state.inputtingCondition.target.type\n        ),\n      };\n    }\n\n    case \"executedChangeAction\": {\n      return {\n        ...state,\n        changeAction: undefined,\n      };\n    }\n  }\n};\n"],"names":["state","action","type","status","target_1","targets","find","t","key","payload","targetKey","inputtingCondition","target","useableOperators","DEFAULT_SEARCH_OPERATOR","filter","o","operator","operatorKey","inputType","changeAction","condition","input","__assign","index","undefined"],"mappings":"gKAG6D,SAC3DA,EACAC,GAEA,OAAQA,EAAOC,MACb,IAAK,cACH,GAAqB,sBAAjBF,EAAMG,OACR,OAAOH,EAGT,IAAMI,EAASJ,EAAMK,QAAQC,MAC3B,SAACC,GAAM,OAAAA,EAAEC,MAAQP,EAAOQ,QAAQC,SAAS,IAG3C,OAAKN,EAIE,CACLC,QAASL,EAAMK,QACfF,OAAQ,kBACRQ,mBAAoB,CAClBT,KAAME,EAAOF,KACbU,OAAMR,GAERS,iBAAkBC,EAAuBA,wBAACC,QACxC,SAACC,GAAM,OAAAA,EAAEd,OAASE,EAAOF,SAXpBF,EAgBX,IAAK,gBACH,GAAqB,oBAAjBA,EAAMG,OACR,OAAOH,EAGT,IAAMiB,EAAWH,EAAuBA,wBAACR,MACvC,SAACU,GAAM,OAAAA,EAAER,MAAQP,EAAOQ,QAAQS,WAAW,IAG7C,OAAKD,EAIDA,EAASf,OAASF,EAAMW,mBAAmBC,OAAOV,KAC7CF,EAGkB,SAAvBiB,EAASE,UACJ,CACLd,QAASL,EAAMK,QACfe,aAAc,CACZlB,KAAM,MACNO,QAAS,CACPY,UAAW,CACTT,OAAQZ,EAAMW,mBAAmBC,OACjCK,SAAQA,EACRK,MAAO,CACLpB,KAAM,WAKdC,OAAQ,qBAIL,CACLE,QAASL,EAAMK,QACfF,OAAQ,oBACRQ,mBAAoB,CAClBT,KAAMF,EAAMW,mBAAmBC,OAAOV,KACtCU,OAAQZ,EAAMW,mBAAmBC,OACjCK,SAAQA,IAhCHjB,EAqCX,IAAK,aACH,MAAqB,sBAAjBA,EAAMG,OACDH,EAGF,CACLK,QAASL,EAAMK,QACfe,aAAc,CACZlB,KAAM,MACNO,QAAS,CACPY,UAAW,CACTT,OAAQZ,EAAMW,mBAAmBC,OACjCK,SAAUjB,EAAMW,mBAAmBM,SACnCK,MAAOrB,EAAOQ,WAIpBN,OAAQ,qBAIZ,IAAK,kBACH,OACKoB,EAAAA,SAAAA,EAAAA,SAAA,CAAA,EAAAvB,GACH,CAAAoB,aAAc,CACZlB,KAAM,SACNO,QAAS,CACPe,MAAOvB,EAAOQ,QAAQe,UAM9B,IAAK,QACH,MAAO,CACLnB,QAASL,EAAMK,QACfF,OAAQ,qBAIZ,IAAK,gBACH,MAAO,CACLE,QAASJ,EAAOQ,QAAQJ,QACxBF,OAAQ,qBAIZ,IAAK,sBACH,MAEoB,mBAAhBH,EAAMG,QACU,qBAAhBH,EAAMG,OAGDH,EAGF,CACLK,QAASL,EAAMK,QACfF,OAAQ,qBAIZ,IAAK,wBACH,MAAqB,sBAAjBH,EAAMG,OACDH,EAGF,CACLK,QAASL,EAAMK,QACfF,OAAQ,kBACRQ,mBAAoB,CAClBT,KAAMF,EAAMW,mBAAmBC,OAAOV,KACtCU,OAAQZ,EAAMW,mBAAmBC,QAEnCC,iBAAkBC,EAAAA,wBAAwBC,QACxC,SAACC,GAAM,OAAAA,EAAEd,OAASF,EAAMW,mBAAmBC,OAAOV,IAA3C,KAKb,IAAK,uBACH,OAAAqB,EAAAA,SAAAA,EAAAA,SAAA,GACKvB,GAAK,CACRoB,kBAAcK,IAItB"}

package/dist/cjs/src/search-bar/condition-search-bar/condition-list.js

@@ -1,3 +1,3 @@
 "use client";
-"use strict";var e=require("react/jsx-runtime"),t=require("./condition-input-management/context.js");require("react");var n=require("../../../node_modules/react-icons/ti/index.js");function a(a){var o=t.useConditionInputAction().deleteCondition;return e.jsxs("div",{className:"flex items-center gap-2 w-fit px-2 border-2 border-sky-600 rounded shadow",children:[e.jsx("p",{className:"whitespace-nowrap",children:r(a.condition)}),e.jsx("div",{children:e.jsx(n.TiDeleteOutline,{className:"bg-white hover:bg-slate-300 rounded-full cursor-pointer",onClick:function(){return o(a.index)}})})]})}function r(e){var t;switch(e.input.type){case"none":return"".concat(e.target.label," ").concat(e.operator.label);case"single string":case"single number":case"single date":return"".concat(e.target.label," ").concat(e.operator.label," ").concat(e.input.payload.value);case"range string":case"range number":case"range date":return"".concat(e.target.label," ").concat(e.operator.label," ").concat(e.input.payload.from," ～ ").concat(e.input.payload.to);case"select":if("select"!==e.target.type)throw new Error("type error");var n=e.input.payload.value;return"".concat(e.target.label," ").concat(e.operator.label," ").concat(null===(t=e.target.options.find((function(e){return e.value===n})))||void 0===t?void 0:t.label);case"multi select":return"".concat(e.target.label," ").concat(e.operator.label," ").concat(e.input.payload.value.join(", "))}}exports.ConditionList=function(t){return e.jsx("div",{className:"flex gap-1",children:t.conditions.map((function(t,n){return e.jsx(a,{index:n,condition:t},n)}))})};
+"use strict";var e=require("react/jsx-runtime"),t=require("./condition-input-management/context.js");require("react"),require("../../../node_modules/tslib/tslib.es6.js");var n=require("../../../node_modules/react-icons/ti/index.js");function a(a){var o=t.useConditionInputAction().deleteCondition;return e.jsxs("div",{className:"flex items-center gap-2 w-fit px-2 border-2 border-sky-600 rounded shadow",children:[e.jsx("p",{className:"whitespace-nowrap",children:r(a.condition)}),e.jsx("div",{children:e.jsx(n.TiDeleteOutline,{className:"bg-white hover:bg-slate-300 rounded-full cursor-pointer",onClick:function(){return o(a.index)}})})]})}function r(e){var t;switch(e.input.type){case"none":return"".concat(e.target.label," ").concat(e.operator.label);case"single string":case"single number":case"single date":return"".concat(e.target.label," ").concat(e.operator.label," ").concat(e.input.payload.value);case"range string":case"range number":case"range date":return"".concat(e.target.label," ").concat(e.operator.label," ").concat(e.input.payload.from," ～ ").concat(e.input.payload.to);case"select":if("select"!==e.target.type)throw new Error("type error");var n=e.input.payload.value;return"".concat(e.target.label," ").concat(e.operator.label," ").concat(null===(t=e.target.options.find((function(e){return e.value===n})))||void 0===t?void 0:t.label);case"multi select":return"".concat(e.target.label," ").concat(e.operator.label," ").concat(e.input.payload.value.join(", "))}}exports.ConditionList=function(t){return e.jsx("div",{className:"flex gap-1",children:t.conditions.map((function(t,n){return e.jsx(a,{index:n,condition:t},n)}))})};
 //# sourceMappingURL=condition-list.js.map

package/dist/cjs/src/search-bar/condition-search-bar/input-form.js

@@ -1,3 +1,3 @@
 "use client";
-"use strict";var e=require("react/jsx-runtime"),t=require("react"),n=require("../../select-box/index.js"),i=require("./condition-input-management/context.js"),o=require("../id-generator/context.js"),r=require("../../../node_modules/react-icons/ti/index.js");function a(){var t=o.useIdGenerator().generateId,r=i.useConditionInputState().targets,a=i.useConditionInputAction().inputTarget;return e.jsx(n.SelectBox,{id:t("TargetInput"),onSelect:function(e){a(e)},options:r.map((function(e){return{value:e.key,label:e.label}})),placeholder:"Select target",no_appearance:!0,no_icon:!0})}function u(){var t=o.useIdGenerator().generateId,r=i.useConditionInputState(),a=i.useConditionInputAction(),u=a.inputOperator,l=a.removeInputedTarget;if("inputted target"!==r.status)return null;var s=r.inputtingCondition.target,p=r.useableOperators;return e.jsxs(e.Fragment,{children:[e.jsx(d,{label:s.label,onClickDelete:function(){l()}}),e.jsx("div",{className:"w-full min-w-64",children:e.jsx(n.SelectBox,{id:t("OperatorInput"),onSelect:function(e){u(e),setTimeout((function(){var e=document.getElementById(t("ValueInput"));e&&e.focus()}),10)},options:p.map((function(e){return{value:e.key,label:e.label}})),defaultIsOpen:!0,placeholder:"Select operator",no_appearance:!0,no_icon:!0})})]})}function l(t){var n=i.useConditionInputState(),o=i.useConditionInputAction(),r=o.removeInputedOperator,a=o.removeInputedTarget;if("inputted operator"!==n.status)return null;var u=n.inputtingCondition.target,l=n.inputtingCondition.operator;return e.jsxs(e.Fragment,{children:[e.jsx(d,{label:u.label,onClickDelete:function(){a()}}),e.jsx(d,{label:l.label,onClickDelete:function(){r()}}),"single string"===n.inputtingCondition.operator.inputType?e.jsx(s,{inputType:"single string",size:t.size}):"single number"===n.inputtingCondition.operator.inputType?e.jsx(p,{inputType:"single number",size:t.size}):"select"===n.inputtingCondition.operator.inputType?e.jsx(c,{inputType:"select",options:"select"===n.inputtingCondition.target.type?n.inputtingCondition.target.options:[]}):console.error("Not implemented")]})}function s(n){var r=o.useIdGenerator().generateId,a=t.useState(""),u=a[0],l=a[1],s=i.useConditionInputAction().inputValue;return e.jsx("input",{id:r("ValueInput"),className:"no_appearance w-full min-w-64 border-none px-2 py-1 focus:outline-none focus-visible:outline-none bg-transparent ".concat("small"===n.size?"text-sm":"large"===n.size?"text-lg":""),type:"text",placeholder:"Search text",value:u,onChange:function(e){l(e.target.value)},onKeyDown:function(e){"Enter"===e.key&&(s({type:n.inputType,payload:{value:u}}),l(""))}})}function p(n){var r=o.useIdGenerator().generateId,a=t.useState(""),u=a[0],l=a[1],s=i.useConditionInputAction().inputValue;return e.jsx("input",{id:r("ValueInput"),className:"no_appearance w-full min-w-64 border-none px-2 py-1 focus:outline-none focus-visible:outline-none bg-transparent ".concat("small"===n.size?"text-sm":"large"===n.size?"text-lg":""),type:"text",placeholder:"Search text",value:u,onChange:function(e){l(e.target.value)},onKeyDown:function(e){"Enter"===e.key&&(s({type:n.inputType,payload:{value:Number(u)}}),l(""))}})}function c(t){var r=i.useConditionInputAction().inputValue,a=o.useIdGenerator().generateId;return e.jsx("div",{className:"w-full min-w-64",children:e.jsx(n.SelectBox,{id:a("ValueInput"),onSelect:function(e){r({type:t.inputType,payload:{value:e}})},options:t.options,defaultIsOpen:!0,placeholder:"Select value",no_appearance:!0,no_icon:!0})})}function d(t){return e.jsxs("div",{className:"flex items-center gap-2 w-fit px-2 border rounded bg-slate-100",children:[e.jsx("p",{className:"whitespace-nowrap",children:t.label}),t.onClickDelete&&e.jsx("div",{children:e.jsx(r.TiDeleteOutline,{className:"bg-white hover:bg-slate-300 rounded-full cursor-pointer",onClick:t.onClickDelete})})]})}exports.SearchBarInputForm=function(t){switch(i.useConditionInputState().status){case"waiting for input":return e.jsx(a,{});case"inputted target":return e.jsx(u,{});case"inputted operator":return e.jsx(l,{size:t.size})}};
+"use strict";var e=require("react/jsx-runtime"),t=require("react"),n=require("../../select-box/index.js"),i=require("./condition-input-management/context.js");require("../../../node_modules/tslib/tslib.es6.js");var o=require("../id-generator/context.js"),r=require("../../../node_modules/react-icons/ti/index.js");function a(){var t=o.useIdGenerator().generateId,r=i.useConditionInputState().targets,a=i.useConditionInputAction().inputTarget;return e.jsx(n.SelectBox,{id:t("TargetInput"),onSelect:function(e){a(e)},options:r.map((function(e){return{value:e.key,label:e.label}})),placeholder:"Select target",no_appearance:!0,no_icon:!0})}function u(){var t=o.useIdGenerator().generateId,r=i.useConditionInputState(),a=i.useConditionInputAction(),u=a.inputOperator,l=a.removeInputedTarget;if("inputted target"!==r.status)return null;var s=r.inputtingCondition.target,p=r.useableOperators;return e.jsxs(e.Fragment,{children:[e.jsx(d,{label:s.label,onClickDelete:function(){l()}}),e.jsx("div",{className:"w-full min-w-64",children:e.jsx(n.SelectBox,{id:t("OperatorInput"),onSelect:function(e){u(e),setTimeout((function(){var e=document.getElementById(t("ValueInput"));e&&e.focus()}),10)},options:p.map((function(e){return{value:e.key,label:e.label}})),defaultIsOpen:!0,placeholder:"Select operator",no_appearance:!0,no_icon:!0})})]})}function l(t){var n=i.useConditionInputState(),o=i.useConditionInputAction(),r=o.removeInputedOperator,a=o.removeInputedTarget;if("inputted operator"!==n.status)return null;var u=n.inputtingCondition.target,l=n.inputtingCondition.operator;return e.jsxs(e.Fragment,{children:[e.jsx(d,{label:u.label,onClickDelete:function(){a()}}),e.jsx(d,{label:l.label,onClickDelete:function(){r()}}),"single string"===n.inputtingCondition.operator.inputType?e.jsx(s,{inputType:"single string",size:t.size}):"single number"===n.inputtingCondition.operator.inputType?e.jsx(p,{inputType:"single number",size:t.size}):"select"===n.inputtingCondition.operator.inputType?e.jsx(c,{inputType:"select",options:"select"===n.inputtingCondition.target.type?n.inputtingCondition.target.options:[]}):console.error("Not implemented")]})}function s(n){var r=o.useIdGenerator().generateId,a=t.useState(""),u=a[0],l=a[1],s=i.useConditionInputAction().inputValue;return e.jsx("input",{id:r("ValueInput"),className:"appearance-none w-full min-w-64 border-none px-2 py-1 focus:outline-none focus-visible:outline-none bg-transparent ".concat("small"===n.size?"text-sm":"large"===n.size?"text-lg":""),type:"text",placeholder:"Search text",value:u,onChange:function(e){l(e.target.value)},onKeyDown:function(e){"Enter"===e.key&&(s({type:n.inputType,payload:{value:u}}),l(""))}})}function p(n){var r=o.useIdGenerator().generateId,a=t.useState(""),u=a[0],l=a[1],s=i.useConditionInputAction().inputValue;return e.jsx("input",{id:r("ValueInput"),className:"appearance-none w-full min-w-64 border-none px-2 py-1 focus:outline-none focus-visible:outline-none bg-transparent ".concat("small"===n.size?"text-sm":"large"===n.size?"text-lg":""),type:"text",placeholder:"Search text",value:u,onChange:function(e){l(e.target.value)},onKeyDown:function(e){"Enter"===e.key&&(s({type:n.inputType,payload:{value:Number(u)}}),l(""))}})}function c(t){var r=i.useConditionInputAction().inputValue,a=o.useIdGenerator().generateId;return e.jsx("div",{className:"w-full min-w-64",children:e.jsx(n.SelectBox,{id:a("ValueInput"),onSelect:function(e){r({type:t.inputType,payload:{value:e}})},options:t.options,defaultIsOpen:!0,placeholder:"Select value",no_appearance:!0,no_icon:!0})})}function d(t){return e.jsxs("div",{className:"flex items-center gap-2 w-fit px-2 border rounded bg-slate-100",children:[e.jsx("p",{className:"whitespace-nowrap",children:t.label}),t.onClickDelete&&e.jsx("div",{children:e.jsx(r.TiDeleteOutline,{className:"bg-white hover:bg-slate-300 rounded-full cursor-pointer",onClick:t.onClickDelete})})]})}exports.SearchBarInputForm=function(t){switch(i.useConditionInputState().status){case"waiting for input":return e.jsx(a,{});case"inputted target":return e.jsx(u,{});case"inputted operator":return e.jsx(l,{size:t.size})}};
 //# sourceMappingURL=input-form.js.map

package/dist/cjs/src/select-box/options-window/component.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("react/jsx-runtime"),t=require("react"),n=require("./context.js"),o=require("../id/provider.js"),r=require("../lib/id-generator.js");exports.OptionsArea=function(){var i=o.useIdContext(),s=n.useOptionsWindow(),a=s.state,l=s.actions,u=t.useState(""),c=u[0],d=u[1],f=t.useState(void 0),p=f[0],v=f[1],g=a.isOpen?0===a.options.length?void 0:"number"==typeof p&&p<a.options.length&&p>=0?a.options[p].value:void 0:void 0;if(t.useEffect((function(){if(a.isOpen){var e=document.getElementById(r.IdGenerator.generateIdSelectBoxOption(i,null!=g?g:""));if(!e)return;e.scrollIntoView({behavior:"smooth",block:"nearest",inline:"nearest"})}else v(void 0)}),[a]),t.useEffect((function(){if(a.isOpen){var e=function(e){if("ArrowDown"===e.key)e.preventDefault(),v((function(e){return"number"==typeof e?Math.min(e+1,a.options.length-1):0}));else if("ArrowUp"===e.key)e.preventDefault(),v((function(e){return"number"==typeof e?Math.max(e-1,0):0}));else if("Enter"===e.key&&(e.preventDefault(),"number"==typeof p)){if(0===a.options.length||a.options.length<=p)return;var t=a.options[p].value;if(!t)return;d(t),a.onSelect(t),l.closeOptionsWindow()}};return document.addEventListener("keydown",e),function(){document.removeEventListener("keydown",e)}}}),[a,p,v]),!a.isOpen)return e.jsx(e.Fragment,{});var m=document.getElementById(a.selectBoxId);if(!m)return e.jsx(e.Fragment,{});var h=m.getBoundingClientRect(),y=window.scrollY+h.top+h.height,b=window.scrollX+h.left;return e.jsx("div",{id:"ReactUI:SelectBox:OptionsArea",className:"absolute min-w-fit max-h-[40vh] overflow-auto border border-gray-300 z-10",style:{top:y,left:b},children:a.options.map((function(t){var n,o;return e.jsx("div",{id:r.IdGenerator.generateIdSelectBoxOption(i,null!==(n=t.value)&&void 0!==n?n:""),className:"hover:bg-gray-200 px-2 py-1 ".concat("string"==typeof g?g===t.value?"bg-gray-100":"bg-white":c===t.value?"bg-gray-100":"bg-white"),onClick:function(){a.onSelect(t.value),l.closeOptionsWindow()},children:null!==(o=t.searchLabel)&&void 0!==o?o:t.label},t.value)}))})};
+"use strict";var e=require("react/jsx-runtime"),t=require("react"),n=require("./context.js"),o=require("../id/provider.js"),i=require("../lib/id-generator.js");exports.OptionsArea=function(){var r=o.useIdContext(),s=n.useOptionsWindow(),l=s.state,u=s.actions,a=t.useState(""),c=a[0],d=a[1],f=t.useState(void 0),p=f[0],v=f[1],m=t.useState({top:0,left:0}),g=m[0],y=m[1],h=l.isOpen?0===l.options.length?void 0:"number"==typeof p&&p<l.options.length&&p>=0?l.options[p].value:void 0:void 0;return t.useEffect((function(){if(l.isOpen){var e=document.getElementById(i.IdGenerator.generateIdSelectBoxOption(r,null!=h?h:""));if(!e)return;if(0===g.top&&0===g.left)return;e.scrollIntoView({behavior:"smooth",block:"nearest",inline:"nearest"})}else v(void 0)}),[l,g,h]),t.useEffect((function(){if(l.isOpen){var e=function(e){if("ArrowDown"===e.key)e.preventDefault(),v((function(e){return"number"==typeof e?Math.min(e+1,l.options.length-1):0}));else if("ArrowUp"===e.key)e.preventDefault(),v((function(e){return"number"==typeof e?Math.max(e-1,0):0}));else if("Enter"===e.key&&(e.preventDefault(),"number"==typeof p)){if(0===l.options.length||l.options.length<=p)return;var t=l.options[p].value;if(!t)return;d(t),l.onSelect(t),u.closeOptionsWindow()}};return document.addEventListener("keydown",e),function(){document.removeEventListener("keydown",e)}}}),[l,p,v]),t.useEffect((function(){var e=setTimeout((function(){if(l.isOpen){for(var e=document.getElementById("ReactUI:SelectBox:OptionsArea");e&&!e.className.includes("relative");)e=e.parentElement;var t=document.getElementById(l.selectBoxId);if(t){var n=t.getBoundingClientRect(),o=n.top+n.height,i=n.left;if(e){var r=e.getBoundingClientRect();y({top:o-r.top,left:i-r.left})}else y({top:o+window.scrollY,left:i+window.scrollX})}}}),0);return function(){clearTimeout(e)}}),[l.isOpen]),t.useEffect((function(){var e=function(e){if(l.isOpen){var t=document.getElementById(l.selectBoxId),n=document.getElementById("ReactUI:SelectBox:OptionsArea"),o=e.target;o instanceof Node&&(null==t?void 0:t.contains(o))||o instanceof Node&&(null==n?void 0:n.contains(o))||(u.setSearchText(""),u.closeOptionsWindow())}};return document.addEventListener("mousedown",e),function(){document.removeEventListener("mousedown",e)}}),[l.isOpen]),l.isOpen?e.jsx("div",{id:"ReactUI:SelectBox:OptionsArea",className:"absolute min-w-fit max-h-[40vh] overflow-auto border border-gray-300 z-10",style:g,children:l.options.map((function(t){var n,o;return e.jsx("div",{id:i.IdGenerator.generateIdSelectBoxOption(r,null!==(n=t.value)&&void 0!==n?n:""),className:"hover:bg-gray-200 px-2 py-1 ".concat("string"==typeof h?h===t.value?"bg-gray-100":"bg-white":c===t.value?"bg-gray-100":"bg-white"),onClick:function(){l.onSelect(t.value),u.closeOptionsWindow()},children:null!==(o=t.searchLabel)&&void 0!==o?o:t.label},t.value)}))}):e.jsx(e.Fragment,{})};
 //# sourceMappingURL=component.js.map

package/dist/cjs/src/select-box/options-window/component.js.map

@@ -1 +1 @@
-{"version":3,"file":"component.js","sources":["../../../../../src/select-box/options-window/component.tsx"],"sourcesContent":["import { useEffect, useState } from \"react\";\nimport { useOptionsWindow } from \"../options-window\";\nimport { useIdContext } from \"../id/provider\";\nimport { IdGenerator } from \"../lib\";\n\nexport function OptionsArea() {\n  const id = useIdContext();\n  const { state, actions } = useOptionsWindow();\n  const [value, setValue] = useState(\"\");\n  const [selectingIndex, setSelectingIndex] = useState<number | undefined>(\n    undefined\n  );\n\n  const selectingValue = state.isOpen\n    ? state.options.length === 0\n      ? undefined\n      : typeof selectingIndex === \"number\" &&\n        selectingIndex < state.options.length &&\n        selectingIndex >= 0\n      ? state.options[selectingIndex].value\n      : undefined\n    : undefined;\n\n  useEffect(() => {\n    if (state.isOpen) {\n      const optionElement = document.getElementById(\n        IdGenerator.generateIdSelectBoxOption(id, selectingValue ?? \"\")\n      );\n\n      if (!optionElement) return;\n\n      optionElement.scrollIntoView({\n        behavior: \"smooth\",\n        block: \"nearest\",\n        inline: \"nearest\",\n      });\n    } else {\n      setSelectingIndex(undefined);\n    }\n  }, [state]);\n\n  useEffect(() => {\n    if (state.isOpen) {\n      const handleKeydown = (e: KeyboardEvent) => {\n        if (e.key === \"ArrowDown\") {\n          e.preventDefault();\n          setSelectingIndex((prev) =>\n            typeof prev === \"number\"\n              ? Math.min(prev + 1, state.options.length - 1)\n              : 0\n          );\n        } else if (e.key === \"ArrowUp\") {\n          e.preventDefault();\n          setSelectingIndex((prev) =>\n            typeof prev === \"number\" ? Math.max(prev - 1, 0) : 0\n          );\n        } else if (e.key === \"Enter\") {\n          e.preventDefault();\n          if (typeof selectingIndex === \"number\") {\n            if (\n              state.options.length === 0 ||\n              state.options.length <= selectingIndex\n            )\n              return;\n\n            const value = state.options[selectingIndex].value;\n\n            if (!value) return;\n\n            setValue(value);\n            state.onSelect(value);\n            actions.closeOptionsWindow();\n          }\n        }\n      };\n\n      document.addEventListener(\"keydown\", handleKeydown);\n\n      return () => {\n        document.removeEventListener(\"keydown\", handleKeydown);\n      };\n    }\n  }, [state, selectingIndex, setSelectingIndex]);\n\n  if (!state.isOpen) return <></>;\n\n  // state.selectBoxIdのElementの直下に表示する\n  const selectBoxElement = document.getElementById(state.selectBoxId);\n\n  if (!selectBoxElement) return <></>;\n\n  const rect = selectBoxElement.getBoundingClientRect();\n  let top = window.scrollY + rect.top + rect.height;\n  let left = window.scrollX + rect.left;\n\n  return (\n    <div\n      id={\"ReactUI:SelectBox:OptionsArea\"}\n      className=\"absolute min-w-fit max-h-[40vh] overflow-auto border border-gray-300 z-10\"\n      style={{ top, left }}\n    >\n      {state.options.map((option) => (\n        <div\n          id={IdGenerator.generateIdSelectBoxOption(id, option.value ?? \"\")}\n          className={`hover:bg-gray-200 px-2 py-1 ${\n            typeof selectingValue === \"string\"\n              ? selectingValue === option.value\n                ? \"bg-gray-100\"\n                : \"bg-white\"\n              : value === option.value\n              ? \"bg-gray-100\"\n              : \"bg-white\"\n          }`}\n          key={option.value}\n          onClick={() => {\n            state.onSelect(option.value);\n            actions.closeOptionsWindow();\n          }}\n        >\n          {option.searchLabel ?? option.label}\n        </div>\n      ))}\n    </div>\n  );\n}\n"],"names":["id","useIdContext","_a","useOptionsWindow","state","actions","_b","useState","value","setValue","_c","undefined","selectingIndex","setSelectingIndex","selectingValue","isOpen","options","length","useEffect","optionElement","document","getElementById","IdGenerator","generateIdSelectBoxOption","scrollIntoView","behavior","block","inline","handleKeydown_1","e","key","preventDefault","prev","Math","min","max","value_1","onSelect","closeOptionsWindow","addEventListener","removeEventListener","_jsx","selectBoxElement","selectBoxId","rect","getBoundingClientRect","top","window","scrollY","height","left","scrollX","jsx","className","style","children","map","option","concat","onClick","searchLabel","label"],"mappings":"+LAME,IAAMA,EAAKC,EAAAA,eACLC,EAAqBC,EAAgBA,mBAAnCC,EAAKF,EAAAE,MAAEC,EAAOH,EAAAG,QAChBC,EAAoBC,EAAAA,SAAS,IAA5BC,EAAKF,EAAA,GAAEG,EAAQH,EAAA,GAChBI,EAAsCH,EAAAA,cAC1CI,GADKC,EAAcF,EAAA,GAAEG,EAAiBH,EAAA,GAIlCI,EAAiBV,EAAMW,OACA,IAAzBX,EAAMY,QAAQC,YACZN,EAC0B,iBAAnBC,GACPA,EAAiBR,EAAMY,QAAQC,QAC/BL,GAAkB,EAClBR,EAAMY,QAAQJ,GAAgBJ,WAC9BG,OACFA,EA+DJ,GA7DAO,EAAAA,WAAU,WACR,GAAId,EAAMW,OAAQ,CAChB,IAAMI,EAAgBC,SAASC,eAC7BC,EAAWA,YAACC,0BAA0BvB,EAAIc,QAAAA,EAAkB,KAG9D,IAAKK,EAAe,OAEpBA,EAAcK,eAAe,CAC3BC,SAAU,SACVC,MAAO,UACPC,OAAQ,WAEX,MACCd,OAAkBF,EAEtB,GAAG,CAACP,IAEJc,EAAAA,WAAU,WACR,GAAId,EAAMW,OAAQ,CAChB,IAAMa,EAAgB,SAACC,GACrB,GAAc,cAAVA,EAAEC,IACJD,EAAEE,iBACFlB,GAAkB,SAACmB,GACjB,MAAgB,iBAATA,EACHC,KAAKC,IAAIF,EAAO,EAAG5B,EAAMY,QAAQC,OAAS,GAC1C,CAFJ,SAIG,GAAc,YAAVY,EAAEC,IACXD,EAAEE,iBACFlB,GAAkB,SAACmB,GACjB,MAAgB,iBAATA,EAAoBC,KAAKE,IAAIH,EAAO,EAAG,GAAK,CAAnD,SAEG,GAAc,UAAVH,EAAEC,MACXD,EAAEE,iBAC4B,iBAAnBnB,GAA6B,CACtC,GAC2B,IAAzBR,EAAMY,QAAQC,QACdb,EAAMY,QAAQC,QAAUL,EAExB,OAEF,IAAMwB,EAAQhC,EAAMY,QAAQJ,GAAgBJ,MAE5C,IAAK4B,EAAO,OAEZ3B,EAAS2B,GACThC,EAAMiC,SAASD,GACf/B,EAAQiC,oBACT,CAEL,EAIA,OAFAlB,SAASmB,iBAAiB,UAAWX,GAE9B,WACLR,SAASoB,oBAAoB,UAAWZ,EAC1C,CACD,CACF,GAAE,CAACxB,EAAOQ,EAAgBC,KAEtBT,EAAMW,OAAQ,OAAO0B,qBAG1B,IAAMC,EAAmBtB,SAASC,eAAejB,EAAMuC,aAEvD,IAAKD,EAAkB,OAAOD,qBAE9B,IAAMG,EAAOF,EAAiBG,wBAC1BC,EAAMC,OAAOC,QAAUJ,EAAKE,IAAMF,EAAKK,OACvCC,EAAOH,OAAOI,QAAUP,EAAKM,KAEjC,OACET,EACEW,IAAA,MAAA,CAAApD,GAAI,gCACJqD,UAAU,4EACVC,MAAO,CAAER,IAAGA,EAAEI,KAAIA,GAEjBK,SAAAnD,EAAMY,QAAQwC,KAAI,SAACC,WAAW,OAC7BhB,EACEW,IAAA,MAAA,CAAApD,GAAIsB,EAAAA,YAAYC,0BAA0BvB,EAAgB,QAAZE,EAAAuD,EAAOjD,aAAK,IAAAN,EAAAA,EAAI,IAC9DmD,UAAW,+BACTK,OAA0B,iBAAnB5C,EACHA,IAAmB2C,EAAOjD,MACxB,cACA,WACFA,IAAUiD,EAAOjD,MACjB,cACA,YAGNmD,QAAS,WACPvD,EAAMiC,SAASoB,EAAOjD,OACtBH,EAAQiC,oBACV,EAECiB,SAAsB,QAAtBjD,EAAAmD,EAAOG,mBAAe,IAAAtD,EAAAA,EAAAmD,EAAOI,OANzBJ,EAAOjD,MAQf,KAGP"}
+{"version":3,"file":"component.js","sources":["../../../../../src/select-box/options-window/component.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from \"react\";\nimport { useOptionsWindow } from \"../options-window\";\nimport { useIdContext } from \"../id/provider\";\nimport { IdGenerator } from \"../lib\";\n\nexport function OptionsArea() {\n  const id = useIdContext();\n  const { state, actions } = useOptionsWindow();\n  const [value, setValue] = useState(\"\");\n  const [selectingIndex, setSelectingIndex] = useState<number | undefined>(\n    undefined\n  );\n  const [position, setPosition] = useState({ top: 0, left: 0 });\n\n  const selectingValue = state.isOpen\n    ? state.options.length === 0\n      ? undefined\n      : typeof selectingIndex === \"number\" &&\n        selectingIndex < state.options.length &&\n        selectingIndex >= 0\n      ? state.options[selectingIndex].value\n      : undefined\n    : undefined;\n\n  useEffect(() => {\n    if (state.isOpen) {\n      const optionElement = document.getElementById(\n        IdGenerator.generateIdSelectBoxOption(id, selectingValue ?? \"\")\n      );\n\n      if (!optionElement) return;\n      if (position.top === 0 && position.left === 0) return;\n\n      optionElement.scrollIntoView({\n        behavior: \"smooth\",\n        block: \"nearest\",\n        inline: \"nearest\",\n      });\n    } else {\n      setSelectingIndex(undefined);\n    }\n  }, [state, position, selectingValue]);\n\n  useEffect(() => {\n    if (state.isOpen) {\n      const handleKeydown = (e: KeyboardEvent) => {\n        if (e.key === \"ArrowDown\") {\n          e.preventDefault();\n          setSelectingIndex((prev) =>\n            typeof prev === \"number\"\n              ? Math.min(prev + 1, state.options.length - 1)\n              : 0\n          );\n        } else if (e.key === \"ArrowUp\") {\n          e.preventDefault();\n          setSelectingIndex((prev) =>\n            typeof prev === \"number\" ? Math.max(prev - 1, 0) : 0\n          );\n        } else if (e.key === \"Enter\") {\n          e.preventDefault();\n          if (typeof selectingIndex === \"number\") {\n            if (\n              state.options.length === 0 ||\n              state.options.length <= selectingIndex\n            )\n              return;\n\n            const value = state.options[selectingIndex].value;\n\n            if (!value) return;\n\n            setValue(value);\n            state.onSelect(value);\n            actions.closeOptionsWindow();\n          }\n        }\n      };\n\n      document.addEventListener(\"keydown\", handleKeydown);\n\n      return () => {\n        document.removeEventListener(\"keydown\", handleKeydown);\n      };\n    }\n  }, [state, selectingIndex, setSelectingIndex]);\n\n  useEffect(() => {\n    const searchParentElement = () => {\n      if (state.isOpen) {\n        let parentElement = document.getElementById(\n          \"ReactUI:SelectBox:OptionsArea\"\n        );\n\n        while (parentElement) {\n          if (parentElement.className.includes(\"relative\")) {\n            break;\n          }\n\n          parentElement = parentElement.parentElement;\n        }\n\n        const selectBoxElement = document.getElementById(state.selectBoxId);\n\n        if (selectBoxElement) {\n          const rect = selectBoxElement.getBoundingClientRect();\n          let top = rect.top + rect.height;\n          let left = rect.left;\n\n          if (parentElement) {\n            const parentRect = parentElement.getBoundingClientRect();\n            setPosition({\n              top: top - parentRect.top,\n              left: left - parentRect.left,\n            });\n          } else {\n            setPosition({\n              top: top + window.scrollY,\n              left: left + window.scrollX,\n            });\n          }\n        }\n      }\n    };\n\n    const timer = setTimeout(searchParentElement, 0);\n\n    return () => {\n      clearTimeout(timer);\n    };\n  }, [state.isOpen]);\n\n  useEffect(() => {\n    const onClickOutOfSelectBox = (e: MouseEvent) => {\n      if (!state.isOpen) return;\n\n      // SelectBox関連の要素を取得\n      const frameElement = document.getElementById(state.selectBoxId);\n      const optionsElement = document.getElementById(\n        \"ReactUI:SelectBox:OptionsArea\"\n      );\n\n      // クリックされた要素を取得\n      const ele = e.target;\n\n      if (ele instanceof Node && frameElement?.contains(ele)) return;\n\n      if (ele instanceof Node && optionsElement?.contains(ele)) return;\n\n      actions.setSearchText(\"\");\n      actions.closeOptionsWindow();\n    };\n\n    document.addEventListener(\"mousedown\", onClickOutOfSelectBox);\n\n    return () => {\n      document.removeEventListener(\"mousedown\", onClickOutOfSelectBox);\n    };\n  }, [state.isOpen]);\n\n  if (!state.isOpen) return <></>;\n\n  return (\n    <div\n      id={\"ReactUI:SelectBox:OptionsArea\"}\n      className=\"absolute min-w-fit max-h-[40vh] overflow-auto border border-gray-300 z-10\"\n      style={position}\n    >\n      {state.options.map((option) => (\n        <div\n          id={IdGenerator.generateIdSelectBoxOption(id, option.value ?? \"\")}\n          className={`hover:bg-gray-200 px-2 py-1 ${\n            typeof selectingValue === \"string\"\n              ? selectingValue === option.value\n                ? \"bg-gray-100\"\n                : \"bg-white\"\n              : value === option.value\n              ? \"bg-gray-100\"\n              : \"bg-white\"\n          }`}\n          key={option.value}\n          onClick={() => {\n            state.onSelect(option.value);\n            actions.closeOptionsWindow();\n          }}\n        >\n          {option.searchLabel ?? option.label}\n        </div>\n      ))}\n    </div>\n  );\n}\n"],"names":["id","useIdContext","_a","useOptionsWindow","state","actions","_b","useState","value","setValue","_c","undefined","selectingIndex","setSelectingIndex","_d","top","left","position","setPosition","selectingValue","isOpen","options","length","useEffect","optionElement","document","getElementById","IdGenerator","generateIdSelectBoxOption","scrollIntoView","behavior","block","inline","handleKeydown_1","e","key","preventDefault","prev","Math","min","max","value_1","onSelect","closeOptionsWindow","addEventListener","removeEventListener","timer","setTimeout","parentElement","className","includes","selectBoxElement","selectBoxId","rect","getBoundingClientRect","top_1","height","parentRect","window","scrollY","scrollX","clearTimeout","onClickOutOfSelectBox","frameElement","optionsElement","ele","target","Node","contains","setSearchText","_jsx","style","map","option","jsx","concat","onClick","children","searchLabel","label"],"mappings":"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"}

package/dist/cjs/src/select-box/parts/input-area.js

@@ -1,3 +1,3 @@
 "use client";
-"use strict";var e=require("react/jsx-runtime"),n=require("react"),t=require("../id/provider.js"),o=require("../lib/id-generator.js"),r=require("../options-window/context.js");exports.InputArea=function(a){var i,u,s,c=t.useIdContext(),d=r.useOptionsWindow(),l=d.state,f=d.actions,p=n.useState(""),v=p[0],w=p[1],x=n.useMemo((function(){return a.options.filter((function(e){return e.searchText?e.searchText.toLowerCase().includes(v.toLowerCase()):e.searchLabel?e.searchLabel.toLowerCase().includes(v.toLowerCase()):e.label.toLowerCase().includes(v.toLowerCase())}))}),[a.options,v]);n.useEffect((function(){l.isOpen&&f.setSearchText(l.searchText)}),[l]),n.useEffect((function(){var e=function(e){if(l.isOpen){var n=document.getElementById(o.IdGenerator.generateIdSelectBoxFrame(a.id)),t=document.getElementById("ReactUI:SelectBox:OptionsArea"),r=e.target;r instanceof Node&&(null==n?void 0:n.contains(r))||r instanceof Node&&(null==t?void 0:t.contains(r))||(w(""),a.close())}};return document.addEventListener("mousedown",e),function(){document.removeEventListener("mousedown",e)}}),[l]),n.useEffect((function(){if(!l.isOpen){var e=document.getElementById(o.IdGenerator.generateIdSelectBoxInputArea(a.id));if(e){var n=function(e){"ArrowDown"===e.key&&(e.preventDefault(),a.open())};return e.addEventListener("keydown",n),function(){e.removeEventListener("keydown",n)}}}}),[l,x]);var m=null!==(u=null===(i=a.options.find((function(e){return e.value===a.value})))||void 0===i?void 0:i.label)&&void 0!==u?u:"";return e.jsx("input",{id:o.IdGenerator.generateIdSelectBoxInputArea(c),ref:a.inputRef,className:"px-2 py-1 ".concat(a.no_appearance?"no_appearance border-none focus:outline-none focus-visible:outline-none bg-transparent w-full":"border border-gray-300 w-full"),type:"text",placeholder:""===m?null!==(s=a.placeholder)&&void 0!==s?s:"選択してください":m,value:l.isOpen?l.searchText:m,onChange:function(e){e.preventDefault(),f.setSearchText(e.target.value)}})};
+"use strict";var e=require("react/jsx-runtime"),n=require("react"),t=require("../id/provider.js"),r=require("../lib/id-generator.js"),o=require("../options-window/context.js");exports.InputArea=function(a){var i,s,u,c=t.useIdContext(),l=o.useOptionsWindow(),d=l.state,p=l.actions,f=n.useMemo((function(){return d.isOpen?a.options.filter((function(e){return e.searchText?e.searchText.toLowerCase().includes(d.searchText.toLowerCase()):e.searchLabel?e.searchLabel.toLowerCase().includes(d.searchText.toLowerCase()):e.label.toLowerCase().includes(d.searchText.toLowerCase())})):[]}),[a.options,d]);n.useEffect((function(){d.isOpen&&p.setSearchText(d.searchText)}),[d]),n.useEffect((function(){if(!d.isOpen){var e=document.getElementById(r.IdGenerator.generateIdSelectBoxInputArea(a.id));if(e){var n=function(e){"ArrowDown"===e.key&&(e.preventDefault(),a.open())};return e.addEventListener("keydown",n),function(){e.removeEventListener("keydown",n)}}}}),[d,f]);var v=null!==(s=null===(i=a.options.find((function(e){return e.value===a.value})))||void 0===i?void 0:i.label)&&void 0!==s?s:"";return e.jsx("input",{id:r.IdGenerator.generateIdSelectBoxInputArea(c),ref:a.inputRef,className:"px-2 py-1 ".concat(a.no_appearance?"appearance-none border-none focus:outline-none focus-visible:outline-none bg-transparent w-full":"border border-gray-300 w-full"),type:"text",placeholder:""===v?null!==(u=a.placeholder)&&void 0!==u?u:"選択してください":v,value:d.isOpen?d.searchText:v,onChange:function(e){e.preventDefault(),p.setSearchText(e.target.value)}})};
 //# sourceMappingURL=input-area.js.map

package/dist/cjs/src/table/frame/frame.js

@@ -1,3 +1,3 @@
 "use client";
-"use strict";var e=require("react/jsx-runtime"),t=require("react"),r=require("../header/columns-width/context.js");require("../../../node_modules/tslib/tslib.es6.js");var n=require("../header/x-scroll-position/context.js");exports.Frame=function(o){var l=n.useScrollXPosition(),c=l.x,s=l.setScrollX,i=t.useRef(null),u=t.useState({scrollX:0,scrollY:0,barYHeight:0,barXWidth:0}),a=u[0],d=u[1],m=r.useColumnsWidthState();return t.useEffect((function(){var e=function(){if(i.current){s(i.current.scrollLeft);var e=i.current.scrollLeft/i.current.scrollWidth*100,t=i.current.scrollTop/i.current.scrollHeight*100,r=i.current.clientHeight/i.current.scrollHeight*100,n=i.current.clientWidth/i.current.scrollWidth*100;d({scrollX:e>100?100:e,scrollY:t>100?100:t,barYHeight:r>100?100:r,barXWidth:n>100?100:n})}};return e(),i.current&&i.current.addEventListener("scroll",e),function(){i.current&&i.current.removeEventListener("scroll",e)}}),[s,m]),t.useEffect((function(){i.current&&(i.current.scrollLeft=c)}),[c]),e.jsxs("div",{className:"relative",style:{maxHeight:o.maxHeight,maxWidth:o.maxWidth},children:[e.jsx("div",{ref:i,id:o.id,className:"relative w-full h-full border border-gray-200 bg-white rounded-b-md overflow-auto ".concat(o.displayScroll?"":"no_scrollbar"),style:{maxHeight:o.maxHeight,maxWidth:o.maxWidth},children:o.children}),a.barYHeight<100&&e.jsxs(e.Fragment,{children:[e.jsx("div",{className:"absolute top-0 right-0 h-full w-2 bg-slate-200 opacity-30 pointer-events-none"}),e.jsx("div",{className:"absolute right-0 w-2 bg-slate-500 rounded-full cursor-grab active:cursor-grabbing",style:{top:"".concat(a.scrollY,"%"),height:"".concat(a.barYHeight,"%")},onMouseDown:function(e){var t,r=e.clientY,n=(null===(t=i.current)||void 0===t?void 0:t.scrollTop)||0,o=function(e){if(i.current){var t=(e.clientY-r)/a.barYHeight*100;i.current.scrollTop=n+t}},l=function(){document.removeEventListener("mousemove",o),document.removeEventListener("mouseup",l)};document.addEventListener("mousemove",o),document.addEventListener("mouseup",l)}})]}),a.barXWidth<100&&e.jsxs(e.Fragment,{children:[e.jsx("div",{className:"absolute bottom-0 left-0 w-full h-2 bg-slate-200 opacity-30 pointer-events-none"}),e.jsx("div",{className:"absolute bottom-0 h-2 bg-slate-500 rounded-full cursor-grab active:cursor-grabbing",style:{left:"".concat(a.scrollX,"%"),width:"".concat(a.barXWidth,"%")},onMouseDown:function(e){var t;e.preventDefault(),e.stopPropagation();var r=e.clientX,n=(null===(t=i.current)||void 0===t?void 0:t.scrollLeft)||0,o=function(t){if(i.current){e.preventDefault(),e.stopPropagation();var o=(t.clientX-r)/a.barXWidth*100;i.current.scrollLeft=n+o}},l=function(){document.removeEventListener("mousemove",o),document.removeEventListener("mouseup",l)};document.addEventListener("mousemove",o),document.addEventListener("mouseup",l)}})]})]})};
+"use strict";var e=require("react/jsx-runtime"),t=require("react"),r=require("../header/columns-width/context.js");require("../../../node_modules/tslib/tslib.es6.js");var n=require("../header/x-scroll-position/context.js");exports.Frame=function(o){var l=n.useScrollXPosition(),s=l.x,c=l.setScrollX,i=t.useRef(null),u=t.useState({scrollX:0,scrollY:0,barYHeight:0,barXWidth:0}),a=u[0],d=u[1],m=r.useColumnsWidthState();return t.useEffect((function(){var e=function(){if(i.current){c(i.current.scrollLeft);var e=i.current.scrollLeft/i.current.scrollWidth*100,t=i.current.scrollTop/i.current.scrollHeight*100,r=i.current.clientHeight/i.current.scrollHeight*100,n=i.current.clientWidth/i.current.scrollWidth*100;d({scrollX:e>100?100:e,scrollY:t>100?100:t,barYHeight:r>100?100:r,barXWidth:n>100?100:n})}};return e(),i.current&&i.current.addEventListener("scroll",e),function(){i.current&&i.current.removeEventListener("scroll",e)}}),[c,m]),t.useEffect((function(){i.current&&(i.current.scrollLeft=s)}),[s]),e.jsxs("div",{className:"relative",style:{maxHeight:o.maxHeight,maxWidth:o.maxWidth},children:[e.jsx("style",{children:"\n          .teppen-no-scrollbar {\n            -ms-overflow-style: none;\n            scrollbar-width: none;\n          }\n          .teppen-no-scrollbar::-webkit-scrollbar {\n            display: none;\n          }\n        "}),e.jsx("div",{ref:i,id:o.id,className:"relative w-full h-full border border-gray-200 bg-white rounded-b-md overflow-auto ".concat(o.displayScroll?"":"teppen-no-scrollbar"),style:{maxHeight:o.maxHeight,maxWidth:o.maxWidth},children:o.children}),a.barYHeight<100&&e.jsxs(e.Fragment,{children:[e.jsx("div",{className:"absolute top-0 right-0 h-full w-2 bg-slate-200 opacity-30 pointer-events-none"}),e.jsx("div",{className:"absolute right-0 w-2 bg-slate-500 rounded-full cursor-grab active:cursor-grabbing",style:{top:"".concat(a.scrollY,"%"),height:"".concat(a.barYHeight,"%")},onMouseDown:function(e){var t,r=e.clientY,n=(null===(t=i.current)||void 0===t?void 0:t.scrollTop)||0,o=function(e){if(i.current){var t=(e.clientY-r)/a.barYHeight*100;i.current.scrollTop=n+t}},l=function(){document.removeEventListener("mousemove",o),document.removeEventListener("mouseup",l)};document.addEventListener("mousemove",o),document.addEventListener("mouseup",l)}})]}),a.barXWidth<100&&e.jsxs(e.Fragment,{children:[e.jsx("div",{className:"absolute bottom-0 left-0 w-full h-2 bg-slate-200 opacity-30 pointer-events-none"}),e.jsx("div",{className:"absolute bottom-0 h-2 bg-slate-500 rounded-full cursor-grab active:cursor-grabbing",style:{left:"".concat(a.scrollX,"%"),width:"".concat(a.barXWidth,"%")},onMouseDown:function(e){var t;e.preventDefault(),e.stopPropagation();var r=e.clientX,n=(null===(t=i.current)||void 0===t?void 0:t.scrollLeft)||0,o=function(t){if(i.current){e.preventDefault(),e.stopPropagation();var o=(t.clientX-r)/a.barXWidth*100;i.current.scrollLeft=n+o}},l=function(){document.removeEventListener("mousemove",o),document.removeEventListener("mouseup",l)};document.addEventListener("mousemove",o),document.addEventListener("mouseup",l)}})]})]})};
 //# sourceMappingURL=frame.js.map

package/dist/cjs/src/table/header/header-v2.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("react/jsx-runtime"),t=require("react"),r=require("./columns-width/context.js");require("../../../node_modules/tslib/tslib.es6.js");var i=require("./header-v2-hook.js"),l=require("../checkbox/components.js"),s=require("../../search-bar/condition-search-bar/base.js"),a=require("../id/provider.js"),n=require("../filter-v2/context.js");var o=t.memo((function(r){var l=t.useRef(null),s=i.useResizeColWidthHook(r.keyName).onMouseDownResizeWidth,a=l.current?r.colWidth-l.current.clientWidth:r.colWidth;return e.jsxs("div",{className:"relative",style:{width:r.colWidth,maxWidth:r.colWidth,minWidth:r.colWidth},children:[e.jsxs("div",{className:"flex justify-between items-center bg-gray-200 text-gray-600 h-[32px]",children:[e.jsx("div",{className:"px-2",style:{maxWidth:a},children:r.label&&e.jsx("p",{className:"text-left font-bold text-nowrap overflow-hidden text-ellipsis",children:r.label})}),e.jsx("div",{ref:l,className:"flex items-center w-fit shrink-0 gap-1 px-1",children:!r.disableSort&&r.generateSortButton&&r.generateSortButton(r.keyName)})]}),e.jsx("div",{className:"absolute top-0 right-0 grid place-items-end py-1 w-[4px] h-full cursor-col-resize",onMouseDown:s,children:e.jsx("div",{className:"w-[1px] h-full bg-white"})})]})}));exports.TableHeader=function(c){var d=a.useTableIdGenerator(),u=r.useColumnsWidthState().getColumnWidth,h=n.useFilter(),x=h.conditions,m=h.addFilter,b=h.removeFilter,f=i.useScrollXRef();t.useEffect((function(){if(f.current){var e=f.current,t=function(t){0!==t.deltaY&&(t.preventDefault(),e.scrollLeft+=t.deltaY)};return e.addEventListener("wheel",t),function(){e.removeEventListener("wheel",t)}}}),[f]);var p=t.useCallback((function(e){switch(e.type){case"add":m(e.payload.condition);break;case"remove":b(e.payload.index)}}),[]),v=t.useMemo((function(){return c.cols.filter((function(e){return!!e.label&&(e.editable||!e.editable&&!e.render)})).map((function(e){switch(e.type){case"string":case"number":return{key:e.key.toString(),label:e.label,type:e.type};case"select":return{key:e.key.toString(),label:e.label,type:e.type,options:e.options}}}))}),[c.cols]);return e.jsxs("div",{className:"border-gray-200 bg-gray-200 text-gray-600 rounded-t-md",style:{maxWidth:c.maxWidth},children:[e.jsx("div",{className:"py-2 px-2",children:e.jsx(s.ConditionSearchBar,{id:d.getTableHeaderId(),targets:v,conditions:x,onChangeCondition:p,size:"small"})}),e.jsx("div",{ref:f,className:"relative max-w-full overflow-x-auto no_scrollbar",children:e.jsxs("div",{className:"flex h-[32px]",children:[c.checkbox&&e.jsx("th",{className:"w-8 h-full",children:e.jsx(l.AllCheckbox,{rows:c.rows})}),c.cols.map((function(t){return e.jsx(o,{keyName:t.key.toString(),label:t.label,colWidth:u(t.key),disableSort:t.disableSort||!t.editable&&!!t.render,generateSortButton:c.generateSortButton},t.key.toString())}))]})})]})};
+"use strict";var e=require("react/jsx-runtime"),t=require("react"),r=require("./columns-width/context.js");require("../../../node_modules/tslib/tslib.es6.js");var l=require("./header-v2-hook.js"),n=require("../checkbox/components.js"),s=require("../../search-bar/condition-search-bar/base.js"),i=require("../id/provider.js"),a=require("../filter-v2/context.js");var o=t.memo((function(r){var n=t.useRef(null),s=l.useResizeColWidthHook(r.keyName).onMouseDownResizeWidth,i=n.current?r.colWidth-n.current.clientWidth:r.colWidth;return e.jsxs("div",{className:"relative",style:{width:r.colWidth,maxWidth:r.colWidth,minWidth:r.colWidth},children:[e.jsxs("div",{className:"flex justify-between items-center bg-gray-200 text-gray-600 h-[32px]",children:[e.jsx("div",{className:"px-2",style:{maxWidth:i},children:r.label&&e.jsx("p",{className:"text-left font-bold text-nowrap overflow-hidden text-ellipsis",children:r.label})}),e.jsx("div",{ref:n,className:"flex items-center w-fit shrink-0 gap-1 px-1",children:!r.disableSort&&r.generateSortButton&&r.generateSortButton(r.keyName)})]}),e.jsx("div",{className:"absolute top-0 right-0 grid place-items-end py-1 w-[4px] h-full cursor-col-resize",onMouseDown:s,children:e.jsx("div",{className:"w-[1px] h-full bg-white"})})]})}));exports.TableHeader=function(c){var d=i.useTableIdGenerator(),u=r.useColumnsWidthState().getColumnWidth,h=a.useFilter(),x=h.conditions,b=h.addFilter,m=h.removeFilter,p=l.useScrollXRef();t.useEffect((function(){if(p.current){var e=p.current,t=function(t){0!==t.deltaY&&(t.preventDefault(),e.scrollLeft+=t.deltaY)};return e.addEventListener("wheel",t),function(){e.removeEventListener("wheel",t)}}}),[p]);var f=t.useCallback((function(e){switch(e.type){case"add":b(e.payload.condition);break;case"remove":m(e.payload.index)}}),[]),y=t.useMemo((function(){return c.cols.filter((function(e){return!!e.label&&(e.editable||!e.editable&&!e.render)})).map((function(e){switch(e.type){case"string":case"number":return{key:e.key.toString(),label:e.label,type:e.type};case"select":return{key:e.key.toString(),label:e.label,type:e.type,options:e.options}}}))}),[c.cols]);return e.jsxs("div",{className:"border-gray-200 bg-gray-200 text-gray-600 rounded-t-md",style:{maxWidth:c.maxWidth},children:[e.jsx("div",{className:"py-2 px-2",children:e.jsx(s.ConditionSearchBar,{id:d.getTableHeaderId(),targets:y,conditions:x,onChangeCondition:f,size:"small"})}),e.jsx("style",{children:"\n          .teppen-no-scrollbar {\n            -ms-overflow-style: none;\n            scrollbar-width: none;\n          }\n          .teppen-no-scrollbar::-webkit-scrollbar {\n            display: none;\n          }\n        "}),e.jsx("div",{ref:p,className:"relative max-w-full overflow-x-auto teppen-no-scrollbar",children:e.jsxs("div",{className:"flex h-[32px]",children:[c.checkbox&&e.jsx("th",{className:"w-8 h-full",children:e.jsx(n.AllCheckbox,{rows:c.rows})}),c.cols.map((function(t){return e.jsx(o,{keyName:t.key.toString(),label:t.label,colWidth:u(t.key),disableSort:t.disableSort||!t.editable&&!!t.render,generateSortButton:c.generateSortButton},t.key.toString())}))]})})]})};
 //# sourceMappingURL=header-v2.js.map

package/dist/cjs/src/table/header/header-v2.js.map

@@ -1 +1 @@
-{"version":3,"file":"header-v2.js","sources":["../../../../../src/table/header/header-v2.tsx"],"sourcesContent":["import { memo, useCallback, useEffect, useMemo, useRef } from \"react\";\nimport { DataObject, DataRecord, TTableColumn } from \"../table/type\";\nimport { useColumnsWidthState } from \"./columns-width\";\nimport { useResizeColWidthHook, useScrollXRef } from \"./header-v2-hook\";\nimport { AllCheckbox } from \"../checkbox/components\";\nimport { ConditionSearchBar } from \"../../search-bar\";\nimport { useTableIdGenerator } from \"../id\";\nimport { useFilter } from \"../filter-v2\";\nimport { TConditionChangeAction } from \"../../search-bar/condition-search-bar/condition-input-management/type\";\n\ninterface IPropsTableHeader<T extends DataRecord> {\n  cols: TTableColumn<T>[];\n  checkbox?: boolean;\n  rows: DataObject<T>[];\n  maxWidth?: string;\n  generateSortButton?: (columnKey: string) => React.ReactNode;\n}\n\nexport function TableHeader<T extends DataRecord>(props: IPropsTableHeader<T>) {\n  const idGenerator = useTableIdGenerator();\n  const { getColumnWidth } = useColumnsWidthState();\n  const { conditions, addFilter, removeFilter } = useFilter();\n  const ref = useScrollXRef();\n\n  useEffect(() => {\n    if (ref.current) {\n      const element = ref.current;\n\n      const scrollX = (e: WheelEvent) => {\n        if (e.deltaY === 0) return;\n\n        e.preventDefault();\n        element.scrollLeft += e.deltaY;\n      };\n\n      element.addEventListener(\"wheel\", scrollX);\n\n      return () => {\n        element.removeEventListener(\"wheel\", scrollX);\n      };\n    }\n  }, [ref]);\n\n  const onChangeCondition = useCallback((action: TConditionChangeAction) => {\n    switch (action.type) {\n      case \"add\":\n        addFilter(action.payload.condition);\n        break;\n      case \"remove\":\n        removeFilter(action.payload.index);\n        break;\n    }\n  }, []);\n\n  const targets = useMemo(() => {\n    return props.cols\n      .filter(\n        (col) => !!col.label && (col.editable || (!col.editable && !col.render))\n      )\n      .map((col) => {\n        switch (col.type) {\n          case \"string\":\n            return {\n              key: col.key.toString(),\n              label: col.label as string,\n              type: col.type,\n            };\n          case \"number\":\n            return {\n              key: col.key.toString(),\n              label: col.label as string,\n              type: col.type,\n            };\n          case \"select\":\n            return {\n              key: col.key.toString(),\n              label: col.label as string,\n              type: col.type,\n              options: col.options,\n            };\n        }\n      });\n  }, [props.cols]);\n\n  return (\n    <div\n      className=\"border-gray-200 bg-gray-200 text-gray-600 rounded-t-md\"\n      style={{ maxWidth: props.maxWidth }}\n    >\n      <div className=\"py-2 px-2\">\n        <ConditionSearchBar\n          id={idGenerator.getTableHeaderId()}\n          targets={targets}\n          conditions={conditions}\n          onChangeCondition={onChangeCondition}\n          size=\"small\"\n        />\n      </div>\n\n      <div\n        ref={ref}\n        className=\"relative max-w-full overflow-x-auto no_scrollbar\"\n      >\n        <div className=\"flex h-[32px]\">\n          {props.checkbox && (\n            <th className=\"w-8 h-full\">\n              <AllCheckbox rows={props.rows} />\n            </th>\n          )}\n          {props.cols.map((col) => {\n            return (\n              <HeaderElement\n                key={col.key.toString()}\n                keyName={col.key.toString()}\n                label={col.label}\n                colWidth={getColumnWidth(col.key as string)}\n                disableSort={col.disableSort || (!col.editable && !!col.render)}\n                generateSortButton={props.generateSortButton}\n              />\n            );\n          })}\n        </div>\n      </div>\n    </div>\n  );\n}\n\ninterface IPropsHeaderElement {\n  keyName: string;\n  label?: string;\n  colWidth: number;\n  disableSort?: boolean;\n  generateSortButton?: (columnKey: string) => React.ReactNode;\n}\n\nconst HeaderElement = memo(function HE(props: IPropsHeaderElement) {\n  const ref = useRef<HTMLDivElement>(null);\n  const { onMouseDownResizeWidth } = useResizeColWidthHook(props.keyName);\n\n  const maxWidthLabel = ref.current\n    ? props.colWidth - ref.current.clientWidth\n    : props.colWidth;\n\n  return (\n    <div\n      className=\"relative\"\n      style={{\n        width: props.colWidth,\n        maxWidth: props.colWidth,\n        minWidth: props.colWidth,\n      }}\n    >\n      <div\n        className={`flex justify-between items-center bg-gray-200 text-gray-600 h-[32px]`}\n      >\n        <div className=\"px-2\" style={{ maxWidth: maxWidthLabel }}>\n          {props.label && (\n            <p\n              className={`text-left font-bold text-nowrap overflow-hidden text-ellipsis`}\n            >\n              {props.label}\n            </p>\n          )}\n        </div>\n\n        <div ref={ref} className=\"flex items-center w-fit shrink-0 gap-1 px-1\">\n          {!props.disableSort &&\n            props.generateSortButton &&\n            props.generateSortButton(props.keyName)}\n        </div>\n      </div>\n      <div\n        className=\"absolute top-0 right-0 grid place-items-end py-1 w-[4px] h-full cursor-col-resize\"\n        onMouseDown={onMouseDownResizeWidth}\n      >\n        <div className={`w-[1px] h-full bg-white`} />\n      </div>\n    </div>\n  );\n});\n"],"names":["HeaderElement","memo","props","ref","useRef","onMouseDownResizeWidth","useResizeColWidthHook","keyName","maxWidthLabel","current","colWidth","clientWidth","_jsxs","jsxs","className","style","width","maxWidth","minWidth","children","_jsx","jsx","label","disableSort","generateSortButton","onMouseDown","idGenerator","useTableIdGenerator","getColumnWidth","useColumnsWidthState","_a","useFilter","conditions","addFilter","removeFilter","useScrollXRef","useEffect","element_1","scrollX_1","e","deltaY","preventDefault","scrollLeft","addEventListener","removeEventListener","onChangeCondition","useCallback","action","type","payload","condition","index","targets","useMemo","cols","filter","col","editable","render","map","key","toString","options","ConditionSearchBar","id","getTableHeaderId","size","checkbox","AllCheckbox","rows"],"mappings":"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"}
+{"version":3,"file":"header-v2.js","sources":["../../../../../src/table/header/header-v2.tsx"],"sourcesContent":["import { memo, useCallback, useEffect, useMemo, useRef } from \"react\";\nimport { DataObject, DataRecord, TTableColumn } from \"../table/type\";\nimport { useColumnsWidthState } from \"./columns-width\";\nimport { useResizeColWidthHook, useScrollXRef } from \"./header-v2-hook\";\nimport { AllCheckbox } from \"../checkbox/components\";\nimport { ConditionSearchBar } from \"../../search-bar\";\nimport { useTableIdGenerator } from \"../id\";\nimport { useFilter } from \"../filter-v2\";\nimport { TConditionChangeAction } from \"../../search-bar/condition-search-bar/condition-input-management/type\";\n\ninterface IPropsTableHeader<T extends DataRecord> {\n  cols: TTableColumn<T>[];\n  checkbox?: boolean;\n  rows: DataObject<T>[];\n  maxWidth?: string;\n  generateSortButton?: (columnKey: string) => React.ReactNode;\n}\n\nexport function TableHeader<T extends DataRecord>(props: IPropsTableHeader<T>) {\n  const idGenerator = useTableIdGenerator();\n  const { getColumnWidth } = useColumnsWidthState();\n  const { conditions, addFilter, removeFilter } = useFilter();\n  const ref = useScrollXRef();\n\n  useEffect(() => {\n    if (ref.current) {\n      const element = ref.current;\n\n      const scrollX = (e: WheelEvent) => {\n        if (e.deltaY === 0) return;\n\n        e.preventDefault();\n        element.scrollLeft += e.deltaY;\n      };\n\n      element.addEventListener(\"wheel\", scrollX);\n\n      return () => {\n        element.removeEventListener(\"wheel\", scrollX);\n      };\n    }\n  }, [ref]);\n\n  const onChangeCondition = useCallback((action: TConditionChangeAction) => {\n    switch (action.type) {\n      case \"add\":\n        addFilter(action.payload.condition);\n        break;\n      case \"remove\":\n        removeFilter(action.payload.index);\n        break;\n    }\n  }, []);\n\n  const targets = useMemo(() => {\n    return props.cols\n      .filter(\n        (col) => !!col.label && (col.editable || (!col.editable && !col.render))\n      )\n      .map((col) => {\n        switch (col.type) {\n          case \"string\":\n            return {\n              key: col.key.toString(),\n              label: col.label as string,\n              type: col.type,\n            };\n          case \"number\":\n            return {\n              key: col.key.toString(),\n              label: col.label as string,\n              type: col.type,\n            };\n          case \"select\":\n            return {\n              key: col.key.toString(),\n              label: col.label as string,\n              type: col.type,\n              options: col.options,\n            };\n        }\n      });\n  }, [props.cols]);\n\n  return (\n    <div\n      className=\"border-gray-200 bg-gray-200 text-gray-600 rounded-t-md\"\n      style={{ maxWidth: props.maxWidth }}\n    >\n      <div className=\"py-2 px-2\">\n        <ConditionSearchBar\n          id={idGenerator.getTableHeaderId()}\n          targets={targets}\n          conditions={conditions}\n          onChangeCondition={onChangeCondition}\n          size=\"small\"\n        />\n      </div>\n\n      <style>{`\n          .teppen-no-scrollbar {\n            -ms-overflow-style: none;\n            scrollbar-width: none;\n          }\n          .teppen-no-scrollbar::-webkit-scrollbar {\n            display: none;\n          }\n        `}</style>\n      <div\n        ref={ref}\n        className=\"relative max-w-full overflow-x-auto teppen-no-scrollbar\"\n      >\n        <div className=\"flex h-[32px]\">\n          {props.checkbox && (\n            <th className=\"w-8 h-full\">\n              <AllCheckbox rows={props.rows} />\n            </th>\n          )}\n          {props.cols.map((col) => {\n            return (\n              <HeaderElement\n                key={col.key.toString()}\n                keyName={col.key.toString()}\n                label={col.label}\n                colWidth={getColumnWidth(col.key as string)}\n                disableSort={col.disableSort || (!col.editable && !!col.render)}\n                generateSortButton={props.generateSortButton}\n              />\n            );\n          })}\n        </div>\n      </div>\n    </div>\n  );\n}\n\ninterface IPropsHeaderElement {\n  keyName: string;\n  label?: string;\n  colWidth: number;\n  disableSort?: boolean;\n  generateSortButton?: (columnKey: string) => React.ReactNode;\n}\n\nconst HeaderElement = memo(function HE(props: IPropsHeaderElement) {\n  const ref = useRef<HTMLDivElement>(null);\n  const { onMouseDownResizeWidth } = useResizeColWidthHook(props.keyName);\n\n  const maxWidthLabel = ref.current\n    ? props.colWidth - ref.current.clientWidth\n    : props.colWidth;\n\n  return (\n    <div\n      className=\"relative\"\n      style={{\n        width: props.colWidth,\n        maxWidth: props.colWidth,\n        minWidth: props.colWidth,\n      }}\n    >\n      <div\n        className={`flex justify-between items-center bg-gray-200 text-gray-600 h-[32px]`}\n      >\n        <div className=\"px-2\" style={{ maxWidth: maxWidthLabel }}>\n          {props.label && (\n            <p\n              className={`text-left font-bold text-nowrap overflow-hidden text-ellipsis`}\n            >\n              {props.label}\n            </p>\n          )}\n        </div>\n\n        <div ref={ref} className=\"flex items-center w-fit shrink-0 gap-1 px-1\">\n          {!props.disableSort &&\n            props.generateSortButton &&\n            props.generateSortButton(props.keyName)}\n        </div>\n      </div>\n      <div\n        className=\"absolute top-0 right-0 grid place-items-end py-1 w-[4px] h-full cursor-col-resize\"\n        onMouseDown={onMouseDownResizeWidth}\n      >\n        <div className={`w-[1px] h-full bg-white`} />\n      </div>\n    </div>\n  );\n});\n"],"names":["HeaderElement","memo","props","ref","useRef","onMouseDownResizeWidth","useResizeColWidthHook","keyName","maxWidthLabel","current","colWidth","clientWidth","_jsxs","jsxs","className","style","width","maxWidth","minWidth","children","_jsx","jsx","label","disableSort","generateSortButton","onMouseDown","idGenerator","useTableIdGenerator","getColumnWidth","useColumnsWidthState","_a","useFilter","conditions","addFilter","removeFilter","useScrollXRef","useEffect","element_1","scrollX_1","e","deltaY","preventDefault","scrollLeft","addEventListener","removeEventListener","onChangeCondition","useCallback","action","type","payload","condition","index","targets","useMemo","cols","filter","col","editable","render","map","key","toString","options","ConditionSearchBar","id","getTableHeaderId","size","checkbox","AllCheckbox","rows"],"mappings":"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"}

package/dist/esm/src/search-bar/condition-search-bar/base.js

@@ -1,3 +1,3 @@
 "use client";
-import{jsx as e,jsxs as t}from"react/jsx-runtime";import{memo as r,useRef as i,useEffect as n}from"react";import{SelectBoxProvider as o}from"../../select-box/provider.js";import"../id-generator/context.js";import{IdGeneratorProvider as s}from"../id-generator/provider.js";import{ConditionInputProvider as l}from"./condition-input-management/provider.js";import"./condition-input-management/context.js";import{ConditionList as a}from"./condition-list.js";import{SearchBarInputForm as c}from"./input-form.js";import{BiSearchAlt as d}from"../../../node_modules/react-icons/bi/index.js";var m=r((function(t){return e(o,{children:e(s,{id:t.id,children:e(l,{targets:t.targets,onChangeCondition:t.onChangeCondition,children:e(f,{size:t.size,conditions:t.conditions})})})})}));function f(r){var o=i(null);return n((function(){if(o.current){var e=o.current,t=function(t){0!==t.deltaY&&(t.preventDefault(),e.scrollLeft+=t.deltaY)};return e.addEventListener("wheel",t),function(){e.removeEventListener("wheel",t)}}}),[o]),t("div",{className:"flex items-center gap-1 w-full px-2 py-1 bg-white border border-slate-700 rounded-md text-gray-800 ".concat("small"===r.size?"text-sm":"large"===r.size?"text-lg":""),children:[e("div",{className:"px-2",children:e(d,{className:"text-slate-600"})}),t("div",{ref:o,className:"relative flex w-full items-center gap-1 overflow-x-auto no_scrollbar",children:[e(a,{conditions:r.conditions}),e("div",{className:"flex items-center min-w-64 w-full",children:e(c,{size:r.size})})]})]})}export{m as ConditionSearchBar,f as SearchBar};
+import{jsx as e,jsxs as n}from"react/jsx-runtime";import{memo as t,useRef as r,useEffect as i}from"react";import{SelectBoxProvider as o}from"../../select-box/provider.js";import"../id-generator/context.js";import{IdGeneratorProvider as l}from"../id-generator/provider.js";import{ConditionInputProvider as s}from"./condition-input-management/provider.js";import"./condition-input-management/context.js";import{ConditionList as a}from"./condition-list.js";import{SearchBarInputForm as c}from"./input-form.js";import{BiSearchAlt as d}from"../../../node_modules/react-icons/bi/index.js";var m=t((function(n){return e(o,{children:e(l,{id:n.id,children:e(s,{targets:n.targets,onChangeCondition:n.onChangeCondition,children:e(p,{size:n.size,conditions:n.conditions})})})})}));function p(t){var o=r(null);return i((function(){if(o.current){var e=o.current,n=function(n){0!==n.deltaY&&(n.preventDefault(),e.scrollLeft+=n.deltaY)};return e.addEventListener("wheel",n),function(){e.removeEventListener("wheel",n)}}}),[o]),n("div",{className:"flex items-center gap-1 w-full px-2 py-1 bg-white border border-slate-700 rounded-md text-gray-800 ".concat("small"===t.size?"text-sm":"large"===t.size?"text-lg":""),children:[e("div",{className:"px-2",children:e(d,{className:"text-slate-600"})}),n("div",{ref:o,className:"relative flex w-full items-center gap-1 overflow-x-auto teppen-no-scrollbar",children:[e("style",{children:"\n          .teppen-no-scrollbar {\n            -ms-overflow-style: none;\n            scrollbar-width: none;\n          }\n          .teppen-no-scrollbar::-webkit-scrollbar {\n            display: none;\n          }\n        "}),e(a,{conditions:t.conditions}),e("div",{className:"flex items-center min-w-64 w-full",children:e(c,{size:t.size})})]})]})}export{m as ConditionSearchBar,p as SearchBar};
 //# sourceMappingURL=base.js.map

package/dist/esm/src/search-bar/condition-search-bar/condition-input-management/hook.js

@@ -1,2 +1,2 @@
-import{useReducer as t,useMemo as e}from"react";import{conditionInputReducer as n}from"./reducer.js";var r=function(r,o){var a=t(n,{targets:r,onChangeCondition:o,status:"waiting for input"}),p=a[0],i=a[1],u=e((function(){return{inputTarget:function(t){i({type:"inputTarget",payload:{targetKey:t}})},inputOperator:function(t){i({type:"inputOperator",payload:{operatorKey:t}})},inputValue:function(t){i({type:"inputValue",payload:t})},deleteCondition:function(t){i({type:"deleteCondition",payload:{index:t}})},reset:function(){i({type:"reset"})},updateTargets:function(t){i({type:"updateTargets",payload:{targets:t}})},removeInputedTarget:function(){i({type:"removeInputedTarget"})},removeInputedOperator:function(){i({type:"removeInputedOperator"})}}}),[]);return{state:p,actions:u}};export{r as useConditionInputHook};
+import{useReducer as t,useEffect as e,useMemo as n}from"react";import{conditionInputReducer as o}from"./reducer.js";var r=function(r,a){var p=t(o,{targets:r,status:"waiting for input"}),i=p[0],u=p[1];e((function(){i.changeAction&&(a(i.changeAction),u({type:"executedChangeAction"}))}),[i.changeAction]);var c=n((function(){return{inputTarget:function(t){u({type:"inputTarget",payload:{targetKey:t}})},inputOperator:function(t){u({type:"inputOperator",payload:{operatorKey:t}})},inputValue:function(t){u({type:"inputValue",payload:t})},deleteCondition:function(t){u({type:"deleteCondition",payload:{index:t}})},reset:function(){u({type:"reset"})},updateTargets:function(t){u({type:"updateTargets",payload:{targets:t}})},removeInputedTarget:function(){u({type:"removeInputedTarget"})},removeInputedOperator:function(){u({type:"removeInputedOperator"})}}}),[]);return{state:i,actions:c}};export{r as useConditionInputHook};
 //# sourceMappingURL=hook.js.map

package/dist/esm/src/search-bar/condition-search-bar/condition-input-management/hook.js.map

@@ -1 +1 @@
-{"version":3,"file":"hook.js","sources":["../../../../../../src/search-bar/condition-search-bar/condition-input-management/hook.ts"],"sourcesContent":["import { useMemo, useReducer } from \"react\";\nimport { SearchInput, Target, TConditionInputHook } from \"./type\";\nimport { conditionInputReducer } from \"./reducer\";\n\nexport const useConditionInputHook: TConditionInputHook = (\n  targets,\n  onChangeCondition\n) => {\n  const [state, dispatch] = useReducer(conditionInputReducer, {\n    targets,\n    onChangeCondition,\n    status: \"waiting for input\",\n  });\n\n  const actions = useMemo(\n    () => ({\n      inputTarget: (targetKey: string) => {\n        dispatch({ type: \"inputTarget\", payload: { targetKey } });\n      },\n      inputOperator: (operatorKey: string) => {\n        dispatch({ type: \"inputOperator\", payload: { operatorKey } });\n      },\n      inputValue: (value: SearchInput) => {\n        dispatch({ type: \"inputValue\", payload: value });\n      },\n      deleteCondition: (index: number) => {\n        dispatch({ type: \"deleteCondition\", payload: { index } });\n      },\n      reset: () => {\n        dispatch({ type: \"reset\" });\n      },\n      updateTargets: (targets: Target[]) => {\n        dispatch({ type: \"updateTargets\", payload: { targets } });\n      },\n      removeInputedTarget: () => {\n        dispatch({ type: \"removeInputedTarget\" });\n      },\n      removeInputedOperator: () => {\n        dispatch({ type: \"removeInputedOperator\" });\n      },\n    }),\n    []\n  );\n\n  return {\n    state,\n    actions,\n  };\n};\n"],"names":["useConditionInputHook","targets","onChangeCondition","_a","useReducer","conditionInputReducer","status","state","dispatch","actions","useMemo","inputTarget","targetKey","type","payload","inputOperator","operatorKey","inputValue","value","deleteCondition","index","reset","updateTargets","removeInputedTarget","removeInputedOperator"],"mappings":"qGAIa,IAAAA,EAA6C,SACxDC,EACAC,GAEM,IAAAC,EAAoBC,EAAWC,EAAuB,CAC1DJ,QAAOA,EACPC,kBAAiBA,EACjBI,OAAQ,sBAHHC,EAAKJ,EAAA,GAAEK,OAMRC,EAAUC,GACd,WAAM,MAAC,CACLC,YAAa,SAACC,GACZJ,EAAS,CAAEK,KAAM,cAAeC,QAAS,CAAEF,UAASA,IACrD,EACDG,cAAe,SAACC,GACdR,EAAS,CAAEK,KAAM,gBAAiBC,QAAS,CAAEE,YAAWA,IACzD,EACDC,WAAY,SAACC,GACXV,EAAS,CAAEK,KAAM,aAAcC,QAASI,GACzC,EACDC,gBAAiB,SAACC,GAChBZ,EAAS,CAAEK,KAAM,kBAAmBC,QAAS,CAAEM,MAAKA,IACrD,EACDC,MAAO,WACLb,EAAS,CAAEK,KAAM,SAClB,EACDS,cAAe,SAACrB,GACdO,EAAS,CAAEK,KAAM,gBAAiBC,QAAS,CAAEb,QAAOA,IACrD,EACDsB,oBAAqB,WACnBf,EAAS,CAAEK,KAAM,uBAClB,EACDW,sBAAuB,WACrBhB,EAAS,CAAEK,KAAM,yBAClB,EAxBG,GA0BN,IAGF,MAAO,CACLN,MAAKA,EACLE,QAAOA,EAEX"}
+{"version":3,"file":"hook.js","sources":["../../../../../../src/search-bar/condition-search-bar/condition-input-management/hook.ts"],"sourcesContent":["import { useEffect, useMemo, useReducer } from \"react\";\nimport { SearchInput, Target, TConditionInputHook } from \"./type\";\nimport { conditionInputReducer } from \"./reducer\";\n\nexport const useConditionInputHook: TConditionInputHook = (\n  targets,\n  onChangeCondition\n) => {\n  const [state, dispatch] = useReducer(conditionInputReducer, {\n    targets,\n    status: \"waiting for input\",\n  });\n\n  useEffect(() => {\n    if (state.changeAction) {\n      onChangeCondition(state.changeAction);\n      dispatch({ type: \"executedChangeAction\" });\n    }\n  }, [state.changeAction]);\n\n  const actions = useMemo(\n    () => ({\n      inputTarget: (targetKey: string) => {\n        dispatch({ type: \"inputTarget\", payload: { targetKey } });\n      },\n      inputOperator: (operatorKey: string) => {\n        dispatch({ type: \"inputOperator\", payload: { operatorKey } });\n      },\n      inputValue: (value: SearchInput) => {\n        dispatch({ type: \"inputValue\", payload: value });\n      },\n      deleteCondition: (index: number) => {\n        dispatch({ type: \"deleteCondition\", payload: { index } });\n      },\n      reset: () => {\n        dispatch({ type: \"reset\" });\n      },\n      updateTargets: (targets: Target[]) => {\n        dispatch({ type: \"updateTargets\", payload: { targets } });\n      },\n      removeInputedTarget: () => {\n        dispatch({ type: \"removeInputedTarget\" });\n      },\n      removeInputedOperator: () => {\n        dispatch({ type: \"removeInputedOperator\" });\n      },\n    }),\n    []\n  );\n\n  return {\n    state,\n    actions,\n  };\n};\n"],"names":["useConditionInputHook","targets","onChangeCondition","_a","useReducer","conditionInputReducer","status","state","dispatch","useEffect","changeAction","type","actions","useMemo","inputTarget","targetKey","payload","inputOperator","operatorKey","inputValue","value","deleteCondition","index","reset","updateTargets","removeInputedTarget","removeInputedOperator"],"mappings":"oHAIa,IAAAA,EAA6C,SACxDC,EACAC,GAEM,IAAAC,EAAoBC,EAAWC,EAAuB,CAC1DJ,QAAOA,EACPK,OAAQ,sBAFHC,EAAKJ,EAAA,GAAEK,OAKdC,GAAU,WACJF,EAAMG,eACRR,EAAkBK,EAAMG,cACxBF,EAAS,CAAEG,KAAM,yBAErB,GAAG,CAACJ,EAAMG,eAEV,IAAME,EAAUC,GACd,WAAM,MAAC,CACLC,YAAa,SAACC,GACZP,EAAS,CAAEG,KAAM,cAAeK,QAAS,CAAED,UAASA,IACrD,EACDE,cAAe,SAACC,GACdV,EAAS,CAAEG,KAAM,gBAAiBK,QAAS,CAAEE,YAAWA,IACzD,EACDC,WAAY,SAACC,GACXZ,EAAS,CAAEG,KAAM,aAAcK,QAASI,GACzC,EACDC,gBAAiB,SAACC,GAChBd,EAAS,CAAEG,KAAM,kBAAmBK,QAAS,CAAEM,MAAKA,IACrD,EACDC,MAAO,WACLf,EAAS,CAAEG,KAAM,SAClB,EACDa,cAAe,SAACvB,GACdO,EAAS,CAAEG,KAAM,gBAAiBK,QAAS,CAAEf,QAAOA,IACrD,EACDwB,oBAAqB,WACnBjB,EAAS,CAAEG,KAAM,uBAClB,EACDe,sBAAuB,WACrBlB,EAAS,CAAEG,KAAM,yBAClB,EAxBG,GA0BN,IAGF,MAAO,CACLJ,MAAKA,EACLK,QAAOA,EAEX"}

package/dist/esm/src/search-bar/condition-search-bar/condition-input-management/reducer.js

@@ -1,2 +1,2 @@
-import{DEFAULT_SEARCH_OPERATOR as t}from"../../../share/search-operator/constant.js";var n=function(n,e){switch(e.type){case"inputTarget":if("waiting for input"!==n.status)return n;var i=n.targets.find((function(t){return t.key===e.payload.targetKey}));return i?{targets:n.targets,onChangeCondition:n.onChangeCondition,status:"inputted target",inputtingCondition:{type:i.type,target:i},useableOperators:t.filter((function(t){return t.type===i.type}))}:n;case"inputOperator":if("inputted target"!==n.status)return n;var o=t.find((function(t){return t.key===e.payload.operatorKey}));return o?o.type!==n.inputtingCondition.target.type?n:"none"===o.inputType?(n.onChangeCondition({type:"add",payload:{condition:{target:n.inputtingCondition.target,operator:o,input:{type:"none"}}}}),{targets:n.targets,onChangeCondition:n.onChangeCondition,status:"waiting for input"}):{targets:n.targets,onChangeCondition:n.onChangeCondition,status:"inputted operator",inputtingCondition:{type:n.inputtingCondition.target.type,target:n.inputtingCondition.target,operator:o}}:n;case"inputValue":return"inputted operator"!==n.status?n:(n.onChangeCondition({type:"add",payload:{condition:{target:n.inputtingCondition.target,operator:n.inputtingCondition.operator,input:e.payload}}}),{targets:n.targets,onChangeCondition:n.onChangeCondition,status:"waiting for input"});case"deleteCondition":return n.onChangeCondition({type:"remove",payload:{index:e.payload.index}}),n;case"reset":return{targets:n.targets,onChangeCondition:n.onChangeCondition,status:"waiting for input"};case"updateTargets":return{targets:e.payload.targets,onChangeCondition:n.onChangeCondition,status:"waiting for input"};case"removeInputedTarget":return"inputted target"!=n.status&&"inputted operator"!=n.status?n:{targets:n.targets,onChangeCondition:n.onChangeCondition,status:"waiting for input"};case"removeInputedOperator":return"inputted operator"!==n.status?n:{targets:n.targets,onChangeCondition:n.onChangeCondition,status:"inputted target",inputtingCondition:{type:n.inputtingCondition.target.type,target:n.inputtingCondition.target},useableOperators:t.filter((function(t){return t.type===n.inputtingCondition.target.type}))}}};export{n as conditionInputReducer};
+import{__assign as t}from"../../../../node_modules/tslib/tslib.es6.js";import{DEFAULT_SEARCH_OPERATOR as e}from"../../../share/search-operator/constant.js";var n=function(n,r){switch(r.type){case"inputTarget":if("waiting for input"!==n.status)return n;var a=n.targets.find((function(t){return t.key===r.payload.targetKey}));return a?{targets:n.targets,status:"inputted target",inputtingCondition:{type:a.type,target:a},useableOperators:e.filter((function(t){return t.type===a.type}))}:n;case"inputOperator":if("inputted target"!==n.status)return n;var i=e.find((function(t){return t.key===r.payload.operatorKey}));return i?i.type!==n.inputtingCondition.target.type?n:"none"===i.inputType?{targets:n.targets,changeAction:{type:"add",payload:{condition:{target:n.inputtingCondition.target,operator:i,input:{type:"none"}}}},status:"waiting for input"}:{targets:n.targets,status:"inputted operator",inputtingCondition:{type:n.inputtingCondition.target.type,target:n.inputtingCondition.target,operator:i}}:n;case"inputValue":return"inputted operator"!==n.status?n:{targets:n.targets,changeAction:{type:"add",payload:{condition:{target:n.inputtingCondition.target,operator:n.inputtingCondition.operator,input:r.payload}}},status:"waiting for input"};case"deleteCondition":return t(t({},n),{changeAction:{type:"remove",payload:{index:r.payload.index}}});case"reset":return{targets:n.targets,status:"waiting for input"};case"updateTargets":return{targets:r.payload.targets,status:"waiting for input"};case"removeInputedTarget":return"inputted target"!=n.status&&"inputted operator"!=n.status?n:{targets:n.targets,status:"waiting for input"};case"removeInputedOperator":return"inputted operator"!==n.status?n:{targets:n.targets,status:"inputted target",inputtingCondition:{type:n.inputtingCondition.target.type,target:n.inputtingCondition.target},useableOperators:e.filter((function(t){return t.type===n.inputtingCondition.target.type}))};case"executedChangeAction":return t(t({},n),{changeAction:void 0})}};export{n as conditionInputReducer};
 //# sourceMappingURL=reducer.js.map

package/dist/esm/src/search-bar/condition-search-bar/condition-input-management/reducer.js.map

@@ -1 +1 @@
-{"version":3,"file":"reducer.js","sources":["../../../../../../src/search-bar/condition-search-bar/condition-input-management/reducer.ts"],"sourcesContent":["import { DEFAULT_SEARCH_OPERATOR } from \"../../../share/search-operator\";\nimport { TConditionInputReducer } from \"./type\";\n\nexport const conditionInputReducer: TConditionInputReducer = (\n  state,\n  action\n) => {\n  switch (action.type) {\n    case \"inputTarget\": {\n      if (state.status !== \"waiting for input\") {\n        return state;\n      }\n\n      const target = state.targets.find(\n        (t) => t.key === action.payload.targetKey\n      );\n\n      if (!target) {\n        return state;\n      }\n\n      return {\n        targets: state.targets,\n        onChangeCondition: state.onChangeCondition,\n        status: \"inputted target\",\n        inputtingCondition: {\n          type: target.type,\n          target,\n        },\n        useableOperators: DEFAULT_SEARCH_OPERATOR.filter(\n          (o) => o.type === target.type\n        ),\n      };\n    }\n\n    case \"inputOperator\": {\n      if (state.status !== \"inputted target\") {\n        return state;\n      }\n\n      const operator = DEFAULT_SEARCH_OPERATOR.find(\n        (o) => o.key === action.payload.operatorKey\n      );\n\n      if (!operator) {\n        return state;\n      }\n\n      if (operator.type !== state.inputtingCondition.target.type) {\n        return state;\n      }\n\n      if (operator.inputType === \"none\") {\n        state.onChangeCondition({\n          type: \"add\",\n          payload: {\n            condition: {\n              target: state.inputtingCondition.target,\n              operator,\n              input: {\n                type: \"none\",\n              },\n            },\n          },\n        });\n\n        return {\n          targets: state.targets,\n          onChangeCondition: state.onChangeCondition,\n          status: \"waiting for input\",\n        };\n      }\n\n      return {\n        targets: state.targets,\n        onChangeCondition: state.onChangeCondition,\n        status: \"inputted operator\",\n        inputtingCondition: {\n          type: state.inputtingCondition.target.type,\n          target: state.inputtingCondition.target,\n          operator,\n        },\n      };\n    }\n\n    case \"inputValue\": {\n      if (state.status !== \"inputted operator\") {\n        return state;\n      }\n\n      state.onChangeCondition({\n        type: \"add\",\n        payload: {\n          condition: {\n            target: state.inputtingCondition.target,\n            operator: state.inputtingCondition.operator,\n            input: action.payload,\n          },\n        },\n      });\n\n      return {\n        targets: state.targets,\n        onChangeCondition: state.onChangeCondition,\n        status: \"waiting for input\",\n      };\n    }\n\n    case \"deleteCondition\": {\n      state.onChangeCondition({\n        type: \"remove\",\n        payload: {\n          index: action.payload.index,\n        },\n      });\n\n      return state;\n    }\n\n    case \"reset\": {\n      return {\n        targets: state.targets,\n        onChangeCondition: state.onChangeCondition,\n        status: \"waiting for input\",\n      };\n    }\n\n    case \"updateTargets\": {\n      return {\n        targets: action.payload.targets,\n        onChangeCondition: state.onChangeCondition,\n        status: \"waiting for input\",\n      };\n    }\n\n    case \"removeInputedTarget\": {\n      if (\n        !(\n          state.status == \"inputted target\" ||\n          state.status == \"inputted operator\"\n        )\n      ) {\n        return state;\n      }\n\n      return {\n        targets: state.targets,\n        onChangeCondition: state.onChangeCondition,\n        status: \"waiting for input\",\n      };\n    }\n\n    case \"removeInputedOperator\": {\n      if (state.status !== \"inputted operator\") {\n        return state;\n      }\n\n      return {\n        targets: state.targets,\n        onChangeCondition: state.onChangeCondition,\n        status: \"inputted target\",\n        inputtingCondition: {\n          type: state.inputtingCondition.target.type,\n          target: state.inputtingCondition.target,\n        },\n        useableOperators: DEFAULT_SEARCH_OPERATOR.filter(\n          (o) => o.type === state.inputtingCondition.target.type\n        ),\n      };\n    }\n  }\n};\n"],"names":["conditionInputReducer","state","action","type","status","target_1","targets","find","t","key","payload","targetKey","onChangeCondition","inputtingCondition","target","useableOperators","DEFAULT_SEARCH_OPERATOR","filter","o","operator","operatorKey","inputType","condition","input","index"],"mappings":"qFAGa,IAAAA,EAAgD,SAC3DC,EACAC,GAEA,OAAQA,EAAOC,MACb,IAAK,cACH,GAAqB,sBAAjBF,EAAMG,OACR,OAAOH,EAGT,IAAMI,EAASJ,EAAMK,QAAQC,MAC3B,SAACC,GAAM,OAAAA,EAAEC,MAAQP,EAAOQ,QAAQC,SAAS,IAG3C,OAAKN,EAIE,CACLC,QAASL,EAAMK,QACfM,kBAAmBX,EAAMW,kBACzBR,OAAQ,kBACRS,mBAAoB,CAClBV,KAAME,EAAOF,KACbW,OAAMT,GAERU,iBAAkBC,EAAwBC,QACxC,SAACC,GAAM,OAAAA,EAAEf,OAASE,EAAOF,SAZpBF,EAiBX,IAAK,gBACH,GAAqB,oBAAjBA,EAAMG,OACR,OAAOH,EAGT,IAAMkB,EAAWH,EAAwBT,MACvC,SAACW,GAAM,OAAAA,EAAET,MAAQP,EAAOQ,QAAQU,WAAW,IAG7C,OAAKD,EAIDA,EAAShB,OAASF,EAAMY,mBAAmBC,OAAOX,KAC7CF,EAGkB,SAAvBkB,EAASE,WACXpB,EAAMW,kBAAkB,CACtBT,KAAM,MACNO,QAAS,CACPY,UAAW,CACTR,OAAQb,EAAMY,mBAAmBC,OACjCK,SAAQA,EACRI,MAAO,CACLpB,KAAM,YAMP,CACLG,QAASL,EAAMK,QACfM,kBAAmBX,EAAMW,kBACzBR,OAAQ,sBAIL,CACLE,QAASL,EAAMK,QACfM,kBAAmBX,EAAMW,kBACzBR,OAAQ,oBACRS,mBAAoB,CAClBV,KAAMF,EAAMY,mBAAmBC,OAAOX,KACtCW,OAAQb,EAAMY,mBAAmBC,OACjCK,SAAQA,IAnCHlB,EAwCX,IAAK,aACH,MAAqB,sBAAjBA,EAAMG,OACDH,GAGTA,EAAMW,kBAAkB,CACtBT,KAAM,MACNO,QAAS,CACPY,UAAW,CACTR,OAAQb,EAAMY,mBAAmBC,OACjCK,SAAUlB,EAAMY,mBAAmBM,SACnCI,MAAOrB,EAAOQ,YAKb,CACLJ,QAASL,EAAMK,QACfM,kBAAmBX,EAAMW,kBACzBR,OAAQ,sBAIZ,IAAK,kBAQH,OAPAH,EAAMW,kBAAkB,CACtBT,KAAM,SACNO,QAAS,CACPc,MAAOtB,EAAOQ,QAAQc,SAInBvB,EAGT,IAAK,QACH,MAAO,CACLK,QAASL,EAAMK,QACfM,kBAAmBX,EAAMW,kBACzBR,OAAQ,qBAIZ,IAAK,gBACH,MAAO,CACLE,QAASJ,EAAOQ,QAAQJ,QACxBM,kBAAmBX,EAAMW,kBACzBR,OAAQ,qBAIZ,IAAK,sBACH,MAEoB,mBAAhBH,EAAMG,QACU,qBAAhBH,EAAMG,OAGDH,EAGF,CACLK,QAASL,EAAMK,QACfM,kBAAmBX,EAAMW,kBACzBR,OAAQ,qBAIZ,IAAK,wBACH,MAAqB,sBAAjBH,EAAMG,OACDH,EAGF,CACLK,QAASL,EAAMK,QACfM,kBAAmBX,EAAMW,kBACzBR,OAAQ,kBACRS,mBAAoB,CAClBV,KAAMF,EAAMY,mBAAmBC,OAAOX,KACtCW,OAAQb,EAAMY,mBAAmBC,QAEnCC,iBAAkBC,EAAwBC,QACxC,SAACC,GAAM,OAAAA,EAAEf,OAASF,EAAMY,mBAAmBC,OAAOX,IAA3C,KAKjB"}
+{"version":3,"file":"reducer.js","sources":["../../../../../../src/search-bar/condition-search-bar/condition-input-management/reducer.ts"],"sourcesContent":["import { DEFAULT_SEARCH_OPERATOR } from \"../../../share/search-operator\";\nimport { TConditionInputReducer } from \"./type\";\n\nexport const conditionInputReducer: TConditionInputReducer = (\n  state,\n  action\n) => {\n  switch (action.type) {\n    case \"inputTarget\": {\n      if (state.status !== \"waiting for input\") {\n        return state;\n      }\n\n      const target = state.targets.find(\n        (t) => t.key === action.payload.targetKey\n      );\n\n      if (!target) {\n        return state;\n      }\n\n      return {\n        targets: state.targets,\n        status: \"inputted target\",\n        inputtingCondition: {\n          type: target.type,\n          target,\n        },\n        useableOperators: DEFAULT_SEARCH_OPERATOR.filter(\n          (o) => o.type === target.type\n        ),\n      };\n    }\n\n    case \"inputOperator\": {\n      if (state.status !== \"inputted target\") {\n        return state;\n      }\n\n      const operator = DEFAULT_SEARCH_OPERATOR.find(\n        (o) => o.key === action.payload.operatorKey\n      );\n\n      if (!operator) {\n        return state;\n      }\n\n      if (operator.type !== state.inputtingCondition.target.type) {\n        return state;\n      }\n\n      if (operator.inputType === \"none\") {\n        return {\n          targets: state.targets,\n          changeAction: {\n            type: \"add\",\n            payload: {\n              condition: {\n                target: state.inputtingCondition.target,\n                operator,\n                input: {\n                  type: \"none\",\n                },\n              },\n            },\n          },\n          status: \"waiting for input\",\n        };\n      }\n\n      return {\n        targets: state.targets,\n        status: \"inputted operator\",\n        inputtingCondition: {\n          type: state.inputtingCondition.target.type,\n          target: state.inputtingCondition.target,\n          operator,\n        },\n      };\n    }\n\n    case \"inputValue\": {\n      if (state.status !== \"inputted operator\") {\n        return state;\n      }\n\n      return {\n        targets: state.targets,\n        changeAction: {\n          type: \"add\",\n          payload: {\n            condition: {\n              target: state.inputtingCondition.target,\n              operator: state.inputtingCondition.operator,\n              input: action.payload,\n            },\n          },\n        },\n        status: \"waiting for input\",\n      };\n    }\n\n    case \"deleteCondition\": {\n      return {\n        ...state,\n        changeAction: {\n          type: \"remove\",\n          payload: {\n            index: action.payload.index,\n          },\n        },\n      };\n    }\n\n    case \"reset\": {\n      return {\n        targets: state.targets,\n        status: \"waiting for input\",\n      };\n    }\n\n    case \"updateTargets\": {\n      return {\n        targets: action.payload.targets,\n        status: \"waiting for input\",\n      };\n    }\n\n    case \"removeInputedTarget\": {\n      if (\n        !(\n          state.status == \"inputted target\" ||\n          state.status == \"inputted operator\"\n        )\n      ) {\n        return state;\n      }\n\n      return {\n        targets: state.targets,\n        status: \"waiting for input\",\n      };\n    }\n\n    case \"removeInputedOperator\": {\n      if (state.status !== \"inputted operator\") {\n        return state;\n      }\n\n      return {\n        targets: state.targets,\n        status: \"inputted target\",\n        inputtingCondition: {\n          type: state.inputtingCondition.target.type,\n          target: state.inputtingCondition.target,\n        },\n        useableOperators: DEFAULT_SEARCH_OPERATOR.filter(\n          (o) => o.type === state.inputtingCondition.target.type\n        ),\n      };\n    }\n\n    case \"executedChangeAction\": {\n      return {\n        ...state,\n        changeAction: undefined,\n      };\n    }\n  }\n};\n"],"names":["conditionInputReducer","state","action","type","status","target_1","targets","find","t","key","payload","targetKey","inputtingCondition","target","useableOperators","DEFAULT_SEARCH_OPERATOR","filter","o","operator","operatorKey","inputType","changeAction","condition","input","__assign","index","undefined"],"mappings":"4JAGa,IAAAA,EAAgD,SAC3DC,EACAC,GAEA,OAAQA,EAAOC,MACb,IAAK,cACH,GAAqB,sBAAjBF,EAAMG,OACR,OAAOH,EAGT,IAAMI,EAASJ,EAAMK,QAAQC,MAC3B,SAACC,GAAM,OAAAA,EAAEC,MAAQP,EAAOQ,QAAQC,SAAS,IAG3C,OAAKN,EAIE,CACLC,QAASL,EAAMK,QACfF,OAAQ,kBACRQ,mBAAoB,CAClBT,KAAME,EAAOF,KACbU,OAAMR,GAERS,iBAAkBC,EAAwBC,QACxC,SAACC,GAAM,OAAAA,EAAEd,OAASE,EAAOF,SAXpBF,EAgBX,IAAK,gBACH,GAAqB,oBAAjBA,EAAMG,OACR,OAAOH,EAGT,IAAMiB,EAAWH,EAAwBR,MACvC,SAACU,GAAM,OAAAA,EAAER,MAAQP,EAAOQ,QAAQS,WAAW,IAG7C,OAAKD,EAIDA,EAASf,OAASF,EAAMW,mBAAmBC,OAAOV,KAC7CF,EAGkB,SAAvBiB,EAASE,UACJ,CACLd,QAASL,EAAMK,QACfe,aAAc,CACZlB,KAAM,MACNO,QAAS,CACPY,UAAW,CACTT,OAAQZ,EAAMW,mBAAmBC,OACjCK,SAAQA,EACRK,MAAO,CACLpB,KAAM,WAKdC,OAAQ,qBAIL,CACLE,QAASL,EAAMK,QACfF,OAAQ,oBACRQ,mBAAoB,CAClBT,KAAMF,EAAMW,mBAAmBC,OAAOV,KACtCU,OAAQZ,EAAMW,mBAAmBC,OACjCK,SAAQA,IAhCHjB,EAqCX,IAAK,aACH,MAAqB,sBAAjBA,EAAMG,OACDH,EAGF,CACLK,QAASL,EAAMK,QACfe,aAAc,CACZlB,KAAM,MACNO,QAAS,CACPY,UAAW,CACTT,OAAQZ,EAAMW,mBAAmBC,OACjCK,SAAUjB,EAAMW,mBAAmBM,SACnCK,MAAOrB,EAAOQ,WAIpBN,OAAQ,qBAIZ,IAAK,kBACH,OACKoB,EAAAA,EAAA,CAAA,EAAAvB,GACH,CAAAoB,aAAc,CACZlB,KAAM,SACNO,QAAS,CACPe,MAAOvB,EAAOQ,QAAQe,UAM9B,IAAK,QACH,MAAO,CACLnB,QAASL,EAAMK,QACfF,OAAQ,qBAIZ,IAAK,gBACH,MAAO,CACLE,QAASJ,EAAOQ,QAAQJ,QACxBF,OAAQ,qBAIZ,IAAK,sBACH,MAEoB,mBAAhBH,EAAMG,QACU,qBAAhBH,EAAMG,OAGDH,EAGF,CACLK,QAASL,EAAMK,QACfF,OAAQ,qBAIZ,IAAK,wBACH,MAAqB,sBAAjBH,EAAMG,OACDH,EAGF,CACLK,QAASL,EAAMK,QACfF,OAAQ,kBACRQ,mBAAoB,CAClBT,KAAMF,EAAMW,mBAAmBC,OAAOV,KACtCU,OAAQZ,EAAMW,mBAAmBC,QAEnCC,iBAAkBC,EAAwBC,QACxC,SAACC,GAAM,OAAAA,EAAEd,OAASF,EAAMW,mBAAmBC,OAAOV,IAA3C,KAKb,IAAK,uBACH,OAAAqB,EAAAA,EAAA,GACKvB,GAAK,CACRoB,kBAAcK,IAItB"}

package/dist/esm/src/search-bar/condition-search-bar/condition-list.js

@@ -1,3 +1,3 @@
 "use client";
-import{jsx as e,jsxs as t}from"react/jsx-runtime";import{useConditionInputAction as n}from"./condition-input-management/context.js";import"react";import{TiDeleteOutline as a}from"../../../node_modules/react-icons/ti/index.js";function r(t){return e("div",{className:"flex gap-1",children:t.conditions.map((function(t,n){return e(o,{index:n,condition:t},n)}))})}function o(r){var o=n().deleteCondition;return t("div",{className:"flex items-center gap-2 w-fit px-2 border-2 border-sky-600 rounded shadow",children:[e("p",{className:"whitespace-nowrap",children:c(r.condition)}),e("div",{children:e(a,{className:"bg-white hover:bg-slate-300 rounded-full cursor-pointer",onClick:function(){return o(r.index)}})})]})}function c(e){var t;switch(e.input.type){case"none":return"".concat(e.target.label," ").concat(e.operator.label);case"single string":case"single number":case"single date":return"".concat(e.target.label," ").concat(e.operator.label," ").concat(e.input.payload.value);case"range string":case"range number":case"range date":return"".concat(e.target.label," ").concat(e.operator.label," ").concat(e.input.payload.from," ～ ").concat(e.input.payload.to);case"select":if("select"!==e.target.type)throw new Error("type error");var n=e.input.payload.value;return"".concat(e.target.label," ").concat(e.operator.label," ").concat(null===(t=e.target.options.find((function(e){return e.value===n})))||void 0===t?void 0:t.label);case"multi select":return"".concat(e.target.label," ").concat(e.operator.label," ").concat(e.input.payload.value.join(", "))}}export{r as ConditionList};
+import{jsx as e,jsxs as t}from"react/jsx-runtime";import{useConditionInputAction as n}from"./condition-input-management/context.js";import"react";import"../../../node_modules/tslib/tslib.es6.js";import{TiDeleteOutline as a}from"../../../node_modules/react-icons/ti/index.js";function r(t){return e("div",{className:"flex gap-1",children:t.conditions.map((function(t,n){return e(o,{index:n,condition:t},n)}))})}function o(r){var o=n().deleteCondition;return t("div",{className:"flex items-center gap-2 w-fit px-2 border-2 border-sky-600 rounded shadow",children:[e("p",{className:"whitespace-nowrap",children:c(r.condition)}),e("div",{children:e(a,{className:"bg-white hover:bg-slate-300 rounded-full cursor-pointer",onClick:function(){return o(r.index)}})})]})}function c(e){var t;switch(e.input.type){case"none":return"".concat(e.target.label," ").concat(e.operator.label);case"single string":case"single number":case"single date":return"".concat(e.target.label," ").concat(e.operator.label," ").concat(e.input.payload.value);case"range string":case"range number":case"range date":return"".concat(e.target.label," ").concat(e.operator.label," ").concat(e.input.payload.from," ～ ").concat(e.input.payload.to);case"select":if("select"!==e.target.type)throw new Error("type error");var n=e.input.payload.value;return"".concat(e.target.label," ").concat(e.operator.label," ").concat(null===(t=e.target.options.find((function(e){return e.value===n})))||void 0===t?void 0:t.label);case"multi select":return"".concat(e.target.label," ").concat(e.operator.label," ").concat(e.input.payload.value.join(", "))}}export{r as ConditionList};
 //# sourceMappingURL=condition-list.js.map

package/dist/esm/src/search-bar/condition-search-bar/input-form.js

@@ -1,3 +1,3 @@
 "use client";
-import{jsx as e,jsxs as t,Fragment as n}from"react/jsx-runtime";import{useState as i}from"react";import{SelectBox as o}from"../../select-box/index.js";import{useConditionInputState as r,useConditionInputAction as a}from"./condition-input-management/context.js";import{useIdGenerator as l}from"../id-generator/context.js";import{TiDeleteOutline as u}from"../../../node_modules/react-icons/ti/index.js";function p(t){switch(r().status){case"waiting for input":return e(c,{});case"inputted target":return e(s,{});case"inputted operator":return e(d,{size:t.size})}}function c(){var t=l().generateId,n=r().targets,i=a().inputTarget;return e(o,{id:t("TargetInput"),onSelect:function(e){i(e)},options:n.map((function(e){return{value:e.key,label:e.label}})),placeholder:"Select target",no_appearance:!0,no_icon:!0})}function s(){var i=l().generateId,u=r(),p=a(),c=p.inputOperator,s=p.removeInputedTarget;if("inputted target"!==u.status)return null;var d=u.inputtingCondition.target,g=u.useableOperators;return t(n,{children:[e(v,{label:d.label,onClickDelete:function(){s()}}),e("div",{className:"w-full min-w-64",children:e(o,{id:i("OperatorInput"),onSelect:function(e){c(e),setTimeout((function(){var e=document.getElementById(i("ValueInput"));e&&e.focus()}),10)},options:g.map((function(e){return{value:e.key,label:e.label}})),defaultIsOpen:!0,placeholder:"Select operator",no_appearance:!0,no_icon:!0})})]})}function d(i){var o=r(),l=a(),u=l.removeInputedOperator,p=l.removeInputedTarget;if("inputted operator"!==o.status)return null;var c=o.inputtingCondition.target,s=o.inputtingCondition.operator;return t(n,{children:[e(v,{label:c.label,onClickDelete:function(){p()}}),e(v,{label:s.label,onClickDelete:function(){u()}}),"single string"===o.inputtingCondition.operator.inputType?e(g,{inputType:"single string",size:i.size}):"single number"===o.inputtingCondition.operator.inputType?e(m,{inputType:"single number",size:i.size}):"select"===o.inputtingCondition.operator.inputType?e(f,{inputType:"select",options:"select"===o.inputtingCondition.target.type?o.inputtingCondition.target.options:[]}):console.error("Not implemented")]})}function g(t){var n=l().generateId,o=i(""),r=o[0],u=o[1],p=a().inputValue;return e("input",{id:n("ValueInput"),className:"no_appearance w-full min-w-64 border-none px-2 py-1 focus:outline-none focus-visible:outline-none bg-transparent ".concat("small"===t.size?"text-sm":"large"===t.size?"text-lg":""),type:"text",placeholder:"Search text",value:r,onChange:function(e){u(e.target.value)},onKeyDown:function(e){"Enter"===e.key&&(p({type:t.inputType,payload:{value:r}}),u(""))}})}function m(t){var n=l().generateId,o=i(""),r=o[0],u=o[1],p=a().inputValue;return e("input",{id:n("ValueInput"),className:"no_appearance w-full min-w-64 border-none px-2 py-1 focus:outline-none focus-visible:outline-none bg-transparent ".concat("small"===t.size?"text-sm":"large"===t.size?"text-lg":""),type:"text",placeholder:"Search text",value:r,onChange:function(e){u(e.target.value)},onKeyDown:function(e){"Enter"===e.key&&(p({type:t.inputType,payload:{value:Number(r)}}),u(""))}})}function f(t){var n=a().inputValue,i=l().generateId;return e("div",{className:"w-full min-w-64",children:e(o,{id:i("ValueInput"),onSelect:function(e){n({type:t.inputType,payload:{value:e}})},options:t.options,defaultIsOpen:!0,placeholder:"Select value",no_appearance:!0,no_icon:!0})})}function v(n){return t("div",{className:"flex items-center gap-2 w-fit px-2 border rounded bg-slate-100",children:[e("p",{className:"whitespace-nowrap",children:n.label}),n.onClickDelete&&e("div",{children:e(u,{className:"bg-white hover:bg-slate-300 rounded-full cursor-pointer",onClick:n.onClickDelete})})]})}export{p as SearchBarInputForm};
+import{jsx as e,jsxs as t,Fragment as n}from"react/jsx-runtime";import{useState as i}from"react";import{SelectBox as o}from"../../select-box/index.js";import{useConditionInputState as r,useConditionInputAction as a}from"./condition-input-management/context.js";import"../../../node_modules/tslib/tslib.es6.js";import{useIdGenerator as l}from"../id-generator/context.js";import{TiDeleteOutline as u}from"../../../node_modules/react-icons/ti/index.js";function p(t){switch(r().status){case"waiting for input":return e(c,{});case"inputted target":return e(s,{});case"inputted operator":return e(d,{size:t.size})}}function c(){var t=l().generateId,n=r().targets,i=a().inputTarget;return e(o,{id:t("TargetInput"),onSelect:function(e){i(e)},options:n.map((function(e){return{value:e.key,label:e.label}})),placeholder:"Select target",no_appearance:!0,no_icon:!0})}function s(){var i=l().generateId,u=r(),p=a(),c=p.inputOperator,s=p.removeInputedTarget;if("inputted target"!==u.status)return null;var d=u.inputtingCondition.target,g=u.useableOperators;return t(n,{children:[e(v,{label:d.label,onClickDelete:function(){s()}}),e("div",{className:"w-full min-w-64",children:e(o,{id:i("OperatorInput"),onSelect:function(e){c(e),setTimeout((function(){var e=document.getElementById(i("ValueInput"));e&&e.focus()}),10)},options:g.map((function(e){return{value:e.key,label:e.label}})),defaultIsOpen:!0,placeholder:"Select operator",no_appearance:!0,no_icon:!0})})]})}function d(i){var o=r(),l=a(),u=l.removeInputedOperator,p=l.removeInputedTarget;if("inputted operator"!==o.status)return null;var c=o.inputtingCondition.target,s=o.inputtingCondition.operator;return t(n,{children:[e(v,{label:c.label,onClickDelete:function(){p()}}),e(v,{label:s.label,onClickDelete:function(){u()}}),"single string"===o.inputtingCondition.operator.inputType?e(g,{inputType:"single string",size:i.size}):"single number"===o.inputtingCondition.operator.inputType?e(m,{inputType:"single number",size:i.size}):"select"===o.inputtingCondition.operator.inputType?e(f,{inputType:"select",options:"select"===o.inputtingCondition.target.type?o.inputtingCondition.target.options:[]}):console.error("Not implemented")]})}function g(t){var n=l().generateId,o=i(""),r=o[0],u=o[1],p=a().inputValue;return e("input",{id:n("ValueInput"),className:"appearance-none w-full min-w-64 border-none px-2 py-1 focus:outline-none focus-visible:outline-none bg-transparent ".concat("small"===t.size?"text-sm":"large"===t.size?"text-lg":""),type:"text",placeholder:"Search text",value:r,onChange:function(e){u(e.target.value)},onKeyDown:function(e){"Enter"===e.key&&(p({type:t.inputType,payload:{value:r}}),u(""))}})}function m(t){var n=l().generateId,o=i(""),r=o[0],u=o[1],p=a().inputValue;return e("input",{id:n("ValueInput"),className:"appearance-none w-full min-w-64 border-none px-2 py-1 focus:outline-none focus-visible:outline-none bg-transparent ".concat("small"===t.size?"text-sm":"large"===t.size?"text-lg":""),type:"text",placeholder:"Search text",value:r,onChange:function(e){u(e.target.value)},onKeyDown:function(e){"Enter"===e.key&&(p({type:t.inputType,payload:{value:Number(r)}}),u(""))}})}function f(t){var n=a().inputValue,i=l().generateId;return e("div",{className:"w-full min-w-64",children:e(o,{id:i("ValueInput"),onSelect:function(e){n({type:t.inputType,payload:{value:e}})},options:t.options,defaultIsOpen:!0,placeholder:"Select value",no_appearance:!0,no_icon:!0})})}function v(n){return t("div",{className:"flex items-center gap-2 w-fit px-2 border rounded bg-slate-100",children:[e("p",{className:"whitespace-nowrap",children:n.label}),n.onClickDelete&&e("div",{children:e(u,{className:"bg-white hover:bg-slate-300 rounded-full cursor-pointer",onClick:n.onClickDelete})})]})}export{p as SearchBarInputForm};
 //# sourceMappingURL=input-form.js.map

package/dist/esm/src/select-box/options-window/component.js

@@ -1,2 +1,2 @@
-import{jsx as e,Fragment as t}from"react/jsx-runtime";import{useState as n,useEffect as o}from"react";import{useOptionsWindow as r}from"./context.js";import{useIdContext as i}from"../id/provider.js";import{IdGenerator as l}from"../lib/id-generator.js";function a(){var a=i(),u=r(),s=u.state,c=u.actions,p=n(""),d=p[0],f=p[1],v=n(void 0),m=v[0],g=v[1],h=s.isOpen?0===s.options.length?void 0:"number"==typeof m&&m<s.options.length&&m>=0?s.options[m].value:void 0:void 0;if(o((function(){if(s.isOpen){var e=document.getElementById(l.generateIdSelectBoxOption(a,null!=h?h:""));if(!e)return;e.scrollIntoView({behavior:"smooth",block:"nearest",inline:"nearest"})}else g(void 0)}),[s]),o((function(){if(s.isOpen){var e=function(e){if("ArrowDown"===e.key)e.preventDefault(),g((function(e){return"number"==typeof e?Math.min(e+1,s.options.length-1):0}));else if("ArrowUp"===e.key)e.preventDefault(),g((function(e){return"number"==typeof e?Math.max(e-1,0):0}));else if("Enter"===e.key&&(e.preventDefault(),"number"==typeof m)){if(0===s.options.length||s.options.length<=m)return;var t=s.options[m].value;if(!t)return;f(t),s.onSelect(t),c.closeOptionsWindow()}};return document.addEventListener("keydown",e),function(){document.removeEventListener("keydown",e)}}}),[s,m,g]),!s.isOpen)return e(t,{});var y=document.getElementById(s.selectBoxId);if(!y)return e(t,{});var b=y.getBoundingClientRect(),w=window.scrollY+b.top+b.height,x=window.scrollX+b.left;return e("div",{id:"ReactUI:SelectBox:OptionsArea",className:"absolute min-w-fit max-h-[40vh] overflow-auto border border-gray-300 z-10",style:{top:w,left:x},children:s.options.map((function(t){var n,o;return e("div",{id:l.generateIdSelectBoxOption(a,null!==(n=t.value)&&void 0!==n?n:""),className:"hover:bg-gray-200 px-2 py-1 ".concat("string"==typeof h?h===t.value?"bg-gray-100":"bg-white":d===t.value?"bg-gray-100":"bg-white"),onClick:function(){s.onSelect(t.value),c.closeOptionsWindow()},children:null!==(o=t.searchLabel)&&void 0!==o?o:t.label},t.value)}))})}export{a as OptionsArea};
+import{jsx as e,Fragment as t}from"react/jsx-runtime";import{useState as n,useEffect as o}from"react";import{useOptionsWindow as i}from"./context.js";import{useIdContext as r}from"../id/provider.js";import{IdGenerator as l}from"../lib/id-generator.js";function a(){var a=r(),s=i(),c=s.state,u=s.actions,d=n(""),f=d[0],p=d[1],m=n(void 0),v=m[0],g=m[1],y=n({top:0,left:0}),h=y[0],w=y[1],b=c.isOpen?0===c.options.length?void 0:"number"==typeof v&&v<c.options.length&&v>=0?c.options[v].value:void 0:void 0;return o((function(){if(c.isOpen){var e=document.getElementById(l.generateIdSelectBoxOption(a,null!=b?b:""));if(!e)return;if(0===h.top&&0===h.left)return;e.scrollIntoView({behavior:"smooth",block:"nearest",inline:"nearest"})}else g(void 0)}),[c,h,b]),o((function(){if(c.isOpen){var e=function(e){if("ArrowDown"===e.key)e.preventDefault(),g((function(e){return"number"==typeof e?Math.min(e+1,c.options.length-1):0}));else if("ArrowUp"===e.key)e.preventDefault(),g((function(e){return"number"==typeof e?Math.max(e-1,0):0}));else if("Enter"===e.key&&(e.preventDefault(),"number"==typeof v)){if(0===c.options.length||c.options.length<=v)return;var t=c.options[v].value;if(!t)return;p(t),c.onSelect(t),u.closeOptionsWindow()}};return document.addEventListener("keydown",e),function(){document.removeEventListener("keydown",e)}}}),[c,v,g]),o((function(){var e=setTimeout((function(){if(c.isOpen){for(var e=document.getElementById("ReactUI:SelectBox:OptionsArea");e&&!e.className.includes("relative");)e=e.parentElement;var t=document.getElementById(c.selectBoxId);if(t){var n=t.getBoundingClientRect(),o=n.top+n.height,i=n.left;if(e){var r=e.getBoundingClientRect();w({top:o-r.top,left:i-r.left})}else w({top:o+window.scrollY,left:i+window.scrollX})}}}),0);return function(){clearTimeout(e)}}),[c.isOpen]),o((function(){var e=function(e){if(c.isOpen){var t=document.getElementById(c.selectBoxId),n=document.getElementById("ReactUI:SelectBox:OptionsArea"),o=e.target;o instanceof Node&&(null==t?void 0:t.contains(o))||o instanceof Node&&(null==n?void 0:n.contains(o))||(u.setSearchText(""),u.closeOptionsWindow())}};return document.addEventListener("mousedown",e),function(){document.removeEventListener("mousedown",e)}}),[c.isOpen]),c.isOpen?e("div",{id:"ReactUI:SelectBox:OptionsArea",className:"absolute min-w-fit max-h-[40vh] overflow-auto border border-gray-300 z-10",style:h,children:c.options.map((function(t){var n,o;return e("div",{id:l.generateIdSelectBoxOption(a,null!==(n=t.value)&&void 0!==n?n:""),className:"hover:bg-gray-200 px-2 py-1 ".concat("string"==typeof b?b===t.value?"bg-gray-100":"bg-white":f===t.value?"bg-gray-100":"bg-white"),onClick:function(){c.onSelect(t.value),u.closeOptionsWindow()},children:null!==(o=t.searchLabel)&&void 0!==o?o:t.label},t.value)}))}):e(t,{})}export{a as OptionsArea};
 //# sourceMappingURL=component.js.map

package/dist/esm/src/select-box/options-window/component.js.map

@@ -1 +1 @@
-{"version":3,"file":"component.js","sources":["../../../../../src/select-box/options-window/component.tsx"],"sourcesContent":["import { useEffect, useState } from \"react\";\nimport { useOptionsWindow } from \"../options-window\";\nimport { useIdContext } from \"../id/provider\";\nimport { IdGenerator } from \"../lib\";\n\nexport function OptionsArea() {\n  const id = useIdContext();\n  const { state, actions } = useOptionsWindow();\n  const [value, setValue] = useState(\"\");\n  const [selectingIndex, setSelectingIndex] = useState<number | undefined>(\n    undefined\n  );\n\n  const selectingValue = state.isOpen\n    ? state.options.length === 0\n      ? undefined\n      : typeof selectingIndex === \"number\" &&\n        selectingIndex < state.options.length &&\n        selectingIndex >= 0\n      ? state.options[selectingIndex].value\n      : undefined\n    : undefined;\n\n  useEffect(() => {\n    if (state.isOpen) {\n      const optionElement = document.getElementById(\n        IdGenerator.generateIdSelectBoxOption(id, selectingValue ?? \"\")\n      );\n\n      if (!optionElement) return;\n\n      optionElement.scrollIntoView({\n        behavior: \"smooth\",\n        block: \"nearest\",\n        inline: \"nearest\",\n      });\n    } else {\n      setSelectingIndex(undefined);\n    }\n  }, [state]);\n\n  useEffect(() => {\n    if (state.isOpen) {\n      const handleKeydown = (e: KeyboardEvent) => {\n        if (e.key === \"ArrowDown\") {\n          e.preventDefault();\n          setSelectingIndex((prev) =>\n            typeof prev === \"number\"\n              ? Math.min(prev + 1, state.options.length - 1)\n              : 0\n          );\n        } else if (e.key === \"ArrowUp\") {\n          e.preventDefault();\n          setSelectingIndex((prev) =>\n            typeof prev === \"number\" ? Math.max(prev - 1, 0) : 0\n          );\n        } else if (e.key === \"Enter\") {\n          e.preventDefault();\n          if (typeof selectingIndex === \"number\") {\n            if (\n              state.options.length === 0 ||\n              state.options.length <= selectingIndex\n            )\n              return;\n\n            const value = state.options[selectingIndex].value;\n\n            if (!value) return;\n\n            setValue(value);\n            state.onSelect(value);\n            actions.closeOptionsWindow();\n          }\n        }\n      };\n\n      document.addEventListener(\"keydown\", handleKeydown);\n\n      return () => {\n        document.removeEventListener(\"keydown\", handleKeydown);\n      };\n    }\n  }, [state, selectingIndex, setSelectingIndex]);\n\n  if (!state.isOpen) return <></>;\n\n  // state.selectBoxIdのElementの直下に表示する\n  const selectBoxElement = document.getElementById(state.selectBoxId);\n\n  if (!selectBoxElement) return <></>;\n\n  const rect = selectBoxElement.getBoundingClientRect();\n  let top = window.scrollY + rect.top + rect.height;\n  let left = window.scrollX + rect.left;\n\n  return (\n    <div\n      id={\"ReactUI:SelectBox:OptionsArea\"}\n      className=\"absolute min-w-fit max-h-[40vh] overflow-auto border border-gray-300 z-10\"\n      style={{ top, left }}\n    >\n      {state.options.map((option) => (\n        <div\n          id={IdGenerator.generateIdSelectBoxOption(id, option.value ?? \"\")}\n          className={`hover:bg-gray-200 px-2 py-1 ${\n            typeof selectingValue === \"string\"\n              ? selectingValue === option.value\n                ? \"bg-gray-100\"\n                : \"bg-white\"\n              : value === option.value\n              ? \"bg-gray-100\"\n              : \"bg-white\"\n          }`}\n          key={option.value}\n          onClick={() => {\n            state.onSelect(option.value);\n            actions.closeOptionsWindow();\n          }}\n        >\n          {option.searchLabel ?? option.label}\n        </div>\n      ))}\n    </div>\n  );\n}\n"],"names":["OptionsArea","id","useIdContext","_a","useOptionsWindow","state","actions","_b","useState","value","setValue","_c","undefined","selectingIndex","setSelectingIndex","selectingValue","isOpen","options","length","useEffect","optionElement","document","getElementById","IdGenerator","generateIdSelectBoxOption","scrollIntoView","behavior","block","inline","handleKeydown_1","e","key","preventDefault","prev","Math","min","max","value_1","onSelect","closeOptionsWindow","addEventListener","removeEventListener","_jsx","selectBoxElement","selectBoxId","rect","getBoundingClientRect","top","window","scrollY","height","left","scrollX","className","style","children","map","option","concat","onClick","searchLabel","label"],"mappings":"qQAKgBA,IACd,IAAMC,EAAKC,IACLC,EAAqBC,IAAnBC,EAAKF,EAAAE,MAAEC,EAAOH,EAAAG,QAChBC,EAAoBC,EAAS,IAA5BC,EAAKF,EAAA,GAAEG,EAAQH,EAAA,GAChBI,EAAsCH,OAC1CI,GADKC,EAAcF,EAAA,GAAEG,EAAiBH,EAAA,GAIlCI,EAAiBV,EAAMW,OACA,IAAzBX,EAAMY,QAAQC,YACZN,EAC0B,iBAAnBC,GACPA,EAAiBR,EAAMY,QAAQC,QAC/BL,GAAkB,EAClBR,EAAMY,QAAQJ,GAAgBJ,WAC9BG,OACFA,EA+DJ,GA7DAO,GAAU,WACR,GAAId,EAAMW,OAAQ,CAChB,IAAMI,EAAgBC,SAASC,eAC7BC,EAAYC,0BAA0BvB,EAAIc,QAAAA,EAAkB,KAG9D,IAAKK,EAAe,OAEpBA,EAAcK,eAAe,CAC3BC,SAAU,SACVC,MAAO,UACPC,OAAQ,WAEX,MACCd,OAAkBF,EAEtB,GAAG,CAACP,IAEJc,GAAU,WACR,GAAId,EAAMW,OAAQ,CAChB,IAAMa,EAAgB,SAACC,GACrB,GAAc,cAAVA,EAAEC,IACJD,EAAEE,iBACFlB,GAAkB,SAACmB,GACjB,MAAgB,iBAATA,EACHC,KAAKC,IAAIF,EAAO,EAAG5B,EAAMY,QAAQC,OAAS,GAC1C,CAFJ,SAIG,GAAc,YAAVY,EAAEC,IACXD,EAAEE,iBACFlB,GAAkB,SAACmB,GACjB,MAAgB,iBAATA,EAAoBC,KAAKE,IAAIH,EAAO,EAAG,GAAK,CAAnD,SAEG,GAAc,UAAVH,EAAEC,MACXD,EAAEE,iBAC4B,iBAAnBnB,GAA6B,CACtC,GAC2B,IAAzBR,EAAMY,QAAQC,QACdb,EAAMY,QAAQC,QAAUL,EAExB,OAEF,IAAMwB,EAAQhC,EAAMY,QAAQJ,GAAgBJ,MAE5C,IAAK4B,EAAO,OAEZ3B,EAAS2B,GACThC,EAAMiC,SAASD,GACf/B,EAAQiC,oBACT,CAEL,EAIA,OAFAlB,SAASmB,iBAAiB,UAAWX,GAE9B,WACLR,SAASoB,oBAAoB,UAAWZ,EAC1C,CACD,CACF,GAAE,CAACxB,EAAOQ,EAAgBC,KAEtBT,EAAMW,OAAQ,OAAO0B,QAG1B,IAAMC,EAAmBtB,SAASC,eAAejB,EAAMuC,aAEvD,IAAKD,EAAkB,OAAOD,QAE9B,IAAMG,EAAOF,EAAiBG,wBAC1BC,EAAMC,OAAOC,QAAUJ,EAAKE,IAAMF,EAAKK,OACvCC,EAAOH,OAAOI,QAAUP,EAAKM,KAEjC,OACET,EACE,MAAA,CAAAzC,GAAI,gCACJoD,UAAU,4EACVC,MAAO,CAAEP,IAAGA,EAAEI,KAAIA,GAEjBI,SAAAlD,EAAMY,QAAQuC,KAAI,SAACC,WAAW,OAC7Bf,EACE,MAAA,CAAAzC,GAAIsB,EAAYC,0BAA0BvB,EAAgB,QAAZE,EAAAsD,EAAOhD,aAAK,IAAAN,EAAAA,EAAI,IAC9DkD,UAAW,+BACTK,OAA0B,iBAAnB3C,EACHA,IAAmB0C,EAAOhD,MACxB,cACA,WACFA,IAAUgD,EAAOhD,MACjB,cACA,YAGNkD,QAAS,WACPtD,EAAMiC,SAASmB,EAAOhD,OACtBH,EAAQiC,oBACV,EAECgB,SAAsB,QAAtBhD,EAAAkD,EAAOG,mBAAe,IAAArD,EAAAA,EAAAkD,EAAOI,OANzBJ,EAAOhD,MAQf,KAGP"}
+{"version":3,"file":"component.js","sources":["../../../../../src/select-box/options-window/component.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from \"react\";\nimport { useOptionsWindow } from \"../options-window\";\nimport { useIdContext } from \"../id/provider\";\nimport { IdGenerator } from \"../lib\";\n\nexport function OptionsArea() {\n  const id = useIdContext();\n  const { state, actions } = useOptionsWindow();\n  const [value, setValue] = useState(\"\");\n  const [selectingIndex, setSelectingIndex] = useState<number | undefined>(\n    undefined\n  );\n  const [position, setPosition] = useState({ top: 0, left: 0 });\n\n  const selectingValue = state.isOpen\n    ? state.options.length === 0\n      ? undefined\n      : typeof selectingIndex === \"number\" &&\n        selectingIndex < state.options.length &&\n        selectingIndex >= 0\n      ? state.options[selectingIndex].value\n      : undefined\n    : undefined;\n\n  useEffect(() => {\n    if (state.isOpen) {\n      const optionElement = document.getElementById(\n        IdGenerator.generateIdSelectBoxOption(id, selectingValue ?? \"\")\n      );\n\n      if (!optionElement) return;\n      if (position.top === 0 && position.left === 0) return;\n\n      optionElement.scrollIntoView({\n        behavior: \"smooth\",\n        block: \"nearest\",\n        inline: \"nearest\",\n      });\n    } else {\n      setSelectingIndex(undefined);\n    }\n  }, [state, position, selectingValue]);\n\n  useEffect(() => {\n    if (state.isOpen) {\n      const handleKeydown = (e: KeyboardEvent) => {\n        if (e.key === \"ArrowDown\") {\n          e.preventDefault();\n          setSelectingIndex((prev) =>\n            typeof prev === \"number\"\n              ? Math.min(prev + 1, state.options.length - 1)\n              : 0\n          );\n        } else if (e.key === \"ArrowUp\") {\n          e.preventDefault();\n          setSelectingIndex((prev) =>\n            typeof prev === \"number\" ? Math.max(prev - 1, 0) : 0\n          );\n        } else if (e.key === \"Enter\") {\n          e.preventDefault();\n          if (typeof selectingIndex === \"number\") {\n            if (\n              state.options.length === 0 ||\n              state.options.length <= selectingIndex\n            )\n              return;\n\n            const value = state.options[selectingIndex].value;\n\n            if (!value) return;\n\n            setValue(value);\n            state.onSelect(value);\n            actions.closeOptionsWindow();\n          }\n        }\n      };\n\n      document.addEventListener(\"keydown\", handleKeydown);\n\n      return () => {\n        document.removeEventListener(\"keydown\", handleKeydown);\n      };\n    }\n  }, [state, selectingIndex, setSelectingIndex]);\n\n  useEffect(() => {\n    const searchParentElement = () => {\n      if (state.isOpen) {\n        let parentElement = document.getElementById(\n          \"ReactUI:SelectBox:OptionsArea\"\n        );\n\n        while (parentElement) {\n          if (parentElement.className.includes(\"relative\")) {\n            break;\n          }\n\n          parentElement = parentElement.parentElement;\n        }\n\n        const selectBoxElement = document.getElementById(state.selectBoxId);\n\n        if (selectBoxElement) {\n          const rect = selectBoxElement.getBoundingClientRect();\n          let top = rect.top + rect.height;\n          let left = rect.left;\n\n          if (parentElement) {\n            const parentRect = parentElement.getBoundingClientRect();\n            setPosition({\n              top: top - parentRect.top,\n              left: left - parentRect.left,\n            });\n          } else {\n            setPosition({\n              top: top + window.scrollY,\n              left: left + window.scrollX,\n            });\n          }\n        }\n      }\n    };\n\n    const timer = setTimeout(searchParentElement, 0);\n\n    return () => {\n      clearTimeout(timer);\n    };\n  }, [state.isOpen]);\n\n  useEffect(() => {\n    const onClickOutOfSelectBox = (e: MouseEvent) => {\n      if (!state.isOpen) return;\n\n      // SelectBox関連の要素を取得\n      const frameElement = document.getElementById(state.selectBoxId);\n      const optionsElement = document.getElementById(\n        \"ReactUI:SelectBox:OptionsArea\"\n      );\n\n      // クリックされた要素を取得\n      const ele = e.target;\n\n      if (ele instanceof Node && frameElement?.contains(ele)) return;\n\n      if (ele instanceof Node && optionsElement?.contains(ele)) return;\n\n      actions.setSearchText(\"\");\n      actions.closeOptionsWindow();\n    };\n\n    document.addEventListener(\"mousedown\", onClickOutOfSelectBox);\n\n    return () => {\n      document.removeEventListener(\"mousedown\", onClickOutOfSelectBox);\n    };\n  }, [state.isOpen]);\n\n  if (!state.isOpen) return <></>;\n\n  return (\n    <div\n      id={\"ReactUI:SelectBox:OptionsArea\"}\n      className=\"absolute min-w-fit max-h-[40vh] overflow-auto border border-gray-300 z-10\"\n      style={position}\n    >\n      {state.options.map((option) => (\n        <div\n          id={IdGenerator.generateIdSelectBoxOption(id, option.value ?? \"\")}\n          className={`hover:bg-gray-200 px-2 py-1 ${\n            typeof selectingValue === \"string\"\n              ? selectingValue === option.value\n                ? \"bg-gray-100\"\n                : \"bg-white\"\n              : value === option.value\n              ? \"bg-gray-100\"\n              : \"bg-white\"\n          }`}\n          key={option.value}\n          onClick={() => {\n            state.onSelect(option.value);\n            actions.closeOptionsWindow();\n          }}\n        >\n          {option.searchLabel ?? option.label}\n        </div>\n      ))}\n    </div>\n  );\n}\n"],"names":["OptionsArea","id","useIdContext","_a","useOptionsWindow","state","actions","_b","useState","value","setValue","_c","undefined","selectingIndex","setSelectingIndex","_d","top","left","position","setPosition","selectingValue","isOpen","options","length","useEffect","optionElement","document","getElementById","IdGenerator","generateIdSelectBoxOption","scrollIntoView","behavior","block","inline","handleKeydown_1","e","key","preventDefault","prev","Math","min","max","value_1","onSelect","closeOptionsWindow","addEventListener","removeEventListener","timer","setTimeout","parentElement","className","includes","selectBoxElement","selectBoxId","rect","getBoundingClientRect","top_1","height","parentRect","window","scrollY","scrollX","clearTimeout","onClickOutOfSelectBox","frameElement","optionsElement","ele","target","Node","contains","setSearchText","_jsx","style","map","option","concat","onClick","children","searchLabel","label"],"mappings":"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"}

package/dist/esm/src/select-box/parts/input-area.js

@@ -1,3 +1,3 @@
 "use client";
-import{jsx as e}from"react/jsx-runtime";import{useState as n,useMemo as t,useEffect as o}from"react";import{useIdContext as r}from"../id/provider.js";import{IdGenerator as a}from"../lib/id-generator.js";import{useOptionsWindow as i}from"../options-window/context.js";function c(c){var u,s,l,d=r(),p=i(),f=p.state,v=p.actions,m=n(""),w=m[0],x=m[1],g=t((function(){return c.options.filter((function(e){return e.searchText?e.searchText.toLowerCase().includes(w.toLowerCase()):e.searchLabel?e.searchLabel.toLowerCase().includes(w.toLowerCase()):e.label.toLowerCase().includes(w.toLowerCase())}))}),[c.options,w]);o((function(){f.isOpen&&v.setSearchText(f.searchText)}),[f]),o((function(){var e=function(e){if(f.isOpen){var n=document.getElementById(a.generateIdSelectBoxFrame(c.id)),t=document.getElementById("ReactUI:SelectBox:OptionsArea"),o=e.target;o instanceof Node&&(null==n?void 0:n.contains(o))||o instanceof Node&&(null==t?void 0:t.contains(o))||(x(""),c.close())}};return document.addEventListener("mousedown",e),function(){document.removeEventListener("mousedown",e)}}),[f]),o((function(){if(!f.isOpen){var e=document.getElementById(a.generateIdSelectBoxInputArea(c.id));if(e){var n=function(e){"ArrowDown"===e.key&&(e.preventDefault(),c.open())};return e.addEventListener("keydown",n),function(){e.removeEventListener("keydown",n)}}}}),[f,g]);var L=null!==(s=null===(u=c.options.find((function(e){return e.value===c.value})))||void 0===u?void 0:u.label)&&void 0!==s?s:"";return e("input",{id:a.generateIdSelectBoxInputArea(d),ref:c.inputRef,className:"px-2 py-1 ".concat(c.no_appearance?"no_appearance border-none focus:outline-none focus-visible:outline-none bg-transparent w-full":"border border-gray-300 w-full"),type:"text",placeholder:""===L?null!==(l=c.placeholder)&&void 0!==l?l:"選択してください":L,value:f.isOpen?f.searchText:L,onChange:function(e){e.preventDefault(),v.setSearchText(e.target.value)}})}export{c as InputArea};
+import{jsx as e}from"react/jsx-runtime";import{useMemo as t,useEffect as n}from"react";import{useIdContext as r}from"../id/provider.js";import{IdGenerator as o}from"../lib/id-generator.js";import{useOptionsWindow as a}from"../options-window/context.js";function i(i){var s,c,l,u=r(),p=a(),d=p.state,f=p.actions,v=t((function(){return d.isOpen?i.options.filter((function(e){return e.searchText?e.searchText.toLowerCase().includes(d.searchText.toLowerCase()):e.searchLabel?e.searchLabel.toLowerCase().includes(d.searchText.toLowerCase()):e.label.toLowerCase().includes(d.searchText.toLowerCase())})):[]}),[i.options,d]);n((function(){d.isOpen&&f.setSearchText(d.searchText)}),[d]),n((function(){if(!d.isOpen){var e=document.getElementById(o.generateIdSelectBoxInputArea(i.id));if(e){var t=function(e){"ArrowDown"===e.key&&(e.preventDefault(),i.open())};return e.addEventListener("keydown",t),function(){e.removeEventListener("keydown",t)}}}}),[d,v]);var x=null!==(c=null===(s=i.options.find((function(e){return e.value===i.value})))||void 0===s?void 0:s.label)&&void 0!==c?c:"";return e("input",{id:o.generateIdSelectBoxInputArea(u),ref:i.inputRef,className:"px-2 py-1 ".concat(i.no_appearance?"appearance-none border-none focus:outline-none focus-visible:outline-none bg-transparent w-full":"border border-gray-300 w-full"),type:"text",placeholder:""===x?null!==(l=i.placeholder)&&void 0!==l?l:"選択してください":x,value:d.isOpen?d.searchText:x,onChange:function(e){e.preventDefault(),f.setSearchText(e.target.value)}})}export{i as InputArea};
 //# sourceMappingURL=input-area.js.map

package/dist/esm/src/table/frame/frame.js

@@ -1,3 +1,3 @@
 "use client";
-import{jsxs as e,jsx as t,Fragment as r}from"react/jsx-runtime";import{useRef as o,useState as n,useEffect as l}from"react";import{useColumnsWidthState as c}from"../header/columns-width/context.js";import"../../../node_modules/tslib/tslib.es6.js";import{useScrollXPosition as i}from"../header/x-scroll-position/context.js";function s(s){var u=i(),a=u.x,d=u.setScrollX,m=o(null),v=n({scrollX:0,scrollY:0,barYHeight:0,barXWidth:0}),h=v[0],f=v[1],b=c();return l((function(){var e=function(){if(m.current){d(m.current.scrollLeft);var e=m.current.scrollLeft/m.current.scrollWidth*100,t=m.current.scrollTop/m.current.scrollHeight*100,r=m.current.clientHeight/m.current.scrollHeight*100,o=m.current.clientWidth/m.current.scrollWidth*100;f({scrollX:e>100?100:e,scrollY:t>100?100:t,barYHeight:r>100?100:r,barXWidth:o>100?100:o})}};return e(),m.current&&m.current.addEventListener("scroll",e),function(){m.current&&m.current.removeEventListener("scroll",e)}}),[d,b]),l((function(){m.current&&(m.current.scrollLeft=a)}),[a]),e("div",{className:"relative",style:{maxHeight:s.maxHeight,maxWidth:s.maxWidth},children:[t("div",{ref:m,id:s.id,className:"relative w-full h-full border border-gray-200 bg-white rounded-b-md overflow-auto ".concat(s.displayScroll?"":"no_scrollbar"),style:{maxHeight:s.maxHeight,maxWidth:s.maxWidth},children:s.children}),h.barYHeight<100&&e(r,{children:[t("div",{className:"absolute top-0 right-0 h-full w-2 bg-slate-200 opacity-30 pointer-events-none"}),t("div",{className:"absolute right-0 w-2 bg-slate-500 rounded-full cursor-grab active:cursor-grabbing",style:{top:"".concat(h.scrollY,"%"),height:"".concat(h.barYHeight,"%")},onMouseDown:function(e){var t,r=e.clientY,o=(null===(t=m.current)||void 0===t?void 0:t.scrollTop)||0,n=function(e){if(m.current){var t=(e.clientY-r)/h.barYHeight*100;m.current.scrollTop=o+t}},l=function(){document.removeEventListener("mousemove",n),document.removeEventListener("mouseup",l)};document.addEventListener("mousemove",n),document.addEventListener("mouseup",l)}})]}),h.barXWidth<100&&e(r,{children:[t("div",{className:"absolute bottom-0 left-0 w-full h-2 bg-slate-200 opacity-30 pointer-events-none"}),t("div",{className:"absolute bottom-0 h-2 bg-slate-500 rounded-full cursor-grab active:cursor-grabbing",style:{left:"".concat(h.scrollX,"%"),width:"".concat(h.barXWidth,"%")},onMouseDown:function(e){var t;e.preventDefault(),e.stopPropagation();var r=e.clientX,o=(null===(t=m.current)||void 0===t?void 0:t.scrollLeft)||0,n=function(t){if(m.current){e.preventDefault(),e.stopPropagation();var n=(t.clientX-r)/h.barXWidth*100;m.current.scrollLeft=o+n}},l=function(){document.removeEventListener("mousemove",n),document.removeEventListener("mouseup",l)};document.addEventListener("mousemove",n),document.addEventListener("mouseup",l)}})]})]})}export{s as Frame};
+import{jsxs as e,jsx as t,Fragment as r}from"react/jsx-runtime";import{useRef as n,useState as o,useEffect as l}from"react";import{useColumnsWidthState as c}from"../header/columns-width/context.js";import"../../../node_modules/tslib/tslib.es6.js";import{useScrollXPosition as i}from"../header/x-scroll-position/context.js";function s(s){var a=i(),u=a.x,d=a.setScrollX,m=n(null),v=o({scrollX:0,scrollY:0,barYHeight:0,barXWidth:0}),h=v[0],b=v[1],f=c();return l((function(){var e=function(){if(m.current){d(m.current.scrollLeft);var e=m.current.scrollLeft/m.current.scrollWidth*100,t=m.current.scrollTop/m.current.scrollHeight*100,r=m.current.clientHeight/m.current.scrollHeight*100,n=m.current.clientWidth/m.current.scrollWidth*100;b({scrollX:e>100?100:e,scrollY:t>100?100:t,barYHeight:r>100?100:r,barXWidth:n>100?100:n})}};return e(),m.current&&m.current.addEventListener("scroll",e),function(){m.current&&m.current.removeEventListener("scroll",e)}}),[d,f]),l((function(){m.current&&(m.current.scrollLeft=u)}),[u]),e("div",{className:"relative",style:{maxHeight:s.maxHeight,maxWidth:s.maxWidth},children:[t("style",{children:"\n          .teppen-no-scrollbar {\n            -ms-overflow-style: none;\n            scrollbar-width: none;\n          }\n          .teppen-no-scrollbar::-webkit-scrollbar {\n            display: none;\n          }\n        "}),t("div",{ref:m,id:s.id,className:"relative w-full h-full border border-gray-200 bg-white rounded-b-md overflow-auto ".concat(s.displayScroll?"":"teppen-no-scrollbar"),style:{maxHeight:s.maxHeight,maxWidth:s.maxWidth},children:s.children}),h.barYHeight<100&&e(r,{children:[t("div",{className:"absolute top-0 right-0 h-full w-2 bg-slate-200 opacity-30 pointer-events-none"}),t("div",{className:"absolute right-0 w-2 bg-slate-500 rounded-full cursor-grab active:cursor-grabbing",style:{top:"".concat(h.scrollY,"%"),height:"".concat(h.barYHeight,"%")},onMouseDown:function(e){var t,r=e.clientY,n=(null===(t=m.current)||void 0===t?void 0:t.scrollTop)||0,o=function(e){if(m.current){var t=(e.clientY-r)/h.barYHeight*100;m.current.scrollTop=n+t}},l=function(){document.removeEventListener("mousemove",o),document.removeEventListener("mouseup",l)};document.addEventListener("mousemove",o),document.addEventListener("mouseup",l)}})]}),h.barXWidth<100&&e(r,{children:[t("div",{className:"absolute bottom-0 left-0 w-full h-2 bg-slate-200 opacity-30 pointer-events-none"}),t("div",{className:"absolute bottom-0 h-2 bg-slate-500 rounded-full cursor-grab active:cursor-grabbing",style:{left:"".concat(h.scrollX,"%"),width:"".concat(h.barXWidth,"%")},onMouseDown:function(e){var t;e.preventDefault(),e.stopPropagation();var r=e.clientX,n=(null===(t=m.current)||void 0===t?void 0:t.scrollLeft)||0,o=function(t){if(m.current){e.preventDefault(),e.stopPropagation();var o=(t.clientX-r)/h.barXWidth*100;m.current.scrollLeft=n+o}},l=function(){document.removeEventListener("mousemove",o),document.removeEventListener("mouseup",l)};document.addEventListener("mousemove",o),document.addEventListener("mouseup",l)}})]})]})}export{s as Frame};
 //# sourceMappingURL=frame.js.map

package/dist/esm/src/table/header/header-v2.js

@@ -1,2 +1,2 @@
-import{jsxs as e,jsx as t}from"react/jsx-runtime";import{memo as r,useRef as i,useEffect as o,useCallback as l,useMemo as n}from"react";import{useColumnsWidthState as a}from"./columns-width/context.js";import"../../../node_modules/tslib/tslib.es6.js";import{useResizeColWidthHook as s,useScrollXRef as c}from"./header-v2-hook.js";import{AllCheckbox as d}from"../checkbox/components.js";import{ConditionSearchBar as m}from"../../search-bar/condition-search-bar/base.js";import{useTableIdGenerator as h}from"../id/provider.js";import{useFilter as u}from"../filter-v2/context.js";function p(r){var i=h(),s=a().getColumnWidth,p=u(),b=p.conditions,y=p.addFilter,v=p.removeFilter,x=c();o((function(){if(x.current){var e=x.current,t=function(t){0!==t.deltaY&&(t.preventDefault(),e.scrollLeft+=t.deltaY)};return e.addEventListener("wheel",t),function(){e.removeEventListener("wheel",t)}}}),[x]);var g=l((function(e){switch(e.type){case"add":y(e.payload.condition);break;case"remove":v(e.payload.index)}}),[]),w=n((function(){return r.cols.filter((function(e){return!!e.label&&(e.editable||!e.editable&&!e.render)})).map((function(e){switch(e.type){case"string":case"number":return{key:e.key.toString(),label:e.label,type:e.type};case"select":return{key:e.key.toString(),label:e.label,type:e.type,options:e.options}}}))}),[r.cols]);return e("div",{className:"border-gray-200 bg-gray-200 text-gray-600 rounded-t-md",style:{maxWidth:r.maxWidth},children:[t("div",{className:"py-2 px-2",children:t(m,{id:i.getTableHeaderId(),targets:w,conditions:b,onChangeCondition:g,size:"small"})}),t("div",{ref:x,className:"relative max-w-full overflow-x-auto no_scrollbar",children:e("div",{className:"flex h-[32px]",children:[r.checkbox&&t("th",{className:"w-8 h-full",children:t(d,{rows:r.rows})}),r.cols.map((function(e){return t(f,{keyName:e.key.toString(),label:e.label,colWidth:s(e.key),disableSort:e.disableSort||!e.editable&&!!e.render,generateSortButton:r.generateSortButton},e.key.toString())}))]})})]})}var f=r((function(r){var o=i(null),l=s(r.keyName).onMouseDownResizeWidth,n=o.current?r.colWidth-o.current.clientWidth:r.colWidth;return e("div",{className:"relative",style:{width:r.colWidth,maxWidth:r.colWidth,minWidth:r.colWidth},children:[e("div",{className:"flex justify-between items-center bg-gray-200 text-gray-600 h-[32px]",children:[t("div",{className:"px-2",style:{maxWidth:n},children:r.label&&t("p",{className:"text-left font-bold text-nowrap overflow-hidden text-ellipsis",children:r.label})}),t("div",{ref:o,className:"flex items-center w-fit shrink-0 gap-1 px-1",children:!r.disableSort&&r.generateSortButton&&r.generateSortButton(r.keyName)})]}),t("div",{className:"absolute top-0 right-0 grid place-items-end py-1 w-[4px] h-full cursor-col-resize",onMouseDown:l,children:t("div",{className:"w-[1px] h-full bg-white"})})]})}));export{p as TableHeader};
+import{jsxs as e,jsx as t}from"react/jsx-runtime";import{memo as r,useRef as n,useEffect as l,useCallback as o,useMemo as i}from"react";import{useColumnsWidthState as a}from"./columns-width/context.js";import"../../../node_modules/tslib/tslib.es6.js";import{useResizeColWidthHook as s,useScrollXRef as c}from"./header-v2-hook.js";import{AllCheckbox as d}from"../checkbox/components.js";import{ConditionSearchBar as m}from"../../search-bar/condition-search-bar/base.js";import{useTableIdGenerator as h}from"../id/provider.js";import{useFilter as p}from"../filter-v2/context.js";function u(r){var n=h(),s=a().getColumnWidth,u=p(),b=u.conditions,y=u.addFilter,v=u.removeFilter,x=c();l((function(){if(x.current){var e=x.current,t=function(t){0!==t.deltaY&&(t.preventDefault(),e.scrollLeft+=t.deltaY)};return e.addEventListener("wheel",t),function(){e.removeEventListener("wheel",t)}}}),[x]);var g=o((function(e){switch(e.type){case"add":y(e.payload.condition);break;case"remove":v(e.payload.index)}}),[]),w=i((function(){return r.cols.filter((function(e){return!!e.label&&(e.editable||!e.editable&&!e.render)})).map((function(e){switch(e.type){case"string":case"number":return{key:e.key.toString(),label:e.label,type:e.type};case"select":return{key:e.key.toString(),label:e.label,type:e.type,options:e.options}}}))}),[r.cols]);return e("div",{className:"border-gray-200 bg-gray-200 text-gray-600 rounded-t-md",style:{maxWidth:r.maxWidth},children:[t("div",{className:"py-2 px-2",children:t(m,{id:n.getTableHeaderId(),targets:w,conditions:b,onChangeCondition:g,size:"small"})}),t("style",{children:"\n          .teppen-no-scrollbar {\n            -ms-overflow-style: none;\n            scrollbar-width: none;\n          }\n          .teppen-no-scrollbar::-webkit-scrollbar {\n            display: none;\n          }\n        "}),t("div",{ref:x,className:"relative max-w-full overflow-x-auto teppen-no-scrollbar",children:e("div",{className:"flex h-[32px]",children:[r.checkbox&&t("th",{className:"w-8 h-full",children:t(d,{rows:r.rows})}),r.cols.map((function(e){return t(f,{keyName:e.key.toString(),label:e.label,colWidth:s(e.key),disableSort:e.disableSort||!e.editable&&!!e.render,generateSortButton:r.generateSortButton},e.key.toString())}))]})})]})}var f=r((function(r){var l=n(null),o=s(r.keyName).onMouseDownResizeWidth,i=l.current?r.colWidth-l.current.clientWidth:r.colWidth;return e("div",{className:"relative",style:{width:r.colWidth,maxWidth:r.colWidth,minWidth:r.colWidth},children:[e("div",{className:"flex justify-between items-center bg-gray-200 text-gray-600 h-[32px]",children:[t("div",{className:"px-2",style:{maxWidth:i},children:r.label&&t("p",{className:"text-left font-bold text-nowrap overflow-hidden text-ellipsis",children:r.label})}),t("div",{ref:l,className:"flex items-center w-fit shrink-0 gap-1 px-1",children:!r.disableSort&&r.generateSortButton&&r.generateSortButton(r.keyName)})]}),t("div",{className:"absolute top-0 right-0 grid place-items-end py-1 w-[4px] h-full cursor-col-resize",onMouseDown:o,children:t("div",{className:"w-[1px] h-full bg-white"})})]})}));export{u as TableHeader};
 //# sourceMappingURL=header-v2.js.map

package/dist/esm/src/table/header/header-v2.js.map

@@ -1 +1 @@
-{"version":3,"file":"header-v2.js","sources":["../../../../../src/table/header/header-v2.tsx"],"sourcesContent":["import { memo, useCallback, useEffect, useMemo, useRef } from \"react\";\nimport { DataObject, DataRecord, TTableColumn } from \"../table/type\";\nimport { useColumnsWidthState } from \"./columns-width\";\nimport { useResizeColWidthHook, useScrollXRef } from \"./header-v2-hook\";\nimport { AllCheckbox } from \"../checkbox/components\";\nimport { ConditionSearchBar } from \"../../search-bar\";\nimport { useTableIdGenerator } from \"../id\";\nimport { useFilter } from \"../filter-v2\";\nimport { TConditionChangeAction } from \"../../search-bar/condition-search-bar/condition-input-management/type\";\n\ninterface IPropsTableHeader<T extends DataRecord> {\n  cols: TTableColumn<T>[];\n  checkbox?: boolean;\n  rows: DataObject<T>[];\n  maxWidth?: string;\n  generateSortButton?: (columnKey: string) => React.ReactNode;\n}\n\nexport function TableHeader<T extends DataRecord>(props: IPropsTableHeader<T>) {\n  const idGenerator = useTableIdGenerator();\n  const { getColumnWidth } = useColumnsWidthState();\n  const { conditions, addFilter, removeFilter } = useFilter();\n  const ref = useScrollXRef();\n\n  useEffect(() => {\n    if (ref.current) {\n      const element = ref.current;\n\n      const scrollX = (e: WheelEvent) => {\n        if (e.deltaY === 0) return;\n\n        e.preventDefault();\n        element.scrollLeft += e.deltaY;\n      };\n\n      element.addEventListener(\"wheel\", scrollX);\n\n      return () => {\n        element.removeEventListener(\"wheel\", scrollX);\n      };\n    }\n  }, [ref]);\n\n  const onChangeCondition = useCallback((action: TConditionChangeAction) => {\n    switch (action.type) {\n      case \"add\":\n        addFilter(action.payload.condition);\n        break;\n      case \"remove\":\n        removeFilter(action.payload.index);\n        break;\n    }\n  }, []);\n\n  const targets = useMemo(() => {\n    return props.cols\n      .filter(\n        (col) => !!col.label && (col.editable || (!col.editable && !col.render))\n      )\n      .map((col) => {\n        switch (col.type) {\n          case \"string\":\n            return {\n              key: col.key.toString(),\n              label: col.label as string,\n              type: col.type,\n            };\n          case \"number\":\n            return {\n              key: col.key.toString(),\n              label: col.label as string,\n              type: col.type,\n            };\n          case \"select\":\n            return {\n              key: col.key.toString(),\n              label: col.label as string,\n              type: col.type,\n              options: col.options,\n            };\n        }\n      });\n  }, [props.cols]);\n\n  return (\n    <div\n      className=\"border-gray-200 bg-gray-200 text-gray-600 rounded-t-md\"\n      style={{ maxWidth: props.maxWidth }}\n    >\n      <div className=\"py-2 px-2\">\n        <ConditionSearchBar\n          id={idGenerator.getTableHeaderId()}\n          targets={targets}\n          conditions={conditions}\n          onChangeCondition={onChangeCondition}\n          size=\"small\"\n        />\n      </div>\n\n      <div\n        ref={ref}\n        className=\"relative max-w-full overflow-x-auto no_scrollbar\"\n      >\n        <div className=\"flex h-[32px]\">\n          {props.checkbox && (\n            <th className=\"w-8 h-full\">\n              <AllCheckbox rows={props.rows} />\n            </th>\n          )}\n          {props.cols.map((col) => {\n            return (\n              <HeaderElement\n                key={col.key.toString()}\n                keyName={col.key.toString()}\n                label={col.label}\n                colWidth={getColumnWidth(col.key as string)}\n                disableSort={col.disableSort || (!col.editable && !!col.render)}\n                generateSortButton={props.generateSortButton}\n              />\n            );\n          })}\n        </div>\n      </div>\n    </div>\n  );\n}\n\ninterface IPropsHeaderElement {\n  keyName: string;\n  label?: string;\n  colWidth: number;\n  disableSort?: boolean;\n  generateSortButton?: (columnKey: string) => React.ReactNode;\n}\n\nconst HeaderElement = memo(function HE(props: IPropsHeaderElement) {\n  const ref = useRef<HTMLDivElement>(null);\n  const { onMouseDownResizeWidth } = useResizeColWidthHook(props.keyName);\n\n  const maxWidthLabel = ref.current\n    ? props.colWidth - ref.current.clientWidth\n    : props.colWidth;\n\n  return (\n    <div\n      className=\"relative\"\n      style={{\n        width: props.colWidth,\n        maxWidth: props.colWidth,\n        minWidth: props.colWidth,\n      }}\n    >\n      <div\n        className={`flex justify-between items-center bg-gray-200 text-gray-600 h-[32px]`}\n      >\n        <div className=\"px-2\" style={{ maxWidth: maxWidthLabel }}>\n          {props.label && (\n            <p\n              className={`text-left font-bold text-nowrap overflow-hidden text-ellipsis`}\n            >\n              {props.label}\n            </p>\n          )}\n        </div>\n\n        <div ref={ref} className=\"flex items-center w-fit shrink-0 gap-1 px-1\">\n          {!props.disableSort &&\n            props.generateSortButton &&\n            props.generateSortButton(props.keyName)}\n        </div>\n      </div>\n      <div\n        className=\"absolute top-0 right-0 grid place-items-end py-1 w-[4px] h-full cursor-col-resize\"\n        onMouseDown={onMouseDownResizeWidth}\n      >\n        <div className={`w-[1px] h-full bg-white`} />\n      </div>\n    </div>\n  );\n});\n"],"names":["TableHeader","props","idGenerator","useTableIdGenerator","getColumnWidth","useColumnsWidthState","_a","useFilter","conditions","addFilter","removeFilter","ref","useScrollXRef","useEffect","current","element_1","scrollX_1","e","deltaY","preventDefault","scrollLeft","addEventListener","removeEventListener","onChangeCondition","useCallback","action","type","payload","condition","index","targets","useMemo","cols","filter","col","label","editable","render","map","key","toString","options","_jsxs","className","style","maxWidth","children","_jsx","ConditionSearchBar","id","getTableHeaderId","size","checkbox","AllCheckbox","rows","HeaderElement","keyName","colWidth","disableSort","generateSortButton","memo","useRef","onMouseDownResizeWidth","useResizeColWidthHook","maxWidthLabel","clientWidth","width","minWidth","onMouseDown"],"mappings":"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"}
+{"version":3,"file":"header-v2.js","sources":["../../../../../src/table/header/header-v2.tsx"],"sourcesContent":["import { memo, useCallback, useEffect, useMemo, useRef } from \"react\";\nimport { DataObject, DataRecord, TTableColumn } from \"../table/type\";\nimport { useColumnsWidthState } from \"./columns-width\";\nimport { useResizeColWidthHook, useScrollXRef } from \"./header-v2-hook\";\nimport { AllCheckbox } from \"../checkbox/components\";\nimport { ConditionSearchBar } from \"../../search-bar\";\nimport { useTableIdGenerator } from \"../id\";\nimport { useFilter } from \"../filter-v2\";\nimport { TConditionChangeAction } from \"../../search-bar/condition-search-bar/condition-input-management/type\";\n\ninterface IPropsTableHeader<T extends DataRecord> {\n  cols: TTableColumn<T>[];\n  checkbox?: boolean;\n  rows: DataObject<T>[];\n  maxWidth?: string;\n  generateSortButton?: (columnKey: string) => React.ReactNode;\n}\n\nexport function TableHeader<T extends DataRecord>(props: IPropsTableHeader<T>) {\n  const idGenerator = useTableIdGenerator();\n  const { getColumnWidth } = useColumnsWidthState();\n  const { conditions, addFilter, removeFilter } = useFilter();\n  const ref = useScrollXRef();\n\n  useEffect(() => {\n    if (ref.current) {\n      const element = ref.current;\n\n      const scrollX = (e: WheelEvent) => {\n        if (e.deltaY === 0) return;\n\n        e.preventDefault();\n        element.scrollLeft += e.deltaY;\n      };\n\n      element.addEventListener(\"wheel\", scrollX);\n\n      return () => {\n        element.removeEventListener(\"wheel\", scrollX);\n      };\n    }\n  }, [ref]);\n\n  const onChangeCondition = useCallback((action: TConditionChangeAction) => {\n    switch (action.type) {\n      case \"add\":\n        addFilter(action.payload.condition);\n        break;\n      case \"remove\":\n        removeFilter(action.payload.index);\n        break;\n    }\n  }, []);\n\n  const targets = useMemo(() => {\n    return props.cols\n      .filter(\n        (col) => !!col.label && (col.editable || (!col.editable && !col.render))\n      )\n      .map((col) => {\n        switch (col.type) {\n          case \"string\":\n            return {\n              key: col.key.toString(),\n              label: col.label as string,\n              type: col.type,\n            };\n          case \"number\":\n            return {\n              key: col.key.toString(),\n              label: col.label as string,\n              type: col.type,\n            };\n          case \"select\":\n            return {\n              key: col.key.toString(),\n              label: col.label as string,\n              type: col.type,\n              options: col.options,\n            };\n        }\n      });\n  }, [props.cols]);\n\n  return (\n    <div\n      className=\"border-gray-200 bg-gray-200 text-gray-600 rounded-t-md\"\n      style={{ maxWidth: props.maxWidth }}\n    >\n      <div className=\"py-2 px-2\">\n        <ConditionSearchBar\n          id={idGenerator.getTableHeaderId()}\n          targets={targets}\n          conditions={conditions}\n          onChangeCondition={onChangeCondition}\n          size=\"small\"\n        />\n      </div>\n\n      <style>{`\n          .teppen-no-scrollbar {\n            -ms-overflow-style: none;\n            scrollbar-width: none;\n          }\n          .teppen-no-scrollbar::-webkit-scrollbar {\n            display: none;\n          }\n        `}</style>\n      <div\n        ref={ref}\n        className=\"relative max-w-full overflow-x-auto teppen-no-scrollbar\"\n      >\n        <div className=\"flex h-[32px]\">\n          {props.checkbox && (\n            <th className=\"w-8 h-full\">\n              <AllCheckbox rows={props.rows} />\n            </th>\n          )}\n          {props.cols.map((col) => {\n            return (\n              <HeaderElement\n                key={col.key.toString()}\n                keyName={col.key.toString()}\n                label={col.label}\n                colWidth={getColumnWidth(col.key as string)}\n                disableSort={col.disableSort || (!col.editable && !!col.render)}\n                generateSortButton={props.generateSortButton}\n              />\n            );\n          })}\n        </div>\n      </div>\n    </div>\n  );\n}\n\ninterface IPropsHeaderElement {\n  keyName: string;\n  label?: string;\n  colWidth: number;\n  disableSort?: boolean;\n  generateSortButton?: (columnKey: string) => React.ReactNode;\n}\n\nconst HeaderElement = memo(function HE(props: IPropsHeaderElement) {\n  const ref = useRef<HTMLDivElement>(null);\n  const { onMouseDownResizeWidth } = useResizeColWidthHook(props.keyName);\n\n  const maxWidthLabel = ref.current\n    ? props.colWidth - ref.current.clientWidth\n    : props.colWidth;\n\n  return (\n    <div\n      className=\"relative\"\n      style={{\n        width: props.colWidth,\n        maxWidth: props.colWidth,\n        minWidth: props.colWidth,\n      }}\n    >\n      <div\n        className={`flex justify-between items-center bg-gray-200 text-gray-600 h-[32px]`}\n      >\n        <div className=\"px-2\" style={{ maxWidth: maxWidthLabel }}>\n          {props.label && (\n            <p\n              className={`text-left font-bold text-nowrap overflow-hidden text-ellipsis`}\n            >\n              {props.label}\n            </p>\n          )}\n        </div>\n\n        <div ref={ref} className=\"flex items-center w-fit shrink-0 gap-1 px-1\">\n          {!props.disableSort &&\n            props.generateSortButton &&\n            props.generateSortButton(props.keyName)}\n        </div>\n      </div>\n      <div\n        className=\"absolute top-0 right-0 grid place-items-end py-1 w-[4px] h-full cursor-col-resize\"\n        onMouseDown={onMouseDownResizeWidth}\n      >\n        <div className={`w-[1px] h-full bg-white`} />\n      </div>\n    </div>\n  );\n});\n"],"names":["TableHeader","props","idGenerator","useTableIdGenerator","getColumnWidth","useColumnsWidthState","_a","useFilter","conditions","addFilter","removeFilter","ref","useScrollXRef","useEffect","current","element_1","scrollX_1","e","deltaY","preventDefault","scrollLeft","addEventListener","removeEventListener","onChangeCondition","useCallback","action","type","payload","condition","index","targets","useMemo","cols","filter","col","label","editable","render","map","key","toString","options","_jsxs","className","style","maxWidth","children","_jsx","ConditionSearchBar","id","getTableHeaderId","size","checkbox","AllCheckbox","rows","HeaderElement","keyName","colWidth","disableSort","generateSortButton","memo","useRef","onMouseDownResizeWidth","useResizeColWidthHook","maxWidthLabel","clientWidth","width","minWidth","onMouseDown"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@teppen/react-ui",
-  "version": "1.8.0",
+  "version": "1.8.1",
   "description": "React UI Component",
   "main": "dist/cjs/src/index.js",
   "module": "dist/esm/src/index.js",