@ryuzaki13/react-foundation-ui 1.0.7 → 1.0.11

package/dist/switch/index.js

@@ -1,2 +1,81 @@
-import { t as e } from "../chunks/Switch-B57Qmy1z.js";
-export { e as Switch };
+import { t as e } from "../chunks/ui.module-BisoTevy.js";
+import { useId as t } from "react";
+import { cn as n } from "@ryuzaki13/react-foundation-lib/utils";
+import { BanIcon as r, CheckCircle2Icon as i } from "lucide-react";
+import { Fragment as a, jsx as o, jsxs as s } from "react/jsx-runtime";
+var c = {
+	switchWrapper: "Or5LYA",
+	switch: "qge3io",
+	iconWrapper: "w0AMfA",
+	auto: "P1x4lq",
+	checked: "-ZVOZo"
+};
+//#endregion
+//#region src/switch/Switch.tsx
+function l(l) {
+	let { label: u, description: d, disabled: f, checkedIcon: p = /* @__PURE__ */ o(i, {}), uncheckedIcon: m = /* @__PURE__ */ o(r, {}), className: h, type: g, id: _, size: v, placeholder: y, onChange: b, value: x, triState: S, ...C } = l, w = t(), T = _ ?? w, E = d ? `${T}-description` : void 0, D = u ? `${T}-label` : void 0, O = () => {
+		if (!l.triState) {
+			l.onChange(!l.value);
+			return;
+		}
+		if (l.value === void 0) {
+			l.onChange(!0);
+			return;
+		}
+		if (l.value === !0) {
+			l.onChange(!1);
+			return;
+		}
+		l.value === !1 && l.onChange(void 0);
+	}, k = typeof l.value == "boolean" ? l.value : !1, A = l.triState && typeof l.value != "boolean", j = C["aria-label"] ?? (u ? void 0 : "Переключатель");
+	return /* @__PURE__ */ s("div", {
+		className: n(e.uiElement, f && e.disabled),
+		"aria-disabled": f || void 0,
+		children: [
+			u && /* @__PURE__ */ s("div", {
+				id: D,
+				className: e.uiLabel,
+				children: [u, ":"]
+			}),
+			d && /* @__PURE__ */ o("p", {
+				id: E,
+				className: e.uiDescription,
+				children: d
+			}),
+			/* @__PURE__ */ o("button", {
+				...C,
+				id: T,
+				type: g ?? "button",
+				role: "switch",
+				disabled: f,
+				"aria-checked": k,
+				"aria-describedby": E,
+				"aria-labelledby": D,
+				"aria-label": j,
+				"aria-disabled": f,
+				"data-ui": "switch",
+				"data-action": "toggle-switch",
+				onClick: O,
+				className: n(e.uiInputControl, c.switchWrapper, h),
+				children: /* @__PURE__ */ o("div", {
+					className: c.switch,
+					"data-disabled": f || void 0,
+					children: A ? /* @__PURE__ */ o("div", {
+						className: n(c.iconWrapper, c.auto, c.checked),
+						children: "Auto"
+					}) : /* @__PURE__ */ s(a, { children: [/* @__PURE__ */ o("div", {
+						className: n(c.iconWrapper, !l.value && c.checked),
+						children: m
+					}), /* @__PURE__ */ o("div", {
+						className: n(c.iconWrapper, l.value && c.checked),
+						children: p
+					})] })
+				})
+			})
+		]
+	});
+}
+//#endregion
+export { l as Switch };
+
+//# sourceMappingURL=index.js.map

package/dist/switch/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../src/switch/Switch.module.scss","../../src/switch/Switch.tsx"],"sourcesContent":[".switchWrapper {\n\t--size: calc(var(--control-height) - calc(var(--border-width) * 4));\n\n\tdisplay: block;\n\tpadding: 0 var(--border-width);\n}\n\n.switch {\n\twidth: calc(var(--control-height) * 2);\n\tdisplay: flex;\n\tjustify-content: space-between;\n\n\t&[data-disabled] {\n\t\tsvg {\n\t\t\tcolor: var(--content-2);\n\t\t}\n\t}\n}\n\n.iconWrapper {\n\tborder-radius: var(--radius-xs);\n\twidth: var(--size);\n\theight: var(--size);\n\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\n\topacity: 0.25;\n\n\tsvg {\n\t\tdisplay: block;\n\t\tcolor: var(--content-0);\n\t}\n\n\t&.auto {\n\t\twidth: 100%;\n\t\tflex: 1 1 100%;\n\t}\n\n\t&.checked {\n\t\tbackground-color: var(--surface-2);\n\t\topacity: 1;\n\t}\n}\n","import React, { useId } from \"react\";\n\nimport { cn } from \"@ryuzaki13/react-foundation-lib/utils\";\nimport { BanIcon, CheckCircle2Icon } from \"lucide-react\";\n\nimport { UiBaseProps } from \"../types\";\nimport uiStyles from \"../ui.module.scss\";\n\nimport styles from \"./Switch.module.scss\";\n\ntype BaseSwitchProps = {\n\tcheckedIcon?: React.ReactNode;\n\tuncheckedIcon?: React.ReactNode;\n};\n\ntype BiStateSwitchProps = BaseSwitchProps &\n\tUiBaseProps<boolean> & {\n\t\ttriState?: false;\n\t};\n\ntype TriStateSwitchProps = BaseSwitchProps &\n\tUiBaseProps<boolean | undefined> & {\n\t\ttriState: true;\n\t};\n\ntype SwitchProps = (TriStateSwitchProps | BiStateSwitchProps) &\n\tOmit<React.ButtonHTMLAttributes<HTMLButtonElement>, \"children\" | \"onChange\" | \"value\">;\n\n/**\n * Переключатель boolean-состояния в виде слайдера. Подходит для быстрых настроек и включения/отключения опций.\n */\nexport function Switch(props: SwitchProps) {\n\tconst {\n\t\tlabel,\n\t\tdescription,\n\t\tdisabled,\n\t\tcheckedIcon = <CheckCircle2Icon />,\n\t\tuncheckedIcon = <BanIcon />,\n\t\tclassName,\n\t\ttype,\n\t\tid: externalId,\n\t\tsize,\n\t\tplaceholder,\n\t\tonChange: _onChange,\n\t\tvalue: _value,\n\t\ttriState: _triState,\n\t\t...buttonProps\n\t} = props;\n\tconst autoId = useId();\n\tconst id = externalId ?? autoId;\n\tconst descriptionId = description ? `${id}-description` : undefined;\n\tconst labelId = label ? `${id}-label` : undefined;\n\tvoid size;\n\tvoid placeholder;\n\tvoid _onChange;\n\tvoid _value;\n\tvoid _triState;\n\n\tconst handleChange = () => {\n\t\tif (!props.triState) {\n\t\t\tprops.onChange(!props.value);\n\t\t\treturn;\n\t\t}\n\n\t\tif (props.value === undefined) {\n\t\t\tprops.onChange(true);\n\t\t\treturn;\n\t\t}\n\n\t\tif (props.value === true) {\n\t\t\tprops.onChange(false);\n\t\t\treturn;\n\t\t}\n\n\t\tif (props.value === false) {\n\t\t\tprops.onChange(undefined);\n\t\t}\n\t};\n\n\tconst isChecked = typeof props.value === \"boolean\" ? props.value : false;\n\tconst showAutoState = props.triState && typeof props.value !== \"boolean\";\n\tconst ariaLabel = buttonProps[\"aria-label\"] ?? (!label ? \"Переключатель\" : undefined);\n\n\treturn (\n\t\t<div className={cn(uiStyles.uiElement, disabled && uiStyles.disabled)} aria-disabled={disabled || undefined}>\n\t\t\t{label && (\n\t\t\t\t<div id={labelId} className={uiStyles.uiLabel}>\n\t\t\t\t\t{label}:\n\t\t\t\t</div>\n\t\t\t)}\n\t\t\t{description && (\n\t\t\t\t<p id={descriptionId} className={uiStyles.uiDescription}>\n\t\t\t\t\t{description}\n\t\t\t\t</p>\n\t\t\t)}\n\t\t\t<button\n\t\t\t\t{...buttonProps}\n\t\t\t\tid={id}\n\t\t\t\ttype={type ?? \"button\"}\n\t\t\t\trole=\"switch\"\n\t\t\t\tdisabled={disabled}\n\t\t\t\taria-checked={isChecked}\n\t\t\t\taria-describedby={descriptionId}\n\t\t\t\taria-labelledby={labelId}\n\t\t\t\taria-label={ariaLabel}\n\t\t\t\taria-disabled={disabled}\n\t\t\t\tdata-ui=\"switch\"\n\t\t\t\tdata-action=\"toggle-switch\"\n\t\t\t\tonClick={handleChange}\n\t\t\t\tclassName={cn(uiStyles.uiInputControl, styles.switchWrapper, className)}>\n\t\t\t\t<div className={styles.switch} data-disabled={disabled || undefined}>\n\t\t\t\t\t{showAutoState ? (\n\t\t\t\t\t\t<div className={cn(styles.iconWrapper, styles.auto, styles.checked)}>Auto</div>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t<div className={cn(styles.iconWrapper, !props.value && styles.checked)}>{uncheckedIcon}</div>\n\t\t\t\t\t\t\t<div className={cn(styles.iconWrapper, props.value && styles.checked)}>{checkedIcon}</div>\n\t\t\t\t\t\t</>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t</button>\n\t\t</div>\n\t);\n}\n"],"mappings":";;;;;;;;;;;;;;AC+BA,SAAgB,EAAO,GAAoB;CAC1C,IAAM,EACL,UACA,gBACA,aACA,iBAAc,kBAAC,GAAD,CAAmB,CAAA,GACjC,mBAAgB,kBAAC,GAAD,CAAU,CAAA,GAC1B,cACA,SACA,IAAI,GACJ,SACA,gBACA,UAAU,GACV,OAAO,GACP,UAAU,GACV,GAAG,MACA,GACE,IAAS,EAAM,GACf,IAAK,KAAc,GACnB,IAAgB,IAAc,GAAG,EAAG,gBAAgB,KAAA,GACpD,IAAU,IAAQ,GAAG,EAAG,UAAU,KAAA,GAOlC,UAAqB;EAC1B,IAAI,CAAC,EAAM,UAAU;GACpB,EAAM,SAAS,CAAC,EAAM,KAAK;GAC3B;EACD;EAEA,IAAI,EAAM,UAAU,KAAA,GAAW;GAC9B,EAAM,SAAS,EAAI;GACnB;EACD;EAEA,IAAI,EAAM,UAAU,IAAM;GACzB,EAAM,SAAS,EAAK;GACpB;EACD;EAEA,AAAI,EAAM,UAAU,MACnB,EAAM,SAAS,KAAA,CAAS;CAE1B,GAEM,IAAY,OAAO,EAAM,SAAU,YAAY,EAAM,QAAQ,IAC7D,IAAgB,EAAM,YAAY,OAAO,EAAM,SAAU,WACzD,IAAY,EAAY,kBAAmB,IAA0B,KAAA,IAAlB;CAEzD,OACC,kBAAC,OAAD;EAAK,WAAW,EAAG,EAAS,WAAW,KAAY,EAAS,QAAQ;EAAG,iBAAe,KAAY,KAAA;YAAlG;GACE,KACA,kBAAC,OAAD;IAAK,IAAI;IAAS,WAAW,EAAS;cAAtC,CACE,GAAM,GACH;;GAEL,KACA,kBAAC,KAAD;IAAG,IAAI;IAAe,WAAW,EAAS;cACxC;GACC,CAAA;GAEJ,kBAAC,UAAD;IACC,GAAI;IACA;IACJ,MAAM,KAAQ;IACd,MAAK;IACK;IACV,gBAAc;IACd,oBAAkB;IAClB,mBAAiB;IACjB,cAAY;IACZ,iBAAe;IACf,WAAQ;IACR,eAAY;IACZ,SAAS;IACT,WAAW,EAAG,EAAS,gBAAgB,EAAO,eAAe,CAAS;cACtE,kBAAC,OAAD;KAAK,WAAW,EAAO;KAAQ,iBAAe,KAAY,KAAA;eACxD,IACA,kBAAC,OAAD;MAAK,WAAW,EAAG,EAAO,aAAa,EAAO,MAAM,EAAO,OAAO;gBAAG;KAAS,CAAA,IAE9E,kBAAA,GAAA,EAAA,UAAA,CACC,kBAAC,OAAD;MAAK,WAAW,EAAG,EAAO,aAAa,CAAC,EAAM,SAAS,EAAO,OAAO;gBAAI;KAAmB,CAAA,GAC5F,kBAAC,OAAD;MAAK,WAAW,EAAG,EAAO,aAAa,EAAM,SAAS,EAAO,OAAO;gBAAI;KAAiB,CAAA,CACxF,EAAA,CAAA;IAEC,CAAA;GACE,CAAA;EACJ;;AAEP"}

