@teppen/react-ui 2.1.0 → 2.2.0

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

@@ -1,2 +1,2 @@
-"use client";import{__assign as o}from"../../../node_modules/tslib/tslib.es6.js";import{jsx as r,jsxs as e}from"react/jsx-runtime";import{useTable as i}from"./hook.js";import{TableHeaderElement as t}from"../header/header.js";import{PagenationProvider as n}from"../pagenation/providers.js";import{DisplayRange as d,Pagenation as l}from"../pagenation/components.js";import"../filter-v2/context.js";import{FilterProvider as s}from"../filter-v2/provider.js";import"../sort/icon.js";import{SortProvider as c}from"../sort/provider.js";import{ColumnsProvider as a}from"../sheet/providers.js";import{CheckboxProvider as m,CheckboxStatusProvider as p}from"../checkbox/provider.js";import{EditProvider as h}from"../edit/provider.js";import{TablePropertyProvider as f}from"../table-property/provider.js";import{KeyboardSetting as v}from"../operation/components/keyboard-setting.js";import{Row as x}from"../sheet/components.js";import{PasteProvider as j}from"../paste/provider.js";import{generateFormattingString as u}from"../libs/conditional-formatting.js";import{Editor as g}from"../edit/ui/editor.js";import{RangeProvider as w,TestRange as b}from"../range/provider.js";import{CopyProvider as k}from"../copy/provider.js";import{CopiedMessage as y}from"../copy/components.js";import{TableIdGeneratorProvider as C,useTableIdGenerator as N}from"../id/provider.js";import{TableHeader as R}from"../header/header-v2.js";import"../header/columns-width/context.js";import{ColumnsWidthProvider as I,ColumnsWidthStyle as S}from"../header/columns-width/provider.js";import"../header/x-scroll-position/context.js";import{ScrollXPositionProvider as F}from"../header/x-scroll-position/provider.js";import{Frame as P}from"../frame/frame.js";import{ComponentProvider as H,useGenerateSortButton as W}from"./component-provider/provider.js";import{SelectBoxProvider as D}from"../../select-box/provider.js";function T(i){var t,d,l,x,u,g;return r(H,{children:r(C,{id:i.id,children:r(I,{cols:i.cols,children:r(s,{initialConditions:[],children:r(c,{initialCondition:null===(t=i.initialCondition)||void 0===t?void 0:t.sort,children:r(n,{rowCount:i.rows.length,perPage:null===(u=null!==(l=null===(d=i.initialCondition)||void 0===d?void 0:d.pagination)&&void 0!==l?l:null===(x=i.initialCondition)||void 0===x?void 0:x.pagenation)||void 0===u?void 0:u.rowCountPerPage,children:r(m,{checkbox:i.checkbox,children:r(p,{checkboxCount:i.rows.length,children:r(a,{cols:i.cols,errorHandler:i.errorHandler,children:r(h,{children:r(f,{children:r(w,{children:e(k,{rows:i.rows,cols:i.cols,children:[r(y,{}),e(j,{rows:i.rows,cols:i.cols,onUpdateRowFunction:i.onUpdateRow,onPasteError:i.onPasteError,children:[r(v,{enableDeprecatedCopy:null===(g=i.deprecatedOptions)||void 0===g?void 0:g.enableDeprecatedCopy}),r(F,{children:r(A,o({},i))})]})]})})})})})})})})})})})})})}function A(o){var n=i(o),s=n.cols,c=n.rowMaps,a=n.pageRowIds,m=N(),p=W();return e("div",{className:"w-full max-w-full max-h-full",children:[e("div",{children:[r(R,{cols:s,checkbox:!!o.checkbox,rows:o.rows,maxWidth:o.maxWidth,generateSortButton:p}),r(S,{scopeId:m.getTableId()}),r(D,{children:e(P,{id:m.getTableId(),maxHeight:o.maxHeight,maxWidth:o.maxWidth,displayScroll:!1,children:[e("table",{className:"table",children:[r("thead",{children:e("tr",{children:[o.checkbox&&r("th",{className:"p-px"}),s.map((function(o){return r(t,{keyname:o.key.toString()},o.key.toString())}))]})}),e("tbody",{children:[0===a.length&&r("tr",{children:r("td",{colSpan:s.length+(o.checkbox?1:0),className:"px-px py-5",children:r("p",{className:"text-center font-bold text-lg",children:"NO DATA"})})}),a.map((function(e,i){return r(x,{existCheckbox:!!o.checkbox,rowIndex:i,row:c[e].data,cols:o.cols,onClickRow:o.onClickRow,applyRowFormatting:o.applyRowFormatting,conditionalFormattingString:u(c[e].data,s,o.conditionalFormattings)},e)}))]})]}),r(b,{}),r(g,{rowMaps:c,pageRowIds:a})]})})]}),e("div",{className:"mt-1",children:[r(d,{}),r("div",{className:"mt-2",children:r(l,{})})]})]})}export{T as default};
+"use client";import{__assign as o}from"../../../node_modules/tslib/tslib.es6.js";import{jsx as r,jsxs as e}from"react/jsx-runtime";import{useTable as i}from"./hook.js";import{TableHeaderElement as t}from"../header/header.js";import{PagenationProvider as n}from"../pagenation/providers.js";import{DisplayRange as l,Pagenation as d}from"../pagenation/components.js";import"../filter-v2/context.js";import{FilterProvider as c}from"../filter-v2/provider.js";import"../sort/icon.js";import{SortProvider as s}from"../sort/provider.js";import{ColumnsProvider as a}from"../sheet/providers.js";import{CheckboxProvider as m,CheckboxStatusProvider as p}from"../checkbox/provider.js";import{EditProvider as h}from"../edit/provider.js";import{TablePropertyProvider as f}from"../table-property/provider.js";import{KeyboardSetting as v}from"../operation/components/keyboard-setting.js";import{KeyCatcher as j}from"../operation/components/key-catcher.js";import{Row as x}from"../sheet/components.js";import{PasteProvider as u}from"../paste/provider.js";import{generateFormattingString as g}from"../libs/conditional-formatting.js";import{Editor as w}from"../edit/ui/editor.js";import{RangeProvider as b,TestRange as k}from"../range/provider.js";import{CopyProvider as y}from"../copy/provider.js";import{CopiedMessage as C}from"../copy/components.js";import{TableIdGeneratorProvider as N,useTableIdGenerator as R}from"../id/provider.js";import{TableHeader as I}from"../header/header-v2.js";import"../header/columns-width/context.js";import{ColumnsWidthProvider as S,ColumnsWidthStyle as F}from"../header/columns-width/provider.js";import"../header/x-scroll-position/context.js";import{ScrollXPositionProvider as P}from"../header/x-scroll-position/provider.js";import{Frame as H}from"../frame/frame.js";import{ComponentProvider as W,useGenerateSortButton as D}from"./component-provider/provider.js";import{SelectBoxProvider as T}from"../../select-box/provider.js";import{LocaleProvider as A}from"../locale/provider.js";function E(i){var t,l,d,j,x,g;return r(A,{locale:i.locale,children:r(W,{children:r(N,{id:i.id,children:r(S,{cols:i.cols,children:r(c,{initialConditions:[],children:r(s,{initialCondition:null===(t=i.initialCondition)||void 0===t?void 0:t.sort,children:r(n,{rowCount:i.rows.length,perPage:null===(x=null!==(d=null===(l=i.initialCondition)||void 0===l?void 0:l.pagination)&&void 0!==d?d:null===(j=i.initialCondition)||void 0===j?void 0:j.pagenation)||void 0===x?void 0:x.rowCountPerPage,children:r(m,{checkbox:i.checkbox,children:r(p,{checkboxCount:i.rows.length,children:r(a,{cols:i.cols,errorHandler:i.errorHandler,children:r(h,{children:r(f,{children:r(b,{children:e(y,{rows:i.rows,cols:i.cols,children:[r(C,{}),e(u,{rows:i.rows,cols:i.cols,onUpdateRowFunction:i.onUpdateRow,onPasteError:i.onPasteError,children:[r(v,{enableDeprecatedCopy:null===(g=i.deprecatedOptions)||void 0===g?void 0:g.enableDeprecatedCopy}),r(P,{children:r(M,o({},i))})]})]})})})})})})})})})})})})})})}function M(o){var n=i(o),c=n.cols,s=n.rowMaps,a=n.pageRowIds,m=R(),p=D();return e("div",{className:"w-full max-w-full max-h-full",children:[e("div",{children:[r(I,{cols:c,checkbox:!!o.checkbox,rows:o.rows,maxWidth:o.maxWidth,generateSortButton:p}),r(F,{scopeId:m.getTableId()}),r(T,{children:e(H,{id:m.getTableId(),maxHeight:o.maxHeight,maxWidth:o.maxWidth,displayScroll:!1,children:[e("table",{className:"table",children:[r("thead",{children:e("tr",{children:[o.checkbox&&r("th",{className:"p-px"}),c.map((function(o){return r(t,{keyname:o.key.toString()},o.key.toString())}))]})}),e("tbody",{children:[0===a.length&&r("tr",{children:r("td",{colSpan:c.length+(o.checkbox?1:0),className:"px-px py-5",children:r("p",{className:"text-center font-bold text-lg",children:"NO DATA"})})}),a.map((function(e,i){return r(x,{existCheckbox:!!o.checkbox,rowIndex:i,row:s[e].data,cols:o.cols,onClickRow:o.onClickRow,applyRowFormatting:o.applyRowFormatting,conditionalFormattingString:g(s[e].data,c,o.conditionalFormattings)},e)}))]})]}),r(k,{}),r(j,{}),r(w,{rowMaps:s,pageRowIds:a})]})})]}),e("div",{className:"mt-1",children:[r(l,{}),r("div",{className:"mt-2",children:r(d,{})})]})]})}export{E as default};
 //# sourceMappingURL=base.js.map

