@adgytec/adgytec-web-ui-components 2.3.0 → 2.3.1

package/dist/chunks/NavigationScrollContainer

@@ -8,10 +8,13 @@ import { useObjectRef as o } from "react-aria";
 import '../assets/NavigationScrollContainer.css';//#region src/utils/scroll/scroll.ts
 function s({ scrollHeight: e, scrollTop: t, clientHeight: n }) {
 	let r = e - n;
-	return r <= 0 ? 0 : t / r;
+	if (r <= 0) return 0;
+	let i = t / r;
+	return Math.min(1, Math.max(0, i));
 }
 function c({ scrollHeight: e, progress: t, clientHeight: n }) {
-	return t * (e - n);
+	let r = e - n;
+	return r <= 0 ? 0 : Math.min(1, Math.max(0, t)) * r;
 }
 //#endregion
 //#region src/components/Navigation/NavigationScrollContainer/navigationScrollContainer.module.css

package/dist/chunks/NavigationScrollContainer.map

@@ -1 +1 @@
-{"version":3,"file":"NavigationScrollContainer","names":["scrollContainerRef"],"sources":["../../src/utils/scroll/scroll.ts","../../src/components/Navigation/NavigationScrollContainer/navigationScrollContainer.module.css","../../src/components/Navigation/NavigationScrollContainer/NavigationScrollContainer.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}\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","@layer adgytec.comps {\n    .container {\n        padding-inline: var(--md-sys-layout-space-8);\n        margin-inline: var(--md-sys-layout-space-8);\n\n        border-radius: inherit;\n        overflow-y: auto;\n\n        display: grid;\n        gap: var(--_md-navigation-items-gap);\n        align-content: start;\n\n        &:focus-visible {\n            --focus-indicator-thickness: calc(3 * var(--dp, 1px));\n            --focus-indicator-offset: calc(2 * var(--dp, 1px));\n            --focus-indicator-color: var(--md-sys-color-secondary);\n\n            outline-width: var(--focus-indicator-thickness);\n            outline-style: solid;\n            outline-offset: var(--focus-indicator-offset);\n            outline-color: var(--focus-indicator-color);\n        }\n\n        /* 2dp for focus outline offset and 3dp for focus outline width + 1dp to prevent clipping */\n        padding-block: calc(6 * var(--dp, 1px));\n    }\n}\n","import clsx from \"clsx\";\nimport { useLayoutEffect } from \"react\";\nimport { useObjectRef } from \"react-aria\";\nimport { getScrollProgress, getScrollTopFromProgress } 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 { saveNavigationScrollTopProgress, getNavigationScrollProgress } =\n        useNavigationState();\n    const { id } = useNavigationInfo();\n\n    useLayoutEffect(() => {\n        const container = scrollContainerRef.current;\n        if (!container) {\n            return;\n        }\n\n        container.scrollTop = getScrollTopFromProgress({\n            scrollHeight: container.scrollHeight,\n            clientHeight: container.clientHeight,\n            progress: getNavigationScrollProgress(id),\n        });\n    }, [scrollContainerRef, id, getNavigationScrollProgress]);\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":";;;;;;;;AAAA,SAAgB,EAAkB,EAC9B,iBACA,cACA,mBAKO;CACP,IAAM,IAAe,IAAe;CACpC,OAAO,KAAgB,IAAI,IAAI,IAAY;AAC/C;AAEA,SAAgB,EAAyB,EACrC,iBACA,aACA,mBAKO;CAEP,OAAO,KADc,IAAe;AAExC;;;sDEhBa,KAET,MAAA;CAAA,IAAA,KAAA,GAAA,EAAA,EAAA,CAAA,EAAA,GAAA,GAAA,GAAA;CAAA,AAAA,EAAA,OAAA,KAA6B,IAAA,EAAA,IAAA,IAAA,EAAA,IAAA,IAAA,EAAA,OAA5B,0BAAA,KAAA,GAA4B,EAAA,KAAA,GAAA,EAAA,KAAA,GAAA,EAAA,KAAA,GAAA,EAAA,KAAA;CAC7B,IAAA,IAA2B,EAAa,CAAG,GAE3C,EAAA,oCAAA,mCACI,EAAmB,GACvB,EAAA,UAAe,EAAkB,GAAE,GAAA;CAEnC,AAFmC,EAAA,OAAA,KAAA,EAAA,OAAA,KAAA,EAAA,OAAA,KAEnB,UAAA;EACZ,IAAA,IAAkB,EAAkB;EAC/B,MAIL,EAAS,YAAa,EAAyB;GAAA,cAC7B,EAAS;GAAa,cACtB,EAAS;GAAa,UAC1B,EAA4B,CAAE;EAC5C,CAAC;CAJkB,GAKpB,IAAA;EAAC;EAAoB;EAAI;CAA2B,GAAC,EAAA,KAAA,GAAA,EAAA,KAAA,GAAA,EAAA,KAAA,GAAA,EAAA,KAAA,GAAA,EAAA,KAAA,MAAA,IAAA,EAAA,IAAA,IAAA,EAAA,KAXxD,EAAgB,GAWb,CAAqD;CAAC,IAAA;CAAA,AAAA,EAAA,OAAA,KAAA,EAAA,QAAA,KAKvC,KAAA,MAAA;EACN,EACI,GACA,EAAkB;GAAA,cACA,EAAC,cAAc;GAAa,cAC5B,EAAC,cAAc;GAAa,WAC/B,EAAC,cAAc;EAC9B,CAAC,CACL;CAAC,GACJ,EAAA,KAAA,GAAA,EAAA,MAAA,GAAA,EAAA,MAAA,KAAA,IAAA,EAAA;CAAA,IAAA;CAAA,AAAA,EAAA,QAAA,IAC8C,IAAA,EAAA,OAApC,IAAA,EAAK,EAAM,WAAe,CAAS,GAAC,EAAA,MAAA,GAAA,EAAA,MAAA;CAAA,IAAA;CAEjD,OAFiD,EAAA,QAAA,KAAA,EAAA,QAAA,KAAA,EAAA,QAAA,KAAA,EAAA,QAAA,KAZnD,IAAA,kBAAA,OAAA;EACSA,KAAA;EACK,UAAA;EAUC,WAAA;EAAoC,GAC3C;CAAK,CAAA,GACX,EAAA,MAAA,GAAA,EAAA,MAAA,GAAA,EAAA,MAAA,GAAA,EAAA,MAAA,GAAA,EAAA,MAAA,KAAA,IAAA,EAAA,KAdF;AAcE"}
+{"version":3,"file":"NavigationScrollContainer","names":["scrollContainerRef","_c","clsx","styles","require_compiler_runtime","useNavigationInfo","clsx$1","getScrollProgress","maxScrollTop","scrollHeight","clientHeight","rawProgress","scrollTop","getScrollTopFromProgress","progress","import_compiler_runtime","navigationScrollContainer_module_default","NavigationScrollContainer","$","className","props","ref","t0","scrollContainerRef","useObjectRef","useNavigationState","t1","t2","getNavigationScrollProgress","id","container","useLayoutEffect","t3","saveNavigationScrollTopProgress","t4","t5"],"sources":["../../src/utils/scroll/scroll.ts","../../src/components/Navigation/NavigationScrollContainer/navigationScrollContainer.module.css","../../src/components/Navigation/NavigationScrollContainer/NavigationScrollContainer.tsx"],"sourcesContent":["/**\n * Options for calculating normalized scroll progress.\n */\nexport interface ScrollProgressOptions {\n    /**\n     * Current vertical scroll position of the container in pixels (`element.scrollTop`).\n     */\n    scrollTop: number;\n    /**\n     * Total scrollable height of the container content in pixels (`element.scrollHeight`).\n     */\n    scrollHeight: number;\n    /**\n     * Inner height of the container viewport in pixels (`element.clientHeight`).\n     */\n    clientHeight: number;\n}\n\n/**\n * Calculates normalized vertical scroll progress as a ratio between `0` (top) and `1` (bottom).\n *\n * Automatically clamped between `0` and `1` to prevent out-of-bounds values caused by\n * elastic over-scrolling / rubber-banding on mobile (iOS/Safari) and trackpads.\n * If the container content is not scrollable (i.e. `scrollHeight <= clientHeight`), returns `0`.\n *\n * @param options - Container dimension and scroll position values.\n * @returns Normalized scroll progress clamped between `0` and `1`.\n *\n * @example\n * ```ts\n * const progress = getScrollProgress({\n *     scrollTop: element.scrollTop,\n *     scrollHeight: element.scrollHeight,\n *     clientHeight: element.clientHeight,\n * });\n * ```\n */\nexport function getScrollProgress({\n    scrollHeight,\n    scrollTop,\n    clientHeight,\n}: ScrollProgressOptions): number {\n    const maxScrollTop = scrollHeight - clientHeight;\n    if (maxScrollTop <= 0) {\n        return 0;\n    }\n    const rawProgress = scrollTop / maxScrollTop;\n    return Math.min(1, Math.max(0, rawProgress));\n}\n\n/**\n * Options for calculating vertical scroll position from a normalized progress ratio.\n */\nexport interface ScrollTopFromProgressOptions {\n    /**\n     * Normalized scroll progress ratio between `0` and `1`.\n     */\n    progress: number;\n    /**\n     * Total scrollable height of the container content in pixels (`element.scrollHeight`).\n     */\n    scrollHeight: number;\n    /**\n     * Inner height of the container viewport in pixels (`element.clientHeight`).\n     */\n    clientHeight: number;\n}\n\n/**\n * Calculates the target `scrollTop` in pixels from a normalized scroll progress ratio (`0` to `1`).\n *\n * Commonly used to restore saved scroll positions across renders, layout changes, or navigation state updates.\n * Guarantees a non-negative return value (`>= 0`), and clamps input progress to `[0, 1]`.\n *\n * @param options - Container dimensions and normalized progress value.\n * @returns The vertical scroll offset in pixels (`scrollTop`), guaranteed to be `>= 0`.\n *\n * @example\n * ```ts\n * element.scrollTop = getScrollTopFromProgress({\n *     progress: 0.5,\n *     scrollHeight: element.scrollHeight,\n *     clientHeight: element.clientHeight,\n * });\n * ```\n */\nexport function getScrollTopFromProgress({\n    scrollHeight,\n    progress,\n    clientHeight,\n}: ScrollTopFromProgressOptions): number {\n    const maxScrollTop = scrollHeight - clientHeight;\n    if (maxScrollTop <= 0) {\n        return 0;\n    }\n    const clampedProgress = Math.min(1, Math.max(0, progress));\n    return clampedProgress * maxScrollTop;\n}\n","@layer adgytec.comps {\n    .container {\n        padding-inline: var(--md-sys-layout-space-8);\n        margin-inline: var(--md-sys-layout-space-8);\n\n        border-radius: inherit;\n        overflow-y: auto;\n\n        display: grid;\n        gap: var(--_md-navigation-items-gap);\n        align-content: start;\n\n        &:focus-visible {\n            --focus-indicator-thickness: calc(3 * var(--dp, 1px));\n            --focus-indicator-offset: calc(2 * var(--dp, 1px));\n            --focus-indicator-color: var(--md-sys-color-secondary);\n\n            outline-width: var(--focus-indicator-thickness);\n            outline-style: solid;\n            outline-offset: var(--focus-indicator-offset);\n            outline-color: var(--focus-indicator-color);\n        }\n\n        /* 2dp for focus outline offset and 3dp for focus outline width + 1dp to prevent clipping */\n        padding-block: calc(6 * var(--dp, 1px));\n    }\n}\n","import clsx from \"clsx\";\nimport { useLayoutEffect } from \"react\";\nimport { useObjectRef } from \"react-aria\";\nimport { getScrollProgress, getScrollTopFromProgress } from \"@/utils\";\nimport { useNavigationInfo } from \"../core\";\nimport { useNavigationState } from \"../NavigationState\";\nimport styles from \"./navigationScrollContainer.module.css\";\n\n/**\n * Props for the [`NavigationScrollContainer`](file:///home/rohan/work/adgytec/adgytec-web-ui-components/src/components/Navigation/NavigationScrollContainer/NavigationScrollContainer.tsx) component.\n */\nexport interface NavigationScrollContainerProps\n    extends React.ComponentPropsWithRef<\"div\"> {}\n\n/**\n * Scrollable viewport container for navigation items and sections.\n *\n * Automatically records and restores scroll progress on mount and scroll events,\n * coordinating with [`NavigationState`](file:///home/rohan/work/adgytec/adgytec-web-ui-components/src/components/Navigation/NavigationState/NavigationState.tsx)\n * to keep scroll positions synchronized when navigating into and out of sub-menus.\n *\n * @example\n * ```tsx\n * <NavigationScrollContainer>\n *     <NavigationSection>\n *         <NavigationLink href=\"/\" label=\"Home\" />\n *     </NavigationSection>\n * </NavigationScrollContainer>\n * ```\n */\nexport const NavigationScrollContainer: React.FC<\n    NavigationScrollContainerProps\n> = ({ ref, className, ...props }) => {\n    const scrollContainerRef = useObjectRef(ref);\n\n    const { saveNavigationScrollTopProgress, getNavigationScrollProgress } =\n        useNavigationState();\n    const { id } = useNavigationInfo();\n\n    useLayoutEffect(() => {\n        const container = scrollContainerRef.current;\n        if (!container) {\n            return;\n        }\n\n        container.scrollTop = getScrollTopFromProgress({\n            scrollHeight: container.scrollHeight,\n            clientHeight: container.clientHeight,\n            progress: getNavigationScrollProgress(id),\n        });\n    }, [scrollContainerRef, id, getNavigationScrollProgress]);\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":";;;;;;;;AAqCA,SAAgBO,EAAkB,EAC9B,iBACA,cACA,mBAC8B;CAC9B,IAAMC,IAAeC,IAAeC;CACpC,IAAIF,KAAgB,GAChB,OAAO;CAEX,IAAMG,IAAcC,IAAYJ;CAChC,OAAO,KAAK,IAAI,GAAG,KAAK,IAAI,GAAGG,CAAW,CAAC;AAC/C;AAsCA,SAAgBE,EAAyB,EACrC,iBACA,aACA,mBACqC;CACrC,IAAML,IAAeC,IAAeC;CAKpC,OAJIF,KAAgB,IACT,IAEa,KAAK,IAAI,GAAG,KAAK,IAAI,GAAGM,CAAQ,CACjD,IAAkBN;AAC7B;;;sDEnEaS,KAET,MAAA;CAAA,IAAAC,KAAA,GAAAjB,EAAAA,EAAAA,CAAA,EAAA,GAAAkB,GAAAC,GAAAC;CAAA,AAAAH,EAAA,OAAAI,KAA6B,IAAAJ,EAAA,IAAA,IAAAA,EAAA,IAAA,IAAAA,EAAA,OAA5B,uBAAA,GAAAE,KAAAE,GAA4B,EAAA,KAAAA,GAAA,EAAA,KAAAH,GAAA,EAAA,KAAAC,GAAA,EAAA,KAAAC;CAC7B,IAAAE,IAA2BC,EAAaH,CAAG,GAE3C,EAAA,oCAAA,mCACII,EAAmB,GACvB,EAAA,UAAepB,EAAkB,GAAEqB,GAAAC;CAEnC,AAFmCT,EAAA,OAAAU,KAAAV,EAAA,OAAAW,KAAAX,EAAA,OAAAK,KAEnB,UAAA;EACZ,IAAAO,IAAkBP,EAAkB;EACpC,AAAKO,MAIL,EAAS,YAAajB,EAAyB;GAAA,cAC7BiB,EAAS;GAAa,cACtBA,EAAS;GAAa,UAC1BF,EAA4BC,CAAE;EAC5C,CAAC;CAJkB,GAKpB,IAAA;EAACN;EAAoBM;EAAID;CAA2B,GAAC,EAAA,KAAAA,GAAA,EAAA,KAAAC,GAAA,EAAA,KAAAN,GAAA,EAAA,KAAAG,GAAA,EAAA,KAAAC,MAAA,IAAAT,EAAA,IAAA,IAAAA,EAAA,KAXxDa,EAAgBL,GAWbC,CAAqD;CAAC,IAAAK;CAAA,AAAAd,EAAA,OAAAW,KAAAX,EAAA,QAAAe,KAKvC,KAAA,MAAA;EACN,EACIJ,GACAtB,EAAkB;GAAA,cACA,EAAC,cAAc;GAAa,cAC5B,EAAC,cAAc;GAAa,WAC/B,EAAC,cAAc;EAC9B,CAAC,CACL;CAAC,GACJ,EAAA,KAAAsB,GAAA,EAAA,MAAAI,GAAA,EAAA,MAAAD,KAAA,IAAAd,EAAA;CAAA,IAAAgB;CAAA,AAAAhB,EAAA,QAAAC,IAC8C,IAAAD,EAAA,OAApC,IAAAhB,EAAKC,EAAM,WAAegB,CAAS,GAAC,EAAA,MAAAA,GAAA,EAAA,MAAAe;CAAA,IAAAC;CAEjD,OAFiDjB,EAAA,QAAAE,KAAAF,EAAA,QAAAK,KAAAL,EAAA,QAAAc,KAAAd,EAAA,QAAAgB,KAZnD,IAAA,kBAAA,OAAA;EACSlC,KAAAuB;EACK,UAAAS;EAUC,WAAAE;EAAoC,GAC3Cd;CAAK,CAAA,GACX,EAAA,MAAAA,GAAA,EAAA,MAAAG,GAAA,EAAA,MAAAS,GAAA,EAAA,MAAAE,GAAA,EAAA,MAAAC,KAAA,IAAAjB,EAAA,KAdFiB;AAcE"}

package/dist/chunks/NavigationSection.map

@@ -1 +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":";;;;kDCGa,KAET,MAAA;CAAA,IAAA,KAAA,GAAA,EAAA,EAAA,CAAA,CAAA,GAAA,GAAA;CAAA,AAAA,EAAA,OAAA,KAAwB,IAAA,EAAA,IAAA,IAAA,EAAA,OAAvB,kBAAA,KAAA,GAAuB,EAAA,KAAA,GAAA,EAAA,KAAA,GAAA,EAAA,KAAA;CAAA,IAAA;CAAA,AAAA,EAAA,OAAA,IAEkC,IAAA,EAAA,MAAlC,IAAA,EAAK,EAAM,SAAa,CAAS,GAAC,EAAA,KAAA,GAAA,EAAA,KAAA;CAAA,IAAA;CAAe,OAAf,EAAA,OAAA,KAAA,EAAA,OAAA,KAAtD,IAAA,kBAAA,WAAA;EAAoB,WAAA;EAAkC,GAAM;CAAK,CAAA,GAAI,EAAA,KAAA,GAAA,EAAA,KAAA,GAAA,EAAA,KAAA,KAAA,IAAA,EAAA,IAArE;AAAqE"}
+{"version":3,"file":"NavigationSection","names":["_c","clsx","styles","require_compiler_runtime","clsx$1","import_compiler_runtime","navigationSection_module_default","NavigationSection","$","className","props","t0","t1","t2"],"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\n/**\n * Props for the [`NavigationSection`](file:///home/rohan/work/adgytec/adgytec-web-ui-components/src/components/Navigation/NavigationSection/NavigationSection/NavigationSection.tsx) component.\n */\nexport interface NavigationSectionProps\n    extends React.ComponentPropsWithRef<\"section\"> {}\n\n/**\n * Semantic container used to group related navigation items and an optional section heading.\n *\n * @example\n * ```tsx\n * import {\n *     NavigationSection,\n *     NavigationSectionLabel,\n *     NavigationLink,\n * } from \"@adgytec/web-ui-components\";\n * import { Settings } from \"lucide-react\";\n *\n * <NavigationSection>\n *     <NavigationSectionLabel>Preferences</NavigationSectionLabel>\n *     <NavigationLink href=\"/settings\" label=\"Settings\" icon={Settings} />\n * </NavigationSection>\n * ```\n */\nexport const NavigationSection: React.FC<NavigationSectionProps> = ({\n    className,\n    ...props\n}) => {\n    return (\n        <section className={clsx(styles[\"section\"], className)} {...props} />\n    );\n};\n"],"mappings":";;;;kDC2BaO,KAAsD,MAAA;CAAA,IAAAC,KAAA,GAAAR,EAAAA,EAAAA,CAAA,CAAA,GAAAS,GAAAC;CAAA,AAAAF,EAAA,OAAAG,KAGlE,IAAAH,EAAA,IAAA,IAAAA,EAAA,OAHmE,eAAA,GAAAE,KAAAC,GAGnE,EAAA,KAAAA,GAAA,EAAA,KAAAF,GAAA,EAAA,KAAAC;CAAA,IAAAE;CAAA,AAAAJ,EAAA,OAAAC,IAE6D,IAAAD,EAAA,MAAlC,IAAAP,EAAKC,EAAM,SAAaO,CAAS,GAAC,EAAA,KAAAA,GAAA,EAAA,KAAAG;CAAA,IAAAC;CAAe,OAAfL,EAAA,OAAAE,KAAAF,EAAA,OAAAI,KAAtD,IAAA,kBAAA,WAAA;EAAoB,WAAAA;EAAkC,GAAMF;CAAK,CAAA,GAAI,EAAA,KAAAA,GAAA,EAAA,KAAAE,GAAA,EAAA,KAAAC,KAAA,IAAAL,EAAA,IAArEK;AAAqE"}

package/dist/chunks/NavigationSectionLabel.map

@@ -1 +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":";;;;;;8CCKa,KAET,MAAA;CAAA,IAAA,KAAA,GAAA,EAAA,EAAA,CAAA,CAAA,GAAA,GAAA;CAAA,AAAA,EAAA,OAAA,KAAwB,IAAA,EAAA,IAAA,IAAA,EAAA,OAAvB,kBAAA,KAAA,GAAuB,EAAA,KAAA,GAAA,EAAA,KAAA,GAAA,EAAA,KAAA;CAAA,IAAA;CAAA,AAAA,EAAA,OAAA,IAGkD,IAAA,EAAA,MAAvD,IAAA,EAAK,EAAM,OAAW,EAAU,YAAa,CAAS,GAAC,EAAA,KAAA,GAAA,EAAA,KAAA;CAAA,IAAA;CAEpE,OAFoE,EAAA,OAAA,KAAA,EAAA,OAAA,KADtE,IAAA,kBAAC,GAAD;EACe,WAAA;EAAuD,GAC9D;CAAK,CAAA,GACX,EAAA,KAAA,GAAA,EAAA,KAAA,GAAA,EAAA,KAAA,KAAA,IAAA,EAAA,IAHF;AAGE"}
+{"version":3,"file":"NavigationSectionLabel","names":["_c","clsx","styles","require_compiler_runtime","clsx$1","import_compiler_runtime","navigationSectionLabel_module_default","NavigationSectionLabel","$","className","props","t0","t1","typography","t2","Heading"],"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\n/**\n * Props for the [`NavigationSectionLabel`](file:///home/rohan/work/adgytec/adgytec-web-ui-components/src/components/Navigation/NavigationSection/NavigationSectionLabel/NavigationSectionLabel.tsx) component.\n */\nexport interface NavigationSectionLabelProps\n    extends React.ComponentPropsWithRef<typeof Heading> {}\n\n/**\n * Styled title heading for a [`NavigationSection`](file:///home/rohan/work/adgytec/adgytec-web-ui-components/src/components/Navigation/NavigationSection/NavigationSection/NavigationSection.tsx).\n *\n * Rendered with Material Design 3 `titleSmall` typography and accessible heading semantics.\n *\n * @example\n * ```tsx\n * <NavigationSectionLabel>Workspaces</NavigationSectionLabel>\n * ```\n */\nexport const NavigationSectionLabel: React.FC<NavigationSectionLabelProps> = ({\n    className,\n    ...props\n}) => {\n    return (\n        <Heading\n            className={clsx(styles[\"label\"], typography.titleSmall, className)}\n            {...props}\n        />\n    );\n};\n"],"mappings":";;;;;;8CCqBaO,KAAgE,MAAA;CAAA,IAAAC,KAAA,GAAAR,EAAAA,EAAAA,CAAA,CAAA,GAAAS,GAAAC;CAAA,AAAAF,EAAA,OAAAG,KAG5E,IAAAH,EAAA,IAAA,IAAAA,EAAA,OAH6E,eAAA,GAAAE,KAAAC,GAG7E,EAAA,KAAAA,GAAA,EAAA,KAAAF,GAAA,EAAA,KAAAC;CAAA,IAAAE;CAAA,AAAAJ,EAAA,OAAAC,IAG6E,IAAAD,EAAA,MAAvD,IAAAP,EAAKC,EAAM,OAAWW,EAAU,YAAaJ,CAAS,GAAC,EAAA,KAAAA,GAAA,EAAA,KAAAG;CAAA,IAAAE;CAEpE,OAFoEN,EAAA,OAAAE,KAAAF,EAAA,OAAAI,KADtE,IAAA,kBAACG,GAAD;EACe,WAAAH;EAAuD,GAC9DF;CAAK,CAAA,GACX,EAAA,KAAAA,GAAA,EAAA,KAAAE,GAAA,EAAA,KAAAE,KAAA,IAAAN,EAAA,IAHFM;AAGE"}

