ics-ui-kit 0.1.12 → 0.1.14

package/dist/treeModel-BlPWVj4W.js

@@ -0,0 +1,319 @@
+import { jsx as s, jsxs as m } from "react/jsx-runtime";
+import * as l from "react";
+import { T as n } from "./index-BVqs-uqP.js";
+import { I as A } from "./Icon-DH3ev9GK.js";
+import { S as G } from "./ScrollShadowContainer-DdrnF8qU.js";
+import { STICKY_HEADER as F, STICKY_FOOTER as P } from "./components/table/sticky.js";
+import { a as j } from "./opaqueCell-SGaiyL54.js";
+import { c as u } from "./cn-dsXlqdJg.js";
+import { M as k } from "./minus-BltQa7Q2.js";
+import { P as Y } from "./plus-BpxYPnAG.js";
+const D = n({
+  slots: {
+    wrapper: "relative w-full overflow-x-auto rounded-lg border border-secondary-border",
+    // Раздельная модель границ вместо схлопнутой (умолчание Tailwind для таблиц).
+    // В схлопнутой модели граница принадлежит сетке таблицы, а не ячейке: `position: sticky`
+    // и `transform` уносят ячейку, а линия остаётся стоять на старом месте — из-за этого
+    // прилипающим шапке и колонке приходилось гасить границу и рисовать её inset-тенью.
+    // В раздельной модели граница входит в бокс ячейки и едет вместе с ней.
+    //
+    // Плата: `border` у групп строк (`thead`, `tbody`, `tfoot`) и у самих `tr` браузер
+    // обязан игнорировать, поэтому все разделители живут на ячейках — см. `TABLE_ROW_ANATOMY`,
+    // `tableHeaderStyles` и `tableFooterStyles`.
+    table: "w-full caption-bottom border-separate border-spacing-0 text-xs"
+  }
+}), M = l.forwardRef(
+  ({ className: e, containerClassName: a, containerRef: t, ...r }, o) => {
+    const i = D();
+    return /* @__PURE__ */ s("div", { ref: t, className: i.wrapper({ className: a }), children: /* @__PURE__ */ s("table", { ref: o, className: i.table({ className: e }), ...r }) });
+  }
+);
+M.displayName = "Table";
+const K = n({
+  // Линия под шапкой — на ячейках, а не на `thead`: `border` у групп строк в раздельной
+  // модели игнорируется (см. `tableStyles`). Заодно это ровно то, что нужно прилипающей
+  // шапке: граница ячейки уезжает вместе с ячейкой, а не остаётся в сетке таблицы.
+  //
+  // Ту же нижнюю границу ячейкам шапки даёт и `TableRow`; дубль намеренный — разделитель
+  // шапки и тела это контракт самого `TableHeader`, и он не должен пропадать из-за голого
+  // `<tr>` в разметке потребителя. Одинаковые объявления одного свойства линию не задваивают.
+  //
+  base: "bg-primary-bg [&_th]:border-b [&_th]:border-secondary-border [&_tr]:[--table-row-bg-hover:transparent]",
+  variants: {
+    sticky: {
+      true: F
+    }
+  }
+}), W = l.forwardRef(
+  ({ className: e, sticky: a, ...t }, r) => /* @__PURE__ */ s("thead", { ref: r, className: K({ sticky: a, className: e }), ...t })
+);
+W.displayName = "TableHeader";
+const _ = n({
+  base: "bg-secondary-bg [&_tr:last-child>*]:border-b-0"
+}), X = l.forwardRef(
+  ({ className: e, ...a }, t) => /* @__PURE__ */ s("tbody", { ref: t, className: _({ className: e }), ...a })
+);
+X.displayName = "TableBody";
+const q = n({
+  base: "overflow-x-hidden"
+}), U = l.forwardRef(
+  ({ className: e, containerClassName: a, shadowSize: t, ...r }, o) => /* @__PURE__ */ s(
+    G,
+    {
+      className: q({ className: a }),
+      shadowSize: t,
+      children: /* @__PURE__ */ s("tbody", { ref: o, className: _({ className: e }), ...r })
+    }
+  )
+);
+U.displayName = "TableBodyContainer";
+const V = n({
+  // Верхняя граница — на ячейках первой строки, нижняя снимается с ячеек последней:
+  // собственный `border` у `tfoot` в раздельной модели игнорируется (см. `tableStyles`).
+  base: [
+    "bg-primary-bg font-medium",
+    "[&>tr:first-child>*]:border-t [&>tr:first-child>*]:border-secondary-border",
+    "[&>tr:last-child>*]:border-b-0"
+  ],
+  variants: {
+    sticky: {
+      true: P
+    }
+  }
+}), J = l.forwardRef(
+  ({ className: e, sticky: a, ...t }, r) => /* @__PURE__ */ s("tfoot", { ref: r, className: V({ sticky: a, className: e }), ...t })
+);
+J.displayName = "TableFooter";
+const Q = "[&>*]:border-b [&>*]:border-secondary-border transition-colors", Z = n({
+  base: [
+    Q,
+    // Заливку читает ровно один класс на состояние — обычный `bg-*` и `hover:bg-*`, —
+    // поэтому любой `bg-*` из `className` вытесняет её штатно, без `!important`
+    // и без повторения модификаторов.
+    "bg-[color:var(--table-row-bg)] hover:bg-[color:var(--table-row-bg-hover)]",
+    // Обычная строка: подложку даёт `TableBody`, ховер — нейтральная альфа поверх неё
+    // (`alpha/high/97` в макете подписана как состояние строки `hover`).
+    "[--table-row-bg-hover:hsl(var(--alpha-high-03))] [--table-row-bg:transparent]",
+    j
+  ]
+}), $ = l.forwardRef(({ className: e, ...a }, t) => /* @__PURE__ */ s("tr", { ref: t, className: Z({ className: e }), ...a }));
+$.displayName = "TableRow";
+const ee = n({
+  base: "border-r border-secondary-border px-3 py-2.5 text-left align-middle font-medium text-muted last:border-r-0",
+  variants: {
+    interactive: {
+      true: [
+        "cursor-pointer p-0 transition-colors",
+        "hover:bg-secondary-bg-hover",
+        "data-[state=open]:bg-primary-bg-hover [&:has([data-state=open])]:bg-primary-bg-hover"
+      ]
+    }
+  }
+}), ae = l.forwardRef(
+  ({ className: e, interactive: a, ...t }, r) => /* @__PURE__ */ s("th", { ref: r, className: ee({ interactive: a, className: e }), ...t })
+);
+ae.displayName = "TableHead";
+const te = n({
+  base: "border-r border-secondary-border px-3 py-2.5 align-middle last:border-r-0 [&:has([role=checkbox])]:pr-0"
+}), C = l.forwardRef(
+  ({ className: e, ...a }, t) => /* @__PURE__ */ s("td", { ref: t, className: te({ className: e }), ...a })
+);
+C.displayName = "TableCell";
+const re = n({
+  base: [
+    "absolute right-0 top-0 z-10 h-full w-2 translate-x-1/2 cursor-col-resize touch-none select-none",
+    "after:absolute after:left-1/2 after:top-0 after:h-full after:w-0.5 after:-translate-x-1/2",
+    "after:bg-primary-border after:opacity-0 after:transition-opacity hover:after:opacity-100"
+  ],
+  variants: {
+    active: {
+      true: "after:opacity-100"
+    }
+  }
+}), se = l.forwardRef(
+  ({ className: e, active: a, ...t }, r) => /* @__PURE__ */ s(
+    "div",
+    {
+      ref: r,
+      role: "separator",
+      "aria-orientation": "vertical",
+      className: re({ active: a, className: e }),
+      ...t
+    }
+  )
+);
+se.displayName = "TableResizeHandle";
+const oe = n({
+  base: "mt-4 text-muted"
+}), le = l.forwardRef(
+  ({ className: e, ...a }, t) => /* @__PURE__ */ s("caption", { ref: t, className: oe({ className: e }), ...a })
+);
+le.displayName = "TableCaption";
+const S = 18, ne = 13, d = 16, ie = S - d / 2, L = 10, de = 16, p = L + de / 2, ce = 1, be = p - L - d / 2, f = (e) => ne + e * S, pe = (e) => f(e) - d / 2, N = n({
+  base: "absolute bg-primary-border",
+  variants: {
+    axis: {
+      vertical: "w-px",
+      horizontal: "h-px"
+    }
+  }
+}), H = ({ lines: e, descends: a = !1, className: t }) => /* @__PURE__ */ m(
+  "span",
+  {
+    "aria-hidden": !0,
+    "data-tree-lines": e.join(" "),
+    "data-tree-level": e.length,
+    className: u("pointer-events-none absolute inset-0", t),
+    children: [
+      e.map((r, o) => r === "none" ? null : /* @__PURE__ */ m(l.Fragment, { children: [
+        /* @__PURE__ */ s(
+          "span",
+          {
+            "data-tree-line": r,
+            "data-tree-column": o,
+            className: N({ axis: "vertical" }),
+            style: {
+              left: f(o),
+              top: -1,
+              // `end` — уголок: вертикаль обрывается на коннекторе, иначе протекла бы
+              // под следующие строки, где ветки этого предка уже нет.
+              ...r === "end" ? { height: p + ce } : { bottom: -1 }
+            }
+          }
+        ),
+        r !== "pass" && /* @__PURE__ */ s(
+          "span",
+          {
+            "data-tree-line": "stub",
+            "data-tree-column": o,
+            className: N({ axis: "horizontal" }),
+            style: { left: f(o), top: p, width: ie }
+          }
+        )
+      ] }, o)),
+      a && /* @__PURE__ */ s(
+        "span",
+        {
+          "data-tree-line": "spur",
+          "data-tree-column": e.length,
+          className: N({ axis: "vertical" }),
+          style: {
+            left: f(e.length),
+            top: p + d / 2,
+            bottom: -1
+          }
+        }
+      )
+    ]
+  }
+);
+H.displayName = "TableTreeLines";
+const fe = n({
+  base: [
+    // `z-10` поднимает раскрыватель над линиями, непрозрачный фон разрывает вертикаль под ним.
+    "relative z-10 flex shrink-0 items-center justify-center",
+    // Рамка, фон и скругление — как у `Checkbox`: в строке они стоят рядом и должны
+    // читаться одинаково.
+    "rounded-sm border border-primary-border bg-secondary-bg text-muted",
+    "hover:text-primary-fg focus-visible:shadow-focus focus-visible:outline-none",
+    // Невидимое расширение зоны нажатия до 24px. Именно псевдоэлементом, а не паддингом
+    // или размером: квадрат обязан остаться на сетке линий, а промахиваться по 16px
+    // на строке высотой 36px легко.
+    "before:absolute before:left-1/2 before:top-1/2 before:size-6 before:-translate-x-1/2 before:-translate-y-1/2"
+  ]
+}), O = l.forwardRef(
+  ({ className: e, expanded: a, style: t, ...r }, o) => /* @__PURE__ */ s(
+    "button",
+    {
+      ref: o,
+      type: "button",
+      "aria-expanded": a,
+      className: fe({ className: e }),
+      style: { width: d, height: d, marginTop: be, ...t },
+      ...r,
+      children: /* @__PURE__ */ s(A, { icon: a ? k : Y, className: "size-3" })
+    }
+  )
+);
+O.displayName = "TableTreeToggle";
+const I = ({ className: e }) => /* @__PURE__ */ s("span", { "aria-hidden": !0, className: u("shrink-0", e), style: { width: d } });
+I.displayName = "TableTreeSpacer";
+const me = l.forwardRef(
+  ({ row: e, onToggle: a, toggleLabel: t, className: r, style: o, children: i, ...c }, T) => /* @__PURE__ */ m(
+    C,
+    {
+      ref: T,
+      "data-tree-level": e.level,
+      className: u("relative align-top", r),
+      style: { paddingLeft: pe(e.level), ...o },
+      ...c,
+      children: [
+        /* @__PURE__ */ s(H, { lines: e.lines, descends: e.descends }),
+        /* @__PURE__ */ m("span", { className: "flex items-start gap-1.5", children: [
+          e.hasChildren ? /* @__PURE__ */ s(
+            O,
+            {
+              expanded: e.isExpanded,
+              "aria-label": t ?? (e.isExpanded ? "Свернуть" : "Развернуть"),
+              onClick: a
+            }
+          ) : /* @__PURE__ */ s(I, {}),
+          i
+        ] })
+      ]
+    }
+  )
+);
+me.displayName = "TableTreeCell";
+const Te = (e, a) => [
+  ...e.map((t) => t === "pass" || t === "branch" ? "pass" : "none"),
+  a ? "end" : "branch"
+];
+function xe(e, a) {
+  const { getChildren: t, isExpanded: r = () => !0 } = a, o = [], i = (c, T, h, z, B) => {
+    c.forEach((b, y) => {
+      const E = y === c.length - 1, v = t(b), R = !!v?.length, g = R && r(b), w = h === 0 ? [] : Te(z, E), x = [...B, y];
+      o.push({
+        node: b,
+        parent: T,
+        level: h,
+        index: y,
+        isLast: E,
+        hasChildren: R,
+        isExpanded: g,
+        descends: g,
+        lines: w,
+        path: x
+      }), g && i(v, b, h + 1, w, x);
+    });
+  };
+  return i(e, null, 0, [], []), o;
+}
+export {
+  M as T,
+  W as a,
+  X as b,
+  U as c,
+  J as d,
+  ae as e,
+  $ as f,
+  C as g,
+  le as h,
+  se as i,
+  me as j,
+  H as k,
+  O as l,
+  I as m,
+  pe as n,
+  S as o,
+  ne as p,
+  d as q,
+  ie as r,
+  p as s,
+  f as t,
+  ce as u,
+  be as v,
+  xe as w,
+  Te as x
+};
+//# sourceMappingURL=treeModel-BlPWVj4W.js.map

