@adgytec/adgytec-web-ui-components 2.1.6 → 2.1.8

package/dist/chunks/Tooltip.map

@@ -1 +1 @@
-{"version":3,"file":"Tooltip","names":[],"sources":["../../src/components/Tooltip/Tooltip/tooltip.module.css","../../src/components/Tooltip/Tooltip/Tooltip.tsx"],"sourcesContent":["/* configurable tokens\n*\n* --md-tooltip-background\n* --md-tooltip-color\n*\n* configurable tokens end */\n\n@layer adgytec.comps {\n    .tooltip {\n        --_md-tooltip-background: var(\n            --md-tooltip-background,\n            var(--md-sys-color-inverse-surface)\n        );\n        --_md-tooltip-color: var(\n            --md-tooltip-color,\n            var(--md-sys-color-inverse-on-surface)\n        );\n\n        --_offset: calc(4 * var(--dp, 1px));\n\n        background-color: var(--_md-tooltip-background);\n        color: var(--_md-tooltip-color);\n\n        padding-inline: var(--md-sys-layout-space-8);\n        padding-block: var(--md-sys-layout-space-4);\n\n        max-inline-size: calc(300 * var(--dp, 1px));\n        border-radius: var(--md-sys-shape-corner-radius-extra-small);\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 { Tooltip as AriaTooltip } from \"react-aria-components\";\nimport { typography } from \"@/utils/typography\";\nimport styles from \"./tooltip.module.css\";\n\nexport const Tooltip: React.FC<\n    React.ComponentPropsWithRef<typeof AriaTooltip>\n> = ({ className, offset = 4, ...props }) => {\n    return (\n        <AriaTooltip\n            offset={offset}\n            className={(renderProps) =>\n                clsx(\n                    styles[\"tooltip\"],\n                    typography.labelMedium,\n                    typeof className === \"function\"\n                        ? className(renderProps)\n                        : className\n                )\n            }\n            {...props}\n            data-tooltip\n        />\n    );\n};\n"],"mappings":";;;;yCCKa,KAER,EAAE,cAAW,YAAS,GAAG,GAAG,QAEzB,kBAAC,GAAD;CACY;CACR,YAAY,MACR,EACI,EAAO,SACP,EAAW,aACX,OAAO,KAAc,aACf,EAAU,CAAW,IACrB,CACV;CAEJ,GAAI;CACJ,gBAAA;AACH,CAAA"}
+{"version":3,"file":"Tooltip","names":[],"sources":["../../src/components/Tooltip/Tooltip/tooltip.module.css","../../src/components/Tooltip/Tooltip/Tooltip.tsx"],"sourcesContent":["/* configurable tokens\n*\n* --md-tooltip-background\n* --md-tooltip-color\n*\n* configurable tokens end */\n\n@layer adgytec.comps {\n    .tooltip {\n        --_md-tooltip-background: var(\n            --md-tooltip-background,\n            var(--md-sys-color-inverse-surface)\n        );\n        --_md-tooltip-color: var(\n            --md-tooltip-color,\n            var(--md-sys-color-inverse-on-surface)\n        );\n\n        --_offset: calc(4 * var(--dp, 1px));\n\n        background-color: var(--_md-tooltip-background);\n        color: var(--_md-tooltip-color);\n\n        padding-inline: var(--md-sys-layout-space-8);\n        padding-block: var(--md-sys-layout-space-4);\n\n        max-inline-size: calc(300 * var(--dp, 1px));\n        border-radius: var(--md-sys-shape-corner-radius-extra-small);\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 { Tooltip as AriaTooltip } from \"react-aria-components\";\nimport { typography } from \"@/utils/typography\";\nimport styles from \"./tooltip.module.css\";\n\nexport const Tooltip: React.FC<\n    React.ComponentPropsWithRef<typeof AriaTooltip>\n> = ({ className, offset = 4, ...props }) => {\n    return (\n        <AriaTooltip\n            offset={offset}\n            className={(renderProps) =>\n                clsx(\n                    styles[\"tooltip\"],\n                    typography.labelMedium,\n                    typeof className === \"function\"\n                        ? className(renderProps)\n                        : className\n                )\n            }\n            {...props}\n            data-tooltip\n        />\n    );\n};\n"],"mappings":";;;;yCCKa,KAER,EAAE,cAAW,YAAS,GAAG,GAAG,QAEzB,kBAAC,GAAD;CACY;CACR,YAAY,MACR,EACI,EAAO,SACP,EAAW,aACX,OAAO,KAAc,aACf,EAAU,CAAW,IACrB,CACV;CAEJ,GAAI;CACJ,gBAAA;AAAY,CAAA"}

package/dist/chunks/compiler-runtime

@@ -0,0 +1,24 @@
+//#region \0rolldown/runtime.js
+var e = (e, t) => () => (t || (e((t = { exports: {} }).exports, t), e = null), t.exports), t = /* @__PURE__ */ ((e) => typeof require < "u" ? require : typeof Proxy < "u" ? new Proxy(e, { get: (e, t) => (typeof require < "u" ? require : e)[t] }) : e)(function(e) {
+	if (typeof require < "u") return require.apply(this, arguments);
+	throw Error("Calling `require` for \"" + e + "\" in an environment that doesn't expose the `require` function. See https://rolldown.rs/in-depth/bundling-cjs#require-external-modules for more details.");
+}), n = /* @__PURE__ */ e(((e) => {
+	var n = t("react").__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE;
+	e.c = function(e) {
+		return n.H.useMemoCache(e);
+	};
+})), r = /* @__PURE__ */ e(((e) => {
+	process.env.NODE_ENV !== "production" && (function() {
+		var n = t("react").__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE;
+		e.c = function(e) {
+			var t = n.H;
+			return t === null && console.error("Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:\n1. You might have mismatching versions of React and the renderer (such as React DOM)\n2. You might be breaking the Rules of Hooks\n3. You might have more than one copy of React in the same app\nSee https://react.dev/link/invalid-hook-call for tips about how to debug and fix this problem."), t.useMemoCache(e);
+		};
+	})();
+})), i = /* @__PURE__ */ e(((e, t) => {
+	process.env.NODE_ENV === "production" ? t.exports = n() : t.exports = r();
+}));
+//#endregion
+export { i as t };
+
+//# sourceMappingURL=compiler-runtime.map

package/dist/chunks/compiler-runtime.map

@@ -0,0 +1 @@
+{"version":3,"file":"compiler-runtime","names":[],"sources":["../../node_modules/react/cjs/react-compiler-runtime.production.js","../../node_modules/react/cjs/react-compiler-runtime.development.js","../../node_modules/react/compiler-runtime.js"],"sourcesContent":["/**\n * @license React\n * react-compiler-runtime.production.js\n *\n * Copyright (c) Meta Platforms, Inc. and affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n\"use strict\";\nvar ReactSharedInternals =\n  require(\"react\").__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE;\nexports.c = function (size) {\n  return ReactSharedInternals.H.useMemoCache(size);\n};\n","/**\n * @license React\n * react-compiler-runtime.development.js\n *\n * Copyright (c) Meta Platforms, Inc. and affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n\"use strict\";\n\"production\" !== process.env.NODE_ENV &&\n  (function () {\n    var ReactSharedInternals =\n      require(\"react\").__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE;\n    exports.c = function (size) {\n      var dispatcher = ReactSharedInternals.H;\n      null === dispatcher &&\n        console.error(\n          \"Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:\\n1. You might have mismatching versions of React and the renderer (such as React DOM)\\n2. You might be breaking the Rules of Hooks\\n3. You might have more than one copy of React in the same app\\nSee https://react.dev/link/invalid-hook-call for tips about how to debug and fix this problem.\"\n        );\n      return dispatcher.useMemoCache(size);\n    };\n  })();\n","/**\n * Copyright (c) Meta Platforms, Inc. and affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n'use strict';\n\nif (process.env.NODE_ENV === 'production') {\n  module.exports = require('./cjs/react-compiler-runtime.production.js');\n} else {\n  module.exports = require('./cjs/react-compiler-runtime.development.js');\n}\n"],"x_google_ignoreList":[0,1,2],"mappings":";;;;;CAWA,IAAI,IAAA,EACM,OAAO,CAAC,CAAC;CACnB,EAAQ,IAAI,SAAU,GAAM;EAC1B,OAAO,EAAqB,EAAE,aAAa,CAAI;CACjD;;CCJA,AAAA,QAAA,IAAA,aAAA,iBACG,WAAY;EACX,IAAI,IAAA,EACM,OAAO,CAAC,CAAC;EACnB,EAAQ,IAAI,SAAU,GAAM;GAC1B,IAAI,IAAa,EAAqB;GAKtC,OAJS,MAAT,QACE,QAAQ,MACN,+aACF,GACK,EAAW,aAAa,CAAI;EACrC;CACF,EAAA,CAAG;;CCdL,AAAA,QAAA,IAAA,aAA6B,eAC3B,EAAO,UAAA,EAAA,IAEP,EAAO,UAAA,EAAA"}

package/dist/chunks/core

@@ -1,26 +1,27 @@
-import { t as e } from "./tapTarget";
-import { t } from "./base";
-import { t as n } from "./Icon";
-import { n as r, t as i } from "./useSplash";
-import { useButtonGroupContext as a, useConnectedButtonGroupContext as o } from "../components/Button/ButtonGroups/ButtonGroupContext/index.js";
-import { t as s } from "./Tooltip";
-import { TooltipTrigger as c } from "../components/Tooltip/TooltipTrigger/index.js";
-import l from "clsx";
-import { jsx as u, jsxs as d } from "react/jsx-runtime";
-import { ToggleButton as f } from "react-aria-components";
+import { t as e } from "./compiler-runtime";
+import { t } from "./tapTarget";
+import { t as n } from "./base";
+import { t as r } from "./Icon";
+import { n as i, t as a } from "./useSplash";
+import { useButtonGroupContext as o, useConnectedButtonGroupContext as s } from "../components/Button/ButtonGroups/ButtonGroupContext/index.js";
+import { t as c } from "./Tooltip";
+import { TooltipTrigger as l } from "../components/Tooltip/TooltipTrigger/index.js";
+import u from "clsx";
+import { jsx as d, jsxs as f } from "react/jsx-runtime";
+import { ToggleButton as p } from "react-aria-components";
 import '../assets/core2.css';//#region src/components/Button/core/button.module.css
