@sberbusiness/triplex-next 1.42.0 → 1.44.0

package/components/Table/TableBasic/TableBasic.js

@@ -1,69 +1,69 @@
 import { jsxs, jsx } from "react/jsx-runtime";
-import { useContext, useEffect } from "react";
-import { i as isEqual } from "../../../chunks/vendor-DfvHt3TJ.js";
+import React__default, { useContext, useEffect } from "react";
+import { i as isEqual } from "../../../chunks/vendor-D4wvHis9.js";
 import { MasterTableContext } from "../MasterTableContext.js";
-import { s as styles } from "../../../chunks/utils-BO2qfDaA.js";
+import { s as styles } from "../../../chunks/utils-BL5AUOKS.js";
 import { TableBasicHeader } from "./components/TableBasicHeader.js";
 import { TableBasicBody } from "./components/TableBasicBody.js";
 import { LoaderMiddle } from "../../Loader/LoaderMiddle/LoaderMiddle.js";
 import { LoaderScreen } from "../../LoaderScreen/LoaderScreen.js";
-const TableBasic = ({
-  columns,
-  data,
-  highlightRowOnHover,
-  onOrderBy,
-  onClickRow,
-  renderNoColumns,
-  renderNoData,
-  headless,
-  ...htmlTableAttributes
-}) => {
-  const context = useContext(MasterTableContext);
-  const isEmptyData = data.length === 0;
-  useEffect(() => {
-    if (!isEqual(columns, context.columns)) {
-      context.setColumns(columns);
-    }
-  }, [columns, context]);
-  const renderTable = () => {
-    if (columns.every((c) => c.hidden) && renderNoColumns) {
-      return renderNoColumns();
-    }
-    return /* @__PURE__ */ jsxs("table", { ...htmlTableAttributes, children: [
-      headless || /* @__PURE__ */ jsx(TableBasicHeader, { columns, onOrderBy }),
-      /* @__PURE__ */ jsx(
-        TableBasicBody,
-        {
-          columns,
-          data,
-          onClickRow,
-          highlightRowOnHover
-        }
-      )
-    ] }, "table");
-  };
-  const renderFooter = (isEmptyData2) => {
-    const { loading } = context;
-    if (loading && isEmptyData2) {
-      return renderFooterEmptyData(renderNoDataLoading());
-    } else if (!loading && isEmptyData2) {
-      return renderFooterEmptyData(renderNoData());
-    } else if (loading && !isEmptyData2) {
-      return /* @__PURE__ */ jsx("div", { className: styles.spinnerWrapper, children: /* @__PURE__ */ jsx(LoaderScreen, { type: "middle", className: styles.tableLoaderScreen }) });
-    } else {
+const TableBasic = React__default.forwardRef(
+  ({
+    columns,
+    data,
+    highlightRowOnHover,
+    onOrderBy,
+    onClickRow,
+    renderNoColumns,
+    renderNoData,
+    headless,
+    ...htmlTableAttributes
+  }, ref) => {
+    const { columns: contextColumns, loading, setColumns } = useContext(MasterTableContext);
+    const isEmptyData = data.length === 0;
+    useEffect(() => {
+      if (!isEqual(columns, contextColumns)) {
+        setColumns(columns);
+      }
+    }, [columns, contextColumns, setColumns]);
+    const renderTable = () => {
+      if (columns.every((column) => column.hidden) && renderNoColumns) {
+        return renderNoColumns();
+      }
+      return /* @__PURE__ */ jsxs("table", { ...htmlTableAttributes, ref, children: [
+        headless || /* @__PURE__ */ jsx(TableBasicHeader, { columns, onOrderBy }),
+        /* @__PURE__ */ jsx(
+          TableBasicBody,
+          {
+            columns,
+            data,
+            onClickRow,
+            highlightRowOnHover
+          }
+        )
+      ] });
+    };
+    const renderFooter = () => {
+      if (loading && isEmptyData) {
+        return /* @__PURE__ */ jsxs("div", { className: styles.footerEmptyData, children: [
+          /* @__PURE__ */ jsx("div", { className: styles.overlayCover }),
+          /* @__PURE__ */ jsx(LoaderMiddle, {})
+        ] });
+      }
+      if (isEmptyData) {
+        return /* @__PURE__ */ jsx("div", { className: styles.footerEmptyData, children: renderNoData() });
+      }
+      if (loading) {
+        return /* @__PURE__ */ jsx("div", { className: styles.spinnerWrapper, children: /* @__PURE__ */ jsx(LoaderScreen, { type: "middle", className: styles.tableLoaderScreen }) });
+      }
       return null;
-    }
-  };
-  const renderFooterEmptyData = (content) => /* @__PURE__ */ jsx("div", { className: styles.footerEmptyData, children: content });
-  const renderNoDataLoading = () => [
-    /* @__PURE__ */ jsx("div", { className: styles.overlayCover }, "overlay"),
-    /* @__PURE__ */ jsx(LoaderMiddle, {}, "spinner")
-  ];
-  return /* @__PURE__ */ jsxs("div", { className: styles.tableBasic, children: [
-    renderTable(),
-    renderFooter(isEmptyData)
-  ] });
-};
+    };
+    return /* @__PURE__ */ jsxs("div", { className: styles.tableBasic, children: [
+      renderTable(),
+      renderFooter()
+    ] });
+  }
+);
 TableBasic.displayName = "TableBasic";
 export {
   TableBasic

package/components/Table/TableBasic/TableBasic.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableBasic.js","sources":["../../../../src/components/Table/TableBasic/TableBasic.tsx"],"sourcesContent":["import React, { useContext, useEffect } from \"react\";\nimport isEqual from \"lodash-es/isEqual\";\nimport { MasterTableContext } from \"@sberbusiness/triplex-next/components/Table/MasterTableContext\";\nimport styles from \"./styles/TableBasic.module.less\";\nimport { TableBasicHeader } from \"@sberbusiness/triplex-next/components/Table/TableBasic/components/TableBasicHeader\";\nimport { TableBasicBody } from \"@sberbusiness/triplex-next/components/Table/TableBasic/components/TableBasicBody\";\nimport { ITableBasicProps } from \"@sberbusiness/triplex-next/components/Table/TableBasic/types\";\nimport { LoaderMiddle } from \"@sberbusiness/triplex-next/components/Loader/LoaderMiddle/LoaderMiddle\";\nimport { LoaderScreen } from \"@sberbusiness/triplex-next/components/LoaderScreen/LoaderScreen\";\n\n/** Компонент обычной таблицы. */\nexport const TableBasic = ({\n    columns,\n    data,\n    highlightRowOnHover,\n    onOrderBy,\n    onClickRow,\n    renderNoColumns,\n    renderNoData,\n    headless,\n    ...htmlTableAttributes\n}: ITableBasicProps) => {\n    const context = useContext(MasterTableContext);\n    const isEmptyData = data.length === 0;\n\n    useEffect(() => {\n        if (!isEqual(columns, context.columns)) {\n            context.setColumns(columns);\n        }\n    }, [columns, context]);\n\n    const renderTable = () => {\n        if (columns.every((c) => c.hidden) && renderNoColumns) {\n            return renderNoColumns();\n        }\n\n        return (\n            <table key=\"table\" {...htmlTableAttributes}>\n                {headless || <TableBasicHeader columns={columns} onOrderBy={onOrderBy} />}\n                <TableBasicBody\n                    columns={columns}\n                    data={data}\n                    onClickRow={onClickRow}\n                    highlightRowOnHover={highlightRowOnHover}\n                />\n            </table>\n        );\n    };\n\n    const renderFooter = (isEmptyData: boolean) => {\n        const { loading } = context;\n\n        if (loading && isEmptyData) {\n            return renderFooterEmptyData(renderNoDataLoading());\n        } else if (!loading && isEmptyData) {\n            return renderFooterEmptyData(renderNoData());\n        } else if (loading && !isEmptyData) {\n            return (\n                <div className={styles.spinnerWrapper}>\n                    <LoaderScreen type=\"middle\" className={styles.tableLoaderScreen} />\n                </div>\n            );\n        } else {\n            return null;\n        }\n    };\n\n    const renderFooterEmptyData = (content: React.JSX.Element | React.JSX.Element[]) => (\n        <div className={styles.footerEmptyData}>{content}</div>\n    );\n    const renderNoDataLoading = () => [\n        <div className={styles.overlayCover} key=\"overlay\" />,\n        <LoaderMiddle key=\"spinner\" />,\n    ];\n\n    return (\n        <div className={styles.tableBasic}>\n            {renderTable()}\n            {renderFooter(isEmptyData)}\n        </div>\n    );\n};\n\nTableBasic.displayName = \"TableBasic\";\n"],"names":["isEmptyData"],"mappings":";;;;;;;;;AAWO,MAAM,aAAa,CAAC;AAAA,EACvB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACP,MAAwB;AACpB,QAAM,UAAU,WAAW,kBAAkB;AAC7C,QAAM,cAAc,KAAK,WAAW;AAEpC,YAAU,MAAM;AACZ,QAAI,CAAC,QAAQ,SAAS,QAAQ,OAAO,GAAG;AACpC,cAAQ,WAAW,OAAO;AAAA,IAC9B;AAAA,EACJ,GAAG,CAAC,SAAS,OAAO,CAAC;AAErB,QAAM,cAAc,MAAM;AACtB,QAAI,QAAQ,MAAM,CAAC,MAAM,EAAE,MAAM,KAAK,iBAAiB;AACnD,aAAO,gBAAA;AAAA,IACX;AAEA,WACI,qBAAC,SAAA,EAAmB,GAAG,qBAClB,UAAA;AAAA,MAAA,YAAY,oBAAC,kBAAA,EAAiB,SAAkB,UAAA,CAAsB;AAAA,MACvE;AAAA,QAAC;AAAA,QAAA;AAAA,UACG;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QAAA;AAAA,MAAA;AAAA,IACJ,EAAA,GAPO,OAQX;AAAA,EAER;AAEA,QAAM,eAAe,CAACA,iBAAyB;AAC3C,UAAM,EAAE,YAAY;AAEpB,QAAI,WAAWA,cAAa;AACxB,aAAO,sBAAsB,qBAAqB;AAAA,IACtD,WAAW,CAAC,WAAWA,cAAa;AAChC,aAAO,sBAAsB,cAAc;AAAA,IAC/C,WAAW,WAAW,CAACA,cAAa;AAChC,aACI,oBAAC,OAAA,EAAI,WAAW,OAAO,gBACnB,UAAA,oBAAC,cAAA,EAAa,MAAK,UAAS,WAAW,OAAO,kBAAA,CAAmB,GACrE;AAAA,IAER,OAAO;AACH,aAAO;AAAA,IACX;AAAA,EACJ;AAEA,QAAM,wBAAwB,CAAC,YAC3B,oBAAC,SAAI,WAAW,OAAO,iBAAkB,UAAA,QAAA,CAAQ;AAErD,QAAM,sBAAsB,MAAM;AAAA,IAC9B,oBAAC,OAAA,EAAI,WAAW,OAAO,gBAAkB,SAAU;AAAA,IACnD,oBAAC,kBAAiB,SAAU;AAAA,EAAA;AAGhC,SACI,qBAAC,OAAA,EAAI,WAAW,OAAO,YAClB,UAAA;AAAA,IAAA,YAAA;AAAA,IACA,aAAa,WAAW;AAAA,EAAA,GAC7B;AAER;AAEA,WAAW,cAAc;"}
+{"version":3,"file":"TableBasic.js","sources":["../../../../src/components/Table/TableBasic/TableBasic.tsx"],"sourcesContent":["import React, { useContext, useEffect } from \"react\";\nimport isEqual from \"lodash-es/isEqual\";\nimport { MasterTableContext } from \"@sberbusiness/triplex-next/components/Table/MasterTableContext\";\nimport styles from \"./styles/TableBasic.module.less\";\nimport { TableBasicHeader } from \"@sberbusiness/triplex-next/components/Table/TableBasic/components/TableBasicHeader\";\nimport { TableBasicBody } from \"@sberbusiness/triplex-next/components/Table/TableBasic/components/TableBasicBody\";\nimport { ITableBasicProps } from \"@sberbusiness/triplex-next/components/Table/TableBasic/types\";\nimport { LoaderMiddle } from \"@sberbusiness/triplex-next/components/Loader/LoaderMiddle/LoaderMiddle\";\nimport { LoaderScreen } from \"@sberbusiness/triplex-next/components/LoaderScreen/LoaderScreen\";\n\n/**\n * Компонент обычной таблицы.\n * Состояние загрузки и общий для таблицы набор колонок берутся из контекста MasterTable.\n * Ref пробрасывается на элемент table — туда же, куда попадают остальные HTML-атрибуты.\n * Если все колонки скрыты и задан renderNoColumns, вместо таблицы рендерится заглушка,\n * и ref остаётся пустым — элемента table в этот момент нет.\n */\nexport const TableBasic = React.forwardRef<HTMLTableElement, ITableBasicProps>(\n    (\n        {\n            columns,\n            data,\n            highlightRowOnHover,\n            onOrderBy,\n            onClickRow,\n            renderNoColumns,\n            renderNoData,\n            headless,\n            ...htmlTableAttributes\n        },\n        ref,\n    ) => {\n        const { columns: contextColumns, loading, setColumns } = useContext(MasterTableContext);\n        const isEmptyData = data.length === 0;\n\n        useEffect(() => {\n            if (!isEqual(columns, contextColumns)) {\n                setColumns(columns);\n            }\n        }, [columns, contextColumns, setColumns]);\n\n        /** Рендер таблицы или заглушки, если пользователь скрыл все колонки. */\n        const renderTable = () => {\n            if (columns.every((column) => column.hidden) && renderNoColumns) {\n                return renderNoColumns();\n            }\n\n            return (\n                <table {...htmlTableAttributes} ref={ref}>\n                    {headless || <TableBasicHeader columns={columns} onOrderBy={onOrderBy} />}\n                    <TableBasicBody\n                        columns={columns}\n                        data={data}\n                        onClickRow={onClickRow}\n                        highlightRowOnHover={highlightRowOnHover}\n                    />\n                </table>\n            );\n        };\n\n        /** Рендер подвала: заглушка при отсутствии данных и индикаторы загрузки. */\n        const renderFooter = () => {\n            if (loading && isEmptyData) {\n                return (\n                    <div className={styles.footerEmptyData}>\n                        <div className={styles.overlayCover} />\n                        <LoaderMiddle />\n                    </div>\n                );\n            }\n\n            if (isEmptyData) {\n                return <div className={styles.footerEmptyData}>{renderNoData()}</div>;\n            }\n\n            if (loading) {\n                return (\n                    <div className={styles.spinnerWrapper}>\n                        <LoaderScreen type=\"middle\" className={styles.tableLoaderScreen} />\n                    </div>\n                );\n            }\n\n            return null;\n        };\n\n        return (\n            <div className={styles.tableBasic}>\n                {renderTable()}\n                {renderFooter()}\n            </div>\n        );\n    },\n);\n\nTableBasic.displayName = \"TableBasic\";\n"],"names":["React"],"mappings":";;;;;;;;;AAiBO,MAAM,aAAaA,eAAM;AAAA,EAC5B,CACI;AAAA,IACI;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,GAEP,QACC;AACD,UAAM,EAAE,SAAS,gBAAgB,SAAS,WAAA,IAAe,WAAW,kBAAkB;AACtF,UAAM,cAAc,KAAK,WAAW;AAEpC,cAAU,MAAM;AACZ,UAAI,CAAC,QAAQ,SAAS,cAAc,GAAG;AACnC,mBAAW,OAAO;AAAA,MACtB;AAAA,IACJ,GAAG,CAAC,SAAS,gBAAgB,UAAU,CAAC;AAGxC,UAAM,cAAc,MAAM;AACtB,UAAI,QAAQ,MAAM,CAAC,WAAW,OAAO,MAAM,KAAK,iBAAiB;AAC7D,eAAO,gBAAA;AAAA,MACX;AAEA,aACI,qBAAC,SAAA,EAAO,GAAG,qBAAqB,KAC3B,UAAA;AAAA,QAAA,YAAY,oBAAC,kBAAA,EAAiB,SAAkB,UAAA,CAAsB;AAAA,QACvE;AAAA,UAAC;AAAA,UAAA;AAAA,YACG;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,UAAA;AAAA,QAAA;AAAA,MACJ,GACJ;AAAA,IAER;AAGA,UAAM,eAAe,MAAM;AACvB,UAAI,WAAW,aAAa;AACxB,eACI,qBAAC,OAAA,EAAI,WAAW,OAAO,iBACnB,UAAA;AAAA,UAAA,oBAAC,OAAA,EAAI,WAAW,OAAO,aAAA,CAAc;AAAA,8BACpC,cAAA,CAAA,CAAa;AAAA,QAAA,GAClB;AAAA,MAER;AAEA,UAAI,aAAa;AACb,mCAAQ,OAAA,EAAI,WAAW,OAAO,iBAAkB,0BAAe;AAAA,MACnE;AAEA,UAAI,SAAS;AACT,eACI,oBAAC,OAAA,EAAI,WAAW,OAAO,gBACnB,UAAA,oBAAC,cAAA,EAAa,MAAK,UAAS,WAAW,OAAO,kBAAA,CAAmB,GACrE;AAAA,MAER;AAEA,aAAO;AAAA,IACX;AAEA,WACI,qBAAC,OAAA,EAAI,WAAW,OAAO,YAClB,UAAA;AAAA,MAAA,YAAA;AAAA,MACA,aAAA;AAAA,IAAa,GAClB;AAAA,EAER;AACJ;AAEA,WAAW,cAAc;"}

