@alphakits/ui 2.0.7 → 2.0.8

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/table/columns.js

@@ -1,6 +1,5 @@
 import { jsx as e } from "react/jsx-runtime";
-import { Button as o } from "../button/component.js";
-const l = () => [
+const r = () => [
   {
     header: "Title",
     accessor: "title",
@@ -49,7 +48,6 @@ const l = () => [
     align: "right",
     width: "200px",
     row: {
-      title: ({ refetch: t }) => /* @__PURE__ */ e(o, { onClick: t, children: "Refetch" }),
       customAddon: ({ row: t }) => /* @__PURE__ */ e("div", { style: { background: "red" }, children: t.title.length })
     }
   }
@@ -62,6 +60,6 @@ const l = () => [
   // },
 ];
 export {
-  l as NewColumns
+  r as NewColumns
 };
 //# sourceMappingURL=columns.js.map

package/dist/table/columns.js.map

@@ -1 +1 @@
-{"version":3,"file":"columns.js","sources":["../../src/table/columns.tsx"],"sourcesContent":["import React from 'react';\n\nimport { Button } from '../button';\n\nimport { TableColumns } from './types';\n\ntype Row = {\n    title: string;\n    photo: string;\n};\n\nexport const NewColumns = (): TableColumns<Row> => [\n    {\n        header: 'Title',\n        accessor: 'title',\n        sort: true,\n        row: {\n            image: () => 'https://via.placeholder.com/150',\n            subtitle: 'title',\n        },\n    },\n    {\n        header: 'Photo',\n        accessor: 'photo',\n        sort: true,\n        row: {\n            title: ({ row }) => `${row.title}awdawd`,\n            image: ({ row }) => row.photo,\n        },\n    },\n    // ,{\n    //     header: 'Brakin photo',\n    //     sort: true,\n    //     row: {\n    //         image: ({ row }) => row.title,\n    //     },\n    // },{\n    //     header: 'No photo',\n    //     sort: true,\n    //     row: {\n    //         image: () => '',\n    //     },\n    // },\n    // {\n    //     header: 'icon',\n    //     row: {\n    //         icon: () => <ChevronForwardS />,\n    //     },\n    // },\n    {\n        header: 'no icon',\n        row: {\n            icon: () => '',\n        },\n    },\n    {\n        header: 'Button',\n        align: 'right',\n        width: '200px',\n        row: {\n            title: ({ refetch }) => <Button onClick={ refetch }>Refetch</Button>,\n            customAddon: ({ row }) => <div style={ { background: 'red' } }>{ row.title.length }</div>,\n        },\n    },\n    // {\n    //     header: 'Button',\n    //     width: '50px',\n    //     row: {\n    //         title: null,\n    //     },\n    // },\n];\n"],"names":["NewColumns","row","refetch","jsx","Button"],"mappings":";;AAWO,MAAMA,IAAa,MAAyB;AAAA,EAC/C;AAAA,IACI,QAAQ;AAAA,IACR,UAAU;AAAA,IACV,MAAM;AAAA,IACN,KAAK;AAAA,MACD,OAAO,MAAM;AAAA,MACb,UAAU;AAAA,IAAA;AAAA,EACd;AAAA,EAEJ;AAAA,IACI,QAAQ;AAAA,IACR,UAAU;AAAA,IACV,MAAM;AAAA,IACN,KAAK;AAAA,MACD,OAAO,CAAC,EAAE,KAAAC,QAAU,GAAGA,EAAI,KAAK;AAAA,MAChC,OAAO,CAAC,EAAE,KAAAA,EAAA,MAAUA,EAAI;AAAA,IAAA;AAAA,EAC5B;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAqBJ;AAAA,IACI,QAAQ;AAAA,IACR,KAAK;AAAA,MACD,MAAM,MAAM;AAAA,IAAA;AAAA,EAChB;AAAA,EAEJ;AAAA,IACI,QAAQ;AAAA,IACR,OAAO;AAAA,IACP,OAAO;AAAA,IACP,KAAK;AAAA,MACD,OAAO,CAAC,EAAE,SAAAC,EAAA,MAAc,gBAAAC,EAACC,GAAA,EAAO,SAAUF,GAAU,UAAA,WAAO;AAAA,MAC3D,aAAa,CAAC,EAAE,KAAAD,EAAA,MAAU,gBAAAE,EAAC,OAAA,EAAI,OAAQ,EAAE,YAAY,MAAA,GAAY,UAAAF,EAAI,MAAM,OAAA,CAAQ;AAAA,IAAA;AAAA,EACvF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AASR;"}
+{"version":3,"file":"columns.js","sources":["../../src/table/columns.tsx"],"sourcesContent":["import React from 'react';\n\nimport { TableColumns } from './types';\n\ntype Row = {\n    title: string;\n    photo: string;\n};\n\nexport const NewColumns = (): TableColumns<Row> => [\n    {\n        header: 'Title',\n        accessor: 'title',\n        sort: true,\n        row: {\n            image: () => 'https://via.placeholder.com/150',\n            subtitle: 'title',\n        },\n    },\n    {\n        header: 'Photo',\n        accessor: 'photo',\n        sort: true,\n        row: {\n            title: ({ row }) => `${row.title}awdawd`,\n            image: ({ row }) => row.photo,\n        },\n    },\n    // ,{\n    //     header: 'Brakin photo',\n    //     sort: true,\n    //     row: {\n    //         image: ({ row }) => row.title,\n    //     },\n    // },{\n    //     header: 'No photo',\n    //     sort: true,\n    //     row: {\n    //         image: () => '',\n    //     },\n    // },\n    // {\n    //     header: 'icon',\n    //     row: {\n    //         icon: () => <ChevronForwardS />,\n    //     },\n    // },\n    {\n        header: 'no icon',\n        row: {\n            icon: () => '',\n        },\n    },\n    {\n        header: 'Button',\n        align: 'right',\n        width: '200px',\n        row: {\n            customAddon: ({ row }) => <div style={ { background: 'red' } }>{ row.title.length }</div>,\n        },\n    },\n    // {\n    //     header: 'Button',\n    //     width: '50px',\n    //     row: {\n    //         title: null,\n    //     },\n    // },\n];\n"],"names":["NewColumns","row","jsx"],"mappings":";AASO,MAAMA,IAAa,MAAyB;AAAA,EAC/C;AAAA,IACI,QAAQ;AAAA,IACR,UAAU;AAAA,IACV,MAAM;AAAA,IACN,KAAK;AAAA,MACD,OAAO,MAAM;AAAA,MACb,UAAU;AAAA,IAAA;AAAA,EACd;AAAA,EAEJ;AAAA,IACI,QAAQ;AAAA,IACR,UAAU;AAAA,IACV,MAAM;AAAA,IACN,KAAK;AAAA,MACD,OAAO,CAAC,EAAE,KAAAC,QAAU,GAAGA,EAAI,KAAK;AAAA,MAChC,OAAO,CAAC,EAAE,KAAAA,EAAA,MAAUA,EAAI;AAAA,IAAA;AAAA,EAC5B;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAqBJ;AAAA,IACI,QAAQ;AAAA,IACR,KAAK;AAAA,MACD,MAAM,MAAM;AAAA,IAAA;AAAA,EAChB;AAAA,EAEJ;AAAA,IACI,QAAQ;AAAA,IACR,OAAO;AAAA,IACP,OAAO;AAAA,IACP,KAAK;AAAA,MACD,aAAa,CAAC,EAAE,KAAAA,EAAA,MAAU,gBAAAC,EAAC,OAAA,EAAI,OAAQ,EAAE,YAAY,MAAA,GAAY,UAAAD,EAAI,MAAM,OAAA,CAAQ;AAAA,IAAA;AAAA,EACvF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AASR;"}

package/dist/table/components/cell/component.d.ts

@@ -11,6 +11,7 @@ export type CellProps = {
     children?: React.ReactNode;
     width?: string;
     align?: 'left' | 'right' | 'center';
+    compact?: boolean;
     /**
      * HTML тег
      */

package/dist/table/components/cell/component.js

@@ -1,53 +1,60 @@
-import { jsx as r } from "react/jsx-runtime";
-import s from "classnames";
-import { Cell as v } from "../../../cell/component.js";
+import { jsx as s } from "react/jsx-runtime";
+import d from "classnames";
+import { Cell as T } from "../../../cell/component.js";
 import e from "./index.module.css.js";
-const y = ({
-  dataTestID: m,
-  className: o,
-  children: i,
-  title: c,
-  subtitle: a,
-  tableProps: d,
-  cellProps: h,
+const x = ({
+  dataTestID: a,
+  className: l,
+  children: m,
+  title: o,
+  subtitle: c,
+  tableProps: h,
+  cellProps: i,
   addon: f,
-  align: t,
-  width: p,
-  tag: l = "td"
-}) => /* @__PURE__ */ r(
-  l,
+  align: r,
+  compact: t,
+  width: v,
+  tag: n = "td"
+}) => /* @__PURE__ */ s(
+  n,
   {
-    "data-test-id": m,
-    className: s(e.cell, o, {
-      [e.is_div]: l === "div"
+    "data-test-id": a,
+    className: d(e.cell, l, {
+      [e.is_div]: n === "div",
+      [e.compact_cell]: t
     }),
-    style: { width: p },
-    ...d,
-    children: i ? /* @__PURE__ */ r(
+    style: { width: v },
+    ...h,
+    children: m ? /* @__PURE__ */ s(
       "div",
       {
-        className: s(e.children, {
-          [e.center]: t === "center",
-          [e.right]: t === "right"
+        className: d(e.children, {
+          [e.center]: r === "center",
+          [e.right]: r === "right"
         }),
-        children: i
+        children: m
       }
-    ) : /* @__PURE__ */ r(
-      v.Base,
+    ) : /* @__PURE__ */ s(
+      T.Base,
       {
-        title: c === void 0 ? "-" : c,
-        subtitle: a,
-        className: s({
-          [e.center]: t === "center",
-          [e.right]: t === "right"
+        title: o === void 0 ? "-" : o,
+        subtitle: c,
+        size: (i == null ? void 0 : i.size) || "s",
+        compactAddon: t,
+        singleLineTitle: t,
+        showTitleTooltipOnOverflow: t,
+        className: d({
+          [e.center]: r === "center",
+          [e.right]: r === "right",
+          [e.compact_content]: t
         }),
         addon: f,
-        ...h
+        ...i
       }
     )
   }
 );
 export {
-  y as TableCell
+  x as TableCell
 };
 //# sourceMappingURL=component.js.map

package/dist/table/components/cell/component.js.map

@@ -1 +1 @@
-{"version":3,"file":"component.js","sources":["../../../../src/table/components/cell/component.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\n\nimport { Cell as BaseCell } from '../../../cell';\nimport { BaseProps } from '../../../cell/base/component';\n\nimport styles from './index.module.css';\n\nexport type CellProps = {\n    className?: string;\n    dataTestID?: string;\n    title?: BaseProps['title'];\n    subtitle?: BaseProps['subtitle'];\n    cellProps?: Omit<BaseProps, 'title' | 'subtitle'>;\n    tableProps?: React.TdHTMLAttributes<any>;\n    addon?: React.ReactNode;\n    children?: React.ReactNode;\n    width?: string;\n    align?: 'left' | 'right' | 'center';\n\n    /**\n     * HTML тег\n     */\n    tag?: 'td' | 'div';\n};\n\nexport const TableCell: React.FC<CellProps> = ({\n    dataTestID,\n    className,\n    children,\n    title,\n    subtitle,\n    tableProps,\n    cellProps,\n    addon,\n    align,\n    width,\n    tag: Component = 'td',\n}) => (\n    <Component\n        data-test-id={ dataTestID }\n        className={ cn(styles.cell, className, {\n            [styles.is_div]: Component === 'div',\n        }) }\n        style={ { width } }\n        { ...tableProps }\n    >\n        { children ? (\n            <div\n                className={ cn(styles.children, {\n                    [styles.center]: align === 'center',\n                    [styles.right]: align === 'right',\n                }) }\n            >\n                { children }\n            </div>\n        ) : (\n            <BaseCell.Base\n                title={ title === undefined ? '-' : title }\n                subtitle={ subtitle }\n                className={ cn({\n                    [styles.center]: align === 'center',\n                    [styles.right]: align === 'right',\n                }) }\n                addon={ addon }\n                { ...cellProps }\n            />\n        ) }\n    </Component>\n);\n"],"names":["TableCell","dataTestID","className","children","title","subtitle","tableProps","cellProps","addon","align","width","Component","jsx","cn","styles","BaseCell"],"mappings":";;;;AA0BO,MAAMA,IAAiC,CAAC;AAAA,EAC3C,YAAAC;AAAA,EACA,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,YAAAC;AAAA,EACA,WAAAC;AAAA,EACA,OAAAC;AAAA,EACA,OAAAC;AAAA,EACA,OAAAC;AAAA,EACA,KAAKC,IAAY;AACrB,MACI,gBAAAC;AAAA,EAACD;AAAA,EAAA;AAAA,IACG,gBAAeV;AAAA,IACf,WAAYY,EAAGC,EAAO,MAAMZ,GAAW;AAAA,MACnC,CAACY,EAAO,MAAM,GAAGH,MAAc;AAAA,IAAA,CAClC;AAAA,IACD,OAAQ,EAAE,OAAAD,EAAA;AAAA,IACR,GAAGJ;AAAA,IAEH,UAAAH,IACE,gBAAAS;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,WAAYC,EAAGC,EAAO,UAAU;AAAA,UAC5B,CAACA,EAAO,MAAM,GAAGL,MAAU;AAAA,UAC3B,CAACK,EAAO,KAAK,GAAGL,MAAU;AAAA,QAAA,CAC7B;AAAA,QAEC,UAAAN;AAAA,MAAA;AAAA,IAAA,IAGN,gBAAAS;AAAA,MAACG,EAAS;AAAA,MAAT;AAAA,QACG,OAAQX,MAAU,SAAY,MAAMA;AAAA,QACpC,UAAAC;AAAA,QACA,WAAYQ,EAAG;AAAA,UACX,CAACC,EAAO,MAAM,GAAGL,MAAU;AAAA,UAC3B,CAACK,EAAO,KAAK,GAAGL,MAAU;AAAA,QAAA,CAC7B;AAAA,QACD,OAAAD;AAAA,QACE,GAAGD;AAAA,MAAA;AAAA,IAAA;AAAA,EACT;AAER;"}
+{"version":3,"file":"component.js","sources":["../../../../src/table/components/cell/component.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\n\nimport { Cell as BaseCell } from '../../../cell';\nimport { BaseProps } from '../../../cell/base/component';\n\nimport styles from './index.module.css';\n\nexport type CellProps = {\n    className?: string;\n    dataTestID?: string;\n    title?: BaseProps['title'];\n    subtitle?: BaseProps['subtitle'];\n    cellProps?: Omit<BaseProps, 'title' | 'subtitle'>;\n    tableProps?: React.TdHTMLAttributes<any>;\n    addon?: React.ReactNode;\n    children?: React.ReactNode;\n    width?: string;\n    align?: 'left' | 'right' | 'center';\n    compact?: boolean;\n\n    /**\n     * HTML тег\n     */\n    tag?: 'td' | 'div';\n};\n\nexport const TableCell: React.FC<CellProps> = ({\n    dataTestID,\n    className,\n    children,\n    title,\n    subtitle,\n    tableProps,\n    cellProps,\n    addon,\n    align,\n    compact,\n    width,\n    tag: Component = 'td',\n}) => (\n    <Component\n        data-test-id={ dataTestID }\n        className={ cn(styles.cell, className, {\n            [styles.is_div]: Component === 'div',\n            [styles.compact_cell]: compact,\n        }) }\n        style={ { width } }\n        { ...tableProps }\n    >\n        { children ? (\n            <div\n                className={ cn(styles.children, {\n                    [styles.center]: align === 'center',\n                    [styles.right]: align === 'right',\n                }) }\n            >\n                { children }\n            </div>\n        ) : (\n            <BaseCell.Base\n                title={ title === undefined ? '-' : title }\n                subtitle={ subtitle }\n                size={ cellProps?.size || 's' }\n                compactAddon={ compact }\n                singleLineTitle={ compact }\n                showTitleTooltipOnOverflow={ compact }\n                className={ cn({\n                    [styles.center]: align === 'center',\n                    [styles.right]: align === 'right',\n                    [styles.compact_content]: compact,\n                }) }\n                addon={ addon }\n                { ...cellProps }\n            />\n        ) }\n    </Component>\n);\n"],"names":["TableCell","dataTestID","className","children","title","subtitle","tableProps","cellProps","addon","align","compact","width","Component","jsx","cn","styles","BaseCell"],"mappings":";;;;AA2BO,MAAMA,IAAiC,CAAC;AAAA,EAC3C,YAAAC;AAAA,EACA,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,YAAAC;AAAA,EACA,WAAAC;AAAA,EACA,OAAAC;AAAA,EACA,OAAAC;AAAA,EACA,SAAAC;AAAA,EACA,OAAAC;AAAA,EACA,KAAKC,IAAY;AACrB,MACI,gBAAAC;AAAA,EAACD;AAAA,EAAA;AAAA,IACG,gBAAeX;AAAA,IACf,WAAYa,EAAGC,EAAO,MAAMb,GAAW;AAAA,MACnC,CAACa,EAAO,MAAM,GAAGH,MAAc;AAAA,MAC/B,CAACG,EAAO,YAAY,GAAGL;AAAA,IAAA,CAC1B;AAAA,IACD,OAAQ,EAAE,OAAAC,EAAA;AAAA,IACR,GAAGL;AAAA,IAEH,UAAAH,IACE,gBAAAU;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,WAAYC,EAAGC,EAAO,UAAU;AAAA,UAC5B,CAACA,EAAO,MAAM,GAAGN,MAAU;AAAA,UAC3B,CAACM,EAAO,KAAK,GAAGN,MAAU;AAAA,QAAA,CAC7B;AAAA,QAEC,UAAAN;AAAA,MAAA;AAAA,IAAA,IAGN,gBAAAU;AAAA,MAACG,EAAS;AAAA,MAAT;AAAA,QACG,OAAQZ,MAAU,SAAY,MAAMA;AAAA,QACpC,UAAAC;AAAA,QACA,OAAOE,KAAA,gBAAAA,EAAW,SAAQ;AAAA,QAC1B,cAAeG;AAAA,QACf,iBAAkBA;AAAA,QAClB,4BAA6BA;AAAA,QAC7B,WAAYI,EAAG;AAAA,UACX,CAACC,EAAO,MAAM,GAAGN,MAAU;AAAA,UAC3B,CAACM,EAAO,KAAK,GAAGN,MAAU;AAAA,UAC1B,CAACM,EAAO,eAAe,GAAGL;AAAA,QAAA,CAC7B;AAAA,QACD,OAAAF;AAAA,QACE,GAAGD;AAAA,MAAA;AAAA,IAAA;AAAA,EACT;AAER;"}

package/dist/table/components/cell/index.module.css

@@ -1 +1 @@
-table tr:last-child .cell_SVZP{border-bottom:0!important}.cell_SVZP{padding:0 16px;border-bottom:1px solid var(--color-border-secondary);position:relative;height:68px}.right_30pJ{justify-content:flex-end}.children_X057{width:100%;display:flex;align-items:center}.is_div_XHlH{min-height:68px;display:flex;align-items:center}
+table tr:last-child .cell_SVZP{border-bottom:0!important}.cell_SVZP{padding:0 12px;border-bottom:1px solid var(--color-border-secondary);position:relative;height:52px}.compact_cell_zSJH{height:44px}.right_30pJ{justify-content:flex-end}.children_X057{width:100%;display:flex;align-items:center}.compact_content_bjnq{gap:0 6px!important;min-height:40px!important}.is_div_XHlH{min-height:52px;display:flex;align-items:center}

package/dist/table/components/cell/index.module.css.js

@@ -1,15 +1,19 @@
 import './index.module.css';
-const i = "cell_SVZP", l = "right_30pJ", c = "children_X057", s = "is_div_XHlH", t = {
-  cell: i,
+const c = "cell_SVZP", t = "compact_cell_zSJH", l = "right_30pJ", n = "children_X057", o = "compact_content_bjnq", e = "is_div_XHlH", _ = {
+  cell: c,
+  compact_cell: t,
   right: l,
-  children: c,
-  is_div: s
+  children: n,
+  compact_content: o,
+  is_div: e
 };
 export {
-  i as cell,
-  c as children,
-  t as default,
-  s as is_div,
+  c as cell,
+  n as children,
+  t as compact_cell,
+  o as compact_content,
+  _ as default,
+  e as is_div,
   l as right
 };
 //# sourceMappingURL=index.module.css.js.map

package/dist/table/components/cell/index.module.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.module.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}
+{"version":3,"file":"index.module.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}

package/dist/table/components/cells/index.module.css

@@ -1 +1 @@
-.header_row_-IYY{overflow:hidden}.header_row_-IYY th:only-child{border-radius:8px!important}.header_row_-IYY th:first-child{border-radius:8px 0 0 8px}.header_row_-IYY th:last-child{border-radius:0 8px 8px 0}.cell_c2wS{height:48px;padding:4px 16px;box-sizing:border-box;background:var(--color-bg-secondary);position:sticky;top:0;z-index:9}.clickable_uhII{cursor:pointer}.head_wrapper_WjtN{display:flex;align-items:center}.arrow_svnk{height:16px;width:16px;margin-left:12px;display:flex;flex-direction:column;color:var(--color-graphic-thirdly);opacity:.4}.accent_5Dn8{color:var(--color-graphic-primary)}.DESC_p2eV{transform:rotate(-90deg)}.ASC_fIiQ{transform:rotate(90deg)}
+.header_row_-IYY{overflow:hidden}.header_row_-IYY th:only-child{border-radius:8px!important}.header_row_-IYY th:first-child{border-radius:8px 0 0 8px}.header_row_-IYY th:last-child{border-radius:0 8px 8px 0}.cell_c2wS{height:40px;padding:0 12px;box-sizing:border-box;background:var(--color-bg-secondary);position:sticky;top:0;z-index:9}.clickable_uhII{cursor:pointer}.head_wrapper_WjtN{display:flex;align-items:center}.arrow_svnk{height:16px;width:16px;margin-left:8px;display:flex;flex-direction:column;color:var(--color-graphic-thirdly);opacity:.4}.accent_5Dn8{color:var(--color-graphic-primary)}.DESC_p2eV{transform:rotate(-90deg)}.ASC_fIiQ{transform:rotate(90deg)}

package/dist/table/components/table-header/index.module.css

@@ -1 +1 @@
-.table_header_GXu4{width:100%;margin-bottom:16px}.actions_GZKJ{display:flex;align-items:center;justify-content:space-between}.leftHeaderAddons_W8Yb{margin-right:16px!important}.tags_PpKz{margin-top:12px;display:flex;flex-wrap:wrap;margin-right:-12px}.tags_PpKz>*:not(:last-child):not(:only-child){margin-right:12px}.tags_PpKz>*{margin:4px 0}.tag_SqNT{margin-right:12px}.buttons_3CQY{display:flex;align-items:center}.buttons_3CQY button:not(:last-child){margin-right:12px}
+.table_header_GXu4{width:100%;margin-bottom:12px}.actions_GZKJ{display:flex;align-items:center;justify-content:space-between}.leftHeaderAddons_W8Yb{margin-right:12px!important}.tags_PpKz{margin-top:8px;display:flex;flex-wrap:wrap;margin-right:-8px}.tags_PpKz>*:not(:last-child):not(:only-child){margin-right:8px}.tags_PpKz>*{margin:4px 0}.tag_SqNT{margin-right:8px}.buttons_3CQY{display:flex;align-items:center}.buttons_3CQY button:not(:last-child){margin-right:8px}

package/dist/table/index.module.css.js

@@ -1,15 +1,18 @@
 import './index.module.css';
-const l = "table_wrapper_SeB5", e = "table_9sbd", a = "fill_Q-ic", t = "clickable_k4S8", c = {
+const l = "table_wrapper_SeB5", t = "table_9sbd", a = "fill_Q-ic", c = "compact_kbrU", e = "clickable_k4S8", b = {
   table_wrapper: l,
-  table: e,
+  table: t,
   fill: a,
-  clickable: t
+  default: "default_BxOw",
+  compact: c,
+  clickable: e
 };
 export {
-  t as clickable,
-  c as default,
+  e as clickable,
+  c as compact,
+  b as default,
   a as fill,
-  e as table,
+  t as table,
   l as table_wrapper
 };
 //# sourceMappingURL=index.module.css.js.map

package/dist/table/index.module.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.module.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}
+{"version":3,"file":"index.module.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}

package/dist/table/table.d.ts

@@ -20,6 +20,7 @@ type FiltersButton = {
 };
 export type TableProps<T extends object> = Records<T> & {
     columns: TableColumns<T>;
+    view?: 'default' | 'compact';
     searchPlaceholder?: string;
     rightHeaderAddons?: React.ReactNode;
     leftHeaderAddons?: React.ReactNode;
@@ -35,5 +36,5 @@ export type TableProps<T extends object> = Records<T> & {
     /** true — параметры из URL; false — только локальное состояние. */
     fromPath?: boolean;
 } & FiltersButton;
-export declare function Table<T extends object>({ columns, searchPlaceholder, records, hideSearch, rightHeaderAddons, leftHeaderAddons, filtersButtonLabel, createButtonLabel, loading, height, tagsBuilder, promise, onRowClick, onCreateClick, onFiltersClick, refetch, language, fromPath, }: TableProps<T>): JSX.Element;
+export declare function Table<T extends object>({ columns, searchPlaceholder, records, hideSearch, rightHeaderAddons, leftHeaderAddons, filtersButtonLabel, createButtonLabel, loading, height, view, tagsBuilder, promise, onRowClick, onCreateClick, onFiltersClick, refetch, language, fromPath, }: TableProps<T>): JSX.Element;
 export {};

package/dist/table/table.js

@@ -1,137 +1,143 @@
-import { jsxs as P, jsx as r } from "react/jsx-runtime";
-import W, { useMemo as D, useCallback as X } from "react";
-import E from "classnames";
-import { Cells as Y } from "./components/cells/index.js";
-import { EmptyList as Z } from "./components/empty-list/index.js";
-import { Error as $ } from "./components/error/index.js";
-import { Loading as A } from "./components/loading/index.js";
-import { Pagination as R } from "./components/pagination/index.js";
-import { TableHeader as tt } from "./components/table-header/index.js";
+import { jsxs as P, jsx as e } from "react/jsx-runtime";
+import Y, { useMemo as E, useCallback as Z } from "react";
+import N from "classnames";
+import { Cells as $ } from "./components/cells/index.js";
+import { EmptyList as w } from "./components/empty-list/index.js";
+import { Error as A } from "./components/error/index.js";
+import { Loading as R } from "./components/loading/index.js";
+import { Pagination as tt } from "./components/pagination/index.js";
+import { TableHeader as rt } from "./components/table-header/index.js";
 import { useTableData as et } from "./hooks/use-table-data.js";
-import { getTags as rt } from "./utils/get-tags.js";
-import { prepareRows as at } from "./utils/prepare-rows.js";
-import m from "./index.module.css.js";
-function gt({
-  columns: o,
-  searchPlaceholder: N = "Поиск по таблице",
-  records: j,
-  hideSearch: f,
-  rightHeaderAddons: h,
-  leftHeaderAddons: b,
-  filtersButtonLabel: C,
-  createButtonLabel: H,
-  loading: S,
-  height: k = "fill",
-  tagsBuilder: w,
-  promise: g,
-  onRowClick: i,
-  onCreateClick: d,
-  onFiltersClick: l,
-  refetch: B,
-  language: s,
-  fromPath: M = !0
+import { getTags as at } from "./utils/get-tags.js";
+import { prepareRows as ot } from "./utils/prepare-rows.js";
+import o from "./index.module.css.js";
+function ut({
+  columns: l,
+  searchPlaceholder: j = "Поиск по таблице",
+  records: C,
+  hideSearch: h,
+  rightHeaderAddons: b,
+  leftHeaderAddons: g,
+  filtersButtonLabel: H,
+  createButtonLabel: S,
+  loading: k,
+  height: B = "fill",
+  view: d = "default",
+  tagsBuilder: M,
+  promise: u,
+  onRowClick: s,
+  onCreateClick: n,
+  onFiltersClick: i,
+  refetch: V,
+  language: m,
+  fromPath: _ = !0
 }) {
   const {
-    loading: V,
-    error: u,
-    data: v,
-    total: _,
+    loading: q,
+    error: y,
+    data: T,
+    total: z,
     params: t,
-    pagesCount: q,
-    updateData: n,
-    addParam: z,
-    removeParam: F,
-    resetParams: y
+    pagesCount: F,
+    updateData: c,
+    addParam: G,
+    removeParam: I,
+    resetParams: v
   } = et({
-    promise: g,
-    records: j,
-    fromPath: M
-  }), T = D(
-    () => [...v || []].sort(
-      (e, a) => (e.sortPosition || 0) - (a.sortPosition || 0)
+    promise: u,
+    records: C,
+    fromPath: _
+  }), x = E(
+    () => [...T || []].sort(
+      (r, a) => (r.sortPosition || 0) - (a.sortPosition || 0)
     ),
-    [v]
-  ), G = (e) => i == null ? void 0 : i(e, n), I = d ? () => d(n) : void 0, J = X(
-    (e) => {
-      y(e);
+    [T]
+  ), J = (r) => s == null ? void 0 : s(r, c), K = n ? () => n(c) : void 0, O = Z(
+    (r) => {
+      v(r);
     },
-    [y]
-  ), x = () => l ? l({
-    submitCallback: (e) => J(e),
+    [v]
+  ), L = () => i ? i({
+    submitCallback: (r) => O(r),
     initialValues: t
-  }) : null, c = (e) => {
-    z(e);
-  }, K = (e, a) => {
-    F(e, a);
-  }, O = rt({
+  }) : null, p = (r) => {
+    G(r);
+  }, Q = (r, a) => {
+    I(r, a);
+  }, U = at({
     params: (t == null ? void 0 : t.where) || {},
-    onDelete: K,
-    tagsBuilder: w,
-    onClick: x
-  }), L = D(
-    () => at({ columns: o, data: T, refetch: B || n }),
+    onDelete: Q,
+    tagsBuilder: M,
+    onClick: L
+  }), D = E(
+    () => ot({
+      columns: l,
+      view: d,
+      data: x,
+      refetch: V || c
+    }),
     // eslint-disable-next-line react-hooks/exhaustive-deps
-    [T, o]
-  ), p = V || S;
-  return /* @__PURE__ */ P("div", { className: E(m.table_wrapper, m[k]), children: [
-    (!f || h || b || d || l) && /* @__PURE__ */ r(
-      tt,
+    [x, l, d]
+  ), f = q || k;
+  return /* @__PURE__ */ P("div", { className: N(o.table_wrapper, o[B], o[d]), children: [
+    (!h || b || g || n || i) && /* @__PURE__ */ e(
+      rt,
       {
-        language: s,
-        hideSearch: f,
-        rightHeaderAddons: h,
-        leftHeaderAddons: b,
+        language: m,
+        hideSearch: h,
+        rightHeaderAddons: b,
+        leftHeaderAddons: g,
         searchText: (t == null ? void 0 : t.searchText) || "",
-        addParam: c,
-        searchPlaceholder: N,
-        filtersButtonLabel: C,
-        tags: O,
-        onCreateClick: I,
-        createButtonLabel: H,
-        onFiltersClick: x,
-        showFiltersButton: !!l
+        addParam: p,
+        searchPlaceholder: j,
+        filtersButtonLabel: H,
+        tags: U,
+        onCreateClick: K,
+        createButtonLabel: S,
+        onFiltersClick: L,
+        showFiltersButton: !!i
       }
     ),
-    /* @__PURE__ */ r("div", { className: m.table, children: /* @__PURE__ */ P("table", { cellSpacing: "0", cellPadding: "0", children: [
-      /* @__PURE__ */ r(
-        Y,
+    /* @__PURE__ */ e("div", { className: o.table, children: /* @__PURE__ */ P("table", { cellSpacing: "0", cellPadding: "0", children: [
+      /* @__PURE__ */ e(
+        $,
         {
           sort: t == null ? void 0 : t.sort,
           order: t == null ? void 0 : t.order,
-          addParam: c,
-          columns: o
+          addParam: p,
+          columns: l
         }
       ),
       /* @__PURE__ */ P("tbody", { children: [
-        u && /* @__PURE__ */ r($, { language: s }),
-        !L.length && !p && !u && /* @__PURE__ */ r(Z, { language: s }),
-        p && /* @__PURE__ */ r(A, { columnsLength: o.length }),
-        L.map(({ row: e, cells: a }) => /* @__PURE__ */ r(
+        y && /* @__PURE__ */ e(A, { language: m }),
+        !D.length && !f && !y && /* @__PURE__ */ e(w, { language: m }),
+        f && /* @__PURE__ */ e(R, { columnsLength: l.length }),
+        D.map(({ row: r, cells: a }) => /* @__PURE__ */ e(
           "tr",
           {
-            onClick: () => G(e),
-            className: E({ [m.clickable]: !!i }),
-            style: { visibility: p ? "collapse" : "visible" },
-            children: a.map((Q, U) => W.cloneElement(Q, { key: U }))
+            onClick: () => J(r),
+            className: N({ [o.clickable]: !!s }),
+            style: { visibility: f ? "collapse" : "visible" },
+            children: a.map((W, X) => Y.cloneElement(W, { key: X }))
           },
-          String(e.id)
+          String(r.id)
         ))
       ] })
     ] }) }),
-    !!g && /* @__PURE__ */ r(
-      R,
+    !!u && /* @__PURE__ */ e(
+      tt,
       {
-        language: s,
+        language: m,
         currentPage: t ? +t.page : 1,
         recordsPerPage: t ? +t.limit : 10,
-        pagesCount: +q,
-        addParam: c,
-        total: +_
+        pagesCount: +F,
+        addParam: p,
+        total: +z
       }
     )
   ] });
 }
 export {
-  gt as Table
+  ut as Table
 };
 //# sourceMappingURL=table.js.map

package/dist/table/table.js.map

@@ -1 +1 @@
-{"version":3,"file":"table.js","sources":["../../src/table/table.tsx"],"sourcesContent":["/* eslint-disable import/no-extraneous-dependencies */\n/* eslint-disable react/no-array-index-key */\n/* eslint-disable @typescript-eslint/ban-types */\nimport React, {\n    useCallback, useMemo,\n} from 'react';\nimport cn from 'classnames';\n\nimport { ApiMethodDeclaration, MakeServiceFromServiceDeclaration } from '../typings/api';\n\nimport { Cells } from './components/cells';\nimport { EmptyList } from './components/empty-list';\nimport { Error } from './components/error';\nimport { Loading } from './components/loading';\nimport { Pagination } from './components/pagination';\nimport { TableHeader } from './components/table-header';\nimport { useTableData } from './hooks/use-table-data';\nimport { getTags } from './utils/get-tags';\nimport { prepareRows } from './utils/prepare-rows';\nimport {\n    FiltersMapper, OnFiltersClickProps, Query, TableColumns,\n} from './types';\n\nimport styles from './index.module.css';\n\ntype Records<T> =\n    | {\n        records: T[];\n        promise?: never;\n    }\n    | {\n        records?: never;\n        promise: MakeServiceFromServiceDeclaration<\n              ApiMethodDeclaration<any, { items: T[]; meta: any }>\n          >;\n    };\n\ntype FiltersButton =\n    | {\n        onFiltersClick: (props: OnFiltersClickProps) => void;\n        filtersButtonLabel: string;\n    }\n    | {\n        onFiltersClick?: never;\n        filtersButtonLabel?: never;\n    };\n\nexport type TableProps<T extends object> = Records<T> & {\n    columns: TableColumns<T>;\n    searchPlaceholder?: string;\n    rightHeaderAddons?: React.ReactNode;\n    leftHeaderAddons?: React.ReactNode;\n    createButtonLabel?: string;\n    hideSearch?: boolean;\n    loading?: boolean;\n    height?: 'fill' | 'default';\n    tagsBuilder?: (props: FiltersMapper) => JSX.Element | null;\n    onCreateClick?: (refech: () => void) => void;\n    refetch?: () => void;\n    onRowClick?: (params: T, refech: () => void) => void;\n    language: 'de' | 'ru' | 'en';\n\n    /** true — параметры из URL; false — только локальное состояние. */\n    fromPath?: boolean;\n} & FiltersButton;\n\nexport function Table<T extends object>({\n    columns,\n    searchPlaceholder = 'Поиск по таблице',\n    records,\n    hideSearch,\n    rightHeaderAddons,\n    leftHeaderAddons,\n    filtersButtonLabel,\n    createButtonLabel,\n    loading,\n    height = 'fill',\n    tagsBuilder,\n    promise,\n    onRowClick,\n    onCreateClick,\n    onFiltersClick,\n    refetch,\n    language,\n    fromPath = true,\n}: TableProps<T>) {\n    const {\n        loading: dataLoading,\n        error,\n        data,\n        total,\n        params,\n        pagesCount,\n        updateData,\n\n        addParam,\n        removeParam,\n        resetParams,\n    } = useTableData({\n        promise,\n        records,\n        fromPath,\n    });\n\n    const dataSorted = useMemo(\n        () => [...(data || [])].sort(\n            (a: any, b: any) => (a.sortPosition || 0) - (b.sortPosition || 0),\n        ),\n        [data],\n    );\n\n    const handleRowClick = (p: T) => onRowClick?.(p, updateData);\n    const handleCreateClick = onCreateClick ? () => onCreateClick(updateData) : undefined;\n\n    const resetParamsHandler = useCallback(\n        (param: Query) => {\n            resetParams(param);\n            // eslint-disable-next-line react-hooks/exhaustive-deps\n        },\n        [resetParams],\n    );\n\n    const handleFiltesClick = () =>\n        (onFiltersClick\n            ? onFiltersClick({\n                submitCallback: (values) => resetParamsHandler(values),\n                initialValues: params,\n            })\n            : null);\n\n    const addParamHandler = (param: Query) => {\n        addParam(param);\n    };\n\n    const removeParamHandler = (paramName: string, id?: string) => {\n        removeParam(paramName, id);\n    };\n\n    const tags = getTags({\n        params: params?.where || {},\n        onDelete: removeParamHandler,\n        tagsBuilder,\n        onClick: handleFiltesClick,\n    });\n\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    const rows = useMemo(\n        () => prepareRows({ columns, data: dataSorted, refetch: refetch || updateData }),\n        // eslint-disable-next-line react-hooks/exhaustive-deps\n        [dataSorted, columns],\n    );\n\n    const showLoader = dataLoading || loading;\n\n    return (\n        <div className={ cn(styles.table_wrapper, styles[height]) }>\n            { (!hideSearch ||\n                rightHeaderAddons ||\n                leftHeaderAddons ||\n                onCreateClick ||\n                onFiltersClick) && (\n                <TableHeader\n                    language={ language }\n                    hideSearch={ hideSearch }\n                    rightHeaderAddons={ rightHeaderAddons }\n                    leftHeaderAddons={ leftHeaderAddons }\n                    searchText={ params?.searchText || '' }\n                    addParam={ addParamHandler }\n                    searchPlaceholder={ searchPlaceholder }\n                    filtersButtonLabel={ filtersButtonLabel }\n                    tags={ tags }\n                    onCreateClick={ handleCreateClick }\n                    createButtonLabel={ createButtonLabel }\n                    onFiltersClick={ handleFiltesClick }\n                    showFiltersButton={ !!onFiltersClick }\n                />\n            ) }\n\n            <div className={ styles.table }>\n                <table cellSpacing=\"0\" cellPadding=\"0\">\n                    <Cells\n                        sort={ params?.sort }\n                        order={ params?.order }\n                        addParam={ addParamHandler }\n                        columns={ columns }\n                    />\n\n                    <tbody>\n                        { error && <Error language={ language } /> }\n\n                        { !rows.length && !showLoader && !error && (\n                            <EmptyList language={ language } />\n                        ) }\n\n                        { showLoader && <Loading columnsLength={ columns.length } /> }\n\n                        { rows.map(({ row, cells }) => (\n                            <tr\n                                key={ String((row as any).id) }\n                                onClick={ () => handleRowClick(row as T) }\n                                className={ cn({ [styles.clickable]: !!onRowClick }) }\n                                style={ { visibility: showLoader ? 'collapse' : 'visible' } }\n                            >\n                                { cells.map((cell, i) =>\n                                    React.cloneElement(cell as any, { key: i })) }\n                            </tr>\n                        )) }\n                    </tbody>\n                </table>\n            </div>\n\n            { !!promise && (\n                <Pagination\n                    language={ language }\n                    currentPage={ params ? +params.page : 1 }\n                    recordsPerPage={ params ? +params.limit : 10 }\n                    pagesCount={ +pagesCount }\n                    addParam={ addParamHandler }\n                    total={ +total }\n                />\n            ) }\n        </div>\n    );\n}\n"],"names":["Table","columns","searchPlaceholder","records","hideSearch","rightHeaderAddons","leftHeaderAddons","filtersButtonLabel","createButtonLabel","loading","height","tagsBuilder","promise","onRowClick","onCreateClick","onFiltersClick","refetch","language","fromPath","dataLoading","error","data","total","params","pagesCount","updateData","addParam","removeParam","resetParams","useTableData","dataSorted","useMemo","a","b","handleRowClick","p","handleCreateClick","resetParamsHandler","useCallback","param","handleFiltesClick","values","addParamHandler","removeParamHandler","paramName","id","tags","getTags","rows","prepareRows","showLoader","jsxs","cn","styles","jsx","TableHeader","Cells","Error","EmptyList","Loading","row","cells","cell","i","React","Pagination"],"mappings":"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"}
+{"version":3,"file":"table.js","sources":["../../src/table/table.tsx"],"sourcesContent":["/* eslint-disable import/no-extraneous-dependencies */\n/* eslint-disable react/no-array-index-key */\n/* eslint-disable @typescript-eslint/ban-types */\nimport React, {\n    useCallback, useMemo,\n} from 'react';\nimport cn from 'classnames';\n\nimport { ApiMethodDeclaration, MakeServiceFromServiceDeclaration } from '../typings/api';\n\nimport { Cells } from './components/cells';\nimport { EmptyList } from './components/empty-list';\nimport { Error } from './components/error';\nimport { Loading } from './components/loading';\nimport { Pagination } from './components/pagination';\nimport { TableHeader } from './components/table-header';\nimport { useTableData } from './hooks/use-table-data';\nimport { getTags } from './utils/get-tags';\nimport { prepareRows } from './utils/prepare-rows';\nimport {\n    FiltersMapper, OnFiltersClickProps, Query, TableColumns,\n} from './types';\n\nimport styles from './index.module.css';\n\ntype Records<T> =\n    | {\n        records: T[];\n        promise?: never;\n    }\n    | {\n        records?: never;\n        promise: MakeServiceFromServiceDeclaration<\n              ApiMethodDeclaration<any, { items: T[]; meta: any }>\n          >;\n    };\n\ntype FiltersButton =\n    | {\n        onFiltersClick: (props: OnFiltersClickProps) => void;\n        filtersButtonLabel: string;\n    }\n    | {\n        onFiltersClick?: never;\n        filtersButtonLabel?: never;\n    };\n\nexport type TableProps<T extends object> = Records<T> & {\n    columns: TableColumns<T>;\n    view?: 'default' | 'compact';\n    searchPlaceholder?: string;\n    rightHeaderAddons?: React.ReactNode;\n    leftHeaderAddons?: React.ReactNode;\n    createButtonLabel?: string;\n    hideSearch?: boolean;\n    loading?: boolean;\n    height?: 'fill' | 'default';\n    tagsBuilder?: (props: FiltersMapper) => JSX.Element | null;\n    onCreateClick?: (refech: () => void) => void;\n    refetch?: () => void;\n    onRowClick?: (params: T, refech: () => void) => void;\n    language: 'de' | 'ru' | 'en';\n\n    /** true — параметры из URL; false — только локальное состояние. */\n    fromPath?: boolean;\n} & FiltersButton;\n\nexport function Table<T extends object>({\n    columns,\n    searchPlaceholder = 'Поиск по таблице',\n    records,\n    hideSearch,\n    rightHeaderAddons,\n    leftHeaderAddons,\n    filtersButtonLabel,\n    createButtonLabel,\n    loading,\n    height = 'fill',\n    view = 'default',\n    tagsBuilder,\n    promise,\n    onRowClick,\n    onCreateClick,\n    onFiltersClick,\n    refetch,\n    language,\n    fromPath = true,\n}: TableProps<T>) {\n    const {\n        loading: dataLoading,\n        error,\n        data,\n        total,\n        params,\n        pagesCount,\n        updateData,\n\n        addParam,\n        removeParam,\n        resetParams,\n    } = useTableData({\n        promise,\n        records,\n        fromPath,\n    });\n\n    const dataSorted = useMemo(\n        () => [...(data || [])].sort(\n            (a: any, b: any) => (a.sortPosition || 0) - (b.sortPosition || 0),\n        ),\n        [data],\n    );\n\n    const handleRowClick = (p: T) => onRowClick?.(p, updateData);\n    const handleCreateClick = onCreateClick ? () => onCreateClick(updateData) : undefined;\n\n    const resetParamsHandler = useCallback(\n        (param: Query) => {\n            resetParams(param);\n            // eslint-disable-next-line react-hooks/exhaustive-deps\n        },\n        [resetParams],\n    );\n\n    const handleFiltesClick = () =>\n        (onFiltersClick\n            ? onFiltersClick({\n                submitCallback: (values) => resetParamsHandler(values),\n                initialValues: params,\n            })\n            : null);\n\n    const addParamHandler = (param: Query) => {\n        addParam(param);\n    };\n\n    const removeParamHandler = (paramName: string, id?: string) => {\n        removeParam(paramName, id);\n    };\n\n    const tags = getTags({\n        params: params?.where || {},\n        onDelete: removeParamHandler,\n        tagsBuilder,\n        onClick: handleFiltesClick,\n    });\n\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    const rows = useMemo(\n        () => prepareRows({\n            columns,\n            view,\n            data: dataSorted,\n            refetch: refetch || updateData,\n        }),\n        // eslint-disable-next-line react-hooks/exhaustive-deps\n        [dataSorted, columns, view],\n    );\n\n    const showLoader = dataLoading || loading;\n\n    return (\n        <div className={ cn(styles.table_wrapper, styles[height], styles[view]) }>\n            { (!hideSearch ||\n                rightHeaderAddons ||\n                leftHeaderAddons ||\n                onCreateClick ||\n                onFiltersClick) && (\n                <TableHeader\n                    language={ language }\n                    hideSearch={ hideSearch }\n                    rightHeaderAddons={ rightHeaderAddons }\n                    leftHeaderAddons={ leftHeaderAddons }\n                    searchText={ params?.searchText || '' }\n                    addParam={ addParamHandler }\n                    searchPlaceholder={ searchPlaceholder }\n                    filtersButtonLabel={ filtersButtonLabel }\n                    tags={ tags }\n                    onCreateClick={ handleCreateClick }\n                    createButtonLabel={ createButtonLabel }\n                    onFiltersClick={ handleFiltesClick }\n                    showFiltersButton={ !!onFiltersClick }\n                />\n            ) }\n\n            <div className={ styles.table }>\n                <table cellSpacing=\"0\" cellPadding=\"0\">\n                    <Cells\n                        sort={ params?.sort }\n                        order={ params?.order }\n                        addParam={ addParamHandler }\n                        columns={ columns }\n                    />\n\n                    <tbody>\n                        { error && <Error language={ language } /> }\n\n                        { !rows.length && !showLoader && !error && (\n                            <EmptyList language={ language } />\n                        ) }\n\n                        { showLoader && <Loading columnsLength={ columns.length } /> }\n\n                        { rows.map(({ row, cells }) => (\n                            <tr\n                                key={ String((row as any).id) }\n                                onClick={ () => handleRowClick(row as T) }\n                                className={ cn({ [styles.clickable]: !!onRowClick }) }\n                                style={ { visibility: showLoader ? 'collapse' : 'visible' } }\n                            >\n                                { cells.map((cell, i) =>\n                                    React.cloneElement(cell as any, { key: i })) }\n                            </tr>\n                        )) }\n                    </tbody>\n                </table>\n            </div>\n\n            { !!promise && (\n                <Pagination\n                    language={ language }\n                    currentPage={ params ? +params.page : 1 }\n                    recordsPerPage={ params ? +params.limit : 10 }\n                    pagesCount={ +pagesCount }\n                    addParam={ addParamHandler }\n                    total={ +total }\n                />\n            ) }\n        </div>\n    );\n}\n"],"names":["Table","columns","searchPlaceholder","records","hideSearch","rightHeaderAddons","leftHeaderAddons","filtersButtonLabel","createButtonLabel","loading","height","view","tagsBuilder","promise","onRowClick","onCreateClick","onFiltersClick","refetch","language","fromPath","dataLoading","error","data","total","params","pagesCount","updateData","addParam","removeParam","resetParams","useTableData","dataSorted","useMemo","a","b","handleRowClick","p","handleCreateClick","resetParamsHandler","useCallback","param","handleFiltesClick","values","addParamHandler","removeParamHandler","paramName","id","tags","getTags","rows","prepareRows","showLoader","jsxs","cn","styles","jsx","TableHeader","Cells","Error","EmptyList","Loading","row","cells","cell","i","React","Pagination"],"mappings":"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"}

package/dist/table/utils/prepare-rows.d.ts

@@ -1,10 +1,11 @@
 import { TableProps } from '../table';
 type Props<T extends object> = {
     columns: TableProps<T>['columns'];
+    view: TableProps<T>['view'];
     data: T[];
     refetch: () => void;
 };
-export declare function prepareRows<T extends object>({ columns, data, refetch }: Props<T>): {
+export declare function prepareRows<T extends object>({ columns, view, data, refetch, }: Props<T>): {
     row: T;
     cells: JSX.Element[];
 }[];