package/dist/chunks/Popover.map

@@ -1 +1 @@
-{"version":3,"file":"Popover","names":[],"sources":["../../src/components/Popover/popover.module.css","../../src/components/Popover/Popover.tsx"],"sourcesContent":["@layer adgytec.comps {\n    .popover {\n        --_offset: calc(4 * var(--dp, 1px));\n\n        transform: translate3d(0, 0, 0);\n        transition:\n            transform var(--md-sys-motion-expressive-fast-spatial)\n            var(--md-sys-motion-expressive-fast-spatial-duration),\n            opacity var(--md-sys-motion-expressive-fast-effects)\n            var(--md-sys-motion-expressive-fast-effects-duration);\n\n        &[data-placement=\"bottom\"] {\n            --_origin: translateY(calc(-1 * var(--_offset)));\n        }\n\n        &[data-placement=\"top\"] {\n            --_origin: translateY(var(--_offset));\n        }\n\n        &[data-placement=\"right\"] {\n            --_origin: translateX(calc(-1 * var(--_offset)));\n        }\n\n        &[data-placement=\"left\"] {\n            --_origin: translateX(var(--_offset));\n        }\n\n        &[data-entering],\n        &[data-exiting] {\n            transform: var(--_origin);\n            opacity: 0;\n        }\n    }\n}\n","import clsx from \"clsx\";\nimport { Popover as AriaPopover } from \"react-aria-components\";\nimport styles from \"./popover.module.css\";\n\nexport const Popover: React.FC<\n    React.ComponentPropsWithRef<typeof AriaPopover>\n> = ({ className, ...props }) => {\n    return (\n        <AriaPopover\n            className={(renderProps) =>\n                clsx(\n                    styles[\"popover\"],\n                    typeof className === \"function\"\n                        ? className(renderProps)\n                        : className\n                )\n            }\n            {...props}\n        />\n    );\n};\n"],"mappings":";;;;;kDCIa,KAET,MAAA;CAAA,IAAA,KAAA,GAAA,EAAA,EAAA,CAAA,CAAA,GAAA,GAAA;CAAA,AAAA,EAAA,OAAA,KAAwB,IAAA,EAAA,IAAA,IAAA,EAAA,OAAvB,kBAAA,KAAA,GAAuB,EAAA,KAAA,GAAA,EAAA,KAAA,GAAA,EAAA,KAAA;CAAA,IAAA;CAAA,AAAA,EAAA,OAAA,IASX,IAAA,EAAA,MANM,KAAA,MACP,EACI,EAAM,SACN,OAAO,KAAc,aACf,EAAU,CACF,IAFd,CAGJ,GAAC,EAAA,KAAA,GAAA,EAAA,KAAA;CAAA,IAAA;CAGP,OAHO,EAAA,OAAA,KAAA,EAAA,OAAA,KAPT,IAAA,kBAAC,GAAD;EACe,WAAA;EAMN,GAED;CAAK,CAAA,GACX,EAAA,KAAA,GAAA,EAAA,KAAA,GAAA,EAAA,KAAA,KAAA,IAAA,EAAA,IAVF;AAUE"}
+{"version":3,"file":"Popover","names":["Popover","_c","clsx","styles","AriaPopover","require_compiler_runtime","clsx$1","import_compiler_runtime","popover_module_default","Popover$1","$","className","props","t0","t1","renderProps","t2","Popover"],"sources":["../../src/components/Popover/popover.module.css","../../src/components/Popover/Popover.tsx"],"sourcesContent":["@layer adgytec.comps {\n    .popover {\n        --_offset: calc(4 * var(--dp, 1px));\n\n        transform: translate3d(0, 0, 0);\n        transition:\n            transform var(--md-sys-motion-expressive-fast-spatial)\n            var(--md-sys-motion-expressive-fast-spatial-duration),\n            opacity var(--md-sys-motion-expressive-fast-effects)\n            var(--md-sys-motion-expressive-fast-effects-duration);\n\n        &[data-placement=\"bottom\"] {\n            --_origin: translateY(calc(-1 * var(--_offset)));\n        }\n\n        &[data-placement=\"top\"] {\n            --_origin: translateY(var(--_offset));\n        }\n\n        &[data-placement=\"right\"] {\n            --_origin: translateX(calc(-1 * var(--_offset)));\n        }\n\n        &[data-placement=\"left\"] {\n            --_origin: translateX(var(--_offset));\n        }\n\n        &[data-entering],\n        &[data-exiting] {\n            transform: var(--_origin);\n            opacity: 0;\n        }\n    }\n}\n","import clsx from \"clsx\";\nimport { Popover as AriaPopover } from \"react-aria-components\";\nimport styles from \"./popover.module.css\";\n\n/**\n * Props for the [`Popover`](file:///home/rohan/work/adgytec/adgytec-web-ui-components/src/components/Popover/Popover.tsx) component.\n *\n * Extends all properties from React Aria's `Popover`, including positioning (`placement`, `offset`, `crossOffset`),\n * portal containers, and entry/exit transition states.\n */\nexport interface PopoverProps\n    extends React.ComponentPropsWithRef<typeof AriaPopover> {}\n\n/**\n * Overlay surface container that presents content anchored to a trigger element.\n *\n * Built on React Aria's `Popover` with Material Design 3 surface colors, shadow elevation,\n * and built-in entry/exit animations responsive to placement directions.\n *\n * @example\n * ```tsx\n * import {\n *     Popover,\n *     Button,\n *     DialogTrigger,\n *     Dialog,\n * } from \"@adgytec/web-ui-components\";\n *\n * <DialogTrigger>\n *     <Button label=\"Open Popover\" />\n *     <Popover>\n *         <Dialog>\n *             <p>This is the content inside the popover.</p>\n *         </Dialog>\n *     </Popover>\n * </DialogTrigger>\n * ```\n */\nexport const Popover: React.FC<PopoverProps> = ({ className, ...props }) => {\n    return (\n        <AriaPopover\n            className={(renderProps) =>\n                clsx(\n                    styles[\"popover\"],\n                    typeof className === \"function\"\n                        ? className(renderProps)\n                        : className\n                )\n            }\n            {...props}\n        />\n    );\n};\n"],"mappings":";;;;;kDCsCaA,KAAkC,MAAA;CAAA,IAAAU,KAAA,GAAAT,EAAAA,EAAAA,CAAA,CAAA,GAAAU,GAAAC;CAAA,AAAAF,EAAA,OAAAG,KAAwB,IAAAH,EAAA,IAAA,IAAAA,EAAA,OAAvB,eAAA,GAAAE,KAAAC,GAAuB,EAAA,KAAAA,GAAA,EAAA,KAAAF,GAAA,EAAA,KAAAC;CAAA,IAAAE;CAAA,AAAAJ,EAAA,OAAAC,IAStD,IAAAD,EAAA,MANM,KAAA,MACPR,EACIC,EAAM,SACN,OAAOQ,KAAc,aACfA,EAAUI,CACF,IAFdJ,CAGJ,GAAC,EAAA,KAAAA,GAAA,EAAA,KAAAG;CAAA,IAAAE;CAGP,OAHON,EAAA,OAAAE,KAAAF,EAAA,OAAAI,KAPT,IAAA,kBAACV,GAAD;EACe,WAAAU;EAMN,GAEDF;CAAK,CAAA,GACX,EAAA,KAAAA,GAAA,EAAA,KAAAE,GAAA,EAAA,KAAAE,KAAA,IAAAN,EAAA,IAVFM;AAUE"}

package/dist/chunks/RadialGlowDecorator.map