package/dist/treeModel-BlPWVj4W.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"treeModel-BlPWVj4W.js","sources":["../src/components/table/Table.tsx","../src/components/table/tree/treeGeometry.ts","../src/components/table/tree/TableTree.tsx","../src/components/table/tree/treeModel.ts"],"sourcesContent":["import * as React from \"react\";\nimport { tv } from \"tailwind-variants\";\nimport { ScrollShadowContainer } from \"../scroll-shadow-container\";\nimport { STICKY_FOOTER, STICKY_HEADER } from \"./sticky/stickyCell\";\nimport { ScrollShadowContainerProps } from \"../scroll-shadow-container/ScrollShadowContainer\";\nimport { TABLE_ROW_TINT_LAYERS } from \"./rowTint\";\n\nconst tableStyles = tv({\n\tslots: {\n\t\twrapper: \"relative w-full overflow-x-auto rounded-lg border border-secondary-border\",\n\n\t\t// Раздельная модель границ вместо схлопнутой (умолчание Tailwind для таблиц).\n\t\t// В схлопнутой модели граница принадлежит сетке таблицы, а не ячейке: `position: sticky`\n\t\t// и `transform` уносят ячейку, а линия остаётся стоять на старом месте — из-за этого\n\t\t// прилипающим шапке и колонке приходилось гасить границу и рисовать её inset-тенью.\n\t\t// В раздельной модели граница входит в бокс ячейки и едет вместе с ней.\n\t\t//\n\t\t// Плата: `border` у групп строк (`thead`, `tbody`, `tfoot`) и у самих `tr` браузер\n\t\t// обязан игнорировать, поэтому все разделители живут на ячейках — см. `TABLE_ROW_ANATOMY`,\n\t\t// `tableHeaderStyles` и `tableFooterStyles`.\n\t\ttable: \"w-full caption-bottom border-separate border-spacing-0 text-xs\"\n\t}\n});\n\nexport type TableProps = React.HTMLAttributes<HTMLTableElement> & {\n\tcontainerClassName?: string;\n\tcontainerRef?: React.Ref<HTMLDivElement>;\n};\n\nexport const Table = React.forwardRef<HTMLTableElement, TableProps>(\n\t({ className, containerClassName, containerRef, ...props }, ref) => {\n\t\tconst styles = tableStyles();\n\n\t\treturn (\n\t\t\t<div ref={containerRef} className={styles.wrapper({ className: containerClassName })}>\n\t\t\t\t<table ref={ref} className={styles.table({ className })} {...props} />\n\t\t\t</div>\n\t\t);\n\t}\n);\n\nTable.displayName = \"Table\";\n\nconst tableHeaderStyles = tv({\n\t// Линия под шапкой — на ячейках, а не на `thead`: `border` у групп строк в раздельной\n\t// модели игнорируется (см. `tableStyles`). Заодно это ровно то, что нужно прилипающей\n\t// шапке: граница ячейки уезжает вместе с ячейкой, а не остаётся в сетке таблицы.\n\t//\n\t// Ту же нижнюю границу ячейкам шапки даёт и `TableRow`; дубль намеренный — разделитель\n\t// шапки и тела это контракт самого `TableHeader`, и он не должен пропадать из-за голого\n\t// `<tr>` в разметке потребителя. Одинаковые объявления одного свойства линию не задваивают.\n\t//\n\tbase: \"bg-primary-bg [&_th]:border-b [&_th]:border-secondary-border [&_tr]:[--table-row-bg-hover:transparent]\",\n\tvariants: {\n\t\tsticky: {\n\t\t\ttrue: STICKY_HEADER\n\t\t}\n\t}\n});\n\nexport type TableHeaderProps = React.HTMLAttributes<HTMLTableSectionElement> & {\n\t/**\n\t * Шапка остаётся на месте при вертикальной прокрутке.\n\t *\n\t * Прокручивается контейнер таблицы, поэтому ему нужна ограниченная высота\n\t * (`containerClassName=\"max-h-80\"`): без неё прокручивать нечего и `position: sticky`\n\t * ничего не делает.\n\t *\n\t * Проп, а не набор классов в `className`, потому что вместе со `sticky` требуется\n\t * `z-index`, согласованный с закреплёнными колонками, — это знание кита, а не\n\t * потребителя (см. `STICKY_HEADER`).\n\t */\n\tsticky?: boolean;\n};\n\nexport const TableHeader = React.forwardRef<HTMLTableSectionElement, TableHeaderProps>(\n\t({ className, sticky, ...props }, ref) => (\n\t\t<thead ref={ref} className={tableHeaderStyles({ sticky, className })} {...props} />\n\t)\n);\n\nTableHeader.displayName = \"TableHeader\";\n\nconst tableBodyStyles = tv({\n\tbase: \"bg-secondary-bg [&_tr:last-child>*]:border-b-0\"\n});\n\nexport const TableBody = React.forwardRef<HTMLTableSectionElement, React.HTMLAttributes<HTMLTableSectionElement>>(\n\t({ className, ...props }, ref) => <tbody ref={ref} className={tableBodyStyles({ className })} {...props} />\n);\n\nTableBody.displayName = \"TableBody\";\n\nconst tableBodyContainerStyles = tv({\n\tbase: \"overflow-x-hidden\"\n});\n\nexport type TableBodyContainerProps = React.HTMLAttributes<HTMLTableSectionElement> & {\n\tcontainerClassName?: string;\n\tshadowSize?: ScrollShadowContainerProps[\"shadowSize\"];\n};\n\nexport const TableBodyContainer = React.forwardRef<HTMLTableSectionElement, TableBodyContainerProps>(\n\t({ className, containerClassName, shadowSize, ...props }, ref) => (\n\t\t<ScrollShadowContainer\n\t\t\tclassName={tableBodyContainerStyles({ className: containerClassName })}\n\t\t\tshadowSize={shadowSize}\n\t\t>\n\t\t\t<tbody ref={ref} className={tableBodyStyles({ className })} {...props} />\n\t\t</ScrollShadowContainer>\n\t)\n);\n\nTableBodyContainer.displayName = \"TableBodyContainer\";\n\nconst tableFooterStyles = tv({\n\t// Верхняя граница — на ячейках первой строки, нижняя снимается с ячеек последней:\n\t// собственный `border` у `tfoot` в раздельной модели игнорируется (см. `tableStyles`).\n\tbase: [\n\t\t\"bg-primary-bg font-medium\",\n\t\t\"[&>tr:first-child>*]:border-t [&>tr:first-child>*]:border-secondary-border\",\n\t\t\"[&>tr:last-child>*]:border-b-0\"\n\t],\n\tvariants: {\n\t\tsticky: {\n\t\t\ttrue: STICKY_FOOTER\n\t\t}\n\t}\n});\n\nexport type TableFooterProps = React.HTMLAttributes<HTMLTableSectionElement> & {\n\t/**\n\t * Итоги остаются на месте при вертикальной прокрутке.\n\t *\n\t * Зеркало `sticky` у `TableHeader`, и требует того же: прокручивается контейнер таблицы,\n\t * поэтому у него должна быть ограниченная высота — без неё прокручивать нечего.\n\t *\n\t * Проп, а не классы в `className`, по той же причине, что и у шапки: вместе со `sticky`\n\t * нужен `z-index`, согласованный с закреплёнными колонками (см. `STICKY_FOOTER`).\n\t */\n\tsticky?: boolean;\n};\n\nexport const TableFooter = React.forwardRef<HTMLTableSectionElement, TableFooterProps>(\n\t({ className, sticky, ...props }, ref) => (\n\t\t<tfoot ref={ref} className={tableFooterStyles({ sticky, className })} {...props} />\n\t)\n);\n\nTableFooter.displayName = \"TableFooter\";\n\nconst TABLE_ROW_ANATOMY = \"[&>*]:border-b [&>*]:border-secondary-border transition-colors\";\n\n/**\n * Строка красится двумя вещами: заливкой и слоями подкраски поверх неё.\n *\n * **Заливка** — `--table-row-bg` и `--table-row-bg-hover`: обычная строка и наведённая.\n * Это всё, что кит знает про цвет строки; ни выделения, ни деактивации у примитива нет —\n * что означает подсветка и когда её включать, знает прикладной код (см. `rowTint.ts`).\n *\n * **Слои подкраски** — `--table-row-tints`, их выставляет потребитель через `tableRowTints()`.\n * Полупрозрачные цвета поверх заливки: альфы складываются и между собой, и с заливкой, поэтому\n * выделенная деактивированная строка показывает обе подсветки, а не одну.\n *\n * Заливка и слои разведены не только по смыслу, но и по свойству: `background-color` против\n * `background-image`. Поэтому `className=\"bg-…\"` вытесняет заливку — и только её: слои\n * останутся на месте и лягут поверх любого цвета, который выбрал потребитель.\n */\nconst tableRowStyles = tv({\n\tbase: [\n\t\tTABLE_ROW_ANATOMY,\n\n\t\t// Заливку читает ровно один класс на состояние — обычный `bg-*` и `hover:bg-*`, —\n\t\t// поэтому любой `bg-*` из `className` вытесняет её штатно, без `!important`\n\t\t// и без повторения модификаторов.\n\t\t\"bg-[color:var(--table-row-bg)] hover:bg-[color:var(--table-row-bg-hover)]\",\n\n\t\t// Обычная строка: подложку даёт `TableBody`, ховер — нейтральная альфа поверх неё\n\t\t// (`alpha/high/97` в макете подписана как состояние строки `hover`).\n\t\t\"[--table-row-bg-hover:hsl(var(--alpha-high-03))] [--table-row-bg:transparent]\",\n\n\t\tTABLE_ROW_TINT_LAYERS\n\t]\n});\n\nexport type TableRowProps = React.HTMLAttributes<HTMLTableRowElement>;\n\n/**\n * Строка таблицы.\n *\n * **Как перекрасить.** Обычными классами: `className=\"bg-… hover:bg-…\"`. Они выигрывают\n * штатно — ни `!important`, ни повторения модификаторов не нужно. Кто хочет сохранить\n * встроенное наведение и подменить только палитру — выставляет переменные `--table-row-bg`\n * и `--table-row-bg-hover`.\n *\n * **Как подсветить.** Слоями: `style={tableRowTints(…)}`, готовые цвета — в `TABLE_ROW_TINT`.\n * Слои складываются друг с другом и ложатся поверх заливки, какой бы она ни была, поэтому\n * подсветка и перекраска не конфликтуют. Подробности — в `rowTint.ts`.\n *\n * **Почему цвет читают отдельные классы, а не состояния.** Раньше `base` красил строку\n * четырьмя классами (`hover:bg-*`, `data-[state=selected]:bg-*`,\n * `data-[state=selected]:hover:bg-*`), и перебить их снаружи было нечем: `tailwind-merge`\n * снимает конфликт только между классами с одинаковым набором модификаторов, поэтому `bg-x`\n * из `className` не вытеснял ни один из них, а `data-[state=selected]:bg-*` вдобавок выигрывал\n * по специфичности — 0,2,0 против 0,1,0. Потребителю приходилось вручную повторять все четыре\n * комбинации модификаторов.\n */\nexport const TableRow = React.forwardRef<HTMLTableRowElement, TableRowProps>(({ className, ...props }, ref) => (\n\t<tr ref={ref} className={tableRowStyles({ className })} {...props} />\n));\n\nTableRow.displayName = \"TableRow\";\n\nconst tableHeadStyles = tv({\n\tbase: \"border-r border-secondary-border px-3 py-2.5 text-left align-middle font-medium text-muted last:border-r-0\",\n\tvariants: {\n\t\tinteractive: {\n\t\t\ttrue: [\n\t\t\t\t\"cursor-pointer p-0 transition-colors\",\n\t\t\t\t\"hover:bg-secondary-bg-hover\",\n\t\t\t\t\"data-[state=open]:bg-primary-bg-hover [&:has([data-state=open])]:bg-primary-bg-hover\"\n\t\t\t]\n\t\t}\n\t}\n});\n\nexport type TableHeadProps = React.ThHTMLAttributes<HTMLTableCellElement> & {\n\t/**\n\t * Вся ячейка — интерактивная зона: меняет фон на наведении и на раскрытом меню,\n\t * и снимает собственный паддинг в пользу растянутого на всю ячейку триггера.\n\t */\n\tinteractive?: boolean;\n};\n\nexport const TableHead = React.forwardRef<HTMLTableCellElement, TableHeadProps>(\n\t({ className, interactive, ...props }, ref) => (\n\t\t<th ref={ref} className={tableHeadStyles({ interactive, className })} {...props} />\n\t)\n);\n\nTableHead.displayName = \"TableHead\";\n\nconst tableCellStyles = tv({\n\tbase: \"border-r border-secondary-border px-3 py-2.5 align-middle last:border-r-0 [&:has([role=checkbox])]:pr-0\"\n});\n\nexport const TableCell = React.forwardRef<HTMLTableCellElement, React.TdHTMLAttributes<HTMLTableCellElement>>(\n\t({ className, ...props }, ref) => <td ref={ref} className={tableCellStyles({ className })} {...props} />\n);\n\nTableCell.displayName = \"TableCell\";\n\nconst tableResizeHandleStyles = tv({\n\tbase: [\n\t\t\"absolute right-0 top-0 z-10 h-full w-2 translate-x-1/2 cursor-col-resize touch-none select-none\",\n\t\t\"after:absolute after:left-1/2 after:top-0 after:h-full after:w-0.5 after:-translate-x-1/2\",\n\t\t\"after:bg-primary-border after:opacity-0 after:transition-opacity hover:after:opacity-100\"\n\t],\n\tvariants: {\n\t\tactive: {\n\t\t\ttrue: \"after:opacity-100\"\n\t\t}\n\t}\n});\n\nexport type TableResizeHandleProps = React.HTMLAttributes<HTMLDivElement> & {\n\t/** Держит индикатор подсвеченным во время drag-сессии, когда курсор уже ушёл с ручки. */\n\tactive?: boolean;\n};\n\n/**\n * Зона захвата для ресайза колонки. Кладётся внутрь `TableHead`, которому нужен `relative`.\n * Саму ширину не считает — работает в паре с `useColumnResize` из `./column-resize`.\n * Работает только если у `TableHead` нет `overflow: hidden`.\n */\nexport const TableResizeHandle = React.forwardRef<HTMLDivElement, TableResizeHandleProps>(\n\t({ className, active, ...props }, ref) => (\n\t\t<div\n\t\t\tref={ref}\n\t\t\trole=\"separator\"\n\t\t\taria-orientation=\"vertical\"\n\t\t\tclassName={tableResizeHandleStyles({ active, className })}\n\t\t\t{...props}\n\t\t/>\n\t)\n);\n\nTableResizeHandle.displayName = \"TableResizeHandle\";\n\nconst tableCaptionStyles = tv({\n\tbase: \"mt-4 text-muted\"\n});\n\nexport const TableCaption = React.forwardRef<HTMLTableCaptionElement, React.HTMLAttributes<HTMLTableCaptionElement>>(\n\t({ className, ...props }, ref) => <caption ref={ref} className={tableCaptionStyles({ className })} {...props} />\n);\n\nTableCaption.displayName = \"TableCaption\";\n","/**\n * Геометрия линий иерархии.\n *\n * Значения связаны между собой — менять их можно только согласованно, поэтому производные\n * выражены формулами, а не числами.\n *\n * ```\n * ┌────────────────────────────────────────┐\n * │   ┌───┐                                │\n * │   │ − │ Родитель                       │\n * │   └─┬─┘                                │\n * ├─────┼──────────────────────────────────┤  ← граница ячеек; линию продлевает TREE_OVERHANG\n * │     │    ┌───┐                         │\n * │     └────┤ + │ Потомок                 │  ← TREE_CONNECTOR_Y (центр первой строки)\n * │          └───┘                         │\n * └────────────────────────────────────────┘\n *\n * ├─────┤           TREE_LINE_OFFSET — до вертикали нулевого уровня\n *       ├──────┤    TREE_INDENT — шаг между вертикалями соседних уровней\n *       ├────┤      TREE_STUB — отвод до левого края раскрывателя\n *            ├───┤  TREE_TOGGLE — сторона квадрата, центр на своей вертикали\n * ```\n *\n * Схема не в масштабе — важны отношения величин, а не пропорции на картинке.\n */\n\n/** Шаг отступа на один уровень вложенности. */\nexport const TREE_INDENT = 18;\n\n/** Отступ от левого края ячейки до вертикали нулевой колонки. */\nexport const TREE_LINE_OFFSET = 13;\n\n/**\n * Сторона квадрата-раскрывателя. Центрируется ровно на вертикали своего уровня.\n *\n * Совпадает с чекбоксом (`size-4`): в одной строке они стоят рядом, и разный размер\n * у двух одинаковых по смыслу квадратов читается как небрежность.\n *\n * Сверху ограничен `2 * TREE_LINE_OFFSET` — иначе `treeCellPaddingLeft(0)` уходит в минус,\n * и раскрыватель корня вылезает за левый край ячейки. Практический потолок ниже:\n * при стороне больше `TREE_INDENT` обнуляется `TREE_STUB` и отвод к узлу исчезает.\n */\nexport const TREE_TOGGLE = 16;\n\n/**\n * Длина горизонтального отвода — от вертикали предка до левого края раскрывателя.\n *\n * Обязана равняться `TREE_INDENT - TREE_TOGGLE / 2`: раскрыватель смещён от своей вертикали\n * влево на половину стороны, и при любом другом значении между отводом и квадратом\n * остаётся щель либо отвод заезжает под квадрат.\n */\nexport const TREE_STUB = TREE_INDENT - TREE_TOGGLE / 2;\n\n/** Вертикальный паддинг ячейки таблицы (`py-2.5`). */\nconst TREE_CELL_PADDING_TOP = 10;\n\n/** Высота строки текста при `text-xs`. */\nconst TREE_TEXT_LINE_HEIGHT = 16;\n\n/**\n * Вертикальная позиция коннектора — центр ПЕРВОЙ строки текста, а не середина ячейки.\n *\n * Это принципиально для строк переменной высоты: при `top: 50%` середина ячейки уезжает вниз\n * от подписи, как только контент переносится, и уголок перестаёт указывать на узел.\n */\nexport const TREE_CONNECTOR_Y = TREE_CELL_PADDING_TOP + TREE_TEXT_LINE_HEIGHT / 2;\n\n/**\n * Насколько линии вылезают за padding-box ячейки сверху и снизу.\n *\n * Нижняя граница ячейки лежит вне её padding-box, и без этого выноса вертикаль обрывалась бы\n * на каждой границе — вместо сплошной линии получался пунктир.\n */\nexport const TREE_OVERHANG = 1;\n\n/**\n * Отступ раскрывателя сверху, при котором его центр совпадает с коннектором.\n *\n * Раньше здесь стоял `mt-0.5`, подобранный под сторону 12px. Теперь это разность:\n * содержимое ячейки начинается на `TREE_CELL_PADDING_TOP`, а центр квадрата должен\n * попасть на `TREE_CONNECTOR_Y`. При достаточно крупном раскрывателе значение\n * становится отрицательным — квадрат заходит в верхний паддинг, и это нормально.\n */\nexport const TREE_TOGGLE_MARGIN_TOP = TREE_CONNECTOR_Y - TREE_CELL_PADDING_TOP - TREE_TOGGLE / 2;\n\n/**\n * Горизонтальная позиция вертикали для колонки отступа.\n *\n * @example\n * treeLineX(0); // 13\n * treeLineX(2); // 49\n */\nexport const treeLineX = (column: number) => TREE_LINE_OFFSET + column * TREE_INDENT;\n\n/**\n * Левый отступ ячейки, при котором раскрыватель встаёт по центру вертикали своего уровня.\n *\n * @example\n * <TableCell style={{ paddingLeft: treeCellPaddingLeft(row.level) }}> // уровень 2 → 41px\n */\nexport const treeCellPaddingLeft = (level: number) => treeLineX(level) - TREE_TOGGLE / 2;\n","import * as React from \"react\";\nimport { tv } from \"tailwind-variants\";\nimport { Minus, Plus } from \"lucide-react\";\nimport { Icon } from \"../../icon/Icon\";\nimport { TableCell } from \"../Table\";\nimport { cn } from \"../../../lib/utils/cn\";\nimport {\n\tTREE_CONNECTOR_Y,\n\tTREE_OVERHANG,\n\tTREE_STUB,\n\tTREE_TOGGLE,\n\tTREE_TOGGLE_MARGIN_TOP,\n\ttreeCellPaddingLeft,\n\ttreeLineX\n} from \"./treeGeometry\";\nimport type { TreeLine, TreeRow } from \"./treeModel\";\n\nconst treeLineStyles = tv({\n\tbase: \"absolute bg-primary-border\",\n\tvariants: {\n\t\taxis: {\n\t\t\tvertical: \"w-px\",\n\t\t\thorizontal: \"h-px\"\n\t\t}\n\t}\n});\n\nexport type TableTreeLinesProps = {\n\t/**\n\t * Модель линий, по одному элементу на колонку отступа. Считается `flattenTree`.\n\t * Длина массива задаёт глубину узла — отдельный проп `level` не нужен.\n\t */\n\tlines: TreeLine[];\n\t/** Спуск от раскрывателя вниз, к первому потомку. Ставится у раскрытых узлов с потомками. */\n\tdescends?: boolean;\n\tclassName?: string;\n};\n\n/**\n * Линии связи для строки дерева или группы.\n *\n * Кладётся в ячейку с `position: relative` и `padding-left: treeCellPaddingLeft(level)` —\n * обычно этим занимается `TableTreeCell`.\n *\n * Все линии — абсолютно позиционированные блоки в 1px, а не рамки контейнеров: уровни\n * вложенности в таблице не образуют вложенных DOM-узлов, поэтому рисовать `border-left`\n * на контейнере уровня попросту негде.\n *\n * Разметка повторяет модель один в один и размечена data-атрибутами: на обёртке лежит вся\n * модель строки (`data-tree-lines=\"pass none end\"`), на каждом элементе — его роль\n * (`data-tree-line`) и номер колонки. Это делает отладку в DevTools прямой: видно не только\n * то, что нарисовано, но и то, что было велено нарисовать.\n *\n * @example\n * <TableCell className=\"relative\" style={{ paddingLeft: treeCellPaddingLeft(row.level) }}>\n *   <TableTreeLines lines={row.lines} descends={row.descends} />\n *   {row.node.name}\n * </TableCell>\n */\nexport const TableTreeLines = ({ lines, descends = false, className }: TableTreeLinesProps) => (\n\t<span\n\t\taria-hidden\n\t\tdata-tree-lines={lines.join(\" \")}\n\t\tdata-tree-level={lines.length}\n\t\tclassName={cn(\"pointer-events-none absolute inset-0\", className)}\n\t>\n\t\t{lines.map((kind, column) => {\n\t\t\tif (kind === \"none\") return null;\n\n\t\t\treturn (\n\t\t\t\t<React.Fragment key={column}>\n\t\t\t\t\t<span\n\t\t\t\t\t\tdata-tree-line={kind}\n\t\t\t\t\t\tdata-tree-column={column}\n\t\t\t\t\t\tclassName={treeLineStyles({ axis: \"vertical\" })}\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tleft: treeLineX(column),\n\t\t\t\t\t\t\ttop: -TREE_OVERHANG,\n\t\t\t\t\t\t\t// `end` — уголок: вертикаль обрывается на коннекторе, иначе протекла бы\n\t\t\t\t\t\t\t// под следующие строки, где ветки этого предка уже нет.\n\t\t\t\t\t\t\t...(kind === \"end\"\n\t\t\t\t\t\t\t\t? { height: TREE_CONNECTOR_Y + TREE_OVERHANG }\n\t\t\t\t\t\t\t\t: { bottom: -TREE_OVERHANG })\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t\t{kind !== \"pass\" && (\n\t\t\t\t\t\t<span\n\t\t\t\t\t\t\tdata-tree-line=\"stub\"\n\t\t\t\t\t\t\tdata-tree-column={column}\n\t\t\t\t\t\t\tclassName={treeLineStyles({ axis: \"horizontal\" })}\n\t\t\t\t\t\t\tstyle={{ left: treeLineX(column), top: TREE_CONNECTOR_Y, width: TREE_STUB }}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\t\t\t\t</React.Fragment>\n\t\t\t);\n\t\t})}\n\n\t\t{descends && (\n\t\t\t<span\n\t\t\t\tdata-tree-line=\"spur\"\n\t\t\t\tdata-tree-column={lines.length}\n\t\t\t\tclassName={treeLineStyles({ axis: \"vertical\" })}\n\t\t\t\tstyle={{\n\t\t\t\t\tleft: treeLineX(lines.length),\n\t\t\t\t\ttop: TREE_CONNECTOR_Y + TREE_TOGGLE / 2,\n\t\t\t\t\tbottom: -TREE_OVERHANG\n\t\t\t\t}}\n\t\t\t/>\n\t\t)}\n\t</span>\n);\n\nTableTreeLines.displayName = \"TableTreeLines\";\n\nconst tableTreeToggleStyles = tv({\n\tbase: [\n\t\t// `z-10` поднимает раскрыватель над линиями, непрозрачный фон разрывает вертикаль под ним.\n\t\t\"relative z-10 flex shrink-0 items-center justify-center\",\n\t\t// Рамка, фон и скругление — как у `Checkbox`: в строке они стоят рядом и должны\n\t\t// читаться одинаково.\n\t\t\"rounded-sm border border-primary-border bg-secondary-bg text-muted\",\n\t\t\"hover:text-primary-fg focus-visible:shadow-focus focus-visible:outline-none\",\n\t\t// Невидимое расширение зоны нажатия до 24px. Именно псевдоэлементом, а не паддингом\n\t\t// или размером: квадрат обязан остаться на сетке линий, а промахиваться по 16px\n\t\t// на строке высотой 36px легко.\n\t\t\"before:absolute before:left-1/2 before:top-1/2 before:size-6 before:-translate-x-1/2 before:-translate-y-1/2\"\n\t]\n});\n\nexport type TableTreeToggleProps = Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, \"children\"> & {\n\texpanded: boolean;\n};\n\n/** Квадрат раскрытия ветки. Иконка и `aria-expanded` следуют за `expanded`. */\nexport const TableTreeToggle = React.forwardRef<HTMLButtonElement, TableTreeToggleProps>(\n\t({ className, expanded, style, ...props }, ref) => (\n\t\t<button\n\t\t\tref={ref}\n\t\t\ttype=\"button\"\n\t\t\taria-expanded={expanded}\n\t\t\tclassName={tableTreeToggleStyles({ className })}\n\t\t\tstyle={{ width: TREE_TOGGLE, height: TREE_TOGGLE, marginTop: TREE_TOGGLE_MARGIN_TOP, ...style }}\n\t\t\t{...props}\n\t\t>\n\t\t\t<Icon icon={expanded ? Minus : Plus} className=\"size-3\" />\n\t\t</button>\n\t)\n);\n\nTableTreeToggle.displayName = \"TableTreeToggle\";\n\n/**\n * Распорка на месте раскрывателя у листьев.\n *\n * Нужна, чтобы подписи узлов с потомками и без выравнивались по одной вертикали.\n * Отдельным компонентом, а не режимом `TableTreeToggle`, чтобы у листа не было\n * ни кнопки, ни `aria-expanded`.\n */\nexport const TableTreeSpacer = ({ className }: { className?: string }) => (\n\t<span aria-hidden className={cn(\"shrink-0\", className)} style={{ width: TREE_TOGGLE }} />\n);\n\nTableTreeSpacer.displayName = \"TableTreeSpacer\";\n\n/**\n * Всё, что ячейка иерархии знает о строке: где она стоит и что у неё с потомками.\n *\n * Структурный тип, а не generic: ячейке безразличен сам узел, поэтому в неё проходит любой\n * `TreeRow<T>` — и любой собранный вручную объект с этими пятью полями. Второе нужно там,\n * где дерева в памяти нет: список пришёл плоским, с готовым `level`, а линии считаются\n * `childTreeLines`.\n *\n * Инвариант: `lines.length === level`. Отступ берётся из `level`, а линии расставляются по\n * индексам `lines` — при расхождении уголок промахнётся мимо отступа.\n */\nexport type TableTreeCellRow = Pick<TreeRow<unknown>, \"level\" | \"lines\" | \"descends\" | \"hasChildren\" | \"isExpanded\">;\n\nexport type TableTreeCellProps = React.TdHTMLAttributes<HTMLTableCellElement> & {\n\t/**\n\t * Положение строки в иерархии: `level` — отступ, `lines` — линии связи, `descends` — спуск\n\t * к первому потомку, `hasChildren` — раскрыватель либо распорка на его месте, `isExpanded` —\n\t * знак в раскрывателе и `aria-expanded`.\n\t */\n\trow: TableTreeCellRow;\n\t/** Клик по раскрывателю. Без него раскрыватель рисуется, но ничего не делает. */\n\tonToggle?: React.MouseEventHandler<HTMLButtonElement>;\n\ttoggleLabel?: string;\n};\n\n/**\n * Ячейка с отступом, линиями и раскрывателем — весь столбец иерархии целиком.\n *\n * Собирает три вещи, которые иначе пришлось бы согласовывать вручную в каждой таблице:\n * `padding-left` по глубине, линии и раскрыватель либо распорку на его месте. Содержимое\n * остаётся за потребителем — внутрь идёт что угодно, от подписи до бейджей.\n *\n * `align-top` не косметика: при переносе текста в соседних колонках содержимое, выровненное\n * по центру, уедет вниз от коннектора, который привязан к первой строке.\n *\n * @example\n * <TableTreeCell row={row} onToggle={() => toggle(row.node.id)}>\n *   {row.node.name}\n * </TableTreeCell>\n */\nexport const TableTreeCell = React.forwardRef<HTMLTableCellElement, TableTreeCellProps>(\n\t({ row, onToggle, toggleLabel, className, style, children, ...props }, ref) => (\n\t\t<TableCell\n\t\t\tref={ref}\n\t\t\tdata-tree-level={row.level}\n\t\t\tclassName={cn(\"relative align-top\", className)}\n\t\t\tstyle={{ paddingLeft: treeCellPaddingLeft(row.level), ...style }}\n\t\t\t{...props}\n\t\t>\n\t\t\t<TableTreeLines lines={row.lines} descends={row.descends} />\n\t\t\t<span className=\"flex items-start gap-1.5\">\n\t\t\t\t{row.hasChildren ? (\n\t\t\t\t\t<TableTreeToggle\n\t\t\t\t\t\texpanded={row.isExpanded}\n\t\t\t\t\t\taria-label={toggleLabel ?? (row.isExpanded ? \"Свернуть\" : \"Развернуть\")}\n\t\t\t\t\t\tonClick={onToggle}\n\t\t\t\t\t/>\n\t\t\t\t) : (\n\t\t\t\t\t<TableTreeSpacer />\n\t\t\t\t)}\n\t\t\t\t{children}\n\t\t\t</span>\n\t\t</TableCell>\n\t)\n);\n\nTableTreeCell.displayName = \"TableTreeCell\";\n","/**\n * Модель строки дерева: что рисовать в каждой колонке отступа.\n *\n * Ровно эти четыре состояния использует классический вывод `tree` и почти все табличные\n * гриды (AG Grid, TanStack Table, rc-tree) — набор проверен и закрывает все случаи:\n *\n * - `pass` — сквозная вертикаль `│`: ветка предка продолжается ниже этой строки;\n * - `branch` — `├`: отвод к узлу, и у узла есть следующие соседи;\n * - `end` — `└`: отвод к последнему соседу, вертикаль обрывается на уголке;\n * - `none` — пусто: ветка предка закончилась выше.\n *\n * Ключевой инвариант: **индекс в массиве равен номеру колонки**, а `lines.length` равно\n * глубине узла. `branch`/`end` встречается только в последней колонке, `pass`/`none` — только\n * в предыдущих. Именно этот инвариант убирает класс ошибок «сдвиг на единицу»: раньше\n * массив хранил флаги предков, и колонка `level - 1` управлялась флагом родителя, хотя\n * должна была — признаком `isLast` самого узла. Сравнивать модель с картинкой теперь можно\n * глазами: `[\"pass\", \"none\", \"end\"]` читается как `│ └`.\n */\nexport type TreeLine = \"none\" | \"pass\" | \"branch\" | \"end\";\n\n/** Строка плоского списка со всем, что нужно для отрисовки узла дерева. */\nexport type TreeRow<T> = {\n\tnode: T;\n\t/** Родительский узел, `null` у корней. */\n\tparent: T | null;\n\t/** Глубина, 0 — корень. Равна `lines.length`. */\n\tlevel: number;\n\t/** Позиция среди соседей. */\n\tindex: number;\n\t/** Последний ли среди соседей — от этого зависит `└` вместо `├`. */\n\tisLast: boolean;\n\thasChildren: boolean;\n\t/** Раскрыт ли узел. У листьев всегда `false`. */\n\tisExpanded: boolean;\n\t/**\n\t * Нужен ли спуск от раскрывателя вниз, к первому потомку.\n\t *\n\t * Вертикаль потомка начинается от его собственной строки, поэтому участок между\n\t * раскрывателем и низом строки родителя рисует именно родитель.\n\t */\n\tdescends: boolean;\n\tlines: TreeLine[];\n\t/** Индексы от корня: `[0, 2, 1]`. Годится как стабильный ключ и как «1.3.2» в интерфейсе. */\n\tpath: number[];\n};\n\nexport type FlattenTreeOptions<T> = {\n\t/**\n\t * Потомки узла. Это функция поиска, а не имя поля: плоскому списку с `parentId` хватит\n\t * индекса `Map<parentId, T[]>`, перекладывать данные в узлы с `children` не нужно.\n\t */\n\tgetChildren: (node: T) => T[] | undefined;\n\t/** Раскрыт ли узел. Свёрнутые не отдают потомков. По умолчанию раскрыты все. */\n\tisExpanded?: (node: T) => boolean;\n};\n\n/**\n * Линии потомка, выведенные из линий родителя.\n *\n * Весь алгоритм — в двух строчках: у предков уголок превращается в продолжение (`branch` →\n * `pass`), а обрыв — в пустоту (`end` → `none`); своя колонка получает уголок по `isLast`.\n * Экспортируется отдельно, чтобы линии можно было считать и без обхода дерева — например,\n * для виртуализованного или подгружаемого списка, где полного дерева в памяти нет.\n *\n * Родительские линии в плоском списке удобно держать бегущим массивом `linesByLevel[level]`:\n * в списке, упорядоченном как при выводе, родитель всегда встречается раньше потомка.\n *\n * @example\n * childTreeLines([\"pass\", \"branch\"], false); // [\"pass\", \"pass\", \"branch\"]\n * childTreeLines([\"pass\", \"branch\"], true); // [\"pass\", \"pass\", \"end\"]\n */\nexport const childTreeLines = (parentLines: TreeLine[], isLast: boolean): TreeLine[] => [\n\t...parentLines.map((line): TreeLine => (line === \"pass\" || line === \"branch\" ? \"pass\" : \"none\")),\n\tisLast ? \"end\" : \"branch\"\n];\n\n/**\n * Разворачивает дерево в плоский список строк и попутно считает модель линий.\n *\n * Порядок — как при отображении: узел, затем его раскрытые потомки.\n *\n * @example\n * const rows = flattenTree(nodes, {\n *   getChildren: (node) => node.children,\n *   isExpanded: (node) => expanded.has(node.id)\n * });\n *\n * rows.map((row) => (\n *   <TableRow key={row.path.join(\".\")}>\n *     <TableTreeCell row={row} onToggle={() => toggle(row.node.id)}>{row.node.name}</TableTreeCell>\n *   </TableRow>\n * ));\n */\nexport function flattenTree<T>(roots: T[], options: FlattenTreeOptions<T>): TreeRow<T>[] {\n\tconst { getChildren, isExpanded = () => true } = options;\n\tconst rows: TreeRow<T>[] = [];\n\n\tconst walk = (nodes: T[], parent: T | null, level: number, parentLines: TreeLine[], parentPath: number[]) => {\n\t\tnodes.forEach((node, index) => {\n\t\t\tconst isLast = index === nodes.length - 1;\n\t\t\tconst children = getChildren(node);\n\t\t\tconst hasChildren = Boolean(children?.length);\n\t\t\tconst expanded = hasChildren && isExpanded(node);\n\t\t\t// У корней нет предка — значит, нет и колонок отступа.\n\t\t\tconst lines = level === 0 ? [] : childTreeLines(parentLines, isLast);\n\t\t\tconst path = [...parentPath, index];\n\n\t\t\trows.push({\n\t\t\t\tnode,\n\t\t\t\tparent,\n\t\t\t\tlevel,\n\t\t\t\tindex,\n\t\t\t\tisLast,\n\t\t\t\thasChildren,\n\t\t\t\tisExpanded: expanded,\n\t\t\t\tdescends: expanded,\n\t\t\t\tlines,\n\t\t\t\tpath\n\t\t\t});\n\n\t\t\tif (expanded) walk(children!, node, level + 1, lines, path);\n\t\t});\n\t};\n\n\twalk(roots, null, 0, [], []);\n\treturn rows;\n}\n"],"names":["tableStyles","tv","Table","React","className","containerClassName","containerRef","props","ref","styles","jsx","tableHeaderStyles","STICKY_HEADER","TableHeader","sticky","tableBodyStyles","TableBody","tableBodyContainerStyles","TableBodyContainer","shadowSize","ScrollShadowContainer","tableFooterStyles","STICKY_FOOTER","TableFooter","TABLE_ROW_ANATOMY","tableRowStyles","TABLE_ROW_TINT_LAYERS","TableRow","tableHeadStyles","TableHead","interactive","tableCellStyles","TableCell","tableResizeHandleStyles","TableResizeHandle","active","tableCaptionStyles","TableCaption","TREE_INDENT","TREE_LINE_OFFSET","TREE_TOGGLE","TREE_STUB","TREE_CELL_PADDING_TOP","TREE_TEXT_LINE_HEIGHT","TREE_CONNECTOR_Y","TREE_OVERHANG","TREE_TOGGLE_MARGIN_TOP","treeLineX","column","treeCellPaddingLeft","level","treeLineStyles","TableTreeLines","lines","descends","jsxs","cn","kind","tableTreeToggleStyles","TableTreeToggle","expanded","style","Icon","Minus","Plus","TableTreeSpacer","TableTreeCell","row","onToggle","toggleLabel","children","childTreeLines","parentLines","isLast","line","flattenTree","roots","options","getChildren","isExpanded","rows","walk","nodes","parent","parentPath","node","index","hasChildren","path"],"mappings":"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"}