package/dist/table/index.js

@@ -1,2 +1,2 @@
-import { t as e } from "../chunks/table-Dc3AqMzP.js";
+import { t as e } from "../chunks/table-BR2VqeEg.js";
 export { e as Table };

package/dist/table-sorting/index.js

@@ -1,4 +1,4 @@
-import { n as e } from "../chunks/DropdownMenu-DQeR3y7M.js";
+import { n as e } from "../chunks/context-menu-DQeR3y7M.js";
 import { BrushCleaningIcon as t, SortAscIcon as n, SortDescIcon as r } from "lucide-react";
 import { Fragment as i, jsx as a, jsxs as o } from "react/jsx-runtime";
 //#region src/table-sorting/TableSortingControls.tsx

package/dist/tabs/index.js

@@ -1,2 +1,384 @@
-import { n as e, r as t, t as n } from "../chunks/tabs-DlnVVMJl.js";
-export { e as Tabs, t as TabsBox, n as TabsLayout };
+import { d as e, h as t, l as n } from "../chunks/misc-1PxS8OWD.js";
+import { Children as r, isValidElement as i, useId as a, useMemo as o, useRef as s, useState as c } from "react";
+import { cn as l, getRovingFocusTargetIndex as u } from "@ryuzaki13/react-foundation-lib/utils";
+import { Fragment as d, jsx as f, jsxs as p } from "react/jsx-runtime";
+//#region src/tabs/lib/tabs.ts
+function m(e) {
+	return e.find((e) => !e.disabled)?.id ?? null;
+}
+function h(e, t) {
+	return t ? e.find((e) => e.id === t && !e.disabled)?.id ?? m(e) : m(e);
+}
+function g(e) {
+	return e.filter((e) => !e.disabled);
+}
+function _({ mountStrategy: e, isSelected: t, isVisited: n }) {
+	return e === "keep-mounted" || t || e === "lazy" && n;
+}
+//#endregion
+//#region src/tabs/model/useTabsState.ts
+function v({ items: e, value: t, defaultValue: n, onValueChange: r, orientation: i = "horizontal", activationMode: l = "automatic", loop: d = !0 }) {
+	let f = t !== void 0, p = o(() => g(e), [e]), m = p[0]?.id ?? null, [_, v] = c(() => h(e, n)), [y, b] = c(() => h(e, t ?? n)), x = h(e, t ?? n), [S, C] = c(() => x ? /* @__PURE__ */ new Set([x]) : /* @__PURE__ */ new Set()), w = a(), T = s({}), E = h(e, f ? t : _), D = h(e, y) ?? E ?? m, O = o(() => {
+		if (!E || S.has(E)) return S;
+		let e = new Set(S);
+		return e.add(E), e;
+	}, [E, S]), k = (t) => {
+		let n = h(e, t);
+		n && (C((e) => {
+			if (e.has(n)) return e;
+			let t = new Set(e);
+			return t.add(n), t;
+		}), f || v(n), r?.(n));
+	}, A = (e) => {
+		T.current[e]?.focus();
+	}, j = (e) => {
+		if (p.length < 2) return;
+		let t = u({
+			currentIndex: Math.max(0, p.findIndex((e) => e.id === (D ?? E ?? m))),
+			itemCount: p.length,
+			key: e.key,
+			orientation: i,
+			wrap: d
+		});
+		if (t === null) return;
+		e.preventDefault();
+		let n = p[t]?.id;
+		n && (b(n), A(n), l === "automatic" && k(n));
+	}, M = (e) => {
+		let t = e.relatedTarget;
+		t instanceof Node && e.currentTarget.contains(t) || b(E ?? m);
+	}, N = (e) => `${w}-tab-${e}`, P = (e) => `${w}-panel-${e}`;
+	return {
+		activationMode: l,
+		orientation: i,
+		selectedTabId: E,
+		tabbableTabId: D,
+		onTabListKeyDown: j,
+		onTabListBlur: M,
+		getTabElementId: N,
+		getPanelElementId: P,
+		getTabButtonProps: (e) => {
+			let t = e.id === E, n = e.id === D;
+			return {
+				ref: (t) => {
+					T.current[e.id] = t;
+				},
+				type: "button",
+				role: "tab",
+				id: N(e.id),
+				disabled: e.disabled,
+				"aria-selected": t,
+				"aria-controls": P(e.id),
+				"aria-disabled": e.disabled || void 0,
+				tabIndex: e.disabled ? -1 : n ? 0 : -1,
+				onFocus: () => b(e.id),
+				onClick: () => k(e.id)
+			};
+		},
+		isVisited: (e) => O.has(e)
+	};
+}
+var y = {
+	tabsContainer: "pcMjuj",
+	bordered: "ITP5v-",
+	cleanPanel: "kzs94N",
+	tabs: "ZSAoAa",
+	panels: "psYhsZ",
+	horizontal: "mNDq9-",
+	vertical: "g156KO",
+	panelScrollable: "C2mO1e",
+	tab: "_28F3fs",
+	selected: "UKZXTZ",
+	panel: "jiTafe",
+	panelBody: "nhD0k7",
+	layoutPanels: "G8FICe",
+	layoutPanel: "W50XHh",
+	layoutSection: "vnjXkU",
+	layoutContent: "Nzvfhw"
+};
+//#endregion
+//#region src/tabs/ui/TabsLoadingState.tsx
+function b({ containerClassName: e, tabListClassName: n, panelsClassName: r, panelClassName: i, panelBodyClassName: a, loadingText: o }) {
+	return /* @__PURE__ */ p("div", {
+		className: e,
+		children: [/* @__PURE__ */ f("div", {
+			className: n,
+			"aria-hidden": "true",
+			children: /* @__PURE__ */ f("button", {
+				type: "button",
+				disabled: !0,
+				"data-disabled": "",
+				className: l(y.tab, "skeletonLine"),
+				children: "Загрузка..."
+			})
+		}), /* @__PURE__ */ f("div", {
+			className: r,
+			"aria-busy": "true",
+			children: /* @__PURE__ */ f("div", {
+				className: i,
+				children: /* @__PURE__ */ f("div", {
+					className: a,
+					children: /* @__PURE__ */ f(t, {
+						text: o,
+						className: "radiusSm"
+					})
+				})
+			})
+		})]
+	});
+}
+//#endregion
+//#region src/tabs/ui/TabsNoDataState.tsx
+function x({ containerClassName: t, panelsClassName: n, panelClassName: r, panelBodyClassName: i }) {
+	return /* @__PURE__ */ f("div", {
+		className: t,
+		children: /* @__PURE__ */ f("div", {
+			className: n,
+			children: /* @__PURE__ */ f("div", {
+				className: r,
+				children: /* @__PURE__ */ f("div", {
+					className: i,
+					children: /* @__PURE__ */ f(e, { className: "radiusSm" })
+				})
+			})
+		})
+	});
+}
+//#endregion
+//#region src/tabs/ui/TabsPanel.tsx
+function S({ tabId: e, isSelected: t, className: n, getTabElementId: r, getPanelElementId: i, children: a }) {
+	return /* @__PURE__ */ f("div", {
+		role: "tabpanel",
+		id: i(e),
+		"aria-labelledby": r(e),
+		hidden: !t,
+		className: n,
+		children: a
+	});
+}
+//#endregion
+//#region src/tabs/ui/TabsTabList.tsx
+function C({ items: e, state: t, className: r, ariaLabel: i, ariaLabelledBy: a }) {
+	return /* @__PURE__ */ f("div", {
+		className: r,
+		role: "tablist",
+		"aria-orientation": t.orientation,
+		"aria-label": i,
+		"aria-labelledby": a,
+		onKeyDown: t.onTabListKeyDown,
+		onBlur: t.onTabListBlur,
+		children: ((e) => t.orientation === "horizontal" ? /* @__PURE__ */ f(n, { children: e }) : /* @__PURE__ */ f(d, { children: e }))(e.map((e) => /* @__PURE__ */ f("button", {
+			...t.getTabButtonProps(e),
+			"data-ui": "tabs-tab",
+			"data-action": "select-tab",
+			className: l(y.tab, "textWrap", e.id === t.selectedTabId && y.selected),
+			children: e.title
+		}, e.id)))
+	});
+}
+//#endregion
+//#region src/tabs/ui/TabsBox.tsx
+function w({ items: e, value: t, defaultValue: n, onValueChange: r, className: i, isLoading: a, loadingText: o, cleanPanel: s, bordered: c = !1, orientation: u = "horizontal", activationMode: d = "automatic", mountStrategy: m = "unmount", loop: h = !0, "aria-label": g, "aria-labelledby": w }) {
+	let T = v({
+		items: e,
+		value: t,
+		defaultValue: n,
+		onValueChange: r,
+		orientation: u,
+		activationMode: d,
+		loop: h
+	}), E = l(y.tabsContainer, y[u], c && y.bordered, s && y.cleanPanel, i), D = y.tabs, O = l(y.panels, y.panelScrollable, "scrollable overscroll"), k = y.panel, A = y.panelBody;
+	return a ? /* @__PURE__ */ f(b, {
+		containerClassName: E,
+		tabListClassName: D,
+		panelsClassName: O,
+		panelClassName: k,
+		panelBodyClassName: A,
+		loadingText: o
+	}) : e.length ? /* @__PURE__ */ p("div", {
+		className: E,
+		children: [/* @__PURE__ */ f(C, {
+			items: e,
+			state: T,
+			className: D,
+			ariaLabel: g,
+			ariaLabelledBy: w
+		}), /* @__PURE__ */ f("div", {
+			className: O,
+			children: e.map((e) => {
+				let t = e.id === T.selectedTabId;
+				return _({
+					mountStrategy: m,
+					isSelected: t,
+					isVisited: T.isVisited(e.id)
+				}) ? /* @__PURE__ */ f(S, {
+					tabId: e.id,
+					isSelected: t,
+					className: k,
+					getTabElementId: T.getTabElementId,
+					getPanelElementId: T.getPanelElementId,
+					children: /* @__PURE__ */ f("div", {
+						className: A,
+						children: e.content
+					})
+				}, e.id) : null;
+			})
+		})]
+	}) : /* @__PURE__ */ f(x, {
+		containerClassName: E,
+		panelsClassName: O,
+		panelClassName: k,
+		panelBodyClassName: A
+	});
+}
+//#endregion
+//#region src/tabs/ui/Tabs.tsx
+function T({ onChange: e, onValueChange: t, ...n }) {
+	return /* @__PURE__ */ f(w, {
+		...n,
+		onValueChange: (n) => {
+			t?.(n), e?.(n);
+		}
+	});
+}
+//#endregion
+//#region src/tabs/ui/TabsLayout.tsx
+var E = "TabsLayout.Tab", D = "TabsLayout.Toolbar", O = "TabsLayout.Content", k = "TabsLayout.Footer";
+function A(e) {
+	let { type: t } = e;
+	if (typeof t == "function") {
+		let e = t;
+		return e.displayName ?? e.name ?? null;
+	}
+	if (typeof t == "object" && t && "displayName" in t) {
+		let e = t;
+		return typeof e.displayName == "string" ? e.displayName : null;
+	}
+	return null;
+}
+function j(e, t) {
+	return i(e) && A(e) === t;
+}
+function M({ children: e }) {
+	return /* @__PURE__ */ f(d, { children: e });
+}
+M.displayName = E;
+function N({ children: e }) {
+	return /* @__PURE__ */ f(d, { children: e });
+}
+N.displayName = D;
+function P({ children: e }) {
+	return /* @__PURE__ */ f(d, { children: e });
+}
+P.displayName = O;
+function F({ children: e }) {
+	return /* @__PURE__ */ f(d, { children: e });
+}
+F.displayName = k;
+function I(e, t) {
+	let n = null, a = null, o = null;
+	for (let s of r.toArray(e)) {
+		if (!i(s)) throw Error(`TabsLayout.Tab "${t}" поддерживает только дочерние элементы TabsLayout.Toolbar, TabsLayout.Content и TabsLayout.Footer.`);
+		if (j(s, D)) {
+			if (n) throw Error(`TabsLayout.Tab "${t}" содержит более одного блока TabsLayout.Toolbar.`);
+			n = s.props;
+			continue;
+		}
+		if (j(s, O)) {
+			if (a) throw Error(`TabsLayout.Tab "${t}" содержит более одного блока TabsLayout.Content.`);
+			a = s.props;
+			continue;
+		}
+		if (j(s, k)) {
+			if (o) throw Error(`TabsLayout.Tab "${t}" содержит более одного блока TabsLayout.Footer.`);
+			o = s.props;
+			continue;
+		}
+		throw Error(`TabsLayout.Tab "${t}" поддерживает только дочерние элементы TabsLayout.Toolbar, TabsLayout.Content и TabsLayout.Footer.`);
+	}
+	if (!a) throw Error(`TabsLayout.Tab "${t}" должен содержать блок TabsLayout.Content.`);
+	return {
+		toolbar: n,
+		content: a,
+		footer: o
+	};
+}
+function L(e) {
+	return r.toArray(e).map((e) => {
+		if (!j(e, E)) throw Error("TabsLayout принимает только дочерние элементы TabsLayout.Tab.");
+		return {
+			id: e.props.id,
+			title: e.props.title,
+			disabled: e.props.disabled,
+			...I(e.props.children, e.props.id)
+		};
+	});
+}
+var R = ({ children: e, value: t, defaultValue: n, onValueChange: r, className: i, bordered: a, cleanPanel: s, orientation: c = "horizontal", activationMode: u = "manual", mountStrategy: d = "lazy", loop: m = !0, "aria-label": h, "aria-labelledby": g }) => {
+	let b = o(() => L(e), [e]), x = v({
+		items: b,
+		value: t,
+		defaultValue: n,
+		onValueChange: r,
+		orientation: c,
+		activationMode: u,
+		loop: m
+	}), w = l(y.tabsContainer, y[c], a && y.bordered, s && y.cleanPanel, i), T = l(y.panels, y.layoutPanels);
+	return /* @__PURE__ */ p("div", {
+		className: w,
+		children: [/* @__PURE__ */ f(C, {
+			items: b,
+			state: x,
+			className: y.tabs,
+			ariaLabel: h,
+			ariaLabelledBy: g
+		}), /* @__PURE__ */ f("div", {
+			className: T,
+			children: b.map((e) => {
+				let t = e.id === x.selectedTabId;
+				if (!_({
+					mountStrategy: d,
+					isSelected: t,
+					isVisited: x.isVisited(e.id)
+				})) return null;
+				let n = `${e.toolbar ? "auto " : ""}minmax(0, 1fr)${e.footer ? " auto" : ""}`;
+				return /* @__PURE__ */ f(S, {
+					tabId: e.id,
+					isSelected: t,
+					className: y.panel,
+					getTabElementId: x.getTabElementId,
+					getPanelElementId: x.getPanelElementId,
+					children: /* @__PURE__ */ p("div", {
+						className: y.layoutPanel,
+						style: { gridTemplateRows: n },
+						children: [
+							e.toolbar ? /* @__PURE__ */ f("div", {
+								className: l(y.layoutSection, e.toolbar.className),
+								children: e.toolbar.children
+							}) : null,
+							/* @__PURE__ */ f("div", {
+								className: l(y.layoutSection, y.layoutContent, e.content.className),
+								children: e.content.children
+							}),
+							e.footer ? /* @__PURE__ */ f("div", {
+								className: l(y.layoutSection, e.footer.className),
+								children: e.footer.children
+							}) : null
+						]
+					})
+				}, e.id);
+			})
+		})]
+	});
+};
+R.displayName = "TabsLayout";
+var z = Object.assign(R, {
+	Tab: M,
+	Toolbar: N,
+	Content: P,
+	Footer: F
+});
+//#endregion
+export { T as Tabs, w as TabsBox, z as TabsLayout };
+
+//# sourceMappingURL=index.js.map