package/components/Table/TableBasic/components/TableBasicBody.js

@@ -1,7 +1,7 @@
 import { jsx } from "react/jsx-runtime";
 import { TableBasicRow } from "./TableBasicRow.js";
-import { c as clsx } from "../../../../chunks/vendor-DfvHt3TJ.js";
-import { s as styles } from "../../../../chunks/utils-BO2qfDaA.js";
+import { c as clsx } from "../../../../chunks/vendor-D4wvHis9.js";
+import { s as styles } from "../../../../chunks/utils-BL5AUOKS.js";
 const TableBasicBody = ({ columns, data, highlightRowOnHover, onClickRow }) => {
   if (data.length === 0) {
     return null;
@@ -12,8 +12,7 @@ const TableBasicBody = ({ columns, data, highlightRowOnHover, onClickRow }) => {
     [styles.clickable]: clickEnabled,
     [styles.hoverable]: hoverable
   });
-  const rows = data.map((rowData) => /* @__PURE__ */ jsx(TableBasicRow, { columns, data: rowData, onClickRow }, rowData.rowKey));
-  return /* @__PURE__ */ jsx("tbody", { className, children: rows });
+  return /* @__PURE__ */ jsx("tbody", { className, children: data.map((rowData) => /* @__PURE__ */ jsx(TableBasicRow, { columns, data: rowData, onClickRow }, rowData.rowKey)) });
 };
 TableBasicBody.displayName = "TableBasicBody";
 export {

package/components/Table/TableBasic/components/TableBasicBody.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableBasicBody.js","sources":["../../../../../src/components/Table/TableBasic/components/TableBasicBody.tsx"],"sourcesContent":["import React from \"react\";\nimport { ITableBasicColumn, ITableBasicRow } from \"@sberbusiness/triplex-next/components/Table/TableBasic/types\";\nimport { TableBasicRow } from \"@sberbusiness/triplex-next/components/Table/TableBasic/components/TableBasicRow\";\nimport { clsx } from \"clsx\";\nimport styles from \"../styles/TableBasic.module.less\";\n\n/**\n * @prop {ITableBasicColumn} columns Структура заголовков таблицы.\n * @prop {ITableBasicRow[]} data Массив значений для вывода в теле таблицы.\n * @prop {boolean} [highlightRowOnHover] Подсветка строк при наведении мышки.\n * @prop {Function} [onClickRow] Функция обработки клика по строке таблицы.\n */\nexport interface ITableBasicBodyProps {\n    columns: ITableBasicColumn[];\n    data: ITableBasicRow[];\n    highlightRowOnHover?: boolean;\n    onClickRow?: (rowKey: string) => void;\n}\n\n/** Компонент тела таблицы. */\nexport const TableBasicBody = ({ columns, data, highlightRowOnHover, onClickRow }: ITableBasicBodyProps) => {\n    if (data.length === 0) {\n        return null;\n    }\n\n    const clickEnabled = Boolean(onClickRow);\n    const hoverable = clickEnabled || Boolean(highlightRowOnHover);\n    const className = clsx({\n        [styles.clickable]: clickEnabled,\n        [styles.hoverable]: hoverable,\n    });\n\n    const rows = data.map((rowData) => (\n        <TableBasicRow columns={columns} data={rowData} onClickRow={onClickRow} key={rowData.rowKey} />\n    ));\n    return <tbody className={className}>{rows}</tbody>;\n};\n\nTableBasicBody.displayName = \"TableBasicBody\";\n"],"names":[],"mappings":";;;;AAoBO,MAAM,iBAAiB,CAAC,EAAE,SAAS,MAAM,qBAAqB,iBAAuC;AACxG,MAAI,KAAK,WAAW,GAAG;AACnB,WAAO;AAAA,EACX;AAEA,QAAM,eAAe,QAAQ,UAAU;AACvC,QAAM,YAAY,gBAAgB,QAAQ,mBAAmB;AAC7D,QAAM,YAAY,KAAK;AAAA,IACnB,CAAC,OAAO,SAAS,GAAG;AAAA,IACpB,CAAC,OAAO,SAAS,GAAG;AAAA,EAAA,CACvB;AAED,QAAM,OAAO,KAAK,IAAI,CAAC,YACnB,oBAAC,eAAA,EAAc,SAAkB,MAAM,SAAS,WAAA,GAA6B,QAAQ,MAAQ,CAChG;AACD,SAAO,oBAAC,SAAA,EAAM,WAAuB,UAAA,KAAA,CAAK;AAC9C;AAEA,eAAe,cAAc;"}
+{"version":3,"file":"TableBasicBody.js","sources":["../../../../../src/components/Table/TableBasic/components/TableBasicBody.tsx"],"sourcesContent":["import React from \"react\";\nimport { ITableBasicColumn, ITableBasicRow } from \"@sberbusiness/triplex-next/components/Table/TableBasic/types\";\nimport { TableBasicRow } from \"@sberbusiness/triplex-next/components/Table/TableBasic/components/TableBasicRow\";\nimport { clsx } from \"clsx\";\nimport styles from \"../styles/TableBasic.module.less\";\n\n/** Свойства компонента TableBasicBody. */\nexport interface ITableBasicBodyProps {\n    /** Структура заголовков таблицы. */\n    columns: ITableBasicColumn[];\n    /** Массив значений для вывода в теле таблицы. */\n    data: ITableBasicRow[];\n    /** Подсветка строк при наведении мышки. */\n    highlightRowOnHover?: boolean;\n    /** Функция обработки клика по строке таблицы. */\n    onClickRow?: (rowKey: string) => void;\n}\n\n/** Компонент тела таблицы. */\nexport const TableBasicBody = ({ columns, data, highlightRowOnHover, onClickRow }: ITableBasicBodyProps) => {\n    if (data.length === 0) {\n        return null;\n    }\n\n    const clickEnabled = Boolean(onClickRow);\n    // Кликабельные строки подсвечиваются при наведении всегда, без отдельного highlightRowOnHover.\n    const hoverable = clickEnabled || Boolean(highlightRowOnHover);\n    const className = clsx({\n        [styles.clickable]: clickEnabled,\n        [styles.hoverable]: hoverable,\n    });\n\n    return (\n        <tbody className={className}>\n            {data.map((rowData) => (\n                <TableBasicRow columns={columns} data={rowData} onClickRow={onClickRow} key={rowData.rowKey} />\n            ))}\n        </tbody>\n    );\n};\n\nTableBasicBody.displayName = \"TableBasicBody\";\n"],"names":[],"mappings":";;;;AAmBO,MAAM,iBAAiB,CAAC,EAAE,SAAS,MAAM,qBAAqB,iBAAuC;AACxG,MAAI,KAAK,WAAW,GAAG;AACnB,WAAO;AAAA,EACX;AAEA,QAAM,eAAe,QAAQ,UAAU;AAEvC,QAAM,YAAY,gBAAgB,QAAQ,mBAAmB;AAC7D,QAAM,YAAY,KAAK;AAAA,IACnB,CAAC,OAAO,SAAS,GAAG;AAAA,IACpB,CAAC,OAAO,SAAS,GAAG;AAAA,EAAA,CACvB;AAED,6BACK,SAAA,EAAM,WACF,UAAA,KAAK,IAAI,CAAC,YACP,oBAAC,eAAA,EAAc,SAAkB,MAAM,SAAS,WAAA,GAA6B,QAAQ,MAAQ,CAChG,GACL;AAER;AAEA,eAAe,cAAc;"}