package/dist/types/css.d.ts

@@ -1,4 +1,4 @@
-declare module "*.css" {
-	const content: { [className: string]: string };
-	export default content;
-}
+declare module "*.css" {
+	const content: { [className: string]: string };
+	export default content;
+}

package/dist/useBreakpoints-DHvp74UL.js

@@ -0,0 +1,31 @@
+import { useCallback as a, useSyncExternalStore as c } from "react";
+var l = () => !1, u = (s) => {
+  let i = a((t) => {
+    let n = window.matchMedia(s);
+    return n.addEventListener("change", t), () => {
+      n.removeEventListener("change", t);
+    };
+  }, [s]);
+  return c(i, () => window.matchMedia(s).matches, l);
+};
+const m = {
+  sm: "640px",
+  md: "768px",
+  lg: "1024px",
+  xl: "1280px",
+  "2xl": "1536px"
+}, e = (s) => u(`(min-width: ${m[s]})`), d = () => e("sm"), x = () => e("md"), r = () => e("lg"), p = () => e("xl"), f = () => e("2xl"), h = () => !r(), I = (s) => e(s), M = () => {
+  const s = f(), i = p(), t = r(), n = x(), o = d();
+  return s ? "2xl" : i ? "xl" : t ? "lg" : n ? "md" : o ? "sm" : null;
+};
+export {
+  x as a,
+  r as b,
+  p as c,
+  f as d,
+  h as e,
+  I as f,
+  M as g,
+  d as u
+};
+//# sourceMappingURL=useBreakpoints-DHvp74UL.js.map