package/dist/esm/src/table/table/base.js.map

@@ -1 +1 @@
-{"version":3,"file":"base.js","sources":["../../../../../src/table/table/base.tsx"],"sourcesContent":["\"use client\";\n\nimport { useTable } from \"./hook\";\nimport { TableHeaderElement } from \"../header/header\";\nimport {\n  DataRecord,\n  TConditionalFormatting,\n  TPropsTable,\n  TTableColumn,\n} from \"./type\";\nimport { PagenationProvider, DisplayRange, Pagenation } from \"../pagenation\";\nimport { FilterProvider } from \"../filter-v2\";\nimport { SortProvider } from \"../sort\";\nimport { ColumnsProvider } from \"../sheet/providers\";\nimport { CheckboxProvider, CheckboxStatusProvider } from \"../checkbox/provider\";\nimport { EditProvider } from \"../edit/provider\";\nimport { TablePropertyProvider } from \"../table-property/provider\";\nimport { KeyboardSetting } from \"../operation/components/keyboard-setting\";\nimport { Row } from \"../sheet/components\";\nimport { PasteProvider } from \"../paste/provider\";\nimport { generateFormattingString } from \"../libs/conditional-formatting\";\nimport { Editor } from \"../edit/ui/editor\";\nimport { RangeProvider, TestRange } from \"../range/provider\";\nimport { CopyProvider } from \"../copy/provider\";\nimport { CopiedMessage } from \"../copy/components\";\nimport { TableIdGeneratorProvider, useTableIdGenerator } from \"../id\";\nimport { TableHeader } from \"../header/header-v2\";\nimport {\n  ColumnsWidthProvider,\n  ColumnsWidthStyle,\n  ScrollXPositionProvider,\n} from \"../header\";\nimport { Frame } from \"../frame\";\nimport { ComponentProvider } from \"./component-provider\";\nimport { useGenerateSortButton } from \"./component-provider/provider\";\nimport { SelectBoxProvider } from \"../../select-box/provider\";\n\nexport default function Table<T extends DataRecord>(props: TPropsTable<T>) {\n  return (\n    <ComponentProvider>\n      <TableIdGeneratorProvider id={props.id}>\n        <ColumnsWidthProvider cols={props.cols as TTableColumn<DataRecord>[]}>\n          <FilterProvider initialConditions={[]}>\n            <SortProvider initialCondition={props.initialCondition?.sort}>\n              <PagenationProvider\n                rowCount={props.rows.length}\n                perPage={\n                  (\n                    props.initialCondition?.pagination ??\n                    props.initialCondition?.pagenation\n                  )?.rowCountPerPage\n                }\n              >\n                <CheckboxProvider checkbox={props.checkbox}>\n                  <CheckboxStatusProvider checkboxCount={props.rows.length}>\n                    <ColumnsProvider\n                      cols={props.cols}\n                      errorHandler={props.errorHandler}\n                    >\n                      <EditProvider>\n                        <TablePropertyProvider>\n                          <RangeProvider>\n                            <CopyProvider rows={props.rows} cols={props.cols}>\n                              <CopiedMessage />\n                              <PasteProvider\n                                rows={props.rows}\n                                cols={props.cols}\n                                onUpdateRowFunction={props.onUpdateRow}\n                                onPasteError={props.onPasteError}\n                              >\n                                <KeyboardSetting\n                                  enableDeprecatedCopy={\n                                    props.deprecatedOptions\n                                      ?.enableDeprecatedCopy\n                                  }\n                                />\n                                <ScrollXPositionProvider>\n                                  <BaseTable {...props} />\n                                </ScrollXPositionProvider>\n                              </PasteProvider>\n                            </CopyProvider>\n                          </RangeProvider>\n                        </TablePropertyProvider>\n                      </EditProvider>\n                    </ColumnsProvider>\n                  </CheckboxStatusProvider>\n                </CheckboxProvider>\n              </PagenationProvider>\n            </SortProvider>\n          </FilterProvider>\n        </ColumnsWidthProvider>\n      </TableIdGeneratorProvider>\n    </ComponentProvider>\n  );\n}\n\nfunction BaseTable<T extends DataRecord>(props: TPropsTable<T>) {\n  const { cols, rowMaps, pageRowIds } = useTable<T>(props);\n  const IdGenerator = useTableIdGenerator();\n  const generateSortButton = useGenerateSortButton();\n\n  return (\n    <div className=\"w-full max-w-full max-h-full\">\n      <div>\n        <TableHeader\n          cols={cols}\n          checkbox={!!props.checkbox}\n          rows={props.rows}\n          maxWidth={props.maxWidth}\n          generateSortButton={generateSortButton}\n        />\n\n        <ColumnsWidthStyle scopeId={IdGenerator.getTableId()} />\n        <SelectBoxProvider>\n          <Frame\n            id={IdGenerator.getTableId()}\n            maxHeight={props.maxHeight}\n            maxWidth={props.maxWidth}\n            displayScroll={false}\n          >\n            <table className={`table`}>\n              <thead>\n                <tr>\n                  {props.checkbox && <th className=\"p-px\"></th>}\n                  {cols.map((col) => (\n                    <TableHeaderElement\n                      key={col.key.toString()}\n                      keyname={col.key.toString()}\n                    />\n                  ))}\n                </tr>\n              </thead>\n              <tbody>\n                {pageRowIds.length === 0 && (\n                  <tr>\n                    <td\n                      colSpan={cols.length + (props.checkbox ? 1 : 0)}\n                      className=\"px-px py-5\"\n                    >\n                      <p className=\"text-center font-bold text-lg\">NO DATA</p>\n                    </td>\n                  </tr>\n                )}\n                {pageRowIds.map((rowId, i) => (\n                  <Row\n                    key={rowId}\n                    existCheckbox={!!props.checkbox}\n                    rowIndex={i}\n                    row={rowMaps[rowId].data}\n                    cols={props.cols as TTableColumn<DataRecord>[]}\n                    onClickRow={props.onClickRow}\n                    applyRowFormatting={props.applyRowFormatting}\n                    conditionalFormattingString={generateFormattingString(\n                      rowMaps[rowId].data,\n                      cols as TTableColumn<DataRecord>[],\n                      props.conditionalFormattings as TConditionalFormatting<DataRecord>[]\n                    )}\n                  />\n                ))}\n              </tbody>\n            </table>\n            <TestRange />\n            <Editor rowMaps={rowMaps} pageRowIds={pageRowIds} />\n          </Frame>\n        </SelectBoxProvider>\n      </div>\n      <div className=\"mt-1\">\n        <DisplayRange />\n        <div className=\"mt-2\">\n          <Pagenation />\n        </div>\n      </div>\n    </div>\n  );\n}\n"],"names":["Table","props","_jsx","ComponentProvider","children","TableIdGeneratorProvider","id","ColumnsWidthProvider","cols","FilterProvider","initialConditions","SortProvider","initialCondition","_a","sort","PagenationProvider","rowCount","rows","length","perPage","_e","_c","_b","pagination","_d","pagenation","rowCountPerPage","CheckboxProvider","checkbox","CheckboxStatusProvider","checkboxCount","ColumnsProvider","errorHandler","EditProvider","TablePropertyProvider","RangeProvider","_jsxs","CopyProvider","CopiedMessage","PasteProvider","onUpdateRowFunction","onUpdateRow","onPasteError","KeyboardSetting","enableDeprecatedCopy","_f","deprecatedOptions","ScrollXPositionProvider","BaseTable","__assign","useTable","rowMaps","pageRowIds","IdGenerator","useTableIdGenerator","generateSortButton","useGenerateSortButton","className","TableHeader","maxWidth","ColumnsWidthStyle","scopeId","getTableId","SelectBoxProvider","Frame","maxHeight","displayScroll","map","col","TableHeaderElement","keyname","key","toString","colSpan","rowId","i","Row","existCheckbox","rowIndex","row","data","onClickRow","applyRowFormatting","conditionalFormattingString","generateFormattingString","conditionalFormattings","TestRange","Editor","DisplayRange","Pagenation"],"mappings":"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"}
+{"version":3,"file":"base.js","sources":["../../../../../src/table/table/base.tsx"],"sourcesContent":["\"use client\";\n\nimport { useTable } from \"./hook\";\nimport { TableHeaderElement } from \"../header/header\";\nimport {\n  DataRecord,\n  TConditionalFormatting,\n  TPropsTable,\n  TTableColumn,\n} from \"./type\";\nimport { PagenationProvider, DisplayRange, Pagenation } from \"../pagenation\";\nimport { FilterProvider } from \"../filter-v2\";\nimport { SortProvider } from \"../sort\";\nimport { ColumnsProvider } from \"../sheet/providers\";\nimport { CheckboxProvider, CheckboxStatusProvider } from \"../checkbox/provider\";\nimport { EditProvider } from \"../edit/provider\";\nimport { TablePropertyProvider } from \"../table-property/provider\";\nimport { KeyboardSetting } from \"../operation/components/keyboard-setting\";\nimport { KeyCatcher } from \"../operation/components/key-catcher\";\nimport { Row } from \"../sheet/components\";\nimport { PasteProvider } from \"../paste/provider\";\nimport { generateFormattingString } from \"../libs/conditional-formatting\";\nimport { Editor } from \"../edit/ui/editor\";\nimport { RangeProvider, TestRange } from \"../range/provider\";\nimport { CopyProvider } from \"../copy/provider\";\nimport { CopiedMessage } from \"../copy/components\";\nimport { TableIdGeneratorProvider, useTableIdGenerator } from \"../id\";\nimport { TableHeader } from \"../header/header-v2\";\nimport {\n  ColumnsWidthProvider,\n  ColumnsWidthStyle,\n  ScrollXPositionProvider,\n} from \"../header\";\nimport { Frame } from \"../frame\";\nimport { ComponentProvider } from \"./component-provider\";\nimport { useGenerateSortButton } from \"./component-provider/provider\";\nimport { SelectBoxProvider } from \"../../select-box/provider\";\nimport { LocaleProvider } from \"../locale/provider\";\n\nexport default function Table<T extends DataRecord>(props: TPropsTable<T>) {\n  return (\n    <LocaleProvider locale={props.locale}>\n      <ComponentProvider>\n        <TableIdGeneratorProvider id={props.id}>\n          <ColumnsWidthProvider cols={props.cols as TTableColumn<DataRecord>[]}>\n            <FilterProvider initialConditions={[]}>\n              <SortProvider initialCondition={props.initialCondition?.sort}>\n                <PagenationProvider\n                  rowCount={props.rows.length}\n                  perPage={\n                    (\n                      props.initialCondition?.pagination ??\n                      props.initialCondition?.pagenation\n                    )?.rowCountPerPage\n                  }\n                >\n                  <CheckboxProvider checkbox={props.checkbox}>\n                    <CheckboxStatusProvider checkboxCount={props.rows.length}>\n                      <ColumnsProvider\n                        cols={props.cols}\n                        errorHandler={props.errorHandler}\n                      >\n                        <EditProvider>\n                          <TablePropertyProvider>\n                            <RangeProvider>\n                              <CopyProvider rows={props.rows} cols={props.cols}>\n                                <CopiedMessage />\n                                <PasteProvider\n                                  rows={props.rows}\n                                  cols={props.cols}\n                                  onUpdateRowFunction={props.onUpdateRow}\n                                  onPasteError={props.onPasteError}\n                                >\n                                  <KeyboardSetting\n                                    enableDeprecatedCopy={\n                                      props.deprecatedOptions\n                                        ?.enableDeprecatedCopy\n                                    }\n                                  />\n                                  <ScrollXPositionProvider>\n                                    <BaseTable {...props} />\n                                  </ScrollXPositionProvider>\n                                </PasteProvider>\n                              </CopyProvider>\n                            </RangeProvider>\n                          </TablePropertyProvider>\n                        </EditProvider>\n                      </ColumnsProvider>\n                    </CheckboxStatusProvider>\n                  </CheckboxProvider>\n                </PagenationProvider>\n              </SortProvider>\n            </FilterProvider>\n          </ColumnsWidthProvider>\n        </TableIdGeneratorProvider>\n      </ComponentProvider>\n    </LocaleProvider>\n  );\n}\n\nfunction BaseTable<T extends DataRecord>(props: TPropsTable<T>) {\n  const { cols, rowMaps, pageRowIds } = useTable<T>(props);\n  const IdGenerator = useTableIdGenerator();\n  const generateSortButton = useGenerateSortButton();\n\n  return (\n    <div className=\"w-full max-w-full max-h-full\">\n      <div>\n        <TableHeader\n          cols={cols}\n          checkbox={!!props.checkbox}\n          rows={props.rows}\n          maxWidth={props.maxWidth}\n          generateSortButton={generateSortButton}\n        />\n\n        <ColumnsWidthStyle scopeId={IdGenerator.getTableId()} />\n        <SelectBoxProvider>\n          <Frame\n            id={IdGenerator.getTableId()}\n            maxHeight={props.maxHeight}\n            maxWidth={props.maxWidth}\n            displayScroll={false}\n          >\n            <table className={`table`}>\n              <thead>\n                <tr>\n                  {props.checkbox && <th className=\"p-px\"></th>}\n                  {cols.map((col) => (\n                    <TableHeaderElement\n                      key={col.key.toString()}\n                      keyname={col.key.toString()}\n                    />\n                  ))}\n                </tr>\n              </thead>\n              <tbody>\n                {pageRowIds.length === 0 && (\n                  <tr>\n                    <td\n                      colSpan={cols.length + (props.checkbox ? 1 : 0)}\n                      className=\"px-px py-5\"\n                    >\n                      <p className=\"text-center font-bold text-lg\">NO DATA</p>\n                    </td>\n                  </tr>\n                )}\n                {pageRowIds.map((rowId, i) => (\n                  <Row\n                    key={rowId}\n                    existCheckbox={!!props.checkbox}\n                    rowIndex={i}\n                    row={rowMaps[rowId].data}\n                    cols={props.cols as TTableColumn<DataRecord>[]}\n                    onClickRow={props.onClickRow}\n                    applyRowFormatting={props.applyRowFormatting}\n                    conditionalFormattingString={generateFormattingString(\n                      rowMaps[rowId].data,\n                      cols as TTableColumn<DataRecord>[],\n                      props.conditionalFormattings as TConditionalFormatting<DataRecord>[]\n                    )}\n                  />\n                ))}\n              </tbody>\n            </table>\n            <TestRange />\n            <KeyCatcher />\n            <Editor rowMaps={rowMaps} pageRowIds={pageRowIds} />\n          </Frame>\n        </SelectBoxProvider>\n      </div>\n      <div className=\"mt-1\">\n        <DisplayRange />\n        <div className=\"mt-2\">\n          <Pagenation />\n        </div>\n      </div>\n    </div>\n  );\n}\n"],"names":["Table","props","_jsx","LocaleProvider","locale","children","ComponentProvider","TableIdGeneratorProvider","id","ColumnsWidthProvider","cols","FilterProvider","initialConditions","SortProvider","initialCondition","_a","sort","PagenationProvider","rowCount","rows","length","perPage","_e","_c","_b","pagination","_d","pagenation","rowCountPerPage","CheckboxProvider","checkbox","CheckboxStatusProvider","checkboxCount","ColumnsProvider","errorHandler","EditProvider","TablePropertyProvider","RangeProvider","_jsxs","CopyProvider","CopiedMessage","PasteProvider","onUpdateRowFunction","onUpdateRow","onPasteError","KeyboardSetting","enableDeprecatedCopy","_f","deprecatedOptions","ScrollXPositionProvider","BaseTable","__assign","useTable","rowMaps","pageRowIds","IdGenerator","useTableIdGenerator","generateSortButton","useGenerateSortButton","className","TableHeader","maxWidth","ColumnsWidthStyle","scopeId","getTableId","SelectBoxProvider","Frame","maxHeight","displayScroll","map","col","TableHeaderElement","keyname","key","toString","colSpan","rowId","i","Row","existCheckbox","rowIndex","row","data","onClickRow","applyRowFormatting","conditionalFormattingString","generateFormattingString","conditionalFormattings","TestRange","KeyCatcher","Editor","DisplayRange","Pagenation"],"mappings":"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"}