@@ -1 +1 @@
-{"version":3,"file":"RadialGlowDecorator","names":[],"sources":["../../src/components/Decorators/RadialGlowDecorator/radialGlowDecorator.module.css","../../src/components/Decorators/RadialGlowDecorator/RadialGlowDecorator.tsx"],"sourcesContent":["@layer adgytec.comps {\n    .container {\n        position: fixed;\n        inset: 0;\n        pointer-events: none;\n        overflow: hidden;\n\n        /* Default Opacity (Light mode/Base defaults) - higher visibility */\n        --glow-opacity-18: 28%;\n        --glow-opacity-15: 24%;\n        --glow-opacity-14: 22%;\n        --glow-opacity-12: 20%;\n        --glow-opacity-10: 16%;\n        --glow-opacity-8: 12%;\n    }\n\n    :global([data-theme=\"dark\"]) .container,\n    :global([data-theme=\"dark-high-contrast\"]) .container,\n    :global([data-theme=\"dark-medium-contrast\"]) .container,\n    :global([data-theme=\"monochrome-dark\"]) .container {\n        --glow-opacity-18: 15%;\n        --glow-opacity-15: 12%;\n        --glow-opacity-14: 11%;\n        --glow-opacity-12: 10%;\n        --glow-opacity-10: 8%;\n        --glow-opacity-8: 6%;\n    }\n\n    @media (prefers-color-scheme: dark) {\n        .container {\n            --glow-opacity-18: 15%;\n            --glow-opacity-15: 12%;\n            --glow-opacity-14: 11%;\n            --glow-opacity-12: 10%;\n            --glow-opacity-10: 8%;\n            --glow-opacity-8: 6%;\n        }\n    }\n\n    :global([data-theme=\"light\"]) .container,\n    :global([data-theme=\"light-high-contrast\"]) .container,\n    :global([data-theme=\"light-medium-contrast\"]) .container,\n    :global([data-theme=\"monochrome-light\"]) .container {\n        --glow-opacity-18: 28%;\n        --glow-opacity-15: 24%;\n        --glow-opacity-14: 22%;\n        --glow-opacity-12: 20%;\n        --glow-opacity-10: 16%;\n        --glow-opacity-8: 12%;\n    }\n\n    .blob {\n        position: absolute;\n        border-radius: 50%;\n        filter: blur(180px);\n        pointer-events: none;\n        will-change: transform, filter;\n    }\n\n    /* DEFAULT VARIANT */\n    .default-primary {\n        inline-size: 50vmax;\n        block-size: 50vmax;\n        top: -10vmax;\n        left: -10vmax;\n        background-color: color-mix(\n            in srgb,\n            var(--md-sys-color-primary) var(--glow-opacity-15),\n            transparent\n        );\n    }\n\n    .default-secondary {\n        inline-size: 45vmax;\n        block-size: 45vmax;\n        bottom: -15vmax;\n        right: -10vmax;\n        background-color: color-mix(\n            in srgb,\n            var(--md-sys-color-tertiary) var(--glow-opacity-12),\n            transparent\n        );\n    }\n\n    .default-tertiary {\n        inline-size: 40vmax;\n        block-size: 40vmax;\n        top: 25vh;\n        right: 15vw;\n        background-color: color-mix(\n            in srgb,\n            var(--md-sys-color-secondary) var(--glow-opacity-10),\n            transparent\n        );\n    }\n\n    /* SPLIT VARIANT */\n    .split-left {\n        inline-size: 60vmax;\n        block-size: 60vmax;\n        top: 20vh;\n        left: -20vmax;\n        background-color: color-mix(\n            in srgb,\n            var(--md-sys-color-primary) var(--glow-opacity-12),\n            transparent\n        );\n    }\n\n    .split-right {\n        inline-size: 60vmax;\n        block-size: 60vmax;\n        top: 20vh;\n        right: -20vmax;\n        background-color: color-mix(\n            in srgb,\n            var(--md-sys-color-tertiary) var(--glow-opacity-10),\n            transparent\n        );\n    }\n\n    /* TOP-BAR VARIANT */\n    .top-bar-primary {\n        inline-size: 35vmax;\n        block-size: 20vmax;\n        top: -10vmax;\n        left: 10vw;\n        background-color: color-mix(\n            in srgb,\n            var(--md-sys-color-primary) var(--glow-opacity-18),\n            transparent\n        );\n    }\n\n    .top-bar-secondary {\n        inline-size: 35vmax;\n        block-size: 20vmax;\n        top: -10vmax;\n        left: 40vw;\n        background-color: color-mix(\n            in srgb,\n            var(--md-sys-color-tertiary) var(--glow-opacity-15),\n            transparent\n        );\n    }\n\n    .top-bar-tertiary {\n        inline-size: 35vmax;\n        block-size: 20vmax;\n        top: -10vmax;\n        left: 70vw;\n        background-color: color-mix(\n            in srgb,\n            var(--md-sys-color-secondary) var(--glow-opacity-12),\n            transparent\n        );\n    }\n\n    /* CORNERS VARIANT */\n    .corner-tl {\n        inline-size: 30vmax;\n        block-size: 30vmax;\n        top: -10vmax;\n        left: -10vmax;\n        background-color: color-mix(\n            in srgb,\n            var(--md-sys-color-primary) var(--glow-opacity-15),\n            transparent\n        );\n    }\n\n    .corner-tr {\n        inline-size: 30vmax;\n        block-size: 30vmax;\n        top: -10vmax;\n        right: -10vmax;\n        background-color: color-mix(\n            in srgb,\n            var(--md-sys-color-tertiary) var(--glow-opacity-12),\n            transparent\n        );\n    }\n\n    .corner-bl {\n        inline-size: 30vmax;\n        block-size: 30vmax;\n        bottom: -10vmax;\n        left: -10vmax;\n        background-color: color-mix(\n            in srgb,\n            var(--md-sys-color-secondary) var(--glow-opacity-12),\n            transparent\n        );\n    }\n\n    .corner-br {\n        inline-size: 30vmax;\n        block-size: 30vmax;\n        bottom: -10vmax;\n        right: -10vmax;\n        background-color: color-mix(\n            in srgb,\n            var(--md-sys-color-primary) var(--glow-opacity-10),\n            transparent\n        );\n    }\n\n    /* AURORA VARIANT */\n    .aurora-1 {\n        inline-size: 55vmax;\n        block-size: 40vmax;\n        top: -15vmax;\n        left: 5vw;\n        background-color: color-mix(\n            in srgb,\n            var(--md-sys-color-primary) var(--glow-opacity-12),\n            transparent\n        );\n        animation: aurora-float-1 25s ease-in-out infinite alternate;\n    }\n\n    .aurora-2 {\n        inline-size: 50vmax;\n        block-size: 45vmax;\n        top: -10vmax;\n        left: 30vw;\n        background-color: color-mix(\n            in srgb,\n            var(--md-sys-color-tertiary) var(--glow-opacity-10),\n            transparent\n        );\n        animation: aurora-float-2 22s ease-in-out infinite alternate;\n    }\n\n    .aurora-3 {\n        inline-size: 60vmax;\n        block-size: 40vmax;\n        top: -20vmax;\n        right: 5vw;\n        background-color: color-mix(\n            in srgb,\n            var(--md-sys-color-secondary) var(--glow-opacity-12),\n            transparent\n        );\n        animation: aurora-float-3 28s ease-in-out infinite alternate;\n    }\n\n    .aurora-4 {\n        inline-size: 45vmax;\n        block-size: 40vmax;\n        bottom: -15vmax;\n        left: 25vw;\n        background-color: color-mix(\n            in srgb,\n            var(--md-sys-color-primary) var(--glow-opacity-8),\n            transparent\n        );\n        animation: aurora-float-4 26s ease-in-out infinite alternate;\n    }\n\n    /* SPOTLIGHT VARIANT */\n    .spotlight-primary {\n        inline-size: 55vmax;\n        block-size: 55vmax;\n        top: 50%;\n        left: 50%;\n        transform: translate(-50%, -50%);\n        background-color: color-mix(\n            in srgb,\n            var(--md-sys-color-primary) var(--glow-opacity-14),\n            transparent\n        );\n        animation: spotlight-pulse-1 12s ease-in-out infinite alternate;\n    }\n\n    .spotlight-secondary {\n        inline-size: 45vmax;\n        block-size: 45vmax;\n        top: 50%;\n        left: 50%;\n        transform: translate(-50%, -50%);\n        background-color: color-mix(\n            in srgb,\n            var(--md-sys-color-tertiary) var(--glow-opacity-10),\n            transparent\n        );\n        animation: spotlight-pulse-2 16s ease-in-out infinite alternate;\n    }\n\n    .spotlight-tertiary {\n        inline-size: 35vmax;\n        block-size: 35vmax;\n        top: 50%;\n        left: 50%;\n        transform: translate(-50%, -50%);\n        background-color: color-mix(\n            in srgb,\n            var(--md-sys-color-secondary) var(--glow-opacity-8),\n            transparent\n        );\n        animation: spotlight-pulse-3 10s ease-in-out infinite alternate;\n    }\n\n    /* NEBULA VARIANT */\n    .nebula-1 {\n        inline-size: 65vmax;\n        block-size: 65vmax;\n        top: 10vh;\n        left: 10vw;\n        background-color: color-mix(\n            in srgb,\n            var(--md-sys-color-primary) var(--glow-opacity-12),\n            transparent\n        );\n        animation: nebula-drift-1 30s ease-in-out infinite;\n    }\n\n    .nebula-2 {\n        inline-size: 55vmax;\n        block-size: 55vmax;\n        bottom: 10vh;\n        right: 10vw;\n        background-color: color-mix(\n            in srgb,\n            var(--md-sys-color-tertiary) var(--glow-opacity-12),\n            transparent\n        );\n        animation: nebula-drift-2 35s ease-in-out infinite;\n    }\n\n    .nebula-3 {\n        inline-size: 50vmax;\n        block-size: 50vmax;\n        top: 30vh;\n        right: 15vw;\n        background-color: color-mix(\n            in srgb,\n            var(--md-sys-color-secondary) var(--glow-opacity-10),\n            transparent\n        );\n        animation: nebula-drift-3 28s ease-in-out infinite;\n    }\n\n    .nebula-4 {\n        inline-size: 45vmax;\n        block-size: 45vmax;\n        bottom: 20vh;\n        left: 15vw;\n        background-color: color-mix(\n            in srgb,\n            var(--md-sys-color-primary) var(--glow-opacity-8),\n            transparent\n        );\n        animation: nebula-drift-4 32s ease-in-out infinite;\n    }\n\n    /* HORIZON VARIANT */\n    .horizon-primary {\n        inline-size: 55vmax;\n        block-size: 30vmax;\n        bottom: -15vmax;\n        left: 10vw;\n        border-radius: 50% 50% 0 0;\n        background-color: color-mix(\n            in srgb,\n            var(--md-sys-color-primary) var(--glow-opacity-15),\n            transparent\n        );\n        animation: horizon-pulse-1 8s ease-in-out infinite alternate;\n    }\n\n    .horizon-secondary {\n        inline-size: 60vmax;\n        block-size: 35vmax;\n        bottom: -20vmax;\n        left: 30vw;\n        border-radius: 50% 50% 0 0;\n        background-color: color-mix(\n            in srgb,\n            var(--md-sys-color-tertiary) var(--glow-opacity-12),\n            transparent\n        );\n        animation: horizon-pulse-2 11s ease-in-out infinite alternate;\n    }\n\n    .horizon-tertiary {\n        inline-size: 50vmax;\n        block-size: 28vmax;\n        bottom: -18vmax;\n        right: 10vw;\n        border-radius: 50% 50% 0 0;\n        background-color: color-mix(\n            in srgb,\n            var(--md-sys-color-secondary) var(--glow-opacity-10),\n            transparent\n        );\n        animation: horizon-pulse-3 9s ease-in-out infinite alternate;\n    }\n\n    /* SPIRAL VARIANT */\n    .spiral-1 {\n        inline-size: 45vmax;\n        block-size: 45vmax;\n        top: calc(50% - 22.5vmax);\n        left: calc(50% - 22.5vmax);\n        background-color: color-mix(\n            in srgb,\n            var(--md-sys-color-primary) var(--glow-opacity-12),\n            transparent\n        );\n        animation: spiral-orbit-1 25s linear infinite;\n    }\n\n    .spiral-2 {\n        inline-size: 40vmax;\n        block-size: 40vmax;\n        top: calc(50% - 20vmax);\n        left: calc(50% - 20vmax);\n        background-color: color-mix(\n            in srgb,\n            var(--md-sys-color-tertiary) var(--glow-opacity-10),\n            transparent\n        );\n        animation: spiral-orbit-2 30s linear infinite;\n    }\n\n    .spiral-3 {\n        inline-size: 35vmax;\n        block-size: 35vmax;\n        top: calc(50% - 17.5vmax);\n        left: calc(50% - 17.5vmax);\n        background-color: color-mix(\n            in srgb,\n            var(--md-sys-color-secondary) var(--glow-opacity-10),\n            transparent\n        );\n        animation: spiral-orbit-3 20s linear infinite;\n    }\n}\n\n/* Animations for premium organic feeling */\n@keyframes aurora-float-1 {\n    0% {\n        transform: translate(0, 0) scale(1);\n    }\n    100% {\n        transform: translate(5vw, 5vh) scale(1.1);\n    }\n}\n\n@keyframes aurora-float-2 {\n    0% {\n        transform: translate(0, 0) scale(1.1);\n    }\n    100% {\n        transform: translate(-4vw, -6vh) scale(0.95);\n    }\n}\n\n@keyframes aurora-float-3 {\n    0% {\n        transform: translate(0, 0) scale(0.95);\n    }\n    100% {\n        transform: translate(6vw, -4vh) scale(1.05);\n    }\n}\n\n@keyframes aurora-float-4 {\n    0% {\n        transform: translate(0, 0) scale(1.05);\n    }\n    100% {\n        transform: translate(-5vw, 4vh) scale(1);\n    }\n}\n\n@keyframes spotlight-pulse-1 {\n    0% {\n        transform: translate(-50%, -50%) scale(0.9);\n    }\n    100% {\n        transform: translate(-50%, -50%) scale(1.1);\n    }\n}\n\n@keyframes spotlight-pulse-2 {\n    0% {\n        transform: translate(-48%, -52%) scale(1.1);\n    }\n    100% {\n        transform: translate(-52%, -48%) scale(0.9);\n    }\n}\n\n@keyframes spotlight-pulse-3 {\n    0% {\n        transform: translate(-52%, -48%) scale(0.95);\n    }\n    100% {\n        transform: translate(-48%, -52%) scale(1.05);\n    }\n}\n\n@keyframes nebula-drift-1 {\n    0% {\n        transform: translate(0, 0) scale(1) rotate(0deg);\n    }\n    33% {\n        transform: translate(10vw, 15vh) scale(1.15) rotate(120deg);\n    }\n    66% {\n        transform: translate(-10vw, 10vh) scale(0.9) rotate(240deg);\n    }\n    100% {\n        transform: translate(0, 0) scale(1) rotate(360deg);\n    }\n}\n\n@keyframes nebula-drift-2 {\n    0% {\n        transform: translate(0, 0) scale(1) rotate(0deg);\n    }\n    33% {\n        transform: translate(-15vw, -10vh) scale(0.9) rotate(-120deg);\n    }\n    66% {\n        transform: translate(5vw, -15vh) scale(1.1) rotate(-240deg);\n    }\n    100% {\n        transform: translate(0, 0) scale(1) rotate(-360deg);\n    }\n}\n\n@keyframes nebula-drift-3 {\n    0% {\n        transform: translate(0, 0) scale(1);\n    }\n    50% {\n        transform: translate(-8vw, 12vh) scale(1.2);\n    }\n    100% {\n        transform: translate(0, 0) scale(1);\n    }\n}\n\n@keyframes nebula-drift-4 {\n    0% {\n        transform: translate(0, 0) scale(1.1);\n    }\n    50% {\n        transform: translate(12vw, -10vh) scale(0.9);\n    }\n    100% {\n        transform: translate(0, 0) scale(1.1);\n    }\n}\n\n@keyframes horizon-pulse-1 {\n    0% {\n        transform: translateY(0) scale(0.95);\n    }\n    100% {\n        transform: translateY(-2vmax) scale(1.05);\n    }\n}\n\n@keyframes horizon-pulse-2 {\n    0% {\n        transform: translateY(0) scale(1.05);\n    }\n    100% {\n        transform: translateY(-3vmax) scale(0.95);\n    }\n}\n\n@keyframes horizon-pulse-3 {\n    0% {\n        transform: translateY(0) scale(0.9);\n    }\n    100% {\n        transform: translateY(-2vmax) scale(1.1);\n    }\n}\n\n@keyframes spiral-orbit-1 {\n    0% {\n        transform: rotate(0deg) translate(15vmax) rotate(0deg) scale(0.9);\n    }\n    50% {\n        transform: rotate(180deg) translate(15vmax) rotate(-180deg) scale(1.1);\n    }\n    100% {\n        transform: rotate(360deg) translate(15vmax) rotate(-360deg) scale(0.9);\n    }\n}\n\n@keyframes spiral-orbit-2 {\n    0% {\n        transform: rotate(0deg) translate(-12vmax) rotate(0deg) scale(1.1);\n    }\n    50% {\n        transform: rotate(-180deg) translate(-12vmax) rotate(180deg) scale(0.9);\n    }\n    100% {\n        transform: rotate(-360deg) translate(-12vmax) rotate(360deg) scale(1.1);\n    }\n}\n\n@keyframes spiral-orbit-3 {\n    0% {\n        transform: rotate(90deg) translate(10vmax) rotate(-90deg) scale(1);\n    }\n    50% {\n        transform: rotate(270deg) translate(10vmax) rotate(-270deg) scale(0.85);\n    }\n    100% {\n        transform: rotate(450deg) translate(10vmax) rotate(-450deg) scale(1);\n    }\n}\n","import clsx from \"clsx\";\nimport type React from \"react\";\nimport styles from \"./radialGlowDecorator.module.css\";\n\nexport interface RadialGlowDecoratorProps {\n    /** Custom z-index value. Defaults to -10 */\n    zIndex?: number;\n    /** Additional CSS classes */\n    className?: string;\n    /** Additional custom styles */\n    style?: React.CSSProperties;\n    /** Blob arrangement variant. Defaults to 'default' */\n    variant?:\n        | \"default\"\n        | \"split\"\n        | \"top-bar\"\n        | \"corners\"\n        | \"aurora\"\n        | \"spotlight\"\n        | \"nebula\"\n        | \"horizon\"\n        | \"spiral\";\n}\n\nexport const RadialGlowDecorator = ({\n    zIndex = -10,\n    className,\n    style,\n    variant = \"default\",\n}: RadialGlowDecoratorProps) => {\n    return (\n        <div\n            className={clsx(styles[\"container\"], className)}\n            aria-hidden=\"true\"\n            data-variant={variant}\n            style={{ zIndex, ...style }}\n        >\n            {variant === \"default\" && (\n                <>\n                    <div\n                        className={clsx(\n                            styles[\"blob\"],\n                            styles[\"default-primary\"]\n                        )}\n                    />\n                    <div\n                        className={clsx(\n                            styles[\"blob\"],\n                            styles[\"default-secondary\"]\n                        )}\n                    />\n                    <div\n                        className={clsx(\n                            styles[\"blob\"],\n                            styles[\"default-tertiary\"]\n                        )}\n                    />\n                </>\n            )}\n            {variant === \"split\" && (\n                <>\n                    <div\n                        className={clsx(styles[\"blob\"], styles[\"split-left\"])}\n                    />\n                    <div\n                        className={clsx(styles[\"blob\"], styles[\"split-right\"])}\n                    />\n                </>\n            )}\n            {variant === \"top-bar\" && (\n                <>\n                    <div\n                        className={clsx(\n                            styles[\"blob\"],\n                            styles[\"top-bar-primary\"]\n                        )}\n                    />\n                    <div\n                        className={clsx(\n                            styles[\"blob\"],\n                            styles[\"top-bar-secondary\"]\n                        )}\n                    />\n                    <div\n                        className={clsx(\n                            styles[\"blob\"],\n                            styles[\"top-bar-tertiary\"]\n                        )}\n                    />\n                </>\n            )}\n            {variant === \"corners\" && (\n                <>\n                    <div\n                        className={clsx(styles[\"blob\"], styles[\"corner-tl\"])}\n                    />\n                    <div\n                        className={clsx(styles[\"blob\"], styles[\"corner-tr\"])}\n                    />\n                    <div\n                        className={clsx(styles[\"blob\"], styles[\"corner-bl\"])}\n                    />\n                    <div\n                        className={clsx(styles[\"blob\"], styles[\"corner-br\"])}\n                    />\n                </>\n            )}\n            {variant === \"aurora\" && (\n                <>\n                    <div className={clsx(styles[\"blob\"], styles[\"aurora-1\"])} />\n                    <div className={clsx(styles[\"blob\"], styles[\"aurora-2\"])} />\n                    <div className={clsx(styles[\"blob\"], styles[\"aurora-3\"])} />\n                    <div className={clsx(styles[\"blob\"], styles[\"aurora-4\"])} />\n                </>\n            )}\n            {variant === \"spotlight\" && (\n                <>\n                    <div\n                        className={clsx(\n                            styles[\"blob\"],\n                            styles[\"spotlight-primary\"]\n                        )}\n                    />\n                    <div\n                        className={clsx(\n                            styles[\"blob\"],\n                            styles[\"spotlight-secondary\"]\n                        )}\n                    />\n                    <div\n                        className={clsx(\n                            styles[\"blob\"],\n                            styles[\"spotlight-tertiary\"]\n                        )}\n                    />\n                </>\n            )}\n            {variant === \"nebula\" && (\n                <>\n                    <div className={clsx(styles[\"blob\"], styles[\"nebula-1\"])} />\n                    <div className={clsx(styles[\"blob\"], styles[\"nebula-2\"])} />\n                    <div className={clsx(styles[\"blob\"], styles[\"nebula-3\"])} />\n                    <div className={clsx(styles[\"blob\"], styles[\"nebula-4\"])} />\n                </>\n            )}\n            {variant === \"horizon\" && (\n                <>\n                    <div\n                        className={clsx(\n                            styles[\"blob\"],\n                            styles[\"horizon-primary\"]\n                        )}\n                    />\n                    <div\n                        className={clsx(\n                            styles[\"blob\"],\n                            styles[\"horizon-secondary\"]\n                        )}\n                    />\n                    <div\n                        className={clsx(\n                            styles[\"blob\"],\n                            styles[\"horizon-tertiary\"]\n                        )}\n                    />\n                </>\n            )}\n            {variant === \"spiral\" && (\n                <>\n                    <div className={clsx(styles[\"blob\"], styles[\"spiral-1\"])} />\n                    <div className={clsx(styles[\"blob\"], styles[\"spiral-2\"])} />\n                    <div className={clsx(styles[\"blob\"], styles[\"spiral-3\"])} />\n                </>\n            )}\n        </div>\n    );\n};\n"],"mappings":"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"}
+{"version":3,"file":"RadialGlowDecorator","names":["clsx","styles","_Fragment","clsx$1","radialGlowDecorator_module_default","RadialGlowDecorator","\"container\"","className","variant","style","Fragment","\"blob\""],"sources":["../../src/components/Decorators/RadialGlowDecorator/radialGlowDecorator.module.css","../../src/components/Decorators/RadialGlowDecorator/RadialGlowDecorator.tsx"],"sourcesContent":["@layer adgytec.comps {\n    .container {\n        position: fixed;\n        inset: 0;\n        pointer-events: none;\n        overflow: hidden;\n\n        /* Default Opacity (Light mode/Base defaults) - higher visibility */\n        --glow-opacity-18: 28%;\n        --glow-opacity-15: 24%;\n        --glow-opacity-14: 22%;\n        --glow-opacity-12: 20%;\n        --glow-opacity-10: 16%;\n        --glow-opacity-8: 12%;\n    }\n\n    :global([data-theme=\"dark\"]) .container,\n    :global([data-theme=\"dark-high-contrast\"]) .container,\n    :global([data-theme=\"dark-medium-contrast\"]) .container,\n    :global([data-theme=\"monochrome-dark\"]) .container {\n        --glow-opacity-18: 15%;\n        --glow-opacity-15: 12%;\n        --glow-opacity-14: 11%;\n        --glow-opacity-12: 10%;\n        --glow-opacity-10: 8%;\n        --glow-opacity-8: 6%;\n    }\n\n    @media (prefers-color-scheme: dark) {\n        .container {\n            --glow-opacity-18: 15%;\n            --glow-opacity-15: 12%;\n            --glow-opacity-14: 11%;\n            --glow-opacity-12: 10%;\n            --glow-opacity-10: 8%;\n            --glow-opacity-8: 6%;\n        }\n    }\n\n    :global([data-theme=\"light\"]) .container,\n    :global([data-theme=\"light-high-contrast\"]) .container,\n    :global([data-theme=\"light-medium-contrast\"]) .container,\n    :global([data-theme=\"monochrome-light\"]) .container {\n        --glow-opacity-18: 28%;\n        --glow-opacity-15: 24%;\n        --glow-opacity-14: 22%;\n        --glow-opacity-12: 20%;\n        --glow-opacity-10: 16%;\n        --glow-opacity-8: 12%;\n    }\n\n    .blob {\n        position: absolute;\n        border-radius: 50%;\n        filter: blur(180px);\n        pointer-events: none;\n        will-change: transform, filter;\n    }\n\n    /* DEFAULT VARIANT */\n    .default-primary {\n        inline-size: 50vmax;\n        block-size: 50vmax;\n        top: -10vmax;\n        left: -10vmax;\n        background-color: color-mix(\n            in srgb,\n            var(--md-sys-color-primary) var(--glow-opacity-15),\n            transparent\n        );\n    }\n\n    .default-secondary {\n        inline-size: 45vmax;\n        block-size: 45vmax;\n        bottom: -15vmax;\n        right: -10vmax;\n        background-color: color-mix(\n            in srgb,\n            var(--md-sys-color-tertiary) var(--glow-opacity-12),\n            transparent\n        );\n    }\n\n    .default-tertiary {\n        inline-size: 40vmax;\n        block-size: 40vmax;\n        top: 25vh;\n        right: 15vw;\n        background-color: color-mix(\n            in srgb,\n            var(--md-sys-color-secondary) var(--glow-opacity-10),\n            transparent\n        );\n    }\n\n    /* SPLIT VARIANT */\n    .split-left {\n        inline-size: 60vmax;\n        block-size: 60vmax;\n        top: 20vh;\n        left: -20vmax;\n        background-color: color-mix(\n            in srgb,\n            var(--md-sys-color-primary) var(--glow-opacity-12),\n            transparent\n        );\n    }\n\n    .split-right {\n        inline-size: 60vmax;\n        block-size: 60vmax;\n        top: 20vh;\n        right: -20vmax;\n        background-color: color-mix(\n            in srgb,\n            var(--md-sys-color-tertiary) var(--glow-opacity-10),\n            transparent\n        );\n    }\n\n    /* TOP-BAR VARIANT */\n    .top-bar-primary {\n        inline-size: 35vmax;\n        block-size: 20vmax;\n        top: -10vmax;\n        left: 10vw;\n        background-color: color-mix(\n            in srgb,\n            var(--md-sys-color-primary) var(--glow-opacity-18),\n            transparent\n        );\n    }\n\n    .top-bar-secondary {\n        inline-size: 35vmax;\n        block-size: 20vmax;\n        top: -10vmax;\n        left: 40vw;\n        background-color: color-mix(\n            in srgb,\n            var(--md-sys-color-tertiary) var(--glow-opacity-15),\n            transparent\n        );\n    }\n\n    .top-bar-tertiary {\n        inline-size: 35vmax;\n        block-size: 20vmax;\n        top: -10vmax;\n        left: 70vw;\n        background-color: color-mix(\n            in srgb,\n            var(--md-sys-color-secondary) var(--glow-opacity-12),\n            transparent\n        );\n    }\n\n    /* CORNERS VARIANT */\n    .corner-tl {\n        inline-size: 30vmax;\n        block-size: 30vmax;\n        top: -10vmax;\n        left: -10vmax;\n        background-color: color-mix(\n            in srgb,\n            var(--md-sys-color-primary) var(--glow-opacity-15),\n            transparent\n        );\n    }\n\n    .corner-tr {\n        inline-size: 30vmax;\n        block-size: 30vmax;\n        top: -10vmax;\n        right: -10vmax;\n        background-color: color-mix(\n            in srgb,\n            var(--md-sys-color-tertiary) var(--glow-opacity-12),\n            transparent\n        );\n    }\n\n    .corner-bl {\n        inline-size: 30vmax;\n        block-size: 30vmax;\n        bottom: -10vmax;\n        left: -10vmax;\n        background-color: color-mix(\n            in srgb,\n            var(--md-sys-color-secondary) var(--glow-opacity-12),\n            transparent\n        );\n    }\n\n    .corner-br {\n        inline-size: 30vmax;\n        block-size: 30vmax;\n        bottom: -10vmax;\n        right: -10vmax;\n        background-color: color-mix(\n            in srgb,\n            var(--md-sys-color-primary) var(--glow-opacity-10),\n            transparent\n        );\n    }\n\n    /* AURORA VARIANT */\n    .aurora-1 {\n        inline-size: 55vmax;\n        block-size: 40vmax;\n        top: -15vmax;\n        left: 5vw;\n        background-color: color-mix(\n            in srgb,\n            var(--md-sys-color-primary) var(--glow-opacity-12),\n            transparent\n        );\n        animation: aurora-float-1 25s ease-in-out infinite alternate;\n    }\n\n    .aurora-2 {\n        inline-size: 50vmax;\n        block-size: 45vmax;\n        top: -10vmax;\n        left: 30vw;\n        background-color: color-mix(\n            in srgb,\n            var(--md-sys-color-tertiary) var(--glow-opacity-10),\n            transparent\n        );\n        animation: aurora-float-2 22s ease-in-out infinite alternate;\n    }\n\n    .aurora-3 {\n        inline-size: 60vmax;\n        block-size: 40vmax;\n        top: -20vmax;\n        right: 5vw;\n        background-color: color-mix(\n            in srgb,\n            var(--md-sys-color-secondary) var(--glow-opacity-12),\n            transparent\n        );\n        animation: aurora-float-3 28s ease-in-out infinite alternate;\n    }\n\n    .aurora-4 {\n        inline-size: 45vmax;\n        block-size: 40vmax;\n        bottom: -15vmax;\n        left: 25vw;\n        background-color: color-mix(\n            in srgb,\n            var(--md-sys-color-primary) var(--glow-opacity-8),\n            transparent\n        );\n        animation: aurora-float-4 26s ease-in-out infinite alternate;\n    }\n\n    /* SPOTLIGHT VARIANT */\n    .spotlight-primary {\n        inline-size: 55vmax;\n        block-size: 55vmax;\n        top: 50%;\n        left: 50%;\n        transform: translate(-50%, -50%);\n        background-color: color-mix(\n            in srgb,\n            var(--md-sys-color-primary) var(--glow-opacity-14),\n            transparent\n        );\n        animation: spotlight-pulse-1 12s ease-in-out infinite alternate;\n    }\n\n    .spotlight-secondary {\n        inline-size: 45vmax;\n        block-size: 45vmax;\n        top: 50%;\n        left: 50%;\n        transform: translate(-50%, -50%);\n        background-color: color-mix(\n            in srgb,\n            var(--md-sys-color-tertiary) var(--glow-opacity-10),\n            transparent\n        );\n        animation: spotlight-pulse-2 16s ease-in-out infinite alternate;\n    }\n\n    .spotlight-tertiary {\n        inline-size: 35vmax;\n        block-size: 35vmax;\n        top: 50%;\n        left: 50%;\n        transform: translate(-50%, -50%);\n        background-color: color-mix(\n            in srgb,\n            var(--md-sys-color-secondary) var(--glow-opacity-8),\n            transparent\n        );\n        animation: spotlight-pulse-3 10s ease-in-out infinite alternate;\n    }\n\n    /* NEBULA VARIANT */\n    .nebula-1 {\n        inline-size: 65vmax;\n        block-size: 65vmax;\n        top: 10vh;\n        left: 10vw;\n        background-color: color-mix(\n            in srgb,\n            var(--md-sys-color-primary) var(--glow-opacity-12),\n            transparent\n        );\n        animation: nebula-drift-1 30s ease-in-out infinite;\n    }\n\n    .nebula-2 {\n        inline-size: 55vmax;\n        block-size: 55vmax;\n        bottom: 10vh;\n        right: 10vw;\n        background-color: color-mix(\n            in srgb,\n            var(--md-sys-color-tertiary) var(--glow-opacity-12),\n            transparent\n        );\n        animation: nebula-drift-2 35s ease-in-out infinite;\n    }\n\n    .nebula-3 {\n        inline-size: 50vmax;\n        block-size: 50vmax;\n        top: 30vh;\n        right: 15vw;\n        background-color: color-mix(\n            in srgb,\n            var(--md-sys-color-secondary) var(--glow-opacity-10),\n            transparent\n        );\n        animation: nebula-drift-3 28s ease-in-out infinite;\n    }\n\n    .nebula-4 {\n        inline-size: 45vmax;\n        block-size: 45vmax;\n        bottom: 20vh;\n        left: 15vw;\n        background-color: color-mix(\n            in srgb,\n            var(--md-sys-color-primary) var(--glow-opacity-8),\n            transparent\n        );\n        animation: nebula-drift-4 32s ease-in-out infinite;\n    }\n\n    /* HORIZON VARIANT */\n    .horizon-primary {\n        inline-size: 55vmax;\n        block-size: 30vmax;\n        bottom: -15vmax;\n        left: 10vw;\n        border-radius: 50% 50% 0 0;\n        background-color: color-mix(\n            in srgb,\n            var(--md-sys-color-primary) var(--glow-opacity-15),\n            transparent\n        );\n        animation: horizon-pulse-1 8s ease-in-out infinite alternate;\n    }\n\n    .horizon-secondary {\n        inline-size: 60vmax;\n        block-size: 35vmax;\n        bottom: -20vmax;\n        left: 30vw;\n        border-radius: 50% 50% 0 0;\n        background-color: color-mix(\n            in srgb,\n            var(--md-sys-color-tertiary) var(--glow-opacity-12),\n            transparent\n        );\n        animation: horizon-pulse-2 11s ease-in-out infinite alternate;\n    }\n\n    .horizon-tertiary {\n        inline-size: 50vmax;\n        block-size: 28vmax;\n        bottom: -18vmax;\n        right: 10vw;\n        border-radius: 50% 50% 0 0;\n        background-color: color-mix(\n            in srgb,\n            var(--md-sys-color-secondary) var(--glow-opacity-10),\n            transparent\n        );\n        animation: horizon-pulse-3 9s ease-in-out infinite alternate;\n    }\n\n    /* SPIRAL VARIANT */\n    .spiral-1 {\n        inline-size: 45vmax;\n        block-size: 45vmax;\n        top: calc(50% - 22.5vmax);\n        left: calc(50% - 22.5vmax);\n        background-color: color-mix(\n            in srgb,\n            var(--md-sys-color-primary) var(--glow-opacity-12),\n            transparent\n        );\n        animation: spiral-orbit-1 25s linear infinite;\n    }\n\n    .spiral-2 {\n        inline-size: 40vmax;\n        block-size: 40vmax;\n        top: calc(50% - 20vmax);\n        left: calc(50% - 20vmax);\n        background-color: color-mix(\n            in srgb,\n            var(--md-sys-color-tertiary) var(--glow-opacity-10),\n            transparent\n        );\n        animation: spiral-orbit-2 30s linear infinite;\n    }\n\n    .spiral-3 {\n        inline-size: 35vmax;\n        block-size: 35vmax;\n        top: calc(50% - 17.5vmax);\n        left: calc(50% - 17.5vmax);\n        background-color: color-mix(\n            in srgb,\n            var(--md-sys-color-secondary) var(--glow-opacity-10),\n            transparent\n        );\n        animation: spiral-orbit-3 20s linear infinite;\n    }\n}\n\n/* Animations for premium organic feeling */\n@keyframes aurora-float-1 {\n    0% {\n        transform: translate(0, 0) scale(1);\n    }\n    100% {\n        transform: translate(5vw, 5vh) scale(1.1);\n    }\n}\n\n@keyframes aurora-float-2 {\n    0% {\n        transform: translate(0, 0) scale(1.1);\n    }\n    100% {\n        transform: translate(-4vw, -6vh) scale(0.95);\n    }\n}\n\n@keyframes aurora-float-3 {\n    0% {\n        transform: translate(0, 0) scale(0.95);\n    }\n    100% {\n        transform: translate(6vw, -4vh) scale(1.05);\n    }\n}\n\n@keyframes aurora-float-4 {\n    0% {\n        transform: translate(0, 0) scale(1.05);\n    }\n    100% {\n        transform: translate(-5vw, 4vh) scale(1);\n    }\n}\n\n@keyframes spotlight-pulse-1 {\n    0% {\n        transform: translate(-50%, -50%) scale(0.9);\n    }\n    100% {\n        transform: translate(-50%, -50%) scale(1.1);\n    }\n}\n\n@keyframes spotlight-pulse-2 {\n    0% {\n        transform: translate(-48%, -52%) scale(1.1);\n    }\n    100% {\n        transform: translate(-52%, -48%) scale(0.9);\n    }\n}\n\n@keyframes spotlight-pulse-3 {\n    0% {\n        transform: translate(-52%, -48%) scale(0.95);\n    }\n    100% {\n        transform: translate(-48%, -52%) scale(1.05);\n    }\n}\n\n@keyframes nebula-drift-1 {\n    0% {\n        transform: translate(0, 0) scale(1) rotate(0deg);\n    }\n    33% {\n        transform: translate(10vw, 15vh) scale(1.15) rotate(120deg);\n    }\n    66% {\n        transform: translate(-10vw, 10vh) scale(0.9) rotate(240deg);\n    }\n    100% {\n        transform: translate(0, 0) scale(1) rotate(360deg);\n    }\n}\n\n@keyframes nebula-drift-2 {\n    0% {\n        transform: translate(0, 0) scale(1) rotate(0deg);\n    }\n    33% {\n        transform: translate(-15vw, -10vh) scale(0.9) rotate(-120deg);\n    }\n    66% {\n        transform: translate(5vw, -15vh) scale(1.1) rotate(-240deg);\n    }\n    100% {\n        transform: translate(0, 0) scale(1) rotate(-360deg);\n    }\n}\n\n@keyframes nebula-drift-3 {\n    0% {\n        transform: translate(0, 0) scale(1);\n    }\n    50% {\n        transform: translate(-8vw, 12vh) scale(1.2);\n    }\n    100% {\n        transform: translate(0, 0) scale(1);\n    }\n}\n\n@keyframes nebula-drift-4 {\n    0% {\n        transform: translate(0, 0) scale(1.1);\n    }\n    50% {\n        transform: translate(12vw, -10vh) scale(0.9);\n    }\n    100% {\n        transform: translate(0, 0) scale(1.1);\n    }\n}\n\n@keyframes horizon-pulse-1 {\n    0% {\n        transform: translateY(0) scale(0.95);\n    }\n    100% {\n        transform: translateY(-2vmax) scale(1.05);\n    }\n}\n\n@keyframes horizon-pulse-2 {\n    0% {\n        transform: translateY(0) scale(1.05);\n    }\n    100% {\n        transform: translateY(-3vmax) scale(0.95);\n    }\n}\n\n@keyframes horizon-pulse-3 {\n    0% {\n        transform: translateY(0) scale(0.9);\n    }\n    100% {\n        transform: translateY(-2vmax) scale(1.1);\n    }\n}\n\n@keyframes spiral-orbit-1 {\n    0% {\n        transform: rotate(0deg) translate(15vmax) rotate(0deg) scale(0.9);\n    }\n    50% {\n        transform: rotate(180deg) translate(15vmax) rotate(-180deg) scale(1.1);\n    }\n    100% {\n        transform: rotate(360deg) translate(15vmax) rotate(-360deg) scale(0.9);\n    }\n}\n\n@keyframes spiral-orbit-2 {\n    0% {\n        transform: rotate(0deg) translate(-12vmax) rotate(0deg) scale(1.1);\n    }\n    50% {\n        transform: rotate(-180deg) translate(-12vmax) rotate(180deg) scale(0.9);\n    }\n    100% {\n        transform: rotate(-360deg) translate(-12vmax) rotate(360deg) scale(1.1);\n    }\n}\n\n@keyframes spiral-orbit-3 {\n    0% {\n        transform: rotate(90deg) translate(10vmax) rotate(-90deg) scale(1);\n    }\n    50% {\n        transform: rotate(270deg) translate(10vmax) rotate(-270deg) scale(0.85);\n    }\n    100% {\n        transform: rotate(450deg) translate(10vmax) rotate(-450deg) scale(1);\n    }\n}\n","import clsx from \"clsx\";\nimport type React from \"react\";\nimport styles from \"./radialGlowDecorator.module.css\";\n\n/**\n * Predefined layout, blob placement, and motion variants for the {@link RadialGlowDecorator} component.\n *\n * - `\"default\"`: 3 static blobs (primary, secondary, tertiary) spread across the viewport.\n * - `\"split\"`: 2 static blobs separated left and right, ideal for two-column or split layouts.\n * - `\"top-bar\"`: 3 horizontal blobs aligned across the top fold or header area.\n * - `\"corners\"`: 4 static blobs anchored in each of the four screen corners.\n * - `\"aurora\"`: 4 organic floating blobs with continuous drift animation for atmospheric ambiance.\n * - `\"spotlight\"`: 3 centered, layered blobs with an organic pulsating scale animation.\n * - `\"nebula\"`: 4 orbiting and drifting blobs creating an immersive, fluid cosmic look.\n * - `\"horizon\"`: 3 bottom-anchored blobs with rising and pulsating motion for footers and page bottoms.\n * - `\"spiral\"`: 3 blobs following a circular orbiting path for dynamic centerpiece effects.\n */\nexport type RadialGlowDecoratorVariant =\n    | \"default\"\n    | \"split\"\n    | \"top-bar\"\n    | \"corners\"\n    | \"aurora\"\n    | \"spotlight\"\n    | \"nebula\"\n    | \"horizon\"\n    | \"spiral\";\n\n/**\n * Props for the {@link RadialGlowDecorator} component.\n */\nexport interface RadialGlowDecoratorProps {\n    /**\n     * Z-index layer depth for the decorator container.\n     *\n     * @default -10\n     */\n    zIndex?: number;\n\n    /** Additional CSS class names to apply to the decorator container. */\n    className?: string;\n\n    /** Custom inline styles to apply to the decorator container. */\n    style?: React.CSSProperties;\n\n    /**\n     * Predefined layout, blob placement, and animation variant.\n     *\n     * @default \"default\"\n     */\n    variant?: RadialGlowDecoratorVariant;\n}\n\n/**\n * A non-blocking decorative background component that renders smooth, theme-aware radial glow gradients.\n *\n * Layers multiple blurred color blobs to produce premium ambient lighting and background washes.\n * Automatically scales opacities between light and dark modes to ensure visual balance.\n * Spans the full page with `pointer-events: none` and `aria-hidden=\"true\"`, ensuring no interference\n * with user interactions or accessibility trees.\n *\n * @example\n * ```tsx\n * import { RadialGlowDecorator } from '@adgytec/web-ui-components';\n *\n * // Static multi-color radial gradient\n * <RadialGlowDecorator variant=\"default\" />\n *\n * // Continuous floating aurora animation with custom z-index\n * <RadialGlowDecorator variant=\"aurora\" zIndex={-20} />\n *\n * // Centered pulsating spotlight for hero sections\n * <RadialGlowDecorator variant=\"spotlight\" />\n * ```\n */\nexport const RadialGlowDecorator: React.FC<RadialGlowDecoratorProps> = ({\n    zIndex = -10,\n    className,\n    style,\n    variant = \"default\",\n}) => {\n    return (\n        <div\n            className={clsx(styles[\"container\"], className)}\n            aria-hidden=\"true\"\n            data-variant={variant}\n            style={{ zIndex, ...style }}\n        >\n            {variant === \"default\" && (\n                <>\n                    <div\n                        className={clsx(\n                            styles[\"blob\"],\n                            styles[\"default-primary\"]\n                        )}\n                    />\n                    <div\n                        className={clsx(\n                            styles[\"blob\"],\n                            styles[\"default-secondary\"]\n                        )}\n                    />\n                    <div\n                        className={clsx(\n                            styles[\"blob\"],\n                            styles[\"default-tertiary\"]\n                        )}\n                    />\n                </>\n            )}\n            {variant === \"split\" && (\n                <>\n                    <div\n                        className={clsx(styles[\"blob\"], styles[\"split-left\"])}\n                    />\n                    <div\n                        className={clsx(styles[\"blob\"], styles[\"split-right\"])}\n                    />\n                </>\n            )}\n            {variant === \"top-bar\" && (\n                <>\n                    <div\n                        className={clsx(\n                            styles[\"blob\"],\n                            styles[\"top-bar-primary\"]\n                        )}\n                    />\n                    <div\n                        className={clsx(\n                            styles[\"blob\"],\n                            styles[\"top-bar-secondary\"]\n                        )}\n                    />\n                    <div\n                        className={clsx(\n                            styles[\"blob\"],\n                            styles[\"top-bar-tertiary\"]\n                        )}\n                    />\n                </>\n            )}\n            {variant === \"corners\" && (\n                <>\n                    <div\n                        className={clsx(styles[\"blob\"], styles[\"corner-tl\"])}\n                    />\n                    <div\n                        className={clsx(styles[\"blob\"], styles[\"corner-tr\"])}\n                    />\n                    <div\n                        className={clsx(styles[\"blob\"], styles[\"corner-bl\"])}\n                    />\n                    <div\n                        className={clsx(styles[\"blob\"], styles[\"corner-br\"])}\n                    />\n                </>\n            )}\n            {variant === \"aurora\" && (\n                <>\n                    <div className={clsx(styles[\"blob\"], styles[\"aurora-1\"])} />\n                    <div className={clsx(styles[\"blob\"], styles[\"aurora-2\"])} />\n                    <div className={clsx(styles[\"blob\"], styles[\"aurora-3\"])} />\n                    <div className={clsx(styles[\"blob\"], styles[\"aurora-4\"])} />\n                </>\n            )}\n            {variant === \"spotlight\" && (\n                <>\n                    <div\n                        className={clsx(\n                            styles[\"blob\"],\n                            styles[\"spotlight-primary\"]\n                        )}\n                    />\n                    <div\n                        className={clsx(\n                            styles[\"blob\"],\n                            styles[\"spotlight-secondary\"]\n                        )}\n                    />\n                    <div\n                        className={clsx(\n                            styles[\"blob\"],\n                            styles[\"spotlight-tertiary\"]\n                        )}\n                    />\n                </>\n            )}\n            {variant === \"nebula\" && (\n                <>\n                    <div className={clsx(styles[\"blob\"], styles[\"nebula-1\"])} />\n                    <div className={clsx(styles[\"blob\"], styles[\"nebula-2\"])} />\n                    <div className={clsx(styles[\"blob\"], styles[\"nebula-3\"])} />\n                    <div className={clsx(styles[\"blob\"], styles[\"nebula-4\"])} />\n                </>\n            )}\n            {variant === \"horizon\" && (\n                <>\n                    <div\n                        className={clsx(\n                            styles[\"blob\"],\n                            styles[\"horizon-primary\"]\n                        )}\n                    />\n                    <div\n                        className={clsx(\n                            styles[\"blob\"],\n                            styles[\"horizon-secondary\"]\n                        )}\n                    />\n                    <div\n                        className={clsx(\n                            styles[\"blob\"],\n                            styles[\"horizon-tertiary\"]\n                        )}\n                    />\n                </>\n            )}\n            {variant === \"spiral\" && (\n                <>\n                    <div className={clsx(styles[\"blob\"], styles[\"spiral-1\"])} />\n                    <div className={clsx(styles[\"blob\"], styles[\"spiral-2\"])} />\n                    <div className={clsx(styles[\"blob\"], styles[\"spiral-3\"])} />\n                </>\n            )}\n        </div>\n    );\n};\n"],"mappings":"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"}

