@ryuzaki13/react-foundation-ui 0.1.0

package/dist/tree-select/stories/TreeMultiSelect.stories.js

@@ -0,0 +1,64 @@
+import { t as e } from "../../chunks/TreeMultiSelect-DRYNx7u5.js";
+import { t } from "../../chunks/treeStoryFixtures-Bhm3Gdky.js";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
+import { useState as i } from "react";
+//#region src/tree-select/stories/TreeMultiSelect.stories.tsx
+function a({ initialValue: a = {}, label: o = "TreeMultiSelect", description: s }) {
+	let [c, l] = i(a);
+	return /* @__PURE__ */ r("div", {
+		style: {
+			display: "grid",
+			gap: 12,
+			maxWidth: 520
+		},
+		children: [/* @__PURE__ */ n(e, {
+			label: o,
+			description: s,
+			nodes: t,
+			value: c,
+			onChange: l
+		}), /* @__PURE__ */ r("div", {
+			style: {
+				fontSize: "var(--font-size-sm)",
+				color: "var(--content-1)"
+			},
+			children: ["Текущее значение: ", JSON.stringify(c)]
+		})]
+	});
+}
+var o = {
+	title: "Shared/UI/TreeMultiSelect",
+	component: e,
+	parameters: {
+		atomicCanvas: !0,
+		layout: "padded"
+	},
+	args: {
+		label: "Выбор узлов",
+		description: "Мультивыбор с канонизацией subtree в ближайший parent.",
+		nodes: t,
+		value: {},
+		onChange: () => {}
+	},
+	argTypes: {
+		nodes: { control: !1 },
+		value: { control: !1 },
+		onChange: { control: !1 }
+	},
+	tags: ["autodocs"]
+}, s = { render: () => /* @__PURE__ */ n(a, { initialValue: { OWNER: ["P0001"] } }) }, c = { render: () => /* @__PURE__ */ n(a, {
+	label: "Компрессия parent",
+	description: "Когда выбран весь subtree, наружу может уйти только родительский узел.",
+	initialValue: { REGION: ["R01"] }
+}) }, l = { render: () => /* @__PURE__ */ n(a, {
+	label: "Смешанный выбор",
+	description: "Пример mixed frontier по соседним уровням.",
+	initialValue: {
+		BRANCH: ["B0101"],
+		OWNER: ["P0004"]
+	}
+}) };
+//#endregion
+export { s as Basic, l as MixedSelection, c as ParentCompression, o as default };
+
+//# sourceMappingURL=TreeMultiSelect.stories.js.map