package/dist/useBreakpoints-DHvp74UL.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useBreakpoints-DHvp74UL.js","sources":["../node_modules/.pnpm/@siberiacancode+reactuse@1.0.17_@types+react@18.3.20_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@siberiacancode/reactuse/dist/esm/hooks/useMediaQuery/useMediaQuery.mjs","../src/hooks/useBreakpoints.ts"],"sourcesContent":["import { useCallback as e, useSyncExternalStore as t } from \"react\";\n//#region src/hooks/useMediaQuery/useMediaQuery.ts\nvar n = () => !1, r = (r) => {\n\tlet i = e((e) => {\n\t\tlet t = window.matchMedia(r);\n\t\treturn t.addEventListener(\"change\", e), () => {\n\t\t\tt.removeEventListener(\"change\", e);\n\t\t};\n\t}, [r]);\n\treturn t(i, () => window.matchMedia(r).matches, n);\n};\n//#endregion\nexport { r as useMediaQuery };\n\n//# sourceMappingURL=useMediaQuery.mjs.map","import { useMediaQuery } from \"@siberiacancode/reactuse\";\n\n// Брейкпоинты Tailwind CSS\nconst breakpoints = {\n\tsm: \"640px\",\n\tmd: \"768px\",\n\tlg: \"1024px\",\n\txl: \"1280px\",\n\t\"2xl\": \"1536px\"\n} as const;\n\ntype Breakpoint = keyof typeof breakpoints;\n\nconst useMinWidth = (bp: Breakpoint) => useMediaQuery(`(min-width: ${breakpoints[bp]})`);\n\n/** min-width: 640px */\nexport const useIsSm = () => useMinWidth(\"sm\");\n/** min-width: 768px */\nexport const useIsMd = () => useMinWidth(\"md\");\n/** min-width: 1024px */\nexport const useIsLg = () => useMinWidth(\"lg\");\n/** min-width: 1280px */\nexport const useIsXl = () => useMinWidth(\"xl\");\n/** min-width: 1536px */\nexport const useIs2Xl = () => useMinWidth(\"2xl\");\n\n/** max-width: 1024px */\nexport const useIsMobile = () => !useIsLg();\n\nexport const useBreakpoint = (breakpoint: Breakpoint) => useMinWidth(breakpoint);\n\nexport const useActiveBreakpoint = (): Breakpoint | null => {\n\tconst is2Xl = useIs2Xl();\n\tconst isXl = useIsXl();\n\tconst isLg = useIsLg();\n\tconst isMd = useIsMd();\n\tconst isSm = useIsSm();\n\n\tif (is2Xl) return \"2xl\";\n\tif (isXl) return \"xl\";\n\tif (isLg) return \"lg\";\n\tif (isMd) return \"md\";\n\tif (isSm) return \"sm\";\n\treturn null;\n};\n"],"names":["n","r","e","t","breakpoints","useMinWidth","bp","useMediaQuery","useIsSm","useIsMd","useIsLg","useIsXl","useIs2Xl","useIsMobile","useBreakpoint","breakpoint","useActiveBreakpoint","is2Xl","isXl","isLg","isMd","isSm"],"mappings":";AAEA,IAAIA,IAAI,MAAM,IAAIC,IAAI,CAACA,MAAM;AAC5B,MAAI,IAAIC,EAAE,CAACA,MAAM;AAChB,QAAIC,IAAI,OAAO,WAAWF,CAAC;AAC3B,WAAOE,EAAE,iBAAiB,UAAUD,CAAC,GAAG,MAAM;AAC7C,MAAAC,EAAE,oBAAoB,UAAUD,CAAC;AAAA,IACjC;AAAA,EACH,GAAI,CAACD,CAAC,CAAC;AACN,SAAOE,EAAE,GAAG,MAAM,OAAO,WAAWF,CAAC,EAAE,SAASD,CAAC;AAClD;ACPA,MAAMI,IAAc;AAAA,EACnB,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,OAAO;AACR,GAIMC,IAAc,CAACC,MAAmBC,EAAc,eAAeH,EAAYE,CAAE,CAAC,GAAG,GAG1EE,IAAU,MAAMH,EAAY,IAAI,GAEhCI,IAAU,MAAMJ,EAAY,IAAI,GAEhCK,IAAU,MAAML,EAAY,IAAI,GAEhCM,IAAU,MAAMN,EAAY,IAAI,GAEhCO,IAAW,MAAMP,EAAY,KAAK,GAGlCQ,IAAc,MAAM,CAACH,EAAQ,GAE7BI,IAAgB,CAACC,MAA2BV,EAAYU,CAAU,GAElEC,IAAsB,MAAyB;AAC3D,QAAMC,IAAQL,EAAS,GACjBM,IAAOP,EAAQ,GACfQ,IAAOT,EAAQ,GACfU,IAAOX,EAAQ,GACfY,IAAOb,EAAQ;AAErB,SAAIS,IAAc,QACdC,IAAa,OACbC,IAAa,OACbC,IAAa,OACbC,IAAa,OACV;AACR;","x_google_ignoreList":[0]}