package/dist/chunks/Radio.map

@@ -1 +1 @@
-{"version":3,"file":"Radio","names":["renderProps"],"sources":["../../src/components/Input/Radio/context.ts","../../src/components/Input/Radio/radio.module.css","../../src/components/Input/Radio/Radio.tsx","../../src/components/Input/Radio/RadioGroup.tsx"],"sourcesContent":["import { createContext } from \"react\";\nimport type { RadioLabelPlacement } from \"./types\";\n\nexport type RadioGroupContextValue = {\n    labelPlacement?: RadioLabelPlacement;\n    containerStateLayer?: boolean;\n};\n\nexport const RadioGroupContext = createContext<RadioGroupContextValue>({});\n","/* configurable tokens\n*\n* --md-radio-icon-color\n* --md-radio-selected-icon-color\n*\n* --md-radio-interaction-icon-color\n* --md-radio-selected-interaction-icon-color\n*\n* --md-radio-state-layer-color\n* --md-radio-selected-state-layer-color\n*\n* configurable tokens end */\n\n@layer adgytec.comps {\n    .radio-group {\n        /* configurable tokens */\n        --_md-radio-icon-color: var(\n            --md-radio-icon-color,\n            var(--md-sys-color-on-surface-variant)\n        );\n        --_md-radio-selected-icon-color: var(\n            --md-radio-selected-icon-color,\n            var(--md-sys-color-primary)\n        );\n\n        --_md-radio-interaction-icon-color: var(\n            --md-radio-interaction-icon-color,\n            var(--md-sys-color-on-surface)\n        );\n        --_md-radio-selected-interaction-icon-color: var(\n            --md-radio-selected-interaction-icon-color,\n            var(--_md-radio-selected-icon-color)\n        );\n\n        --_md-radio-state-layer-color: var(\n            --md-radio-state-layer-color,\n            var(--md-sys-color-on-surface)\n        );\n        --_md-radio-selected-state-layer-color: var(\n            --md-radio-selected-state-layer-color,\n            var(--_md-radio-selected-icon-color)\n        );\n\n        /* configurable tokens end */\n\n        display: grid;\n        gap: var(--md-sys-layout-space-16);\n\n        &[data-disabled] {\n            color: rgb(\n                from currentcolor r g b /\n                var(--md-sys-state-disabled-content)\n            );\n            cursor: default;\n        }\n    }\n\n    .radio-items {\n        display: grid;\n\n        &[data-orientation=\"horizontal\"] {\n            display: flex;\n        }\n    }\n\n    .radio {\n        /* invalid tokens */\n        --_md-radio-invalid-icon-color: var(--md-sys-color-error);\n        --_md-radio-invalid-state-layer-color: var(\n            --_md-radio-invalid-icon-color\n        );\n\n        /* indicator tokens */\n        --_md-radio-size: calc(20 * var(--dp, 1px));\n        --_md-radio-icon-size: calc(\n            var(--_md-radio-size) -\n            calc(10 * var(--dp, 1px))\n        );\n        --_md-radio-state-layer-size: calc(40 * var(--dp, 1px));\n\n        /* state layer tokens */\n        --_md-radio-pressed-state-layer-color: var(\n            --_md-radio-selected-state-layer-color\n        );\n        --_md-radio-pressed-selected-state-layer-color: var(\n            --_md-radio-state-layer-color\n        );\n\n        --_state-layer-opacity: 0;\n        --_state-color: var(--_md-radio-state-layer-color);\n\n        --_state-layer-color: rgb(\n            from var(--_state-color) r g b /\n            var(--_state-layer-opacity)\n        );\n\n        /* styles */\n        position: relative;\n\n        display: flex;\n        align-items: center;\n        gap: var(--md-sys-layout-space-16);\n\n        color: inherit;\n        cursor: pointer;\n\n        & * {\n            cursor: inherit;\n        }\n\n        &[data-disabled] {\n            cursor: default;\n        }\n\n        &[data-selected] {\n            --_state-color: var(--_md-radio-selected-state-layer-color);\n        }\n\n        &[data-pressed] {\n            --_state-layer-opacity: var(--md-sys-state-pressed);\n            --_state-color: var(--_md-radio-pressed-state-layer-color);\n\n            &[data-selected] {\n                --_state-color: var(\n                    --_md-radio-pressed-selected-state-layer-color\n                );\n            }\n        }\n\n        &[data-invalid] {\n            --_state-color: var(--_md-radio-invalid-state-layer-color);\n\n            &[data-selected] {\n                --_state-color: var(--_md-radio-invalid-state-layer-color);\n            }\n        }\n\n        &[data-hovered] {\n            --_state-layer-opacity: var(--md-sys-state-hover);\n            z-index: 1;\n        }\n\n        &[data-focus-visible] {\n            --_state-layer-opacity: var(--md-sys-state-focus);\n            z-index: 1;\n        }\n    }\n\n    .state-layer::before {\n        content: \"\";\n\n        position: absolute;\n        inset: calc(-1 * var(--md-sys-layout-space-12));\n\n        background-color: var(--_state-layer-color);\n        border-radius: var(--md-sys-shape-corner-radius-extra-small);\n\n        pointer-events: none;\n\n        transition: background-color\n            var(--md-sys-motion-expressive-fast-effects)\n            var(--md-sys-motion-expressive-fast-effects-duration);\n\n        @media (prefers-reduced-motion) {\n            transition: none;\n        }\n    }\n\n    .indicator {\n        --_indicator-color: var(--_md-radio-icon-color);\n\n        position: relative;\n\n        inline-size: var(--_md-radio-size);\n        aspect-ratio: 1 / 1;\n        border-radius: var(--md-sys-shape-corner-radius-full);\n\n        border: var(--md-sys-shape-border-width-thick) solid\n            var(--_indicator-color);\n\n        transition: border-color var(--md-sys-motion-expressive-default-effects)\n            var(--md-sys-motion-expressive-default-effects-duration);\n\n        @media (prefers-reduced-motion) {\n            transition: none;\n        }\n\n        &[data-selected] {\n            --_indicator-color: var(--_md-radio-selected-icon-color);\n        }\n\n        &[data-invalid] {\n            --_indicator-color: var(--_md-radio-invalid-icon-color);\n        }\n\n        &[data-pressed],\n        &[data-hovered],\n        &[data-focus-visible] {\n            --_indicator-color: var(--_md-radio-interaction-icon-color);\n\n            &[data-selected] {\n                --_indicator-color: var(\n                    --_md-radio-selected-interaction-icon-color\n                );\n            }\n\n            &[data-invalid] {\n                --_indicator-color: var(--_md-radio-invalid-icon-color);\n            }\n        }\n\n        &[data-disabled] {\n            --_indicator-color: rgb(\n                from var(--md-sys-color-on-surface) r g b /\n                var(--md-sys-state-disabled-content)\n            );\n\n            &[data-selected] {\n                --_indicator-color: rgb(\n                    from var(--md-sys-color-on-surface) r g b /\n                    var(--md-sys-state-disabled-content)\n                );\n            }\n        }\n    }\n\n    /* state layer */\n    .indicator[data-show-state-layer]::before {\n        content: \"\";\n\n        position: absolute;\n        inset-block-start: 50%;\n        inset-inline-start: 50%;\n        transform: translate(-50%, -50%);\n\n        inline-size: var(--_md-radio-state-layer-size);\n        aspect-ratio: 1 / 1;\n        border-radius: var(--md-sys-shape-corner-radius-full);\n\n        background-color: var(--_state-layer-color);\n\n        transition: background-color\n            var(--md-sys-motion-expressive-default-effects)\n            var(--md-sys-motion-expressive-default-effects-duration);\n\n        @media (prefers-reduced-motion) {\n            transition: none;\n        }\n    }\n\n    /* indicator center icon */\n    .indicator-icon {\n        content: \"\";\n\n        position: absolute;\n        inline-size: var(--_md-radio-icon-size);\n        aspect-ratio: 1 / 1;\n\n        inset-inline-start: 50%;\n        inset-block-start: 50%;\n        translate: -50% -50%;\n\n        background-color: var(--_indicator-color);\n        border-radius: var(--md-sys-shape-corner-radius-full);\n\n        scale: 0;\n\n        transition:\n            background-color var(--md-sys-motion-expressive-default-effects)\n            var(--md-sys-motion-expressive-default-effects-duration),\n            scale var(--md-sys-motion-standard-default-spatial)\n            var(--md-sys-motion-standard-default-spatial-duration);\n\n        @media (prefers-reduced-motion) {\n            transition: none;\n        }\n\n        &[data-selected] {\n            scale: 1;\n        }\n    }\n\n    .indicator[data-focus-visible] {\n        --focus-indicator-color: var(--md-sys-color-secondary);\n        --focus-indicator-thickness: calc(3 * var(--dp, 1px));\n        --focus-indicator-offset: calc(2 * var(--dp, 1px));\n\n        outline-width: var(--focus-indicator-thickness);\n        outline-style: solid;\n        outline-offset: var(--focus-indicator-offset);\n        outline-color: var(--focus-indicator-color);\n    }\n}\n","import { clsx } from \"clsx\";\nimport { useContext } from \"react\";\nimport { Radio as AriaRadio } from \"react-aria-components\";\nimport { typography } from \"@/utils\";\nimport { TapTarget } from \"@/utils/tapTarget\";\nimport { RadioGroupContext } from \"./context\";\nimport styles from \"./radio.module.css\";\nimport type { RadioProps } from \"./types\";\n\nexport const Radio: React.FC<RadioProps> = ({\n    className,\n    children,\n    labelPlacement,\n    containerStateLayer,\n    ...props\n}) => {\n    const {\n        labelPlacement: groupLabelPlacement,\n        containerStateLayer: groupContainerStateLayer,\n    } = useContext(RadioGroupContext);\n    const placement = labelPlacement ?? groupLabelPlacement ?? \"end\";\n    const stateLayer = containerStateLayer ?? groupContainerStateLayer ?? false;\n\n    return (\n        <AriaRadio\n            className={(renderProps) =>\n                clsx(\n                    styles[\"radio\"],\n                    stateLayer && styles[\"state-layer\"],\n                    typography.labelLarge,\n                    typeof className === \"function\"\n                        ? className(renderProps)\n                        : className\n                )\n            }\n            {...props}\n            data-radio\n        >\n            {(renderProps) => {\n                const {\n                    isSelected,\n                    isHovered,\n                    isDisabled,\n                    isFocused,\n                    isFocusVisible,\n                    isPressed,\n                    isInvalid,\n                } = renderProps;\n\n                const dataAttrs = {\n                    \"data-selected\": isSelected || undefined,\n                    \"data-hovered\": isHovered || undefined,\n                    \"data-disabled\": isDisabled || undefined,\n                    \"data-focused\": isFocused || undefined,\n                    \"data-focus-visible\": isFocusVisible || undefined,\n                    \"data-pressed\": isPressed || undefined,\n                    \"data-show-state-layer\": !stateLayer || undefined,\n                    \"data-invalid\": isInvalid || undefined,\n                };\n\n                const label =\n                    typeof children === \"function\"\n                        ? children(renderProps)\n                        : children;\n                return (\n                    <>\n                        {placement === \"start\" && label}\n\n                        <span\n                            className={clsx(styles[\"indicator\"], TapTarget)}\n                            {...dataAttrs}\n                        >\n                            <span\n                                className={clsx(styles[\"indicator-icon\"])}\n                                {...dataAttrs}\n                            ></span>\n                        </span>\n\n                        {placement === \"end\" && label}\n                    </>\n                );\n            }}\n        </AriaRadio>\n    );\n};\n","import { clsx } from \"clsx\";\nimport { RadioGroup as AriaRadioGroup } from \"react-aria-components\";\nimport { Description } from \"../Description\";\nimport { FieldError } from \"../FieldError\";\nimport { Label } from \"../Label\";\nimport { RadioGroupContext } from \"./context\";\nimport styles from \"./radio.module.css\";\nimport type { RadioGroupProps } from \"./types\";\n\nexport const RadioGroup: React.FC<RadioGroupProps> = ({\n    label,\n    description,\n    errorMessage,\n    showDescriptionOnInvalid = false,\n    children,\n    className,\n    radioItemsGap = 24,\n    labelPlacement,\n    containerStateLayer,\n    ...props\n}) => {\n    return (\n        <RadioGroupContext value={{ labelPlacement, containerStateLayer }}>\n            <AriaRadioGroup\n                className={(renderProps) =>\n                    clsx(\n                        styles[\"radio-group\"],\n                        typeof className === \"function\"\n                            ? className(renderProps)\n                            : className\n                    )\n                }\n                {...props}\n                data-radio-group\n            >\n                {({ orientation, isInvalid }) => {\n                    const showDescription =\n                        description &&\n                        (!isInvalid || (isInvalid && showDescriptionOnInvalid));\n\n                    return (\n                        <>\n                            {label && <Label>{label}</Label>}\n\n                            <div\n                                data-orientation={orientation}\n                                className={clsx(styles[\"radio-items\"])}\n                                style={{\n                                    gap: `calc(${radioItemsGap} * var(--dp, 1px))`,\n                                }}\n                            >\n                                {children}\n                            </div>\n\n                            {showDescription && (\n                                <Description>{description}</Description>\n                            )}\n                            <FieldError>{errorMessage}</FieldError>\n                        </>\n                    );\n                }}\n            </AriaRadioGroup>\n        </RadioGroupContext>\n    );\n};\n"],"mappings":"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"}
+{"version":3,"file":"Radio","names":["renderProps","Radio","_c","styles","_Fragment","AriaRadio","RadioGroup","AriaRadioGroup","styles","_Fragment","Label","FieldError","require_compiler_runtime","typography","FieldError$1","Label$1","import_compiler_runtime","RadioGroupContext","createContext","radio_module_default","Radio$1","$","children","className","containerStateLayer","labelPlacement","props","t0","groupLabelPlacement","groupContainerStateLayer","useContext","placement","stateLayer","t1","clsx","renderProps","t2","renderProps_0","dataAttrs","isSelected","isHovered","isDisabled","isFocused","isFocusVisible","isPressed","isInvalid","label","Fragment","TapTarget","t3","Radio","RadioGroup$1","RadioGroup","showDescription","description","showDescriptionOnInvalid","orientation","radioItemsGap","Description","errorMessage"],"sources":["../../src/components/Input/Radio/context.ts","../../src/components/Input/Radio/radio.module.css","../../src/components/Input/Radio/Radio.tsx","../../src/components/Input/Radio/RadioGroup.tsx"],"sourcesContent":["import { createContext } from \"react\";\nimport type { RadioLabelPlacement } from \"./types\";\n\n/**\n * Shared context value provided by {@link RadioGroup} to child {@link Radio} components.\n */\nexport interface RadioGroupContextValue {\n    /** Inherited label placement. */\n    labelPlacement?: RadioLabelPlacement;\n    /** Inherited container state layer flag. */\n    containerStateLayer?: boolean;\n}\n\n/**\n * Context communicating group-level styling configurations to nested radio buttons.\n */\nexport const RadioGroupContext = createContext<RadioGroupContextValue>({});\n","/* configurable tokens\n*\n* --md-radio-icon-color\n* --md-radio-selected-icon-color\n*\n* --md-radio-interaction-icon-color\n* --md-radio-selected-interaction-icon-color\n*\n* --md-radio-state-layer-color\n* --md-radio-selected-state-layer-color\n*\n* configurable tokens end */\n\n@layer adgytec.comps {\n    .radio-group {\n        /* configurable tokens */\n        --_md-radio-icon-color: var(\n            --md-radio-icon-color,\n            var(--md-sys-color-on-surface-variant)\n        );\n        --_md-radio-selected-icon-color: var(\n            --md-radio-selected-icon-color,\n            var(--md-sys-color-primary)\n        );\n\n        --_md-radio-interaction-icon-color: var(\n            --md-radio-interaction-icon-color,\n            var(--md-sys-color-on-surface)\n        );\n        --_md-radio-selected-interaction-icon-color: var(\n            --md-radio-selected-interaction-icon-color,\n            var(--_md-radio-selected-icon-color)\n        );\n\n        --_md-radio-state-layer-color: var(\n            --md-radio-state-layer-color,\n            var(--md-sys-color-on-surface)\n        );\n        --_md-radio-selected-state-layer-color: var(\n            --md-radio-selected-state-layer-color,\n            var(--_md-radio-selected-icon-color)\n        );\n\n        /* configurable tokens end */\n\n        display: grid;\n        gap: var(--md-sys-layout-space-16);\n\n        &[data-disabled] {\n            color: rgb(\n                from currentcolor r g b /\n                var(--md-sys-state-disabled-content)\n            );\n            cursor: default;\n        }\n    }\n\n    .radio-items {\n        display: grid;\n\n        &[data-orientation=\"horizontal\"] {\n            display: flex;\n        }\n    }\n\n    .radio {\n        /* invalid tokens */\n        --_md-radio-invalid-icon-color: var(--md-sys-color-error);\n        --_md-radio-invalid-state-layer-color: var(\n            --_md-radio-invalid-icon-color\n        );\n\n        /* indicator tokens */\n        --_md-radio-size: calc(20 * var(--dp, 1px));\n        --_md-radio-icon-size: calc(\n            var(--_md-radio-size) -\n            calc(10 * var(--dp, 1px))\n        );\n        --_md-radio-state-layer-size: calc(40 * var(--dp, 1px));\n\n        /* state layer tokens */\n        --_md-radio-pressed-state-layer-color: var(\n            --_md-radio-selected-state-layer-color\n        );\n        --_md-radio-pressed-selected-state-layer-color: var(\n            --_md-radio-state-layer-color\n        );\n\n        --_state-layer-opacity: 0;\n        --_state-color: var(--_md-radio-state-layer-color);\n\n        --_state-layer-color: rgb(\n            from var(--_state-color) r g b /\n            var(--_state-layer-opacity)\n        );\n\n        /* styles */\n        position: relative;\n\n        display: flex;\n        align-items: center;\n        gap: var(--md-sys-layout-space-16);\n\n        color: inherit;\n        cursor: pointer;\n\n        & * {\n            cursor: inherit;\n        }\n\n        &[data-disabled] {\n            cursor: default;\n        }\n\n        &[data-selected] {\n            --_state-color: var(--_md-radio-selected-state-layer-color);\n        }\n\n        &[data-pressed] {\n            --_state-layer-opacity: var(--md-sys-state-pressed);\n            --_state-color: var(--_md-radio-pressed-state-layer-color);\n\n            &[data-selected] {\n                --_state-color: var(\n                    --_md-radio-pressed-selected-state-layer-color\n                );\n            }\n        }\n\n        &[data-invalid] {\n            --_state-color: var(--_md-radio-invalid-state-layer-color);\n\n            &[data-selected] {\n                --_state-color: var(--_md-radio-invalid-state-layer-color);\n            }\n        }\n\n        &[data-hovered] {\n            --_state-layer-opacity: var(--md-sys-state-hover);\n            z-index: 1;\n        }\n\n        &[data-focus-visible] {\n            --_state-layer-opacity: var(--md-sys-state-focus);\n            z-index: 1;\n        }\n    }\n\n    .state-layer::before {\n        content: \"\";\n\n        position: absolute;\n        inset: calc(-1 * var(--md-sys-layout-space-12));\n\n        background-color: var(--_state-layer-color);\n        border-radius: var(--md-sys-shape-corner-radius-extra-small);\n\n        pointer-events: none;\n\n        transition: background-color\n            var(--md-sys-motion-expressive-fast-effects)\n            var(--md-sys-motion-expressive-fast-effects-duration);\n\n        @media (prefers-reduced-motion) {\n            transition: none;\n        }\n    }\n\n    .indicator {\n        --_indicator-color: var(--_md-radio-icon-color);\n\n        position: relative;\n\n        inline-size: var(--_md-radio-size);\n        aspect-ratio: 1 / 1;\n        border-radius: var(--md-sys-shape-corner-radius-full);\n\n        border: var(--md-sys-shape-border-width-thick) solid\n            var(--_indicator-color);\n\n        transition: border-color var(--md-sys-motion-expressive-default-effects)\n            var(--md-sys-motion-expressive-default-effects-duration);\n\n        @media (prefers-reduced-motion) {\n            transition: none;\n        }\n\n        &[data-selected] {\n            --_indicator-color: var(--_md-radio-selected-icon-color);\n        }\n\n        &[data-invalid] {\n            --_indicator-color: var(--_md-radio-invalid-icon-color);\n        }\n\n        &[data-pressed],\n        &[data-hovered],\n        &[data-focus-visible] {\n            --_indicator-color: var(--_md-radio-interaction-icon-color);\n\n            &[data-selected] {\n                --_indicator-color: var(\n                    --_md-radio-selected-interaction-icon-color\n                );\n            }\n\n            &[data-invalid] {\n                --_indicator-color: var(--_md-radio-invalid-icon-color);\n            }\n        }\n\n        &[data-disabled] {\n            --_indicator-color: rgb(\n                from var(--md-sys-color-on-surface) r g b /\n                var(--md-sys-state-disabled-content)\n            );\n\n            &[data-selected] {\n                --_indicator-color: rgb(\n                    from var(--md-sys-color-on-surface) r g b /\n                    var(--md-sys-state-disabled-content)\n                );\n            }\n        }\n    }\n\n    /* state layer */\n    .indicator[data-show-state-layer]::before {\n        content: \"\";\n\n        position: absolute;\n        inset-block-start: 50%;\n        inset-inline-start: 50%;\n        transform: translate(-50%, -50%);\n\n        inline-size: var(--_md-radio-state-layer-size);\n        aspect-ratio: 1 / 1;\n        border-radius: var(--md-sys-shape-corner-radius-full);\n\n        background-color: var(--_state-layer-color);\n\n        transition: background-color\n            var(--md-sys-motion-expressive-default-effects)\n            var(--md-sys-motion-expressive-default-effects-duration);\n\n        @media (prefers-reduced-motion) {\n            transition: none;\n        }\n    }\n\n    /* indicator center icon */\n    .indicator-icon {\n        content: \"\";\n\n        position: absolute;\n        inline-size: var(--_md-radio-icon-size);\n        aspect-ratio: 1 / 1;\n\n        inset-inline-start: 50%;\n        inset-block-start: 50%;\n        translate: -50% -50%;\n\n        background-color: var(--_indicator-color);\n        border-radius: var(--md-sys-shape-corner-radius-full);\n\n        scale: 0;\n\n        transition:\n            background-color var(--md-sys-motion-expressive-default-effects)\n            var(--md-sys-motion-expressive-default-effects-duration),\n            scale var(--md-sys-motion-standard-default-spatial)\n            var(--md-sys-motion-standard-default-spatial-duration);\n\n        @media (prefers-reduced-motion) {\n            transition: none;\n        }\n\n        &[data-selected] {\n            scale: 1;\n        }\n    }\n\n    .indicator[data-focus-visible] {\n        --focus-indicator-color: var(--md-sys-color-secondary);\n        --focus-indicator-thickness: calc(3 * var(--dp, 1px));\n        --focus-indicator-offset: calc(2 * var(--dp, 1px));\n\n        outline-width: var(--focus-indicator-thickness);\n        outline-style: solid;\n        outline-offset: var(--focus-indicator-offset);\n        outline-color: var(--focus-indicator-color);\n    }\n}\n","import { clsx } from \"clsx\";\nimport { useContext } from \"react\";\nimport { Radio as AriaRadio } from \"react-aria-components\";\nimport { typography } from \"@/utils\";\nimport { TapTarget } from \"@/utils/tapTarget\";\nimport { RadioGroupContext } from \"./context\";\nimport styles from \"./radio.module.css\";\nimport type { RadioProps } from \"./types\";\n\n/**\n * A radio button control implementing Material Design 3 Radio guidelines.\n *\n * Designed for single-choice options within a {@link RadioGroup}. Features animated\n * selection dot scaling, state layers, and flexible label positioning.\n *\n * @example\n * ```tsx\n * import { RadioGroup, Radio } from '@adgytec/web-ui-components';\n *\n * <RadioGroup label=\"Select an option\">\n *     <Radio value=\"1\">Option One</Radio>\n *     <Radio value=\"2\">Option Two</Radio>\n * </RadioGroup>\n * ```\n */\nexport const Radio: React.FC<RadioProps> = ({\n    className,\n    children,\n    labelPlacement,\n    containerStateLayer,\n    ...props\n}) => {\n    const {\n        labelPlacement: groupLabelPlacement,\n        containerStateLayer: groupContainerStateLayer,\n    } = useContext(RadioGroupContext);\n    const placement = labelPlacement ?? groupLabelPlacement ?? \"end\";\n    const stateLayer = containerStateLayer ?? groupContainerStateLayer ?? false;\n\n    return (\n        <AriaRadio\n            className={(renderProps) =>\n                clsx(\n                    styles[\"radio\"],\n                    stateLayer && styles[\"state-layer\"],\n                    typography.labelLarge,\n                    typeof className === \"function\"\n                        ? className(renderProps)\n                        : className\n                )\n            }\n            {...props}\n            data-radio\n        >\n            {(renderProps) => {\n                const {\n                    isSelected,\n                    isHovered,\n                    isDisabled,\n                    isFocused,\n                    isFocusVisible,\n                    isPressed,\n                    isInvalid,\n                } = renderProps;\n\n                const dataAttrs = {\n                    \"data-selected\": isSelected || undefined,\n                    \"data-hovered\": isHovered || undefined,\n                    \"data-disabled\": isDisabled || undefined,\n                    \"data-focused\": isFocused || undefined,\n                    \"data-focus-visible\": isFocusVisible || undefined,\n                    \"data-pressed\": isPressed || undefined,\n                    \"data-show-state-layer\": !stateLayer || undefined,\n                    \"data-invalid\": isInvalid || undefined,\n                };\n\n                const label =\n                    typeof children === \"function\"\n                        ? children(renderProps)\n                        : children;\n                return (\n                    <>\n                        {placement === \"start\" && label}\n\n                        <span\n                            className={clsx(styles[\"indicator\"], TapTarget)}\n                            {...dataAttrs}\n                        >\n                            <span\n                                className={clsx(styles[\"indicator-icon\"])}\n                                {...dataAttrs}\n                            ></span>\n                        </span>\n\n                        {placement === \"end\" && label}\n                    </>\n                );\n            }}\n        </AriaRadio>\n    );\n};\n","import { clsx } from \"clsx\";\nimport { RadioGroup as AriaRadioGroup } from \"react-aria-components\";\nimport { Description } from \"../Description\";\nimport { FieldError } from \"../FieldError\";\nimport { Label } from \"../Label\";\nimport { RadioGroupContext } from \"./context\";\nimport styles from \"./radio.module.css\";\nimport type { RadioGroupProps } from \"./types\";\n\n/**\n * A container managing mutually exclusive {@link Radio} options.\n *\n * Coordinates single-selection radio values, keyboard navigation arrow-key roving,\n * accessible labels, helper descriptions, and validation error messages.\n *\n * @example\n * ```tsx\n * import { RadioGroup, Radio } from '@adgytec/web-ui-components';\n *\n * <RadioGroup label=\"Delivery Speed\" defaultValue=\"standard\">\n *     <Radio value=\"standard\">Standard (3-5 days)</Radio>\n *     <Radio value=\"express\">Express (1-2 days)</Radio>\n *     <Radio value=\"overnight\">Overnight</Radio>\n * </RadioGroup>\n * ```\n */\nexport const RadioGroup: React.FC<RadioGroupProps> = ({\n    label,\n    description,\n    errorMessage,\n    showDescriptionOnInvalid = false,\n    children,\n    className,\n    radioItemsGap = 24,\n    labelPlacement,\n    containerStateLayer,\n    ...props\n}) => {\n    return (\n        <RadioGroupContext value={{ labelPlacement, containerStateLayer }}>\n            <AriaRadioGroup\n                className={(renderProps) =>\n                    clsx(\n                        styles[\"radio-group\"],\n                        typeof className === \"function\"\n                            ? className(renderProps)\n                            : className\n                    )\n                }\n                {...props}\n                data-radio-group\n            >\n                {({ orientation, isInvalid }) => {\n                    const showDescription =\n                        description &&\n                        (!isInvalid || (isInvalid && showDescriptionOnInvalid));\n\n                    return (\n                        <>\n                            {label && <Label>{label}</Label>}\n\n                            <div\n                                data-orientation={orientation}\n                                className={clsx(styles[\"radio-items\"])}\n                                style={{\n                                    gap: `calc(${radioItemsGap} * var(--dp, 1px))`,\n                                }}\n                            >\n                                {children}\n                            </div>\n\n                            {showDescription && (\n                                <Description>{description}</Description>\n                            )}\n                            <FieldError>{errorMessage}</FieldError>\n                        </>\n                    );\n                }}\n            </AriaRadioGroup>\n        </RadioGroupContext>\n    );\n};\n"],"mappings":"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"}