package/dist/tree-select/stories/TreeMultiSelect.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TreeMultiSelect.stories.js","names":[],"sources":["../../../src/tree-select/stories/TreeMultiSelect.stories.tsx"],"sourcesContent":["import { useState } from \"react\";\n\nimport { TreeMultiSelect } from \"../TreeMultiSelect\";\nimport { TreeMultiSelectValue } from \"../types\";\n\nimport { demoTreeNodes } from \"./treeStoryFixtures\";\n\nimport type { Meta, StoryObj } from \"@storybook/react-vite\";\n\nfunction StatefulTreeMultiSelect({\n\tinitialValue = {},\n\tlabel = \"TreeMultiSelect\",\n\tdescription\n}: {\n\tinitialValue?: TreeMultiSelectValue;\n\tlabel?: string;\n\tdescription?: string;\n}) {\n\tconst [value, setValue] = useState<TreeMultiSelectValue>(initialValue);\n\n\treturn (\n\t\t<div style={{ display: \"grid\", gap: 12, maxWidth: 520 }}>\n\t\t\t<TreeMultiSelect label={label} description={description} nodes={demoTreeNodes} value={value} onChange={setValue} />\n\t\t\t<div style={{ fontSize: \"var(--font-size-sm)\", color: \"var(--content-1)\" }}>Текущее значение: {JSON.stringify(value)}</div>\n\t\t</div>\n\t);\n}\n\nconst meta = {\n\ttitle: \"Shared/UI/TreeMultiSelect\",\n\tcomponent: TreeMultiSelect,\n\tparameters: {\n\t\tatomicCanvas: true,\n\t\tlayout: \"padded\"\n\t},\n\targs: {\n\t\tlabel: \"Выбор узлов\",\n\t\tdescription: \"Мультивыбор с канонизацией subtree в ближайший parent.\",\n\t\tnodes: demoTreeNodes,\n\t\tvalue: {},\n\t\tonChange: () => {}\n\t},\n\targTypes: {\n\t\tnodes: { control: false },\n\t\tvalue: { control: false },\n\t\tonChange: { control: false }\n\t},\n\ttags: [\"autodocs\"]\n} satisfies Meta<typeof TreeMultiSelect>;\n\nexport default meta;\ntype Story = StoryObj<typeof meta>;\n\nexport const Basic: Story = {\n\trender: () => <StatefulTreeMultiSelect initialValue={{ OWNER: [\"P0001\"] }} />\n};\n\nexport const ParentCompression: Story = {\n\trender: () => (\n\t\t<StatefulTreeMultiSelect\n\t\t\tlabel=\"Компрессия parent\"\n\t\t\tdescription=\"Когда выбран весь subtree, наружу может уйти только родительский узел.\"\n\t\t\tinitialValue={{ REGION: [\"R01\"] }}\n\t\t/>\n\t)\n};\n\nexport const MixedSelection: Story = {\n\trender: () => (\n\t\t<StatefulTreeMultiSelect\n\t\t\tlabel=\"Смешанный выбор\"\n\t\t\tdescription=\"Пример mixed frontier по соседним уровням.\"\n\t\t\tinitialValue={{ BRANCH: [\"B0101\"], OWNER: [\"P0004\"] }}\n\t\t/>\n\t)\n};\n"],"mappings":";;;;;AASA,SAAS,EAAwB,EAChC,kBAAe,CAAC,GAChB,WAAQ,mBACR,kBAKE;CACF,IAAM,CAAC,GAAO,KAAY,EAA+B,CAAY;CAErE,OACC,kBAAC,OAAD;EAAK,OAAO;GAAE,SAAS;GAAQ,KAAK;GAAI,UAAU;EAAI;YAAtD,CACC,kBAAC,GAAD;GAAwB;GAAoB;GAAa,OAAO;GAAsB;GAAO,UAAU;EAAW,CAAA,GAClH,kBAAC,OAAD;GAAK,OAAO;IAAE,UAAU;IAAuB,OAAO;GAAmB;aAAzE,CAA4E,sBAAmB,KAAK,UAAU,CAAK,CAAO;IACtH;;AAEP;AAEA,IAAM,IAAO;CACZ,OAAO;CACP,WAAW;CACX,YAAY;EACX,cAAc;EACd,QAAQ;CACT;CACA,MAAM;EACL,OAAO;EACP,aAAa;EACb,OAAO;EACP,OAAO,CAAC;EACR,gBAAgB,CAAC;CAClB;CACA,UAAU;EACT,OAAO,EAAE,SAAS,GAAM;EACxB,OAAO,EAAE,SAAS,GAAM;EACxB,UAAU,EAAE,SAAS,GAAM;CAC5B;CACA,MAAM,CAAC,UAAU;AAClB,GAKa,IAAe,EAC3B,cAAc,kBAAC,GAAD,EAAyB,cAAc,EAAE,OAAO,CAAC,OAAO,EAAE,EAAI,CAAA,EAC7E,GAEa,IAA2B,EACvC,cACC,kBAAC,GAAD;CACC,OAAM;CACN,aAAY;CACZ,cAAc,EAAE,QAAQ,CAAC,KAAK,EAAE;AAChC,CAAA,EAEH,GAEa,IAAwB,EACpC,cACC,kBAAC,GAAD;CACC,OAAM;CACN,aAAY;CACZ,cAAc;EAAE,QAAQ,CAAC,OAAO;EAAG,OAAO,CAAC,OAAO;CAAE;AACpD,CAAA,EAEH"}

package/dist/tree-select/stories/TreeSelect.stories.d.ts