package/dist/useColumnReorder-BxVZQ_Y5.js

@@ -0,0 +1,119 @@
+import { useState as Y, useRef as p, useMemo as J, useEffect as Q } from "react";
+import { o as V } from "./opaqueCell-SGaiyL54.js";
+const O = "data-column-key", X = 200, Z = 3;
+function rt({
+  columns: T,
+  widths: g,
+  onReorder: R,
+  locked: k
+}) {
+  const [_, x] = Y(null), m = p(null), w = p(void 0), b = p(/* @__PURE__ */ new Map()), h = p(/* @__PURE__ */ new Map()), v = J(() => new Set(k ?? []), [k]), u = p({ columns: T, widths: g, onReorder: R, lockedSet: v });
+  u.current = { columns: T, widths: g, onReorder: R, lockedSet: v }, Q(() => () => clearTimeout(w.current), []);
+  const A = (t, e) => Array.from(t.querySelectorAll(`[${O}="${e}"]`)), P = (t) => {
+    const e = V({ part: t.closest("thead") ? "head" : "cell" }).split(" ").filter((r) => r && !t.classList.contains(r));
+    t.classList.add(...e), b.current.set(t, e);
+  }, W = () => {
+    b.current.forEach((t, e) => e.classList.remove(...t)), b.current.clear();
+  }, K = (t) => {
+    if (h.current.has(t)) return;
+    const { transform: e, transition: r, position: n, zIndex: s, boxShadow: a } = t.style;
+    h.current.set(t, { transform: e, transition: r, position: n, zIndex: s, boxShadow: a });
+  }, U = (t, e) => {
+    t.style.boxShadow = e ? `inset 1px 0 0 0 ${e}` : "";
+  }, y = (t, e, r, n, s) => {
+    const a = r !== 0 || n;
+    A(t, e).forEach((c) => {
+      K(c), c.style.transform = r ? `translateX(${r}px)` : "", c.style.transition = n ? "none" : `transform ${X}ms ease`, c.style.position = a ? "relative" : "", c.style.zIndex = n ? "20" : "", U(c, s);
+    });
+  }, M = () => {
+    h.current.forEach((t, e) => Object.assign(e.style, t)), h.current.clear(), W();
+  }, z = (t, e) => {
+    const { widths: r } = u.current, n = t.offsets[t.from] + r[t.key] / 2 + e;
+    let s = t.from, a = 1 / 0;
+    return t.movable.forEach((c) => {
+      const l = t.offsets[c] + r[u.current.columns[c]] / 2, f = Math.abs(l - n);
+      f < a && (a = f, s = c);
+    }), s;
+  }, B = (t, e, r) => {
+    const n = u.current.widths[t.key], { from: s } = t;
+    return e === s || !t.movable.includes(e) ? 0 : s < r && e > s && e <= r ? -n : s > r && e >= r && e < s ? n : 0;
+  }, C = (t, e) => {
+    const { columns: r } = u.current, n = [...r], s = t.movable.map((c) => r[c]), [a] = s.splice(t.movable.indexOf(t.from), 1);
+    return s.splice(t.movable.indexOf(e), 0, a), t.movable.forEach((c, l) => n[c] = s[l]), n;
+  }, G = (t, e) => {
+    const { widths: r } = u.current, n = C(t, e);
+    return n.slice(0, n.indexOf(t.key)).reduce((s, a) => s + r[a], 0);
+  }, D = (t) => {
+    const e = m.current;
+    if (m.current = null, x(null), !e) return;
+    const { table: r, from: n, to: s } = e;
+    if (!t || n === s) {
+      M();
+      return;
+    }
+    const a = G(e, s) - e.offsets[n];
+    y(r, e.key, a, !1, e.borderColor), clearTimeout(w.current), w.current = setTimeout(() => {
+      M(), u.current.onReorder(C(e, s));
+    }, X);
+  }, H = (t) => (e) => {
+    if (e.button !== 0 || v.has(t)) return;
+    const r = e.currentTarget.closest("table");
+    if (!r) return;
+    e.preventDefault();
+    const { columns: n, widths: s } = u.current, a = [];
+    n.reduce((i, o) => (a.push(i), i + s[o]), 0);
+    const c = n.map((i) => {
+      const o = r.querySelector(`thead [${O}="${i}"]`);
+      if (!o) return;
+      const d = window.getComputedStyle(o);
+      return parseFloat(d.borderRightWidth) > 0 ? d.borderRightColor : void 0;
+    }).find(Boolean), l = n.indexOf(t);
+    m.current = {
+      borderColor: c,
+      key: t,
+      table: r,
+      startX: e.clientX,
+      movable: n.map((i, o) => o).filter((i) => !v.has(n[i])),
+      offsets: a,
+      from: l,
+      to: l,
+      started: !1
+    };
+    const f = (i) => {
+      const o = m.current;
+      if (!o) return;
+      const d = i.clientX - o.startX;
+      if (!o.started) {
+        if (Math.abs(d) < Z) return;
+        o.started = !0, x(o.key), A(o.table, o.key).forEach(P);
+      }
+      const L = z(o, d);
+      o.to = L;
+      const I = C(o, L), N = I[I.indexOf(o.key) + 1];
+      y(o.table, o.key, d, !0, o.borderColor), u.current.columns.forEach(($, q) => {
+        if (q === o.from) return;
+        const j = B(o, q, L), F = $ === N ? o.borderColor : void 0;
+        y(o.table, $, j, !1, F);
+      });
+    }, E = () => {
+      window.removeEventListener("pointermove", f), window.removeEventListener("pointerup", E), window.removeEventListener("pointercancel", S), D(m.current?.started ?? !1);
+    }, S = () => {
+      window.removeEventListener("pointermove", f), window.removeEventListener("pointerup", E), window.removeEventListener("pointercancel", S), D(!1);
+    };
+    window.addEventListener("pointermove", f), window.addEventListener("pointerup", E), window.addEventListener("pointercancel", S);
+  };
+  return {
+    dragKey: _,
+    getGripProps: (t) => ({
+      onPointerDown: H(t),
+      // Без этого браузер на тач-устройстве начнёт прокрутку вместо перетаскивания.
+      style: { touchAction: "none" }
+    }),
+    getColumnProps: (t) => ({ [O]: t })
+  };
+}
+export {
+  O as C,
+  rt as u
+};
+//# sourceMappingURL=useColumnReorder-BxVZQ_Y5.js.map