package/dist/index.d.ts

@@ -7,31 +7,6 @@ type TPasteError = {
     message: string;
 };
 
-interface Options {
-    /**
-     * The label is the string that will be displayed for the option.
-     */
-    label: string;
-    /**
-     * The value is the value of the option and will not be displayed.
-     */
-    value: string;
-    /**
-     * The searchLabel is the string that will be displayed in the list of options when the user is selecting an option.
-     * The difference between label and searchLabel is that label is the string displayed when the option is selected,
-     * while searchLabel is the string displayed in the list of options during selection.
-     * If searchLabel is undefined, the list of options will display the label.
-     */
-    searchLabel?: string;
-    /**
-     * The searchText is the string used for searching and filtering the list of options.
-     * For example, in the case of Japanese options, you can use hiragana or katakana readings in searchText,
-     * allowing users to search using hiragana even if the displayed label is in kanji.
-     * If searchText is undefined, the search will use searchLabel if defined, otherwise it will use label.
-     */
-    searchText?: string;
-}
-
 type TStringValidateOption = {
     maxLength?: number;
     minLength?: number;
@@ -72,6 +47,34 @@ type TErrorValidation = {
     type: "NOT_DATETIME";
 });
 
+/** Language of the messages the table shows by itself. */
+type TLocale = "ja" | "en";
+
+interface Options {
+    /**
+     * The label is the string that will be displayed for the option.
+     */
+    label: string;
+    /**
+     * The value is the value of the option and will not be displayed.
+     */
+    value: string;
+    /**
+     * The searchLabel is the string that will be displayed in the list of options when the user is selecting an option.
+     * The difference between label and searchLabel is that label is the string displayed when the option is selected,
+     * while searchLabel is the string displayed in the list of options during selection.
+     * If searchLabel is undefined, the list of options will display the label.
+     */
+    searchLabel?: string;
+    /**
+     * The searchText is the string used for searching and filtering the list of options.
+     * For example, in the case of Japanese options, you can use hiragana or katakana readings in searchText,
+     * allowing users to search using hiragana even if the displayed label is in kanji.
+     * If searchText is undefined, the search will use searchLabel if defined, otherwise it will use label.
+     */
+    searchText?: string;
+}
+
 type DataRecord = Record<string, string | number | Date>;
 type DataObject<T extends DataRecord> = T & {
     id: number | string;
@@ -144,6 +147,11 @@ type TConditionalFormatting<T extends DataRecord> = {
 };
 type TailwindCssStyle = string;
 type TPaginationCondition = {
+    /**
+     * Rows per page. Defaults to 50.
+     * "all" renders every row at once and gets slow with many rows; use
+     * pagination for more than about 1,000 rows.
+     */
     rowCountPerPage?: 20 | 50 | 100 | "all";
 };
 type TPropsTable<T extends DataRecord> = {
@@ -171,6 +179,11 @@ type TPropsTable<T extends DataRecord> = {
      * table or targets a read-only column. Defaults to window.alert.
      */
     onPasteError?: (error: TPasteError) => void;
+    /**
+     * Language of the messages the table shows by itself, such as the default
+     * validation alert and the "copied" notice. Defaults to "ja".
+     */
+    locale?: TLocale;
     deprecatedOptions?: {
         enableDeprecatedCopy?: boolean;
     };
@@ -292,4 +305,4 @@ interface IReturnFileUploader {
 }
 declare function useFileUploader(props: IPropsFileUploader): IReturnFileUploader;
 
-export { type DataObject, type DataRecord, FileUploader, type FileUploaderProps, type Options, type TColumnType, type TConditionalFormatting, type TErrorValidation, type TNumberValidateOption, type TPasteError, type TPropsTable, type TStringValidateOption, type TTableColumn, Table, useFileUploader };
+export { type DataObject, type DataRecord, FileUploader, type FileUploaderProps, type Options, type TColumnType, type TConditionalFormatting, type TErrorValidation, type TLocale, type TNumberValidateOption, type TPasteError, type TPropsTable, type TStringValidateOption, type TTableColumn, Table, useFileUploader };

package/package.json

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