@@ -0,0 +1,35 @@
+import { TreeSelect } from "../TreeSelect";
+import type { StoryObj } from "@storybook/react-vite";
+declare const meta: {
+    title: string;
+    component: typeof TreeSelect;
+    parameters: {
+        atomicCanvas: boolean;
+        layout: string;
+    };
+    args: {
+        label: string;
+        description: string;
+        nodes: import("..").TreeSelectNode[];
+        value: undefined;
+        onChange: () => void;
+    };
+    argTypes: {
+        nodes: {
+            control: false;
+        };
+        value: {
+            control: false;
+        };
+        onChange: {
+            control: false;
+        };
+    };
+    tags: string[];
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Basic: Story;
+export declare const SelectParent: Story;
+export declare const Empty: Story;
+//# sourceMappingURL=TreeSelect.stories.d.ts.map

package/dist/tree-select/stories/TreeSelect.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TreeSelect.stories.d.ts","sourceRoot":"","sources":["../../../src/tree-select/stories/TreeSelect.stories.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAK3C,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAuB5D,QAAA,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;CAoByB,CAAC;AAEpC,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,KAAK,EAAE,KAEnB,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,KAQ1B,CAAC;AAEF,eAAO,MAAM,KAAK,EAAE,KAKnB,CAAC"}

package/dist/tree-select/stories/TreeSelect.stories.js

@@ -0,0 +1,66 @@
+import { t as e } from "../../chunks/TreeSelect-DGLDu6qc.js";
+import { t } from "../../chunks/treeStoryFixtures-Bhm3Gdky.js";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
+import { useState as i } from "react";
+//#region src/tree-select/stories/TreeSelect.stories.tsx
+function a({ initialValue: a, label: o = "TreeSelect", description: s }) {
+	let [c, l] = i(a);
+	return /* @__PURE__ */ r("div", {
+		style: {
+			display: "grid",
+			gap: 12,
+			maxWidth: 520
+		},
+		children: [/* @__PURE__ */ n(e, {
+			label: o,
+			description: s,
+			nodes: t,
+			value: c,
+			onChange: l
+		}), /* @__PURE__ */ r("div", {
+			style: {
+				fontSize: "var(--font-size-sm)",
+				color: "var(--content-1)"
+			},
+			children: ["Текущее значение: ", c ? `${c.codeKey}=${c.value}` : "пусто"]
+		})]
+	});
+}
+var o = {
+	title: "Shared/UI/TreeSelect",
+	component: e,
+	parameters: {
+		atomicCanvas: !0,
+		layout: "padded"
+	},
+	args: {
+		label: "Выбор узла",
+		description: "Single-select поверх дерева. Можно выбрать любой узел.",
+		nodes: t,
+		value: void 0,
+		onChange: () => {}
+	},
+	argTypes: {
+		nodes: { control: !1 },
+		value: { control: !1 },
+		onChange: { control: !1 }
+	},
+	tags: ["autodocs"]
+}, s = { render: () => /* @__PURE__ */ n(a, { initialValue: {
+	codeKey: "BRANCH",
+	value: "B0101"
+} }) }, c = { render: () => /* @__PURE__ */ n(a, {
+	label: "Выбор родителя",
+	description: "Проверка single-select сценария, когда выбирается не leaf, а промежуточный узел.",
+	initialValue: {
+		codeKey: "REGION",
+		value: "R01"
+	}
+}) }, l = { args: {
+	nodes: [],
+	description: "Состояние без доступных узлов."
+} };
+//#endregion
+export { s as Basic, l as Empty, c as SelectParent, o as default };
+
+//# sourceMappingURL=TreeSelect.stories.js.map

package/dist/tree-select/stories/TreeSelect.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TreeSelect.stories.js","names":[],"sources":["../../../src/tree-select/stories/TreeSelect.stories.tsx"],"sourcesContent":["import { useState } from \"react\";\n\nimport { TreeSelect } from \"../TreeSelect\";\nimport { TreeSelectValue } from \"../types\";\n\nimport { demoTreeNodes } from \"./treeStoryFixtures\";\n\nimport type { Meta, StoryObj } from \"@storybook/react-vite\";\n\nfunction StatefulTreeSelect({\n\tinitialValue,\n\tlabel = \"TreeSelect\",\n\tdescription\n}: {\n\tinitialValue?: TreeSelectValue;\n\tlabel?: string;\n\tdescription?: string;\n}) {\n\tconst [value, setValue] = useState<TreeSelectValue | undefined>(initialValue);\n\n\treturn (\n\t\t<div style={{ display: \"grid\", gap: 12, maxWidth: 520 }}>\n\t\t\t<TreeSelect label={label} description={description} nodes={demoTreeNodes} value={value} onChange={setValue} />\n\t\t\t<div style={{ fontSize: \"var(--font-size-sm)\", color: \"var(--content-1)\" }}>\n\t\t\t\tТекущее значение: {value ? `${value.codeKey}=${value.value}` : \"пусто\"}\n\t\t\t</div>\n\t\t</div>\n\t);\n}\n\nconst meta = {\n\ttitle: \"Shared/UI/TreeSelect\",\n\tcomponent: TreeSelect,\n\tparameters: {\n\t\tatomicCanvas: true,\n\t\tlayout: \"padded\"\n\t},\n\targs: {\n\t\tlabel: \"Выбор узла\",\n\t\tdescription: \"Single-select поверх дерева. Можно выбрать любой узел.\",\n\t\tnodes: demoTreeNodes,\n\t\tvalue: undefined,\n\t\tonChange: () => {}\n\t},\n\targTypes: {\n\t\tnodes: { control: false },\n\t\tvalue: { control: false },\n\t\tonChange: { control: false }\n\t},\n\ttags: [\"autodocs\"]\n} satisfies Meta<typeof TreeSelect>;\n\nexport default meta;\ntype Story = StoryObj<typeof meta>;\n\nexport const Basic: Story = {\n\trender: () => <StatefulTreeSelect initialValue={{ codeKey: \"BRANCH\", value: \"B0101\" }} />\n};\n\nexport const SelectParent: Story = {\n\trender: () => (\n\t\t<StatefulTreeSelect\n\t\t\tlabel=\"Выбор родителя\"\n\t\t\tdescription=\"Проверка single-select сценария, когда выбирается не leaf, а промежуточный узел.\"\n\t\t\tinitialValue={{ codeKey: \"REGION\", value: \"R01\" }}\n\t\t/>\n\t)\n};\n\nexport const Empty: Story = {\n\targs: {\n\t\tnodes: [],\n\t\tdescription: \"Состояние без доступных узлов.\"\n\t}\n};\n"],"mappings":";;;;;AASA,SAAS,EAAmB,EAC3B,iBACA,WAAQ,cACR,kBAKE;CACF,IAAM,CAAC,GAAO,KAAY,EAAsC,CAAY;CAE5E,OACC,kBAAC,OAAD;EAAK,OAAO;GAAE,SAAS;GAAQ,KAAK;GAAI,UAAU;EAAI;YAAtD,CACC,kBAAC,GAAD;GAAmB;GAAoB;GAAa,OAAO;GAAsB;GAAO,UAAU;EAAW,CAAA,GAC7G,kBAAC,OAAD;GAAK,OAAO;IAAE,UAAU;IAAuB,OAAO;GAAmB;aAAzE,CAA4E,sBACxD,IAAQ,GAAG,EAAM,QAAQ,GAAG,EAAM,UAAU,OAC3D;IACD;;AAEP;AAEA,IAAM,IAAO;CACZ,OAAO;CACP,WAAW;CACX,YAAY;EACX,cAAc;EACd,QAAQ;CACT;CACA,MAAM;EACL,OAAO;EACP,aAAa;EACb,OAAO;EACP,OAAO,KAAA;EACP,gBAAgB,CAAC;CAClB;CACA,UAAU;EACT,OAAO,EAAE,SAAS,GAAM;EACxB,OAAO,EAAE,SAAS,GAAM;EACxB,UAAU,EAAE,SAAS,GAAM;CAC5B;CACA,MAAM,CAAC,UAAU;AAClB,GAKa,IAAe,EAC3B,cAAc,kBAAC,GAAD,EAAoB,cAAc;CAAE,SAAS;CAAU,OAAO;AAAQ,EAAI,CAAA,EACzF,GAEa,IAAsB,EAClC,cACC,kBAAC,GAAD;CACC,OAAM;CACN,aAAY;CACZ,cAAc;EAAE,SAAS;EAAU,OAAO;CAAM;AAChD,CAAA,EAEH,GAEa,IAAe,EAC3B,MAAM;CACL,OAAO,CAAC;CACR,aAAa;AACd,EACD"}