package/dist/tabs/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../src/tabs/lib/tabs.ts","../../src/tabs/model/useTabsState.ts","../../src/tabs/ui/Tabs.module.scss","../../src/tabs/ui/TabsLoadingState.tsx","../../src/tabs/ui/TabsNoDataState.tsx","../../src/tabs/ui/TabsPanel.tsx","../../src/tabs/ui/TabsTabList.tsx","../../src/tabs/ui/TabsBox.tsx","../../src/tabs/ui/Tabs.tsx","../../src/tabs/ui/TabsLayout.tsx"],"sourcesContent":["import type { TabsDescriptor, TabsMountStrategy } from \"../model/types\";\n\n/**\n * Возвращает идентификатор первой доступной вкладки.\n */\nexport function getFirstEnabledTabId(items: TabsDescriptor[]) {\n\treturn items.find((item) => !item.disabled)?.id ?? null;\n}\n\n/**\n * Возвращает безопасный идентификатор вкладки.\n * Если переданный `candidate` недоступен, выбирается первая доступная вкладка.\n */\nexport function getSafeTabId(items: TabsDescriptor[], candidate: string | undefined | null) {\n\tif (!candidate) {\n\t\treturn getFirstEnabledTabId(items);\n\t}\n\n\tconst matchedItem = items.find((item) => item.id === candidate && !item.disabled);\n\treturn matchedItem?.id ?? getFirstEnabledTabId(items);\n}\n\n/**\n * Возвращает только доступные вкладки для roving focus и клавиатурной навигации.\n */\nexport function getEnabledTabs(items: TabsDescriptor[]) {\n\treturn items.filter((item) => !item.disabled);\n}\n\ninterface ShouldMountTabPanelOptions {\n\tmountStrategy: TabsMountStrategy;\n\tisSelected: boolean;\n\tisVisited: boolean;\n}\n\n/**\n * Определяет, должна ли панель оставаться смонтированной с учётом стратегии монтирования.\n */\nexport function shouldMountTabPanel({ mountStrategy, isSelected, isVisited }: ShouldMountTabPanelOptions) {\n\treturn mountStrategy === \"keep-mounted\" || isSelected || (mountStrategy === \"lazy\" && isVisited);\n}\n","import type React from \"react\";\nimport { FocusEvent, KeyboardEvent, useId, useMemo, useRef, useState } from \"react\";\n\nimport { getRovingFocusTargetIndex } from \"@ryuzaki13/react-foundation-lib/utils\";\n\nimport { getEnabledTabs, getSafeTabId } from \"../lib/tabs\";\n\nimport type { TabsActivationMode, TabsDescriptor, TabsOrientation } from \"./types\";\n\ninterface UseTabsStateOptions {\n\titems: TabsDescriptor[];\n\tvalue?: string;\n\tdefaultValue?: string;\n\tonValueChange?: (value: string) => void;\n\torientation?: TabsOrientation;\n\tactivationMode?: TabsActivationMode;\n\tloop?: boolean;\n}\n\n/**\n * Публичная часть модели, необходимая визуальным подкомпонентам tabs.\n */\nexport interface TabsStateModel {\n\tactivationMode: TabsActivationMode;\n\torientation: TabsOrientation;\n\tselectedTabId: string | null;\n\ttabbableTabId: string | null;\n\tonTabListKeyDown: (event: KeyboardEvent<HTMLDivElement>) => void;\n\tonTabListBlur: (event: FocusEvent<HTMLDivElement>) => void;\n\tgetTabElementId: (tabId: string) => string;\n\tgetPanelElementId: (tabId: string) => string;\n\tgetTabButtonProps: (item: TabsDescriptor) => React.ButtonHTMLAttributes<HTMLButtonElement> & {\n\t\tref: (node: HTMLButtonElement | null) => void;\n\t};\n\tisVisited: (tabId: string) => boolean;\n}\n\n/**\n * Инкапсулирует state, a11y-связки и клавиатурную навигацию для всех оболочек tabs.\n */\nexport function useTabsState({\n\titems,\n\tvalue,\n\tdefaultValue,\n\tonValueChange,\n\torientation = \"horizontal\",\n\tactivationMode = \"automatic\",\n\tloop = true\n}: UseTabsStateOptions): TabsStateModel {\n\tconst isControlled = value !== undefined;\n\tconst enabledTabs = useMemo(() => getEnabledTabs(items), [items]);\n\tconst fallbackTabId = enabledTabs[0]?.id ?? null;\n\tconst [internalValue, setInternalValue] = useState(() => getSafeTabId(items, defaultValue));\n\tconst [focusedTabId, setFocusedTabId] = useState<string | null>(() => getSafeTabId(items, value ?? defaultValue));\n\tconst initialVisitedTabId = getSafeTabId(items, value ?? defaultValue);\n\tconst [visitedTabsState, setVisitedTabsState] = useState<Set<string>>(() =>\n\t\tinitialVisitedTabId ? new Set([initialVisitedTabId]) : new Set()\n\t);\n\tconst tabsId = useId();\n\tconst tabRefs = useRef<Record<string, HTMLButtonElement | null>>({});\n\n\tconst selectedTabId = getSafeTabId(items, isControlled ? value : internalValue);\n\tconst nextTabbableTabId = getSafeTabId(items, focusedTabId) ?? selectedTabId ?? fallbackTabId;\n\tconst visitedTabs = useMemo(() => {\n\t\tif (!selectedTabId || visitedTabsState.has(selectedTabId)) {\n\t\t\treturn visitedTabsState;\n\t\t}\n\n\t\tconst next = new Set(visitedTabsState);\n\t\tnext.add(selectedTabId);\n\t\treturn next;\n\t}, [selectedTabId, visitedTabsState]);\n\n\tconst activateTab = (nextTabId: string) => {\n\t\tconst safeNextTabId = getSafeTabId(items, nextTabId);\n\t\tif (!safeNextTabId) {\n\t\t\treturn;\n\t\t}\n\n\t\tsetVisitedTabsState((prev) => {\n\t\t\tif (prev.has(safeNextTabId)) {\n\t\t\t\treturn prev;\n\t\t\t}\n\n\t\t\tconst next = new Set(prev);\n\t\t\tnext.add(safeNextTabId);\n\t\t\treturn next;\n\t\t});\n\n\t\tif (!isControlled) {\n\t\t\tsetInternalValue(safeNextTabId);\n\t\t}\n\n\t\tonValueChange?.(safeNextTabId);\n\t};\n\n\tconst focusTab = (nextTabId: string) => {\n\t\ttabRefs.current[nextTabId]?.focus();\n\t};\n\n\tconst onTabListKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {\n\t\tif (enabledTabs.length < 2) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst activeFocusIndex = Math.max(\n\t\t\t0,\n\t\t\tenabledTabs.findIndex((item) => item.id === (nextTabbableTabId ?? selectedTabId ?? fallbackTabId))\n\t\t);\n\t\tconst nextEnabledIndex = getRovingFocusTargetIndex({\n\t\t\tcurrentIndex: activeFocusIndex,\n\t\t\titemCount: enabledTabs.length,\n\t\t\tkey: event.key,\n\t\t\torientation,\n\t\t\twrap: loop\n\t\t});\n\n\t\tif (nextEnabledIndex === null) {\n\t\t\treturn;\n\t\t}\n\n\t\tevent.preventDefault();\n\n\t\tconst nextTabId = enabledTabs[nextEnabledIndex]?.id;\n\t\tif (!nextTabId) {\n\t\t\treturn;\n\t\t}\n\n\t\tsetFocusedTabId(nextTabId);\n\t\tfocusTab(nextTabId);\n\n\t\tif (activationMode === \"automatic\") {\n\t\t\tactivateTab(nextTabId);\n\t\t}\n\t};\n\n\tconst onTabListBlur = (event: FocusEvent<HTMLDivElement>) => {\n\t\tconst nextTarget = event.relatedTarget;\n\n\t\tif (nextTarget instanceof Node && event.currentTarget.contains(nextTarget)) {\n\t\t\treturn;\n\t\t}\n\n\t\tsetFocusedTabId(selectedTabId ?? fallbackTabId);\n\t};\n\n\tconst getTabElementId = (tabId: string) => `${tabsId}-tab-${tabId}`;\n\tconst getPanelElementId = (tabId: string) => `${tabsId}-panel-${tabId}`;\n\n\tconst getTabButtonProps = (item: TabsDescriptor) => {\n\t\tconst isSelected = item.id === selectedTabId;\n\t\tconst isTabbable = item.id === nextTabbableTabId;\n\n\t\treturn {\n\t\t\tref: (node: HTMLButtonElement | null) => {\n\t\t\t\ttabRefs.current[item.id] = node;\n\t\t\t},\n\t\t\ttype: \"button\" as const,\n\t\t\trole: \"tab\" as const,\n\t\t\tid: getTabElementId(item.id),\n\t\t\tdisabled: item.disabled,\n\t\t\t\"aria-selected\": isSelected,\n\t\t\t\"aria-controls\": getPanelElementId(item.id),\n\t\t\t\"aria-disabled\": item.disabled || undefined,\n\t\t\ttabIndex: item.disabled ? -1 : isTabbable ? 0 : -1,\n\t\t\tonFocus: () => setFocusedTabId(item.id),\n\t\t\tonClick: () => activateTab(item.id)\n\t\t};\n\t};\n\n\treturn {\n\t\tactivationMode,\n\t\torientation,\n\t\tselectedTabId,\n\t\ttabbableTabId: nextTabbableTabId,\n\t\tonTabListKeyDown,\n\t\tonTabListBlur,\n\t\tgetTabElementId,\n\t\tgetPanelElementId,\n\t\tgetTabButtonProps,\n\t\tisVisited: (tabId: string) => visitedTabs.has(tabId)\n\t};\n}\n",".tabsContainer {\n\t--tabs-border: none;\n\t--tabs-panel-border: none;\n\t--tabs-panel-padding: var(--space-md);\n\t--tabs-panel-bg: var(--surface-1);\n\n\tdisplay: grid;\n\tgap: var(--space-sm);\n\tmin-width: 0;\n\tmin-height: 0;\n\theight: 100%;\n\toverflow: hidden;\n}\n\n.bordered {\n\t--tabs-border: var(--border);\n\t--tabs-panel-border: var(--border);\n}\n\n.cleanPanel {\n\t--tabs-panel-padding: 0;\n\t--tabs-panel-bg: none;\n\t--tabs-panel-border: none;\n}\n\n.tabs {\n\tdisplay: flex;\n\tgap: var(--space-xs);\n\tmin-width: 0;\n\n\tborder: var(--tabs-border);\n\tbackground-color: var(--surface-1);\n\tpadding: var(--space-xs);\n}\n\n.panels {\n\tmin-width: 0;\n\tmin-height: 0;\n\tborder: var(--tabs-panel-border);\n\tbackground-color: var(--tabs-panel-bg);\n}\n\n.tabs,\n.panels {\n\tborder-radius: var(--radius-sm);\n}\n\n.horizontal {\n\tgrid-template-rows: auto minmax(0, 1fr);\n\n\t// .tabs {\n\t// \tflex-wrap: wrap;\n\t// }\n}\n\n.vertical {\n\tgrid-template-columns: 10em minmax(0, 1fr);\n\tmin-height: 0;\n\n\t.tabs {\n\t\tflex-direction: column;\n\t}\n}\n\n.panelScrollable {\n\toverflow: auto;\n}\n\n.tab {\n\ttext-align: left;\n\n\tposition: relative;\n\tmin-height: var(--control-height);\n\tpadding: var(--space-xs) var(--space-md);\n\tcolor: var(--content-2);\n\tborder-radius: var(--radius-sm);\n\tfont-weight: 700;\n\tfont-variation-settings: \"wght\" 700;\n\n\tflex-shrink: 0;\n\n\t&:hover {\n\t\tcursor: pointer;\n\t\tcolor: var(--content-accent);\n\t\t// background-color: var(--surface-accent);\n\t}\n\n\t&.selected {\n\t\tcolor: var(--status-neutral-on-fill);\n\t\tbackground-color: var(--status-neutral-fill);\n\t\tborder-color: var(--border-0);\n\n\t\tbox-shadow: var(--shadow-xs);\n\t}\n\n\t&:disabled {\n\t\tcursor: not-allowed;\n\t\tcolor: var(--content-2);\n\t\tbackground-color: var(--surface-2);\n\t}\n}\n\n.panel {\n\tpadding: 0;\n\tmin-width: 0;\n\tmin-height: 0;\n\theight: 100%;\n}\n\n.panelBody {\n\tmin-width: 0;\n\tmin-height: 0;\n\n\theight: 100%;\n\tpadding: var(--tabs-panel-padding);\n}\n\n.layoutPanels {\n\toverflow: hidden;\n}\n\n.layoutPanel {\n\tdisplay: grid;\n\tgap: var(--space-md);\n\tmin-width: 0;\n\tmin-height: 0;\n\theight: 100%;\n\tpadding: var(--tabs-panel-padding);\n}\n\n.layoutSection {\n\tmin-width: 0;\n}\n\n.layoutContent {\n\tmin-height: 0;\n}\n","import { cn } from \"@ryuzaki13/react-foundation-lib/utils\";\n\nimport { LoadingMessage } from \"../../misc\";\n\nimport styles from \"./Tabs.module.scss\";\n\ninterface TabsLoadingStateProps {\n\tcontainerClassName: string;\n\ttabListClassName: string;\n\tpanelsClassName: string;\n\tpanelClassName: string;\n\tpanelBodyClassName: string;\n\tloadingText?: string;\n}\n\n/**\n * Служебное loading-состояние для `TabsBox`.\n */\nexport function TabsLoadingState({\n\tcontainerClassName,\n\ttabListClassName,\n\tpanelsClassName,\n\tpanelClassName,\n\tpanelBodyClassName,\n\tloadingText\n}: TabsLoadingStateProps) {\n\treturn (\n\t\t<div className={containerClassName}>\n\t\t\t<div className={tabListClassName} aria-hidden=\"true\">\n\t\t\t\t<button type=\"button\" disabled data-disabled=\"\" className={cn(styles.tab, \"skeletonLine\")}>\n\t\t\t\t\tЗагрузка...\n\t\t\t\t</button>\n\t\t\t</div>\n\t\t\t<div className={panelsClassName} aria-busy=\"true\">\n\t\t\t\t<div className={panelClassName}>\n\t\t\t\t\t<div className={panelBodyClassName}>\n\t\t\t\t\t\t<LoadingMessage text={loadingText} className=\"radiusSm\" />\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</div>\n\t);\n}\n","import { NoData } from \"../../misc\";\n\ninterface TabsNoDataStateProps {\n\tcontainerClassName: string;\n\tpanelsClassName: string;\n\tpanelClassName: string;\n\tpanelBodyClassName: string;\n}\n\n/**\n * Служебное empty-состояние для `TabsBox`.\n */\nexport function TabsNoDataState({ containerClassName, panelsClassName, panelClassName, panelBodyClassName }: TabsNoDataStateProps) {\n\treturn (\n\t\t<div className={containerClassName}>\n\t\t\t<div className={panelsClassName}>\n\t\t\t\t<div className={panelClassName}>\n\t\t\t\t\t<div className={panelBodyClassName}>\n\t\t\t\t\t\t<NoData className=\"radiusSm\" />\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</div>\n\t);\n}\n","import React from \"react\";\n\n/**\n * Унифицированная ARIA-обёртка для содержимого активной панели tabs.\n */\ninterface TabsPanelProps {\n\ttabId: string;\n\tisSelected: boolean;\n\tclassName?: string;\n\tgetTabElementId: (tabId: string) => string;\n\tgetPanelElementId: (tabId: string) => string;\n\tchildren: React.ReactNode;\n}\n\nexport function TabsPanel({ tabId, isSelected, className, getTabElementId, getPanelElementId, children }: TabsPanelProps) {\n\treturn (\n\t\t<div\n\t\t\trole=\"tabpanel\"\n\t\t\tid={getPanelElementId(tabId)}\n\t\t\taria-labelledby={getTabElementId(tabId)}\n\t\t\thidden={!isSelected}\n\t\t\tclassName={className}>\n\t\t\t{children}\n\t\t</div>\n\t);\n}\n","import { ReactNode } from \"react\";\n\nimport { cn } from \"@ryuzaki13/react-foundation-lib/utils\";\n\nimport { OneStepScroller } from \"../../misc\";\n\nimport styles from \"./Tabs.module.scss\";\n\nimport type { TabsDescriptor } from \"../model/types\";\nimport type { TabsStateModel } from \"../model/useTabsState\";\n\n/**\n * Рендерит tablist и кнопки вкладок поверх общей модели tabs.\n */\ninterface TabsTabListProps {\n\titems: TabsDescriptor[];\n\tstate: TabsStateModel;\n\tclassName?: string;\n\tariaLabel?: string;\n\tariaLabelledBy?: string;\n}\n\nexport function TabsTabList({ items, state, className, ariaLabel, ariaLabelledBy }: TabsTabListProps) {\n\tconst wrapItems = (children: ReactNode) => {\n\t\tif (state.orientation === \"horizontal\") {\n\t\t\treturn <OneStepScroller>{children}</OneStepScroller>;\n\t\t}\n\n\t\treturn <>{children}</>;\n\t};\n\n\treturn (\n\t\t<div\n\t\t\tclassName={className}\n\t\t\trole=\"tablist\"\n\t\t\taria-orientation={state.orientation}\n\t\t\taria-label={ariaLabel}\n\t\t\taria-labelledby={ariaLabelledBy}\n\t\t\tonKeyDown={state.onTabListKeyDown}\n\t\t\tonBlur={state.onTabListBlur}>\n\t\t\t{wrapItems(\n\t\t\t\titems.map((item) => (\n\t\t\t\t\t<button\n\t\t\t\t\t\tkey={item.id}\n\t\t\t\t\t\t{...state.getTabButtonProps(item)}\n\t\t\t\t\t\tdata-ui=\"tabs-tab\"\n\t\t\t\t\t\tdata-action=\"select-tab\"\n\t\t\t\t\t\tclassName={cn(styles.tab, \"textWrap\", item.id === state.selectedTabId && styles.selected)}>\n\t\t\t\t\t\t{item.title}\n\t\t\t\t\t</button>\n\t\t\t\t))\n\t\t\t)}\n\t\t</div>\n\t);\n}\n","import { cn } from \"@ryuzaki13/react-foundation-lib/utils\";\n\nimport { shouldMountTabPanel } from \"../lib/tabs\";\nimport { TabsBoxProps } from \"../model/types\";\nimport { useTabsState } from \"../model/useTabsState\";\n\nimport styles from \"./Tabs.module.scss\";\nimport { TabsLoadingState } from \"./TabsLoadingState\";\nimport { TabsNoDataState } from \"./TabsNoDataState\";\nimport { TabsPanel } from \"./TabsPanel\";\nimport { TabsTabList } from \"./TabsTabList\";\n\n/**\n * Простой items-based tabs-компонент.\n * Сам управляет областью панели и её прокруткой.\n */\nexport function TabsBox({\n\titems,\n\tvalue,\n\tdefaultValue,\n\tonValueChange,\n\tclassName,\n\tisLoading,\n\tloadingText,\n\tcleanPanel,\n\tbordered = false,\n\torientation = \"horizontal\",\n\tactivationMode = \"automatic\",\n\tmountStrategy = \"unmount\",\n\tloop = true,\n\t\"aria-label\": ariaLabel,\n\t\"aria-labelledby\": ariaLabelledBy\n}: TabsBoxProps) {\n\tconst state = useTabsState({\n\t\titems,\n\t\tvalue,\n\t\tdefaultValue,\n\t\tonValueChange,\n\t\torientation,\n\t\tactivationMode,\n\t\tloop\n\t});\n\n\tconst rootClassName = cn(\n\t\tstyles.tabsContainer,\n\t\tstyles[orientation],\n\t\tbordered && styles.bordered,\n\t\tcleanPanel && styles.cleanPanel,\n\t\tclassName\n\t);\n\tconst tabListClassName = styles.tabs;\n\tconst panelsClassName = cn(styles.panels, styles.panelScrollable, \"scrollable overscroll\");\n\tconst panelClassName = styles.panel;\n\tconst panelBodyClassName = styles.panelBody;\n\n\tif (isLoading) {\n\t\treturn (\n\t\t\t<TabsLoadingState\n\t\t\t\tcontainerClassName={rootClassName}\n\t\t\t\ttabListClassName={tabListClassName}\n\t\t\t\tpanelsClassName={panelsClassName}\n\t\t\t\tpanelClassName={panelClassName}\n\t\t\t\tpanelBodyClassName={panelBodyClassName}\n\t\t\t\tloadingText={loadingText}\n\t\t\t/>\n\t\t);\n\t}\n\n\tif (!items.length) {\n\t\treturn (\n\t\t\t<TabsNoDataState\n\t\t\t\tcontainerClassName={rootClassName}\n\t\t\t\tpanelsClassName={panelsClassName}\n\t\t\t\tpanelClassName={panelClassName}\n\t\t\t\tpanelBodyClassName={panelBodyClassName}\n\t\t\t/>\n\t\t);\n\t}\n\n\treturn (\n\t\t<div className={rootClassName}>\n\t\t\t<TabsTabList items={items} state={state} className={tabListClassName} ariaLabel={ariaLabel} ariaLabelledBy={ariaLabelledBy} />\n\n\t\t\t<div className={panelsClassName}>\n\t\t\t\t{items.map((item) => {\n\t\t\t\t\tconst isSelected = item.id === state.selectedTabId;\n\t\t\t\t\tconst isMounted = shouldMountTabPanel({\n\t\t\t\t\t\tmountStrategy,\n\t\t\t\t\t\tisSelected,\n\t\t\t\t\t\tisVisited: state.isVisited(item.id)\n\t\t\t\t\t});\n\n\t\t\t\t\tif (!isMounted) {\n\t\t\t\t\t\treturn null;\n\t\t\t\t\t}\n\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<TabsPanel\n\t\t\t\t\t\t\tkey={item.id}\n\t\t\t\t\t\t\ttabId={item.id}\n\t\t\t\t\t\t\tisSelected={isSelected}\n\t\t\t\t\t\t\tclassName={panelClassName}\n\t\t\t\t\t\t\tgetTabElementId={state.getTabElementId}\n\t\t\t\t\t\t\tgetPanelElementId={state.getPanelElementId}>\n\t\t\t\t\t\t\t<div className={panelBodyClassName}>{item.content}</div>\n\t\t\t\t\t\t</TabsPanel>\n\t\t\t\t\t);\n\t\t\t\t})}\n\t\t\t</div>\n\t\t</div>\n\t);\n}\n","import { TabsBox } from \"./TabsBox\";\n\nimport type { TabsBoxItem, TabsBoxProps } from \"../model/types\";\n\n/**\n * Элемент вкладки для устаревшего совместимого API `Tabs`.\n */\nexport type TabsItem = TabsBoxItem;\n\n/**\n * @deprecated Используйте `TabsBox` для простого сценария и `TabsLayout` для составных layout-сценариев.\n */\nexport interface TabsProps extends TabsBoxProps {\n\tonChange?: (value: string) => void;\n}\n\n/**\n * @deprecated Используйте `TabsBox` для простого сценария и `TabsLayout` для составных layout-сценариев.\n */\nexport function Tabs({ onChange, onValueChange, ...props }: TabsProps) {\n\treturn (\n\t\t<TabsBox\n\t\t\t{...props}\n\t\t\tonValueChange={(nextValue) => {\n\t\t\t\tonValueChange?.(nextValue);\n\t\t\t\tonChange?.(nextValue);\n\t\t\t}}\n\t\t/>\n\t);\n}\n","/* eslint-disable react-refresh/only-export-components */\nimport React, { Children, isValidElement, useMemo } from \"react\";\n\nimport { cn } from \"@ryuzaki13/react-foundation-lib/utils\";\n\nimport { shouldMountTabPanel } from \"../lib/tabs\";\nimport { useTabsState } from \"../model/useTabsState\";\n\nimport styles from \"./Tabs.module.scss\";\nimport { TabsPanel } from \"./TabsPanel\";\nimport { TabsTabList } from \"./TabsTabList\";\n\nimport type { TabsDescriptor, TabsLayoutProps, TabsLayoutSectionProps, TabsLayoutTabProps } from \"../model/types\";\n\ninterface ParsedTabsLayoutTab extends TabsDescriptor {\n\ttoolbar: TabsLayoutSectionProps | null;\n\tcontent: TabsLayoutSectionProps;\n\tfooter: TabsLayoutSectionProps | null;\n}\n\nconst tabsLayoutTabDisplayName = \"TabsLayout.Tab\";\nconst tabsLayoutToolbarDisplayName = \"TabsLayout.Toolbar\";\nconst tabsLayoutContentDisplayName = \"TabsLayout.Content\";\nconst tabsLayoutFooterDisplayName = \"TabsLayout.Footer\";\n\n/**\n * Возвращает стабильный displayName compound-элемента.\n * Это нужно для корректной работы HMR, где ссылочное сравнение `child.type` может ломаться.\n */\nfunction getTabsLayoutElementDisplayName(child: React.ReactElement) {\n\tconst { type } = child;\n\n\tif (typeof type === \"function\") {\n\t\tconst componentType = type as React.JSXElementConstructor<unknown> & {\n\t\t\tdisplayName?: string;\n\t\t\tname?: string;\n\t\t};\n\n\t\treturn componentType.displayName ?? componentType.name ?? null;\n\t}\n\n\tif (typeof type === \"object\" && type !== null && \"displayName\" in type) {\n\t\tconst componentType = type as {\n\t\t\tdisplayName?: string;\n\t\t};\n\n\t\treturn typeof componentType.displayName === \"string\" ? componentType.displayName : null;\n\t}\n\n\treturn null;\n}\n\nfunction isTabsLayoutElement<Props>(child: React.ReactNode, displayName: string): child is React.ReactElement<Props> {\n\treturn isValidElement<Props>(child) && getTabsLayoutElementDisplayName(child) === displayName;\n}\n\n/**\n * Маркер верхнеуровневой вкладки в compound-режиме `TabsLayout`.\n */\nfunction TabsLayoutTab({ children }: TabsLayoutTabProps) {\n\treturn <>{children}</>;\n}\n\nTabsLayoutTab.displayName = tabsLayoutTabDisplayName;\n\n/**\n * Верхняя секция панели, исключённая из прокручиваемого содержимого.\n */\nfunction TabsLayoutToolbar({ children }: TabsLayoutSectionProps) {\n\treturn <>{children}</>;\n}\n\nTabsLayoutToolbar.displayName = tabsLayoutToolbarDisplayName;\n\n/**\n * Основное содержимое панели, которое само управляет своим layout и scroll.\n */\nfunction TabsLayoutContent({ children }: TabsLayoutSectionProps) {\n\treturn <>{children}</>;\n}\n\nTabsLayoutContent.displayName = tabsLayoutContentDisplayName;\n\n/**\n * Нижняя секция панели, исключённая из прокручиваемого содержимого.\n */\nfunction TabsLayoutFooter({ children }: TabsLayoutSectionProps) {\n\treturn <>{children}</>;\n}\n\nTabsLayoutFooter.displayName = tabsLayoutFooterDisplayName;\n\nfunction parseTabsLayoutSections(children: React.ReactNode, tabId: string) {\n\tlet toolbar: TabsLayoutSectionProps | null = null;\n\tlet content: TabsLayoutSectionProps | null = null;\n\tlet footer: TabsLayoutSectionProps | null = null;\n\n\tfor (const child of Children.toArray(children)) {\n\t\tif (!isValidElement(child)) {\n\t\t\tthrow new Error(\n\t\t\t\t`TabsLayout.Tab \"${tabId}\" поддерживает только дочерние элементы TabsLayout.Toolbar, TabsLayout.Content и TabsLayout.Footer.`\n\t\t\t);\n\t\t}\n\n\t\tif (isTabsLayoutElement<TabsLayoutSectionProps>(child, tabsLayoutToolbarDisplayName)) {\n\t\t\tif (toolbar) {\n\t\t\t\tthrow new Error(`TabsLayout.Tab \"${tabId}\" содержит более одного блока TabsLayout.Toolbar.`);\n\t\t\t}\n\n\t\t\ttoolbar = child.props;\n\t\t\tcontinue;\n\t\t}\n\n\t\tif (isTabsLayoutElement<TabsLayoutSectionProps>(child, tabsLayoutContentDisplayName)) {\n\t\t\tif (content) {\n\t\t\t\tthrow new Error(`TabsLayout.Tab \"${tabId}\" содержит более одного блока TabsLayout.Content.`);\n\t\t\t}\n\n\t\t\tcontent = child.props;\n\t\t\tcontinue;\n\t\t}\n\n\t\tif (isTabsLayoutElement<TabsLayoutSectionProps>(child, tabsLayoutFooterDisplayName)) {\n\t\t\tif (footer) {\n\t\t\t\tthrow new Error(`TabsLayout.Tab \"${tabId}\" содержит более одного блока TabsLayout.Footer.`);\n\t\t\t}\n\n\t\t\tfooter = child.props;\n\t\t\tcontinue;\n\t\t}\n\n\t\tthrow new Error(\n\t\t\t`TabsLayout.Tab \"${tabId}\" поддерживает только дочерние элементы TabsLayout.Toolbar, TabsLayout.Content и TabsLayout.Footer.`\n\t\t);\n\t}\n\n\tif (!content) {\n\t\tthrow new Error(`TabsLayout.Tab \"${tabId}\" должен содержать блок TabsLayout.Content.`);\n\t}\n\n\treturn { toolbar, content, footer };\n}\n\nfunction parseTabsLayoutChildren(children: React.ReactNode): ParsedTabsLayoutTab[] {\n\treturn Children.toArray(children).map((child) => {\n\t\tif (!isTabsLayoutElement<TabsLayoutTabProps>(child, tabsLayoutTabDisplayName)) {\n\t\t\tthrow new Error(\"TabsLayout принимает только дочерние элементы TabsLayout.Tab.\");\n\t\t}\n\n\t\treturn {\n\t\t\tid: child.props.id,\n\t\t\ttitle: child.props.title,\n\t\t\tdisabled: child.props.disabled,\n\t\t\t...parseTabsLayoutSections(child.props.children, child.props.id)\n\t\t};\n\t});\n}\n\ntype TabsLayoutComposition = React.FC<TabsLayoutProps> & {\n\tTab: typeof TabsLayoutTab;\n\tToolbar: typeof TabsLayoutToolbar;\n\tContent: typeof TabsLayoutContent;\n\tFooter: typeof TabsLayoutFooter;\n};\n\n/**\n * Compound-оболочка tabs для составных panel-layout сценариев.\n * Сам компонент управляет только переключением и каркасом панели.\n */\nconst TabsLayoutRoot: React.FC<TabsLayoutProps> = ({\n\tchildren,\n\tvalue,\n\tdefaultValue,\n\tonValueChange,\n\tclassName,\n\tbordered,\n\tcleanPanel,\n\torientation = \"horizontal\",\n\tactivationMode = \"manual\",\n\tmountStrategy = \"lazy\",\n\tloop = true,\n\t\"aria-label\": ariaLabel,\n\t\"aria-labelledby\": ariaLabelledBy\n}) => {\n\tconst tabs = useMemo(() => parseTabsLayoutChildren(children), [children]);\n\tconst state = useTabsState({\n\t\titems: tabs,\n\t\tvalue,\n\t\tdefaultValue,\n\t\tonValueChange,\n\t\torientation,\n\t\tactivationMode,\n\t\tloop\n\t});\n\tconst rootClassName = cn(\n\t\tstyles.tabsContainer,\n\t\tstyles[orientation],\n\t\tbordered && styles.bordered,\n\t\tcleanPanel && styles.cleanPanel,\n\t\tclassName\n\t);\n\tconst panelsClassName = cn(styles.panels, styles.layoutPanels);\n\n\treturn (\n\t\t<div className={rootClassName}>\n\t\t\t<TabsTabList items={tabs} state={state} className={styles.tabs} ariaLabel={ariaLabel} ariaLabelledBy={ariaLabelledBy} />\n\n\t\t\t<div className={panelsClassName}>\n\t\t\t\t{tabs.map((tab) => {\n\t\t\t\t\tconst isSelected = tab.id === state.selectedTabId;\n\t\t\t\t\tconst isMounted = shouldMountTabPanel({\n\t\t\t\t\t\tmountStrategy,\n\t\t\t\t\t\tisSelected,\n\t\t\t\t\t\tisVisited: state.isVisited(tab.id)\n\t\t\t\t\t});\n\n\t\t\t\t\tif (!isMounted) {\n\t\t\t\t\t\treturn null;\n\t\t\t\t\t}\n\n\t\t\t\t\tconst templateRows = `${tab.toolbar ? \"auto \" : \"\"}minmax(0, 1fr)${tab.footer ? \" auto\" : \"\"}`;\n\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<TabsPanel\n\t\t\t\t\t\t\tkey={tab.id}\n\t\t\t\t\t\t\ttabId={tab.id}\n\t\t\t\t\t\t\tisSelected={isSelected}\n\t\t\t\t\t\t\tclassName={styles.panel}\n\t\t\t\t\t\t\tgetTabElementId={state.getTabElementId}\n\t\t\t\t\t\t\tgetPanelElementId={state.getPanelElementId}>\n\t\t\t\t\t\t\t<div className={styles.layoutPanel} style={{ gridTemplateRows: templateRows }}>\n\t\t\t\t\t\t\t\t{tab.toolbar ? (\n\t\t\t\t\t\t\t\t\t<div className={cn(styles.layoutSection, tab.toolbar.className)}>{tab.toolbar.children}</div>\n\t\t\t\t\t\t\t\t) : null}\n\t\t\t\t\t\t\t\t<div className={cn(styles.layoutSection, styles.layoutContent, tab.content.className)}>\n\t\t\t\t\t\t\t\t\t{tab.content.children}\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t{tab.footer ? (\n\t\t\t\t\t\t\t\t\t<div className={cn(styles.layoutSection, tab.footer.className)}>{tab.footer.children}</div>\n\t\t\t\t\t\t\t\t) : null}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</TabsPanel>\n\t\t\t\t\t);\n\t\t\t\t})}\n\t\t\t</div>\n\t\t</div>\n\t);\n};\n\nTabsLayoutRoot.displayName = \"TabsLayout\";\n\nexport const TabsLayout = Object.assign(TabsLayoutRoot, {\n\tTab: TabsLayoutTab,\n\tToolbar: TabsLayoutToolbar,\n\tContent: TabsLayoutContent,\n\tFooter: TabsLayoutFooter\n}) as TabsLayoutComposition;\n"],"mappings":"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"}