package/dist/chunks/RichTooltip.map

@@ -1 +1 @@
-{"version":3,"file":"RichTooltip","names":[],"sources":["../../src/components/Tooltip/RichTooltip/RichTooltip/richTooltip.module.css","../../src/components/Tooltip/RichTooltip/RichTooltip/RichTooltip.tsx"],"sourcesContent":["/* configurable tokens\n*\n* --md-rich-tooltip-background\n* --md-rich-tooltip-color\n*\n* configurable tokens end */\n\n@layer adgytec.comps {\n    .tooltip {\n        --_md-rich-tooltip-background: var(\n            --md-rich-tooltip-background,\n            var(--md-sys-color-surface-container)\n        );\n        --_md-rich-tooltip-color: var(\n            --md-rich-tooltip-color,\n            var(--md-sys-color-on-surface-variant)\n        );\n\n        display: grid;\n        gap: var(--md-sys-layout-space-12);\n\n        padding-block-start: var(--md-sys-layout-space-12);\n        padding-block-end: var(--md-sys-layout-space-8);\n\n        background-color: var(--_md-rich-tooltip-background);\n        color: var(--_md-rich-tooltip-color);\n\n        border-radius: var(--md-sys-shape-corner-radius-medium);\n        box-shadow: var(--md-sys-elevation-shadow-2);\n\n        max-inline-size: calc(300 * var(--dp, 1px));\n    }\n}\n","// https://m3.material.io/components/tooltips/guidelines#00e87770-86d0-436d-b50b-436ff3cefe75\n// use this with popover, for more details read the article\n\nimport clsx from \"clsx\";\nimport styles from \"./richTooltip.module.css\";\n\nexport const RichTooltip: React.FC<React.ComponentPropsWithRef<\"div\">> = ({\n    className,\n    ...props\n}) => {\n    return (\n        <div\n            className={clsx(styles[\"tooltip\"], className)}\n            {...props}\n            data-rich-tooltip\n        />\n    );\n};\n"],"mappings":";;;;kDCMa,KAA4D,MAAA;CAAA,IAAA,KAAA,GAAA,EAAA,EAAA,CAAA,CAAA,GAAA,GAAA;CAAA,AAAA,EAAA,OAAA,KAGxE,IAAA,EAAA,IAAA,IAAA,EAAA,OAHyE,kBAAA,KAAA,GAGzE,EAAA,KAAA,GAAA,EAAA,KAAA,GAAA,EAAA,KAAA;CAAA,IAAA;CAAA,AAAA,EAAA,OAAA,IAGwD,IAAA,EAAA,MAAlC,IAAA,EAAK,EAAM,SAAa,CAAS,GAAC,EAAA,KAAA,GAAA,EAAA,KAAA;CAAA,IAAA;CAG/C,OAH+C,EAAA,OAAA,KAAA,EAAA,OAAA,KADjD,IAAA,kBAAA,OAAA;EACe,WAAA;EAAkC,GACzC;EACJ,qBAAA;CAAiB,CAAA,GACnB,EAAA,KAAA,GAAA,EAAA,KAAA,GAAA,EAAA,KAAA,KAAA,IAAA,EAAA,IAJF;AAIE"}
+{"version":3,"file":"RichTooltip","names":["_c","clsx","styles","require_compiler_runtime","clsx$1","import_compiler_runtime","richTooltip_module_default","RichTooltip","$","className","props","t0","t1","t2"],"sources":["../../src/components/Tooltip/RichTooltip/RichTooltip/richTooltip.module.css","../../src/components/Tooltip/RichTooltip/RichTooltip/RichTooltip.tsx"],"sourcesContent":["/* configurable tokens\n*\n* --md-rich-tooltip-background\n* --md-rich-tooltip-color\n*\n* configurable tokens end */\n\n@layer adgytec.comps {\n    .tooltip {\n        --_md-rich-tooltip-background: var(\n            --md-rich-tooltip-background,\n            var(--md-sys-color-surface-container)\n        );\n        --_md-rich-tooltip-color: var(\n            --md-rich-tooltip-color,\n            var(--md-sys-color-on-surface-variant)\n        );\n\n        display: grid;\n        gap: var(--md-sys-layout-space-12);\n\n        padding-block-start: var(--md-sys-layout-space-12);\n        padding-block-end: var(--md-sys-layout-space-8);\n\n        background-color: var(--_md-rich-tooltip-background);\n        color: var(--_md-rich-tooltip-color);\n\n        border-radius: var(--md-sys-shape-corner-radius-medium);\n        box-shadow: var(--md-sys-elevation-shadow-2);\n\n        max-inline-size: calc(300 * var(--dp, 1px));\n    }\n}\n","// https://m3.material.io/components/tooltips/guidelines#00e87770-86d0-436d-b50b-436ff3cefe75\n// use this with popover, for more details read the article\n\nimport clsx from \"clsx\";\nimport styles from \"./richTooltip.module.css\";\n\n/**\n * Props for the {@link RichTooltip} component.\n * Extends standard `HTMLDivElement` attributes.\n *\n * Configurable CSS tokens:\n * - `--md-rich-tooltip-background`: Background color of the rich tooltip (`var(--md-sys-color-surface-container)`).\n * - `--md-rich-tooltip-color`: Text color of the rich tooltip (`var(--md-sys-color-on-surface-variant)`).\n */\nexport interface RichTooltipProps extends React.ComponentPropsWithRef<\"div\"> {}\n\n/**\n * Container component implementing [Material 3 Rich Tooltips](https://m3.material.io/components/tooltips/overview#89f33800-4f51-4043-9884-219159f427f7).\n *\n * Rich tooltips provide contextual information, descriptive subheads, body copy, and optional actions.\n * Typically rendered inside a `Popover` component triggered by a `DialogTrigger`.\n *\n * Configurable CSS tokens:\n * - `--md-rich-tooltip-background`: Background color of the rich tooltip (`var(--md-sys-color-surface-container)`).\n * - `--md-rich-tooltip-color`: Text color of the rich tooltip (`var(--md-sys-color-on-surface-variant)`).\n *\n * @example\n * ```tsx\n * import {\n *     Button,\n *     Popover,\n *     RichTooltip,\n *     RichTooltipActions,\n *     RichTooltipInfo,\n *     RichTooltipSubhead,\n *     RichTooltipText,\n * } from \"@adgytec/web-ui-components\";\n * import { DialogTrigger } from \"react-aria-components\";\n *\n * export function Example() {\n *     return (\n *         <DialogTrigger>\n *             <Button label=\"More Info\" />\n *             <Popover>\n *                 <RichTooltip>\n *                     <RichTooltipInfo>\n *                         <RichTooltipSubhead>Feature Overview</RichTooltipSubhead>\n *                         <RichTooltipText>\n *                             Detailed explanation of this feature and its benefits.\n *                         </RichTooltipText>\n *                     </RichTooltipInfo>\n *                     <RichTooltipActions>\n *                         <Button label=\"Learn More\" size=\"small\" color=\"text\" />\n *                     </RichTooltipActions>\n *                 </RichTooltip>\n *             </Popover>\n *         </DialogTrigger>\n *     );\n * }\n * ```\n */\nexport const RichTooltip: React.FC<RichTooltipProps> = ({\n    className,\n    ...props\n}) => {\n    return (\n        <div\n            className={clsx(styles[\"tooltip\"], className)}\n            {...props}\n            data-rich-tooltip\n        />\n    );\n};\n"],"mappings":";;;;kDC6DaO,KAA0C,MAAA;CAAA,IAAAC,KAAA,GAAAR,EAAAA,EAAAA,CAAA,CAAA,GAAAS,GAAAC;CAAA,AAAAF,EAAA,OAAAG,KAGtD,IAAAH,EAAA,IAAA,IAAAA,EAAA,OAHuD,eAAA,GAAAE,KAAAC,GAGvD,EAAA,KAAAA,GAAA,EAAA,KAAAF,GAAA,EAAA,KAAAC;CAAA,IAAAE;CAAA,AAAAJ,EAAA,OAAAC,IAGwD,IAAAD,EAAA,MAAlC,IAAAP,EAAKC,EAAM,SAAaO,CAAS,GAAC,EAAA,KAAAA,GAAA,EAAA,KAAAG;CAAA,IAAAC;CAG/C,OAH+CL,EAAA,OAAAE,KAAAF,EAAA,OAAAI,KADjD,IAAA,kBAAA,OAAA;EACe,WAAAA;EAAkC,GACzCF;EACJ,qBAAA;CAAiB,CAAA,GACnB,EAAA,KAAAA,GAAA,EAAA,KAAAE,GAAA,EAAA,KAAAC,KAAA,IAAAL,EAAA,IAJFK;AAIE"}