package/dist/tree-select/stories/treeStoryFixtures.d.ts

@@ -0,0 +1,3 @@
+import type { TreeSelectNode } from "../types";
+export declare const demoTreeNodes: TreeSelectNode[];
+//# sourceMappingURL=treeStoryFixtures.d.ts.map

package/dist/tree-select/stories/treeStoryFixtures.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"treeStoryFixtures.d.ts","sourceRoot":"","sources":["../../../src/tree-select/stories/treeStoryFixtures.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC;AAE/C,eAAO,MAAM,aAAa,EAAE,cAAc,EAmIzC,CAAC"}

package/dist/tree-select/types.d.ts

@@ -0,0 +1,16 @@
+export type TreeSelectValue = {
+    codeKey: string;
+    value: string;
+};
+export type TreeMultiSelectValue = Record<string, string[]>;
+export type TreeSelectNode = {
+    id: string;
+    codeKey: string;
+    value: string;
+    label: string;
+    code?: string;
+    searchText: string;
+    children?: TreeSelectNode[];
+    disabled?: boolean;
+};
+//# sourceMappingURL=types.d.ts.map

package/dist/tree-select/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/tree-select/types.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,eAAe,GAAG;IAC7B,OAAO,EAAE,MAAM,CAAC;IAChB,KAAK,EAAE,MAAM,CAAC;CACd,CAAC;AAEF,MAAM,MAAM,oBAAoB,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,EAAE,CAAC,CAAC;AAE5D,MAAM,MAAM,cAAc,GAAG;IAC5B,EAAE,EAAE,MAAM,CAAC;IACX,OAAO,EAAE,MAAM,CAAC;IAChB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,UAAU,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,cAAc,EAAE,CAAC;IAC5B,QAAQ,CAAC,EAAE,OAAO,CAAC;CACnB,CAAC"}