package/dist/text-editor/index.js

@@ -1,10 +1,10 @@
-import { m as e } from "../chunks/misc-DoqZBMof.js";
+import { m as e } from "../chunks/misc-1PxS8OWD.js";
 import { t } from "../chunks/editorModel-DCJRgzlr.js";
-import { i as n, r } from "../chunks/toolbar-BCZNdRXM.js";
+import { i as n, r } from "../chunks/toolbar-XCDeS2Li.js";
 import { jsx as i } from "react/jsx-runtime";
 //#region src/text-editor/TextEditorLexical.tsx
 function a() {
-	return import("../chunks/TextEditorLexicalClient-uvFboXlh.js").then((e) => ({ TextEditorLexicalClient: e.TextEditorLexicalClient }));
+	return import("../chunks/TextEditorLexicalClient-Bca3FOUs.js").then((e) => ({ TextEditorLexicalClient: e.TextEditorLexicalClient }));
 }
 function o(t) {
 	return /* @__PURE__ */ i(e, {

package/dist/text-editor/toolbar/index.js

@@ -1,2 +1,2 @@
-import { a as e, c as t, d as n, f as r, i, l as a, n as o, o as s, p as c, r as l, s as u, t as d, u as f } from "../../chunks/toolbar-BCZNdRXM.js";
+import { a as e, c as t, d as n, f as r, i, l as a, n as o, o as s, p as c, r as l, s as u, t as d, u as f } from "../../chunks/toolbar-XCDeS2Li.js";
 export { r as ActionControls, n as AlignmentControls, f as HistoryControls, o as LinkButtons, l as LinkTypes, i as TagTypes, e as TextEditorBlockControls, s as TextEditorInlineControls, u as TextEditorStyleClasses, d as TextEditorToolbarLexical, c as ToolbarControl, t as getElementFromElementStyle, a as getTagFromElementStyle };

package/dist/textarea/index.js

@@ -1,2 +1,44 @@
-import { t as e } from "../chunks/Textarea-T8gXua35.js";
-export { e as Textarea };
+import { t as e } from "../chunks/ui.module-BisoTevy.js";
+import { l as t, s as n } from "../chunks/input-CZLUUggm.js";
+import { cn as r } from "@ryuzaki13/react-foundation-lib/utils";
+import { jsx as i } from "react/jsx-runtime";
+var a = { textarea: "TjY2iu" };
+//#endregion
+//#region src/textarea/Textarea.tsx
+function o({ label: o, description: s, className: c, disabled: l, size: u, value: d, onChange: f, error: p, onClearError: m, id: h, ...g }) {
+	let { controlId: _, labelId: v, descriptionId: y, errorId: b, describedBy: x } = t({
+		id: h,
+		hasLabel: o != null,
+		hasDescription: !!s,
+		hasError: !!p
+	});
+	return /* @__PURE__ */ i(n, {
+		label: o,
+		description: s,
+		disabled: l,
+		size: u,
+		error: p,
+		controlId: _,
+		labelId: v,
+		descriptionId: y,
+		errorId: b,
+		children: /* @__PURE__ */ i("textarea", {
+			...g,
+			id: _,
+			disabled: l,
+			value: d,
+			"aria-invalid": !!p || void 0,
+			"aria-labelledby": v,
+			"aria-describedby": x,
+			"data-invalid": p ? "" : void 0,
+			className: r(e.uiControl, a.textarea, "scrollable", c),
+			onChange: (e) => {
+				f?.(e.target.value), p && m && m();
+			}
+		})
+	});
+}
+//#endregion
+export { o as Textarea };
+
+//# sourceMappingURL=index.js.map

package/dist/textarea/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../src/textarea/Textarea.module.scss","../../src/textarea/Textarea.tsx"],"sourcesContent":[".textarea {\n\twidth: 100%;\n\tmin-height: 6em;\n\tresize: vertical;\n\tpadding: var(--space-sm);\n\tdisplay: block;\n}\n","import { TextareaHTMLAttributes } from \"react\";\n\nimport { cn } from \"@ryuzaki13/react-foundation-lib/utils\";\n\nimport { InputUI, useInputFieldIds } from \"../input\";\nimport { UiBaseProps } from \"../types\";\nimport uiStyles from \"../ui.module.scss\";\n\nimport styles from \"./Textarea.module.scss\";\n\nexport interface TextareaProps\n\textends Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, \"children\" | \"onChange\" | \"size\" | \"value\">, UiBaseProps<string> {\n\terror?: string;\n\tonClearError?: () => void;\n}\n\n/**\n * Многострочное текстовое поле для ввода свободного текста. Поддерживает подпись, описание, ошибки и единый визуальный стиль формы.\n */\nexport function Textarea({\n\tlabel,\n\tdescription,\n\tclassName,\n\tdisabled,\n\tsize,\n\tvalue,\n\tonChange,\n\terror,\n\tonClearError,\n\tid: externalId,\n\t...props\n}: TextareaProps) {\n\tconst { controlId, labelId, descriptionId, errorId, describedBy } = useInputFieldIds({\n\t\tid: externalId,\n\t\thasLabel: label !== undefined && label !== null,\n\t\thasDescription: !!description,\n\t\thasError: !!error\n\t});\n\n\treturn (\n\t\t<InputUI\n\t\t\tlabel={label}\n\t\t\tdescription={description}\n\t\t\tdisabled={disabled}\n\t\t\tsize={size}\n\t\t\terror={error}\n\t\t\tcontrolId={controlId}\n\t\t\tlabelId={labelId}\n\t\t\tdescriptionId={descriptionId}\n\t\t\terrorId={errorId}>\n\t\t\t<textarea\n\t\t\t\t{...props}\n\t\t\t\tid={controlId}\n\t\t\t\tdisabled={disabled}\n\t\t\t\tvalue={value}\n\t\t\t\taria-invalid={!!error || undefined}\n\t\t\t\taria-labelledby={labelId}\n\t\t\t\taria-describedby={describedBy}\n\t\t\t\tdata-invalid={error ? \"\" : undefined}\n\t\t\t\tclassName={cn(uiStyles.uiControl, styles.textarea, \"scrollable\", className)}\n\t\t\t\tonChange={(event) => {\n\t\t\t\t\tonChange?.(event.target.value);\n\t\t\t\t\tif (error && onClearError) {\n\t\t\t\t\t\tonClearError();\n\t\t\t\t\t}\n\t\t\t\t}}\n\t\t\t/>\n\t\t</InputUI>\n\t);\n}\n"],"mappings":";;;;;;;ACmBA,SAAgB,EAAS,EACxB,UACA,gBACA,cACA,aACA,SACA,UACA,aACA,UACA,iBACA,IAAI,GACJ,GAAG,KACc;CACjB,IAAM,EAAE,cAAW,YAAS,kBAAe,YAAS,mBAAgB,EAAiB;EACpF,IAAI;EACJ,UAAU,KAAiC;EAC3C,gBAAgB,CAAC,CAAC;EAClB,UAAU,CAAC,CAAC;CACb,CAAC;CAED,OACC,kBAAC,GAAD;EACQ;EACM;EACH;EACJ;EACC;EACI;EACF;EACM;EACN;YACT,kBAAC,YAAD;GACC,GAAI;GACJ,IAAI;GACM;GACH;GACP,gBAAc,CAAC,CAAC,KAAS,KAAA;GACzB,mBAAiB;GACjB,oBAAkB;GAClB,gBAAc,IAAQ,KAAK,KAAA;GAC3B,WAAW,EAAG,EAAS,WAAW,EAAO,UAAU,cAAc,CAAS;GAC1E,WAAW,MAAU;IAEpB,AADA,IAAW,EAAM,OAAO,KAAK,GACzB,KAAS,KACZ,EAAa;GAEf;EACA,CAAA;CACO,CAAA;AAEX"}