@alphakits/ui 2.0.10 → 2.0.11

package/dist/table/components/pagination/index.js

@@ -1,96 +1,115 @@
-import { jsxs as h, jsx as s } from "react/jsx-runtime";
-import f from "@alphakits/icons/dist/ChevronForwardS";
-import d from "classnames";
-import { Button as m } from "../../../button/component.js";
-import { Typography as v } from "../../../typography/component.js";
-import { translate as b } from "../../languages/index.js";
+import { jsxs as r, jsx as t } from "react/jsx-runtime";
+import b from "@alphakits/icons/dist/ChevronForwardS";
+import m from "classnames";
+import { Button as v } from "../../../button/component.js";
+import { Typography as h } from "../../../typography/component.js";
+import { translate as g } from "../../languages/index.js";
 import i from "./index.module.css.js";
-function x(c, o) {
-  const p = c - 2, r = c + 2 + 1, l = [], a = [];
-  let n = 0;
-  for (let e = 1; e <= o; e++)
-    (e === 1 || e === o || e >= p && e < r) && l.push(e);
-  return l.forEach((e) => {
-    n && (e - n === 2 ? a.push(n + 1) : e - n !== 1 && a.push("...")), a.push(e), n = e;
-  }), a;
+function y(d, s) {
+  const p = d - 2, a = d + 2 + 1, l = [], c = [];
+  let o = 0;
+  for (let n = 1; n <= s; n++)
+    (n === 1 || n === s || n >= p && n < a) && l.push(n);
+  return l.forEach((n) => {
+    o && (n - o === 2 ? c.push(o + 1) : n - o !== 1 && c.push("...")), c.push(n), o = n;
+  }), c;
 }
-const j = ({
-  pagesCount: c,
-  currentPage: o,
-  recordsPerPage: g = 30,
+const F = ({
+  pagesCount: d,
+  currentPage: s,
+  recordsPerPage: f = 30,
   total: p,
-  language: r,
-  addParam: l
+  language: a,
+  addParam: l,
+  v2: c
 }) => {
-  const a = x(o, c), n = o === 1, e = o === c, w = "    ", N = "   ";
-  return /* @__PURE__ */ h("div", { className: i.pagination_wrap, children: [
-    /* @__PURE__ */ h("div", { className: i.pages_info, children: [
-      /* @__PURE__ */ s(v.Text, { view: "title", weight: "medium", color: "secondary", children: b(r)("totalCount") }),
-      /* @__PURE__ */ s(v.Text, { view: "title", weight: "medium", color: "primary", children: p })
-    ] }),
-    a.length > 1 && /* @__PURE__ */ h("div", { className: i.pagination, children: [
-      /* @__PURE__ */ s(
-        m,
-        {
-          className: d(i.prev_btn, i.btn, { [i.disabled_btn]: n }),
-          leftAddons: /* @__PURE__ */ s(f, {}),
-          view: "ghost",
-          onClick: () => l({ page: o - 1 }),
-          disabled: n
-        }
-      ),
-      a.map((t, u) => Number.isFinite(t) ? /* @__PURE__ */ s(
-        m,
-        {
-          className: d(
-            i.pagination_btn,
-            { [i.active]: t === o }
-          ),
-          size: "xs",
-          view: "ghost",
-          onClick: () => l({ page: t }),
-          children: t
-        },
-        t
-      ) : /* @__PURE__ */ s(
-        m,
-        {
-          className: d(
-            i.pagination_btn
-          ),
-          view: "ghost",
-          disabled: !0,
-          children: "..."
+  const o = y(s, d), n = s === 1, w = s === d, N = "    ", _ = "   ", u = o.length > 1 && /* @__PURE__ */ r("div", { className: i.pagination, children: [
+    /* @__PURE__ */ t(
+      v,
+      {
+        className: m(i.prev_btn, i.btn, { [i.disabled_btn]: n }),
+        leftAddons: /* @__PURE__ */ t(b, {}),
+        view: "ghost",
+        onClick: () => l({ page: s - 1 }),
+        disabled: n
+      }
+    ),
+    o.map((e, x) => Number.isFinite(e) ? /* @__PURE__ */ t(
+      v,
+      {
+        className: m(
+          i.pagination_btn,
+          { [i.active]: e === s }
+        ),
+        size: "xs",
+        view: "ghost",
+        onClick: () => l({ page: e }),
+        children: e
+      },
+      e
+    ) : /* @__PURE__ */ t(
+      v,
+      {
+        className: m(i.pagination_btn),
+        view: "ghost",
+        disabled: !0,
+        children: "..."
+      },
+      e + x
+    )),
+    /* @__PURE__ */ t(
+      v,
+      {
+        className: m(i.btn, { [i.disabled_btn]: w }),
+        leftAddons: /* @__PURE__ */ t(b, {}),
+        view: "ghost",
+        onClick: () => {
+          l({ page: s + 1 });
         },
-        t + u
-      )),
-      /* @__PURE__ */ s(
-        m,
+        disabled: w
+      }
+    )
+  ] });
+  return c ? /* @__PURE__ */ r("div", { className: m(i.pagination_wrap, i.v2), children: [
+    /* @__PURE__ */ r("div", { className: i.pages_info, children: [
+      /* @__PURE__ */ t(h.Text, { view: "title", weight: "medium", color: "secondary", children: g(a)("totalCount") }),
+      /* @__PURE__ */ t(h.Text, { view: "title", weight: "medium", color: "primary", children: p })
+    ] }),
+    /* @__PURE__ */ t("div", { className: i.pagination_center, children: u }),
+    /* @__PURE__ */ r("div", { className: i.select_wrap, children: [
+      /* @__PURE__ */ t(h.Text, { view: "title", weight: "medium", color: "secondary", children: g(a)("resultsOnPage") }),
+      /* @__PURE__ */ t(
+        "select",
         {
-          className: d(i.btn, { [i.disabled_btn]: e }),
-          leftAddons: /* @__PURE__ */ s(f, {}),
-          view: "ghost",
-          onClick: () => {
-            l({ page: o + 1 });
+          value: f,
+          className: i.select,
+          onChange: (e) => {
+            l({ page: 1, limit: e.target.value });
           },
-          disabled: e
+          children: [5, 10, 20, 30, 40, 50].map((e) => /* @__PURE__ */ t("option", { value: e, children: e }, e))
         }
       )
+    ] })
+  ] }) : /* @__PURE__ */ r("div", { className: i.pagination_wrap, children: [
+    /* @__PURE__ */ r("div", { className: i.pages_info, children: [
+      /* @__PURE__ */ t(h.Text, { view: "title", weight: "medium", color: "secondary", children: g(a)("totalCount") }),
+      /* @__PURE__ */ t(h.Text, { view: "title", weight: "medium", color: "primary", children: p })
     ] }),
-    /* @__PURE__ */ s(
+    u,
+    /* @__PURE__ */ t(
       "select",
       {
-        value: g,
+        value: f,
         className: i.select,
-        onChange: (t) => {
-          l({ page: 1, limit: t.target.value });
+        onChange: (e) => {
+          l({ page: 1, limit: e.target.value });
         },
-        children: [5, 10, 20, 30, 40, 50].map((t) => /* @__PURE__ */ s("option", { value: t, children: `${b(r)("resultsOnPage")}${w}${t}${N}` }, t))
+        children: [5, 10, 20, 30, 40, 50].map((e) => /* @__PURE__ */ t("option", { value: e, children: `${g(a)("resultsOnPage")}${N}${e}${_}` }, e))
       }
     )
   ] });
 };
 export {
-  j as Pagination
+  F as Pagination
 };
 //# sourceMappingURL=index.js.map

package/dist/table/components/pagination/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../src/table/components/pagination/index.tsx"],"sourcesContent":["import React from 'react';\nimport ChevronForwardS from '@alphakits/icons/dist/ChevronForwardS';\nimport cn from 'classnames';\n\nimport { Button } from '../../../button';\nimport { Typography } from '../../../typography';\nimport { translate } from '../../languages';\n\nimport styles from './index.module.css';\n\nfunction pagination(current: number, last: number) {\n    const delta = 2;\n    const left = current - delta;\n    const right = current + delta + 1;\n    const range = [];\n    const rangeWithDots: any = [];\n    let l = 0;\n\n    for (let i = 1; i <= last; i++) {\n        if (i === 1 || i === last || (i >= left && i < right)) {\n            range.push(i);\n        }\n    }\n\n    range.forEach((i: number) => {\n        if (l) {\n            if (i - l === 2) {\n                rangeWithDots.push(l + 1);\n            } else if (i - l !== 1) {\n                rangeWithDots.push('...');\n            }\n        }\n        rangeWithDots.push(i);\n        l = i;\n    });\n\n    return rangeWithDots;\n}\n\ntype Props = {\n    pagesCount: number;\n    currentPage: number;\n    recordsPerPage: number;\n    total: number;\n    addParam: (param: Record<string, unknown>) => void;\n    language: 'en' | 'de' | 'ru';\n};\n\nexport const Pagination: React.FC<Props> = ({\n    pagesCount,\n    currentPage,\n    recordsPerPage = 30,\n    total,\n    language,\n    addParam,\n}) => {\n    const pg = pagination(currentPage, pagesCount);\n\n    const disablePreviewsPage = currentPage === 1;\n    const disableNextPage = currentPage === pagesCount;\n\n    const space = '\\xa0\\xa0\\xa0\\xa0';\n    const spaceAfter = '\\xa0\\xa0\\xa0';\n\n    return (\n        <div className={ styles.pagination_wrap }>\n            <div className={ styles.pages_info }>\n                <Typography.Text view=\"title\" weight=\"medium\" color=\"secondary\">\n                    { translate(language)('totalCount') }\n                </Typography.Text>\n\n                <Typography.Text view=\"title\" weight=\"medium\" color=\"primary\">\n                    { total }\n                </Typography.Text>\n            </div>\n\n            { pg.length > 1 && (\n                <div className={ styles.pagination }>\n                    <Button\n                        className={ cn(styles.prev_btn, styles.btn, { [styles.disabled_btn]: disablePreviewsPage }) }\n                        leftAddons={ <ChevronForwardS /> }\n                        view=\"ghost\"\n                        onClick={ () => addParam({ page: currentPage - 1 }) }\n                        disabled={ disablePreviewsPage }\n                    />\n                    { pg.map((p: number, i: number) =>\n                        (Number.isFinite(p) ? (\n                            <Button\n                                className={ cn(\n                                    styles.pagination_btn,\n                                    { [styles.active]: p === currentPage },\n                                ) }\n                                size=\"xs\"\n                                view=\"ghost\"\n                                key={ p }\n                                onClick={ () => addParam({ page: p }) }\n                            >\n                                { p }\n                            </Button>\n                        ) : (\n                            <Button\n                                // eslint-disable-next-line react/no-array-index-key\n                                key={ p + i }\n                                className={ cn(\n                                    styles.pagination_btn,\n                                ) }\n                                view=\"ghost\"\n                                disabled={ true }\n                            >\n                                ...\n                            </Button>\n                        ))) }\n                    <Button\n                        className={ cn(styles.btn, { [styles.disabled_btn]: disableNextPage }) }\n                        leftAddons={ <ChevronForwardS /> }\n                        view=\"ghost\"\n                        onClick={ () => {\n                            addParam({ page: currentPage + 1 });\n                        } }\n                        disabled={ disableNextPage }\n                    />\n                </div>\n            ) }\n\n            <select\n                value={ recordsPerPage }\n                className={ styles.select }\n                onChange={ (e) => {\n                    addParam({ page: 1, limit: e.target.value });\n                } }\n            >\n                { [5, 10, 20, 30, 40, 50].map((size) => (\n                    <option key={ size } value={ size }>\n                        { `${translate(language)('resultsOnPage')}${space}${size}${spaceAfter}` }\n                    </option>\n                )) }\n            </select>\n        </div>\n    );\n};\n"],"names":["pagination","current","last","left","right","range","rangeWithDots","l","i","Pagination","pagesCount","currentPage","recordsPerPage","total","language","addParam","pg","disablePreviewsPage","disableNextPage","space","spaceAfter","jsxs","styles","jsx","Typography","translate","Button","cn","ChevronForwardS","p","e","size"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../../src/table/components/pagination/index.tsx"],"sourcesContent":["import React from 'react';\nimport ChevronForwardS from '@alphakits/icons/dist/ChevronForwardS';\nimport cn from 'classnames';\n\nimport { Button } from '../../../button';\nimport { Typography } from '../../../typography';\nimport { translate } from '../../languages';\n\nimport styles from './index.module.css';\n\nfunction pagination(current: number, last: number) {\n    const delta = 2;\n    const left = current - delta;\n    const right = current + delta + 1;\n    const range = [];\n    const rangeWithDots: any = [];\n    let l = 0;\n\n    for (let i = 1; i <= last; i++) {\n        if (i === 1 || i === last || (i >= left && i < right)) {\n            range.push(i);\n        }\n    }\n\n    range.forEach((i: number) => {\n        if (l) {\n            if (i - l === 2) {\n                rangeWithDots.push(l + 1);\n            } else if (i - l !== 1) {\n                rangeWithDots.push('...');\n            }\n        }\n        rangeWithDots.push(i);\n        l = i;\n    });\n\n    return rangeWithDots;\n}\n\ntype Props = {\n    pagesCount: number;\n    currentPage: number;\n    recordsPerPage: number;\n    total: number;\n    addParam: (param: Record<string, unknown>) => void;\n    language: 'en' | 'de' | 'ru';\n    v2?: boolean;\n};\n\nexport const Pagination: React.FC<Props> = ({\n    pagesCount,\n    currentPage,\n    recordsPerPage = 30,\n    total,\n    language,\n    addParam,\n    v2,\n}) => {\n    const pg = pagination(currentPage, pagesCount);\n\n    const disablePreviewsPage = currentPage === 1;\n    const disableNextPage = currentPage === pagesCount;\n\n    const space = '\\xa0\\xa0\\xa0\\xa0';\n    const spaceAfter = '\\xa0\\xa0\\xa0';\n\n    const paginationButtons = pg.length > 1 && (\n        <div className={ styles.pagination }>\n            <Button\n                className={ cn(styles.prev_btn, styles.btn, { [styles.disabled_btn]: disablePreviewsPage }) }\n                leftAddons={ <ChevronForwardS /> }\n                view=\"ghost\"\n                onClick={ () => addParam({ page: currentPage - 1 }) }\n                disabled={ disablePreviewsPage }\n            />\n            { pg.map((p: number, i: number) =>\n                (Number.isFinite(p) ? (\n                    <Button\n                        className={ cn(\n                            styles.pagination_btn,\n                            { [styles.active]: p === currentPage },\n                        ) }\n                        size=\"xs\"\n                        view=\"ghost\"\n                        key={ p }\n                        onClick={ () => addParam({ page: p }) }\n                    >\n                        { p }\n                    </Button>\n                ) : (\n                    <Button\n                        // eslint-disable-next-line react/no-array-index-key\n                        key={ p + i }\n                        className={ cn(styles.pagination_btn) }\n                        view=\"ghost\"\n                        disabled={ true }\n                    >\n                        ...\n                    </Button>\n                ))) }\n            <Button\n                className={ cn(styles.btn, { [styles.disabled_btn]: disableNextPage }) }\n                leftAddons={ <ChevronForwardS /> }\n                view=\"ghost\"\n                onClick={ () => {\n                    addParam({ page: currentPage + 1 });\n                } }\n                disabled={ disableNextPage }\n            />\n        </div>\n    );\n\n    if (v2) {\n        return (\n            <div className={ cn(styles.pagination_wrap, styles.v2) }>\n                <div className={ styles.pages_info }>\n                    <Typography.Text view=\"title\" weight=\"medium\" color=\"secondary\">\n                        { translate(language)('totalCount') }\n                    </Typography.Text>\n\n                    <Typography.Text view=\"title\" weight=\"medium\" color=\"primary\">\n                        { total }\n                    </Typography.Text>\n                </div>\n\n                <div className={ styles.pagination_center }>\n                    { paginationButtons }\n                </div>\n\n                <div className={ styles.select_wrap }>\n                    <Typography.Text view=\"title\" weight=\"medium\" color=\"secondary\">\n                        { translate(language)('resultsOnPage') }\n                    </Typography.Text>\n\n                    <select\n                        value={ recordsPerPage }\n                        className={ styles.select }\n                        onChange={ (e) => {\n                            addParam({ page: 1, limit: e.target.value });\n                        } }\n                    >\n                        { [5, 10, 20, 30, 40, 50].map((size) => (\n                            <option key={ size } value={ size }>\n                                { size }\n                            </option>\n                        )) }\n                    </select>\n                </div>\n            </div>\n        );\n    }\n\n    return (\n        <div className={ styles.pagination_wrap }>\n            <div className={ styles.pages_info }>\n                <Typography.Text view=\"title\" weight=\"medium\" color=\"secondary\">\n                    { translate(language)('totalCount') }\n                </Typography.Text>\n\n                <Typography.Text view=\"title\" weight=\"medium\" color=\"primary\">\n                    { total }\n                </Typography.Text>\n            </div>\n\n            { paginationButtons }\n\n            <select\n                value={ recordsPerPage }\n                className={ styles.select }\n                onChange={ (e) => {\n                    addParam({ page: 1, limit: e.target.value });\n                } }\n            >\n                { [5, 10, 20, 30, 40, 50].map((size) => (\n                    <option key={ size } value={ size }>\n                        { `${translate(language)('resultsOnPage')}${space}${size}${spaceAfter}` }\n                    </option>\n                )) }\n            </select>\n        </div>\n    );\n};\n"],"names":["pagination","current","last","left","right","range","rangeWithDots","l","i","Pagination","pagesCount","currentPage","recordsPerPage","total","language","addParam","v2","pg","disablePreviewsPage","disableNextPage","space","spaceAfter","paginationButtons","styles","jsx","Button","cn","ChevronForwardS","p","jsxs","Typography","translate","size"],"mappings":"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"}

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

@@ -1 +1 @@
-.pagination_wrap_kmil{height:32px;min-height:32px;padding:16px 48px 16px 0;display:flex;align-items:center;background-color:var(--color-bg-primary);position:sticky;bottom:0;box-shadow:0 -11px 13px -13px var(--color-border-primary)}.pagination_36rf{display:grid;grid-column-gap:16px;-moz-column-gap:16px;column-gap:16px;grid-auto-flow:column}.pages_info_9Quw{min-width:340px;display:flex;gap:8px}.pagination_wrap_kmil>*:not(:last-child){margin-right:16px}.prev_btn_UnDy svg{transform:rotate(180deg)}.disabled_btn_G6J6{opacity:.5}.pagination_btn_vexg{color:var(--color-text-secondary)!important;font-weight:500;min-width:24px}.btn_-Zrx{min-width:24px!important}.pagination_btn_vexg.active_F46k{color:var(--color-text-primary)!important;font-weight:700}.select_XysE{border:none;outline:none;position:absolute;background:transparent;right:0;font-weight:500;font-size:14px;color:var(--color-text-primary)}
+.pagination_wrap_kmil{height:32px;min-height:32px;padding:16px 48px 16px 0;display:flex;align-items:center;background-color:var(--color-bg-primary);position:sticky;bottom:0;box-shadow:0 -11px 13px -13px var(--color-border-primary)}.pagination_wrap_kmil>*:not(:last-child){margin-right:16px}.pages_info_9Quw{min-width:340px;display:flex;gap:8px}.pagination_36rf{display:grid;grid-column-gap:16px;-moz-column-gap:16px;column-gap:16px;grid-auto-flow:column}.prev_btn_UnDy svg{transform:rotate(180deg)}.disabled_btn_G6J6{opacity:.5}.pagination_btn_vexg{color:var(--color-text-secondary)!important;font-weight:500;min-width:24px}.btn_-Zrx{min-width:24px!important}.pagination_btn_vexg.active_F46k{color:var(--color-text-primary)!important;font-weight:700}.select_XysE{border:none;outline:none;position:absolute;background:transparent;right:0;font-weight:500;font-size:14px;color:var(--color-text-primary)}.v2_vDHk.pagination_wrap_kmil{height:auto;min-height:40px;padding:4px 24px;display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;grid-gap:16px;gap:16px;border:1px solid var(--color-border-secondary);border-radius:0 0 12px 12px;box-shadow:none;font-size:14px}.v2_vDHk.pagination_wrap_kmil>*:not(:last-child){margin-right:0}.v2_vDHk .pages_info_9Quw{min-width:0;gap:8px;align-items:baseline;color:var(--color-text-secondary);justify-self:start}.pagination_center_rtzL{display:flex;justify-content:center;justify-self:center;grid-column:2}.v2_vDHk .pagination_36rf{-moz-column-gap:4px;column-gap:4px;align-items:center}.v2_vDHk .pagination_btn_vexg{min-width:28px!important;height:28px!important;padding:0 6px!important;border-radius:6px!important;background-color:transparent!important}.v2_vDHk .pagination_btn_vexg:hover{background-color:var(--color-bg-secondary)!important}.v2_vDHk .pagination_btn_vexg.active_F46k{color:var(--color-text-primary)!important;font-weight:700;background-color:transparent!important}.v2_vDHk .btn_-Zrx{min-width:28px!important;height:28px!important;padding:0!important;color:var(--color-text-secondary)!important}.v2_vDHk .disabled_btn_G6J6{opacity:.4}.select_wrap_QwzZ{justify-self:end;grid-column:3;display:flex;align-items:center;gap:12px;color:var(--color-text-secondary)}.v2_vDHk .select_XysE{position:static;margin:0;border:1px solid var(--color-border-secondary);outline:none;border-radius:8px;height:32px;padding:0 28px 0 12px;font-weight:500;font-size:14px;line-height:1;color:var(--color-text-primary);background-color:var(--color-bg-primary);cursor:pointer;appearance:none;-webkit-appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--color-graphic-secondary, var(--color-text-secondary)) 50%),linear-gradient(135deg,var(--color-graphic-secondary, var(--color-text-secondary)) 50%,transparent 50%);background-position:calc(100% - 14px) 50%,calc(100% - 9px) 50%;background-size:5px 5px,5px 5px;background-repeat:no-repeat}.v2_vDHk .select_XysE:focus-visible{outline:2px solid var(--color-border-link, var(--color-graphic-accent));outline-offset:1px}

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

@@ -1,25 +1,31 @@
 import './index.module.css';
-const n = "pagination_wrap_kmil", t = "pagination_36rf", a = "pages_info_9Quw", i = "prev_btn_UnDy", _ = "disabled_btn_G6J6", o = "pagination_btn_vexg", s = "btn_-Zrx", e = "active_F46k", p = "select_XysE", c = {
+const n = "pagination_wrap_kmil", t = "pages_info_9Quw", a = "pagination_36rf", e = "prev_btn_UnDy", i = "disabled_btn_G6J6", _ = "pagination_btn_vexg", o = "btn_-Zrx", s = "active_F46k", c = "select_XysE", p = "v2_vDHk", g = "pagination_center_rtzL", r = "select_wrap_QwzZ", b = {
   pagination_wrap: n,
-  pagination: t,
-  pages_info: a,
-  prev_btn: i,
-  disabled_btn: _,
-  pagination_btn: o,
-  btn: s,
-  active: e,
-  select: p
+  pages_info: t,
+  pagination: a,
+  prev_btn: e,
+  disabled_btn: i,
+  pagination_btn: _,
+  btn: o,
+  active: s,
+  select: c,
+  v2: p,
+  pagination_center: g,
+  select_wrap: r
 };
 export {
-  e as active,
-  s as btn,
-  c as default,
-  _ as disabled_btn,
-  a as pages_info,
-  t as pagination,
-  o as pagination_btn,
+  s as active,
+  o as btn,
+  b as default,
+  i as disabled_btn,
+  t as pages_info,
+  a as pagination,
+  _ as pagination_btn,
+  g as pagination_center,
   n as pagination_wrap,
-  i as prev_btn,
-  p as select
+  e as prev_btn,
+  c as select,
+  r as select_wrap,
+  p as v2
 };
 //# sourceMappingURL=index.module.css.js.map

package/dist/table/components/pagination/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/table-header/index.d.ts

@@ -15,6 +15,7 @@ type Props = {
     leftHeaderAddons?: React.ReactNode;
     hideSearch?: boolean;
     compact?: boolean;
+    v2?: boolean;
 };
 export declare const TableHeader: React.FC<Props>;
 export {};

package/dist/table/components/table-header/index.js

@@ -1,77 +1,79 @@
-import { jsxs as r, jsx as n } from "react/jsx-runtime";
-import { useState as f, useEffect as p, useRef as H, useCallback as b } from "react";
-import R from "@alphakits/icons/dist/ControllerS";
-import $ from "@alphakits/icons/dist/PlusS";
-import { useDebounce as B } from "rooks";
-import E from "classnames";
-import { Button as v } from "../../../button/component.js";
-import { Flex as F } from "../../../flex/component.js";
-import { HeaderSearch as I } from "../../../header-search/component.js";
-import { translate as P } from "../../languages/index.js";
+import { jsxs as r, jsx as n, Fragment as $ } from "react/jsx-runtime";
+import { useState as f, useEffect as p, useRef as A, useCallback as b } from "react";
+import B from "@alphakits/icons/dist/ControllerS";
+import E from "@alphakits/icons/dist/PlusS";
+import { useDebounce as H } from "rooks";
+import I from "classnames";
+import { Button as g } from "../../../button/component.js";
+import { Flex as P } from "../../../flex/component.js";
+import { HeaderSearch as _ } from "../../../header-search/component.js";
+import { translate as q } from "../../languages/index.js";
 import t from "./index.module.css.js";
-const X = ({
-  tags: s,
-  searchPlaceholder: C = "Type something..",
+const Z = ({
+  tags: m,
+  searchPlaceholder: v = "Type something..",
   searchText: o,
-  hideSearch: g,
-  compact: N = !1,
-  rightHeaderAddons: S,
-  leftHeaderAddons: m,
-  addParam: V,
+  hideSearch: C,
+  compact: S = !1,
+  rightHeaderAddons: V,
+  leftHeaderAddons: s,
+  addParam: y,
   onCreateClick: a,
-  onFiltersClick: y,
+  onFiltersClick: N,
   createButtonLabel: h,
   showFiltersButton: j,
   filtersButtonLabel: D,
-  language: k
+  language: k,
+  v2: w
 }) => {
-  const [w, d] = f(o != null ? o : ""), [c, u] = f(o != null ? o : "");
+  const [z, d] = f(o != null ? o : ""), [c, u] = f(o != null ? o : "");
   p(() => {
     const e = `${o != null ? o : ""}`;
     l.current = e.trim(), d(e), u(e);
   }, [o]);
-  const z = B((e) => u(e), 500), l = H("");
+  const F = H((e) => u(e), 500), l = A("");
   p(() => {
     const e = `${c || ""}`.trim();
-    l.current !== e && (V({ searchText: e, page: 1 }), l.current = e);
+    l.current !== e && (y({ searchText: e, page: 1 }), l.current = e);
   }, [c]);
   const i = b((e) => {
-    d(e), z(e);
-  }, []), A = b(() => {
+    d(e), F(e);
+  }, []), R = b(() => {
     i("");
   }, [i]);
-  return /* @__PURE__ */ r("div", { className: E(t.table_header, { [t.compact]: N }), children: [
+  return /* @__PURE__ */ r("div", { className: I(t.table_header, { [t.compact]: S }), children: [
     /* @__PURE__ */ r("div", { className: t.actions, children: [
-      /* @__PURE__ */ r(F, { justify: "start", children: [
-        m && /* @__PURE__ */ n("div", { className: t.leftHeaderAddons, children: m }),
-        !g && /* @__PURE__ */ n(
-          I,
+      /* @__PURE__ */ r(P, { justify: "start", gap: "md", children: [
+        !C && /* @__PURE__ */ n(
+          _,
           {
-            value: w,
+            value: z,
             onChange: i,
-            onClear: A,
-            placeholder: C
+            onClear: R,
+            placeholder: v,
+            v2: w
           }
-        )
+        ),
+        s && /* @__PURE__ */ n($, { children: s })
       ] }),
       /* @__PURE__ */ r("div", { className: t.buttons, children: [
-        S,
+        V,
         !!a && /* @__PURE__ */ n(
-          v,
+          g,
           {
             dataTestId: "createbtn",
             onClick: a,
             view: "primary",
-            leftAddons: /* @__PURE__ */ n($, {}),
+            leftAddons: /* @__PURE__ */ n(E, {}),
             size: "xs",
-            children: h || P(k)("create")
+            children: h || q(k)("create")
           }
         ),
         j && /* @__PURE__ */ n(
-          v,
+          g,
           {
-            leftAddons: /* @__PURE__ */ n(R, {}),
-            onClick: y,
+            leftAddons: /* @__PURE__ */ n(B, {}),
+            onClick: N,
             view: "outlined",
             size: "xs",
             children: D
@@ -79,10 +81,10 @@ const X = ({
         )
       ] })
     ] }),
-    !!s.length && /* @__PURE__ */ n("div", { className: t.tags, children: s })
+    !!m.length && /* @__PURE__ */ n("div", { className: t.tags, children: m })
   ] });
 };
 export {
-  X as TableHeader
+  Z as TableHeader
 };
 //# sourceMappingURL=index.js.map

package/dist/table/components/table-header/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../src/table/components/table-header/index.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/ban-types */\nimport React, {\n    useCallback, useEffect, useRef, useState,\n} from 'react';\nimport ControllerS from '@alphakits/icons/dist/ControllerS';\nimport PlusS from '@alphakits/icons/dist/PlusS';\nimport { useDebounce } from 'rooks';\nimport cn from 'classnames';\n\nimport { Button } from '../../../button';\nimport { Flex } from '../../../flex';\nimport { HeaderSearch } from '../../../header-search';\nimport { translate } from '../../languages';\nimport { Query } from '../../types';\n\nimport styles from './index.module.css';\n\ntype Props = {\n    tags: JSX.Element[];\n    searchPlaceholder: string;\n    searchText?: string;\n    addParam: (val: Query) => void;\n    onCreateClick?: () => void;\n    onFiltersClick?: () => void;\n    language: 'en' | 'de' | 'ru';\n    showFiltersButton: boolean;\n    filtersButtonLabel?: string;\n    createButtonLabel?: string;\n    rightHeaderAddons?: React.ReactNode;\n    leftHeaderAddons?: React.ReactNode;\n    hideSearch?: boolean;\n    compact?: boolean;\n};\n\nexport const TableHeader: React.FC<Props> = ({\n    tags,\n    searchPlaceholder = 'Type something..',\n    searchText,\n    hideSearch,\n    compact = false,\n    rightHeaderAddons,\n    leftHeaderAddons,\n    addParam,\n    onCreateClick,\n    onFiltersClick,\n    createButtonLabel,\n    showFiltersButton,\n    filtersButtonLabel,\n    language,\n}) => {\n    // локальное состояние поля ввода\n    const [value, setValue] = useState<string>(searchText ?? '');\n    const [debouncedValue, setDebouncedValue] = useState<string>(searchText ?? '');\n\n    // если проп searchText меняется извне — синхронизируем локальные стейты\n    useEffect(() => {\n        const v = `${searchText ?? ''}`;\n\n        lastSentRef.current = v.trim();\n        setValue(v);\n        setDebouncedValue(v);\n    }, [searchText]);\n\n    // дебаунсим только установку debouncedValue\n    const setValueDebounced = useDebounce((v: string) => setDebouncedValue(v), 500);\n\n    // не отправляем одинаковые значения повторно\n    const lastSentRef = useRef<string>('');\n\n    useEffect(() => {\n        const next = (`${debouncedValue || ''}`).trim();\n\n        if (lastSentRef.current === next) return;\n\n        addParam({ searchText: next, page: 1 });\n        lastSentRef.current = next;\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, [debouncedValue]);\n\n    const handleChangeValue = useCallback((v: string) => {\n        setValue(v);\n        setValueDebounced(v);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, []);\n\n    const handleClear = useCallback(() => {\n    // достаточно обнулить значение — эффект сам отправит пустую строку\n        handleChangeValue('');\n    }, [handleChangeValue]);\n\n    return (\n        <div className={ cn(styles.table_header, { [styles.compact]: compact }) }>\n            <div className={ styles.actions }>\n                <Flex justify=\"start\">\n                    { leftHeaderAddons && (\n                        <div className={ styles.leftHeaderAddons }>{ leftHeaderAddons }</div>\n                    ) }\n\n                    { !hideSearch && (\n                        <HeaderSearch\n                            value={ value }\n                            onChange={ handleChangeValue }\n                            onClear={ handleClear }\n                            placeholder={ searchPlaceholder }\n                        />\n                    ) }\n                </Flex>\n\n                <div className={ styles.buttons }>\n                    { rightHeaderAddons }\n\n                    { !!onCreateClick && (\n                        <Button\n                            dataTestId=\"createbtn\"\n                            onClick={ onCreateClick }\n                            view=\"primary\"\n                            leftAddons={ <PlusS /> }\n                            size=\"xs\"\n                        >\n                            { createButtonLabel || translate(language)('create') }\n                        </Button>\n                    ) }\n\n                    { showFiltersButton && (\n                        <Button\n                            leftAddons={ <ControllerS /> }\n                            onClick={ onFiltersClick }\n                            view=\"outlined\"\n                            size=\"xs\"\n                        >\n                            { filtersButtonLabel }\n                        </Button>\n                    ) }\n                </div>\n            </div>\n\n            { !!tags.length && <div className={ styles.tags }>{ tags }</div> }\n        </div>\n    );\n};\n"],"names":["TableHeader","tags","searchPlaceholder","searchText","hideSearch","compact","rightHeaderAddons","leftHeaderAddons","addParam","onCreateClick","onFiltersClick","createButtonLabel","showFiltersButton","filtersButtonLabel","language","value","setValue","useState","debouncedValue","setDebouncedValue","useEffect","v","lastSentRef","setValueDebounced","useDebounce","useRef","next","handleChangeValue","useCallback","handleClear","jsxs","cn","styles","Flex","jsx","HeaderSearch","Button","PlusS","translate","ControllerS"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../../src/table/components/table-header/index.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/ban-types */\nimport React, { useCallback, useEffect, useRef, useState } from 'react';\nimport ControllerS from '@alphakits/icons/dist/ControllerS';\nimport PlusS from '@alphakits/icons/dist/PlusS';\nimport { useDebounce } from 'rooks';\nimport cn from 'classnames';\n\nimport { Button } from '../../../button';\nimport { Flex } from '../../../flex';\nimport { HeaderSearch } from '../../../header-search';\nimport { translate } from '../../languages';\nimport { Query } from '../../types';\n\nimport styles from './index.module.css';\n\ntype Props = {\n    tags: JSX.Element[];\n    searchPlaceholder: string;\n    searchText?: string;\n    addParam: (val: Query) => void;\n    onCreateClick?: () => void;\n    onFiltersClick?: () => void;\n    language: 'en' | 'de' | 'ru';\n    showFiltersButton: boolean;\n    filtersButtonLabel?: string;\n    createButtonLabel?: string;\n    rightHeaderAddons?: React.ReactNode;\n    leftHeaderAddons?: React.ReactNode;\n    hideSearch?: boolean;\n    compact?: boolean;\n    v2?: boolean;\n};\n\nexport const TableHeader: React.FC<Props> = ({\n    tags,\n    searchPlaceholder = 'Type something..',\n    searchText,\n    hideSearch,\n    compact = false,\n    rightHeaderAddons,\n    leftHeaderAddons,\n    addParam,\n    onCreateClick,\n    onFiltersClick,\n    createButtonLabel,\n    showFiltersButton,\n    filtersButtonLabel,\n    language,\n    v2,\n}) => {\n    // локальное состояние поля ввода\n    const [value, setValue] = useState<string>(searchText ?? '');\n    const [debouncedValue, setDebouncedValue] = useState<string>(searchText ?? '');\n\n    // если проп searchText меняется извне — синхронизируем локальные стейты\n    useEffect(() => {\n        const v = `${searchText ?? ''}`;\n\n        lastSentRef.current = v.trim();\n        setValue(v);\n        setDebouncedValue(v);\n    }, [searchText]);\n\n    // дебаунсим только установку debouncedValue\n    const setValueDebounced = useDebounce((v: string) => setDebouncedValue(v), 500);\n\n    // не отправляем одинаковые значения повторно\n    const lastSentRef = useRef<string>('');\n\n    useEffect(() => {\n        const next = `${debouncedValue || ''}`.trim();\n\n        if (lastSentRef.current === next) return;\n\n        addParam({ searchText: next, page: 1 });\n        lastSentRef.current = next;\n        // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, [debouncedValue]);\n\n    const handleChangeValue = useCallback((v: string) => {\n        setValue(v);\n        setValueDebounced(v);\n        // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, []);\n\n    const handleClear = useCallback(() => {\n        // достаточно обнулить значение — эффект сам отправит пустую строку\n        handleChangeValue('');\n    }, [handleChangeValue]);\n\n    return (\n        <div className={cn(styles.table_header, { [styles.compact]: compact })}>\n            <div className={styles.actions}>\n                <Flex justify='start' gap='md'>\n                    {!hideSearch && (\n                        <HeaderSearch\n                            value={value}\n                            onChange={handleChangeValue}\n                            onClear={handleClear}\n                            placeholder={searchPlaceholder}\n                            v2={v2}\n                        />\n                    )}\n\n                    {leftHeaderAddons && (\n                        <>{leftHeaderAddons}</>\n                    )}\n                </Flex>\n\n                <div className={styles.buttons}>\n                    {rightHeaderAddons}\n\n                    {!!onCreateClick && (\n                        <Button\n                            dataTestId='createbtn'\n                            onClick={onCreateClick}\n                            view='primary'\n                            leftAddons={<PlusS />}\n                            size='xs'\n                        >\n                            {createButtonLabel || translate(language)('create')}\n                        </Button>\n                    )}\n\n                    {showFiltersButton && (\n                        <Button\n                            leftAddons={<ControllerS />}\n                            onClick={onFiltersClick}\n                            view='outlined'\n                            size='xs'\n                        >\n                            {filtersButtonLabel}\n                        </Button>\n                    )}\n                </div>\n            </div>\n\n            {!!tags.length && <div className={styles.tags}>{tags}</div>}\n        </div>\n    );\n};\n"],"names":["TableHeader","tags","searchPlaceholder","searchText","hideSearch","compact","rightHeaderAddons","leftHeaderAddons","addParam","onCreateClick","onFiltersClick","createButtonLabel","showFiltersButton","filtersButtonLabel","language","v2","value","setValue","useState","debouncedValue","setDebouncedValue","useEffect","v","lastSentRef","setValueDebounced","useDebounce","useRef","next","handleChangeValue","useCallback","handleClear","jsxs","cn","styles","Flex","jsx","HeaderSearch","Button","PlusS","translate","ControllerS"],"mappings":"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"}

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}.compact_ull-{margin-bottom:12px}.compact_ull- .leftHeaderAddons_W8Yb{margin-right:12px!important}.compact_ull- .tags_PpKz{margin-top:8px;margin-right:-8px}.compact_ull- .tags_PpKz>*:not(:last-child):not(:only-child){margin-right:8px}.compact_ull- .tag_SqNT{margin-right:8px}.compact_ull- .buttons_3CQY button:not(:last-child){margin-right:8px}
+.table_header_GXu4{width:100%;margin-bottom:20px}.actions_GZKJ{display:flex;align-items:center;justify-content:space-between;gap:12px}.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;gap:8px}.buttons_3CQY button:not(:last-child){margin-right:0}.compact_ull- .leftHeaderAddons_W8Yb{margin-right:12px!important}.compact_ull- .tags_PpKz{margin-top:8px;margin-right:-8px}.compact_ull- .tags_PpKz>*:not(:last-child):not(:only-child){margin-right:8px}.compact_ull- .tag_SqNT{margin-right:8px}.compact_ull- .buttons_3CQY button:not(:last-child){margin-right:8px}

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

@@ -1,8 +1,7 @@
 import './index.module.css';
-const t = "table_header_GXu4", s = "actions_GZKJ", e = "leftHeaderAddons_W8Yb", a = "tags_PpKz", o = "buttons_3CQY", c = "compact_ull-", n = {
+const t = "table_header_GXu4", s = "actions_GZKJ", a = "tags_PpKz", o = "buttons_3CQY", c = "compact_ull-", e = {
   table_header: t,
   actions: s,
-  leftHeaderAddons: e,
   tags: a,
   buttons: o,
   compact: c
@@ -11,8 +10,7 @@ export {
   s as actions,
   o as buttons,
   c as compact,
-  n as default,
-  e as leftHeaderAddons,
+  e as default,
   t as table_header,
   a as tags
 };

package/dist/table/components/table-header/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/index.module.css

@@ -1 +1 @@
-:root{--text-primary-color: var(--color-text-primary);--text-secondary-color: var(--color-text-secondary);--text-tertiary-color: var(--color-text-tertiary);--border-radius: 4px;--focus-color: var(--color-border-link);--font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Helvetica, sans-serif;--disabled-cursor: not-allowed;--arrow-transform: rotate(180deg)}.table_wrapper_SeB5{width:100%;box-sizing:border-box;position:relative}.table_wrapper_SeB5 .table_9sbd{position:relative;box-sizing:border-box}:is(.table_wrapper_SeB5 .table_9sbd) table{width:100%}.fill_Q-ic{height:-webkit-fill-available;flex-grow:1;display:flex;flex-direction:column}.fill_Q-ic .table_9sbd{flex-grow:1;overflow:hidden}:is(.fill_Q-ic .table_9sbd):hover{overflow:auto}.clickable_k4S8{cursor:pointer}.clickable_k4S8:hover td{background-color:var(--color-bg-special-big-objects)}
+:root{--text-primary-color: var(--color-text-primary);--text-secondary-color: var(--color-text-secondary);--text-tertiary-color: var(--color-text-tertiary);--border-radius: 4px;--focus-color: var(--color-border-link);--font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Helvetica, sans-serif;--disabled-cursor: not-allowed;--arrow-transform: rotate(180deg)}.table_wrapper_SeB5{width:100%;box-sizing:border-box;position:relative}.table_wrapper_SeB5 .table_9sbd{position:relative;box-sizing:border-box}:is(.table_wrapper_SeB5 .table_9sbd) table{width:100%}.fill_Q-ic{height:-webkit-fill-available;flex-grow:1;display:flex;flex-direction:column}.fill_Q-ic .table_9sbd{flex-grow:1;overflow:hidden}:is(.fill_Q-ic .table_9sbd):hover{overflow:auto}.clickable_k4S8{cursor:pointer}.clickable_k4S8:hover td{background-color:var(--color-bg-special-big-objects)}.v2_roBT .table_9sbd{border:1px solid var(--color-border-secondary);border-radius:12px 12px 0 0;background:var(--color-bg-primary);box-shadow:var(--shadow-xs);overflow:hidden}.v2_roBT .table_9sbd table{border-collapse:collapse;background:var(--color-bg-primary)}.v2_roBT .table_9sbd tbody tr td{transition:background-color .15s ease}.v2_roBT .clickable_k4S8:hover td{background-color:color-mix(in srgb,var(--color-bg-secondary) 92%,var(--color-bg-primary))}

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

@@ -1,18 +1,20 @@
 import './index.module.css';
-const l = "table_wrapper_SeB5", t = "table_9sbd", a = "fill_Q-ic", c = "compact_kbrU", e = "clickable_k4S8", b = {
+const l = "table_wrapper_SeB5", t = "table_9sbd", c = "fill_Q-ic", a = "compact_kbrU", e = "clickable_k4S8", o = "v2_roBT", b = {
   table_wrapper: l,
   table: t,
-  fill: a,
+  fill: c,
   default: "default_BxOw",
-  compact: c,
-  clickable: e
+  compact: a,
+  clickable: e,
+  v2: o
 };
 export {
   e as clickable,
-  c as compact,
+  a as compact,
   b as default,
-  a as fill,
+  c as fill,
   t as table,
-  l as table_wrapper
+  l as table_wrapper,
+  o as v2
 };
 //# 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

@@ -35,6 +35,8 @@ export type TableProps<T extends object> = Records<T> & {
     language: 'de' | 'ru' | 'en';
     /** true — параметры из URL; false — только локальное состояние. */
     fromPath?: boolean;
+    /** Новый визуал таблицы (поиск в обводке, контейнер таблицы с тенью, обновлённый футер). */
+    v2?: boolean;
 } & FiltersButton;
-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 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, v2, }: TableProps<T>): JSX.Element;
 export {};