package/dist/tree-table/TreeTable.d.ts

@@ -0,0 +1,174 @@
+import { type VisibilityState } from "@tanstack/react-table";
+import { TableColumnDef, type TableColumnOrderState, type TableColumnSizingState, TableSelectionMode } from "@ryuzaki13/react-foundation-lib/table";
+import { type TreeTableFlatHierarchy, type TreeTableRowNode } from "@ryuzaki13/react-foundation-lib/tree-table";
+import { type BaseTableProps, type TableColumnPinningState } from "../base-table";
+/**
+ * Внутренний тип строки TreeTable после преобразования в иерархию.
+ */
+type TreeTableRuntimeRow<TData extends object> = TreeTableRowNode<TData>;
+/**
+ * Пропсы компонента TreeTable.
+ *
+ * Компонент принимает плоский OData-список и сам строит иерархию,
+ * оставляя управление раскрытием и выбором во внутреннем состоянии.
+ */
+export interface TreeTableProps<TData extends object> {
+    /**
+     * Необязательный заголовок над таблицей.
+     */
+    title?: string;
+    /**
+     * Признак первичной загрузки.
+     */
+    isLoading?: boolean;
+    /**
+     * Признак фоновой догрузки или обновления данных.
+     */
+    isFetching?: boolean;
+    /**
+     * Плоский источник строк.
+     */
+    data: readonly TData[] | undefined | null;
+    /**
+     * Описание колонок через исходный тип строки.
+     */
+    columns: readonly TableColumnDef<TData>[];
+    /**
+     * Правила восстановления дерева из плоского списка.
+     */
+    hierarchy: TreeTableFlatHierarchy<TData>;
+    /**
+     * Режим выбора строк.
+     */
+    selectionMode?: TableSelectionMode;
+    /**
+     * Если `true`, при первом появлении данных раскрывает корневой уровень.
+     */
+    expandFirstLevel?: boolean;
+    /**
+     * Дополнительные строки, которые должны быть раскрыты при первой инициализации.
+     */
+    defaultExpandedRowIds?: readonly string[];
+    /**
+     * Идентификатор колонки, в которой нужно рисовать tree-toggle и отступы.
+     *
+     * Если не указан, используется первая видимая колонка.
+     */
+    treeColumnId?: string;
+    /**
+     * Отступ на один уровень вложенности.
+     *
+     * Числовое значение трактуется как `em`.
+     */
+    indentSize?: string | number;
+    /**
+     * Дополнительный CSS-класс корневого контейнера.
+     */
+    className?: string;
+    /**
+     * Дополнительный CSS-класс тега `table`.
+     */
+    tableClassName?: string;
+    /**
+     * Внешнее controlled-состояние видимости колонок.
+     */
+    columnVisibility?: VisibilityState;
+    /**
+     * Стартовое uncontrolled-состояние видимости колонок.
+     */
+    defaultColumnVisibility?: VisibilityState;
+    /**
+     * Внешнее controlled-состояние порядка колонок.
+     */
+    columnOrder?: readonly string[];
+    /**
+     * Стартовое uncontrolled-состояние порядка колонок.
+     */
+    defaultColumnOrder?: readonly string[];
+    /**
+     * Внешнее controlled-состояние ширин колонок в px.
+     */
+    columnSizing?: TableColumnSizingState;
+    /**
+     * Стартовое uncontrolled-состояние ширин колонок в px.
+     */
+    defaultColumnSizing?: TableColumnSizingState;
+    /**
+     * Внешнее controlled-состояние left-pinning для колонок.
+     */
+    columnPinning?: TableColumnPinningState;
+    /**
+     * Стартовое uncontrolled-состояние left-pinning для колонок.
+     */
+    defaultColumnPinning?: TableColumnPinningState;
+    /**
+     * Включает изменение ширины колонок через header-handle.
+     */
+    enableColumnResizing?: boolean;
+    /**
+     * Включает изменение порядка колонок через drag&drop заголовков.
+     */
+    enableColumnReordering?: boolean;
+    /**
+     * Минимальная ширина колонки при resize в px.
+     */
+    columnResizeMinWidth?: number;
+    /**
+     * Вызывается после изменения видимости колонок.
+     */
+    onColumnVisibilityChange?: (state: VisibilityState) => void;
+    /**
+     * Вызывается после изменения порядка колонок.
+     */
+    onColumnOrderChange?: (state: TableColumnOrderState) => void;
+    /**
+     * Вызывается после изменения ширины колонок.
+     */
+    onColumnSizingChange?: (state: TableColumnSizingState) => void;
+    /**
+     * Вызывается после изменения left-pinning state.
+     */
+    onColumnPinningChange?: (state: TableColumnPinningState) => void;
+    /**
+     * Вызывается при активации строки кликом или клавиатурой.
+     */
+    onRowClick?: (row: TData) => void;
+    /**
+     * Вызывается после изменения выбранных строк.
+     */
+    onRowSelectionChange?: (rows: TData[]) => void;
+    /**
+     * Вызывается после изменения раскрытых узлов.
+     */
+    onExpandedRowIdsChange?: (rowIds: string[]) => void;
+    /**
+     * Вызывается при достижении конца таблицы внутри scroll-контейнера.
+     */
+    onReachEnd?: () => void;
+    /**
+     * Позволяет запретить выбор отдельных строк.
+     */
+    getRowCanSelect?: (row: TData) => boolean;
+    /**
+     * Позволяет добавить CSS-класс для конкретной строки.
+     */
+    getRowClassName?: (row: TData) => string | undefined;
+    /**
+     * Контекстное меню заголовка колонки. Получает runtime-строки дерева,
+     * потому что BaseTable работает уже после сборки flat hierarchy.
+     */
+    renderHeaderContextMenu?: BaseTableProps<TreeTableRuntimeRow<TData>>["renderHeaderContextMenu"];
+    /**
+     * Точка расширения содержимого ячейки после общего форматирования.
+     *
+     * Для tree-column в `defaultContent` передается только содержимое ячейки:
+     * TreeTable сам добавит expander и отступ после выполнения слота.
+     */
+    renderCellContent?: BaseTableProps<TreeTableRuntimeRow<TData>>["renderCellContent"];
+}
+/**
+ * Древовидная таблица на базе TanStack Table для плоских OData-данных.
+ */
+export declare function TreeTable<TData extends object>({ title, isLoading, isFetching, data, columns, hierarchy, selectionMode, expandFirstLevel, defaultExpandedRowIds, treeColumnId, indentSize, className, tableClassName, columnVisibility, defaultColumnVisibility, columnOrder, defaultColumnOrder, columnSizing, defaultColumnSizing, columnPinning, defaultColumnPinning, enableColumnResizing, enableColumnReordering, columnResizeMinWidth, onColumnVisibilityChange, onColumnOrderChange, onColumnSizingChange, onColumnPinningChange, onRowClick, onRowSelectionChange, onExpandedRowIdsChange, onReachEnd, getRowCanSelect, getRowClassName, renderHeaderContextMenu, renderCellContent }: TreeTableProps<TData>): import("react").JSX.Element;
+export {};
+//# sourceMappingURL=TreeTable.d.ts.map