package/components/Table/TableBasic/components/TableBasicHeader.js

@@ -1,96 +1,79 @@
 import { jsx, jsxs, Fragment } from "react/jsx-runtime";
 import { SortdecreaseStrokeSrvIcon16, SortincreaseStrokeSrvIcon16, SortStrokeSrvIcon16 } from "@sberbusiness/icons-next";
-import { isNullOrUndefined } from "../../../../utils/isNullOrUndefined.js";
 import { getAriaHTMLAttributes } from "../../../../utils/html/AriaAttributes.js";
 import { getDataHTMLAttributes } from "../../../../utils/html/DataAttributes.js";
 import { ECellType, EHorizontalAlign, EOrderDirection } from "../enums.js";
-import { c as clsx } from "../../../../chunks/vendor-DfvHt3TJ.js";
-import { s as styles, m as mapHorizontalAlignToClassName } from "../../../../chunks/utils-BO2qfDaA.js";
+import { c as clsx } from "../../../../chunks/vendor-D4wvHis9.js";
+import { s as styles, m as mapHorizontalAlignToClassName } from "../../../../chunks/utils-BL5AUOKS.js";
 import { Text } from "../../../Typography/Text.js";
 import { ETextSize } from "../../../Typography/enums.js";
+const getNextOrderDirection = (currentDirection) => {
+  switch (currentDirection) {
+    case EOrderDirection.NONE:
+      return EOrderDirection.ASC;
+    case EOrderDirection.ASC:
+      return EOrderDirection.DESC;
+    case EOrderDirection.DESC:
+      return EOrderDirection.NONE;
+  }
+};
+const getOrderIcon = (orderDirection) => {
+  switch (orderDirection) {
+    case EOrderDirection.NONE:
+      return /* @__PURE__ */ jsx(SortStrokeSrvIcon16, { paletteIndex: 5 });
+    case EOrderDirection.ASC:
+      return /* @__PURE__ */ jsx(SortincreaseStrokeSrvIcon16, { paletteIndex: 5 });
+    case EOrderDirection.DESC:
+      return /* @__PURE__ */ jsx(SortdecreaseStrokeSrvIcon16, { paletteIndex: 5 });
+  }
+};
 const TableBasicHeader = ({ columns, onOrderBy }) => {
-  const hasOrderFunc = !isNullOrUndefined(onOrderBy);
-  const renderOrderIcon = (c) => {
-    let icon;
-    switch (c.orderDirection) {
-      case EOrderDirection.NONE: {
-        icon = /* @__PURE__ */ jsx(SortStrokeSrvIcon16, { paletteIndex: 5 });
-        break;
-      }
-      case EOrderDirection.ASC: {
-        icon = /* @__PURE__ */ jsx(SortincreaseStrokeSrvIcon16, { paletteIndex: 5 });
-        break;
-      }
-      case EOrderDirection.DESC: {
-        icon = /* @__PURE__ */ jsx(SortdecreaseStrokeSrvIcon16, { paletteIndex: 5 });
-        break;
-      }
-    }
+  const hasOrderFunc = onOrderBy != null;
+  const handleClickOrder = (fieldKey, currentDirection) => {
+    onOrderBy == null ? void 0 : onOrderBy({ direction: getNextOrderDirection(currentDirection), fieldKey });
+  };
+  const renderOrderButton = (column, orderDirection) => {
     const orderButtonClassName = clsx(styles.orderButton, {
-      [styles.alignLeft]: c.horizontalAlign === EHorizontalAlign.RIGHT,
-      [styles.alignRight]: c.horizontalAlign !== EHorizontalAlign.RIGHT,
-      [styles.sorted]: c.orderDirection !== EOrderDirection.NONE
+      [styles.alignLeft]: column.horizontalAlign === EHorizontalAlign.RIGHT,
+      [styles.alignRight]: column.horizontalAlign !== EHorizontalAlign.RIGHT,
+      [styles.sorted]: orderDirection !== EOrderDirection.NONE
     });
-    return /* @__PURE__ */ jsx("span", { className: orderButtonClassName, children: icon });
+    return /* @__PURE__ */ jsx("span", { className: orderButtonClassName, children: getOrderIcon(orderDirection) });
   };
-  const renderTh = (c, hasOrderFunc2) => {
-    if (c.hidden) {
+  const renderTh = (column) => {
+    if (column.hidden) {
       return null;
     }
-    const styleTh = c.width ? { maxWidth: c.width, minWidth: c.width, width: c.width } : void 0;
-    const orderEnabled = hasOrderFunc2 && !isNullOrUndefined(c.orderDirection);
-    const handleClickOrderFunc = orderEnabled ? () => {
-      handleClickOrder(c.fieldKey, c.orderDirection);
-    } : void 0;
-    const orderIcon = orderEnabled && renderOrderIcon(c);
-    const classNameTh = clsx(mapHorizontalAlignToClassName(c.horizontalAlign), {
-      [styles.checkboxType]: c.cellType === ECellType.CHECKBOX
+    const { ariaAttributes, cellType, dataAttributes, fieldKey, horizontalAlign, label, orderDirection, title } = column;
+    const styleTh = column.width ? { maxWidth: column.width, minWidth: column.width, width: column.width } : void 0;
+    const orderEnabled = hasOrderFunc && orderDirection != null;
+    const classNameTh = clsx(mapHorizontalAlignToClassName(horizontalAlign), {
+      [styles.checkboxType]: cellType === ECellType.CHECKBOX
     });
     const classNameThBlock = clsx(styles.thBlock, "hoverable", {
       [styles.order]: orderEnabled
     });
-    const labelElement = [ECellType.TEXT, void 0].includes(c.cellType) ? /* @__PURE__ */ jsx(Text, { size: ETextSize.B3, children: c.label }) : c.label;
-    const content = c.horizontalAlign === EHorizontalAlign.RIGHT ? /* @__PURE__ */ jsxs(Fragment, { children: [
-      orderIcon,
+    const labelElement = [ECellType.TEXT, void 0].includes(cellType) ? /* @__PURE__ */ jsx(Text, { size: ETextSize.B3, children: label }) : label;
+    const orderButton = orderEnabled ? renderOrderButton(column, orderDirection) : null;
+    const content = horizontalAlign === EHorizontalAlign.RIGHT ? /* @__PURE__ */ jsxs(Fragment, { children: [
+      orderButton,
       labelElement
     ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
       labelElement,
-      orderIcon
+      orderButton
     ] });
-    return /* @__PURE__ */ jsx("th", { className: classNameTh, title: c.title, style: styleTh, children: /* @__PURE__ */ jsx(
+    return /* @__PURE__ */ jsx("th", { className: classNameTh, title, style: styleTh, children: /* @__PURE__ */ jsx(
       "span",
       {
         className: classNameThBlock,
-        onClick: handleClickOrderFunc,
-        ...Boolean(c.ariaAttributes) && getAriaHTMLAttributes(c.ariaAttributes),
-        ...Boolean(c.dataAttributes) && getDataHTMLAttributes(c.dataAttributes),
+        onClick: orderEnabled ? () => handleClickOrder(fieldKey, orderDirection) : void 0,
+        ...ariaAttributes && getAriaHTMLAttributes(ariaAttributes),
+        ...dataAttributes && getDataHTMLAttributes(dataAttributes),
         children: content
       }
-    ) }, c.fieldKey);
-  };
-  const handleClickOrder = (fieldKey, currentDirection) => {
-    let nextDirection;
-    switch (currentDirection) {
-      case EOrderDirection.NONE: {
-        nextDirection = EOrderDirection.ASC;
-        break;
-      }
-      case EOrderDirection.ASC: {
-        nextDirection = EOrderDirection.DESC;
-        break;
-      }
-      case EOrderDirection.DESC: {
-        nextDirection = EOrderDirection.NONE;
-        break;
-      }
-    }
-    if (onOrderBy) {
-      const OrderObj = { direction: nextDirection, fieldKey };
-      onOrderBy(OrderObj);
-    }
+    ) }, fieldKey);
   };
-  const thList = columns.map((c) => renderTh(c, hasOrderFunc));
-  return /* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsx("tr", { children: thList }) });
+  return /* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsx("tr", { children: columns.map((column) => renderTh(column)) }) });
 };
 TableBasicHeader.displayName = "TableBasicHeader";
 export {

package/components/Table/TableBasic/components/TableBasicHeader.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableBasicHeader.js","sources":["../../../../../src/components/Table/TableBasic/components/TableBasicHeader.tsx"],"sourcesContent":["import React from \"react\";\nimport {\n    SortdecreaseStrokeSrvIcon16,\n    SortincreaseStrokeSrvIcon16,\n    SortStrokeSrvIcon16,\n} from \"@sberbusiness/icons-next\";\nimport { isNullOrUndefined } from \"@sberbusiness/triplex-next/utils/isNullOrUndefined\";\nimport { getAriaHTMLAttributes } from \"@sberbusiness/triplex-next/utils/html/AriaAttributes\";\nimport { getDataHTMLAttributes } from \"@sberbusiness/triplex-next/utils/html/DataAttributes\";\nimport {\n    ECellType,\n    EHorizontalAlign,\n    EOrderDirection,\n} from \"@sberbusiness/triplex-next/components/Table/TableBasic/enums\";\nimport { clsx } from \"clsx\";\nimport styles from \"../styles/TableBasic.module.less\";\nimport { ISortOrder, ITableBasicColumn } from \"@sberbusiness/triplex-next/components/Table/TableBasic/types\";\nimport { mapHorizontalAlignToClassName } from \"@sberbusiness/triplex-next/components/Table/utils\";\nimport { Text } from \"@sberbusiness/triplex-next/components/Typography/Text\";\nimport { ETextSize } from \"@sberbusiness/triplex-next/components/Typography/enums\";\n\nexport interface ITableBasicHeaderProps {\n    /** Структура заголовков таблицы. */\n    columns: ITableBasicColumn[];\n    /** Обработчик сортировки. */\n    onOrderBy?: (order: ISortOrder) => void;\n}\n\n/** Компонент заголовка таблицы. */\nexport const TableBasicHeader = ({ columns, onOrderBy }: ITableBasicHeaderProps) => {\n    const hasOrderFunc = !isNullOrUndefined(onOrderBy);\n\n    const renderOrderIcon = (c: ITableBasicColumn) => {\n        let icon;\n        switch (c.orderDirection) {\n            case EOrderDirection.NONE: {\n                icon = <SortStrokeSrvIcon16 paletteIndex={5} />;\n                break;\n            }\n            case EOrderDirection.ASC: {\n                icon = <SortincreaseStrokeSrvIcon16 paletteIndex={5} />;\n                break;\n            }\n            case EOrderDirection.DESC: {\n                icon = <SortdecreaseStrokeSrvIcon16 paletteIndex={5} />;\n                break;\n            }\n        }\n\n        const orderButtonClassName = clsx(styles.orderButton, {\n            [styles.alignLeft]: c.horizontalAlign === EHorizontalAlign.RIGHT,\n            [styles.alignRight]: c.horizontalAlign !== EHorizontalAlign.RIGHT,\n            [styles.sorted]: c.orderDirection !== EOrderDirection.NONE,\n        });\n\n        return <span className={orderButtonClassName}>{icon}</span>;\n    };\n\n    /** Рендер заголовка таблицы. */\n    const renderTh = (c: ITableBasicColumn, hasOrderFunc: boolean) => {\n        // Столбец скрыт.\n        if (c.hidden) {\n            return null;\n        }\n\n        const styleTh = c.width ? { maxWidth: c.width, minWidth: c.width, width: c.width } : undefined;\n        const orderEnabled = hasOrderFunc && !isNullOrUndefined(c.orderDirection);\n        const handleClickOrderFunc = orderEnabled\n            ? () => {\n                  handleClickOrder(c.fieldKey, c.orderDirection!);\n              }\n            : undefined;\n        const orderIcon = orderEnabled && renderOrderIcon(c);\n        const classNameTh = clsx(mapHorizontalAlignToClassName(c.horizontalAlign), {\n            [styles.checkboxType]: c.cellType === ECellType.CHECKBOX,\n        });\n        const classNameThBlock = clsx(styles.thBlock, \"hoverable\", {\n            [styles.order]: orderEnabled,\n        });\n\n        const labelElement = [ECellType.TEXT, undefined].includes(c.cellType) ? (\n            <Text size={ETextSize.B3}>{c.label}</Text>\n        ) : (\n            c.label\n        );\n\n        const content =\n            c.horizontalAlign === EHorizontalAlign.RIGHT ? (\n                <>\n                    {orderIcon}\n                    {labelElement}\n                </>\n            ) : (\n                <>\n                    {labelElement}\n                    {orderIcon}\n                </>\n            );\n\n        return (\n            <th className={classNameTh} title={c.title} key={c.fieldKey} style={styleTh}>\n                <span\n                    className={classNameThBlock}\n                    onClick={handleClickOrderFunc}\n                    {...(Boolean(c.ariaAttributes) && getAriaHTMLAttributes(c.ariaAttributes!))}\n                    {...(Boolean(c.dataAttributes) && getDataHTMLAttributes(c.dataAttributes!))}\n                >\n                    {content}\n                </span>\n            </th>\n        );\n    };\n\n    /** Обработчик клика сортировки столбца. */\n    const handleClickOrder = (fieldKey: string, currentDirection: EOrderDirection) => {\n        let nextDirection;\n        switch (currentDirection) {\n            case EOrderDirection.NONE: {\n                nextDirection = EOrderDirection.ASC;\n                break;\n            }\n            case EOrderDirection.ASC: {\n                nextDirection = EOrderDirection.DESC;\n                break;\n            }\n            case EOrderDirection.DESC: {\n                nextDirection = EOrderDirection.NONE;\n                break;\n            }\n        }\n\n        if (onOrderBy) {\n            const OrderObj: ISortOrder = { direction: nextDirection, fieldKey };\n            onOrderBy(OrderObj);\n        }\n    };\n\n    const thList = columns.map((c) => renderTh(c, hasOrderFunc));\n\n    return (\n        <thead>\n            <tr>{thList}</tr>\n        </thead>\n    );\n};\n\nTableBasicHeader.displayName = \"TableBasicHeader\";\n"],"names":["hasOrderFunc"],"mappings":";;;;;;;;;;AA6BO,MAAM,mBAAmB,CAAC,EAAE,SAAS,gBAAwC;AAChF,QAAM,eAAe,CAAC,kBAAkB,SAAS;AAEjD,QAAM,kBAAkB,CAAC,MAAyB;AAC9C,QAAI;AACJ,YAAQ,EAAE,gBAAA;AAAA,MACN,KAAK,gBAAgB,MAAM;AACvB,eAAO,oBAAC,qBAAA,EAAoB,cAAc,EAAA,CAAG;AAC7C;AAAA,MACJ;AAAA,MACA,KAAK,gBAAgB,KAAK;AACtB,eAAO,oBAAC,6BAAA,EAA4B,cAAc,EAAA,CAAG;AACrD;AAAA,MACJ;AAAA,MACA,KAAK,gBAAgB,MAAM;AACvB,eAAO,oBAAC,6BAAA,EAA4B,cAAc,EAAA,CAAG;AACrD;AAAA,MACJ;AAAA,IAAA;AAGJ,UAAM,uBAAuB,KAAK,OAAO,aAAa;AAAA,MAClD,CAAC,OAAO,SAAS,GAAG,EAAE,oBAAoB,iBAAiB;AAAA,MAC3D,CAAC,OAAO,UAAU,GAAG,EAAE,oBAAoB,iBAAiB;AAAA,MAC5D,CAAC,OAAO,MAAM,GAAG,EAAE,mBAAmB,gBAAgB;AAAA,IAAA,CACzD;AAED,WAAO,oBAAC,QAAA,EAAK,WAAW,sBAAuB,UAAA,MAAK;AAAA,EACxD;AAGA,QAAM,WAAW,CAAC,GAAsBA,kBAA0B;AAE9D,QAAI,EAAE,QAAQ;AACV,aAAO;AAAA,IACX;AAEA,UAAM,UAAU,EAAE,QAAQ,EAAE,UAAU,EAAE,OAAO,UAAU,EAAE,OAAO,OAAO,EAAE,UAAU;AACrF,UAAM,eAAeA,iBAAgB,CAAC,kBAAkB,EAAE,cAAc;AACxE,UAAM,uBAAuB,eACvB,MAAM;AACF,uBAAiB,EAAE,UAAU,EAAE,cAAe;AAAA,IAClD,IACA;AACN,UAAM,YAAY,gBAAgB,gBAAgB,CAAC;AACnD,UAAM,cAAc,KAAK,8BAA8B,EAAE,eAAe,GAAG;AAAA,MACvE,CAAC,OAAO,YAAY,GAAG,EAAE,aAAa,UAAU;AAAA,IAAA,CACnD;AACD,UAAM,mBAAmB,KAAK,OAAO,SAAS,aAAa;AAAA,MACvD,CAAC,OAAO,KAAK,GAAG;AAAA,IAAA,CACnB;AAED,UAAM,eAAe,CAAC,UAAU,MAAM,MAAS,EAAE,SAAS,EAAE,QAAQ,IAChE,oBAAC,QAAK,MAAM,UAAU,IAAK,UAAA,EAAE,MAAA,CAAM,IAEnC,EAAE;AAGN,UAAM,UACF,EAAE,oBAAoB,iBAAiB,QACnC,qBAAA,UAAA,EACK,UAAA;AAAA,MAAA;AAAA,MACA;AAAA,IAAA,EAAA,CACL,IAEA,qBAAA,UAAA,EACK,UAAA;AAAA,MAAA;AAAA,MACA;AAAA,IAAA,GACL;AAGR,WACI,oBAAC,QAAG,WAAW,aAAa,OAAO,EAAE,OAAwB,OAAO,SAChE,UAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,WAAW;AAAA,QACX,SAAS;AAAA,QACR,GAAI,QAAQ,EAAE,cAAc,KAAK,sBAAsB,EAAE,cAAe;AAAA,QACxE,GAAI,QAAQ,EAAE,cAAc,KAAK,sBAAsB,EAAE,cAAe;AAAA,QAExE,UAAA;AAAA,MAAA;AAAA,IAAA,EACL,GAR6C,EAAE,QASnD;AAAA,EAER;AAGA,QAAM,mBAAmB,CAAC,UAAkB,qBAAsC;AAC9E,QAAI;AACJ,YAAQ,kBAAA;AAAA,MACJ,KAAK,gBAAgB,MAAM;AACvB,wBAAgB,gBAAgB;AAChC;AAAA,MACJ;AAAA,MACA,KAAK,gBAAgB,KAAK;AACtB,wBAAgB,gBAAgB;AAChC;AAAA,MACJ;AAAA,MACA,KAAK,gBAAgB,MAAM;AACvB,wBAAgB,gBAAgB;AAChC;AAAA,MACJ;AAAA,IAAA;AAGJ,QAAI,WAAW;AACX,YAAM,WAAuB,EAAE,WAAW,eAAe,SAAA;AACzD,gBAAU,QAAQ;AAAA,IACtB;AAAA,EACJ;AAEA,QAAM,SAAS,QAAQ,IAAI,CAAC,MAAM,SAAS,GAAG,YAAY,CAAC;AAE3D,SACI,oBAAC,SAAA,EACG,UAAA,oBAAC,MAAA,EAAI,kBAAO,GAChB;AAER;AAEA,iBAAiB,cAAc;"}
+{"version":3,"file":"TableBasicHeader.js","sources":["../../../../../src/components/Table/TableBasic/components/TableBasicHeader.tsx"],"sourcesContent":["import React from \"react\";\nimport {\n    SortdecreaseStrokeSrvIcon16,\n    SortincreaseStrokeSrvIcon16,\n    SortStrokeSrvIcon16,\n} from \"@sberbusiness/icons-next\";\nimport { getAriaHTMLAttributes } from \"@sberbusiness/triplex-next/utils/html/AriaAttributes\";\nimport { getDataHTMLAttributes } from \"@sberbusiness/triplex-next/utils/html/DataAttributes\";\nimport {\n    ECellType,\n    EHorizontalAlign,\n    EOrderDirection,\n} from \"@sberbusiness/triplex-next/components/Table/TableBasic/enums\";\nimport { clsx } from \"clsx\";\nimport styles from \"../styles/TableBasic.module.less\";\nimport { ISortOrder, ITableBasicColumn } from \"@sberbusiness/triplex-next/components/Table/TableBasic/types\";\nimport { mapHorizontalAlignToClassName } from \"@sberbusiness/triplex-next/components/Table/utils\";\nimport { Text } from \"@sberbusiness/triplex-next/components/Typography/Text\";\nimport { ETextSize } from \"@sberbusiness/triplex-next/components/Typography/enums\";\n\n/** Свойства компонента TableBasicHeader. */\nexport interface ITableBasicHeaderProps {\n    /** Структура заголовков таблицы. */\n    columns: ITableBasicColumn[];\n    /** Обработчик сортировки. */\n    onOrderBy?: (order: ISortOrder) => void;\n}\n\n/** Следующее направление сортировки при клике по заголовку: none → asc → desc → none. */\nconst getNextOrderDirection = (currentDirection: EOrderDirection): EOrderDirection => {\n    switch (currentDirection) {\n        case EOrderDirection.NONE:\n            return EOrderDirection.ASC;\n        case EOrderDirection.ASC:\n            return EOrderDirection.DESC;\n        case EOrderDirection.DESC:\n            return EOrderDirection.NONE;\n    }\n};\n\n/** Иконка, соответствующая текущему направлению сортировки. */\nconst getOrderIcon = (orderDirection: EOrderDirection): React.JSX.Element => {\n    switch (orderDirection) {\n        case EOrderDirection.NONE:\n            return <SortStrokeSrvIcon16 paletteIndex={5} />;\n        case EOrderDirection.ASC:\n            return <SortincreaseStrokeSrvIcon16 paletteIndex={5} />;\n        case EOrderDirection.DESC:\n            return <SortdecreaseStrokeSrvIcon16 paletteIndex={5} />;\n    }\n};\n\n/** Компонент заголовка таблицы. */\nexport const TableBasicHeader = ({ columns, onOrderBy }: ITableBasicHeaderProps) => {\n    const hasOrderFunc = onOrderBy != null;\n\n    /** Обработчик клика сортировки столбца. */\n    const handleClickOrder = (fieldKey: string, currentDirection: EOrderDirection) => {\n        onOrderBy?.({ direction: getNextOrderDirection(currentDirection), fieldKey });\n    };\n\n    /** Рендер кнопки сортировки столбца. */\n    const renderOrderButton = (column: ITableBasicColumn, orderDirection: EOrderDirection) => {\n        const orderButtonClassName = clsx(styles.orderButton, {\n            [styles.alignLeft]: column.horizontalAlign === EHorizontalAlign.RIGHT,\n            [styles.alignRight]: column.horizontalAlign !== EHorizontalAlign.RIGHT,\n            [styles.sorted]: orderDirection !== EOrderDirection.NONE,\n        });\n\n        return <span className={orderButtonClassName}>{getOrderIcon(orderDirection)}</span>;\n    };\n\n    /** Рендер заголовка столбца. */\n    const renderTh = (column: ITableBasicColumn) => {\n        // Столбец скрыт.\n        if (column.hidden) {\n            return null;\n        }\n\n        const { ariaAttributes, cellType, dataAttributes, fieldKey, horizontalAlign, label, orderDirection, title } =\n            column;\n        const styleTh = column.width\n            ? { maxWidth: column.width, minWidth: column.width, width: column.width }\n            : undefined;\n        // Сортировка доступна, только если задан обработчик и у столбца есть текущее направление сортировки.\n        const orderEnabled = hasOrderFunc && orderDirection != null;\n        const classNameTh = clsx(mapHorizontalAlignToClassName(horizontalAlign), {\n            [styles.checkboxType]: cellType === ECellType.CHECKBOX,\n        });\n        const classNameThBlock = clsx(styles.thBlock, \"hoverable\", {\n            [styles.order]: orderEnabled,\n        });\n\n        const labelElement = [ECellType.TEXT, undefined].includes(cellType) ? (\n            <Text size={ETextSize.B3}>{label}</Text>\n        ) : (\n            label\n        );\n        const orderButton = orderEnabled ? renderOrderButton(column, orderDirection) : null;\n\n        const content =\n            horizontalAlign === EHorizontalAlign.RIGHT ? (\n                <>\n                    {orderButton}\n                    {labelElement}\n                </>\n            ) : (\n                <>\n                    {labelElement}\n                    {orderButton}\n                </>\n            );\n\n        return (\n            <th className={classNameTh} title={title} key={fieldKey} style={styleTh}>\n                <span\n                    className={classNameThBlock}\n                    onClick={orderEnabled ? () => handleClickOrder(fieldKey, orderDirection) : undefined}\n                    {...(ariaAttributes && getAriaHTMLAttributes(ariaAttributes))}\n                    {...(dataAttributes && getDataHTMLAttributes(dataAttributes))}\n                >\n                    {content}\n                </span>\n            </th>\n        );\n    };\n\n    return (\n        <thead>\n            <tr>{columns.map((column) => renderTh(column))}</tr>\n        </thead>\n    );\n};\n\nTableBasicHeader.displayName = \"TableBasicHeader\";\n"],"names":[],"mappings":";;;;;;;;;AA6BA,MAAM,wBAAwB,CAAC,qBAAuD;AAClF,UAAQ,kBAAA;AAAA,IACJ,KAAK,gBAAgB;AACjB,aAAO,gBAAgB;AAAA,IAC3B,KAAK,gBAAgB;AACjB,aAAO,gBAAgB;AAAA,IAC3B,KAAK,gBAAgB;AACjB,aAAO,gBAAgB;AAAA,EAAA;AAEnC;AAGA,MAAM,eAAe,CAAC,mBAAuD;AACzE,UAAQ,gBAAA;AAAA,IACJ,KAAK,gBAAgB;AACjB,aAAO,oBAAC,qBAAA,EAAoB,cAAc,EAAA,CAAG;AAAA,IACjD,KAAK,gBAAgB;AACjB,aAAO,oBAAC,6BAAA,EAA4B,cAAc,EAAA,CAAG;AAAA,IACzD,KAAK,gBAAgB;AACjB,aAAO,oBAAC,6BAAA,EAA4B,cAAc,EAAA,CAAG;AAAA,EAAA;AAEjE;AAGO,MAAM,mBAAmB,CAAC,EAAE,SAAS,gBAAwC;AAChF,QAAM,eAAe,aAAa;AAGlC,QAAM,mBAAmB,CAAC,UAAkB,qBAAsC;AAC9E,2CAAY,EAAE,WAAW,sBAAsB,gBAAgB,GAAG;EACtE;AAGA,QAAM,oBAAoB,CAAC,QAA2B,mBAAoC;AACtF,UAAM,uBAAuB,KAAK,OAAO,aAAa;AAAA,MAClD,CAAC,OAAO,SAAS,GAAG,OAAO,oBAAoB,iBAAiB;AAAA,MAChE,CAAC,OAAO,UAAU,GAAG,OAAO,oBAAoB,iBAAiB;AAAA,MACjE,CAAC,OAAO,MAAM,GAAG,mBAAmB,gBAAgB;AAAA,IAAA,CACvD;AAED,+BAAQ,QAAA,EAAK,WAAW,sBAAuB,UAAA,aAAa,cAAc,GAAE;AAAA,EAChF;AAGA,QAAM,WAAW,CAAC,WAA8B;AAE5C,QAAI,OAAO,QAAQ;AACf,aAAO;AAAA,IACX;AAEA,UAAM,EAAE,gBAAgB,UAAU,gBAAgB,UAAU,iBAAiB,OAAO,gBAAgB,MAAA,IAChG;AACJ,UAAM,UAAU,OAAO,QACjB,EAAE,UAAU,OAAO,OAAO,UAAU,OAAO,OAAO,OAAO,OAAO,UAChE;AAEN,UAAM,eAAe,gBAAgB,kBAAkB;AACvD,UAAM,cAAc,KAAK,8BAA8B,eAAe,GAAG;AAAA,MACrE,CAAC,OAAO,YAAY,GAAG,aAAa,UAAU;AAAA,IAAA,CACjD;AACD,UAAM,mBAAmB,KAAK,OAAO,SAAS,aAAa;AAAA,MACvD,CAAC,OAAO,KAAK,GAAG;AAAA,IAAA,CACnB;AAED,UAAM,eAAe,CAAC,UAAU,MAAM,MAAS,EAAE,SAAS,QAAQ,wBAC7D,MAAA,EAAK,MAAM,UAAU,IAAK,iBAAM,IAEjC;AAEJ,UAAM,cAAc,eAAe,kBAAkB,QAAQ,cAAc,IAAI;AAE/E,UAAM,UACF,oBAAoB,iBAAiB,QACjC,qBAAA,UAAA,EACK,UAAA;AAAA,MAAA;AAAA,MACA;AAAA,IAAA,EAAA,CACL,IAEA,qBAAA,UAAA,EACK,UAAA;AAAA,MAAA;AAAA,MACA;AAAA,IAAA,GACL;AAGR,+BACK,MAAA,EAAG,WAAW,aAAa,OAA6B,OAAO,SAC5D,UAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,WAAW;AAAA,QACX,SAAS,eAAe,MAAM,iBAAiB,UAAU,cAAc,IAAI;AAAA,QAC1E,GAAI,kBAAkB,sBAAsB,cAAc;AAAA,QAC1D,GAAI,kBAAkB,sBAAsB,cAAc;AAAA,QAE1D,UAAA;AAAA,MAAA;AAAA,IAAA,KAPsC,QAS/C;AAAA,EAER;AAEA,SACI,oBAAC,SAAA,EACG,UAAA,oBAAC,MAAA,EAAI,UAAA,QAAQ,IAAI,CAAC,WAAW,SAAS,MAAM,CAAC,EAAA,CAAE,GACnD;AAER;AAEA,iBAAiB,cAAc;"}

package/components/Table/TableBasic/components/TableBasicRow.js

@@ -2,17 +2,25 @@ import { jsx } from "react/jsx-runtime";
 import { getAriaHTMLAttributes } from "../../../../utils/html/AriaAttributes.js";
 import { getDataHTMLAttributes } from "../../../../utils/html/DataAttributes.js";
 import { DataTestId } from "../../../../consts/DataTestId.js";
-import { c as clsx } from "../../../../chunks/vendor-DfvHt3TJ.js";
-import { s as styles, a as mapVerticalAlignToClassName, m as mapHorizontalAlignToClassName, b as mapCellTypeToClassName } from "../../../../chunks/utils-BO2qfDaA.js";
+import { c as clsx } from "../../../../chunks/vendor-D4wvHis9.js";
+import { s as styles, a as mapVerticalAlignToClassName, m as mapHorizontalAlignToClassName, b as mapCellTypeToClassName } from "../../../../chunks/utils-BL5AUOKS.js";
 import { ECellType, EVerticalAlign } from "../enums.js";
 import { ETextSize } from "../../../Typography/enums.js";
 import { Text } from "../../../Typography/Text.js";
+const renderCellContent = (cellNode, cellType) => {
+  if (!cellNode) {
+    return /* @__PURE__ */ jsx(Text, { size: ETextSize.B3, tag: "div", children: "---" });
+  }
+  if (cellType === ECellType.CHECKBOX || cellType === ECellType.COMPONENTS) {
+    return cellNode;
+  }
+  return /* @__PURE__ */ jsx(Text, { size: ETextSize.B3, tag: "div", children: cellNode });
+};
 const TableBasicRow = ({ columns, data, onClickRow }) => {
   const { rowKey, rowData, rowLayout, ariaAttributes, dataAttributes, selected = false } = data;
   const classNameTr = clsx({ [styles.selected]: selected, selected });
-  const onClick = onClickRow ? () => onClickRow(rowKey) : void 0;
-  const dataTestId = dataAttributes ? dataAttributes["test-id"] : void 0;
-  const renderTd = (column, value, spanProps, dataTestId2) => {
+  const dataTestId = dataAttributes == null ? void 0 : dataAttributes["test-id"];
+  const renderTd = (column, value, spanProps) => {
     if (column.hidden) {
       return null;
     }
@@ -24,42 +32,31 @@ const TableBasicRow = ({ columns, data, onClickRow }) => {
       mapHorizontalAlignToClassName(column.horizontalAlign),
       mapVerticalAlignToClassName(verticalAlign)
     );
-    const style = column.width ? { width: column.width } : void 0;
-    const renderContent = () => {
-      if (!cellNode) {
-        return /* @__PURE__ */ jsx(Text, { size: ETextSize.B3, tag: "div", children: "---" });
-      }
-      if (cellType === ECellType.CHECKBOX || cellType === ECellType.COMPONENTS) {
-        return cellNode;
-      }
-      return /* @__PURE__ */ jsx(Text, { size: ETextSize.B3, tag: "div", children: cellNode });
-    };
     return /* @__PURE__ */ jsx(
       "td",
       {
         className: classNames,
         ...spanProps,
-        "data-test-id": dataTestId2 && `${dataTestId2}__${column.fieldKey}${DataTestId.Table.TableBasic.td}`,
-        style,
-        children: renderContent()
+        "data-test-id": dataTestId && `${dataTestId}__${column.fieldKey}${DataTestId.Table.TableBasic.td}`,
+        style: column.width ? { width: column.width } : void 0,
+        children: renderCellContent(cellNode, cellType)
       },
       column.fieldKey
     );
   };
-  const tdList = columns.map((column) => {
-    const { fieldKey } = column;
-    if (Object.keys(rowData).indexOf(fieldKey) !== -1) {
-      return renderTd(column, rowData[fieldKey], rowLayout == null ? void 0 : rowLayout[fieldKey], dataTestId);
-    }
-  });
   return /* @__PURE__ */ jsx(
     "tr",
     {
       className: classNameTr,
-      onClick,
-      ...Boolean(ariaAttributes) && getAriaHTMLAttributes(ariaAttributes),
-      ...Boolean(dataAttributes) && getDataHTMLAttributes(dataAttributes),
-      children: tdList
+      onClick: onClickRow ? () => onClickRow(rowKey) : void 0,
+      ...ariaAttributes && getAriaHTMLAttributes(ariaAttributes),
+      ...dataAttributes && getDataHTMLAttributes(dataAttributes),
+      children: columns.map(
+        (column) => (
+          // Ячейка рендерится, только если в данных строки есть соответствующий ключ.
+          Object.keys(rowData).includes(column.fieldKey) ? renderTd(column, rowData[column.fieldKey], rowLayout == null ? void 0 : rowLayout[column.fieldKey]) : null
+        )
+      )
     }
   );
 };

package/components/Table/TableBasic/components/TableBasicRow.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableBasicRow.js","sources":["../../../../../src/components/Table/TableBasic/components/TableBasicRow.tsx"],"sourcesContent":["import React from \"react\";\nimport { getAriaHTMLAttributes } from \"@sberbusiness/triplex-next/utils/html/AriaAttributes\";\nimport { getDataHTMLAttributes } from \"@sberbusiness/triplex-next/utils/html/DataAttributes\";\nimport { DataTestId } from \"@sberbusiness/triplex-next/consts/DataTestId\";\nimport { clsx } from \"clsx\";\nimport styles from \"./../styles/TableBasic.module.less\";\nimport {\n    mapCellTypeToClassName,\n    mapHorizontalAlignToClassName,\n    mapVerticalAlignToClassName,\n} from \"@sberbusiness/triplex-next/components/Table/utils\";\nimport {\n    ITableBasicColumn,\n    ITableBasicRow,\n    ITableRowCellSpanProps,\n} from \"@sberbusiness/triplex-next/components/Table/TableBasic/types\";\nimport { ECellType, EVerticalAlign } from \"@sberbusiness/triplex-next/components/Table/TableBasic/enums\";\nimport { ETextSize } from \"@sberbusiness/triplex-next/components/Typography/enums\";\nimport { Text } from \"@sberbusiness/triplex-next/components/Typography/Text\";\n\n/** Свойства TableBasicRow. */\ninterface ITableBasicRowProps {\n    /** Структура заголовков таблицы. */\n    columns: ITableBasicColumn[];\n    /** Значение для вывода в строке. */\n    data: ITableBasicRow;\n    /** Функция обработки клика по строке таблицы. */\n    onClickRow?: (rowKey: string) => void;\n}\n\n/** Компонент строки в теле таблицы. */\nexport const TableBasicRow = ({ columns, data, onClickRow }: ITableBasicRowProps) => {\n    const { rowKey, rowData, rowLayout, ariaAttributes, dataAttributes, selected = false } = data;\n\n    const classNameTr = clsx({ [styles.selected]: selected, selected });\n    const onClick = onClickRow ? () => onClickRow(rowKey) : undefined;\n    const dataTestId = dataAttributes ? dataAttributes[\"test-id\"] : undefined;\n\n    const renderTd = (\n        column: ITableBasicColumn,\n        value: React.ReactNode,\n        spanProps?: ITableRowCellSpanProps,\n        dataTestId?: string,\n    ) => {\n        // Столбец скрыт.\n        if (column.hidden) {\n            return null;\n        }\n\n        const cellNode: React.ReactNode = column.renderCell ? column.renderCell(value) : value;\n        const cellType = column.cellType ?? ECellType.TEXT;\n        const verticalAlign =\n            column.verticalAlign ?? (cellType === ECellType.TEXT ? EVerticalAlign.BASELINE : EVerticalAlign.TOP);\n        const classNames = clsx(\n            mapCellTypeToClassName(cellType),\n            mapHorizontalAlignToClassName(column.horizontalAlign),\n            mapVerticalAlignToClassName(verticalAlign),\n        );\n        const style = column.width ? { width: column.width } : undefined;\n\n        const renderContent = () => {\n            if (!cellNode) {\n                return (\n                    <Text size={ETextSize.B3} tag=\"div\">\n                        ---\n                    </Text>\n                );\n            }\n\n            if (cellType === ECellType.CHECKBOX || cellType === ECellType.COMPONENTS) {\n                return cellNode;\n            }\n\n            return (\n                <Text size={ETextSize.B3} tag=\"div\">\n                    {cellNode}\n                </Text>\n            );\n        };\n\n        return (\n            <td\n                key={column.fieldKey}\n                className={classNames}\n                {...spanProps}\n                data-test-id={dataTestId && `${dataTestId}__${column.fieldKey}${DataTestId.Table.TableBasic.td}`}\n                style={style}\n            >\n                {renderContent()}\n            </td>\n        );\n    };\n\n    const tdList = columns.map((column) => {\n        const { fieldKey } = column;\n\n        if (Object.keys(rowData).indexOf(fieldKey) !== -1) {\n            return renderTd(column, rowData[fieldKey], rowLayout?.[fieldKey], dataTestId);\n        }\n    });\n\n    return (\n        <tr\n            className={classNameTr}\n            onClick={onClick}\n            {...(Boolean(ariaAttributes) && getAriaHTMLAttributes(ariaAttributes!))}\n            {...(Boolean(dataAttributes) && getDataHTMLAttributes(dataAttributes!))}\n        >\n            {tdList}\n        </tr>\n    );\n};\n\nTableBasicRow.displayName = \"TableBasicRow\";\n"],"names":["dataTestId"],"mappings":";;;;;;;;;AA+BO,MAAM,gBAAgB,CAAC,EAAE,SAAS,MAAM,iBAAsC;AACjF,QAAM,EAAE,QAAQ,SAAS,WAAW,gBAAgB,gBAAgB,WAAW,UAAU;AAEzF,QAAM,cAAc,KAAK,EAAE,CAAC,OAAO,QAAQ,GAAG,UAAU,UAAU;AAClE,QAAM,UAAU,aAAa,MAAM,WAAW,MAAM,IAAI;AACxD,QAAM,aAAa,iBAAiB,eAAe,SAAS,IAAI;AAEhE,QAAM,WAAW,CACb,QACA,OACA,WACAA,gBACC;AAED,QAAI,OAAO,QAAQ;AACf,aAAO;AAAA,IACX;AAEA,UAAM,WAA4B,OAAO,aAAa,OAAO,WAAW,KAAK,IAAI;AACjF,UAAM,WAAW,OAAO,YAAY,UAAU;AAC9C,UAAM,gBACF,OAAO,kBAAkB,aAAa,UAAU,OAAO,eAAe,WAAW,eAAe;AACpG,UAAM,aAAa;AAAA,MACf,uBAAuB,QAAQ;AAAA,MAC/B,8BAA8B,OAAO,eAAe;AAAA,MACpD,4BAA4B,aAAa;AAAA,IAAA;AAE7C,UAAM,QAAQ,OAAO,QAAQ,EAAE,OAAO,OAAO,UAAU;AAEvD,UAAM,gBAAgB,MAAM;AACxB,UAAI,CAAC,UAAU;AACX,mCACK,MAAA,EAAK,MAAM,UAAU,IAAI,KAAI,OAAM,UAAA,OAEpC;AAAA,MAER;AAEA,UAAI,aAAa,UAAU,YAAY,aAAa,UAAU,YAAY;AACtE,eAAO;AAAA,MACX;AAEA,iCACK,MAAA,EAAK,MAAM,UAAU,IAAI,KAAI,OACzB,UAAA,UACL;AAAA,IAER;AAEA,WACI;AAAA,MAAC;AAAA,MAAA;AAAA,QAEG,WAAW;AAAA,QACV,GAAG;AAAA,QACJ,gBAAcA,eAAc,GAAGA,WAAU,KAAK,OAAO,QAAQ,GAAG,WAAW,MAAM,WAAW,EAAE;AAAA,QAC9F;AAAA,QAEC,UAAA,cAAA;AAAA,MAAc;AAAA,MANV,OAAO;AAAA,IAAA;AAAA,EASxB;AAEA,QAAM,SAAS,QAAQ,IAAI,CAAC,WAAW;AACnC,UAAM,EAAE,aAAa;AAErB,QAAI,OAAO,KAAK,OAAO,EAAE,QAAQ,QAAQ,MAAM,IAAI;AAC/C,aAAO,SAAS,QAAQ,QAAQ,QAAQ,GAAG,uCAAY,WAAW,UAAU;AAAA,IAChF;AAAA,EACJ,CAAC;AAED,SACI;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,WAAW;AAAA,MACX;AAAA,MACC,GAAI,QAAQ,cAAc,KAAK,sBAAsB,cAAe;AAAA,MACpE,GAAI,QAAQ,cAAc,KAAK,sBAAsB,cAAe;AAAA,MAEpE,UAAA;AAAA,IAAA;AAAA,EAAA;AAGb;AAEA,cAAc,cAAc;"}
+{"version":3,"file":"TableBasicRow.js","sources":["../../../../../src/components/Table/TableBasic/components/TableBasicRow.tsx"],"sourcesContent":["import React from \"react\";\nimport { getAriaHTMLAttributes } from \"@sberbusiness/triplex-next/utils/html/AriaAttributes\";\nimport { getDataHTMLAttributes } from \"@sberbusiness/triplex-next/utils/html/DataAttributes\";\nimport { DataTestId } from \"@sberbusiness/triplex-next/consts/DataTestId\";\nimport { clsx } from \"clsx\";\nimport styles from \"../styles/TableBasic.module.less\";\nimport {\n    mapCellTypeToClassName,\n    mapHorizontalAlignToClassName,\n    mapVerticalAlignToClassName,\n} from \"@sberbusiness/triplex-next/components/Table/utils\";\nimport {\n    ITableBasicColumn,\n    ITableBasicRow,\n    ITableRowCellSpanProps,\n} from \"@sberbusiness/triplex-next/components/Table/TableBasic/types\";\nimport { ECellType, EVerticalAlign } from \"@sberbusiness/triplex-next/components/Table/TableBasic/enums\";\nimport { ETextSize } from \"@sberbusiness/triplex-next/components/Typography/enums\";\nimport { Text } from \"@sberbusiness/triplex-next/components/Typography/Text\";\n\n/** Свойства компонента TableBasicRow. */\ninterface ITableBasicRowProps {\n    /** Структура заголовков таблицы. */\n    columns: ITableBasicColumn[];\n    /** Значение для вывода в строке. */\n    data: ITableBasicRow;\n    /** Функция обработки клика по строке таблицы. */\n    onClickRow?: (rowKey: string) => void;\n}\n\n/** Рендер содержимого ячейки: типы CHECKBOX и COMPONENTS выводятся как есть, остальные оборачиваются в Text. */\nconst renderCellContent = (cellNode: React.ReactNode, cellType: ECellType) => {\n    if (!cellNode) {\n        return (\n            <Text size={ETextSize.B3} tag=\"div\">\n                ---\n            </Text>\n        );\n    }\n\n    if (cellType === ECellType.CHECKBOX || cellType === ECellType.COMPONENTS) {\n        return cellNode;\n    }\n\n    return (\n        <Text size={ETextSize.B3} tag=\"div\">\n            {cellNode}\n        </Text>\n    );\n};\n\n/** Компонент строки в теле таблицы. */\nexport const TableBasicRow = ({ columns, data, onClickRow }: ITableBasicRowProps) => {\n    const { rowKey, rowData, rowLayout, ariaAttributes, dataAttributes, selected = false } = data;\n\n    const classNameTr = clsx({ [styles.selected]: selected, selected });\n    const dataTestId = dataAttributes?.[\"test-id\"];\n\n    const renderTd = (column: ITableBasicColumn, value: React.ReactNode, spanProps?: ITableRowCellSpanProps) => {\n        // Столбец скрыт.\n        if (column.hidden) {\n            return null;\n        }\n\n        const cellNode: React.ReactNode = column.renderCell ? column.renderCell(value) : value;\n        const cellType = column.cellType ?? ECellType.TEXT;\n        // Текст выравнивается по базовой линии, произвольная разметка — по верхнему краю ячейки.\n        const verticalAlign =\n            column.verticalAlign ?? (cellType === ECellType.TEXT ? EVerticalAlign.BASELINE : EVerticalAlign.TOP);\n        const classNames = clsx(\n            mapCellTypeToClassName(cellType),\n            mapHorizontalAlignToClassName(column.horizontalAlign),\n            mapVerticalAlignToClassName(verticalAlign),\n        );\n\n        return (\n            <td\n                key={column.fieldKey}\n                className={classNames}\n                {...spanProps}\n                data-test-id={dataTestId && `${dataTestId}__${column.fieldKey}${DataTestId.Table.TableBasic.td}`}\n                style={column.width ? { width: column.width } : undefined}\n            >\n                {renderCellContent(cellNode, cellType)}\n            </td>\n        );\n    };\n\n    return (\n        <tr\n            className={classNameTr}\n            onClick={onClickRow ? () => onClickRow(rowKey) : undefined}\n            {...(ariaAttributes && getAriaHTMLAttributes(ariaAttributes))}\n            {...(dataAttributes && getDataHTMLAttributes(dataAttributes))}\n        >\n            {columns.map((column) =>\n                // Ячейка рендерится, только если в данных строки есть соответствующий ключ.\n                Object.keys(rowData).includes(column.fieldKey)\n                    ? renderTd(column, rowData[column.fieldKey], rowLayout?.[column.fieldKey])\n                    : null,\n            )}\n        </tr>\n    );\n};\n\nTableBasicRow.displayName = \"TableBasicRow\";\n"],"names":[],"mappings":";;;;;;;;;AA+BA,MAAM,oBAAoB,CAAC,UAA2B,aAAwB;AAC1E,MAAI,CAAC,UAAU;AACX,+BACK,MAAA,EAAK,MAAM,UAAU,IAAI,KAAI,OAAM,UAAA,OAEpC;AAAA,EAER;AAEA,MAAI,aAAa,UAAU,YAAY,aAAa,UAAU,YAAY;AACtE,WAAO;AAAA,EACX;AAEA,6BACK,MAAA,EAAK,MAAM,UAAU,IAAI,KAAI,OACzB,UAAA,UACL;AAER;AAGO,MAAM,gBAAgB,CAAC,EAAE,SAAS,MAAM,iBAAsC;AACjF,QAAM,EAAE,QAAQ,SAAS,WAAW,gBAAgB,gBAAgB,WAAW,UAAU;AAEzF,QAAM,cAAc,KAAK,EAAE,CAAC,OAAO,QAAQ,GAAG,UAAU,UAAU;AAClE,QAAM,aAAa,iDAAiB;AAEpC,QAAM,WAAW,CAAC,QAA2B,OAAwB,cAAuC;AAExG,QAAI,OAAO,QAAQ;AACf,aAAO;AAAA,IACX;AAEA,UAAM,WAA4B,OAAO,aAAa,OAAO,WAAW,KAAK,IAAI;AACjF,UAAM,WAAW,OAAO,YAAY,UAAU;AAE9C,UAAM,gBACF,OAAO,kBAAkB,aAAa,UAAU,OAAO,eAAe,WAAW,eAAe;AACpG,UAAM,aAAa;AAAA,MACf,uBAAuB,QAAQ;AAAA,MAC/B,8BAA8B,OAAO,eAAe;AAAA,MACpD,4BAA4B,aAAa;AAAA,IAAA;AAG7C,WACI;AAAA,MAAC;AAAA,MAAA;AAAA,QAEG,WAAW;AAAA,QACV,GAAG;AAAA,QACJ,gBAAc,cAAc,GAAG,UAAU,KAAK,OAAO,QAAQ,GAAG,WAAW,MAAM,WAAW,EAAE;AAAA,QAC9F,OAAO,OAAO,QAAQ,EAAE,OAAO,OAAO,UAAU;AAAA,QAE/C,UAAA,kBAAkB,UAAU,QAAQ;AAAA,MAAA;AAAA,MANhC,OAAO;AAAA,IAAA;AAAA,EASxB;AAEA,SACI;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,WAAW;AAAA,MACX,SAAS,aAAa,MAAM,WAAW,MAAM,IAAI;AAAA,MAChD,GAAI,kBAAkB,sBAAsB,cAAc;AAAA,MAC1D,GAAI,kBAAkB,sBAAsB,cAAc;AAAA,MAE1D,UAAA,QAAQ;AAAA,QAAI,CAAC;AAAA;AAAA,UAEV,OAAO,KAAK,OAAO,EAAE,SAAS,OAAO,QAAQ,IACvC,SAAS,QAAQ,QAAQ,OAAO,QAAQ,GAAG,uCAAY,OAAO,SAAS,IACvE;AAAA;AAAA,MAAA;AAAA,IACV;AAAA,EAAA;AAGZ;AAEA,cAAc,cAAc;"}

package/components/Table/TableBasicSettings/TableBasicSettings.js

@@ -1,14 +1,14 @@
 import { jsx } from "react/jsx-runtime";
 import { useRef } from "react";
 import { ButtonDropdownExtended } from "../../Button/ButtonDropdownExtended.js";
-import { c as clsx } from "../../../chunks/vendor-DfvHt3TJ.js";
+import { c as clsx } from "../../../chunks/vendor-D4wvHis9.js";
 import { TableBasicSettingsBody } from "./components/TableBasicSettingsBody.js";
 import { ColumnSettings } from "./components/ColumnSettings.js";
 import { TableBasicSettingsFooter } from "./components/TableBasicSettingsFooter.js";
 import { TableBasicSettingsHeader } from "./components/TableBasicSettingsHeader.js";
 import { Link } from "../../Link/Link.js";
-const tableSettingsLink = "tableSettingsLink__dc97b915";
-const tableSettingsDropdown = "tableSettingsDropdown__468cc0b1";
+const tableSettingsLink = "tableSettingsLink__3a5427a8";
+const tableSettingsDropdown = "tableSettingsDropdown__7e5b3fa1";
 const styles = {
   tableSettingsLink,
   tableSettingsDropdown

package/components/Table/TableBasicSettings/components/ColumnSettingsSortableListItemTarget.js

@@ -2,9 +2,9 @@ import { jsx } from "react/jsx-runtime";
 import React__default from "react";
 import { ListSortableItemTarget } from "../../../List/components/ListSortableItemTarget.js";
 import { ListSortableItemControls } from "../../../List/components/ListSortableItemControls.js";
-import { c as clsx } from "../../../../chunks/vendor-DfvHt3TJ.js";
-const columnSettingsSortableListItemTarget = "columnSettingsSortableListItemTarget__f1644c1c";
-const dragging = "dragging__2a8f2107";
+import { c as clsx } from "../../../../chunks/vendor-D4wvHis9.js";
+const columnSettingsSortableListItemTarget = "columnSettingsSortableListItemTarget__6f5e611f";
+const dragging = "dragging__67b40f12";
 const styles = {
   columnSettingsSortableListItemTarget,
   dragging

package/components/Table/TableBasicSettings/components/ColumnSettingsStaticListItem.js

@@ -1,8 +1,8 @@
 import { jsx } from "react/jsx-runtime";
 import React__default from "react";
-import { c as clsx } from "../../../../chunks/vendor-DfvHt3TJ.js";
+import { c as clsx } from "../../../../chunks/vendor-D4wvHis9.js";
 import { ListItem } from "../../../List/components/ListItem.js";
-const columnSettingsStaticListItem = "columnSettingsStaticListItem__fa768539";
+const columnSettingsStaticListItem = "columnSettingsStaticListItem__d425fe5b";
 const styles = {
   columnSettingsStaticListItem
 };

package/components/Table/TableBasicSettings/components/TableBasicSettingsBody.js

@@ -1,7 +1,7 @@
 import { jsx } from "react/jsx-runtime";
 import React__default from "react";
-import { c as clsx } from "../../../../chunks/vendor-DfvHt3TJ.js";
-const tableBasicSettingsBody = "tableBasicSettingsBody__68156bfc";
+import { c as clsx } from "../../../../chunks/vendor-D4wvHis9.js";
+const tableBasicSettingsBody = "tableBasicSettingsBody__5e7c0486";
 const styles = {
   tableBasicSettingsBody
 };

package/components/Table/TableBasicSettings/components/TableBasicSettingsFooter.js

@@ -1,7 +1,7 @@
 import { jsx } from "react/jsx-runtime";
 import React__default from "react";
-import { c as clsx } from "../../../../chunks/vendor-DfvHt3TJ.js";
-const tableBasicSettingsFooter = "tableBasicSettingsFooter__2042ea02";
+import { c as clsx } from "../../../../chunks/vendor-D4wvHis9.js";
+const tableBasicSettingsFooter = "tableBasicSettingsFooter__f14cb154";
 const styles = {
   tableBasicSettingsFooter
 };

package/components/Table/TableBasicSettings/components/TableBasicSettingsHeader.js

@@ -1,8 +1,8 @@
 import { jsx } from "react/jsx-runtime";
-import { c as clsx } from "../../../../chunks/vendor-DfvHt3TJ.js";
+import { c as clsx } from "../../../../chunks/vendor-D4wvHis9.js";
 import { Text } from "../../../Typography/Text.js";
 import { EFontWeightText, ETextSize } from "../../../Typography/enums.js";
-const tableBasicSettingsHeader = "tableBasicSettingsHeader__ab45882b";
+const tableBasicSettingsHeader = "tableBasicSettingsHeader__b36bfd76";
 const styles = {
   tableBasicSettingsHeader
 };