package/dist/chunks/RichTooltipActions.map

@@ -1 +1 @@
-{"version":3,"file":"RichTooltipActions","names":[],"sources":["../../src/components/Tooltip/RichTooltip/RichTooltipActions/richTooltipActions.module.css","../../src/components/Tooltip/RichTooltip/RichTooltipActions/RichTooltipActions.tsx"],"sourcesContent":["@layer adgytec.comps {\n    .actions {\n        display: flex;\n        align-items: center;\n        gap: var(--md-sys-layout-space-4);\n    }\n}\n","import clsx from \"clsx\";\nimport styles from \"./richTooltipActions.module.css\";\n\n// use Button color -> text and size -> small\nexport const RichTooltipActions: React.FC<\n    React.ComponentPropsWithRef<\"div\">\n> = ({ className, ...props }) => {\n    return <div className={clsx(styles[\"actions\"], className)} {...props} />;\n};\n"],"mappings":";;;;kDCIa,KAET,MAAA;CAAA,IAAA,KAAA,GAAA,EAAA,EAAA,CAAA,CAAA,GAAA,GAAA;CAAA,AAAA,EAAA,OAAA,KAAwB,IAAA,EAAA,IAAA,IAAA,EAAA,OAAvB,kBAAA,KAAA,GAAuB,EAAA,KAAA,GAAA,EAAA,KAAA,GAAA,EAAA,KAAA;CAAA,IAAA;CAAA,AAAA,EAAA,OAAA,IACiC,IAAA,EAAA,MAAlC,IAAA,EAAK,EAAM,SAAa,CAAS,GAAC,EAAA,KAAA,GAAA,EAAA,KAAA;CAAA,IAAA;CAAe,OAAf,EAAA,OAAA,KAAA,EAAA,OAAA,KAAlD,IAAA,kBAAA,OAAA;EAAgB,WAAA;EAAkC,GAAM;CAAK,CAAA,GAAI,EAAA,KAAA,GAAA,EAAA,KAAA,GAAA,EAAA,KAAA,KAAA,IAAA,EAAA,IAAjE;AAAiE"}
+{"version":3,"file":"RichTooltipActions","names":["_c","clsx","styles","require_compiler_runtime","clsx$1","import_compiler_runtime","richTooltipActions_module_default","RichTooltipActions","$","className","props","t0","t1","t2"],"sources":["../../src/components/Tooltip/RichTooltip/RichTooltipActions/richTooltipActions.module.css","../../src/components/Tooltip/RichTooltip/RichTooltipActions/RichTooltipActions.tsx"],"sourcesContent":["@layer adgytec.comps {\n    .actions {\n        display: flex;\n        align-items: center;\n        gap: var(--md-sys-layout-space-4);\n    }\n}\n","import clsx from \"clsx\";\nimport styles from \"./richTooltipActions.module.css\";\n\n/**\n * Props for the {@link RichTooltipActions} component.\n * Extends standard `HTMLDivElement` attributes.\n */\nexport interface RichTooltipActionsProps\n    extends React.ComponentPropsWithRef<\"div\"> {}\n\n/**\n * Action button container for a {@link RichTooltip}.\n *\n * Renders action elements at the bottom of the rich tooltip with proper horizontal alignment and spacing.\n * Recommended to contain buttons with `size=\"small\"` and `color=\"text\"`.\n *\n * @example\n * ```tsx\n * import { Button, RichTooltipActions } from \"@adgytec/web-ui-components\";\n *\n * export function Example() {\n *     return (\n *         <RichTooltipActions>\n *             <Button label=\"Dismiss\" size=\"small\" color=\"text\" />\n *             <Button label=\"Learn More\" size=\"small\" color=\"text\" />\n *         </RichTooltipActions>\n *     );\n * }\n * ```\n */\nexport const RichTooltipActions: React.FC<RichTooltipActionsProps> = ({\n    className,\n    ...props\n}) => {\n    return <div className={clsx(styles[\"actions\"], className)} {...props} />;\n};\n"],"mappings":";;;;kDC8BaO,KAAwD,MAAA;CAAA,IAAAC,KAAA,GAAAR,EAAAA,EAAAA,CAAA,CAAA,GAAAS,GAAAC;CAAA,AAAAF,EAAA,OAAAG,KAGpE,IAAAH,EAAA,IAAA,IAAAA,EAAA,OAHqE,eAAA,GAAAE,KAAAC,GAGrE,EAAA,KAAAA,GAAA,EAAA,KAAAF,GAAA,EAAA,KAAAC;CAAA,IAAAE;CAAA,AAAAJ,EAAA,OAAAC,IAC4D,IAAAD,EAAA,MAAlC,IAAAP,EAAKC,EAAM,SAAaO,CAAS,GAAC,EAAA,KAAAA,GAAA,EAAA,KAAAG;CAAA,IAAAC;CAAe,OAAfL,EAAA,OAAAE,KAAAF,EAAA,OAAAI,KAAlD,IAAA,kBAAA,OAAA;EAAgB,WAAAA;EAAkC,GAAMF;CAAK,CAAA,GAAI,EAAA,KAAAA,GAAA,EAAA,KAAAE,GAAA,EAAA,KAAAC,KAAA,IAAAL,EAAA,IAAjEK;AAAiE"}

package/dist/chunks/RichTooltipInfo.map

@@ -1 +1 @@
-{"version":3,"file":"RichTooltipInfo","names":[],"sources":["../../src/components/Tooltip/RichTooltip/RichTooltipInfo/RichTooltipInfo/richTooltipInfo.module.css","../../src/components/Tooltip/RichTooltip/RichTooltipInfo/RichTooltipInfo/RichTooltipInfo.tsx"],"sourcesContent":["@layer adgytec.comps {\n    .info {\n        padding-inline: var(--md-sys-layout-space-16);\n\n        display: grid;\n        gap: var(--md-sys-layout-space-4);\n    }\n}\n","import clsx from \"clsx\";\nimport styles from \"./richTooltipInfo.module.css\";\n\nexport const RichTooltipInfo: React.FC<React.ComponentPropsWithRef<\"div\">> = ({\n    className,\n    ...props\n}) => {\n    return <div className={clsx(styles[\"info\"], className)} {...props} />;\n};\n"],"mappings":";;;;4CCGa,KAAgE,MAAA;CAAA,IAAA,KAAA,GAAA,EAAA,EAAA,CAAA,CAAA,GAAA,GAAA;CAAA,AAAA,EAAA,OAAA,KAG5E,IAAA,EAAA,IAAA,IAAA,EAAA,OAH6E,kBAAA,KAAA,GAG7E,EAAA,KAAA,GAAA,EAAA,KAAA,GAAA,EAAA,KAAA;CAAA,IAAA;CAAA,AAAA,EAAA,OAAA,IACyD,IAAA,EAAA,MAA/B,IAAA,EAAK,EAAM,MAAU,CAAS,GAAC,EAAA,KAAA,GAAA,EAAA,KAAA;CAAA,IAAA;CAAe,OAAf,EAAA,OAAA,KAAA,EAAA,OAAA,KAA/C,IAAA,kBAAA,OAAA;EAAgB,WAAA;EAA+B,GAAM;CAAK,CAAA,GAAI,EAAA,KAAA,GAAA,EAAA,KAAA,GAAA,EAAA,KAAA,KAAA,IAAA,EAAA,IAA9D;AAA8D"}
+{"version":3,"file":"RichTooltipInfo","names":["_c","clsx","styles","require_compiler_runtime","clsx$1","import_compiler_runtime","richTooltipInfo_module_default","RichTooltipInfo","$","className","props","t0","t1","t2"],"sources":["../../src/components/Tooltip/RichTooltip/RichTooltipInfo/RichTooltipInfo/richTooltipInfo.module.css","../../src/components/Tooltip/RichTooltip/RichTooltipInfo/RichTooltipInfo/RichTooltipInfo.tsx"],"sourcesContent":["@layer adgytec.comps {\n    .info {\n        padding-inline: var(--md-sys-layout-space-16);\n\n        display: grid;\n        gap: var(--md-sys-layout-space-4);\n    }\n}\n","import clsx from \"clsx\";\nimport styles from \"./richTooltipInfo.module.css\";\n\n/**\n * Props for the {@link RichTooltipInfo} component.\n * Extends standard `HTMLDivElement` attributes.\n */\nexport interface RichTooltipInfoProps\n    extends React.ComponentPropsWithRef<\"div\"> {}\n\n/**\n * Text content container for a {@link RichTooltip}.\n *\n * Houses the {@link RichTooltipSubhead} title and {@link RichTooltipText} description\n * with proper Material 3 padding and spacing.\n *\n * @example\n * ```tsx\n * import {\n *     RichTooltipInfo,\n *     RichTooltipSubhead,\n *     RichTooltipText,\n * } from \"@adgytec/web-ui-components\";\n *\n * export function Example() {\n *     return (\n *         <RichTooltipInfo>\n *             <RichTooltipSubhead>Header Title</RichTooltipSubhead>\n *             <RichTooltipText>Informative description goes here.</RichTooltipText>\n *         </RichTooltipInfo>\n *     );\n * }\n * ```\n */\nexport const RichTooltipInfo: React.FC<RichTooltipInfoProps> = ({\n    className,\n    ...props\n}) => {\n    return <div className={clsx(styles[\"info\"], className)} {...props} />;\n};\n"],"mappings":";;;;4CCkCaO,KAAkD,MAAA;CAAA,IAAAC,KAAA,GAAAR,EAAAA,EAAAA,CAAA,CAAA,GAAAS,GAAAC;CAAA,AAAAF,EAAA,OAAAG,KAG9D,IAAAH,EAAA,IAAA,IAAAA,EAAA,OAH+D,eAAA,GAAAE,KAAAC,GAG/D,EAAA,KAAAA,GAAA,EAAA,KAAAF,GAAA,EAAA,KAAAC;CAAA,IAAAE;CAAA,AAAAJ,EAAA,OAAAC,IACyD,IAAAD,EAAA,MAA/B,IAAAP,EAAKC,EAAM,MAAUO,CAAS,GAAC,EAAA,KAAAA,GAAA,EAAA,KAAAG;CAAA,IAAAC;CAAe,OAAfL,EAAA,OAAAE,KAAAF,EAAA,OAAAI,KAA/C,IAAA,kBAAA,OAAA;EAAgB,WAAAA;EAA+B,GAAMF;CAAK,CAAA,GAAI,EAAA,KAAAA,GAAA,EAAA,KAAAE,GAAA,EAAA,KAAAC,KAAA,IAAAL,EAAA,IAA9DK;AAA8D"}

package/dist/chunks/SearchField.map

@@ -1 +1 @@
-{"version":3,"file":"SearchField","names":[],"sources":["../../src/components/Input/SearchField/searchField.module.css","../../src/components/Input/SearchField/SearchField.tsx"],"sourcesContent":["/* configurable tokens\n*\n* --md-search-field-background\n* --md-search-field-color\n* --md-search-field-supporting-color\n*\n* configurable tokens end */\n\n@layer adgytec.comps {\n    .search-field {\n        --_md-search-field-background: var(\n            --md-search-field-background,\n            var(--md-sys-color-surface-container-high)\n        );\n        --_md-search-field-color: var(\n            --md-search-field-color,\n            var(--md-sys-color-on-surface)\n        );\n        --_md-search-field-supporting-color: var(\n            --md-search-field-supporting-color,\n            var(--md-sys-color-on-surface-variant)\n        );\n\n        display: flex;\n        align-items: center;\n\n        background-color: var(--_md-search-field-background);\n        color: var(--_md-search-field-color);\n\n        box-shadow: var(--md-sys-elevation-shadow-3);\n\n        padding-block: var(--md-sys-layout-space-8);\n        padding-inline-start: var(--md-sys-layout-space-16);\n        padding-inline-end: var(--md-sys-layout-space-8);\n\n        border-radius: var(--md-sys-shape-corner-radius-full);\n\n        &[data-empty] {\n            padding-block: var(--md-sys-layout-space-16);\n        }\n\n        &:has([data-focused]) {\n            --focus-indicator-thickness: calc(3 * var(--dp, 1px));\n            --focus-indicator-offset: calc(2 * var(--dp, 1px));\n            --focus-indicator-color: var(--md-sys-color-secondary);\n\n            outline-width: var(--focus-indicator-thickness);\n            outline-style: solid;\n            outline-offset: var(--focus-indicator-offset);\n            outline-color: var(--focus-indicator-color);\n        }\n\n        &[data-disabled] {\n            --_md-search-field-background: rgb(\n                from var(--md-sys-color-surface-container-high) r g b /\n                var(--md-sys-state-disabled-container)\n            );\n            --_md-search-field-color: rgb(\n                from currentColor r g b /\n                var(--md-sys-state-disabled-content)\n            );\n            box-shadow: none;\n        }\n    }\n\n    .search-field [data-button] {\n        --md-button-color: var(--_md-search-field-supporting-color);\n\n        &[data-disabled] [data-visual-button] {\n            background-color: transparent;\n        }\n    }\n\n    .input {\n        all: unset;\n\n        width: 100%;\n\n        padding-inline-start: var(--md-sys-layout-space-16);\n        padding-inline-end: var(--md-sys-layout-space-8);\n\n        &[data-disabled] {\n            cursor: default;\n        }\n    }\n\n    .input::placeholder {\n        color: var(--_md-search-field-supporting-color);\n    }\n\n    .input[data-disabled]::placeholder {\n        color: rgb(\n            from currentColor r g b /\n            var(--md-sys-state-disabled-content)\n        );\n    }\n}\n","import { clsx } from \"clsx\";\nimport { Search, X } from \"lucide-react\";\nimport { SearchField as AriaSearchField, Input } from \"react-aria-components\";\nimport { IconButton } from \"@/components/Button\";\nimport { Icon } from \"@/components/Icon\";\nimport { typography } from \"@/utils\";\nimport styles from \"./searchField.module.css\";\nimport type { SearchFieldProps } from \"./types\";\n\nexport const SearchField: React.FC<SearchFieldProps> = ({\n    placeholder = \"Search\",\n    className,\n    ...props\n}) => {\n    return (\n        <AriaSearchField\n            className={(renderProps) =>\n                clsx(\n                    styles[\"search-field\"],\n                    typeof className === \"function\"\n                        ? className(renderProps)\n                        : className\n                )\n            }\n            {...props}\n        >\n            {({ isEmpty }) => (\n                <>\n                    <Icon icon={Search} size={24} data-search-icon />\n\n                    <Input\n                        className={clsx(styles[\"input\"], typography.bodyLarge)}\n                        placeholder={placeholder}\n                    />\n\n                    {!isEmpty && (\n                        <IconButton\n                            icon={X}\n                            size=\"small\"\n                            width=\"default\"\n                            color=\"standard\"\n                        />\n                    )}\n                </>\n            )}\n        </AriaSearchField>\n    );\n};\n"],"mappings":";;;;;;;;;;GCSa,KAA2C,EACpD,iBAAc,UACd,cACA,GAAG,QAGC,kBAAC,GAAD;CACI,YAAY,MACR,EACI,EAAO,iBACP,OAAO,KAAc,aACf,EAAU,CAAW,IACrB,CACV;CAEJ,GAAI;YAEF,EAAE,iBACA,kBAAA,GAAA,EAAA,UAAA;EACI,kBAAC,GAAD;GAAM,MAAM;GAAQ,MAAM;GAAI,oBAAA;EAAgB,CAAA;EAE9C,kBAAC,GAAD;GACI,WAAW,EAAK,EAAO,OAAU,EAAW,SAAS;GACxC;EAAY,CAAA;EAG5B,CAAC,KACE,kBAAC,GAAD;GACI,MAAM;GACN,MAAK;GACL,OAAM;GACN,OAAM;EAAU,CAAA;CAG5B,EAAA,CAAA;AAES,CAAA"}
+{"version":3,"file":"SearchField","names":["SearchField","AriaSearchField","styles","_Fragment","typography","searchField_module_default","SearchField$1","props","SearchField","clsx","className","renderProps","Fragment","Icon","Search","Input","\"input\"","isEmpty","IconButton","X"],"sources":["../../src/components/Input/SearchField/searchField.module.css","../../src/components/Input/SearchField/SearchField.tsx"],"sourcesContent":["/* configurable tokens\n*\n* --md-search-field-background\n* --md-search-field-color\n* --md-search-field-supporting-color\n*\n* configurable tokens end */\n\n@layer adgytec.comps {\n    .search-field {\n        --_md-search-field-background: var(\n            --md-search-field-background,\n            var(--md-sys-color-surface-container-high)\n        );\n        --_md-search-field-color: var(\n            --md-search-field-color,\n            var(--md-sys-color-on-surface)\n        );\n        --_md-search-field-supporting-color: var(\n            --md-search-field-supporting-color,\n            var(--md-sys-color-on-surface-variant)\n        );\n\n        display: flex;\n        align-items: center;\n\n        background-color: var(--_md-search-field-background);\n        color: var(--_md-search-field-color);\n\n        box-shadow: var(--md-sys-elevation-shadow-3);\n\n        padding-block: var(--md-sys-layout-space-8);\n        padding-inline-start: var(--md-sys-layout-space-16);\n        padding-inline-end: var(--md-sys-layout-space-8);\n\n        border-radius: var(--md-sys-shape-corner-radius-full);\n\n        &[data-empty] {\n            padding-block: var(--md-sys-layout-space-16);\n        }\n\n        &:has([data-focused]) {\n            --focus-indicator-thickness: calc(3 * var(--dp, 1px));\n            --focus-indicator-offset: calc(2 * var(--dp, 1px));\n            --focus-indicator-color: var(--md-sys-color-secondary);\n\n            outline-width: var(--focus-indicator-thickness);\n            outline-style: solid;\n            outline-offset: var(--focus-indicator-offset);\n            outline-color: var(--focus-indicator-color);\n        }\n\n        &[data-disabled] {\n            --_md-search-field-background: rgb(\n                from var(--md-sys-color-surface-container-high) r g b /\n                var(--md-sys-state-disabled-container)\n            );\n            --_md-search-field-color: rgb(\n                from currentColor r g b /\n                var(--md-sys-state-disabled-content)\n            );\n            box-shadow: none;\n        }\n    }\n\n    .search-field [data-button] {\n        --md-button-color: var(--_md-search-field-supporting-color);\n\n        &[data-disabled] [data-visual-button] {\n            background-color: transparent;\n        }\n    }\n\n    .input {\n        all: unset;\n\n        width: 100%;\n\n        padding-inline-start: var(--md-sys-layout-space-16);\n        padding-inline-end: var(--md-sys-layout-space-8);\n\n        &[data-disabled] {\n            cursor: default;\n        }\n    }\n\n    .input::placeholder {\n        color: var(--_md-search-field-supporting-color);\n    }\n\n    .input[data-disabled]::placeholder {\n        color: rgb(\n            from currentColor r g b /\n            var(--md-sys-state-disabled-content)\n        );\n    }\n}\n","import { clsx } from \"clsx\";\nimport { Search, X } from \"lucide-react\";\nimport { SearchField as AriaSearchField, Input } from \"react-aria-components\";\nimport { IconButton } from \"@/components/Button\";\nimport { Icon } from \"@/components/Icon\";\nimport { typography } from \"@/utils\";\nimport styles from \"./searchField.module.css\";\nimport type { SearchFieldProps } from \"./types\";\n\n/**\n * A search input field providing a leading search icon and automatic clear button.\n *\n * Implements accessible search interactions based on React Aria's `SearchField`,\n * clearing text via keyboard (`Escape`) or the integrated clear button.\n *\n * @example\n * ```tsx\n * import { SearchField } from '@adgytec/web-ui-components';\n *\n * <SearchField\n *     placeholder=\"Search documents...\"\n *     onSubmit={(query) => console.log('Searching for:', query)}\n * />\n * ```\n */\nexport const SearchField: React.FC<SearchFieldProps> = ({\n    placeholder = \"Search\",\n    className,\n    ...props\n}) => {\n    return (\n        <AriaSearchField\n            className={(renderProps) =>\n                clsx(\n                    styles[\"search-field\"],\n                    typeof className === \"function\"\n                        ? className(renderProps)\n                        : className\n                )\n            }\n            {...props}\n        >\n            {({ isEmpty }) => (\n                <>\n                    <Icon icon={Search} size={24} data-search-icon />\n\n                    <Input\n                        className={clsx(styles[\"input\"], typography.bodyLarge)}\n                        placeholder={placeholder}\n                    />\n\n                    {!isEmpty && (\n                        <IconButton\n                            icon={X}\n                            size=\"small\"\n                            width=\"default\"\n                            color=\"standard\"\n                        />\n                    )}\n                </>\n            )}\n        </AriaSearchField>\n    );\n};\n"],"mappings":";;;;;;;;;;GCyBaA,KAA2C,EACpD,iBAAc,UACd,cACA,GAAGO,QAGC,kBAACN,GAAD;CACI,YAAY,MACRQ,EACIP,EAAO,iBACP,OAAOQ,KAAc,aACfA,EAAUC,CAAW,IACrBD,CACV;CAEJ,GAAIH;CAEF,WAAA,EAAE,iBACA,kBAAAJ,GAAA,EAAA,UAAA;EACI,kBAACU,GAAD;GAAM,MAAMC;GAAQ,MAAM;GAAI,oBAAA;EAAgB,CAAA;EAE9C,kBAACC,GAAD;GACI,WAAWN,EAAKP,EAAOc,OAAUZ,EAAW,SAAS;GACxC;EAAY,CAAA;EAG5B,CAACa,KACE,kBAACC,GAAD;GACI,MAAMC;GACN,MAAK;GACL,OAAM;GACN,OAAM;EAAU,CAAA;CAG5B,EAAA,CAAA;AAES,CAAA"}