package/dist/tree-table/TreeTable.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TreeTable.d.ts","sourceRoot":"","sources":["../../src/tree-table/TreeTable.tsx"],"names":[],"mappings":"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"}

package/dist/tree-table/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./TreeTable";
+//# sourceMappingURL=index.d.ts.map

package/dist/tree-table/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/tree-table/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC"}

package/dist/tree-table/index.js

@@ -0,0 +1,220 @@
+import { a as e, c as t, d as n, i as r, m as i, n as ee, o as te, r as ne, s as re, t as ie } from "../chunks/base-table-DVje02Zi.js";
+import { ChevronDownIcon as a, ChevronRightIcon as o } from "lucide-react";
+import { cn as ae } from "@ryuzaki13/react-foundation-lib/utils";
+import { jsx as s, jsxs as c } from "react/jsx-runtime";
+import { useEffect as l, useEffectEvent as u, useMemo as d, useRef as f, useState as oe } from "react";
+import { formatPipelineDisplayValue as se } from "@ryuzaki13/react-foundation-lib/formatters";
+import { resolveTableLength as p, useTableRowSelection as ce } from "@ryuzaki13/react-foundation-lib/table";
+import { getCoreRowModel as m, getExpandedRowModel as le, useReactTable as ue } from "@tanstack/react-table";
+import { buildTreeTableRows as de } from "@ryuzaki13/react-foundation-lib/tree-table";
+var h = {
+	treeColumnCell: "jOS9rT",
+	selectedIndicatorCell: "zHOAf7",
+	treeCell: "j48cXg",
+	treeCellContent: "mf4-Kr",
+	expanderButton: "p8pb0F",
+	expanderSpacer: "KIudLf",
+	sentinel: "bJsPGU"
+};
+//#endregion
+//#region src/tree-table/TreeTable.tsx
+function g(e) {
+	return Object.fromEntries(e.map((e) => [e, !0]));
+}
+function _(e) {
+	return typeof e == "boolean" ? [] : Object.keys(e).filter((t) => e[t]);
+}
+function v(e, t) {
+	return t.get(e.id) ?? e.original;
+}
+function fe(e, t, n, r) {
+	return e.cell.column.id === n ? /* @__PURE__ */ c("div", {
+		className: h.treeCell,
+		style: { paddingInlineStart: `calc(${e.row.depth} * ${p(r) ?? "0em"})` },
+		children: [e.row.getCanExpand() ? /* @__PURE__ */ s("button", {
+			type: "button",
+			className: h.expanderButton,
+			"aria-label": e.row.getIsExpanded() ? "Свернуть строку" : "Развернуть строку",
+			"data-tree-table-interactive": "true",
+			"data-ui": "tree-table-expander",
+			"data-action": e.row.getIsExpanded() ? "collapse-tree-table-row" : "expand-tree-table-row",
+			onClick: (t) => {
+				t.stopPropagation(), e.row.toggleExpanded();
+			},
+			children: e.row.getIsExpanded() ? /* @__PURE__ */ s(a, { size: 16 }) : /* @__PURE__ */ s(o, { size: 16 })
+		}) : /* @__PURE__ */ s("span", {
+			className: h.expanderSpacer,
+			"aria-hidden": "true"
+		}), /* @__PURE__ */ s("div", {
+			className: h.treeCellContent,
+			children: t
+		})]
+	}) : t;
+}
+function y({ title: a, isLoading: o, isFetching: c, data: p, columns: y, hierarchy: b, selectionMode: x = "none", expandFirstLevel: S = !1, defaultExpandedRowIds: C, treeColumnId: pe, indentSize: me = 1, className: he, tableClassName: ge, columnVisibility: _e, defaultColumnVisibility: ve, columnOrder: ye, defaultColumnOrder: be, columnSizing: xe, defaultColumnSizing: Se, columnPinning: w, defaultColumnPinning: T, enableColumnResizing: E = !1, enableColumnReordering: D = !1, columnResizeMinWidth: O, onColumnVisibilityChange: k, onColumnOrderChange: A, onColumnSizingChange: j, onColumnPinningChange: Ce, onRowClick: M, onRowSelectionChange: we, onExpandedRowIdsChange: Te, onReachEnd: N, getRowCanSelect: P, getRowClassName: Ee, renderHeaderContextMenu: De, renderCellContent: F }) {
+	let I = d(() => de(p ?? [], b), [p, b]), L = d(() => t(y), [y]), R = d(() => {
+		let e = new Set(C ?? []);
+		if (S) for (let t of I.rootRowIds) e.add(t);
+		return Array.from(e);
+	}, [
+		C,
+		S,
+		I.rootRowIds
+	]), [z, B] = oe({}), V = f(!1), H = f(null), U = f(null), { rowSelection: Oe, activateRowSelection: ke } = ce({
+		availableRowIds: I.allRowIds,
+		rowById: I.rowById,
+		selectionMode: x,
+		onRowSelectionChange: we
+	}), { columnVisibility: W, onColumnVisibilityChange: Ae } = ne({
+		columnVisibility: _e,
+		defaultColumnVisibility: ve,
+		onColumnVisibilityChange: k
+	}), { columnOrder: G, onColumnOrderChange: je } = te({
+		columnOrder: ye,
+		defaultColumnOrder: be,
+		onColumnOrderChange: A
+	}), { columnSizing: K, onColumnSizingChange: Me } = r({
+		columnSizing: xe,
+		defaultColumnSizing: Se,
+		columnResizeMinWidth: O,
+		onColumnSizingChange: j
+	}), { columnPinning: q, onColumnPinningChange: J } = e({
+		columnPinning: w,
+		defaultColumnPinning: T,
+		onColumnPinningChange: Ce
+	}), Y = d(() => ({
+		columnOrder: G,
+		columnPinning: q,
+		columnSizing: K,
+		columnVisibility: W
+	}), [
+		G,
+		q,
+		K,
+		W
+	]), Ne = u((e, t) => {
+		if (e.length === 0) {
+			V.current = !1, B({});
+			return;
+		}
+		let n = new Set(e);
+		B((e) => {
+			let r = _(e).filter((e) => n.has(e));
+			return V.current ? g(r) : (V.current = !0, g(Array.from(/* @__PURE__ */ new Set([...r, ...t.filter((e) => n.has(e))]))));
+		});
+	}), Pe = u((e) => {
+		Te?.(_(e));
+	}), Fe = u(() => {
+		N?.();
+	});
+	l(() => {
+		Ne(I.allRowIds, R);
+	}, [R, I.allRowIds]), l(() => {
+		Pe(z);
+	}, [z]), l(() => {
+		if (!N || !H.current || !U.current || o) return;
+		let e = new IntersectionObserver((e) => {
+			e[0]?.isIntersecting && Fe();
+		}, {
+			root: H.current,
+			threshold: .1
+		});
+		return e.observe(U.current), () => e.disconnect();
+	}, [
+		o,
+		N,
+		I.rows.length
+	]);
+	let X = ue({
+		data: I.rows,
+		columns: y,
+		state: {
+			columnOrder: G,
+			columnPinning: q,
+			columnSizing: K,
+			columnVisibility: W,
+			expanded: z,
+			rowSelection: Oe
+		},
+		getRowId: (e) => b.getRowId(e),
+		getSubRows: (e) => e.children,
+		getCoreRowModel: m(),
+		getExpandedRowModel: le(),
+		onColumnOrderChange: je,
+		onColumnPinningChange: J,
+		onColumnSizingChange: Me,
+		onColumnVisibilityChange: Ae,
+		onExpandedChange: B,
+		enableMultiRowSelection: x === "multi",
+		enableRowSelection: (e) => {
+			if (x === "none") return !1;
+			let t = v(e, I.rowById);
+			return P ? P(t) : !0;
+		}
+	}), Z = i(X, Y), Q = pe ?? Z[0]?.id, $ = X.getRowModel().rows, Ie = d(() => re({
+		rows: $,
+		columns: Z,
+		resolveRowBoundaryKey: (e) => e.depth,
+		excludeColumnIds: Q ? /* @__PURE__ */ new Set([Q]) : void 0
+	}), [
+		$,
+		Z,
+		Q
+	]);
+	return /* @__PURE__ */ s(ee, {
+		table: X,
+		columnState: Y,
+		title: a,
+		isLoading: o,
+		isFetching: c,
+		className: he,
+		tableClassName: ge,
+		selectionMode: x,
+		scrollableRef: H,
+		interactiveElementSelector: "[data-tree-table-interactive=\"true\"]",
+		onActivateRow: x !== "none" || M ? (e) => {
+			let t = v(e, I.rowById);
+			ke(e.id, e.getCanSelect()), M?.(t);
+		} : void 0,
+		isRowInteractive: (e) => !!(M || x !== "none" && e.getCanSelect()),
+		getRowClassName: (e) => {
+			let t = v(e, I.rowById);
+			return Ee?.(t);
+		},
+		getCellClassName: ({ row: e, cell: t }) => ae(t.column.id === Q && h.treeColumnCell, t.column.id === Q && e.getIsSelected() && h.selectedIndicatorCell),
+		getCellLayout: ({ cell: e }) => Ie.get(e.id),
+		renderHeaderContextMenu: De,
+		enableColumnResizing: E,
+		enableColumnReordering: D,
+		columnResizeMinWidth: O,
+		renderCellContent: (e) => {
+			let t = v(e.row, I.rowById), r = se({
+				field: L.runtimeByColumnId[e.cell.column.id],
+				rawValue: e.cell.getValue(),
+				rowData: t,
+				rowKind: "tree"
+			}), i = n({
+				columnId: e.cell.column.id,
+				runtimeByColumnId: L.runtimeByColumnId,
+				customCellColumnIds: L.customCellColumnIds
+			}) ? /* @__PURE__ */ s(ie, {
+				displayValue: r,
+				align: e.columnMeta?.align
+			}) : e.defaultContent;
+			return fe(e, F ? F({
+				...e,
+				defaultContent: i,
+				displayValue: r
+			}) : i, Q, me);
+		},
+		afterTableContent: N ? /* @__PURE__ */ s("div", {
+			ref: U,
+			className: h.sentinel,
+			"aria-hidden": "true"
+		}) : null
+	});
+}
+//#endregion
+export { y as TreeTable };
+
+//# sourceMappingURL=index.js.map