-var p = {
+var m = {
 	"button-reset": "_button-reset_1kbv0_2",
 	"button-core": "_button-core_1kbv0_17"
-}, m = p["button-reset"], h = p["button-core"];
-function g({ shape: e, size: t, color: n }) {
+}, h = m["button-reset"], g = m["button-core"];
+function _({ shape: e, size: t, color: n }) {
 	return {
 		"data-shape": e,
 		"data-size": t,
 		"data-color": n
 	};
 }
-var _ = {
+var v = {
 	outlined: "_outlined_m3jr5_18",
 	color: "_color_m3jr5_42",
 	filled: "_filled_m3jr5_195",
@@ -28,84 +29,90 @@ var _ = {
 	text: "_text_m3jr5_267",
 	standard: "_standard_m3jr5_272",
 	elevated: "_elevated_m3jr5_285"
-}, v = (e) => _[e], y = _.color, b = {
+}, y = (e) => v[e], b = v.color, x = {
 	size: "_size_a73rz_2",
 	"extra-small": "_extra-small_a73rz_25",
 	small: "_small_a73rz_66",
 	medium: "_medium_a73rz_112",
 	large: "_large_a73rz_153",
 	"extra-large": "_extra-large_a73rz_194"
-}, x = {
+}, S = {
 	"extra-small": 20,
 	small: 20,
 	medium: 24,
 	large: 32,
 	"extra-large": 40
-}, S = {
+}, C = {
 	"extra-small": 20,
 	small: 24,
 	medium: 24,
 	large: 32,
 	"extra-large": 40
-}, C = {
-	"extra-small": t.labelLarge,
-	small: t.labelLarge,
-	medium: t.bodyLargeEmphasized,
-	large: t.headlineSmall,
-	"extra-large": t.headlineLarge
-}, w = (e) => b[e], T = b.size, E = { button: "_button_4jeo2_2" }, D = ({ icon: t, selectedIcon: a, children: s, onPress: c, iconPlacement: p, ...g }) => {
-	let { shape: _, size: b, color: S, iconPlacement: w } = o(), T = p ?? w ?? "start", { splashInfo: D, handlePress: O } = i(c), k = typeof s == "function";
-	return /* @__PURE__ */ u(f, {
-		onPress: O,
-		className: l(m, e, v(S)),
-		...g,
+}, w = {
+	"extra-small": n.labelLarge,
+	small: n.labelLarge,
+	medium: n.bodyLargeEmphasized,
+	large: n.headlineSmall,
+	"extra-large": n.headlineLarge
+}, T = (e) => x[e], E = x.size, D = { button: "_button_4jeo2_2" }, O = e(), k = (e) => {
+	let n = (0, O.c)(23), o, c, l, m, _, v;
+	n[0] === e ? (o = n[1], c = n[2], l = n[3], m = n[4], _ = n[5], v = n[6]) : ({icon: c, selectedIcon: v, children: o, onPress: m, iconPlacement: l, ..._} = e, n[0] = e, n[1] = o, n[2] = c, n[3] = l, n[4] = m, n[5] = _, n[6] = v);
+	let { shape: x, size: C, color: T, iconPlacement: E } = s(), k = l ?? E ?? "start", { splashInfo: A, handlePress: j } = a(m), M = typeof o == "function", N;
+	n[7] === T ? N = n[8] : (N = u(h, t, y(T)), n[7] = T, n[8] = N);
+	let P;
+	n[9] !== k || n[10] !== o || n[11] !== c || n[12] !== M || n[13] !== v || n[14] !== x || n[15] !== C || n[16] !== A ? (P = (e) => {
+		let { isSelected: t, isDisabled: n, isFocusVisible: a, isFocused: s, isPressed: l, isHovered: p } = e, m = {
+			"data-hovered": p || void 0,
+			"data-disabled": n || void 0,
+			"data-focused": s || void 0,
+			"data-focus-visible": a || void 0,
+			"data-pressed": l || void 0,
+			"data-selected": t || void 0,
+			"data-toggle-button": !0,
+			"data-shape": x,
+			"data-visual-button": !0
+		}, h = c;
+		t && v && (h = v);
+		let _ = S[C], y = h && /* @__PURE__ */ d(r, {
+			icon: h,
+			size: _
+		});
+		return /* @__PURE__ */ f("span", {
+			...m,
+			className: u(g, b, w[C], D.button),
+			children: [
+				A && /* @__PURE__ */ d(i, { ...A }),
+				k === "start" && y,
+				M ? o(e) : o,
+				k === "end" && y
+			]
+		});
+	}, n[9] = k, n[10] = o, n[11] = c, n[12] = M, n[13] = v, n[14] = x, n[15] = C, n[16] = A, n[17] = P) : P = n[17];
+	let F;
+	return n[18] !== j || n[19] !== _ || n[20] !== N || n[21] !== P ? (F = /* @__PURE__ */ d(p, {
+		onPress: j,
+		className: N,
+		..._,
 		"data-connected-button": !0,
 		"data-button": !0,
-		children: (e) => {
-			let { isSelected: i, isDisabled: o, isFocusVisible: c, isFocused: f, isPressed: p, isHovered: m } = e, g = {
-				"data-hovered": m || void 0,
-				"data-disabled": o || void 0,
-				"data-focused": f || void 0,
-				"data-focus-visible": c || void 0,
-				"data-pressed": p || void 0,
-				"data-selected": i || void 0,
-				"data-toggle-button": !0,
-				"data-shape": _,
-				"data-visual-button": !0
-			}, v = t;
-			i && a && (v = a);
-			let S = x[b], w = v && /* @__PURE__ */ u(n, {
-				icon: v,
-				size: S
-			});
-			return /* @__PURE__ */ d("span", {
-				...g,
-				className: l(h, y, C[b], E.button),
-				children: [
-					D && /* @__PURE__ */ u(r, { ...D }),
-					T === "start" && w,
-					k ? s(e) : s,
-					T === "end" && w
-				]
-			});
-		}
-	});
+		children: P
+	}), n[18] = j, n[19] = _, n[20] = N, n[21] = P, n[22] = F) : F = n[22], F;
 };
 //#endregion
 //#region src/components/Button/core/useButtonConfig.ts
-function O({ size: e, shape: t, color: n, iconPlacement: r }) {
-	let { size: i, shape: o, color: s, iconPlacement: c } = a();
-	return {
-		buttonSize: e ?? i ?? "small",
-		buttonShape: t ?? o ?? "round",
-		buttonColor: n ?? s ?? "filled",
-		buttonIconPlacement: r ?? c ?? "start"
-	};
+function A(e) {
+	let t = (0, O.c)(5), { size: n, shape: r, color: i, iconPlacement: a } = e, { size: s, shape: c, color: l, iconPlacement: u } = o(), d = n ?? s ?? "small", f = r ?? c ?? "round", p = i ?? l ?? "filled", m = a ?? u ?? "start", h;
+	return t[0] !== p || t[1] !== m || t[2] !== f || t[3] !== d ? (h = {
+		buttonSize: d,
+		buttonShape: f,
+		buttonColor: p,
+		buttonIconPlacement: m
+	}, t[0] = p, t[1] = m, t[2] = f, t[3] = d, t[4] = h) : h = t[4], h;
 }
 //#endregion
 //#region src/components/Button/core/withTooltip.tsx
-var k = (e, t) => t ? /* @__PURE__ */ d(c, { children: [e, /* @__PURE__ */ u(s, { children: t })] }) : e;
+var j = (e, t) => t ? /* @__PURE__ */ f(l, { children: [e, /* @__PURE__ */ d(c, { children: t })] }) : e;
 //#endregion
-export { C as a, w as c, h as d, m as f, x as i, y as l, O as n, T as o, g as p, D as r, S as s, k as t, v as u };
+export { w as a, T as c, g as d, h as f, S as i, b as l, A as n, E as o, _ as p, k as r, C as s, j as t, y as u };
 
 //# sourceMappingURL=core.map

package/dist/chunks/core.map

@@ -1 +1 @@
-{"version":3,"file":"core","names":[],"sources":["../../src/components/Button/core/button.module.css","../../src/components/Button/core/button.ts","../../src/components/Button/core/color.module.css","../../src/components/Button/core/color.ts","../../src/components/Button/core/size.module.css","../../src/components/Button/core/sizes.ts","../../src/components/Button/ButtonGroups/ConnectedButton/connectedButton.module.css","../../src/components/Button/ButtonGroups/ConnectedButton/ConnectedButton.tsx","../../src/components/Button/core/useButtonConfig.ts","../../src/components/Button/core/withTooltip.tsx"],"sourcesContent":["@layer adgytec.comps {\n    .button-reset {\n        all: unset;\n        cursor: pointer;\n        position: relative;\n        text-align: center;\n\n        &[data-disabled] {\n            cursor: default;\n        }\n\n        &[data-pending] {\n            cursor: default;\n        }\n    }\n\n    .button-core {\n        position: relative;\n        overflow: clip;\n\n        --_md-button-shape-motion: var(--md-sys-motion-expressive-fast-spatial);\n        --_md-button-shape-motion-duration: var(\n            --md-sys-motion-expressive-fast-spatial-duration\n        );\n\n        transition:\n            border-radius var(--_md-button-shape-motion)\n            var(--_md-button-shape-motion-duration),\n            background-color var(--md-sys-motion-expressive-fast-effects)\n            var(--md-sys-motion-expressive-fast-effects-duration),\n            color var(--md-sys-motion-expressive-fast-effects)\n            var(--md-sys-motion-expressive-fast-effects-duration),\n            border-color var(--md-sys-motion-expressive-fast-effects)\n            var(--md-sys-motion-expressive-fast-effects-duration),\n            box-shadow var(--md-sys-motion-expressive-fast-spatial)\n            var(--md-sys-motion-expressive-fast-spatial-duration),\n            padding 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","import type { LucideIcon } from \"lucide-react\";\nimport styles from \"./button.module.css\";\nimport type { AllButtonColor, ButtonColor, IconButtonColor } from \"./color\";\nimport type { ButtonShape } from \"./shape\";\nimport type { ButtonSize } from \"./sizes\";\nimport type { IconButtonWidth } from \"./width\";\n\nexport type ButtonIconPlacement = \"start\" | \"end\";\n\nexport interface ButtonBaseProps {\n    color?: ButtonColor;\n    size?: ButtonSize;\n    shape?: ButtonShape;\n    tooltip?: string;\n    icon?: LucideIcon;\n    iconPlacement?: ButtonIconPlacement;\n}\n\nexport interface IconButtonBaseProps {\n    color?: IconButtonColor;\n    size?: ButtonSize;\n    shape?: ButtonShape;\n    width?: IconButtonWidth;\n    tooltip?: string;\n    icon: LucideIcon;\n}\n\nexport const ButtonReset = styles[\"button-reset\"];\nexport const ButtonCore = styles[\"button-core\"];\n\nexport function newButtonBaseDataAttrs({\n    shape,\n    size,\n    color,\n}: {\n    shape: ButtonShape;\n    color: AllButtonColor;\n    size: ButtonSize;\n}) {\n    return {\n        \"data-shape\": shape,\n        \"data-size\": size,\n        \"data-color\": color,\n    };\n}\n","/* configurable tokens\n*\n* --md-button-background\n* --md-toggle-button-selected-background\n* --md-toggle-button-background\n*\n* --md-button-outline-color\n* --md-toggle-button-selected-outline-color\n* --md-toggle-button-outline-color\n*\n* --md-button-color\n* --md-toggle-button-selected-color\n* --md-toggle-button-color\n*\n* configurable tokens end */\n\n@layer adgytec.overrides {\n    .outlined {\n        --_md-button-padding-block: calc(\n            var(--_md-button-padding-block-base) -\n            var(--_md-button-outline-width, 0)\n        );\n\n        --_md-button-padding-inline: calc(\n            var(--_md-button-padding-inline-base) -\n            var(--_md-button-outline-width, 0)\n        );\n\n        --_md-split-button-padding-inline-start: calc(\n            var(--_md-split-button-padding-inline-start-base) -\n            var(--_md-button-outline-width, 0)\n        );\n\n        --_md-split-button-padding-inline-end: calc(\n            var(--_md-split-button-padding-inline-end-base) -\n            var(--_md-button-outline-width, 0)\n        );\n    }\n}\n\n@layer adgytec.comps {\n    .color {\n        --_md-button-background: var(\n            --md-button-background,\n            var(--_md-button-background-default)\n        );\n        --_md-toggle-button-selected-background: var(\n            --md-toggle-button-selected-background,\n            var(--_md-toggle-button-selected-background-default)\n        );\n        --_md-toggle-button-background: var(\n            --md-toggle-button-background,\n            var(--_md-toggle-button-background-default)\n        );\n\n        --_md-button-color: var(\n            --md-button-color,\n            var(--_md-button-color-default)\n        );\n        --_md-toggle-button-selected-color: var(\n            --md-toggle-button-selected-color,\n            var(--_md-toggle-button-selected-color-default)\n        );\n        --_md-toggle-button-color: var(\n            --md-toggle-button-color,\n            var(--_md-toggle-button-color-default)\n        );\n\n        --_md-button-outline-color: var(\n            --md-button-outline-color,\n            var(--_md-button-outline-color-default)\n        );\n        --_md-toggle-button-outline-color: var(\n            --md-toggle-button-outline-color,\n            var(--_md-toggle-button-outline-color-default)\n        );\n        --_md-toggle-button-selected-outline-color: var(\n            --md-toggle-button-selected-outline-color,\n            var(--_md-toggle-button-selected-outline-color-default)\n        );\n\n        --_outline-color: var(--_md-button-outline-color, transparent);\n\n        /* state layer */\n        --_md-button-state-layer: var(--_md-button-color, transparent);\n        --_md-toggle-button-state-layer: var(\n            --_md-toggle-button-color,\n            transparent\n        );\n        --_md-toggle-button-selected-state-layer: var(\n            --_md-toggle-button-selected-color,\n            transparent\n        );\n\n        --_state-color: var(--_md-button-state-layer);\n        --_state-layer-opacity: 0;\n\n        --_state-layer-color: rgb(\n            from var(--_state-color) r g b /\n            var(--_state-layer-opacity)\n        );\n\n        /* variable to use */\n        --_background-color: var(--_md-button-background, transparent);\n        --_color: var(--_md-button-color, transparent);\n\n        /* styles */\n        background-color: var(--_background-color);\n        color: var(--_color);\n\n        &[data-toggle-button] {\n            --_background-color: var(\n                --_md-toggle-button-background,\n                transparent\n            );\n            --_color: var(--_md-toggle-button-color, transparent);\n            --_outline-color: var(\n                --_md-toggle-button-outline-color,\n                transparent\n            );\n\n            --_state-color: var(--_md-toggle-button-state-layer);\n        }\n\n        &[data-selected] {\n            --_background-color: var(\n                --_md-toggle-button-selected-background,\n                transparent\n            );\n            --_color: var(--_md-toggle-button-selected-color, transparent);\n            --_outline-color: var(\n                --_md-toggle-button-selected-outline-color,\n                transparent\n            );\n\n            --_state-color: var(--_md-toggle-button-selected-state-layer);\n        }\n\n        &[data-hovered] {\n            --_state-layer-opacity: var(--md-sys-state-hover);\n        }\n\n        &[data-focus-visible] {\n            --_state-layer-opacity: var(--md-sys-state-focus);\n        }\n\n        &[data-pressed] {\n            --_state-layer-opacity: var(--md-sys-state-pressed);\n        }\n\n        &[data-disabled] {\n            --_background-color: rgb(\n                from var(--md-sys-color-on-surface) r g b /\n                var(--md-sys-state-disabled-container)\n            );\n            --_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    /* state layer */\n    .color::before {\n        content: \"\";\n\n        position: absolute;\n        inset: 0;\n        border-radius: inherit;\n\n        background-color: var(--_state-layer-color);\n\n        transition: background-color var(--md-sys-motion-standard-fast-spatial)\n            var(--md-sys-motion-standard-fast-spatial-duration);\n\n        @media (prefers-reduced-motion) {\n            transition: none;\n        }\n    }\n\n    /* focus indicator */\n    .color[data-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        z-index: 1;\n    }\n\n    .filled {\n        /* background */\n        --_md-button-background-default: var(--md-sys-color-primary);\n        --_md-toggle-button-selected-background-default: var(\n            --md-sys-color-primary\n        );\n        --_md-toggle-button-background-default: var(\n            --md-sys-color-surface-container\n        );\n\n        /* text and icon */\n        --_md-button-color-default: var(--md-sys-color-on-primary);\n        --_md-toggle-button-selected-color-default: var(\n            --md-sys-color-on-primary\n        );\n        --_md-toggle-button-color-default: var(\n            --md-sys-color-on-surface-variant\n        );\n    }\n\n    .tonal {\n        /* background */\n        --_md-button-background-default: var(\n            --md-sys-color-secondary-container\n        );\n        --_md-toggle-button-selected-background-default: var(\n            --md-sys-color-secondary\n        );\n        --_md-toggle-button-background-default: var(\n            --md-sys-color-secondary-container\n        );\n\n        /* text and icon */\n        --_md-button-color-default: var(--md-sys-color-on-secondary-container);\n        --_md-toggle-button-selected-color-default: var(\n            --md-sys-color-on-secondary\n        );\n        --_md-toggle-button-color-default: var(\n            --md-sys-color-on-secondary-container\n        );\n    }\n\n    .outlined {\n        /* outline */\n        --_md-button-outline-color-default: var(--md-sys-color-outline-variant);\n        --_md-toggle-button-outline-color-default: var(\n            --md-sys-color-outline-variant\n        );\n\n        /* background */\n        --_md-toggle-button-selected-background-default: var(\n            --md-sys-color-inverse-surface\n        );\n\n        /* text and icon */\n        --_md-button-color-default: var(--md-sys-color-on-surface-variant);\n        --_md-toggle-button-selected-color-default: var(\n            --md-sys-color-inverse-on-surface\n        );\n        --_md-toggle-button-color-default: var(\n            --md-sys-color-on-surface-variant\n        );\n\n        [data-visual-button] {\n            /* styles limited to outlined color */\n            border-width: var(--_md-button-outline-width);\n            border-style: solid;\n            border-color: var(--_outline-color);\n        }\n    }\n\n    /* no toggle button states are there */\n    .text {\n        /* text and icon */\n        --_md-button-color-default: var(--md-sys-color-primary);\n    }\n\n    .standard {\n        /* text and icon */\n        --_md-button-color-default: var(--md-sys-color-on-surface-variant);\n        --_md-toggle-button-selected-color-default: var(--md-sys-color-primary);\n        --_md-toggle-button-color-default: var(\n            --md-sys-color-on-surface-variant\n        );\n\n        &[data-disabled] {\n            --_background-color: transparent;\n        }\n    }\n\n    .elevated {\n        /* background */\n        --_md-button-background-default: var(\n            --md-sys-color-surface-container-low\n        );\n        --_md-toggle-button-selected-background-default: var(\n            --md-sys-color-primary\n        );\n        --_md-toggle-button-background-default: var(\n            --md-sys-color-surface-container-low\n        );\n\n        /* text and icon */\n        --_md-button-color-default: var(--md-sys-color-primary);\n        --_md-toggle-button-selected-color-default: var(\n            --md-sys-color-on-primary\n        );\n        --_md-toggle-button-color-default: var(--md-sys-color-primary);\n\n        [data-visual-button] {\n            /* styles limited to elevated color */\n            box-shadow: var(--md-sys-elevation-shadow-1);\n\n            &[data-disabled] {\n                box-shadow: none;\n            }\n        }\n    }\n}\n","import styles from \"./color.module.css\";\n\nexport type CoreButtonColor = \"filled\" | \"tonal\" | \"outlined\";\n\nexport type ButtonColor = CoreButtonColor | \"elevated\" | \"text\";\n\nexport type ToggleButtonColor = CoreButtonColor | \"elevated\";\n\nexport type IconButtonColor = CoreButtonColor | \"standard\";\n\nexport type SplitButtonColor = CoreButtonColor | \"elevated\";\n\nexport type ConnectedButtonGroupColor = CoreButtonColor | \"elevated\";\n\nexport type AllButtonColor =\n    | ButtonColor\n    | IconButtonColor\n    | SplitButtonColor\n    | ConnectedButtonGroupColor;\n\nexport const buttonColorConfig = (color: AllButtonColor) => {\n    return styles[color];\n};\n\nexport const buttonColorBase = styles[\"color\"];\n","@layer adgytec.comps {\n    .size {\n        /* shape */\n        --_shape: var(--_md-button-shape);\n\n        /* styles */\n        padding-inline: var(--_md-button-padding-inline);\n        padding-block: var(--_md-button-padding-block);\n        border-radius: var(--_shape);\n\n        display: flex;\n        gap: var(--_md-button-icon-label-gap);\n        align-items: center;\n        justify-content: center;\n\n        &[data-selected] {\n            --_shape: var(--_md-toggle-button-selected-shape);\n        }\n\n        &[data-pressed] {\n            --_shape: var(--_md-button-pressed-shape);\n        }\n    }\n\n    .extra-small {\n        /* height for button is 32 */\n        --md-sys-shape-corner-radius-full: calc(16 * var(--dp, 1px));\n\n        --_md-button-padding-block-base: calc(6 * var(--dp, 1px));\n        --_md-button-padding-block: var(--_md-button-padding-block-base);\n\n        --_md-button-padding-inline-base: var(--md-sys-layout-space-12);\n        --_md-button-padding-inline: var(--_md-button-padding-inline-base);\n\n        --_md-button-icon-label-gap: var(--md-sys-layout-space-4);\n        --_md-button-outline-width: var(--md-sys-shape-border-width-thin);\n\n        --_md-button-shape: var(--md-sys-shape-corner-radius-full);\n        --_md-toggle-button-selected-shape: var(\n            --md-sys-shape-corner-radius-medium\n        );\n\n        --_md-button-pressed-shape: var(--md-sys-shape-corner-radius-small);\n\n        &[data-shape=\"square\"] {\n            --_md-button-shape: var(--md-sys-shape-corner-radius-medium);\n            --_md-toggle-button-selected-shape: var(\n                --md-sys-shape-corner-radius-full\n            );\n        }\n\n        /* icon button width */\n        &[data-width=\"narrow\"] {\n            --_md-button-padding-inline-base: var(--md-sys-layout-space-4);\n        }\n\n        &[data-width=\"default\"] {\n            --_md-button-padding-inline-base: calc(6 * var(--dp, 1px));\n        }\n\n        &[data-width=\"wide\"] {\n            --_md-button-padding-inline-base: calc(10 * var(--dp, 1px));\n        }\n    }\n\n    .small {\n        /* height for button is 40 */\n        --md-sys-shape-corner-radius-full: calc(20 * var(--dp, 1px));\n\n        --_md-button-padding-block-base: calc(10 * var(--dp, 1px));\n        --_md-button-padding-block: var(--_md-button-padding-block-base);\n\n        --_md-button-padding-inline-base: var(--md-sys-layout-space-16);\n        --_md-button-padding-inline: var(--_md-button-padding-inline-base);\n\n        --_md-button-icon-label-gap: var(--md-sys-layout-space-8);\n        --_md-button-outline-width: var(--md-sys-shape-border-width-thin);\n\n        --_md-button-shape: var(--md-sys-shape-corner-radius-full);\n        --_md-toggle-button-selected-shape: var(\n            --md-sys-shape-corner-radius-medium\n        );\n\n        --_md-button-pressed-shape: var(--md-sys-shape-corner-radius-small);\n\n        &[data-shape=\"square\"] {\n            --_md-button-shape: var(--md-sys-shape-corner-radius-medium);\n            --_md-toggle-button-selected-shape: var(\n                --md-sys-shape-corner-radius-full\n            );\n        }\n\n        /* icon button width */\n        &[data-width=\"narrow\"] {\n            --_md-button-padding-inline-base: var(--md-sys-layout-space-4);\n        }\n\n        &[data-width=\"default\"] {\n            --_md-button-padding-inline-base: var(--md-sys-layout-space-8);\n        }\n\n        &[data-width=\"wide\"] {\n            --_md-button-padding-inline-base: calc(14 * var(--dp, 1px));\n        }\n\n        /* icon button height adjustment: icon size is 24 for icon only buttons */\n        &[data-icon-button] {\n            --_md-button-padding-block-base: calc(8 * var(--dp, 1px));\n        }\n    }\n\n    .medium {\n        /* height for button is 56 */\n        --md-sys-shape-corner-radius-full: calc(28 * var(--dp, 1px));\n\n        --_md-button-padding-block-base: var(--md-sys-layout-space-16);\n        --_md-button-padding-block: var(--_md-button-padding-block-base);\n\n        --_md-button-padding-inline-base: var(--md-sys-layout-space-24);\n        --_md-button-padding-inline: var(--_md-button-padding-inline-base);\n\n        --_md-button-icon-label-gap: var(--md-sys-layout-space-8);\n        --_md-button-outline-width: var(--md-sys-shape-border-width-thin);\n\n        --_md-button-shape: var(--md-sys-shape-corner-radius-full);\n        --_md-toggle-button-selected-shape: var(\n            --md-sys-shape-corner-radius-large\n        );\n\n        --_md-button-pressed-shape: var(--md-sys-shape-corner-radius-medium);\n\n        &[data-shape=\"square\"] {\n            --_md-button-shape: var(--md-sys-shape-corner-radius-large);\n            --_md-toggle-button-selected-shape: var(\n                --md-sys-shape-corner-radius-full\n            );\n        }\n\n        /* icon button width */\n        &[data-width=\"narrow\"] {\n            --_md-button-padding-inline-base: var(--md-sys-layout-space-12);\n        }\n\n        &[data-width=\"default\"] {\n            --_md-button-padding-inline-base: var(--md-sys-layout-space-16);\n        }\n\n        &[data-width=\"wide\"] {\n            --_md-button-padding-inline-base: var(--md-sys-layout-space-24);\n        }\n    }\n\n    .large {\n        /* height for button is 96 */\n        --md-sys-shape-corner-radius-full: calc(48 * var(--dp, 1px));\n\n        --_md-button-padding-block-base: var(--md-sys-layout-space-32);\n        --_md-button-padding-block: var(--_md-button-padding-block-base);\n\n        --_md-button-padding-inline-base: var(--md-sys-layout-space-48);\n        --_md-button-padding-inline: var(--_md-button-padding-inline-base);\n\n        --_md-button-icon-label-gap: var(--md-sys-layout-space-12);\n        --_md-button-outline-width: var(--md-sys-shape-border-width-thick);\n\n        --_md-button-shape: var(--md-sys-shape-corner-radius-full);\n        --_md-toggle-button-selected-shape: var(\n            --md-sys-shape-corner-radius-extra-large\n        );\n\n        --_md-button-pressed-shape: var(--md-sys-shape-corner-radius-large);\n\n        &[data-shape=\"square\"] {\n            --_md-button-shape: var(--md-sys-shape-corner-radius-extra-large);\n            --_md-toggle-button-selected-shape: var(\n                --md-sys-shape-corner-radius-full\n            );\n        }\n\n        /* icon button width */\n        &[data-width=\"narrow\"] {\n            --_md-button-padding-inline-base: var(--md-sys-layout-space-16);\n        }\n\n        &[data-width=\"default\"] {\n            --_md-button-padding-inline-base: var(--md-sys-layout-space-32);\n        }\n\n        &[data-width=\"wide\"] {\n            --_md-button-padding-inline-base: var(--md-sys-layout-space-48);\n        }\n    }\n\n    .extra-large {\n        /* height for button is 136 */\n        --md-sys-shape-corner-radius-full: calc(68 * var(--dp, 1px));\n\n        --_md-button-padding-block-base: var(--md-sys-layout-space-48);\n        --_md-button-padding-block: var(--_md-button-padding-block-base);\n\n        --_md-button-padding-inline-base: var(--md-sys-layout-space-64);\n        --_md-button-padding-inline: var(--_md-button-padding-inline-base);\n\n        --_md-button-icon-label-gap: var(--md-sys-layout-space-16);\n        --_md-button-outline-width: calc(3 * var(--dp, 1px));\n\n        --_md-button-shape: var(--md-sys-shape-corner-radius-full);\n        --_md-toggle-button-selected-shape: var(\n            --md-sys-shape-corner-radius-extra-large\n        );\n\n        --_md-button-pressed-shape: var(--md-sys-shape-corner-radius-large);\n\n        &[data-shape=\"square\"] {\n            --_md-button-shape: var(--md-sys-shape-corner-radius-extra-large);\n            --_md-toggle-button-selected-shape: var(\n                --md-sys-shape-corner-radius-full\n            );\n        }\n\n        /* icon button width */\n        &[data-width=\"narrow\"] {\n            --_md-button-padding-inline-base: var(--md-sys-layout-space-32);\n        }\n\n        &[data-width=\"default\"] {\n            --_md-button-padding-inline-base: var(--md-sys-layout-space-48);\n        }\n\n        &[data-width=\"wide\"] {\n            --_md-button-padding-inline-base: var(--md-sys-layout-space-72);\n        }\n    }\n}\n","import { typography } from \"@/utils/typography\";\nimport styles from \"./size.module.css\";\n\nexport type ButtonSize =\n    | \"extra-small\"\n    | \"small\"\n    | \"medium\"\n    | \"large\"\n    | \"extra-large\";\n\nexport const ButtonIconSizeMapping: Record<ButtonSize, number> = {\n    \"extra-small\": 20,\n    small: 20,\n    medium: 24,\n    large: 32,\n    \"extra-large\": 40,\n} as const;\n\nexport const IconButtonIconSizeMapping: Record<ButtonSize, number> = {\n    \"extra-small\": 20,\n    small: 24,\n    medium: 24,\n    large: 32,\n    \"extra-large\": 40,\n} as const;\n\nexport const ButtonLabelTextMapping: Record<ButtonSize, string> = {\n    \"extra-small\": typography.labelLarge,\n    small: typography.labelLarge,\n    medium: typography.bodyLargeEmphasized,\n    large: typography.headlineSmall,\n    \"extra-large\": typography.headlineLarge,\n} as const;\n\nexport const buttonSizeConfig = (size: ButtonSize) => {\n    return styles[size];\n};\n\nexport const ButtonSizeBase = styles[\"size\"];\n","@layer adgytec.comps {\n    .button {\n        /* styles */\n        min-inline-size: var(--min-tap-target-size);\n\n        padding-inline: var(--_md-button-padding-inline);\n        padding-block: var(--_md-button-padding-block);\n\n        display: inline-flex;\n        gap: var(--_md-button-icon-label-gap);\n        align-items: center;\n        justify-content: center;\n\n        /* shape styles */\n        border-start-start-radius: var(--_shape-start-start);\n        border-end-start-radius: var(--_shape-end-start);\n        border-start-end-radius: var(--_shape-start-end);\n        border-end-end-radius: var(--_shape-end-end);\n\n        &[data-selected] {\n            --_shape-start-start: var(--_selected-shape);\n            --_shape-end-start: var(--_selected-shape);\n            --_shape-start-end: var(--_selected-shape);\n            --_shape-end-end: var(--_selected-shape);\n        }\n    }\n}\n","import clsx from \"clsx\";\nimport { ToggleButton as AriaToggleButton } from \"react-aria-components\";\nimport { Icon } from \"@/components/Icon\";\nimport { Splash } from \"@/components/Splash/Splash\";\nimport { useSplash } from \"@/components/Splash/useSplash\";\nimport { TapTarget } from \"@/utils/tapTarget\";\nimport {\n    ButtonCore,\n    ButtonIconSizeMapping,\n    ButtonLabelTextMapping,\n    ButtonReset,\n    buttonColorBase,\n    buttonColorConfig,\n} from \"../../core\";\nimport { useConnectedButtonGroupContext } from \"../ButtonGroupContext\";\nimport styles from \"./connectedButton.module.css\";\nimport type { ConnectedButtonProps } from \"./types\";\n\nexport const ConnectedButton: React.FC<ConnectedButtonProps> = ({\n    icon,\n    selectedIcon,\n    children,\n    onPress,\n    iconPlacement,\n    ...props\n}) => {\n    const {\n        shape,\n        size,\n        color,\n        iconPlacement: groupIconPlacement,\n    } = useConnectedButtonGroupContext();\n\n    const buttonIconPlacement = iconPlacement ?? groupIconPlacement ?? \"start\";\n\n    const { splashInfo, handlePress } = useSplash(onPress);\n    const isChildFunc = typeof children === \"function\";\n\n    return (\n        <AriaToggleButton\n            onPress={handlePress}\n            className={clsx(ButtonReset, TapTarget, buttonColorConfig(color))}\n            {...props}\n            data-connected-button={true}\n            data-button\n        >\n            {(renderProps) => {\n                const {\n                    isSelected,\n                    isDisabled,\n                    isFocusVisible,\n                    isFocused,\n                    isPressed,\n                    isHovered,\n                } = renderProps;\n\n                const dataAttrs = {\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-selected\": isSelected || undefined,\n                    \"data-toggle-button\": true,\n                    \"data-shape\": shape,\n                    \"data-visual-button\": true,\n                };\n\n                let iconToRender = icon;\n                if (isSelected && selectedIcon) iconToRender = selectedIcon;\n\n                const iconSize = ButtonIconSizeMapping[size];\n                const iconComp = iconToRender && (\n                    <Icon icon={iconToRender} size={iconSize} />\n                );\n\n                return (\n                    <span\n                        {...dataAttrs}\n                        className={clsx(\n                            ButtonCore,\n                            buttonColorBase,\n                            ButtonLabelTextMapping[size],\n                            styles[\"button\"]\n                        )}\n                    >\n                        {splashInfo && <Splash {...splashInfo} />}\n\n                        {buttonIconPlacement === \"start\" && iconComp}\n\n                        {isChildFunc ? children(renderProps) : children}\n\n                        {buttonIconPlacement === \"end\" && iconComp}\n                    </span>\n                );\n            }}\n        </AriaToggleButton>\n    );\n};\n","import { useButtonGroupContext } from \"../ButtonGroups\";\nimport type { ButtonIconPlacement } from \"./button\";\nimport type { ButtonShape } from \"./shape\";\nimport type { ButtonSize } from \"./sizes\";\n\ntype ButtonConfigOptions<C extends string> = {\n    size?: ButtonSize;\n    shape?: ButtonShape;\n    color?: C;\n    iconPlacement?: ButtonIconPlacement;\n};\n\nexport function useButtonConfig<C extends string>({\n    size,\n    shape,\n    color,\n    iconPlacement,\n}: ButtonConfigOptions<C>) {\n    const {\n        size: buttonGroupSize,\n        shape: buttonGroupShape,\n        color: buttonGroupColor,\n        iconPlacement: buttonGroupIconPlacement,\n    } = useButtonGroupContext();\n\n    const buttonSize = size ?? buttonGroupSize ?? \"small\";\n    const buttonShape = shape ?? buttonGroupShape ?? \"round\";\n    const buttonColor = color ?? buttonGroupColor ?? \"filled\";\n    const buttonIconPlacement =\n        iconPlacement ?? buttonGroupIconPlacement ?? \"start\";\n\n    return { buttonSize, buttonShape, buttonColor, buttonIconPlacement };\n}\n","import type { ReactElement } from \"react\";\nimport { Tooltip, TooltipTrigger } from \"@/components/Tooltip\";\n\nexport const withTooltip = (element: ReactElement, tooltip?: string) => {\n    if (!tooltip) return element;\n\n    return (\n        <TooltipTrigger>\n            {element}\n\n            <Tooltip>{tooltip}</Tooltip>\n        </TooltipTrigger>\n    );\n};\n"],"mappings":";;;;;;;;;;;;;;GC2Ba,IAAc,EAAO,iBACrB,IAAa,EAAO;AAEjC,SAAgB,EAAuB,EACnC,UACA,SACA,YAKD;CACC,OAAO;EACH,cAAc;EACd,aAAa;EACb,cAAc;CAClB;AACJ;;;;;;;;;GExBa,KAAqB,MACvB,EAAO,IAGL,IAAkB,EAAO;;;;;;;GEdzB,IAAoD;CAC7D,eAAe;CACf,OAAO;CACP,QAAQ;CACR,OAAO;CACP,eAAe;AACnB,GAEa,IAAwD;CACjE,eAAe;CACf,OAAO;CACP,QAAQ;CACR,OAAO;CACP,eAAe;AACnB,GAEa,IAAqD;CAC9D,eAAe,EAAW;CAC1B,OAAO,EAAW;CAClB,QAAQ,EAAW;CACnB,OAAO,EAAW;CAClB,eAAe,EAAW;AAC9B,GAEa,KAAoB,MACtB,EAAO,IAGL,IAAiB,EAAO,yCEpBxB,KAAmD,EAC5D,SACA,iBACA,aACA,YACA,kBACA,GAAG,QACD;CACF,IAAM,EACF,UACA,SACA,UACA,eAAe,MACf,EAA+B,GAE7B,IAAsB,KAAiB,KAAsB,SAE7D,EAAE,eAAY,mBAAgB,EAAU,CAAO,GAC/C,IAAc,OAAO,KAAa;CAExC,OACI,kBAAC,GAAD;EACI,SAAS;EACT,WAAW,EAAK,GAAa,GAAW,EAAkB,CAAK,CAAC;EAChE,GAAI;EACJ,yBAAuB;EACvB,eAAA;aAEE,MAAgB;GACd,IAAM,EACF,eACA,eACA,mBACA,cACA,cACA,iBACA,GAEE,IAAY;IACd,gBAAgB,KAAa,KAAA;IAC7B,iBAAiB,KAAc,KAAA;IAC/B,gBAAgB,KAAa,KAAA;IAC7B,sBAAsB,KAAkB,KAAA;IACxC,gBAAgB,KAAa,KAAA;IAC7B,iBAAiB,KAAc,KAAA;IAC/B,sBAAsB;IACtB,cAAc;IACd,sBAAsB;GAC1B,GAEI,IAAe;GACnB,AAAI,KAAc,MAAc,IAAe;GAE/C,IAAM,IAAW,EAAsB,IACjC,IAAW,KACb,kBAAC,GAAD;IAAM,MAAM;IAAc,MAAM;GAAW,CAAA;GAG/C,OACI,kBAAC,QAAD;IACI,GAAI;IACJ,WAAW,EACP,GACA,GACA,EAAuB,IACvB,EAAO,MACX;cAPJ;KASK,KAAc,kBAAC,GAAD,EAAQ,GAAI,EAAa,CAAA;KAEvC,MAAwB,WAAW;KAEnC,IAAc,EAAS,CAAW,IAAI;KAEtC,MAAwB,SAAS;IAChC;;EAEd;CACc,CAAA;AAE1B;;;ACtFA,SAAgB,EAAkC,EAC9C,SACA,UACA,UACA,oBACuB;CACvB,IAAM,EACF,MAAM,GACN,OAAO,GACP,OAAO,GACP,eAAe,MACf,EAAsB;CAQ1B,OAAO;EAAE,YANU,KAAQ,KAAmB;EAMzB,aALD,KAAS,KAAoB;EAKf,aAJd,KAAS,KAAoB;EAIF,qBAF3C,KAAiB,KAA4B;CAEkB;AACvE;;;AC7BA,IAAa,KAAe,GAAuB,MAC1C,IAGD,kBAAC,GAAD,EAAA,UAAA,CACK,GAED,kBAAC,GAAD,EAAA,UAAU,EAAiB,CAAA,CACf,EAAA,CAAA,IAPC"}
+{"version":3,"file":"core","names":["iconToRender","iconSize","handlePress"],"sources":["../../src/components/Button/core/button.module.css","../../src/components/Button/core/button.ts","../../src/components/Button/core/color.module.css","../../src/components/Button/core/color.ts","../../src/components/Button/core/size.module.css","../../src/components/Button/core/sizes.ts","../../src/components/Button/ButtonGroups/ConnectedButton/connectedButton.module.css","../../src/components/Button/ButtonGroups/ConnectedButton/ConnectedButton.tsx","../../src/components/Button/core/useButtonConfig.ts","../../src/components/Button/core/withTooltip.tsx"],"sourcesContent":["@layer adgytec.comps {\n    .button-reset {\n        all: unset;\n        cursor: pointer;\n        position: relative;\n        text-align: center;\n\n        &[data-disabled] {\n            cursor: default;\n        }\n\n        &[data-pending] {\n            cursor: default;\n        }\n    }\n\n    .button-core {\n        position: relative;\n        overflow: clip;\n\n        --_md-button-shape-motion: var(--md-sys-motion-expressive-fast-spatial);\n        --_md-button-shape-motion-duration: var(\n            --md-sys-motion-expressive-fast-spatial-duration\n        );\n\n        transition:\n            border-radius var(--_md-button-shape-motion)\n            var(--_md-button-shape-motion-duration),\n            background-color var(--md-sys-motion-expressive-fast-effects)\n            var(--md-sys-motion-expressive-fast-effects-duration),\n            color var(--md-sys-motion-expressive-fast-effects)\n            var(--md-sys-motion-expressive-fast-effects-duration),\n            border-color var(--md-sys-motion-expressive-fast-effects)\n            var(--md-sys-motion-expressive-fast-effects-duration),\n            box-shadow var(--md-sys-motion-expressive-fast-spatial)\n            var(--md-sys-motion-expressive-fast-spatial-duration),\n            padding 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","import type { LucideIcon } from \"lucide-react\";\nimport styles from \"./button.module.css\";\nimport type { AllButtonColor, ButtonColor, IconButtonColor } from \"./color\";\nimport type { ButtonShape } from \"./shape\";\nimport type { ButtonSize } from \"./sizes\";\nimport type { IconButtonWidth } from \"./width\";\n\nexport type ButtonIconPlacement = \"start\" | \"end\";\n\nexport interface ButtonBaseProps {\n    color?: ButtonColor;\n    size?: ButtonSize;\n    shape?: ButtonShape;\n    tooltip?: string;\n    icon?: LucideIcon;\n    iconPlacement?: ButtonIconPlacement;\n}\n\nexport interface IconButtonBaseProps {\n    color?: IconButtonColor;\n    size?: ButtonSize;\n    shape?: ButtonShape;\n    width?: IconButtonWidth;\n    tooltip?: string;\n    icon: LucideIcon;\n}\n\nexport const ButtonReset = styles[\"button-reset\"];\nexport const ButtonCore = styles[\"button-core\"];\n\nexport function newButtonBaseDataAttrs({\n    shape,\n    size,\n    color,\n}: {\n    shape: ButtonShape;\n    color: AllButtonColor;\n    size: ButtonSize;\n}) {\n    return {\n        \"data-shape\": shape,\n        \"data-size\": size,\n        \"data-color\": color,\n    };\n}\n","/* configurable tokens\n*\n* --md-button-background\n* --md-toggle-button-selected-background\n* --md-toggle-button-background\n*\n* --md-button-outline-color\n* --md-toggle-button-selected-outline-color\n* --md-toggle-button-outline-color\n*\n* --md-button-color\n* --md-toggle-button-selected-color\n* --md-toggle-button-color\n*\n* configurable tokens end */\n\n@layer adgytec.overrides {\n    .outlined {\n        --_md-button-padding-block: calc(\n            var(--_md-button-padding-block-base) -\n            var(--_md-button-outline-width, 0)\n        );\n\n        --_md-button-padding-inline: calc(\n            var(--_md-button-padding-inline-base) -\n            var(--_md-button-outline-width, 0)\n        );\n\n        --_md-split-button-padding-inline-start: calc(\n            var(--_md-split-button-padding-inline-start-base) -\n            var(--_md-button-outline-width, 0)\n        );\n\n        --_md-split-button-padding-inline-end: calc(\n            var(--_md-split-button-padding-inline-end-base) -\n            var(--_md-button-outline-width, 0)\n        );\n    }\n}\n\n@layer adgytec.comps {\n    .color {\n        --_md-button-background: var(\n            --md-button-background,\n            var(--_md-button-background-default)\n        );\n        --_md-toggle-button-selected-background: var(\n            --md-toggle-button-selected-background,\n            var(--_md-toggle-button-selected-background-default)\n        );\n        --_md-toggle-button-background: var(\n            --md-toggle-button-background,\n            var(--_md-toggle-button-background-default)\n        );\n\n        --_md-button-color: var(\n            --md-button-color,\n            var(--_md-button-color-default)\n        );\n        --_md-toggle-button-selected-color: var(\n            --md-toggle-button-selected-color,\n            var(--_md-toggle-button-selected-color-default)\n        );\n        --_md-toggle-button-color: var(\n            --md-toggle-button-color,\n            var(--_md-toggle-button-color-default)\n        );\n\n        --_md-button-outline-color: var(\n            --md-button-outline-color,\n            var(--_md-button-outline-color-default)\n        );\n        --_md-toggle-button-outline-color: var(\n            --md-toggle-button-outline-color,\n            var(--_md-toggle-button-outline-color-default)\n        );\n        --_md-toggle-button-selected-outline-color: var(\n            --md-toggle-button-selected-outline-color,\n            var(--_md-toggle-button-selected-outline-color-default)\n        );\n\n        --_outline-color: var(--_md-button-outline-color, transparent);\n\n        /* state layer */\n        --_md-button-state-layer: var(--_md-button-color, transparent);\n        --_md-toggle-button-state-layer: var(\n            --_md-toggle-button-color,\n            transparent\n        );\n        --_md-toggle-button-selected-state-layer: var(\n            --_md-toggle-button-selected-color,\n            transparent\n        );\n\n        --_state-color: var(--_md-button-state-layer);\n        --_state-layer-opacity: 0;\n\n        --_state-layer-color: rgb(\n            from var(--_state-color) r g b /\n            var(--_state-layer-opacity)\n        );\n\n        /* variable to use */\n        --_background-color: var(--_md-button-background, transparent);\n        --_color: var(--_md-button-color, transparent);\n\n        /* styles */\n        background-color: var(--_background-color);\n        color: var(--_color);\n\n        &[data-toggle-button] {\n            --_background-color: var(\n                --_md-toggle-button-background,\n                transparent\n            );\n            --_color: var(--_md-toggle-button-color, transparent);\n            --_outline-color: var(\n                --_md-toggle-button-outline-color,\n                transparent\n            );\n\n            --_state-color: var(--_md-toggle-button-state-layer);\n        }\n\n        &[data-selected] {\n            --_background-color: var(\n                --_md-toggle-button-selected-background,\n                transparent\n            );\n            --_color: var(--_md-toggle-button-selected-color, transparent);\n            --_outline-color: var(\n                --_md-toggle-button-selected-outline-color,\n                transparent\n            );\n\n            --_state-color: var(--_md-toggle-button-selected-state-layer);\n        }\n\n        &[data-hovered] {\n            --_state-layer-opacity: var(--md-sys-state-hover);\n        }\n\n        &[data-focus-visible] {\n            --_state-layer-opacity: var(--md-sys-state-focus);\n        }\n\n        &[data-pressed] {\n            --_state-layer-opacity: var(--md-sys-state-pressed);\n        }\n\n        &[data-disabled] {\n            --_background-color: rgb(\n                from var(--md-sys-color-on-surface) r g b /\n                var(--md-sys-state-disabled-container)\n            );\n            --_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    /* state layer */\n    .color::before {\n        content: \"\";\n\n        position: absolute;\n        inset: 0;\n        border-radius: inherit;\n\n        background-color: var(--_state-layer-color);\n\n        transition: background-color var(--md-sys-motion-standard-fast-spatial)\n            var(--md-sys-motion-standard-fast-spatial-duration);\n\n        @media (prefers-reduced-motion) {\n            transition: none;\n        }\n    }\n\n    /* focus indicator */\n    .color[data-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        z-index: 1;\n    }\n\n    .filled {\n        /* background */\n        --_md-button-background-default: var(--md-sys-color-primary);\n        --_md-toggle-button-selected-background-default: var(\n            --md-sys-color-primary\n        );\n        --_md-toggle-button-background-default: var(\n            --md-sys-color-surface-container\n        );\n\n        /* text and icon */\n        --_md-button-color-default: var(--md-sys-color-on-primary);\n        --_md-toggle-button-selected-color-default: var(\n            --md-sys-color-on-primary\n        );\n        --_md-toggle-button-color-default: var(\n            --md-sys-color-on-surface-variant\n        );\n    }\n\n    .tonal {\n        /* background */\n        --_md-button-background-default: var(\n            --md-sys-color-secondary-container\n        );\n        --_md-toggle-button-selected-background-default: var(\n            --md-sys-color-secondary\n        );\n        --_md-toggle-button-background-default: var(\n            --md-sys-color-secondary-container\n        );\n\n        /* text and icon */\n        --_md-button-color-default: var(--md-sys-color-on-secondary-container);\n        --_md-toggle-button-selected-color-default: var(\n            --md-sys-color-on-secondary\n        );\n        --_md-toggle-button-color-default: var(\n            --md-sys-color-on-secondary-container\n        );\n    }\n\n    .outlined {\n        /* outline */\n        --_md-button-outline-color-default: var(--md-sys-color-outline-variant);\n        --_md-toggle-button-outline-color-default: var(\n            --md-sys-color-outline-variant\n        );\n\n        /* background */\n        --_md-toggle-button-selected-background-default: var(\n            --md-sys-color-inverse-surface\n        );\n\n        /* text and icon */\n        --_md-button-color-default: var(--md-sys-color-on-surface-variant);\n        --_md-toggle-button-selected-color-default: var(\n            --md-sys-color-inverse-on-surface\n        );\n        --_md-toggle-button-color-default: var(\n            --md-sys-color-on-surface-variant\n        );\n\n        [data-visual-button] {\n            /* styles limited to outlined color */\n            border-width: var(--_md-button-outline-width);\n            border-style: solid;\n            border-color: var(--_outline-color);\n        }\n    }\n\n    /* no toggle button states are there */\n    .text {\n        /* text and icon */\n        --_md-button-color-default: var(--md-sys-color-primary);\n    }\n\n    .standard {\n        /* text and icon */\n        --_md-button-color-default: var(--md-sys-color-on-surface-variant);\n        --_md-toggle-button-selected-color-default: var(--md-sys-color-primary);\n        --_md-toggle-button-color-default: var(\n            --md-sys-color-on-surface-variant\n        );\n\n        &[data-disabled] {\n            --_background-color: transparent;\n        }\n    }\n\n    .elevated {\n        /* background */\n        --_md-button-background-default: var(\n            --md-sys-color-surface-container-low\n        );\n        --_md-toggle-button-selected-background-default: var(\n            --md-sys-color-primary\n        );\n        --_md-toggle-button-background-default: var(\n            --md-sys-color-surface-container-low\n        );\n\n        /* text and icon */\n        --_md-button-color-default: var(--md-sys-color-primary);\n        --_md-toggle-button-selected-color-default: var(\n            --md-sys-color-on-primary\n        );\n        --_md-toggle-button-color-default: var(--md-sys-color-primary);\n\n        [data-visual-button] {\n            /* styles limited to elevated color */\n            box-shadow: var(--md-sys-elevation-shadow-1);\n\n            &[data-disabled] {\n                box-shadow: none;\n            }\n        }\n    }\n}\n","import styles from \"./color.module.css\";\n\nexport type CoreButtonColor = \"filled\" | \"tonal\" | \"outlined\";\n\nexport type ButtonColor = CoreButtonColor | \"elevated\" | \"text\";\n\nexport type ToggleButtonColor = CoreButtonColor | \"elevated\";\n\nexport type IconButtonColor = CoreButtonColor | \"standard\";\n\nexport type SplitButtonColor = CoreButtonColor | \"elevated\";\n\nexport type ConnectedButtonGroupColor = CoreButtonColor | \"elevated\";\n\nexport type AllButtonColor =\n    | ButtonColor\n    | IconButtonColor\n    | SplitButtonColor\n    | ConnectedButtonGroupColor;\n\nexport const buttonColorConfig = (color: AllButtonColor) => {\n    return styles[color];\n};\n\nexport const buttonColorBase = styles[\"color\"];\n","@layer adgytec.comps {\n    .size {\n        /* shape */\n        --_shape: var(--_md-button-shape);\n\n        /* styles */\n        padding-inline: var(--_md-button-padding-inline);\n        padding-block: var(--_md-button-padding-block);\n        border-radius: var(--_shape);\n\n        display: flex;\n        gap: var(--_md-button-icon-label-gap);\n        align-items: center;\n        justify-content: center;\n\n        &[data-selected] {\n            --_shape: var(--_md-toggle-button-selected-shape);\n        }\n\n        &[data-pressed] {\n            --_shape: var(--_md-button-pressed-shape);\n        }\n    }\n\n    .extra-small {\n        /* height for button is 32 */\n        --md-sys-shape-corner-radius-full: calc(16 * var(--dp, 1px));\n\n        --_md-button-padding-block-base: calc(6 * var(--dp, 1px));\n        --_md-button-padding-block: var(--_md-button-padding-block-base);\n\n        --_md-button-padding-inline-base: var(--md-sys-layout-space-12);\n        --_md-button-padding-inline: var(--_md-button-padding-inline-base);\n\n        --_md-button-icon-label-gap: var(--md-sys-layout-space-4);\n        --_md-button-outline-width: var(--md-sys-shape-border-width-thin);\n\n        --_md-button-shape: var(--md-sys-shape-corner-radius-full);\n        --_md-toggle-button-selected-shape: var(\n            --md-sys-shape-corner-radius-medium\n        );\n\n        --_md-button-pressed-shape: var(--md-sys-shape-corner-radius-small);\n\n        &[data-shape=\"square\"] {\n            --_md-button-shape: var(--md-sys-shape-corner-radius-medium);\n            --_md-toggle-button-selected-shape: var(\n                --md-sys-shape-corner-radius-full\n            );\n        }\n\n        /* icon button width */\n        &[data-width=\"narrow\"] {\n            --_md-button-padding-inline-base: var(--md-sys-layout-space-4);\n        }\n\n        &[data-width=\"default\"] {\n            --_md-button-padding-inline-base: calc(6 * var(--dp, 1px));\n        }\n\n        &[data-width=\"wide\"] {\n            --_md-button-padding-inline-base: calc(10 * var(--dp, 1px));\n        }\n    }\n\n    .small {\n        /* height for button is 40 */\n        --md-sys-shape-corner-radius-full: calc(20 * var(--dp, 1px));\n\n        --_md-button-padding-block-base: calc(10 * var(--dp, 1px));\n        --_md-button-padding-block: var(--_md-button-padding-block-base);\n\n        --_md-button-padding-inline-base: var(--md-sys-layout-space-16);\n        --_md-button-padding-inline: var(--_md-button-padding-inline-base);\n\n        --_md-button-icon-label-gap: var(--md-sys-layout-space-8);\n        --_md-button-outline-width: var(--md-sys-shape-border-width-thin);\n\n        --_md-button-shape: var(--md-sys-shape-corner-radius-full);\n        --_md-toggle-button-selected-shape: var(\n            --md-sys-shape-corner-radius-medium\n        );\n\n        --_md-button-pressed-shape: var(--md-sys-shape-corner-radius-small);\n\n        &[data-shape=\"square\"] {\n            --_md-button-shape: var(--md-sys-shape-corner-radius-medium);\n            --_md-toggle-button-selected-shape: var(\n                --md-sys-shape-corner-radius-full\n            );\n        }\n\n        /* icon button width */\n        &[data-width=\"narrow\"] {\n            --_md-button-padding-inline-base: var(--md-sys-layout-space-4);\n        }\n\n        &[data-width=\"default\"] {\n            --_md-button-padding-inline-base: var(--md-sys-layout-space-8);\n        }\n\n        &[data-width=\"wide\"] {\n            --_md-button-padding-inline-base: calc(14 * var(--dp, 1px));\n        }\n\n        /* icon button height adjustment: icon size is 24 for icon only buttons */\n        &[data-icon-button] {\n            --_md-button-padding-block-base: calc(8 * var(--dp, 1px));\n        }\n    }\n\n    .medium {\n        /* height for button is 56 */\n        --md-sys-shape-corner-radius-full: calc(28 * var(--dp, 1px));\n\n        --_md-button-padding-block-base: var(--md-sys-layout-space-16);\n        --_md-button-padding-block: var(--_md-button-padding-block-base);\n\n        --_md-button-padding-inline-base: var(--md-sys-layout-space-24);\n        --_md-button-padding-inline: var(--_md-button-padding-inline-base);\n\n        --_md-button-icon-label-gap: var(--md-sys-layout-space-8);\n        --_md-button-outline-width: var(--md-sys-shape-border-width-thin);\n\n        --_md-button-shape: var(--md-sys-shape-corner-radius-full);\n        --_md-toggle-button-selected-shape: var(\n            --md-sys-shape-corner-radius-large\n        );\n\n        --_md-button-pressed-shape: var(--md-sys-shape-corner-radius-medium);\n\n        &[data-shape=\"square\"] {\n            --_md-button-shape: var(--md-sys-shape-corner-radius-large);\n            --_md-toggle-button-selected-shape: var(\n                --md-sys-shape-corner-radius-full\n            );\n        }\n\n        /* icon button width */\n        &[data-width=\"narrow\"] {\n            --_md-button-padding-inline-base: var(--md-sys-layout-space-12);\n        }\n\n        &[data-width=\"default\"] {\n            --_md-button-padding-inline-base: var(--md-sys-layout-space-16);\n        }\n\n        &[data-width=\"wide\"] {\n            --_md-button-padding-inline-base: var(--md-sys-layout-space-24);\n        }\n    }\n\n    .large {\n        /* height for button is 96 */\n        --md-sys-shape-corner-radius-full: calc(48 * var(--dp, 1px));\n\n        --_md-button-padding-block-base: var(--md-sys-layout-space-32);\n        --_md-button-padding-block: var(--_md-button-padding-block-base);\n\n        --_md-button-padding-inline-base: var(--md-sys-layout-space-48);\n        --_md-button-padding-inline: var(--_md-button-padding-inline-base);\n\n        --_md-button-icon-label-gap: var(--md-sys-layout-space-12);\n        --_md-button-outline-width: var(--md-sys-shape-border-width-thick);\n\n        --_md-button-shape: var(--md-sys-shape-corner-radius-full);\n        --_md-toggle-button-selected-shape: var(\n            --md-sys-shape-corner-radius-extra-large\n        );\n\n        --_md-button-pressed-shape: var(--md-sys-shape-corner-radius-large);\n\n        &[data-shape=\"square\"] {\n            --_md-button-shape: var(--md-sys-shape-corner-radius-extra-large);\n            --_md-toggle-button-selected-shape: var(\n                --md-sys-shape-corner-radius-full\n            );\n        }\n\n        /* icon button width */\n        &[data-width=\"narrow\"] {\n            --_md-button-padding-inline-base: var(--md-sys-layout-space-16);\n        }\n\n        &[data-width=\"default\"] {\n            --_md-button-padding-inline-base: var(--md-sys-layout-space-32);\n        }\n\n        &[data-width=\"wide\"] {\n            --_md-button-padding-inline-base: var(--md-sys-layout-space-48);\n        }\n    }\n\n    .extra-large {\n        /* height for button is 136 */\n        --md-sys-shape-corner-radius-full: calc(68 * var(--dp, 1px));\n\n        --_md-button-padding-block-base: var(--md-sys-layout-space-48);\n        --_md-button-padding-block: var(--_md-button-padding-block-base);\n\n        --_md-button-padding-inline-base: var(--md-sys-layout-space-64);\n        --_md-button-padding-inline: var(--_md-button-padding-inline-base);\n\n        --_md-button-icon-label-gap: var(--md-sys-layout-space-16);\n        --_md-button-outline-width: calc(3 * var(--dp, 1px));\n\n        --_md-button-shape: var(--md-sys-shape-corner-radius-full);\n        --_md-toggle-button-selected-shape: var(\n            --md-sys-shape-corner-radius-extra-large\n        );\n\n        --_md-button-pressed-shape: var(--md-sys-shape-corner-radius-large);\n\n        &[data-shape=\"square\"] {\n            --_md-button-shape: var(--md-sys-shape-corner-radius-extra-large);\n            --_md-toggle-button-selected-shape: var(\n                --md-sys-shape-corner-radius-full\n            );\n        }\n\n        /* icon button width */\n        &[data-width=\"narrow\"] {\n            --_md-button-padding-inline-base: var(--md-sys-layout-space-32);\n        }\n\n        &[data-width=\"default\"] {\n            --_md-button-padding-inline-base: var(--md-sys-layout-space-48);\n        }\n\n        &[data-width=\"wide\"] {\n            --_md-button-padding-inline-base: var(--md-sys-layout-space-72);\n        }\n    }\n}\n","import { typography } from \"@/utils/typography\";\nimport styles from \"./size.module.css\";\n\nexport type ButtonSize =\n    | \"extra-small\"\n    | \"small\"\n    | \"medium\"\n    | \"large\"\n    | \"extra-large\";\n\nexport const ButtonIconSizeMapping: Record<ButtonSize, number> = {\n    \"extra-small\": 20,\n    small: 20,\n    medium: 24,\n    large: 32,\n    \"extra-large\": 40,\n} as const;\n\nexport const IconButtonIconSizeMapping: Record<ButtonSize, number> = {\n    \"extra-small\": 20,\n    small: 24,\n    medium: 24,\n    large: 32,\n    \"extra-large\": 40,\n} as const;\n\nexport const ButtonLabelTextMapping: Record<ButtonSize, string> = {\n    \"extra-small\": typography.labelLarge,\n    small: typography.labelLarge,\n    medium: typography.bodyLargeEmphasized,\n    large: typography.headlineSmall,\n    \"extra-large\": typography.headlineLarge,\n} as const;\n\nexport const buttonSizeConfig = (size: ButtonSize) => {\n    return styles[size];\n};\n\nexport const ButtonSizeBase = styles[\"size\"];\n","@layer adgytec.comps {\n    .button {\n        /* styles */\n        min-inline-size: var(--min-tap-target-size);\n\n        padding-inline: var(--_md-button-padding-inline);\n        padding-block: var(--_md-button-padding-block);\n\n        display: inline-flex;\n        gap: var(--_md-button-icon-label-gap);\n        align-items: center;\n        justify-content: center;\n\n        /* shape styles */\n        border-start-start-radius: var(--_shape-start-start);\n        border-end-start-radius: var(--_shape-end-start);\n        border-start-end-radius: var(--_shape-start-end);\n        border-end-end-radius: var(--_shape-end-end);\n\n        &[data-selected] {\n            --_shape-start-start: var(--_selected-shape);\n            --_shape-end-start: var(--_selected-shape);\n            --_shape-start-end: var(--_selected-shape);\n            --_shape-end-end: var(--_selected-shape);\n        }\n    }\n}\n","import clsx from \"clsx\";\nimport { ToggleButton as AriaToggleButton } from \"react-aria-components\";\nimport { Icon } from \"@/components/Icon\";\nimport { Splash } from \"@/components/Splash/Splash\";\nimport { useSplash } from \"@/components/Splash/useSplash\";\nimport { TapTarget } from \"@/utils/tapTarget\";\nimport {\n    ButtonCore,\n    ButtonIconSizeMapping,\n    ButtonLabelTextMapping,\n    ButtonReset,\n    buttonColorBase,\n    buttonColorConfig,\n} from \"../../core\";\nimport { useConnectedButtonGroupContext } from \"../ButtonGroupContext\";\nimport styles from \"./connectedButton.module.css\";\nimport type { ConnectedButtonProps } from \"./types\";\n\nexport const ConnectedButton: React.FC<ConnectedButtonProps> = ({\n    icon,\n    selectedIcon,\n    children,\n    onPress,\n    iconPlacement,\n    ...props\n}) => {\n    const {\n        shape,\n        size,\n        color,\n        iconPlacement: groupIconPlacement,\n    } = useConnectedButtonGroupContext();\n\n    const buttonIconPlacement = iconPlacement ?? groupIconPlacement ?? \"start\";\n\n    const { splashInfo, handlePress } = useSplash(onPress);\n    const isChildFunc = typeof children === \"function\";\n\n    return (\n        <AriaToggleButton\n            onPress={handlePress}\n            className={clsx(ButtonReset, TapTarget, buttonColorConfig(color))}\n            {...props}\n            data-connected-button={true}\n            data-button\n        >\n            {(renderProps) => {\n                const {\n                    isSelected,\n                    isDisabled,\n                    isFocusVisible,\n                    isFocused,\n                    isPressed,\n                    isHovered,\n                } = renderProps;\n\n                const dataAttrs = {\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-selected\": isSelected || undefined,\n                    \"data-toggle-button\": true,\n                    \"data-shape\": shape,\n                    \"data-visual-button\": true,\n                };\n\n                let iconToRender = icon;\n                if (isSelected && selectedIcon) iconToRender = selectedIcon;\n\n                const iconSize = ButtonIconSizeMapping[size];\n                const iconComp = iconToRender && (\n                    <Icon icon={iconToRender} size={iconSize} />\n                );\n\n                return (\n                    <span\n                        {...dataAttrs}\n                        className={clsx(\n                            ButtonCore,\n                            buttonColorBase,\n                            ButtonLabelTextMapping[size],\n                            styles[\"button\"]\n                        )}\n                    >\n                        {splashInfo && <Splash {...splashInfo} />}\n\n                        {buttonIconPlacement === \"start\" && iconComp}\n\n                        {isChildFunc ? children(renderProps) : children}\n\n                        {buttonIconPlacement === \"end\" && iconComp}\n                    </span>\n                );\n            }}\n        </AriaToggleButton>\n    );\n};\n","import { useButtonGroupContext } from \"../ButtonGroups\";\nimport type { ButtonIconPlacement } from \"./button\";\nimport type { ButtonShape } from \"./shape\";\nimport type { ButtonSize } from \"./sizes\";\n\ntype ButtonConfigOptions<C extends string> = {\n    size?: ButtonSize;\n    shape?: ButtonShape;\n    color?: C;\n    iconPlacement?: ButtonIconPlacement;\n};\n\nexport function useButtonConfig<C extends string>({\n    size,\n    shape,\n    color,\n    iconPlacement,\n}: ButtonConfigOptions<C>) {\n    const {\n        size: buttonGroupSize,\n        shape: buttonGroupShape,\n        color: buttonGroupColor,\n        iconPlacement: buttonGroupIconPlacement,\n    } = useButtonGroupContext();\n\n    const buttonSize = size ?? buttonGroupSize ?? \"small\";\n    const buttonShape = shape ?? buttonGroupShape ?? \"round\";\n    const buttonColor = color ?? buttonGroupColor ?? \"filled\";\n    const buttonIconPlacement =\n        iconPlacement ?? buttonGroupIconPlacement ?? \"start\";\n\n    return { buttonSize, buttonShape, buttonColor, buttonIconPlacement };\n}\n","import type { ReactElement } from \"react\";\nimport { Tooltip, TooltipTrigger } from \"@/components/Tooltip\";\n\nexport const withTooltip = (element: ReactElement, tooltip?: string) => {\n    if (!tooltip) return element;\n\n    return (\n        <TooltipTrigger>\n            {element}\n\n            <Tooltip>{tooltip}</Tooltip>\n        </TooltipTrigger>\n    );\n};\n"],"mappings":";;;;;;;;;;;;;;;GC2Ba,IAAc,EAAO,iBACrB,IAAa,EAAO;AAEjC,SAAgB,EAAuB,EACnC,UACA,SACA,YAKD;CACC,OAAO;EACH,cAAc;EACd,aAAa;EACb,cAAc;CAClB;AACJ;;;;;;;;;GExBa,KAAqB,MACvB,EAAO,IAGL,IAAkB,EAAO;;;;;;;GEdzB,IAAoD;CAC7D,eAAe;CACf,OAAO;CACP,QAAQ;CACR,OAAO;CACP,eAAe;AACnB,GAEa,IAAwD;CACjE,eAAe;CACf,OAAO;CACP,QAAQ;CACR,OAAO;CACP,eAAe;AACnB,GAEa,IAAqD;CAC9D,eAAe,EAAW;CAC1B,OAAO,EAAW;CAClB,QAAQ,EAAW;CACnB,OAAO,EAAW;CAClB,eAAe,EAAW;AAC9B,GAEa,KAAoB,MACtB,EAAO,IAGL,IAAiB,EAAO,kDEpBxB,KAAkD,MAAA;CAAA,IAAA,KAAA,GAAA,EAAA,EAAA,CAAA,EAAA,GAAA,GAAA,GAAA,GAAA,GAAA,GAAA;CAAA,AAAA,EAAA,OAAA,KAO9D,IAAA,EAAA,IAAA,IAAA,EAAA,IAAA,IAAA,EAAA,IAAA,IAAA,EAAA,IAAA,IAAA,EAAA,IAAA,IAAA,EAAA,OAP+D,yEAAA,KAAA,GAO/D,EAAA,KAAA,GAAA,EAAA,KAAA,GAAA,EAAA,KAAA,GAAA,EAAA,KAAA,GAAA,EAAA,KAAA,GAAA,EAAA,KAAA,GAAA,EAAA,KAAA;CACG,IAAA,EAAA,UAAA,SAAA,UAAA,eAAA,MAKI,EAA+B,GAEnC,IAA4B,KAAA,KAAA,SAE5B,EAAA,eAAA,mBAAoC,EAAU,CAAO,GACrD,IAAoB,OAAO,KAAa,YAAW;CAAA,AAAA,EAAA,OAAA,IAKsB,IAAA,EAAA,MAAtD,IAAA,EAAK,GAAa,GAAW,EAAkB,CAAK,CAAC,GAAC,EAAA,KAAA,GAAA,EAAA,KAAA;CAAA,IAAA;CAAA,AAAA,EAAA,OAAA,KAAA,EAAA,QAAA,KAAA,EAAA,QAAA,KAAA,EAAA,QAAA,KAAA,EAAA,QAAA,KAAA,EAAA,QAAA,KAAA,EAAA,QAAA,KAAA,EAAA,QAAA,KAKhE,KAAA,MAAA;EACG,IAAA,EAAA,eAAA,eAAA,mBAAA,cAAA,cAAA,iBAOI,GAEJ,IAAkB;GAAA,gBACE,KAAA,KAAA;GAAsB,iBACrB,KAAA,KAAA;GAAuB,gBACxB,KAAA,KAAA;GAAsB,sBAChB,KAAA,KAAA;GAA2B,gBACjC,KAAA,KAAA;GAAsB,iBACrB,KAAA,KAAA;GAAuB,sBAClB;GAAI,cACZ;GAAK,sBACG;EAC1B,GAEA,IAAmB;EACnB,AAAI,KAAA,MAA4B,IAAe;EAE/C,IAAA,IAAiB,EAAsB,IACvC,IAAiB,KACb,kBAAC,GAAD;GAAYA,MAAA;GAAoBC,MAAA;EAAQ,CAAA;EAC1C,OAGE,kBAAA,QAAA;GAgBO,GAfC;GACO,WAAA,EACP,GACA,GACA,EAAuB,IACvB,EAAM,MACV;aAPJ;IASK,KAAc,kBAAC,GAAD,EAAO,GAAK,EAAU,CAAA;IAEpC,MAAwB,WAAxB;IAEA,IAAc,EAAS,CAAsB,IAA7C;IAEA,MAAwB,SAAxB;GACE;;CAAA,GAEd,EAAA,KAAA,GAAA,EAAA,MAAA,GAAA,EAAA,MAAA,GAAA,EAAA,MAAA,GAAA,EAAA,MAAA,GAAA,EAAA,MAAA,GAAA,EAAA,MAAA,GAAA,EAAA,MAAA,GAAA,EAAA,MAAA,KAAA,IAAA,EAAA;CAAA,IAAA;CACc,OADd,EAAA,QAAA,KAAA,EAAA,QAAA,KAAA,EAAA,QAAA,KAAA,EAAA,QAAA,KAxDL,IAAA,kBAAC,GAAD;EACaC,SAAA;EACE,WAAA;EAAsD,GAC7D;EACmB,yBAAA;EACvB,eAAA;YAEC;CAPY,CAAA,GAyDE,EAAA,MAAA,GAAA,EAAA,MAAA,GAAA,EAAA,MAAA,GAAA,EAAA,MAAA,GAAA,EAAA,MAAA,KAAA,IAAA,EAAA,KAzDnB;AAyDmB;;;ACpF3B,SAAO,EAAA,GAAA;CAAA,IAAA,KAAA,GAAA,EAAA,EAAA,CAAA,CAAA,GAA2C,EAAA,SAAA,UAAA,UAAA,qBAAA,GAM9C,EAAA,MAAA,GAAA,OAAA,GAAA,OAAA,GAAA,eAAA,MAKI,EAAsB,GAE1B,IAAmB,KAAA,KAAA,SACnB,IAAoB,KAAA,KAAA,SACpB,IAAoB,KAAA,KAAA,UACpB,IACI,KAAA,KAAA,SAAqD;CAEW,OAFX,EAAA,OAAA,KAAA,EAAA,OAAA,KAAA,EAAA,OAAA,KAAA,EAAA,OAAA,KAElD,IAAA;EAAA;EAAA;EAAA;EAAA;CAA4D,GAAC,EAAA,KAAA,GAAA,EAAA,KAAA,GAAA,EAAA,KAAA,GAAA,EAAA,KAAA,GAAA,EAAA,KAAA,KAAA,IAAA,EAAA,IAA7D;AAA6D;;;AC5BxE,IAAa,KAAe,GAAuB,MAC1C,IAGD,kBAAC,GAAD,EAAA,UAAA,CACK,GAED,kBAAC,GAAD,EAAA,UAAU,EAAiB,CAAA,CACf,EAAA,CAAA,IAPC"}

package/dist/chunks/core3.map

@@ -1 +1 @@
-{"version":3,"file":"core3","names":[],"sources":["../../src/components/Calendar/core/calendar.module.css","../../src/components/Calendar/core/calendar.ts","../../src/components/Calendar/core/useCalendarState.ts"],"sourcesContent":["/* configurable tokens\n*\n* --md-calendar-background\n* --md-calendar-header-cell-color\n*\n* --md-calendar-cell-color\n* --md-calendar-cell-state-layer-color\n* --md-calendar-cell-today-color\n*\n* --md-calendar-cell-selected-background\n* --md-calendar-selected-color\n*\n* --md-calendar-in-active-range-background\n* --md-calendar-in-active-range-color\n*\n* --md-calendar-menu-divider-color\n* --md-calendar-menu-selected-background\n* --md-calendar-menu-selected-color\n*\n* configurable tokens end */\n\n@layer adgytec.comps {\n    .calendar {\n        --_md-calendar-background: var(\n            --md-calendar-background,\n            var(--md-sys-color-surface-container-high)\n        );\n        --_md-calendar-header-cell-color: var(\n            --md-calendar-header-cell-color,\n            var(--md-sys-color-on-surface)\n        );\n\n        --_md-calendar-cell-color: var(\n            --md-calendar-cell-color,\n            var(--md-sys-color-on-surface)\n        );\n        --_md-calendar-cell-state-layer-color: var(\n            --md-calendar-cell-state-layer-color,\n            var(--md-sys-color-on-surface-variant)\n        );\n        --_md-calendar-cell-today-color: var(\n            --md-calendar-cell-today-color,\n            var(--md-sys-color-primary)\n        );\n\n        --_md-calendar-cell-selected-background: var(\n            --md-calendar-cell-selected-background,\n            var(--md-sys-color-primary)\n        );\n        --_md-calendar-selected-color: var(\n            --md-calendar-selected-color,\n            var(--md-sys-color-on-primary)\n        );\n\n        --_md-calendar-in-active-range-background: var(\n            --md-calendar-in-active-range-background,\n            var(--md-sys-color-secondary-container)\n        );\n        --_md-calendar-in-active-range-color: var(\n            --md-calendar-in-active-range-color,\n            var(--md-sys-color-on-secondary-container)\n        );\n\n        --_md-calendar-menu-divider-color: var(\n            --md-calendar-menu-divider-color,\n            var(--md-sys-color-outline-variant)\n        );\n        --_md-calendar-menu-selected-background: var(\n            --md-calendar-menu-selected-background,\n            var(--md-sys-color-surface-variant)\n        );\n        --_md-calendar-menu-selected-color: var(\n            --md-calendar-menu-selected-color,\n            var(--md-sys-color-on-surface)\n        );\n\n        --_md-calendar-cell-size: clamp(\n            var(--md-sys-layout-space-40),\n            8svi,\n            var(--md-sys-layout-space-48)\n        );\n\n        padding-block-end: var(--md-sys-layout-space-12);\n        padding-block-start: var(--md-sys-layout-space-20);\n\n        background-color: var(--_md-calendar-background);\n        border-radius: var(--md-sys-shape-corner-radius-large);\n\n        display: grid;\n        gap: calc(18 * var(--dp, 1px));\n\n        [data-button] {\n            --md-button-color: var(--_md-calendar-cell-color);\n        }\n    }\n}\n","import styles from \"./calendar.module.css\";\n\nexport const CalendarBaseStyles = styles[\"calendar\"];\n\nexport type WeekdayStyle = \"narrow\" | \"short\";\n\nexport interface MonthItem {\n    id: number;\n    formatted: string;\n}\n\nexport interface YearItem {\n    id: number;\n    formatted: string;\n}\n\nexport const defaultMinYear = 1900;\nexport const defaultMaxYearIncrement = 100;\n","import { useContext } from \"react\";\nimport {\n    type CalendarState,\n    CalendarStateContext,\n    type RangeCalendarState,\n    RangeCalendarStateContext,\n} from \"react-aria-components\";\n\nexport function useCalendarState() {\n    const calendarState = useContext(CalendarStateContext);\n    const rangeCalendarState = useContext(RangeCalendarStateContext);\n    const state = calendarState || rangeCalendarState || null;\n\n    if (!state) {\n        throw Error(\n            \"BaseCalendar used outside Calendar or RangeCalendar component\"\n        );\n    }\n\n    return state;\n}\n\nexport function isRangeCalendarState(\n    state: CalendarState | RangeCalendarState\n): state is RangeCalendarState {\n    return \"anchorDate\" in state;\n}\n"],"mappings":";;;;ACEA,IAAa,IAAqB,iCAAA,EAAO,UAc5B,IAAiB,MACjB,IAA0B;;;ACTvC,SAAgB,IAAmB;CAC/B,IAAM,IAAgB,EAAW,CAAoB,GAC/C,IAAqB,EAAW,CAAyB,GACzD,IAAQ,KAAiB,KAAsB;CAErD,IAAI,CAAC,GACD,MAAM,MACF,+DACJ;CAGJ,OAAO;AACX;AAEA,SAAgB,EACZ,GAC2B;CAC3B,OAAO,gBAAgB;AAC3B"}
+{"version":3,"file":"core3","names":[],"sources":["../../src/components/Calendar/core/calendar.module.css","../../src/components/Calendar/core/calendar.ts","../../src/components/Calendar/core/useCalendarState.ts"],"sourcesContent":["/* configurable tokens\n*\n* --md-calendar-background\n* --md-calendar-header-cell-color\n*\n* --md-calendar-cell-color\n* --md-calendar-cell-state-layer-color\n* --md-calendar-cell-today-color\n*\n* --md-calendar-cell-selected-background\n* --md-calendar-selected-color\n*\n* --md-calendar-in-active-range-background\n* --md-calendar-in-active-range-color\n*\n* --md-calendar-menu-divider-color\n* --md-calendar-menu-selected-background\n* --md-calendar-menu-selected-color\n*\n* configurable tokens end */\n\n@layer adgytec.comps {\n    .calendar {\n        --_md-calendar-background: var(\n            --md-calendar-background,\n            var(--md-sys-color-surface-container-high)\n        );\n        --_md-calendar-header-cell-color: var(\n            --md-calendar-header-cell-color,\n            var(--md-sys-color-on-surface)\n        );\n\n        --_md-calendar-cell-color: var(\n            --md-calendar-cell-color,\n            var(--md-sys-color-on-surface)\n        );\n        --_md-calendar-cell-state-layer-color: var(\n            --md-calendar-cell-state-layer-color,\n            var(--md-sys-color-on-surface-variant)\n        );\n        --_md-calendar-cell-today-color: var(\n            --md-calendar-cell-today-color,\n            var(--md-sys-color-primary)\n        );\n\n        --_md-calendar-cell-selected-background: var(\n            --md-calendar-cell-selected-background,\n            var(--md-sys-color-primary)\n        );\n        --_md-calendar-selected-color: var(\n            --md-calendar-selected-color,\n            var(--md-sys-color-on-primary)\n        );\n\n        --_md-calendar-in-active-range-background: var(\n            --md-calendar-in-active-range-background,\n            var(--md-sys-color-secondary-container)\n        );\n        --_md-calendar-in-active-range-color: var(\n            --md-calendar-in-active-range-color,\n            var(--md-sys-color-on-secondary-container)\n        );\n\n        --_md-calendar-menu-divider-color: var(\n            --md-calendar-menu-divider-color,\n            var(--md-sys-color-outline-variant)\n        );\n        --_md-calendar-menu-selected-background: var(\n            --md-calendar-menu-selected-background,\n            var(--md-sys-color-surface-variant)\n        );\n        --_md-calendar-menu-selected-color: var(\n            --md-calendar-menu-selected-color,\n            var(--md-sys-color-on-surface)\n        );\n\n        --_md-calendar-cell-size: clamp(\n            var(--md-sys-layout-space-40),\n            8svi,\n            var(--md-sys-layout-space-48)\n        );\n\n        padding-block-end: var(--md-sys-layout-space-12);\n        padding-block-start: var(--md-sys-layout-space-20);\n\n        background-color: var(--_md-calendar-background);\n        border-radius: var(--md-sys-shape-corner-radius-large);\n\n        display: grid;\n        gap: calc(18 * var(--dp, 1px));\n\n        [data-button] {\n            --md-button-color: var(--_md-calendar-cell-color);\n        }\n    }\n}\n","import styles from \"./calendar.module.css\";\n\nexport const CalendarBaseStyles = styles[\"calendar\"];\n\nexport type WeekdayStyle = \"narrow\" | \"short\";\n\nexport interface MonthItem {\n    id: number;\n    formatted: string;\n}\n\nexport interface YearItem {\n    id: number;\n    formatted: string;\n}\n\nexport const defaultMinYear = 1900;\nexport const defaultMaxYearIncrement = 100;\n","import { useContext } from \"react\";\nimport {\n    type CalendarState,\n    CalendarStateContext,\n    type RangeCalendarState,\n    RangeCalendarStateContext,\n} from \"react-aria-components\";\n\nexport function useCalendarState() {\n    const calendarState = useContext(CalendarStateContext);\n    const rangeCalendarState = useContext(RangeCalendarStateContext);\n    const state = calendarState || rangeCalendarState || null;\n\n    if (!state) {\n        throw Error(\n            \"BaseCalendar used outside Calendar or RangeCalendar component\"\n        );\n    }\n\n    return state;\n}\n\nexport function isRangeCalendarState(\n    state: CalendarState | RangeCalendarState\n): state is RangeCalendarState {\n    return \"anchorDate\" in state;\n}\n"],"mappings":";;;;ACEA,IAAa,IAAqB,iCAAA,EAAO,UAc5B,IAAiB,MACjB,IAA0B;;;ACTvC,SAAO,IAAA;CACH,IAAA,IAAsB,EAAW,CAAoB,GACrD,IAA2B,EAAW,CAAyB,GAC/D,IAAc,KAAA,KAAA;CAEd,IAAI,CAAC,GACD,MAAM,MACF,+DACJ;CACH,OAEM;AAAK;AAGhB,SAAgB,EACZ,GAC2B;CAC3B,OAAO,gBAAgB;AAC3B"}

package/dist/chunks/core8.map

@@ -1 +1 @@
-{"version":3,"file":"core8","names":[],"sources":["../../src/components/Navigation/core/navigation.module.css","../../src/components/Navigation/core/navigation.ts","../../src/components/Navigation/core/navigationInfo.ts","../../src/components/Navigation/core/navLabelContext.ts"],"sourcesContent":["/* configurable tokens\n*\n* --md-navigation-background\n* --md-navigation-drawer-background\n*\n* configurable tokens end */\n\n@layer adgytec.comps {\n    .navigation {\n        --_md-navigation-background: var(\n            --md-navigation-background,\n            var(--md-sys-color-surface)\n        );\n        --_md-navigation-drawer-background: var(\n            --md-navigation-drawer-background,\n            var(--md-sys-color-surface-container)\n        );\n\n        --_background: var(--_md-navigation-background);\n\n        background-color: var(--_background);\n\n        position: absolute;\n        inset: 0;\n        border-radius: inherit;\n\n        display: grid;\n        grid-template-rows: 1fr;\n        gap: calc(10 * var(--dp, 1px));\n\n        padding-block: var(--md-sys-layout-space-16);\n\n        &[data-modal] {\n            --_background: var(--_md-navigation-drawer-background);\n        }\n\n        &[data-header] {\n            grid-template-rows: auto 1fr;\n        }\n    }\n\n    .navigation[data-sub-nav] {\n        opacity: 0;\n        translate: -100%;\n\n        transition:\n            opacity var(--md-sys-motion-expressive-fast-effects)\n            var(--md-sys-motion-expressive-fast-effects-duration),\n            translate 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        &[data-status=\"entered\"] {\n            opacity: 1;\n            translate: 0;\n        }\n    }\n\n    .nav-header {\n        display: flex;\n        align-items: center;\n\n        gap: var(--md-sys-layout-space-8);\n\n        padding-inline-start: var(--md-sys-layout-space-32);\n        padding-inline-end: var(--md-sys-layout-space-24);\n\n        > [data-close-button] {\n            margin-inline-start: auto;\n        }\n    }\n\n    .sub-nav-header {\n        display: flex;\n        align-items: center;\n\n        gap: var(--md-sys-layout-space-8);\n\n        padding-inline-start: var(--md-sys-layout-space-24);\n        padding-inline-end: var(--md-sys-layout-space-32);\n    }\n}\n","import styles from \"./navigation.module.css\";\n\nexport const NavigationStyles = styles[\"navigation\"];\n\nexport const NavigationHeaderStyles = styles[\"nav-header\"];\nexport const SubNavigationHeaderStyles = styles[\"sub-nav-header\"];\n","import { createContext, useContext } from \"react\";\n\nexport type NavigationInfoContextType = {\n    id: string;\n    depth: number;\n};\n\nexport const NavigationInfoContext =\n    createContext<NavigationInfoContextType | null>(null);\n\nexport function useNavigationInfo() {\n    const ctx = useContext(NavigationInfoContext);\n    if (ctx == null) {\n        throw new Error(\n            \"Missing navigation information. Ensure this component is rendered within a Navigation or SubNavigation component.\"\n        );\n    }\n\n    return ctx;\n}\n","import { createContext, type ReactNode } from \"react\";\n\nexport type NavLabelContextType = ReactNode;\nexport const NavLabelContext = createContext<NavLabelContextType>(undefined);\n"],"mappings":";;;;;GCEa,IAAmB,EAAO,YAE1B,IAAyB,EAAO,eAChC,IAA4B,EAAO,mBCEnC,IACT,EAAgD,IAAI;AAExD,SAAgB,IAAoB;CAChC,IAAM,IAAM,EAAW,CAAqB;CAC5C,IAAI,KAAO,MACP,MAAU,MACN,mHACJ;CAGJ,OAAO;AACX;;;AChBA,IAAa,IAAkB,EAAmC,KAAA,CAAS"}
+{"version":3,"file":"core8","names":[],"sources":["../../src/components/Navigation/core/navigation.module.css","../../src/components/Navigation/core/navigation.ts","../../src/components/Navigation/core/navigationInfo.ts","../../src/components/Navigation/core/navLabelContext.ts"],"sourcesContent":["/* configurable tokens\n*\n* --md-navigation-background\n* --md-navigation-drawer-background\n*\n* configurable tokens end */\n\n@layer adgytec.comps {\n    .navigation {\n        --_md-navigation-background: var(\n            --md-navigation-background,\n            var(--md-sys-color-surface)\n        );\n        --_md-navigation-drawer-background: var(\n            --md-navigation-drawer-background,\n            var(--md-sys-color-surface-container)\n        );\n\n        --_background: var(--_md-navigation-background);\n\n        background-color: var(--_background);\n\n        position: absolute;\n        inset: 0;\n        border-radius: inherit;\n\n        display: grid;\n        grid-template-rows: 1fr;\n        gap: calc(10 * var(--dp, 1px));\n\n        padding-block: var(--md-sys-layout-space-16);\n\n        &[data-modal] {\n            --_background: var(--_md-navigation-drawer-background);\n        }\n\n        &[data-header] {\n            grid-template-rows: auto 1fr;\n        }\n    }\n\n    .navigation[data-sub-nav] {\n        opacity: 0;\n        translate: -100%;\n\n        transition:\n            opacity var(--md-sys-motion-expressive-fast-effects)\n            var(--md-sys-motion-expressive-fast-effects-duration),\n            translate 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        &[data-status=\"entered\"] {\n            opacity: 1;\n            translate: 0;\n        }\n    }\n\n    .nav-header {\n        display: flex;\n        align-items: center;\n\n        gap: var(--md-sys-layout-space-8);\n\n        padding-inline-start: var(--md-sys-layout-space-32);\n        padding-inline-end: var(--md-sys-layout-space-24);\n\n        > [data-close-button] {\n            margin-inline-start: auto;\n        }\n    }\n\n    .sub-nav-header {\n        display: flex;\n        align-items: center;\n\n        gap: var(--md-sys-layout-space-8);\n\n        padding-inline-start: var(--md-sys-layout-space-24);\n        padding-inline-end: var(--md-sys-layout-space-32);\n    }\n}\n","import styles from \"./navigation.module.css\";\n\nexport const NavigationStyles = styles[\"navigation\"];\n\nexport const NavigationHeaderStyles = styles[\"nav-header\"];\nexport const SubNavigationHeaderStyles = styles[\"sub-nav-header\"];\n","import { createContext, useContext } from \"react\";\n\nexport type NavigationInfoContextType = {\n    id: string;\n    depth: number;\n};\n\nexport const NavigationInfoContext =\n    createContext<NavigationInfoContextType | null>(null);\n\nexport function useNavigationInfo() {\n    const ctx = useContext(NavigationInfoContext);\n    if (ctx == null) {\n        throw new Error(\n            \"Missing navigation information. Ensure this component is rendered within a Navigation or SubNavigation component.\"\n        );\n    }\n\n    return ctx;\n}\n","import { createContext, type ReactNode } from \"react\";\n\nexport type NavLabelContextType = ReactNode;\nexport const NavLabelContext = createContext<NavLabelContextType>(undefined);\n"],"mappings":";;;;;GCEa,IAAmB,EAAO,YAE1B,IAAyB,EAAO,eAChC,IAA4B,EAAO,mBCEnC,IACT,EAAgD,IAAI;AAExD,SAAO,IAAA;CACH,IAAA,IAAY,EAAW,CAAqB;CAC5C,IAAI,KAAO,MACP,MAAU,MACN,mHACJ;CACH,OAEM;AAAG;;;ACfd,IAAa,IAAkB,EAAmC,KAAA,CAAS"}

package/dist/chunks/core9.map

@@ -1 +1 @@
-{"version":3,"file":"core9","names":[],"sources":["../../src/components/Navigation/NavigationItem/core/navigationItem.module.css","../../src/components/Navigation/NavigationItem/core/navigationItem.ts"],"sourcesContent":["/* configurable tokens\n*\n* --md-navigation-item-active-background\n*\n* --md-navigation-item-label-color\n* --md-navigation-item-icon-color\n*\n* --md-navigation-item-active-label-color\n* --md-navigation-item-active-icon-color\n*\n* --md-navigation-item-state-layer-color\n*\n* configurable tokens end */\n\n@layer adgytec.comps {\n    .item {\n        --_md-navigation-item-active-background: var(\n            --md-navigation-item-active-background,\n            var(--md-sys-color-secondary-container)\n        );\n\n        --_md-navigation-item-label-color: var(\n            --md-navigation-item-label-color,\n            var(--md-sys-color-on-surface-variant)\n        );\n        --_md-navigation-item-icon-color: var(\n            --md-navigation-item-icon-color,\n            var(--md-sys-color-on-surface-variant)\n        );\n\n        --_md-navigation-item-active-label-color: var(\n            --md-navigation-item-active-label-color,\n            var(--md-sys-color-secondary)\n        );\n        --_md-navigation-item-active-icon-color: var(\n            --md-navigation-item-active-icon-color,\n            var(--md-sys-color-on-secondary-container)\n        );\n\n        --_md-navigation-item-state-layer-color: var(\n            --md-navigation-item-state-layer-color,\n            var(--md-sys-color-on-secondary-container)\n        );\n\n        --_md-navigation-item-padding-block: var(--md-sys-layout-space-16);\n        --_md-navigation-item-padding-inline: var(--md-sys-layout-space-16);\n        --_md-navigation-item-gap: var(--md-sys-layout-space-8);\n\n        --_background: transparent;\n        --_icon-color: var(--_md-navigation-item-icon-color);\n        --_label-color: var(--_md-navigation-item-label-color);\n\n        --_state-color: var(--_md-navigation-item-state-layer-color);\n        --_state-layer-opacity: 0;\n\n        --_state-layer-color: rgb(\n            from var(--_state-color) r g b /\n            var(--_state-layer-opacity)\n        );\n\n        all: unset;\n\n        position: relative;\n\n        background-color: var(--_background);\n        color: var(--_label-color);\n\n        padding-inline: var(--_md-navigation-item-padding-inline);\n        padding-block: var(--_md-navigation-item-padding-block);\n\n        display: flex;\n        align-items: center;\n        gap: var(--_md-navigation-item-gap);\n\n        cursor: pointer;\n        border-radius: var(--md-sys-shape-corner-radius-full);\n\n        &[data-active] {\n            --_background: var(--_md-navigation-item-active-background);\n            --_icon-color: var(--_md-navigation-item-active-icon-color);\n            --_label-color: var(--_md-navigation-item-active-label-color);\n        }\n\n        [data-nav-icon] {\n            color: var(--_icon-color);\n        }\n\n        &[data-disabled] {\n            cursor: default;\n        }\n\n        &[data-hovered] {\n            --_state-layer-opacity: var(--md-sys-state-hover);\n        }\n\n        &[data-focus-visible] {\n            --_state-layer-opacity: var(--md-sys-state-focus);\n        }\n\n        &[data-pressed] {\n            --_state-layer-opacity: var(--md-sys-state-pressed);\n\n            --_background: var(--_md-navigation-item-active-background);\n            --_icon-color: var(--_md-navigation-item-active-icon-color);\n            --_label-color: var(--_md-navigation-item-active-label-color);\n        }\n    }\n\n    /* state layer */\n    .item::before {\n        content: \"\";\n\n        position: absolute;\n        inset: 0;\n        border-radius: inherit;\n\n        background-color: var(--_state-layer-color);\n\n        transition: background-color var(--md-sys-motion-standard-fast-spatial)\n            var(--md-sys-motion-standard-fast-spatial-duration);\n\n        @media (prefers-reduced-motion) {\n            transition: none;\n        }\n    }\n\n    .item[data-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        z-index: 1;\n    }\n}\n","import type { LucideIcon } from \"lucide-react\";\nimport type { ReactNode } from \"react\";\nimport { typography } from \"@/utils\";\nimport styles from \"./navigationItem.module.css\";\n\nexport interface NavigationItemProps {\n    label: ReactNode;\n    icon?: LucideIcon;\n    activeIcon?: LucideIcon;\n    isActive?: boolean;\n}\n\nexport const NavigationItemLabelTypography = typography.titleSmall;\nexport const NavigationItemStyles = styles[\"item\"];\n"],"mappings":";oCCYa,IAAgC,EAAW,YAC3C,IAAuB,EAAO"}
+{"version":3,"file":"core9","names":[],"sources":["../../src/components/Navigation/NavigationItem/core/navigationItem.module.css","../../src/components/Navigation/NavigationItem/core/navigationItem.ts"],"sourcesContent":["/* configurable tokens\n*\n* --md-navigation-item-active-background\n*\n* --md-navigation-item-label-color\n* --md-navigation-item-icon-color\n*\n* --md-navigation-item-active-label-color\n* --md-navigation-item-active-icon-color\n*\n* --md-navigation-item-state-layer-color\n*\n* configurable tokens end */\n\n@layer adgytec.comps {\n    .item {\n        --_md-navigation-item-active-background: var(\n            --md-navigation-item-active-background,\n            var(--md-sys-color-secondary-container)\n        );\n\n        --_md-navigation-item-label-color: var(\n            --md-navigation-item-label-color,\n            var(--md-sys-color-on-surface-variant)\n        );\n        --_md-navigation-item-icon-color: var(\n            --md-navigation-item-icon-color,\n            var(--md-sys-color-on-surface-variant)\n        );\n\n        --_md-navigation-item-active-label-color: var(\n            --md-navigation-item-active-label-color,\n            var(--md-sys-color-secondary)\n        );\n        --_md-navigation-item-active-icon-color: var(\n            --md-navigation-item-active-icon-color,\n            var(--md-sys-color-on-secondary-container)\n        );\n\n        --_md-navigation-item-state-layer-color: var(\n            --md-navigation-item-state-layer-color,\n            var(--md-sys-color-on-secondary-container)\n        );\n\n        --_md-navigation-item-padding-block: var(--md-sys-layout-space-16);\n        --_md-navigation-item-padding-inline: var(--md-sys-layout-space-16);\n        --_md-navigation-item-gap: var(--md-sys-layout-space-8);\n\n        --_background: transparent;\n        --_icon-color: var(--_md-navigation-item-icon-color);\n        --_label-color: var(--_md-navigation-item-label-color);\n\n        --_state-color: var(--_md-navigation-item-state-layer-color);\n        --_state-layer-opacity: 0;\n\n        --_state-layer-color: rgb(\n            from var(--_state-color) r g b /\n            var(--_state-layer-opacity)\n        );\n\n        all: unset;\n\n        position: relative;\n\n        background-color: var(--_background);\n        color: var(--_label-color);\n\n        padding-inline: var(--_md-navigation-item-padding-inline);\n        padding-block: var(--_md-navigation-item-padding-block);\n\n        display: flex;\n        align-items: center;\n        gap: var(--_md-navigation-item-gap);\n\n        cursor: pointer;\n        border-radius: var(--md-sys-shape-corner-radius-full);\n\n        &[data-active] {\n            --_background: var(--_md-navigation-item-active-background);\n            --_icon-color: var(--_md-navigation-item-active-icon-color);\n            --_label-color: var(--_md-navigation-item-active-label-color);\n        }\n\n        [data-nav-icon] {\n            color: var(--_icon-color);\n        }\n\n        &[data-disabled] {\n            cursor: default;\n        }\n\n        &[data-hovered] {\n            --_state-layer-opacity: var(--md-sys-state-hover);\n        }\n\n        &[data-focus-visible] {\n            --_state-layer-opacity: var(--md-sys-state-focus);\n        }\n\n        &[data-pressed] {\n            --_state-layer-opacity: var(--md-sys-state-pressed);\n\n            --_background: var(--_md-navigation-item-active-background);\n            --_icon-color: var(--_md-navigation-item-active-icon-color);\n            --_label-color: var(--_md-navigation-item-active-label-color);\n        }\n    }\n\n    /* state layer */\n    .item::before {\n        content: \"\";\n\n        position: absolute;\n        inset: 0;\n        border-radius: inherit;\n\n        background-color: var(--_state-layer-color);\n\n        transition: background-color var(--md-sys-motion-standard-fast-spatial)\n            var(--md-sys-motion-standard-fast-spatial-duration);\n\n        @media (prefers-reduced-motion) {\n            transition: none;\n        }\n    }\n\n    .item[data-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        z-index: 1;\n    }\n}\n","import type { LucideIcon } from \"lucide-react\";\nimport type { ReactNode } from \"react\";\nimport { typography } from \"@/utils\";\nimport styles from \"./navigationItem.module.css\";\n\nexport interface NavigationItemProps {\n    label: ReactNode;\n    icon?: LucideIcon;\n    activeIcon?: LucideIcon;\n    isActive?: boolean | ((value?: string) => boolean);\n}\n\nexport const NavigationItemLabelTypography = typography.titleSmall;\nexport const NavigationItemStyles = styles[\"item\"];\n"],"mappings":";oCCYa,IAAgC,EAAW,YAC3C,IAAuB,EAAO"}

package/dist/chunks/navContext.map

@@ -1 +1 @@
-{"version":3,"file":"navContext","names":[],"sources":["../../src/components/Navigation/Navigation/navContext.ts"],"sourcesContent":["import { createContext, useContext } from \"react\";\nimport type { IsButtonActive, IsLinkActive } from \"./types\";\n\nexport type NavigationContextType = {\n    isLinkActive?: IsLinkActive;\n    isButtonActive?: IsButtonActive;\n};\n\nexport const NavigationContext = createContext<NavigationContextType | null>(\n    null\n);\n\nexport function useNavigationContext() {\n    const ctx = useContext(NavigationContext);\n    if (ctx === null) {\n        throw new Error(\n            \"Missing navigation state. Ensure this component is rendered within Navigation component.\"\n        );\n    }\n\n    return ctx;\n}\n"],"mappings":";;AAQA,IAAa,IAAoB,EAC7B,IACJ;AAEA,SAAgB,IAAuB;CACnC,IAAM,IAAM,EAAW,CAAiB;CACxC,IAAI,MAAQ,MACR,MAAU,MACN,0FACJ;CAGJ,OAAO;AACX"}
+{"version":3,"file":"navContext","names":[],"sources":["../../src/components/Navigation/Navigation/navContext.ts"],"sourcesContent":["import { createContext, useContext } from \"react\";\nimport type { IsButtonActive, IsLinkActive } from \"./types\";\n\nexport type NavigationContextType = {\n    isLinkActive?: IsLinkActive;\n    isButtonActive?: IsButtonActive;\n};\n\nexport const NavigationContext = createContext<NavigationContextType | null>(\n    null\n);\n\nexport function useNavigationContext() {\n    const ctx = useContext(NavigationContext);\n    if (ctx === null) {\n        throw new Error(\n            \"Missing navigation state. Ensure this component is rendered within Navigation component.\"\n        );\n    }\n\n    return ctx;\n}\n"],"mappings":";;AAQA,IAAa,IAAoB,EAC7B,IACJ;AAEA,SAAO,IAAA;CACH,IAAA,IAAY,EAAW,CAAiB;CACxC,IAAI,MAAQ,MACR,MAAU,MACN,0FACJ;CACH,OAEM;AAAG"}