package/dist/chunks/SelectPopover.map

@@ -1 +1 @@
-{"version":3,"file":"SelectPopover","names":[],"sources":["../../src/components/Input/Select/SelectPopover/selectPopover.module.css","../../src/components/Input/Select/SelectPopover/SelectPopover.tsx"],"sourcesContent":["@layer adgytec.comps {\n    .popover {\n        min-inline-size: var(--trigger-width);\n\n        display: grid;\n        grid-template-rows: 1fr;\n    }\n}\n","import { clsx } from \"clsx\";\nimport { Popover } from \"@/components/Popover\";\nimport styles from \"./selectPopover.module.css\";\n\nexport const SelectPopover: React.FC<\n    React.ComponentPropsWithRef<typeof Popover>\n> = ({ className, ...props }) => {\n    return (\n        <Popover\n            className={(renderProps) =>\n                clsx(\n                    styles[\"popover\"],\n                    typeof className === \"function\"\n                        ? className(renderProps)\n                        : className\n                )\n            }\n            {...props}\n        />\n    );\n};\n"],"mappings":";;;;;kDCIa,KAET,MAAA;CAAA,IAAA,KAAA,GAAA,EAAA,EAAA,CAAA,CAAA,GAAA,GAAA;CAAA,AAAA,EAAA,OAAA,KAAwB,IAAA,EAAA,IAAA,IAAA,EAAA,OAAvB,kBAAA,KAAA,GAAuB,EAAA,KAAA,GAAA,EAAA,KAAA,GAAA,EAAA,KAAA;CAAA,IAAA;CAAA,AAAA,EAAA,OAAA,IASX,IAAA,EAAA,MANM,KAAA,MACP,EACI,EAAM,SACN,OAAO,KAAc,aACf,EAAU,CACF,IAFd,CAGJ,GAAC,EAAA,KAAA,GAAA,EAAA,KAAA;CAAA,IAAA;CAGP,OAHO,EAAA,OAAA,KAAA,EAAA,OAAA,KAPT,IAAA,kBAAC,GAAD;EACe,WAAA;EAMN,GAED;CAAK,CAAA,GACX,EAAA,KAAA,GAAA,EAAA,KAAA,GAAA,EAAA,KAAA,KAAA,IAAA,EAAA,IAVF;AAUE"}
+{"version":3,"file":"SelectPopover","names":["_c","styles","require_compiler_runtime","import_compiler_runtime","selectPopover_module_default","SelectPopover","$","className","props","t0","t1","clsx","renderProps","t2","Popover"],"sources":["../../src/components/Input/Select/SelectPopover/selectPopover.module.css","../../src/components/Input/Select/SelectPopover/SelectPopover.tsx"],"sourcesContent":["@layer adgytec.comps {\n    .popover {\n        min-inline-size: var(--trigger-width);\n\n        display: grid;\n        grid-template-rows: 1fr;\n    }\n}\n","import { clsx } from \"clsx\";\nimport { Popover } from \"@/components/Popover\";\nimport styles from \"./selectPopover.module.css\";\n\n/**\n * Props for the {@link SelectPopover} component.\n * Extends {@link Popover} props.\n */\nexport interface SelectPopoverProps\n    extends React.ComponentPropsWithRef<typeof Popover> {}\n\n/**\n * Floating dropdown container for displaying {@link SelectList} items.\n */\nexport const SelectPopover: React.FC<SelectPopoverProps> = ({\n    className,\n    ...props\n}) => {\n    return (\n        <Popover\n            className={(renderProps) =>\n                clsx(\n                    styles[\"popover\"],\n                    typeof className === \"function\"\n                        ? className(renderProps)\n                        : className\n                )\n            }\n            {...props}\n        />\n    );\n};\n"],"mappings":";;;;;kDCcaK,KAA8C,MAAA;CAAA,IAAAC,KAAA,GAAAN,EAAAA,EAAAA,CAAA,CAAA,GAAAO,GAAAC;CAAA,AAAAF,EAAA,OAAAG,KAG1D,IAAAH,EAAA,IAAA,IAAAA,EAAA,OAH2D,eAAA,GAAAE,KAAAC,GAG3D,EAAA,KAAAA,GAAA,EAAA,KAAAF,GAAA,EAAA,KAAAC;CAAA,IAAAE;CAAA,AAAAJ,EAAA,OAAAC,IASgB,IAAAD,EAAA,MANM,KAAA,MACPK,EACIV,EAAM,SACN,OAAOM,KAAc,aACfA,EAAUK,CACF,IAFdL,CAGJ,GAAC,EAAA,KAAAA,GAAA,EAAA,KAAAG;CAAA,IAAAG;CAGP,OAHOP,EAAA,OAAAE,KAAAF,EAAA,OAAAI,KAPT,IAAA,kBAACI,GAAD;EACe,WAAAJ;EAMN,GAEDF;CAAK,CAAA,GACX,EAAA,KAAAA,GAAA,EAAA,KAAAE,GAAA,EAAA,KAAAG,KAAA,IAAAP,EAAA,IAVFO;AAUE"}

package/dist/chunks/SelectTrigger.map

@@ -1 +1 @@
-{"version":3,"file":"SelectTrigger","names":["ChevronDown","TextFieldIconSize"],"sources":["../../src/components/Input/Select/SelectTrigger/selectTrigger.module.css","../../src/components/Input/Select/SelectTrigger/SelectTrigger.tsx"],"sourcesContent":["@layer adgytec.overrides {\n    .trigger {\n        --rotate: 0;\n\n        justify-content: space-between;\n        cursor: pointer;\n\n        &[data-pressed] {\n            --rotate: 180deg;\n        }\n\n        > svg {\n            color: var(--group-color);\n            rotate: var(--rotate);\n            transition: rotate var(--md-sys-motion-expressive-fast-spatial)\n                var(--md-sys-motion-expressive-fast-spatial-duration);\n\n            @media (prefers-reduced-motion) {\n                transition: none;\n            }\n        }\n\n        &[data-pressed] {\n            --outline-color: var(--outline-color-focused-normal);\n            --outline-color-focused: var(--outline-color);\n\n            &[data-invalid] {\n                --outline-color: var(--outline-color-invalid);\n            }\n        }\n\n        &[data-disabled] {\n            cursor: default;\n        }\n    }\n\n    .select-value {\n        flex: 1;\n        text-align: start;\n        overflow: hidden;\n        text-overflow: ellipsis;\n        white-space: nowrap;\n\n        &[data-placeholder] {\n            color: var(--placeholder-color);\n        }\n    }\n}\n","import clsx from \"clsx\";\nimport { ChevronDown } from \"lucide-react\";\nimport { useContext } from \"react\";\nimport { Button, SelectStateContext, SelectValue } from \"react-aria-components\";\nimport { Icon } from \"@/components/Icon\";\nimport { typography } from \"@/utils\";\nimport {\n    EditorInputStyles,\n    EditorStyles,\n    TextFieldIconSize,\n    UnsetStyles,\n} from \"../../core\";\nimport styles from \"./selectTrigger.module.css\";\n\nexport const SelectTrigger: React.FC<\n    Omit<React.ComponentPropsWithRef<typeof Button>, \"children\">\n> = (props) => {\n    const selectContextVal = useContext(SelectStateContext);\n    const invalid = selectContextVal?.displayValidation.isInvalid;\n\n    return (\n        <Button\n            className={clsx(\n                UnsetStyles,\n                EditorStyles,\n                EditorInputStyles,\n                typography.bodyLarge,\n                styles[\"trigger\"]\n            )}\n            {...props}\n            data-invalid={invalid || undefined}\n            data-select-trigger={true}\n        >\n            <SelectValue className={clsx(styles[\"select-value\"])}>\n                {({ selectedText, isPlaceholder, defaultChildren }) =>\n                    isPlaceholder ? defaultChildren : selectedText\n                }\n            </SelectValue>\n\n            <Icon icon={ChevronDown} size={TextFieldIconSize} />\n        </Button>\n    );\n};\n"],"mappings":";;;;;;;;;;;;;GCca,KAET,MAAA;CAAA,IAAA,KAAA,GAAA,EAAA,EAAA,CAAA,CAAA,GAEA,IADyB,EAAW,CACpB,CAAA,EAAgB,kBAA6B,WAAC;CAAA,AAAA,EAAA,OAAA,OAAA,IAAA,2BAAA,KAI3C,IAAA,EACP,GACA,GACA,GACA,EAAU,WACV,EAAM,OACV,GAAC,EAAA,KAAA,KAAA,IAAA,EAAA;CAEa,IAAA,IAAA,KAAA,KAAA,GAAoB,GAAA;CAAA,AAAA,EAAA,OAAA,OAAA,IAAA,2BAAA,KAGlC,IAAA,kBAAC,GAAD;EAAwB,WAAA,EAAK,EAAO,eAAe;YAC9C;CADO,CAAA,GAMZ,IAAA,kBAAC,GAAD;EAAYA,MAAA;EAAmBC,MAAAA;CAAiB,CAAA,GAAI,EAAA,KAAA,GAAA,EAAA,KAAA,MAAA,IAAA,EAAA,IAAA,IAAA,EAAA;CAAA,IAAA;CAC/C,OAD+C,EAAA,OAAA,KAAA,EAAA,OAAA,KAlBxD,IAAA,kBAAC,GAAD;EACe,WAAA;EAMV,GACG;EACU,gBAAA;EACO,uBAAA;YAVzB,CAYI,GAMA,CAlBG;KAmBE,EAAA,KAAA,GAAA,EAAA,KAAA,GAAA,EAAA,KAAA,KAAA,IAAA,EAAA,IAnBT;AAmBS;AAxBb,SAAA,EAAA,GAAA;CAkBc,IAAA,EAAA,iBAAA,kBAAA,uBAAA;CAAgD,OAC9C,IAAA,IAAA;AAA8C"}
+{"version":3,"file":"SelectTrigger","names":["ChevronDown","TextFieldIconSize","_c","clsx","styles","require_compiler_runtime","Icon","UnsetStyles","EditorInputStyles","EditorStyles","clsx$1","import_compiler_runtime","selectTrigger_module_default","SelectTrigger","$","invalid","useContext","SelectStateContext","t0","typography","t1","t2","t3","SelectValue","_temp","ChevronDown","t4","props","Button","isPlaceholder","defaultChildren","selectedText"],"sources":["../../src/components/Input/Select/SelectTrigger/selectTrigger.module.css","../../src/components/Input/Select/SelectTrigger/SelectTrigger.tsx"],"sourcesContent":["@layer adgytec.overrides {\n    .trigger {\n        --rotate: 0;\n\n        justify-content: space-between;\n        cursor: pointer;\n\n        &[data-pressed] {\n            --rotate: 180deg;\n        }\n\n        > svg {\n            color: var(--group-color);\n            rotate: var(--rotate);\n            transition: rotate var(--md-sys-motion-expressive-fast-spatial)\n                var(--md-sys-motion-expressive-fast-spatial-duration);\n\n            @media (prefers-reduced-motion) {\n                transition: none;\n            }\n        }\n\n        &[data-pressed] {\n            --outline-color: var(--outline-color-focused-normal);\n            --outline-color-focused: var(--outline-color);\n\n            &[data-invalid] {\n                --outline-color: var(--outline-color-invalid);\n            }\n        }\n\n        &[data-disabled] {\n            cursor: default;\n        }\n    }\n\n    .select-value {\n        flex: 1;\n        text-align: start;\n        overflow: hidden;\n        text-overflow: ellipsis;\n        white-space: nowrap;\n\n        &[data-placeholder] {\n            color: var(--placeholder-color);\n        }\n    }\n}\n","import clsx from \"clsx\";\nimport { ChevronDown } from \"lucide-react\";\nimport { useContext } from \"react\";\nimport { Button, SelectStateContext, SelectValue } from \"react-aria-components\";\nimport { Icon } from \"@/components/Icon\";\nimport { typography } from \"@/utils\";\nimport {\n    EditorInputStyles,\n    EditorStyles,\n    TextFieldIconSize,\n    UnsetStyles,\n} from \"../../core\";\nimport styles from \"./selectTrigger.module.css\";\n\n/**\n * Props for the {@link SelectTrigger} component.\n * Extends React Aria's `Button` props (excluding `children`).\n */\nexport interface SelectTriggerProps\n    extends Omit<React.ComponentPropsWithRef<typeof Button>, \"children\"> {}\n\n/**\n * The clickable input trigger button that displays the selected value and toggles the select dropdown menu.\n */\nexport const SelectTrigger: React.FC<SelectTriggerProps> = (props) => {\n    const selectContextVal = useContext(SelectStateContext);\n    const invalid = selectContextVal?.displayValidation.isInvalid;\n\n    return (\n        <Button\n            className={clsx(\n                UnsetStyles,\n                EditorStyles,\n                EditorInputStyles,\n                typography.bodyLarge,\n                styles[\"trigger\"]\n            )}\n            {...props}\n            data-invalid={invalid || undefined}\n            data-select-trigger={true}\n        >\n            <SelectValue className={clsx(styles[\"select-value\"])}>\n                {({ selectedText, isPlaceholder, defaultChildren }) =>\n                    isPlaceholder ? defaultChildren : selectedText\n                }\n            </SelectValue>\n\n            <Icon icon={ChevronDown} size={TextFieldIconSize} />\n        </Button>\n    );\n};\n"],"mappings":";;;;;;;;;;;;;GCwBaa,KAA8C,MAAA;CAAA,IAAAC,KAAA,GAAAZ,EAAAA,EAAAA,CAAA,CAAA,GAEvDa,IADyBC,EAAWC,CACpB,CAAA,EAAgB,kBAA6B,WAACC;CAAA,AAAAJ,EAAA,OAAA,OAAA,IAAA,2BAAA,KAI3C,IAAAX,EACPI,GACAE,GACAD,GACAW,EAAU,WACVf,EAAM,OACV,GAAC,EAAA,KAAAc,KAAA,IAAAJ,EAAA;CAEa,IAAAM,IAAAL,KAAA,KAAA,GAAoBM,GAAAC;CAAA,AAAAR,EAAA,OAAA,OAAA,IAAA,2BAAA,KAGlC,IAAA,kBAACS,GAAD;EAAwB,WAAApB,EAAKC,EAAO,eAAe;EAC9C,UAAAoB;CADO,CAAA,GAMZ,IAAA,kBAAClB,GAAD;EAAYN,MAAAyB;EAAmBxB,MAAAA;CAAiB,CAAA,GAAI,EAAA,KAAAoB,GAAA,EAAA,KAAAC,MAAA,IAAAR,EAAA,IAAA,IAAAA,EAAA;CAAA,IAAAY;CAC/C,OAD+CZ,EAAA,OAAAa,KAAAb,EAAA,OAAAM,KAlBxD,IAAA,kBAACQ,GAAD;EACe,WAAAV;EAMV,GACGS;EACU,gBAAAP;EACO,uBAAA;EAVzB,UAAA,CAYIC,GAMAC,CAlBG;KAmBE,EAAA,KAAAK,GAAA,EAAA,KAAAP,GAAA,EAAA,KAAAM,KAAA,IAAAZ,EAAA,IAnBTY;AAmBS;AAxB0C,SAAAF,EAAA,GAAA;CAkBzC,IAAA,EAAA,iBAAA,kBAAA,uBAAAN;CAAgD,OAC9CW,IAAAC,IAAAC;AAA8C"}

package/dist/chunks/SideSheet

