@adgytec/adgytec-web-ui-components 2.0.0 → 2.1.1

package/dist/chunks/Input2

@@ -1,5 +1,5 @@
-import { t as e } from "./Icon";
-import { t } from "./base";
+import { t as e } from "./base";
+import { t } from "./Icon";
 import { IconButton as n } from "../components/Button/IconButton/index.js";
 import { t as r } from "./usePress";
 import { Description as i } from "../components/Input/Description/index.js";
@@ -10,12 +10,12 @@ import { n as m, t as h } from "./useHover";
 import { CharacterCount as g } from "../components/Input/CharacterCount/index.js";
 import { useControllableState as _ } from "../components/Input/hooks/index.js";
 import v from "clsx";
-import { Input as y, TextField as b } from "react-aria-components";
-import { Fragment as x, jsx as S, jsxs as C } from "react/jsx-runtime";
-import { cloneElement as w, isValidElement as T, useCallback as E, useMemo as D, useRef as O } from "react";
+import { cloneElement as y, isValidElement as b, useCallback as x, useMemo as S, useRef as C } from "react";
+import { Fragment as w, jsx as T, jsxs as E } from "react/jsx-runtime";
+import { Input as D, TextField as O } from "react-aria-components";
 import '../assets/Input2.css';//#region node_modules/react-aria/dist/private/utils/useObjectRef.mjs
 function k(e) {
-	let t = O(null), n = O(void 0), r = E((t) => {
+	let t = C(null), n = C(void 0), r = x((t) => {
 		if (typeof e == "function") {
 			let n = e, r = n(t);
 			return () => {
@@ -25,7 +25,7 @@ function k(e) {
 			e.current = null;
 		};
 	}, [e]);
-	return D(() => ({
+	return S(() => ({
 		get current() {
 			return t.current;
 		},
@@ -34,7 +34,7 @@ function k(e) {
 		}
 	}), [r]);
 }
-var A = { button: "_button_650ys_2" }, j = ({ icon: e, className: t, ...r }) => /* @__PURE__ */ S(n, {
+var A = { button: "_button_650ys_2" }, j = ({ icon: e, className: t, ...r }) => /* @__PURE__ */ T(n, {
 	className: (e) => v(A.button, typeof t == "function" ? t(e) : t),
 	icon: e,
 	color: "standard",
@@ -45,14 +45,14 @@ var A = { button: "_button_650ys_2" }, j = ({ icon: e, className: t, ...r }) =>
 //#endregion
 //#region src/components/Input/Input/handleInputButton.ts
 function M({ node: e, isInvalid: t, isDisabled: n }) {
-	return !T(e) || e.type !== j ? e : w(e, {
+	return !b(e) || e.type !== j ? e : y(e, {
 		"data-invalid": t || void 0,
 		isDisabled: n
 	});
 }
 //#endregion
 //#region src/components/Input/Input/Input.tsx
-var N = ({ label: n, description: w, errorMessage: T, showDescriptionOnInvalid: E = !1, placeholder: D, editorDir: O, prefix: A, suffix: j, leadingIcon: N, trailing: P, className: F, showCharacterCount: I, maxLength: L, value: R, defaultValue: z, ref: B, onChange: V, ...H }) => {
+var N = ({ label: n, description: y, errorMessage: b, showDescriptionOnInvalid: x = !1, placeholder: S, editorDir: C, prefix: A, suffix: j, leadingIcon: N, trailing: P, className: F, showCharacterCount: I, maxLength: L, value: R, defaultValue: z, ref: B, onChange: V, ...H }) => {
 	let U = k(B), { currentValue: W, setValue: G } = _({
 		value: R,
 		defaultValue: z,
@@ -63,7 +63,7 @@ var N = ({ label: n, description: w, errorMessage: T, showDescriptionOnInvalid:
 		"data-trailing": P ? !0 : void 0,
 		"data-leading": N ? !0 : void 0
 	};
-	return /* @__PURE__ */ S(b, {
+	return /* @__PURE__ */ T(O, {
 		className: (e) => v(d, c, typeof F == "function" ? F(e) : F),
 		maxLength: L,
 		value: R,
@@ -79,33 +79,33 @@ var N = ({ label: n, description: w, errorMessage: T, showDescriptionOnInvalid:
 				"data-focus-visible": q || void 0,
 				"data-disabled": r || void 0,
 				"data-invalid": c || void 0
-			}, m = w && (!c || c && E);
-			return /* @__PURE__ */ C(x, { children: [
-				n && /* @__PURE__ */ S(o, { children: n }),
-				/* @__PURE__ */ C("span", {
+			}, m = y && (!c || c && x);
+			return /* @__PURE__ */ E(w, { children: [
+				n && /* @__PURE__ */ T(o, { children: n }),
+				/* @__PURE__ */ E("span", {
 					...Z,
 					...X,
 					...d,
 					className: v(p),
 					"data-input": !0,
 					children: [
-						N && /* @__PURE__ */ S(e, {
+						N && /* @__PURE__ */ T(t, {
 							icon: N,
 							size: 24
 						}),
-						/* @__PURE__ */ C("span", {
-							className: v(s, t.bodyLarge),
+						/* @__PURE__ */ E("span", {
+							className: v(s, e.bodyLarge),
 							children: [
 								A && typeof A == "function" ? A({
 									isDisabled: r,
 									isInvalid: c
 								}) : A,
-								/* @__PURE__ */ S(y, {
+								/* @__PURE__ */ T(D, {
 									ref: U,
-									className: v(l, f, t.bodyLarge),
+									className: v(l, f, e.bodyLarge),
 									...J,
-									placeholder: D,
-									dir: O,
+									placeholder: S,
+									dir: C,
 									"data-input": !0
 								}),
 								j && typeof j == "function" ? j({
@@ -124,25 +124,25 @@ var N = ({ label: n, description: w, errorMessage: T, showDescriptionOnInvalid:
 						})
 					]
 				}),
-				m && /* @__PURE__ */ C("span", {
+				m && /* @__PURE__ */ E("span", {
 					...Q,
 					className: v(u),
-					children: [/* @__PURE__ */ S(i, { children: w }), I && /* @__PURE__ */ S(g, {
+					children: [/* @__PURE__ */ T(i, { children: y }), I && /* @__PURE__ */ T(g, {
 						count: W.length,
 						maxLength: L
 					})]
 				}),
-				!m && I && /* @__PURE__ */ C("span", {
+				!m && I && /* @__PURE__ */ E("span", {
 					...Q,
 					className: v(u),
-					children: [/* @__PURE__ */ S(a, { children: T }), /* @__PURE__ */ S(g, {
+					children: [/* @__PURE__ */ T(a, { children: b }), /* @__PURE__ */ T(g, {
 						count: W.length,
 						maxLength: L
 					})]
 				}),
-				m || !I ? /* @__PURE__ */ S(a, {
+				m || !I ? /* @__PURE__ */ T(a, {
 					className: v(u),
-					children: T
+					children: b
 				}) : null
 			] });
 		}

package/dist/chunks/Modal

@@ -1,7 +1,7 @@
 import e from "clsx";
-import { Modal as t } from "react-aria-components";
-import { jsx as n } from "react/jsx-runtime";
-import '../assets/Modal.css';var r = { modal: "_modal_1sjxc_2" }, i = ({ className: i, ...a }) => /* @__PURE__ */ n(t, {
+import { jsx as t } from "react/jsx-runtime";
+import { Modal as n } from "react-aria-components";
+import '../assets/Modal.css';var r = { modal: "_modal_1sjxc_2" }, i = ({ className: i, ...a }) => /* @__PURE__ */ t(n, {
 	className: (t) => e(r.modal, typeof i == "function" ? i(t) : i),
 	...a
 });

package/dist/chunks/ModalOverlay

@@ -1,7 +1,7 @@
 import e from "clsx";
-import { ModalOverlay as t } from "react-aria-components";
-import { jsx as n } from "react/jsx-runtime";
-import '../assets/ModalOverlay.css';var r = { overlay: "_overlay_jlm1y_8" }, i = ({ className: i, ...a }) => /* @__PURE__ */ n(t, {
+import { jsx as t } from "react/jsx-runtime";
+import { ModalOverlay as n } from "react-aria-components";
+import '../assets/ModalOverlay.css';var r = { overlay: "_overlay_jlm1y_8" }, i = ({ className: i, ...a }) => /* @__PURE__ */ t(n, {
 	className: (t) => e(r.overlay, typeof i == "function" ? i(t) : i),
 	...a
 });

package/dist/chunks/Navigation

@@ -0,0 +1,68 @@
+import { n as e, r as t, t as n } from "./NavigationState";
+import { t as r } from "./base";
+import { IconButton as i } from "../components/Button/IconButton/index.js";
+import { useInDialog as a } from "../components/Dialog/core/index.js";
+import { a as o, i as s, n as c } from "./core8";
+import { t as l } from "./NavigationScrollContainer";
+import { t as u } from "./navContext";
+import d from "clsx";
+import { createContext as f, useContext as p, useState as m } from "react";
+import { jsx as h, jsxs as g } from "react/jsx-runtime";
+import { Header as _, Heading as v, Provider as y } from "react-aria-components";
+import { X as b } from "lucide-react";
+import '../assets/Navigation.css';var x = { container: "_container_npu2b_2" }, S = f(null);
+function C() {
+	let e = p(S);
+	if (e === null) throw Error("Missing navigation rendering info. Ensure this component is rendered within Navigation component.");
+	return e;
+}
+//#endregion
+//#region src/components/Navigation/Navigation/Navigation.tsx
+var w = ({ label: e, children: n, className: f, isLinkActive: p, isButtonActive: C, stateID: w = "__root__", inert: T, style: E, containerClassName: D, ...O }) => {
+	let [k, A] = m(null), { isInert: j } = t(), M = a(), N = M || !!e || !1;
+	return /* @__PURE__ */ h(y, {
+		values: [
+			[S, { container: k }],
+			[u, {
+				isLinkActive: p,
+				isButtonActive: C
+			}],
+			[c, {
+				id: w,
+				depth: 0
+			}]
+		],
+		children: /* @__PURE__ */ h("div", {
+			ref: A,
+			className: d(x.container, D),
+			children: /* @__PURE__ */ g("nav", {
+				className: d(o, f),
+				...O,
+				"data-header": N || void 0,
+				style: {
+					...E,
+					zIndex: 1
+				},
+				inert: T ?? j(0),
+				"data-modal": M || void 0,
+				children: [N && /* @__PURE__ */ g(_, {
+					className: d(s),
+					children: [e && /* @__PURE__ */ h(v, {
+						className: d(r.titleLarge),
+						"data-heading": !0,
+						children: e
+					}), M && /* @__PURE__ */ h(i, {
+						icon: b,
+						color: "standard",
+						slot: "close",
+						"data-close-button": !0
+					})]
+				}), /* @__PURE__ */ h(l, { children: n })]
+			})
+		})
+	});
+}, T = (t) => p(e) === null ? /* @__PURE__ */ h(n, { children: /* @__PURE__ */ h(w, { ...t }) }) : /* @__PURE__ */ h(w, { ...t });
+//#endregion
+export { S as n, C as r, T as t };
+
+//# sourceMappingURL=Navigation.map

package/dist/chunks/Navigation.map

@@ -0,0 +1 @@
+{"version":3,"file":"Navigation","names":[],"sources":["../../src/components/Navigation/Navigation/navigation.module.css","../../src/components/Navigation/Navigation/navRenderingContext.ts","../../src/components/Navigation/Navigation/Navigation.tsx"],"sourcesContent":["@layer adgytec.comps {\n    .container {\n        --_md-navigation-items-gap: var(--md-sys-layout-space-4);\n\n        position: relative;\n        border-radius: inherit;\n        overflow: clip;\n    }\n}\n","import { createContext, useContext } from \"react\";\n\nexport type NavigationRenderingContextType = {\n    container: HTMLDivElement | null;\n};\n\nexport const NavigationRenderingContext =\n    createContext<NavigationRenderingContextType | null>(null);\n\nexport function useNavigationContainer() {\n    const container = useContext(NavigationRenderingContext);\n    if (container === null) {\n        throw new Error(\n            \"Missing navigation rendering info. Ensure this component is rendered within Navigation component.\"\n        );\n    }\n\n    return container;\n}\n","import clsx from \"clsx\";\nimport { X } from \"lucide-react\";\nimport { useContext, useState } from \"react\";\nimport { Header, Heading, Provider } from \"react-aria-components\";\nimport { IconButton } from \"@/components/Button\";\nimport { useInDialog } from \"@/components/Dialog\";\nimport { typography } from \"@/utils\";\nimport {\n    NavigationHeaderStyles,\n    NavigationInfoContext,\n    NavigationStyles,\n} from \"../core\";\nimport { NavigationScrollContainer } from \"../NavigationScrollContainer\";\nimport {\n    NavigationState,\n    NavigationStateContext,\n    useNavigationState,\n} from \"../NavigationState\";\nimport { NavigationContext } from \"./navContext\";\nimport styles from \"./navigation.module.css\";\nimport { NavigationRenderingContext } from \"./navRenderingContext\";\nimport type { NavigationProps } from \"./types\";\n\nconst Nav: React.FC<NavigationProps> = ({\n    label,\n    children,\n    className,\n    isLinkActive,\n    isButtonActive,\n    stateID = \"__root__\",\n    inert,\n    style,\n    containerClassName,\n    ...props\n}) => {\n    const depth = 0;\n\n    const [container, setContainer] = useState<HTMLDivElement | null>(null);\n    const { isInert } = useNavigationState();\n\n    const isInModal = useInDialog();\n    const renderHeader = isInModal || !!label || false;\n\n    return (\n        <Provider\n            values={[\n                [NavigationRenderingContext, { container }],\n                [NavigationContext, { isLinkActive, isButtonActive }],\n                [NavigationInfoContext, { id: stateID, depth }],\n            ]}\n        >\n            <div\n                ref={setContainer}\n                className={clsx(styles[\"container\"], containerClassName)}\n            >\n                <nav\n                    className={clsx(NavigationStyles, className)}\n                    {...props}\n                    data-header={renderHeader || undefined}\n                    style={{\n                        ...style,\n                        zIndex: depth + 1,\n                    }}\n                    inert={inert ?? isInert(depth)}\n                    data-modal={isInModal || undefined}\n                >\n                    {renderHeader && (\n                        <Header className={clsx(NavigationHeaderStyles)}>\n                            {label && (\n                                <Heading\n                                    className={clsx(typography.titleLarge)}\n                                    data-heading\n                                >\n                                    {label}\n                                </Heading>\n                            )}\n\n                            {isInModal && (\n                                <IconButton\n                                    icon={X}\n                                    color=\"standard\"\n                                    slot=\"close\"\n                                    data-close-button\n                                />\n                            )}\n                        </Header>\n                    )}\n\n                    <NavigationScrollContainer>\n                        {children}\n                    </NavigationScrollContainer>\n                </nav>\n            </div>\n        </Provider>\n    );\n};\n\nexport const Navigation: React.FC<NavigationProps> = (props) => {\n    const navStateCtx = useContext(NavigationStateContext);\n\n    if (navStateCtx === null) {\n        return (\n            <NavigationState>\n                <Nav {...props} />\n            </NavigationState>\n        );\n    }\n\n    return <Nav {...props} />;\n};\n"],"mappings":";;;;;;;;;;;;6CCMa,IACT,EAAqD,IAAI;AAE7D,SAAgB,IAAyB;CACrC,IAAM,IAAY,EAAW,CAA0B;CACvD,IAAI,MAAc,MACd,MAAU,MACN,mGACJ;CAGJ,OAAO;AACX;;;ACKA,IAAM,KAAkC,EACpC,UACA,aACA,cACA,iBACA,mBACA,aAAU,YACV,UACA,UACA,uBACA,GAAG,QACD;CACF,IAEM,CAAC,GAAW,KAAgB,EAAgC,IAAI,GAChE,EAAE,eAAY,EAAmB,GAEjC,IAAY,EAAY,GACxB,IAAe,KAAa,CAAC,CAAC,KAAS;CAE7C,OACI,kBAAC,GAAD;EACI,QAAQ;GACJ,CAAC,GAA4B,EAAE,aAAU,CAAC;GAC1C,CAAC,GAAmB;IAAE;IAAc;GAAe,CAAC;GACpD,CAAC,GAAuB;IAAE,IAAI;IAAS;GAAM,CAAC;EAClD;YAEA,kBAAC,OAAD;GACI,KAAK;GACL,WAAW,EAAK,EAAO,WAAc,CAAkB;aAEvD,kBAAC,OAAD;IACI,WAAW,EAAK,GAAkB,CAAS;IAC3C,GAAI;IACJ,eAAa,KAAgB,KAAA;IAC7B,OAAO;KACH,GAAG;KACH,QAAQ;IACZ;IACA,OAAO,KAAS,EAAQ,CAAK;IAC7B,cAAY,KAAa,KAAA;cAT7B,CAWK,KACG,kBAAC,GAAD;KAAQ,WAAW,EAAK,CAAsB;eAA9C,CACK,KACG,kBAAC,GAAD;MACI,WAAW,EAAK,EAAW,UAAU;MACrC,gBAAA;gBAEC;KACI,CAAA,GAGZ,KACG,kBAAC,GAAD;MACI,MAAM;MACN,OAAM;MACN,MAAK;MACL,qBAAA;KACH,CAAA,CAED;QAGZ,kBAAC,GAAD,EACK,YACsB,CAAA,CAC1B;;EACJ,CAAA;CACC,CAAA;AAElB,GAEa,KAAyC,MAC9B,EAAW,CAE3B,MAAgB,OAEZ,kBAAC,GAAD,EAAA,UACI,kBAAC,GAAD,EAAK,GAAI,EAAQ,CAAA,EACJ,CAAA,IAIlB,kBAAC,GAAD,EAAK,GAAI,EAAQ,CAAA"}

package/dist/chunks/NavigationScrollContainer

@@ -0,0 +1,32 @@
+import { i as e, r as t } from "./NavigationState";
+import { r as n } from "./core8";
+import r from "clsx";
+import { useLayoutEffect as i } from "react";
+import { jsx as a } from "react/jsx-runtime";
+import { useObjectRef as o } from "react-aria";
+import '../assets/NavigationScrollContainer.css';var s = { container: "_container_iv0fl_2" }, c = ({ ref: c, className: l, ...u }) => {
+	let d = o(c), { registerNavigationContainer: f, saveNavigationScrollTopProgress: p } = t(), { id: m } = n();
+	return i(() => {
+		let e = d.current;
+		if (e) return f(m, e);
+	}, [
+		d,
+		m,
+		f
+	]), /* @__PURE__ */ a("div", {
+		ref: d,
+		onScroll: (t) => {
+			p(m, e({
+				scrollHeight: t.currentTarget.scrollHeight,
+				clientHeight: t.currentTarget.clientHeight,
+				scrollTop: t.currentTarget.scrollTop
+			}));
+		},
+		className: r(s.container, l),
+		...u
+	});
+};
+//#endregion
+export { c as t };
+
+//# sourceMappingURL=NavigationScrollContainer.map

package/dist/chunks/NavigationScrollContainer.map

@@ -0,0 +1 @@
+{"version":3,"file":"NavigationScrollContainer","names":[],"sources":["../../src/components/Navigation/NavigationScrollContainer/navigationScrollContainer.module.css","../../src/components/Navigation/NavigationScrollContainer/NavigationScrollContainer.tsx"],"sourcesContent":["@layer adgytec.comps {\n    .container {\n        padding-inline: var(--md-sys-layout-space-16);\n        overflow-y: auto;\n\n        display: grid;\n        gap: var(--_md-navigation-items-gap);\n        align-content: start;\n    }\n}\n","import clsx from \"clsx\";\nimport { useLayoutEffect } from \"react\";\nimport { useObjectRef } from \"react-aria\";\nimport { getScrollProgress } from \"@/utils\";\nimport { useNavigationInfo } from \"../core\";\nimport { useNavigationState } from \"../NavigationState\";\nimport styles from \"./navigationScrollContainer.module.css\";\n\nexport const NavigationScrollContainer: React.FC<\n    React.ComponentPropsWithRef<\"div\">\n> = ({ ref, className, ...props }) => {\n    const scrollContainerRef = useObjectRef(ref);\n\n    const { registerNavigationContainer, saveNavigationScrollTopProgress } =\n        useNavigationState();\n    const { id } = useNavigationInfo();\n\n    useLayoutEffect(() => {\n        const container = scrollContainerRef.current;\n        if (!container) {\n            return;\n        }\n\n        return registerNavigationContainer(id, container);\n    }, [scrollContainerRef, id, registerNavigationContainer]);\n\n    return (\n        <div\n            ref={scrollContainerRef}\n            onScroll={(e) => {\n                saveNavigationScrollTopProgress(\n                    id,\n                    getScrollProgress({\n                        scrollHeight: e.currentTarget.scrollHeight,\n                        clientHeight: e.currentTarget.clientHeight,\n                        scrollTop: e.currentTarget.scrollTop,\n                    })\n                );\n            }}\n            className={clsx(styles[\"container\"], className)}\n            {...props}\n        />\n    );\n};\n"],"mappings":";;;;;;6CCQa,KAER,EAAE,QAAK,cAAW,GAAG,QAAY;CAClC,IAAM,IAAqB,EAAa,CAAG,GAErC,EAAE,gCAA6B,uCACjC,EAAmB,GACjB,EAAE,UAAO,EAAkB;CAWjC,OATA,QAAsB;EAClB,IAAM,IAAY,EAAmB;EAChC,OAIL,OAAO,EAA4B,GAAI,CAAS;CACpD,GAAG;EAAC;EAAoB;EAAI;CAA2B,CAAC,GAGpD,kBAAC,OAAD;EACI,KAAK;EACL,WAAW,MAAM;GACb,EACI,GACA,EAAkB;IACd,cAAc,EAAE,cAAc;IAC9B,cAAc,EAAE,cAAc;IAC9B,WAAW,EAAE,cAAc;GAC/B,CAAC,CACL;EACJ;EACA,WAAW,EAAK,EAAO,WAAc,CAAS;EAC9C,GAAI;CACP,CAAA;AAET"}

package/dist/chunks/NavigationSection

@@ -0,0 +1,10 @@
+import e from "clsx";
+import { jsx as t } from "react/jsx-runtime";
+import '../assets/NavigationSection.css';var n = { section: "_section_1u3u0_2" }, r = ({ className: r, ...i }) => /* @__PURE__ */ t("section", {
+	className: e(n.section, r),
+	...i
+});
+//#endregion
+export { r as t };
+
+//# sourceMappingURL=NavigationSection.map

package/dist/chunks/NavigationSection.map

@@ -0,0 +1 @@
+{"version":3,"file":"NavigationSection","names":[],"sources":["../../src/components/Navigation/NavigationSection/NavigationSection/navigationSection.module.css","../../src/components/Navigation/NavigationSection/NavigationSection/NavigationSection.tsx"],"sourcesContent":["@layer adgytec.comps {\n    .section {\n        display: grid;\n        gap: var(--_md-navigation-items-gap);\n\n        margin-block-end: var(--md-sys-layout-space-16);\n    }\n}\n","import clsx from \"clsx\";\nimport styles from \"./navigationSection.module.css\";\n\nexport const NavigationSection: React.FC<\n    React.ComponentPropsWithRef<\"section\">\n> = ({ className, ...props }) => {\n    return (\n        <section className={clsx(styles[\"section\"], className)} {...props} />\n    );\n};\n"],"mappings":";;yCCGa,KAER,EAAE,cAAW,GAAG,QAEb,kBAAC,WAAD;CAAS,WAAW,EAAK,EAAO,SAAY,CAAS;CAAG,GAAI;AAAQ,CAAA"}

package/dist/chunks/NavigationSectionLabel

@@ -0,0 +1,12 @@
+import { t as e } from "./base";
+import t from "clsx";
+import { jsx as n } from "react/jsx-runtime";
+import { Heading as r } from "react-aria-components";
+import '../assets/NavigationSectionLabel.css';var i = { label: "_label_6sxxv_2" }, a = ({ className: a, ...o }) => /* @__PURE__ */ n(r, {
+	className: t(i.label, e.titleSmall, a),
+	...o
+});
+//#endregion
+export { a as t };
+
+//# sourceMappingURL=NavigationSectionLabel.map

package/dist/chunks/NavigationSectionLabel.map

@@ -0,0 +1 @@
+{"version":3,"file":"NavigationSectionLabel","names":[],"sources":["../../src/components/Navigation/NavigationSection/NavigationSectionLabel/navigationSectionLabel.module.css","../../src/components/Navigation/NavigationSection/NavigationSectionLabel/NavigationSectionLabel.tsx"],"sourcesContent":["@layer adgytec.comps {\n    .label {\n        --_md-navigation-section-label-color: var(\n            --md-navigation-section-label-color,\n            var(--md-sys-color-on-surface-variant)\n        );\n\n        padding-inline: var(--md-sys-layout-space-16);\n        padding-block-end: var(--md-sys-layout-space-4);\n\n        color: var(--_md-navigation-section-label-color);\n    }\n}\n","import clsx from \"clsx\";\nimport { Heading } from \"react-aria-components\";\nimport { typography } from \"@/utils\";\nimport styles from \"./navigationSectionLabel.module.css\";\n\nexport const NavigationSectionLabel: React.FC<\n    React.ComponentPropsWithRef<typeof Heading>\n> = ({ className, ...props }) => {\n    return (\n        <Heading\n            className={clsx(styles[\"label\"], typography.titleSmall, className)}\n            {...props}\n        />\n    );\n};\n"],"mappings":";;;;qCCKa,KAER,EAAE,cAAW,GAAG,QAEb,kBAAC,GAAD;CACI,WAAW,EAAK,EAAO,OAAU,EAAW,YAAY,CAAS;CACjE,GAAI;AACP,CAAA"}

package/dist/chunks/NavigationState

@@ -0,0 +1,69 @@
+import { createContext as e, useCallback as t, useContext as n, useRef as r, useState as i } from "react";
+import { jsx as a } from "react/jsx-runtime";
+//#region src/utils/scroll/scroll.ts
+function o({ scrollHeight: e, scrollTop: t, clientHeight: n }) {
+	let r = e - n;
+	return r <= 0 ? 0 : t / r;
+}
+function s({ scrollHeight: e, progress: t, clientHeight: n }) {
+	return t * (e - n);
+}
+//#endregion
+//#region src/components/Navigation/NavigationState/context.ts
+var c = e(null);
+function l() {
+	let e = n(c);
+	if (e === null) throw Error("Missing navigation state. Ensure this component is rendered within Navigation component.");
+	return e;
+}
+//#endregion
+//#region src/components/Navigation/NavigationState/NavigationState.tsx
+var u = ({ children: e }) => {
+	let [n, o] = i([]), l = r({}), u = r({}), d = t((e, t) => {
+		let n = l.current[e] ?? 0;
+		return t.scrollTop = s({
+			scrollHeight: t.scrollHeight,
+			clientHeight: t.clientHeight,
+			progress: n
+		}), u.current[e] ??= /* @__PURE__ */ new Set(), u.current[e].add(t), () => {
+			u.current[e]?.delete(t), u.current[e]?.size === 0 && delete u.current[e];
+		};
+	}, []);
+	return /* @__PURE__ */ a(c, {
+		value: {
+			openSubNavigation: t((e, t) => {
+				o((n) => [...n.filter((e) => e.depth < t), {
+					id: e,
+					depth: t
+				}]);
+			}, []),
+			closeSubNavigation: t((e) => {
+				let t = n.find((t) => t.id === e);
+				if (!t) return;
+				let r = n.filter((e) => e.depth >= t.depth);
+				for (let e of r) delete l.current[e.id];
+				o((e) => e.filter((e) => e.depth < t.depth));
+			}, [n]),
+			saveNavigationScrollTopProgress: t((e, t) => {
+				l.current[e] = t;
+				let n = u.current[e];
+				if (n) for (let e of n) {
+					let n = s({
+						scrollHeight: e.scrollHeight,
+						clientHeight: e.clientHeight,
+						progress: t
+					});
+					Math.abs(e.scrollTop - n) > 1 && (e.scrollTop = n);
+				}
+			}, []),
+			registerNavigationContainer: d,
+			isSubNavigationOpen: t((e) => n.some((t) => t.id === e), [n]),
+			isInert: t((e) => e < (n[n.length - 1]?.depth ?? 0), [n])
+		},
+		children: e
+	});
+};
+//#endregion
+export { s as a, o as i, c as n, l as r, u as t };
+
+//# sourceMappingURL=NavigationState.map

package/dist/chunks/NavigationState.map

@@ -0,0 +1 @@
+{"version":3,"file":"NavigationState","names":[],"sources":["../../src/utils/scroll/scroll.ts","../../src/components/Navigation/NavigationState/context.ts","../../src/components/Navigation/NavigationState/NavigationState.tsx"],"sourcesContent":["export function getScrollProgress({\n    scrollHeight,\n    scrollTop,\n    clientHeight,\n}: {\n    scrollTop: number;\n    scrollHeight: number;\n    clientHeight: number;\n}): number {\n    const maxScrollTop = scrollHeight - clientHeight;\n    return maxScrollTop <= 0 ? 0 : scrollTop / maxScrollTop;\n}\nexport function getScrollTopFromProgress({\n    scrollHeight,\n    progress,\n    clientHeight,\n}: {\n    progress: number;\n    scrollHeight: number;\n    clientHeight: number;\n}): number {\n    const maxScrollTop = scrollHeight - clientHeight;\n    return progress * maxScrollTop;\n}\n","import { createContext, useContext } from \"react\";\n\nexport type NavigationStateContextType = {\n    openSubNavigation: (id: string, depth: number) => void;\n    closeSubNavigation: (id: string) => void;\n    saveNavigationScrollTopProgress: (id: string, progress: number) => void;\n    registerNavigationContainer: (\n        id: string,\n        container: HTMLDivElement\n    ) => () => void;\n\n    isSubNavigationOpen: (id: string) => boolean;\n    isInert: (depth: number) => boolean;\n};\n\nexport const NavigationStateContext =\n    createContext<NavigationStateContextType | null>(null);\n\nexport function useNavigationState() {\n    const ctx = useContext(NavigationStateContext);\n    if (ctx === null) {\n        throw new Error(\n            \"Missing navigation state. Ensure this component is rendered within Navigation component.\"\n        );\n    }\n\n    return ctx;\n}\n","import { type ReactNode, useCallback, useRef, useState } from \"react\";\nimport { getScrollTopFromProgress } from \"@/utils\";\nimport { NavigationStateContext } from \"./context\";\nimport type { NavScrollInfo, SubNavItem } from \"./types\";\n\nexport const NavigationState: React.FC<{ children?: ReactNode }> = ({\n    children,\n}) => {\n    const [openSubNavs, setOpenSubNavs] = useState<SubNavItem[]>([]);\n    const navScrollRef = useRef<NavScrollInfo>({});\n    const navContainersRef = useRef<Record<string, Set<HTMLDivElement>>>({});\n\n    const registerNavigationContainer = useCallback(\n        (id: string, container: HTMLDivElement) => {\n            const progress = navScrollRef.current[id] ?? 0;\n\n            container.scrollTop = getScrollTopFromProgress({\n                scrollHeight: container.scrollHeight,\n                clientHeight: container.clientHeight,\n                progress,\n            });\n\n            navContainersRef.current[id] ??= new Set();\n            navContainersRef.current[id].add(container);\n\n            return () => {\n                navContainersRef.current[id]?.delete(container);\n\n                if (navContainersRef.current[id]?.size === 0) {\n                    delete navContainersRef.current[id];\n                }\n            };\n        },\n        []\n    );\n\n    const openSubNavigation = useCallback((id: string, depth: number) => {\n        setOpenSubNavs((prev) => [\n            ...prev.filter((item) => item.depth < depth),\n            { id, depth },\n        ]);\n    }, []);\n\n    const closeSubNavigation = useCallback(\n        (id: string) => {\n            const item = openSubNavs.find((x) => x.id === id);\n            if (!item) {\n                return;\n            }\n\n            const removedItems = openSubNavs.filter(\n                (x) => x.depth >= item.depth\n            );\n            for (const removedItem of removedItems) {\n                delete navScrollRef.current[removedItem.id];\n            }\n\n            setOpenSubNavs((prev) => prev.filter((x) => x.depth < item.depth));\n        },\n        [openSubNavs]\n    );\n\n    const saveNavigationScrollTopProgress = useCallback(\n        (id: string, progress: number) => {\n            navScrollRef.current[id] = progress;\n\n            const containers = navContainersRef.current[id];\n\n            if (!containers) {\n                return;\n            }\n\n            for (const container of containers) {\n                const targetScrollTop = getScrollTopFromProgress({\n                    scrollHeight: container.scrollHeight,\n                    clientHeight: container.clientHeight,\n                    progress,\n                });\n\n                if (Math.abs(container.scrollTop - targetScrollTop) > 1) {\n                    container.scrollTop = targetScrollTop;\n                }\n            }\n        },\n        []\n    );\n\n    const isSubNavigationOpen = useCallback(\n        (id: string) => {\n            return openSubNavs.some((item) => item.id === id);\n        },\n        [openSubNavs]\n    );\n\n    const isInert = useCallback(\n        (depth: number) => {\n            const activeDepth = openSubNavs[openSubNavs.length - 1]?.depth ?? 0;\n\n            return depth < activeDepth;\n        },\n        [openSubNavs]\n    );\n\n    return (\n        <NavigationStateContext\n            value={{\n                openSubNavigation,\n                closeSubNavigation,\n                saveNavigationScrollTopProgress,\n                registerNavigationContainer,\n                isSubNavigationOpen,\n                isInert,\n            }}\n        >\n            {children}\n        </NavigationStateContext>\n    );\n};\n"],"mappings":";;;AAAA,SAAgB,EAAkB,EAC9B,iBACA,cACA,mBAKO;CACP,IAAM,IAAe,IAAe;CACpC,OAAO,KAAgB,IAAI,IAAI,IAAY;AAC/C;AACA,SAAgB,EAAyB,EACrC,iBACA,aACA,mBAKO;CAEP,OAAO,KADc,IAAe;AAExC;;;ACRA,IAAa,IACT,EAAiD,IAAI;AAEzD,SAAgB,IAAqB;CACjC,IAAM,IAAM,EAAW,CAAsB;CAC7C,IAAI,MAAQ,MACR,MAAU,MACN,0FACJ;CAGJ,OAAO;AACX;;;ACtBA,IAAa,KAAuD,EAChE,kBACE;CACF,IAAM,CAAC,GAAa,KAAkB,EAAuB,CAAC,CAAC,GACzD,IAAe,EAAsB,CAAC,CAAC,GACvC,IAAmB,EAA4C,CAAC,CAAC,GAEjE,IAA8B,GAC/B,GAAY,MAA8B;EACvC,IAAM,IAAW,EAAa,QAAQ,MAAO;EAW7C,OATA,EAAU,YAAY,EAAyB;GAC3C,cAAc,EAAU;GACxB,cAAc,EAAU;GACxB;EACJ,CAAC,GAED,EAAiB,QAAQ,uBAAQ,IAAI,IAAI,GACzC,EAAiB,QAAQ,GAAI,IAAI,CAAS,SAE7B;GAGT,AAFA,EAAiB,QAAQ,IAAK,OAAO,CAAS,GAE1C,EAAiB,QAAQ,IAAK,SAAS,KACvC,OAAO,EAAiB,QAAQ;EAExC;CACJ,GACA,CAAC,CACL;CAqEA,OACI,kBAAC,GAAD;EACI,OAAO;GACH,mBAtEc,GAAa,GAAY,MAAkB;IACjE,GAAgB,MAAS,CACrB,GAAG,EAAK,QAAQ,MAAS,EAAK,QAAQ,CAAK,GAC3C;KAAE;KAAI;IAAM,CAChB,CAAC;GACL,GAAG,CAAC,CAiEQ;GACA,oBAhEe,GACtB,MAAe;IACZ,IAAM,IAAO,EAAY,MAAM,MAAM,EAAE,OAAO,CAAE;IAChD,IAAI,CAAC,GACD;IAGJ,IAAM,IAAe,EAAY,QAC5B,MAAM,EAAE,SAAS,EAAK,KAC3B;IACA,KAAK,IAAM,KAAe,GACtB,OAAO,EAAa,QAAQ,EAAY;IAG5C,GAAgB,MAAS,EAAK,QAAQ,MAAM,EAAE,QAAQ,EAAK,KAAK,CAAC;GACrE,GACA,CAAC,CAAW,CAgDJ;GACA,iCA9C4B,GACnC,GAAY,MAAqB;IAC9B,EAAa,QAAQ,KAAM;IAE3B,IAAM,IAAa,EAAiB,QAAQ;IAEvC,OAIL,KAAK,IAAM,KAAa,GAAY;KAChC,IAAM,IAAkB,EAAyB;MAC7C,cAAc,EAAU;MACxB,cAAc,EAAU;MACxB;KACJ,CAAC;KAED,AAAI,KAAK,IAAI,EAAU,YAAY,CAAe,IAAI,MAClD,EAAU,YAAY;IAE9B;GACJ,GACA,CAAC,CAwBO;GACA;GACA,qBAvBgB,GACvB,MACU,EAAY,MAAM,MAAS,EAAK,OAAO,CAAE,GAEpD,CAAC,CAAW,CAmBJ;GACA,SAjBI,GACX,MAGU,KAFa,EAAY,EAAY,SAAS,IAAI,SAAS,IAItE,CAAC,CAAW,CAWJ;EACJ;EAEC;CACmB,CAAA;AAEhC"}

package/dist/chunks/Popover

@@ -1,7 +1,7 @@
 import e from "clsx";
-import { Popover as t } from "react-aria-components";
-import { jsx as n } from "react/jsx-runtime";
-import '../assets/Popover.css';var r = { popover: "_popover_gsd0s_2" }, i = ({ className: i, ...a }) => /* @__PURE__ */ n(t, {
+import { jsx as t } from "react/jsx-runtime";
+import { Popover as n } from "react-aria-components";
+import '../assets/Popover.css';var r = { popover: "_popover_gsd0s_2" }, i = ({ className: i, ...a }) => /* @__PURE__ */ t(n, {
 	className: (t) => e(r.popover, typeof i == "function" ? i(t) : i),
 	...a
 });

package/dist/chunks/Radio

@@ -4,22 +4,22 @@ import { Description as n } from "../components/Input/Description/index.js";
 import { t as r } from "./FieldError";
 import { Label as i } from "../components/Input/Label/index.js";
 import { clsx as a } from "clsx";
-import { Radio as o, RadioGroup as s } from "react-aria-components";
+import { createContext as o, useContext as s } from "react";
 import { Fragment as c, jsx as l, jsxs as u } from "react/jsx-runtime";
-import { createContext as d, useContext as f } from "react";
+import { Radio as d, RadioGroup as f } from "react-aria-components";
 import '../assets/Radio.css';//#region src/components/Input/Radio/context.ts
-var p = d({}), m = {
+var p = o({}), m = {
 	"radio-group": "_radio-group_12t9w_15",
 	"radio-items": "_radio-items_12t9w_58",
 	radio: "_radio_12t9w_15",
 	"state-layer": "_state-layer_12t9w_149",
 	indicator: "_indicator_12t9w_169",
 	"indicator-icon": "_indicator-icon_12t9w_252"
-}, h = ({ className: n, children: r, labelPlacement: i, containerStateLayer: s, ...d }) => {
-	let { labelPlacement: h, containerStateLayer: g } = f(p), _ = i ?? h ?? "end", v = s ?? g ?? !1;
-	return /* @__PURE__ */ l(o, {
+}, h = ({ className: n, children: r, labelPlacement: i, containerStateLayer: o, ...f }) => {
+	let { labelPlacement: h, containerStateLayer: g } = s(p), _ = i ?? h ?? "end", v = o ?? g ?? !1;
+	return /* @__PURE__ */ l(d, {
 		className: (e) => a(m.radio, v && m["state-layer"], t.labelLarge, typeof n == "function" ? n(e) : n),
-		...d,
+		...f,
 		"data-radio": !0,
 		children: (t) => {
 			let { isSelected: n, isHovered: i, isDisabled: o, isFocused: s, isFocusVisible: d, isPressed: f, isInvalid: p } = t, h = {
@@ -46,24 +46,24 @@ var p = d({}), m = {
 			] });
 		}
 	});
-}, g = ({ label: e, description: t, errorMessage: o, showDescriptionOnInvalid: d = !1, children: f, className: h, radioItemsGap: g = 24, labelPlacement: _, containerStateLayer: v, ...y }) => /* @__PURE__ */ l(p, {
+}, g = ({ label: e, description: t, errorMessage: o, showDescriptionOnInvalid: s = !1, children: d, className: h, radioItemsGap: g = 24, labelPlacement: _, containerStateLayer: v, ...y }) => /* @__PURE__ */ l(p, {
 	value: {
 		labelPlacement: _,
 		containerStateLayer: v
 	},
-	children: /* @__PURE__ */ l(s, {
+	children: /* @__PURE__ */ l(f, {
 		className: (e) => a(m["radio-group"], typeof h == "function" ? h(e) : h),
 		...y,
 		"data-radio-group": !0,
-		children: ({ orientation: s, isInvalid: p }) => {
-			let h = t && (!p || p && d);
+		children: ({ orientation: f, isInvalid: p }) => {
+			let h = t && (!p || p && s);
 			return /* @__PURE__ */ u(c, { children: [
 				e && /* @__PURE__ */ l(i, { children: e }),
 				/* @__PURE__ */ l("div", {
-					"data-orientation": s,
+					"data-orientation": f,
 					className: a(m["radio-items"]),
 					style: { gap: `calc(${g} * var(--dp, 1px))` },
-					children: f
+					children: d
 				}),
 				h && /* @__PURE__ */ l(n, { children: t }),
 				/* @__PURE__ */ l(r, { children: o })

package/dist/chunks/SearchField

@@ -1,27 +1,27 @@
-import { t as e } from "./Icon";
-import { t } from "./base";
+import { t as e } from "./base";
+import { t } from "./Icon";
 import { IconButton as n } from "../components/Button/IconButton/index.js";
 import { clsx as r } from "clsx";
-import { Input as i, SearchField as a } from "react-aria-components";
-import { Fragment as o, jsx as s, jsxs as c } from "react/jsx-runtime";
+import { Fragment as i, jsx as a, jsxs as o } from "react/jsx-runtime";
+import { Input as s, SearchField as c } from "react-aria-components";
 import { Search as l, X as u } from "lucide-react";
 import '../assets/SearchField.css';var d = {
 	"search-field": "_search-field_dol97_10",
 	input: "_input_dol97_74"
-}, f = ({ placeholder: f = "Search", className: p, ...m }) => /* @__PURE__ */ s(a, {
+}, f = ({ placeholder: f = "Search", className: p, ...m }) => /* @__PURE__ */ a(c, {
 	className: (e) => r(d["search-field"], typeof p == "function" ? p(e) : p),
 	...m,
-	children: ({ isEmpty: a }) => /* @__PURE__ */ c(o, { children: [
-		/* @__PURE__ */ s(e, {
+	children: ({ isEmpty: c }) => /* @__PURE__ */ o(i, { children: [
+		/* @__PURE__ */ a(t, {
 			icon: l,
 			size: 24,
 			"data-search-icon": !0
 		}),
-		/* @__PURE__ */ s(i, {
-			className: r(d.input, t.bodyLarge),
+		/* @__PURE__ */ a(s, {
+			className: r(d.input, e.bodyLarge),
 			placeholder: f
 		}),
-		!a && /* @__PURE__ */ s(n, {
+		!c && /* @__PURE__ */ a(n, {
 			icon: u,
 			size: "small",
 			width: "default",

package/dist/chunks/SelectTrigger

@@ -1,26 +1,26 @@
-import { t as e } from "./Icon";
-import { t } from "./base";
+import { t as e } from "./base";
+import { t } from "./Icon";
 import { d as n, o as r, s as i } from "./core4";
 import a from "clsx";
-import { Button as o, SelectStateContext as s, SelectValue as c } from "react-aria-components";
-import { jsx as l, jsxs as u } from "react/jsx-runtime";
-import { ChevronDown as d } from "lucide-react";
-import { useContext as f } from "react";
+import { useContext as o } from "react";
+import { jsx as s, jsxs as c } from "react/jsx-runtime";
+import { Button as l, SelectStateContext as u, SelectValue as d } from "react-aria-components";
+import { ChevronDown as f } from "lucide-react";
 import '../assets/SelectTrigger.css';var p = {
 	trigger: "_trigger_pud16_2",
 	"select-value": "_select-value_pud16_37"
 }, m = (m) => {
-	let h = f(s)?.displayValidation.isInvalid;
-	return /* @__PURE__ */ u(o, {
-		className: a(n, i, r, t.bodyLarge, p.trigger),
+	let h = o(u)?.displayValidation.isInvalid;
+	return /* @__PURE__ */ c(l, {
+		className: a(n, i, r, e.bodyLarge, p.trigger),
 		...m,
 		"data-invalid": h || void 0,
 		"data-select-trigger": !0,
-		children: [/* @__PURE__ */ l(c, {
+		children: [/* @__PURE__ */ s(d, {
 			className: a(p["select-value"]),
 			children: ({ selectedText: e, isPlaceholder: t, defaultChildren: n }) => t ? n : e
-		}), /* @__PURE__ */ l(e, {
-			icon: d,
+		}), /* @__PURE__ */ s(t, {
+			icon: f,
 			size: 24
 		})]
 	});