@@ -10,13 +10,13 @@ import { Dialog as u, Header as d, Heading as f } from "react-aria-components";
 import { X as p } from "lucide-react";
 import '../assets/SideSheet.css';//#region src/components/Sheets/SideSheet/sideSheet.module.css
 var m = e(), h = {
-	"side-sheet-dialog": "_side-sheet-dialog_x6kag_10",
-	"side-sheet": "_side-sheet_x6kag_10",
-	header: "_header_x6kag_70",
-	close: "_close_x6kag_80",
-	headline: "_headline_x6kag_84",
-	main: "_main_x6kag_88",
-	actions: "_actions_x6kag_95"
+	"side-sheet-dialog": "_side-sheet-dialog_6ff5y_10",
+	"side-sheet": "_side-sheet_6ff5y_10",
+	header: "_header_6ff5y_70",
+	close: "_close_6ff5y_80",
+	headline: "_headline_6ff5y_84",
+	main: "_main_6ff5y_88",
+	actions: "_actions_6ff5y_95"
 }, g = (e) => {
 	let t = (0, m.c)(10), n, s;
 	t[0] === e ? (n = t[1], s = t[2]) : ({className: n, ...s} = e, t[0] = e, t[1] = n, t[2] = s);

package/dist/chunks/SideSheet.map

@@ -1 +1 @@
-{"version":3,"file":"SideSheet","names":["alignment","layout","headline","X","alignment"],"sources":["../../src/components/Sheets/SideSheet/sideSheet.module.css","../../src/components/Sheets/SideSheet/SideSheetDialog.tsx","../../src/components/Sheets/SideSheet/SideSheet.tsx"],"sourcesContent":["/* configurable tokens\n*\n* --md-side-sheet-background\n* --md-side-sheet-color\n* --md-side-sheet-headline-color\n*\n* configurable tokens end */\n\n@layer adgytec.comps {\n    .side-sheet-dialog {\n        --_md-side-sheet-background: var(\n            --md-side-sheet-background,\n            var(--md-sys-color-surface-container-low)\n        );\n        --_md-side-sheet-color: var(\n            --md-side-sheet-color,\n            var(--md-sys-color-on-surface)\n        );\n        --_md-side-sheet-headline-color: var(\n            --md-side-sheet-headline-color,\n            var(--md-sys-color-on-surface-variant)\n        );\n        --_md-side-sheet-padding-inline: var(--md-sys-layout-space-16);\n        --_max-inline-size: calc(400 * var(--dp, 1px));\n\n        inline-size: min(100svi, var(--_max-inline-size));\n        block-size: 100dvb;\n\n        display: grid;\n        grid-template-rows: 1fr;\n\n        background-color: var(--_md-side-sheet-background);\n        color: var(--_md-side-sheet-color);\n\n        box-shadow: var(--md-sys-elevation-shadow-1);\n        border-radius: var(--md-sys-shape-corner-radius-large);\n\n        outline: none;\n\n        &[data-layout=\"detached\"] {\n            block-size: calc(100dvb - calc(2 * var(--_detached-margin)));\n            inline-size: min(\n                calc(100svi - calc(2 * var(--_detached-margin))),\n                var(--_max-inline-size)\n            );\n        }\n\n        &[data-layout=\"standard\"] {\n            &[data-alignment=\"start\"] {\n                border-start-start-radius: 0;\n                border-end-start-radius: 0;\n            }\n\n            &[data-alignment=\"end\"] {\n                border-start-end-radius: 0;\n                border-end-end-radius: 0;\n            }\n        }\n    }\n\n    .side-sheet {\n        grid-template-rows: auto 1fr;\n        padding-block: var(--md-sys-layout-space-16);\n\n        &[data-actions] {\n            grid-template-rows: auto 1fr auto;\n        }\n    }\n\n    .header {\n        display: flex;\n        align-items: center;\n        justify-content: space-between;\n        gap: var(--md-sys-layout-space-12);\n\n        padding-inline: var(--_md-side-sheet-padding-inline);\n        padding-block-end: var(--md-sys-layout-space-12);\n    }\n\n    .close {\n        margin-inline-start: auto;\n    }\n\n    .headline {\n        color: var(--_md-side-sheet-headline-color);\n    }\n\n    .main {\n        padding-inline: var(--_md-side-sheet-padding-inline);\n        overflow-y: auto;\n\n        padding-block: var(--md-sys-layout-space-12);\n    }\n\n    .actions {\n        --_divider-thickness: calc(1 * var(--dp, 1px));\n        --_divider-color: rgb(\n            from var(--md-sys-color-outline) r g b /\n            var(--md-sys-state-divider)\n        );\n\n        padding-inline: var(--_md-side-sheet-padding-inline);\n        padding-block-start: var(--md-sys-layout-space-12);\n        display: flex;\n        gap: var(--md-sys-layout-space-12);\n\n        border-block-start: var(--_divider-thickness) solid\n            var(--_divider-color);\n\n        /* biome-ignore lint: different elements */\n        &[data-alignment=\"start\"] {\n            justify-content: end;\n        }\n\n        /* biome-ignore lint: different elements */\n        &[data-alignment=\"end\"] {\n            justify-content: start;\n        }\n    }\n}\n","import clsx from \"clsx\";\nimport { useContext } from \"react\";\nimport { Dialog } from \"react-aria-components\";\nimport { DialogContext } from \"@/components/Dialog\";\nimport { SideSheetContext } from \"../SideSheetModal\";\nimport styles from \"./sideSheet.module.css\";\nimport type { SideSheetDialogProps } from \"./types\";\n\nexport const SideSheetDialog: React.FC<SideSheetDialogProps> = ({\n    className,\n    ...props\n}) => {\n    const { layout, alignment } = useContext(SideSheetContext);\n\n    return (\n        <DialogContext value={true}>\n            <Dialog\n                className={clsx(styles[\"side-sheet-dialog\"], className)}\n                data-alignment={alignment}\n                data-layout={layout}\n                {...props}\n            />\n        </DialogContext>\n    );\n};\n","import clsx from \"clsx\";\nimport { X } from \"lucide-react\";\nimport { useContext } from \"react\";\nimport { Header, Heading } from \"react-aria-components\";\nimport { IconButton } from \"@/components/Button\";\nimport { typography } from \"@/utils\";\nimport { SideSheetContext } from \"../SideSheetModal\";\nimport { SideSheetDialog } from \"./SideSheetDialog\";\nimport styles from \"./sideSheet.module.css\";\nimport type { SideSheetProps } from \"./types\";\n\nexport const SideSheet: React.FC<SideSheetProps> = ({\n    headline,\n    actions,\n    className,\n    children,\n    ...props\n}) => {\n    const { alignment } = useContext(SideSheetContext);\n    const hasActions = Array.isArray(actions) ? actions.length > 0 : !!actions;\n\n    return (\n        <SideSheetDialog\n            className={clsx(styles[\"side-sheet\"], className)}\n            {...props}\n            data-actions={hasActions || undefined}\n        >\n            {(renderProps) => (\n                <>\n                    <Header\n                        className={clsx(styles[\"header\"])}\n                        data-headline={!!headline || undefined}\n                    >\n                        {headline && (\n                            <Heading\n                                slot=\"title\"\n                                className={clsx(\n                                    styles[\"headline\"],\n                                    typography.titleLarge\n                                )}\n                            >\n                                {headline}\n                            </Heading>\n                        )}\n\n                        <IconButton\n                            slot=\"close\"\n                            icon={X}\n                            color=\"standard\"\n                            className={clsx(styles[\"close\"])}\n                        />\n                    </Header>\n\n                    <div className={clsx(styles[\"main\"])}>\n                        {typeof children === \"function\"\n                            ? children(renderProps)\n                            : children}\n                    </div>\n\n                    {hasActions && (\n                        <div\n                            className={clsx(styles[\"actions\"])}\n                            data-alignment={alignment}\n                        >\n                            {typeof actions === \"function\"\n                                ? actions(renderProps)\n                                : actions}\n                        </div>\n                    )}\n                </>\n            )}\n        </SideSheetDialog>\n    );\n};\n"],"mappings":"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"}
+{"version":3,"file":"SideSheet","names":["alignment","layout","_c","clsx","styles","headline","X","alignment","_c","clsx","styles","_Fragment","require_compiler_runtime","SideSheetContext","clsx$1","import_compiler_runtime","sideSheet_module_default","SideSheetDialog","$","className","props","t0","useContext","t1","t2","alignment","layout","DialogContext","Dialog","SideSheet","actions","children","headline","hasActions","t3","Fragment","Header","Heading","typography","IconButton","X","renderProps","t4"],"sources":["../../src/components/Sheets/SideSheet/sideSheet.module.css","../../src/components/Sheets/SideSheet/SideSheetDialog.tsx","../../src/components/Sheets/SideSheet/SideSheet.tsx"],"sourcesContent":["/* configurable tokens\n*\n* --md-side-sheet-background\n* --md-side-sheet-color\n* --md-side-sheet-headline-color\n*\n* configurable tokens end */\n\n@layer adgytec.comps {\n    .side-sheet-dialog {\n        --_md-side-sheet-background: var(\n            --md-side-sheet-background,\n            var(--md-sys-color-surface-container-low)\n        );\n        --_md-side-sheet-color: var(\n            --md-side-sheet-color,\n            var(--md-sys-color-on-surface)\n        );\n        --_md-side-sheet-headline-color: var(\n            --md-side-sheet-headline-color,\n            var(--md-sys-color-on-surface-variant)\n        );\n        --_md-side-sheet-padding-inline: var(--md-sys-layout-space-16);\n        --_max-inline-size: calc(400 * var(--dp, 1px));\n\n        inline-size: min(100svi, var(--_max-inline-size));\n        block-size: 100dvb;\n\n        display: grid;\n        grid-template-rows: 1fr;\n\n        background-color: var(--_md-side-sheet-background);\n        color: var(--_md-side-sheet-color);\n\n        box-shadow: var(--md-sys-elevation-shadow-1);\n        border-radius: var(--md-sys-shape-corner-radius-large);\n\n        outline: none;\n\n        &[data-layout=\"detached\"] {\n            block-size: calc(100dvb - calc(2 * var(--_detached-margin)));\n            inline-size: min(\n                calc(100svi - calc(2 * var(--_detached-margin))),\n                var(--_max-inline-size)\n            );\n        }\n\n        &[data-layout=\"standard\"] {\n            &[data-alignment=\"start\"] {\n                border-start-start-radius: 0;\n                border-end-start-radius: 0;\n            }\n\n            &[data-alignment=\"end\"] {\n                border-start-end-radius: 0;\n                border-end-end-radius: 0;\n            }\n        }\n    }\n\n    .side-sheet {\n        grid-template-rows: auto 1fr;\n        padding-block: var(--md-sys-layout-space-16);\n\n        &[data-actions] {\n            grid-template-rows: auto 1fr auto;\n        }\n    }\n\n    .header {\n        display: flex;\n        align-items: center;\n        justify-content: space-between;\n        gap: var(--md-sys-layout-space-12);\n\n        padding-inline: var(--_md-side-sheet-padding-inline);\n        padding-block-end: var(--md-sys-layout-space-12);\n    }\n\n    .close {\n        margin-inline-start: auto;\n    }\n\n    .headline {\n        color: var(--_md-side-sheet-headline-color);\n    }\n\n    .main {\n        padding-inline: var(--_md-side-sheet-padding-inline);\n        overflow-y: auto;\n\n        padding-block: var(--md-sys-layout-space-12);\n    }\n\n    .actions {\n        --_divider-thickness: calc(1 * var(--dp, 1px));\n        --_divider-color: rgb(\n            from var(--md-sys-color-outline) r g b /\n            var(--md-sys-state-divider)\n        );\n\n        padding-inline: var(--_md-side-sheet-padding-inline);\n        padding-block-start: var(--md-sys-layout-space-12);\n        display: flex;\n        gap: var(--md-sys-layout-space-12);\n\n        border-block-start: var(--_divider-thickness) solid\n            var(--_divider-color);\n\n        &[data-alignment=\"start\"] {\n            justify-content: end;\n        }\n\n        &[data-alignment=\"end\"] {\n            justify-content: start;\n        }\n    }\n}\n","import clsx from \"clsx\";\nimport { useContext } from \"react\";\nimport { Dialog } from \"react-aria-components\";\nimport { DialogContext } from \"@/components/Dialog\";\nimport { SideSheetContext } from \"../SideSheetModal\";\nimport styles from \"./sideSheet.module.css\";\nimport type { SideSheetDialogProps } from \"./types\";\n\n/**\n * Low-level dialog container for side sheets, useful for custom layout structures.\n *\n * Consumes {@link SideSheetContext} to apply appropriate `data-alignment` and `data-layout`\n * attributes for responsive positioning, border radiuses, and size constraints.\n * Also provides `DialogContext` with `true` for modal integration.\n *\n * @example\n * ```tsx\n * import { DialogTrigger, Header, Heading } from \"react-aria-components\";\n * import {\n *     Button,\n *     IconButton,\n *     ModalOverlay,\n *     SideSheetDialog,\n *     SideSheetModal,\n * } from \"@adgytec/web-ui-components\";\n * import { X } from \"lucide-react\";\n *\n * export function Example() {\n *     return (\n *         <DialogTrigger>\n *             <Button label=\"Open Custom Sheet\" />\n *             <ModalOverlay>\n *                 <SideSheetModal alignment=\"end\" layout=\"standard\">\n *                     <SideSheetDialog>\n *                         {({ close }) => (\n *                             <>\n *                                 <Header>\n *                                     <Heading slot=\"title\">Custom Title</Heading>\n *                                     <IconButton icon={X} onPress={close} aria-label=\"Close\" />\n *                                 </Header>\n *                                 <div>Custom content goes here.</div>\n *                             </>\n *                         )}\n *                     </SideSheetDialog>\n *                 </SideSheetModal>\n *             </ModalOverlay>\n *         </DialogTrigger>\n *     );\n * }\n * ```\n */\nexport const SideSheetDialog: React.FC<SideSheetDialogProps> = ({\n    className,\n    ...props\n}) => {\n    const { layout, alignment } = useContext(SideSheetContext);\n\n    return (\n        <DialogContext value={true}>\n            <Dialog\n                className={clsx(styles[\"side-sheet-dialog\"], className)}\n                data-alignment={alignment}\n                data-layout={layout}\n                {...props}\n            />\n        </DialogContext>\n    );\n};\n","import clsx from \"clsx\";\nimport { X } from \"lucide-react\";\nimport { useContext } from \"react\";\nimport { Header, Heading } from \"react-aria-components\";\nimport { IconButton } from \"@/components/Button\";\nimport { typography } from \"@/utils\";\nimport { SideSheetContext } from \"../SideSheetModal\";\nimport { SideSheetDialog } from \"./SideSheetDialog\";\nimport styles from \"./sideSheet.module.css\";\nimport type { SideSheetProps } from \"./types\";\n\n/**\n * High-level content container for side sheets, conforming to\n * [Material 3 Side Sheets](https://m3.material.io/components/side-sheets/overview).\n *\n * Provides a standard structured side sheet layout containing:\n * - A top header with an optional `headline` (`typography.titleLarge`) and a built-in close `IconButton` (`X`).\n * - A scrollable `main` content area.\n * - An optional bottom `actions` footer, automatically aligned with the sheet's alignment setting.\n *\n * Configurable CSS tokens:\n * - `--md-side-sheet-background`: Background color of the side sheet (`var(--md-sys-color-surface-container-low)`).\n * - `--md-side-sheet-color`: Text color of the side sheet (`var(--md-sys-color-on-surface)`).\n * - `--md-side-sheet-headline-color`: Color of the side sheet headline (`var(--md-sys-color-on-surface-variant)`).\n *\n * @example\n * ```tsx\n * import { DialogTrigger } from \"react-aria-components\";\n * import {\n *     Button,\n *     ModalOverlay,\n *     SideSheet,\n *     SideSheetModal,\n * } from \"@adgytec/web-ui-components\";\n *\n * export function Example() {\n *     return (\n *         <DialogTrigger>\n *             <Button label=\"Open Side Sheet\" />\n *             <ModalOverlay>\n *                 <SideSheetModal alignment=\"end\" layout=\"standard\">\n *                     <SideSheet\n *                         headline=\"Side Sheet Title\"\n *                         actions={[\n *                             <Button key=\"save\" label=\"Save\" onPress={() => {}} />,\n *                             <Button key=\"cancel\" label=\"Cancel\" variant=\"outline\" onPress={() => {}} />,\n *                         ]}\n *                     >\n *                         <p>This is the side sheet content.</p>\n *                     </SideSheet>\n *                 </SideSheetModal>\n *             </ModalOverlay>\n *         </DialogTrigger>\n *     );\n * }\n * ```\n */\nexport const SideSheet: React.FC<SideSheetProps> = ({\n    headline,\n    actions,\n    className,\n    children,\n    ...props\n}) => {\n    const { alignment } = useContext(SideSheetContext);\n    const hasActions = Array.isArray(actions) ? actions.length > 0 : !!actions;\n\n    return (\n        <SideSheetDialog\n            className={clsx(styles[\"side-sheet\"], className)}\n            {...props}\n            data-actions={hasActions || undefined}\n        >\n            {(renderProps) => (\n                <>\n                    <Header\n                        className={clsx(styles[\"header\"])}\n                        data-headline={!!headline || undefined}\n                    >\n                        {headline && (\n                            <Heading\n                                slot=\"title\"\n                                className={clsx(\n                                    styles[\"headline\"],\n                                    typography.titleLarge\n                                )}\n                            >\n                                {headline}\n                            </Heading>\n                        )}\n\n                        <IconButton\n                            slot=\"close\"\n                            icon={X}\n                            color=\"standard\"\n                            className={clsx(styles[\"close\"])}\n                        />\n                    </Header>\n\n                    <div className={clsx(styles[\"main\"])}>\n                        {typeof children === \"function\"\n                            ? children(renderProps)\n                            : children}\n                    </div>\n\n                    {hasActions && (\n                        <div\n                            className={clsx(styles[\"actions\"])}\n                            data-alignment={alignment}\n                        >\n                            {typeof actions === \"function\"\n                                ? actions(renderProps)\n                                : actions}\n                        </div>\n                    )}\n                </>\n            )}\n        </SideSheetDialog>\n    );\n};\n"],"mappings":"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"}

package/dist/chunks/SideSheetModal.map

@@ -1 +1 @@
-{"version":3,"file":"SideSheetModal","names":[],"sources":["../../src/components/Sheets/SideSheetModal/context.ts","../../src/components/Sheets/SideSheetModal/sideSheetModal.module.css","../../src/components/Sheets/SideSheetModal/SideSheetModal.tsx"],"sourcesContent":["import { createContext } from \"react\";\nimport type { SheetLayout } from \"../core\";\nimport type { SideSheetAlignment } from \"./types\";\n\nexport type SideSheetContextValue = {\n    layout: SheetLayout;\n    alignment: SideSheetAlignment;\n};\n\nexport const SideSheetContext = createContext<SideSheetContextValue>({\n    layout: \"standard\",\n    alignment: \"end\",\n});\n","@layer adgytec.comps {\n    .modal {\n        --_detached-margin: var(--md-sys-layout-space-16);\n\n        position: fixed;\n\n        &[data-layout=\"detached\"] {\n            margin: var(--_detached-margin);\n        }\n\n        &[data-alignment=\"start\"] {\n            --_from: -100%;\n        }\n\n        &[data-alignment=\"end\"] {\n            --_from: 100%;\n\n            inset-inline-end: 0;\n        }\n\n        transition: translate var(--_modal-motion) var(--_modal-motion-duration);\n\n        @media (prefers-reduced-motion) {\n            transition: none;\n        }\n\n        &[data-entering],\n        &[data-exiting] {\n            translate: var(--_from);\n        }\n    }\n}\n","import clsx from \"clsx\";\nimport { Modal } from \"react-aria-components\";\nimport { SideSheetContext } from \"./context\";\nimport styles from \"./sideSheetModal.module.css\";\nimport type { SideSheetModalProps } from \"./types\";\n\nexport const SideSheetModal: React.FC<SideSheetModalProps> = ({\n    className,\n    alignment = \"end\",\n    layout = \"standard\",\n    ...props\n}) => {\n    return (\n        <SideSheetContext value={{ alignment, layout }}>\n            <Modal\n                data-alignment={alignment}\n                data-layout={layout}\n                className={(renderProps) =>\n                    clsx(\n                        styles[\"modal\"],\n                        typeof className === \"function\"\n                            ? className(renderProps)\n                            : className\n                    )\n                }\n                {...props}\n            />\n        </SideSheetContext>\n    );\n};\n"],"mappings":";;;;;AASA,IAAa,IAAmB,EAAqC;CACjE,QAAQ;CACR,WAAW;AACf,CAAC,oCENY,KAAiD,EAC1D,cACA,eAAY,OACZ,YAAS,YACT,GAAG,QAGC,kBAAC,GAAD;CAAkB,OAAO;EAAE;EAAW;CAAO;WACzC,kBAAC,GAAD;EACI,kBAAgB;EAChB,eAAa;EACb,YAAY,MACR,EACI,EAAO,OACP,OAAO,KAAc,aACf,EAAU,CAAW,IACrB,CACV;EAEJ,GAAI;CAAM,CAAA;AAEA,CAAA"}
+{"version":3,"file":"SideSheetModal","names":["clsx","styles","clsx$1","SideSheetContext","createContext","sideSheetModal_module_default","SideSheetModal","props","Modal","alignment","layout","\"modal\"","className","renderProps"],"sources":["../../src/components/Sheets/SideSheetModal/context.ts","../../src/components/Sheets/SideSheetModal/sideSheetModal.module.css","../../src/components/Sheets/SideSheetModal/SideSheetModal.tsx"],"sourcesContent":["import { createContext } from \"react\";\nimport type { SheetLayout } from \"../core\";\nimport type { SideSheetAlignment } from \"./types\";\n\n/**\n * Context value passed from {@link SideSheetModal} to descendant side sheet components like {@link SideSheetDialog} and {@link SideSheet}.\n */\nexport type SideSheetContextValue = {\n    /**\n     * Current layout style (`\"standard\"` or `\"detached\"`).\n     */\n    layout: SheetLayout;\n    /**\n     * Current alignment edge (`\"start\"` or `\"end\"`).\n     */\n    alignment: SideSheetAlignment;\n};\n\n/**\n * React context providing layout and alignment properties for side sheets.\n * Default values are `layout: \"standard\"` and `alignment: \"end\"`.\n */\nexport const SideSheetContext = createContext<SideSheetContextValue>({\n    layout: \"standard\",\n    alignment: \"end\",\n});\n","@layer adgytec.comps {\n    .modal {\n        --_detached-margin: var(--md-sys-layout-space-16);\n\n        position: fixed;\n\n        &[data-layout=\"detached\"] {\n            margin: var(--_detached-margin);\n        }\n\n        &[data-alignment=\"start\"] {\n            --_from: -100%;\n        }\n\n        &[data-alignment=\"end\"] {\n            --_from: 100%;\n\n            inset-inline-end: 0;\n        }\n\n        transition: translate var(--_modal-motion) var(--_modal-motion-duration);\n\n        @media (prefers-reduced-motion) {\n            transition: none;\n        }\n\n        &[data-entering],\n        &[data-exiting] {\n            translate: var(--_from);\n        }\n    }\n}\n","import clsx from \"clsx\";\nimport { Modal } from \"react-aria-components\";\nimport { SideSheetContext } from \"./context\";\nimport styles from \"./sideSheetModal.module.css\";\nimport type { SideSheetModalProps } from \"./types\";\n\n/**\n * Modal container for a side sheet ({@link SideSheet} or {@link SideSheetDialog}).\n *\n * Implements [Material 3 Side Sheets](https://m3.material.io/components/side-sheets/overview)\n * positioning and animations using React Aria Components `Modal`. Sets `data-alignment` and\n * `data-layout` attributes to control entry/exit slide animations and viewport anchoring,\n * and provides layout and alignment configurations to children through {@link SideSheetContext}.\n *\n * @example\n * ```tsx\n * import { DialogTrigger } from \"react-aria-components\";\n * import {\n *     Button,\n *     ModalOverlay,\n *     SideSheet,\n *     SideSheetModal,\n * } from \"@adgytec/web-ui-components\";\n *\n * export function Example() {\n *     return (\n *         <DialogTrigger>\n *             <Button label=\"Open Details\" />\n *             <ModalOverlay>\n *                 <SideSheetModal alignment=\"end\" layout=\"standard\">\n *                     <SideSheet headline=\"Details\">\n *                         <p>Side sheet content goes here.</p>\n *                     </SideSheet>\n *                 </SideSheetModal>\n *             </ModalOverlay>\n *         </DialogTrigger>\n *     );\n * }\n * ```\n */\nexport const SideSheetModal: React.FC<SideSheetModalProps> = ({\n    className,\n    alignment = \"end\",\n    layout = \"standard\",\n    ...props\n}) => {\n    return (\n        <SideSheetContext value={{ alignment, layout }}>\n            <Modal\n                data-alignment={alignment}\n                data-layout={layout}\n                className={(renderProps) =>\n                    clsx(\n                        styles[\"modal\"],\n                        typeof className === \"function\"\n                            ? className(renderProps)\n                            : className\n                    )\n                }\n                {...props}\n            />\n        </SideSheetContext>\n    );\n};\n"],"mappings":";;;;;AAsBA,IAAaG,IAAmBC,EAAqC;CACjE,QAAQ;CACR,WAAW;AACf,CAAC,oCEeYE,KAAiD,EAC1D,cACA,eAAY,OACZ,YAAS,YACT,GAAGC,QAGC,kBAACJ,GAAD;CAAkB,OAAO;EAAE;EAAW;CAAO;CACzC,UAAA,kBAACK,GAAD;EACI,kBAAgBC;EAChB,eAAaC;EACb,YAAY,MACRV,EACIC,EAAOU,OACP,OAAOC,KAAc,aACfA,EAAUC,CAAW,IACrBD,CACV;EAEJ,GAAIL;CAAM,CAAA;AAEA,CAAA"}