npm - @adgytec/adgytec-web-ui-components - Versions diffs - 2.3.0 → 2.4.0 - Mend

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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (772) hide show

package/dist/chunks/CalendarCell CHANGED Viewed

@@ -1,43 +1,28 @@
 import { t as e } from "./base";
-import { n as t, t as n } from "./useSplash";
-import { t as r } from "./usePress";
-import i from "clsx";
-import { Fragment as a, jsx as o, jsxs as s } from "react/jsx-runtime";
-import { CalendarCell as c } from "react-aria-components";
-import '../assets/CalendarCell.css';var l = {
-	cell: "_cell_xm3mx_2",
-	"splash-container": "_splash-container_xm3mx_119",
-	"range-indicator": "_range-indicator_xm3mx_155"
-}, u = ({ className: u, isRangeCalendar: d = !1, ...f }) => {
-	let { splashInfo: p, handlePress: m } = n(), { pressProps: h } = r({ onPress: m });
-	return /* @__PURE__ */ o(c, {
-		className: (t) => i(l.cell, e.bodyLarge, typeof u == "function" ? u(t) : u),
-		...h,
-		...f,
-		"data-range-calendar": d || void 0,
-		children: ({ formattedDate: e, isDisabled: n, isOutsideVisibleRange: r, isOutsideMonth: c, isInvalid: u, isSelected: f, isSelectionStart: m, isSelectionEnd: h }) => {
-			let g = d && f && !m && !h;
-			return /* @__PURE__ */ s(a, { children: [
-				!(n || c || r) && p && /* @__PURE__ */ o("span", {
-					className: i(l["splash-container"]),
-					children: /* @__PURE__ */ o(t, { ...p })
-				}),
-				d && /* @__PURE__ */ o("span", {
-					className: i(l["range-indicator"]),
-					"data-in-range": g || void 0,
-					"data-selection-start": m || void 0,
-					"data-selection-end": h || void 0,
-					"data-invalid": u || void 0,
-					"data-disabled": n || void 0,
-					"data-outside-month": c || void 0,
-					"data-outside-visible-range": r || void 0
-				}),
-				e
-			] });
-		}
-	});
-};
-//#endregion
-export { u as t };
+import t from "clsx";
+import { Fragment as n, jsx as r, jsxs as i } from "react/jsx-runtime";
+import { CalendarCell as a } from "react-aria-components";
+import '../assets/CalendarCell.css';var o = {
+	cell: "_cell_22trs_2",
+	"range-indicator": "_range-indicator_22trs_150"
+}, s = ({ className: s, isRangeCalendar: c = !1, ...l }) => /* @__PURE__ */ r(a, {
+	className: (n) => t(o.cell, e.bodyLarge, typeof s == "function" ? s(n) : s),
+	...l,
+	"data-range-calendar": c || void 0,
+	children: ({ formattedDate: e, isDisabled: a, isOutsideVisibleRange: s, isOutsideMonth: l, isInvalid: u, isSelected: d, isSelectionStart: f, isSelectionEnd: p }) => {
+		let m = c && d && !f && !p;
+		return /* @__PURE__ */ i(n, { children: [c && /* @__PURE__ */ r("span", {
+			className: t(o["range-indicator"]),
+			"data-in-range": m || void 0,
+			"data-selection-start": f || void 0,
+			"data-selection-end": p || void 0,
+			"data-invalid": u || void 0,
+			"data-disabled": a || void 0,
+			"data-outside-month": l || void 0,
+			"data-outside-visible-range": s || void 0
+		}), e] });
+	}
+});
+export { s as t };
 //# sourceMappingURL=CalendarCell.map

package/dist/chunks/CalendarCell.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CalendarCell","names":[],"sources":["../../src/components/Calendar/CalendarCell/calendarCell.module.css","../../src/components/Calendar/CalendarCell/CalendarCell.tsx"],"sourcesContent":["@layer adgytec.comps {\n .cell {\n --_state-color: var(--_md-calendar-cell-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 position: relative;\n text-align: center;\n outline: none;\n\n inline-size: var(--_md-calendar-cell-size);\n block-size: var(--_md-calendar-cell-size);\n\n display: flex;\n align-items: center;\n justify-content: center;\n\n z-index: 0;\n\n cursor: pointer;\n color: var(--_md-calendar-cell-color);\n\n transition: color 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-focus-visible] {\n z-index: 1;\n --_state-layer-opacity: var(--md-sys-state-focus);\n }\n\n &[data-hovered] {\n --_state-layer-opacity: var(--md-sys-state-hover);\n }\n\n &[data-pressed] {\n --_state-layer-opacity: var(--md-sys-state-pressed);\n }\n\n &[data-today] {\n color: var(--_md-calendar-cell-today-color);\n --_state-color: currentColor;\n\n &::before {\n border: calc(1 * var(--dp, 1px)) solid currentColor;\n }\n }\n\n &[data-selected],\n &[data-selection-start],\n &[data-selection-end] {\n color: var(--_md-calendar-selected-color);\n --_state-color: currentColor;\n\n &::before {\n border-width: 0;\n background-color: var(--_md-calendar-cell-selected-background);\n }\n }\n\n &[data-unavailable] {\n text-decoration: line-through;\n }\n\n &[data-range-calendar][data-selected] {\n &:not([data-selection-start]):not([data-selection-end]) {\n color: var(--_md-calendar-in-active-range-color);\n\n &::before {\n background-color: transparent;\n }\n }\n }\n\n &[data-disabled],\n &[data-outside-month],\n &[data-outside-visible-range] {\n color: rgb(\n from currentColor r g b /\n var(--md-sys-state-disabled-content)\n );\n cursor: default;\n\n &::before {\n border-width: 0;\n background-color: transparent;\n }\n }\n\n &[data-invalid] {\n color: var(--md-sys-color-on-error);\n --_state-layer: currentColor;\n\n &::before {\n background-color: var(--md-sys-color-error);\n }\n\n &[data-range-calendar]:not([data-selection-start]):not(\n [data-selection-end]\n ) {\n color: var(--md-sys-color-on-error-container,);\n\n &::before {\n background-color: transparent;\n }\n }\n }\n }\n\n .cell::before,\n .cell::after,\n .splash-container {\n z-index: -1;\n content: \"\";\n\n position: absolute;\n inset: var(--md-sys-layout-space-4);\n border-radius: var(--md-sys-shape-corner-radius-full);\n\n transition: background-color\n var(--md-sys-motion-expressive-fast-effects)\n var(--md-sys-motion-expressive-fast-effects-duration);\n\n @media (prefers-reduced-motion) {\n transition: none;\n }\n }\n\n .splash-container {\n overflow: hidden;\n }\n\n .cell::after {\n background-color: var(--_state-layer-color);\n }\n\n .cell[data-focus-visible]::before {\n --focus-indicator-thickness: calc(3 * var(--dp, 1px));\n --focus-indicator-offset: calc(2 * var(--dp, 1px));\n --focus-indicator-color: var(--md-sys-color-secondary);\n\n outline-width: var(--focus-indicator-thickness);\n outline-style: solid;\n outline-offset: var(--focus-indicator-offset);\n outline-color: var(--focus-indicator-color);\n }\n\n .range-indicator {\n --_range-indicator-background: var(\n --_md-calendar-in-active-range-background\n );\n\n z-index: -2;\n position: absolute;\n inset: 0;\n inset-block: var(--md-sys-layout-space-4);\n\n transition: background-color\n var(--md-sys-motion-expressive-fast-effects)\n var(--md-sys-motion-expressive-fast-effects-duration);\n\n @media (prefers-reduced-motion) {\n transition: none;\n }\n\n &[data-invalid] {\n --_range-indicator-background: var(--md-sys-color-error-container);\n }\n\n &[data-in-range] {\n background-color: var(--_range-indicator-background);\n }\n\n &[data-selection-start] {\n inset-inline-start: var(--md-sys-layout-space-4);\n\n border-start-start-radius: var(--md-sys-shape-corner-radius-full);\n border-end-start-radius: var(--md-sys-shape-corner-radius-full);\n\n background-color: var(--_range-indicator-background);\n }\n\n &[data-selection-end] {\n inset-inline-end: var(--md-sys-layout-space-4);\n\n border-start-end-radius: var(--md-sys-shape-corner-radius-full);\n border-end-end-radius: var(--md-sys-shape-corner-radius-full);\n\n background-color: var(--_range-indicator-background);\n }\n\n &[data-disabled],\n &[data-outside-month],\n &[data-outside-visible-range] {\n --_range-indicator-background: transparent;\n }\n }\n}\n","import clsx from \"clsx\";\nimport { usePress } from \"react-aria/usePress\";\nimport { CalendarCell as AriaCalendarCell } from \"react-aria-components\";\nimport { Splash } from \"@/components/Splash/Splash\";\nimport { useSplash } from \"@/components/Splash/useSplash\";\nimport { typography } from \"@/utils\";\nimport styles from \"./calendarCell.module.css\";\n\nexport const CalendarCell: React.FC<\n Omit<React.ComponentPropsWithRef<typeof AriaCalendarCell>, \"children\"> & {\n isRangeCalendar?: boolean;\n }\n> = ({ className, isRangeCalendar = false, ...props }) => {\n const { splashInfo, handlePress } = useSplash();\n const { pressProps } = usePress({ onPress: handlePress });\n\n return (\n <AriaCalendarCell\n className={(renderProps) =>\n clsx(\n styles[\"cell\"],\n typography.bodyLarge,\n typeof className === \"function\"\n ? className(renderProps)\n : className\n )\n }\n {...pressProps}\n {...props}\n data-range-calendar={isRangeCalendar \|\| undefined}\n >\n {({\n formattedDate,\n isDisabled,\n isOutsideVisibleRange,\n isOutsideMonth,\n isInvalid,\n isSelected,\n isSelectionStart,\n isSelectionEnd,\n }) => {\n const inBetweenRange =\n isRangeCalendar &&\n isSelected &&\n !isSelectionStart &&\n !isSelectionEnd;\n\n const disableSplash =\n isDisabled \|\| isOutsideMonth \|\| isOutsideVisibleRange;\n\n return (\n <>\n {!disableSplash && splashInfo && (\n <span className={clsx(styles[\"splash-container\"])}>\n <Splash {...splashInfo} />\n </span>\n )}\n\n {isRangeCalendar && (\n <span\n className={clsx(styles[\"range-indicator\"])}\n data-in-range={inBetweenRange \|\| undefined}\n data-selection-start={\n isSelectionStart \|\| undefined\n }\n data-selection-end={isSelectionEnd \|\| undefined}\n data-invalid={isInvalid \|\| undefined}\n data-disabled={isDisabled \|\| undefined}\n data-outside-month={isOutsideMonth \|\| undefined}\n data-outside-visible-range={\n isOutsideVisibleRange \|\| undefined\n }\n ></span>\n )}\n\n {formattedDate}\n </>\n );\n }}\n </AriaCalendarCell>\n );\n};\n"],"mappings":";;;;;;;;;;GCQa,KAIR,EAAE,cAAW,qBAAkB,IAAO,GAAG,QAAY;CACtD,IAAM,EAAE,eAAY,mBAAgB,EAAU,GACxC,EAAE,kBAAe,EAAS,EAAE,SAAS,EAAY,CAAC;CAExD,OACI,kBAAC,GAAD;EACI,YAAY,MACR,EACI,EAAO,MACP,EAAW,WACX,OAAO,KAAc,aACf,EAAU,CAAW,IACrB,CACV;EAEJ,GAAI;EACJ,GAAI;EACJ,uBAAqB,KAAmB,KAAA;aAEtC,EACE,kBACA,eACA,0BACA,mBACA,cACA,eACA,qBACA,wBACE;GACF,IAAM,IACF,KACA,KACA,CAAC,KACD,CAAC;GAKL,OACI,kBAAA,GAAA,EAAA,UAAA;IACK,EAJL,KAAc,KAAkB,MAIT,KACf,kBAAC,QAAD;KAAM,WAAW,EAAK,EAAO,mBAAmB;eAC5C,kBAAC,GAAD,EAAQ,GAAI,EAAW,CAAA;IACrB,CAAA;IAGT,KACG,kBAAC,QAAD;KACI,WAAW,EAAK,EAAO,kBAAkB;KACzC,iBAAe,KAAkB,KAAA;KACjC,wBACI,KAAoB,KAAA;KAExB,sBAAoB,KAAkB,KAAA;KACtC,gBAAc,KAAa,KAAA;KAC3B,iBAAe,KAAc,KAAA;KAC7B,sBAAoB,KAAkB,KAAA;KACtC,8BACI,KAAyB,KAAA;IAE1B,CAAA;IAGV;GACL,EAAA,CAAA;EAER;CACc,CAAA;AAE1B"}
1	+ {"version":3,"file":"CalendarCell","names":["CalendarCell","AriaCalendarCell","clsx","styles","_Fragment","typography","clsx$1","calendarCell_module_default","CalendarCell$1","props","CalendarCell","\"cell\"","className","renderProps","isRangeCalendar","inBetweenRange","isSelected","isSelectionStart","isSelectionEnd","Fragment","isInvalid","isDisabled","isOutsideMonth","isOutsideVisibleRange","formattedDate"],"sources":["../../src/components/Calendar/CalendarCell/calendarCell.module.css","../../src/components/Calendar/CalendarCell/CalendarCell.tsx"],"sourcesContent":["@layer adgytec.comps {\n .cell {\n --_state-color: var(--_md-calendar-cell-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 position: relative;\n text-align: center;\n outline: none;\n\n inline-size: var(--_md-calendar-cell-size);\n block-size: var(--_md-calendar-cell-size);\n\n display: flex;\n align-items: center;\n justify-content: center;\n\n z-index: 0;\n\n cursor: pointer;\n color: var(--_md-calendar-cell-color);\n\n transition: color 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-focus-visible] {\n z-index: 1;\n --_state-layer-opacity: var(--md-sys-state-focus);\n }\n\n &[data-hovered] {\n --_state-layer-opacity: var(--md-sys-state-hover);\n }\n\n &[data-pressed] {\n --_state-layer-opacity: var(--md-sys-state-pressed);\n }\n\n &[data-today] {\n color: var(--_md-calendar-cell-today-color);\n --_state-color: currentColor;\n\n &::before {\n border: calc(1 * var(--dp, 1px)) solid currentColor;\n }\n }\n\n &[data-selected],\n &[data-selection-start],\n &[data-selection-end] {\n color: var(--_md-calendar-selected-color);\n --_state-color: currentColor;\n\n &::before {\n border-width: 0;\n background-color: var(--_md-calendar-cell-selected-background);\n }\n }\n\n &[data-unavailable] {\n text-decoration: line-through;\n }\n\n &[data-range-calendar][data-selected] {\n &:not([data-selection-start]):not([data-selection-end]) {\n color: var(--_md-calendar-in-active-range-color);\n\n &::before {\n background-color: transparent;\n }\n }\n }\n\n &[data-disabled],\n &[data-outside-month],\n &[data-outside-visible-range] {\n color: rgb(\n from currentColor r g b /\n var(--md-sys-state-disabled-content)\n );\n cursor: default;\n\n &::before {\n border-width: 0;\n background-color: transparent;\n }\n }\n\n &[data-invalid] {\n color: var(--md-sys-color-on-error);\n --_state-layer: currentColor;\n\n &::before {\n background-color: var(--md-sys-color-error);\n }\n\n &[data-range-calendar]:not([data-selection-start]):not(\n [data-selection-end]\n ) {\n color: var(--md-sys-color-on-error-container);\n\n &::before {\n background-color: transparent;\n }\n }\n }\n }\n\n .cell::before,\n .cell::after {\n z-index: -1;\n content: \"\";\n\n position: absolute;\n inset: var(--md-sys-layout-space-4);\n border-radius: var(--md-sys-shape-corner-radius-full);\n\n transition: background-color\n var(--md-sys-motion-expressive-fast-effects)\n var(--md-sys-motion-expressive-fast-effects-duration);\n\n @media (prefers-reduced-motion) {\n transition: none;\n }\n }\n\n .cell::after {\n background-color: var(--_state-layer-color);\n }\n\n .cell[data-focus-visible]::before {\n --focus-indicator-thickness: calc(3 * var(--dp, 1px));\n --focus-indicator-offset: calc(2 * var(--dp, 1px));\n --focus-indicator-color: var(--md-sys-color-secondary);\n\n outline-width: var(--focus-indicator-thickness);\n outline-style: solid;\n outline-offset: var(--focus-indicator-offset);\n outline-color: var(--focus-indicator-color);\n }\n\n .range-indicator {\n --_range-indicator-background: var(\n --_md-calendar-in-active-range-background\n );\n\n z-index: -2;\n position: absolute;\n inset: 0;\n inset-block: var(--md-sys-layout-space-4);\n\n transition: background-color\n var(--md-sys-motion-expressive-fast-effects)\n var(--md-sys-motion-expressive-fast-effects-duration);\n\n @media (prefers-reduced-motion) {\n transition: none;\n }\n\n &[data-invalid] {\n --_range-indicator-background: var(--md-sys-color-error-container);\n }\n\n &[data-in-range] {\n background-color: var(--_range-indicator-background);\n }\n\n &[data-selection-start] {\n inset-inline-start: var(--md-sys-layout-space-4);\n\n border-start-start-radius: var(--md-sys-shape-corner-radius-full);\n border-end-start-radius: var(--md-sys-shape-corner-radius-full);\n\n background-color: var(--_range-indicator-background);\n }\n\n &[data-selection-end] {\n inset-inline-end: var(--md-sys-layout-space-4);\n\n border-start-end-radius: var(--md-sys-shape-corner-radius-full);\n border-end-end-radius: var(--md-sys-shape-corner-radius-full);\n\n background-color: var(--_range-indicator-background);\n }\n\n &[data-disabled],\n &[data-outside-month],\n &[data-outside-visible-range] {\n --_range-indicator-background: transparent;\n }\n }\n}\n","import clsx from \"clsx\";\nimport { CalendarCell as AriaCalendarCell } from \"react-aria-components\";\nimport { typography } from \"@/utils\";\nimport styles from \"./calendarCell.module.css\";\n\n/*\n Props for the {@link CalendarCell} component.\n * Extends React Aria's `CalendarCell` props (excluding `children`).\n /\nexport interface CalendarCellProps\n extends Omit<\n React.ComponentPropsWithRef<typeof AriaCalendarCell>,\n \"children\"\n > {\n /* Whether the cell is being rendered within a range calendar. /\n isRangeCalendar?: boolean;\n}\n\n/\n An individual date cell within the calendar grid.\n \n Handles day number rendering, selection indicators, range highlight backgrounds\n * (selection start, in-between range, selection end), and disabled and outside-month styling.\n */\nexport const CalendarCell: React.FC<CalendarCellProps> = ({\n className,\n isRangeCalendar = false,\n ...props\n}) => {\n return (\n <AriaCalendarCell\n className={(renderProps) =>\n clsx(\n styles[\"cell\"],\n typography.bodyLarge,\n typeof className === \"function\"\n ? className(renderProps)\n : className\n )\n }\n {...props}\n data-range-calendar={isRangeCalendar \|\| undefined}\n >\n {({\n formattedDate,\n isDisabled,\n isOutsideVisibleRange,\n isOutsideMonth,\n isInvalid,\n isSelected,\n isSelectionStart,\n isSelectionEnd,\n }) => {\n const inBetweenRange =\n isRangeCalendar &&\n isSelected &&\n !isSelectionStart &&\n !isSelectionEnd;\n\n return (\n <>\n {isRangeCalendar && (\n <span\n className={clsx(styles[\"range-indicator\"])}\n data-in-range={inBetweenRange \|\| undefined}\n data-selection-start={\n isSelectionStart \|\| undefined\n }\n data-selection-end={isSelectionEnd \|\| undefined}\n data-invalid={isInvalid \|\| undefined}\n data-disabled={isDisabled \|\| undefined}\n data-outside-month={isOutsideMonth \|\| undefined}\n data-outside-visible-range={\n isOutsideVisibleRange \|\| undefined\n }\n ></span>\n )}\n\n {formattedDate}\n </>\n );\n }}\n </AriaCalendarCell>\n );\n};\n"],"mappings":";;;;;;;A,GCwBaA,KAA6C,EACtD,cACA,qBAAkB,IAClB,GAAGS,QAGC,kBAACR,GAAD;CACI,YAAY,MACRC,EACIC,EAAOQ,MACPN,EAAW,WACX,OAAOO,KAAc,aACfA,EAAUC,CAAW,IACrBD,CACV;CAEJ,GAAIH;CACJ,uBAAqBK,KAAmB,KAAA;CAEtC,WAAA,EACE,kBACA,eACA,0BACA,mBACA,cACA,eACA,qBACA,wBACE;EACF,IAAMC,IACFD,KACAE,KACA,CAACC,KACD,CAACC;EAEL,OACI,kBAAAd,GAAA,EAAA,UAAA,CACKU,KACG,kBAAC,QAAD;GACI,WAAWZ,EAAKC,EAAO,kBAAkB;GACzC,iBAAeY,KAAkB,KAAA;GACjC,wBACIE,KAAoB,KAAA;GAExB,sBAAoBC,KAAkB,KAAA;GACtC,gBAAcE,KAAa,KAAA;GAC3B,iBAAeC,KAAc,KAAA;GAC7B,sBAAoBC,KAAkB,KAAA;GACtC,8BACIC,KAAyB,KAAA;EAE1B,CAAA,GAGVC,CACL,EAAA,CAAA;CAER;AACc,CAAA"}

package/dist/chunks/CalendarGrid CHANGED Viewed

@@ -4,7 +4,7 @@ import { t as n } from "./CalendarCell";
 import r from "clsx";
 import { jsx as i, jsxs as a } from "react/jsx-runtime";
 import { CalendarGrid as o, CalendarGridBody as s, CalendarGridHeader as c, CalendarHeaderCell as l } from "react-aria-components";
-import '../assets/CalendarGrid.css';//#region src/components/Calendar/CalendarGrid/calendarGrid.module.css
+import '../assets/CalendarGrid.css';// src/components/Calendar/CalendarGrid/calendarGrid.module.css
 var u = e(), d = {
 	grid: "_grid_1uey9_2",
 	header: "_header_1uey9_7",
@@ -42,7 +42,6 @@ function p(e) {
 		children: e
 	});
 }
-//#endregion
 export { f as t };
 //# sourceMappingURL=CalendarGrid.map

package/dist/chunks/CalendarGrid.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CalendarGrid","names":["isRangeCalendar","date","day"],"sources":["../../src/components/Calendar/CalendarGrid/calendarGrid.module.css","../../src/components/Calendar/CalendarGrid/CalendarGrid.tsx"],"sourcesContent":["@layer adgytec.comps {\n .grid {\n padding-inline: var(--md-sys-layout-space-12);\n border-spacing: 0;\n }\n\n .header {\n color: var(--_md-calendar-header-cell-color);\n }\n\n .header::after {\n content: \"\";\n display: block;\n block-size: var(--md-sys-layout-space-4);\n }\n\n .header-cell {\n inline-size: var(--_md-calendar-cell-size);\n block-size: var(--_md-calendar-cell-size);\n }\n}\n","import clsx from \"clsx\";\nimport {\n CalendarGrid as AriaCalendarGrid,\n CalendarGridBody,\n CalendarGridHeader,\n CalendarHeaderCell,\n} from \"react-aria-components\";\nimport { typography } from \"@/utils\";\nimport { CalendarCell } from \"../CalendarCell\";\nimport styles from \"./calendarGrid.module.css\";\n\~~nexport~~ ~~const~~ CalendarGrid: React~~.FC<\~~n Omit<\n React.ComponentPropsWithRef<typeof AriaCalendarGrid>,\n \"children\" \| \"className\"\n > & { isRangeCalendar?: boolean }\n> = ({ isRangeCalendar, ...props }) => {\n return (\n <AriaCalendarGrid {...props} className={clsx(styles[\"grid\"])}>\n <CalendarGridHeader className={clsx(styles[\"header\"])}>\n {(day) => (\n <CalendarHeaderCell\n className={clsx(\n styles[\"header-cell\"],\n typography.bodyLarge\n )}\n >\n {day}\n </CalendarHeaderCell>\n )}\n </CalendarGridHeader>\n\n <CalendarGridBody className={clsx(styles[\"body\"])}>\n {(date) => (\n <CalendarCell\n isRangeCalendar={isRangeCalendar}\n date={date}\n />\n )}\n </CalendarGridBody>\n </AriaCalendarGrid>\n );\n};\n"],"mappings":";;;;;;;;;;;~~GCWa~~,~~KAKT~~,MAAA;CAAA,~~IAAA~~,KAAA,~~GAAA~~,~~EAAA~~,~~EAAA~~,CAAA,EAAA,~~GAAA~~,~~GAAA~~;CAAA,~~AAAA~~,EAAA,~~OAAA~~,~~KAA8B~~,~~IAAA~~,EAAA,IAAA,~~IAAA~~,EAAA,~~OAA7B~~,~~wBAAA~~,~~KAAA~~,~~GAA6B~~,EAAA,~~KAAA~~,GAAA,EAAA,~~KAAA~~,GAAA,EAAA,~~KAAA~~;CAAA,~~IAAA~~;CAAA,~~AAAA~~,EAAA,OAAA,OAAA,IAAA,2BAAA,~~KAEc~~,~~IAAA~~,~~EAAK~~,EAAM,IAAQ,GAAC,EAAA,~~KAAA~~,KAAA,~~IAAA~~,EAAA;CAAA,~~IAAA~~;CAAA,~~AAAA~~,EAAA,OAAA,OAAA,IAAA,2BAAA,KACxD,IAAA,~~kBAAC~~,GAAD;EAA+B,~~WAAA~~,~~EAAK~~,EAAM,MAAU;~~YAC~~/C;CADc,CAAA,GAWE,EAAA,~~KAAA~~,KAAA,~~IAAA~~,EAAA;CAAA,~~IAAA~~;CAAA,~~AAAA~~,EAAA,OAAA,OAAA,IAAA,2BAAA,KAEQ,~~IAAA~~,~~EAAK~~,EAAM,IAAQ,GAAC,EAAA,~~KAAA~~,KAAA,~~IAAA~~,EAAA;CAAA,~~IAAA~~;CAAA,~~AAAA~~,EAAA,~~OAAA~~,IAO9B,~~IAAA~~,EAAA,MAPnB,IAAA,~~kBAAC~~,GAAD;EAA6B,~~WAAA~~;~~aACxB~~,MACG,~~kBAAC~~,GAAD;GACqB;GACX;EAAI,CAAA;CAJL,CAAA,GAOE,EAAA,~~KAAA~~,GAAA,EAAA,~~KAAA~~;CAAA,~~IAAA~~;CACJ,~~OADI~~,EAAA,~~OAAA~~,~~KAAA~~,EAAA,~~OAAA~~,KArBvB,IAAA,~~kBAAC~~,GAAD;EAAiB,~~GAAK~~;EAAkB,~~WAAA~~;~~YAAxC~~,~~CACI~~,~~GAaA~~,CAda;~~KAsBE~~,EAAA,~~KAAA~~,GAAA,EAAA,~~KAAA~~,GAAA,EAAA,~~MAAA~~,KAAA,~~IAAA~~,EAAA,~~KAtBnB~~;AAsBmB;~~AAxBvB~~,~~SAAA~~,EAAA,GAAA;CAAA,~~OAKgB~~,~~kBAAC~~,GAAD;EACe,~~WAAA~~,~~EACP~~,EAAO,~~gBACP~~,EAAU,SACd;~~YAEC~~;CANc,CAAA;AAOE"}
1	+ {"version":3,"file":"CalendarGrid","names":["isRangeCalendar","date","day","CalendarGrid","_c","clsx","styles","CalendarCell","AriaCalendarGrid","require_compiler_runtime","CalendarCell$1","clsx$1","import_compiler_runtime","calendarGrid_module_default","CalendarGrid$1","$","isRangeCalendar","props","t0","t1","t2","CalendarGridHeader","_temp","t3","t4","CalendarGridBody","t5","CalendarGrid","CalendarHeaderCell","typography","day"],"sources":["../../src/components/Calendar/CalendarGrid/calendarGrid.module.css","../../src/components/Calendar/CalendarGrid/CalendarGrid.tsx"],"sourcesContent":["@layer adgytec.comps {\n .grid {\n padding-inline: var(--md-sys-layout-space-12);\n border-spacing: 0;\n }\n\n .header {\n color: var(--_md-calendar-header-cell-color);\n }\n\n .header::after {\n content: \"\";\n display: block;\n block-size: var(--md-sys-layout-space-4);\n }\n\n .header-cell {\n inline-size: var(--_md-calendar-cell-size);\n block-size: var(--_md-calendar-cell-size);\n }\n}\n","import clsx from \"clsx\";\nimport {\n CalendarGrid as AriaCalendarGrid,\n CalendarGridBody,\n CalendarGridHeader,\n CalendarHeaderCell,\n} from \"react-aria-components\";\nimport { typography } from \"@/utils\";\nimport { CalendarCell } from \"../CalendarCell\";\nimport styles from \"./calendarGrid.module.css\";\n\n/*\n Props for the {@link CalendarGrid} component.\n * Extends React Aria's `CalendarGrid` props (excluding `children` and `className`).\n /\nexport interface CalendarGridProps\n extends Omit<\n React.ComponentPropsWithRef<typeof AriaCalendarGrid>,\n \"children\" \| \"className\"\n > {\n /* Whether the calendar is operating in range selection mode. /\n isRangeCalendar?: boolean;\n}\n\n/\n Renders the 7-column calendar date grid, including weekday column headers\n * and day date cells.\n */\nexport const CalendarGrid: React.FC<CalendarGridProps> = ({\n isRangeCalendar,\n ...props\n}) => {\n return (\n <AriaCalendarGrid {...props} className={clsx(styles[\"grid\"])}>\n <CalendarGridHeader className={clsx(styles[\"header\"])}>\n {(day) => (\n <CalendarHeaderCell\n className={clsx(\n styles[\"header-cell\"],\n typography.bodyLarge\n )}\n >\n {day}\n </CalendarHeaderCell>\n )}\n </CalendarGridHeader>\n\n <CalendarGridBody className={clsx(styles[\"body\"])}>\n {(date) => (\n <CalendarCell\n isRangeCalendar={isRangeCalendar}\n date={date}\n />\n )}\n </CalendarGridBody>\n </AriaCalendarGrid>\n );\n};\n"],"mappings":";;;;;;;;;;;A,GC4BaG,KAA4C,MAAA;CAAA,IAAAY,KAAA,GAAAX,EAAAA,EAAAA,CAAA,EAAA,GAAAY,GAAAC;CAAA,AAAAF,EAAA,OAAAG,KAGxD,IAAAH,EAAA,IAAA,IAAAA,EAAA,OAHyD,qBAAA,GAAAE,KAAAC,GAGzD,EAAA,KAAAA,GAAA,EAAA,KAAAF,GAAA,EAAA,KAAAC;CAAA,IAAAE;CAAA,AAAAJ,EAAA,OAAA,OAAA,IAAA,2BAAA,KAE+C,IAAAV,EAAKC,EAAM,IAAQ,GAAC,EAAA,KAAAa,KAAA,IAAAJ,EAAA;CAAA,IAAAK;CAAA,AAAAL,EAAA,OAAA,OAAA,IAAA,2BAAA,KACxD,IAAA,kBAACM,GAAD;EAA+B,WAAAhB,EAAKC,EAAM,MAAU;EAC/C,UAAAgB;CADc,CAAA,GAWE,EAAA,KAAAF,KAAA,IAAAL,EAAA;CAAA,IAAAQ;CAAA,AAAAR,EAAA,OAAA,OAAA,IAAA,2BAAA,KAEQ,IAAAV,EAAKC,EAAM,IAAQ,GAAC,EAAA,KAAAiB,KAAA,IAAAR,EAAA;CAAA,IAAAS;CAAA,AAAAT,EAAA,OAAAC,IAO9B,IAAAD,EAAA,MAPnB,IAAA,kBAACU,GAAD;EAA6B,WAAAF;EACxB,WAAA,MACG,kBAAChB,GAAD;GACqB;GACX;EAAI,CAAA;CAJL,CAAA,GAOE,EAAA,KAAAS,GAAA,EAAA,KAAAQ;CAAA,IAAAE;CACJ,OADIX,EAAA,OAAAE,KAAAF,EAAA,OAAAS,KArBvB,IAAA,kBAAChB,GAAD;EAAiB,GAAKS;EAAkB,WAAAE;EAAxC,UAAA,CACIC,GAaAI,CAda;C,IAsBE,EAAA,KAAAP,GAAA,EAAA,KAAAO,GAAA,EAAA,MAAAE,KAAA,IAAAX,EAAA,KAtBnBW;AAsBmB;AA3B8B,SAAAJ,EAAA,GAAA;CAAA,OAQrC,kBAACM,GAAD;EACe,WAAAvB,EACPC,EAAO,gBACPuB,EAAU,SACd;EAEC,UAAAC;CANc,CAAA;AAOE"}

package/dist/chunks/CalendarMenuItem CHANGED Viewed

@@ -3,8 +3,8 @@ import { t } from "./base";
 import n from "clsx";
 import { jsx as r } from "react/jsx-runtime";
 import { ListBoxItem as i } from "react-aria-components";
-import '../assets/CalendarMenuItem.css';//#region src/components/Calendar/CalendarMenuItem/calendarMenuItem.module.css
-var a = e(), o = { item: "_item_tzerc_2" }, s = (e) => {
+import '../assets/CalendarMenuItem.css';// src/components/Calendar/CalendarMenuItem/calendarMenuItem.module.css
+var a = e(), o = { item: "_item_1fsu9_2" }, s = (e) => {
 	let s = (0, a.c)(8), c, l;
 	s[0] === e ? (c = s[1], l = s[2]) : ({className: c, ...l} = e, s[0] = e, s[1] = c, s[2] = l);
 	let u;
@@ -15,7 +15,6 @@ var a = e(), o = { item: "_item_tzerc_2" }, s = (e) => {
 		...l
 	}), s[5] = l, s[6] = u, s[7] = d) : d = s[7], d;
 };
-//#endregion
 export { s as t };
 //# sourceMappingURL=CalendarMenuItem.map

package/dist/chunks/CalendarMenuItem.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CalendarMenuItem","names":[],"sources":["../../src/components/Calendar/CalendarMenuItem/calendarMenuItem.module.css","../../src/components/Calendar/CalendarMenuItem/CalendarMenuItem.tsx"],"sourcesContent":["@layer adgytec.comps {\n .item {\n --_state-color: var(--_md-calendar-cell-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 padding-block: var(--md-sys-layout-space-12);\n padding-inline-start: calc(52 * var(--dp, 1px));\n margin-inline-end: var(--md-sys-layout-space-12);\n\n color: var(--_md-calendar-cell-color);\n\n position: relative;\n\n cursor: pointer;\n\n border-end-end-radius: var(--md-sys-shape-corner-radius-extra-small);\n border-start-end-radius: var(--md-sys-shape-corner-radius-extra-small);\n outline: none;\n\n [data-selected-icon] {\n position: absolute;\n\n inset-inline-start: var(--md-sys-layout-space-12);\n inset-block-start: 50%;\n translate: 0 -50%;\n }\n\n &[data-selected] {\n color: var(--_md-calendar-menu-selected-color);\n background-color: var(--_md-calendar-menu-selected-background);\n }\n\n &[data-focus-visible] {\n z-index: 1;\n --_state-layer-opacity: var(--md-sys-state-focus);\n }\n\n &[data-hovered] {\n --_state-layer-opacity: var(--md-sys-state-hover);\n }\n\n &[data-pressed] {\n --_state-layer-opacity: var(--md-sys-state-pressed);\n }\n\n &[data-disabled] {\n color: rgb(\n from currentColor r g b /\n var(--md-sys-state-disabled-content)\n );\n cursor: default;\n }\n }\n\n .item::before,\n .item::after {\n content: \"\";\n\n position: absolute;\n inset: 0;\n border-radius: inherit;\n\n transition: background-color\n var(--md-sys-motion-expressive-fast-effects)\n var(--md-sys-motion-expressive-fast-effects-duration);\n\n @media (prefers-reduced-motion) {\n transition: none;\n }\n }\n\n .item::after {\n background-color: var(--_state-layer-color);\n }\n\n .item[data-focus-visible]::before {\n --focus-indicator-thickness: calc(3 * var(--dp, 1px));\n --focus-indicator-offset: calc(1 * var(--dp, 1px));\n --focus-indicator-color: var(--md-sys-color-secondary);\n\n outline-width: var(--focus-indicator-thickness);\n outline-style: solid;\n outline-offset: var(--focus-indicator-offset);\n outline-color: var(--focus-indicator-color);\n }\n}\n","import clsx from \"clsx\";\nimport { ListBoxItem } from \"react-aria-components\";\nimport { typography } from \"@/utils\";\nimport styles from \"./calendarMenuItem.module.css\";\n\~~nexport~~ ~~const~~ CalendarMenuItem: React~~.FC<\~~n React.ComponentPropsWithRef<typeof ListBoxItem>\n> = ({ className, ...props }) => {\n return (\n <ListBoxItem\n className={(renderProps) =>\n clsx(\n styles[\"item\"],\n typography.bodyLarge,\n typeof className === \"function\"\n ? className(renderProps)\n : className\n )\n }\n {...props}\n />\n );\n};\n"],"mappings":";;;;;;~~4CCKa~~,~~KAET~~,MAAA;CAAA,~~IAAA~~,KAAA,~~GAAA~~,~~EAAA~~,~~EAAA~~,CAAA,CAAA,~~GAAA~~,~~GAAA~~;CAAA,~~AAAA~~,EAAA,~~OAAA~~,~~KAAwB~~,~~IAAA~~,EAAA,IAAA,~~IAAA~~,EAAA,~~OAAvB~~,~~kBAAA~~,~~KAAA~~,~~GAAuB~~,EAAA,~~KAAA~~,GAAA,EAAA,~~KAAA~~,GAAA,EAAA,~~KAAA~~;CAAA,~~IAAA~~;CAAA,~~AAAA~~,EAAA,~~OAAA~~,~~IAUX~~,~~IAAA~~,EAAA,MAPM,KAAA,~~MACP~~,~~EACI~~,EAAM,~~MACN~~,EAAU,WACV,~~OAAO~~,KAAc,~~aACf~~,~~EAAU~~,CACF,~~IAFd~~,CAGJ,GAAC,EAAA,~~KAAA~~,GAAA,EAAA,~~KAAA~~;CAAA,~~IAAA~~;CAGP,~~OAHO~~,EAAA,~~OAAA~~,~~KAAA~~,EAAA,~~OAAA~~,KART,IAAA,~~kBAAC~~,GAAD;EACe,~~WAAA~~;EAON,~~GAED~~;CAAK,CAAA,GACX,EAAA,~~KAAA~~,GAAA,EAAA,~~KAAA~~,GAAA,EAAA,~~KAAA~~,KAAA,~~IAAA~~,EAAA,~~IAXF~~;AAWE"}
1	+ {"version":3,"file":"CalendarMenuItem","names":["_c","clsx","styles","require_compiler_runtime","clsx$1","import_compiler_runtime","calendarMenuItem_module_default","CalendarMenuItem","$","className","props","t0","t1","typography","renderProps","t2","ListBoxItem"],"sources":["../../src/components/Calendar/CalendarMenuItem/calendarMenuItem.module.css","../../src/components/Calendar/CalendarMenuItem/CalendarMenuItem.tsx"],"sourcesContent":["@layer adgytec.comps {\n .item {\n --_state-color: var(--_md-calendar-cell-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 padding-block: var(--md-sys-layout-space-12);\n padding-inline-start: calc(52 * var(--dp, 1px));\n margin-inline-end: var(--md-sys-layout-space-12);\n\n color: var(--_md-calendar-cell-color);\n\n position: relative;\n\n cursor: pointer;\n\n border-end-end-radius: var(--md-sys-shape-corner-radius-extra-small);\n border-start-end-radius: var(--md-sys-shape-corner-radius-extra-small);\n outline: none;\n\n [data-selected-icon] {\n position: absolute;\n\n inset-inline-start: var(--md-sys-layout-space-12);\n inset-block-start: 50%;\n translate: 0 -50%;\n }\n\n &[data-selected] {\n color: var(--_md-calendar-menu-selected-color);\n background-color: var(--_md-calendar-menu-selected-background);\n }\n\n &[data-focus-visible] {\n z-index: 1;\n --_state-layer-opacity: var(--md-sys-state-focus);\n }\n\n &[data-hovered] {\n --_state-layer-opacity: var(--md-sys-state-hover);\n }\n\n &[data-pressed] {\n --_state-layer-opacity: var(--md-sys-state-pressed);\n }\n\n &[data-disabled] {\n color: rgb(\n from currentColor r g b /\n var(--md-sys-state-disabled-content)\n );\n cursor: default;\n }\n }\n\n .item::before,\n .item::after {\n content: \"\";\n\n position: absolute;\n inset: 0;\n border-radius: inherit;\n\n transition: background-color\n var(--md-sys-motion-expressive-fast-effects)\n var(--md-sys-motion-expressive-fast-effects-duration);\n\n @media (prefers-reduced-motion) {\n transition: none;\n }\n }\n\n .item::after {\n background-color: var(--_state-layer-color);\n }\n\n .item[data-focus-visible]::before {\n --focus-indicator-thickness: calc(3 * var(--dp, 1px));\n --focus-indicator-offset: calc(1 * var(--dp, 1px));\n --focus-indicator-color: var(--md-sys-color-secondary);\n\n outline-width: var(--focus-indicator-thickness);\n outline-style: solid;\n outline-offset: var(--focus-indicator-offset);\n outline-color: var(--focus-indicator-color);\n }\n}\n","import clsx from \"clsx\";\nimport { ListBoxItem } from \"react-aria-components\";\nimport { typography } from \"@/utils\";\nimport styles from \"./calendarMenuItem.module.css\";\n\n/*\n Props for the {@link CalendarMenuItem} component.\n * Extends React Aria's {@link ListBoxItem} props.\n /\nexport interface CalendarMenuItemProps\n extends React.ComponentPropsWithRef<typeof ListBoxItem> {}\n\n/\n An individual selectable item within the calendar month and year picker menus.\n \n Implements Material Design 3 selection styles, focus outlines, and typography.\n */\nexport const CalendarMenuItem: React.FC<CalendarMenuItemProps> = ({\n className,\n ...props\n}) => {\n return (\n <ListBoxItem\n className={(renderProps) =>\n clsx(\n styles[\"item\"],\n typography.bodyLarge,\n typeof className === \"function\"\n ? className(renderProps)\n : className\n )\n }\n {...props}\n />\n );\n};\n"],"mappings":";;;;;;A,4CCiBaO,KAAoD,MAAA;CAAA,IAAAC,KAAA,GAAAR,EAAAA,EAAAA,CAAA,CAAA,GAAAS,GAAAC;CAAA,AAAAF,EAAA,OAAAG,KAGhE,IAAAH,EAAA,IAAA,IAAAA,EAAA,OAHiE,eAAA,GAAAE,KAAAC,GAGjE,EAAA,KAAAA,GAAA,EAAA,KAAAF,GAAA,EAAA,KAAAC;CAAA,IAAAE;CAAA,AAAAJ,EAAA,OAAAC,IAUgB,IAAAD,EAAA,MAPM,KAAA,MACPP,EACIC,EAAM,MACNW,EAAU,WACV,OAAOJ,KAAc,aACfA,EAAUK,CACF,IAFdL,CAGJ,GAAC,EAAA,KAAAA,GAAA,EAAA,KAAAG;CAAA,IAAAG;CAGP,OAHOP,EAAA,OAAAE,KAAAF,EAAA,OAAAI,KART,IAAA,kBAACI,GAAD;EACe,WAAAJ;EAON,GAEDF;CAAK,CAAA,GACX,EAAA,KAAAA,GAAA,EAAA,KAAAE,GAAA,EAAA,KAAAG,KAAA,IAAAP,EAAA,IAXFO;AAWE"}

package/dist/chunks/Card CHANGED Viewed

@@ -3,10 +3,10 @@ import n from "clsx";
 import { Fragment as r, jsx as i, jsxs as a } from "react/jsx-runtime";
 import { GridListItem as o } from "react-aria-components";
 import '../assets/Card.css';var s = {
-	card: "_card_a3fgp_11",
-	elevated: "_elevated_a3fgp_122",
-	filled: "_filled_a3fgp_137",
-	outlined: "_outlined_a3fgp_150"
+	card: "_card_l0da7_11",
+	elevated: "_elevated_l0da7_124",
+	filled: "_filled_l0da7_139",
+	outlined: "_outlined_l0da7_152"
 }, c = ({ variant: c = "filled", className: l, onPress: u, children: d, ...f }) => {
 	let { handlePress: p, splashInfo: m } = t(u);
 	return /* @__PURE__ */ i(o, {
@@ -16,7 +16,6 @@ import '../assets/Card.css';var s = {
 		children: (t) => /* @__PURE__ */ a(r, { children: [m && /* @__PURE__ */ i(e, { ...m }), typeof d == "function" ? d(t) : d] })
 	});
 };
-//#endregion
 export { c as t };
 //# sourceMappingURL=Card.map

package/dist/chunks/Card.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Card","names":["renderProps"],"sources":["../../src/components/Card/Card/card.module.css","../../src/components/Card/Card/Card.tsx"],"sourcesContent":["/* configurable tokens\n\n --md-card-background\n* --md-card-icon-color\n* --md-card-elevation\n* --md-card-outline\n\n configurable tokens end /\n\n@layer adgytec.comps {\n .card {\n --_md-card-background: var(\n --md-card-background,\n var(--_md-card-background-default)\n );\n --_md-card-icon-color: var(\n --md-card-icon-color,\n var(--md-sys-color-primary)\n );\n\n --_md-card-elevation: var(\n --md-card-elevation,\n var(--_md-card-elevation-default, var(--md-sys-elevation-shadow-0))\n );\n\n --md-card-shape: var(--md-sys-shape-corner-radius-medium);\n --md-card-padding: var(--md-sys-layout-space-16);\n\n / state layer /\n --_state-color: var(--md-sys-color-on-surface);\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-card-background);\n --_shadow: var(--_md-card-elevation);\n\n border-radius: var(--md-card-shape);\n background-color: var(--_background-color);\n color: var(--_color);\n\n position: relative;\n overflow: clip;\n\n box-shadow: var(--_shadow);\n\n transition: box-shadow 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 &[data-hovered] {\n --_state-layer-opacity: var(--md-sys-state-hover);\n --_shadow: var(--md-sys-elevation-shadow-1);\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-dragging] {\n --_state-layer-opacity: var(--md-sys-state-dragged);\n --_shadow: var(--md-sys-elevation-shadow-3);\n }\n\n &[data-disabled] {\n --_background-color: rgb(\n from var(--md-sys-color-surface) r g b /\n var(--md-sys-state-disabled-content)\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 --_state-layer-color: var(--_background-color);\n }\n }\n\n / state layer /\n .card::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 .card[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 .elevated {\n --_md-card-elevation-default: var(--md-sys-elevation-shadow-1);\n --_md-card-background-default: var(\n --md-sys-color-surface-container-low\n );\n\n &[data-hovered] {\n --_shadow: var(--md-sys-elevation-shadow-2);\n }\n\n &[data-dragging] {\n --_shadow: var(--md-sys-elevation-shadow-4);\n }\n }\n\n .filled {\n --_md-card-background-default: var(\n --md-sys-color-surface-container-highest\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 }\n }\n\n .outlined {\n --_md-card-outline: var(\n --md-card-outline,\n var(--md-sys-color-outline-variant)\n );\n\n --_md-card-background-default: var(--md-sys-color-surface);\n\n /* variables to use */\n --_outline-color: var(--_md-card-outline);\n --_outline-width: var(--md-sys-shape-border-width-thin);\n\n border: var(--_outline-width) solid var(--_outline-color);\n\n &[data-focus-visible] {\n --_outline-color: var(--md-sys-color-on-surface);\n }\n\n &[data-disabled] {\n --_outline-color: rgb(\n from var(--md-sys-color-outline) r g b /\n var(--md-sys-state-disabled-container)\n );\n }\n }\n}\n","import clsx from \"clsx\";\nimport { GridListItem } from \"react-aria-components\";\nimport { Splash, useSplash } from \"@/components/Splash\";\nimport styles from \"./card.module.css\";\nimport type { CardProps } from \"./types\";\n\nexport const Card: React.FC<CardProps> = ({\n variant = \"filled\",\n className,\n onPress,\n children,\n ...props\n}) => {\n const { handlePress, splashInfo } = useSplash(onPress);\n\n return (\n <GridListItem\n className={(renderProps) =>\n clsx(\n styles[\"card\"],\n styles[variant],\n typeof className === \"function\"\n ? className(renderProps)\n : className\n )\n }\n onPress={handlePress}\n {...props}\n >\n {(renderProps) => {\n return (\n <>\n {splashInfo && <Splash {...splashInfo} />}\n {typeof children === \"function\"\n ? children(renderProps)\n : children}\n </>\n );\n }}\n </GridListItem>\n );\n};\n"],"mappings":";;;;;;;;;~~GCMa~~,KAA6B,EACtC,aAAU,UACV,cACA,YACA,aACA,~~GAAG~~,QACD;CACF,IAAM,EAAE,gBAAa,~~kBAAe~~,~~EAAU~~,CAAO;CAErD,OACI,~~kBAAC~~,GAAD;EACI,YAAY,~~MACR~~,~~EACI~~,~~EAAO~~,~~MACP~~,~~EAAO~~,IACP,~~OAAO~~,KAAc,~~aACf~~,~~EAAU~~,CAAW,~~IACrB~~,CACV;EAEJ,~~SAAS~~;EACT,~~GAAI~~;~~aAEFA~~,MAEM,~~kBAAA~~,GAAA,EAAA,UAAA,~~CACK~~,KAAc,~~kBAAC~~,GAAD,EAAQ,~~GAAI~~,EAAW,CAAA,GACrC,~~OAAO~~,KAAa,~~aACf~~,~~EAASA~~,CAAW,~~IACpB~~,CACV,EAAA,CAAA;CAGE,CAAA;AAEtB"}
1	+ {"version":3,"file":"Card","names":["renderProps","clsx","styles","_Fragment","Splash","clsx$1","card_module_default","Card","props","useSplash","onPress","GridListItem","\"card\"","variant","className","renderProps","handlePress","Fragment","splashInfo","children","renderProps_0"],"sources":["../../src/components/Card/Card/card.module.css","../../src/components/Card/Card/Card.tsx"],"sourcesContent":["/* configurable tokens\n\n --md-card-background\n* --md-card-icon-color\n* --md-card-elevation\n* --md-card-outline\n\n configurable tokens end /\n\n@layer adgytec.comps {\n .card {\n --_md-card-background: var(\n --md-card-background,\n var(--_md-card-background-default)\n );\n --_md-card-icon-color: var(\n --md-card-icon-color,\n var(--md-sys-color-primary)\n );\n\n --_md-card-elevation: var(\n --md-card-elevation,\n var(--_md-card-elevation-default, var(--md-sys-elevation-shadow-0))\n );\n\n --md-card-shape: var(--md-sys-shape-corner-radius-medium);\n --md-card-padding: var(--md-sys-layout-space-16);\n\n / state layer /\n --_state-color: var(--md-sys-color-on-surface);\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-card-background);\n --_shadow: var(--_md-card-elevation);\n\n border-radius: var(--md-card-shape);\n background-color: var(--_background-color);\n color: var(--_color);\n\n position: relative;\n overflow: clip;\n\n box-shadow: var(--_shadow);\n\n transition: box-shadow 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 &[data-hovered] {\n cursor: pointer;\n\n --_state-layer-opacity: var(--md-sys-state-hover);\n --_shadow: var(--md-sys-elevation-shadow-1);\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-dragging] {\n --_state-layer-opacity: var(--md-sys-state-dragged);\n --_shadow: var(--md-sys-elevation-shadow-3);\n }\n\n &[data-disabled] {\n --_background-color: rgb(\n from var(--md-sys-color-surface) r g b /\n var(--md-sys-state-disabled-content)\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 --_state-layer-color: var(--_background-color);\n }\n }\n\n / state layer /\n .card::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 .card[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 .elevated {\n --_md-card-elevation-default: var(--md-sys-elevation-shadow-1);\n --_md-card-background-default: var(\n --md-sys-color-surface-container-low\n );\n\n &[data-hovered] {\n --_shadow: var(--md-sys-elevation-shadow-2);\n }\n\n &[data-dragging] {\n --_shadow: var(--md-sys-elevation-shadow-4);\n }\n }\n\n .filled {\n --_md-card-background-default: var(\n --md-sys-color-surface-container-highest\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 }\n }\n\n .outlined {\n --_md-card-outline: var(\n --md-card-outline,\n var(--md-sys-color-outline-variant)\n );\n\n --_md-card-background-default: var(--md-sys-color-surface);\n\n /* variables to use /\n --_outline-color: var(--_md-card-outline);\n --_outline-width: var(--md-sys-shape-border-width-thin);\n\n border: var(--_outline-width) solid var(--_outline-color);\n\n &[data-focus-visible] {\n --_outline-color: var(--md-sys-color-on-surface);\n }\n\n &[data-disabled] {\n --_outline-color: rgb(\n from var(--md-sys-color-outline) r g b /\n var(--md-sys-state-disabled-container)\n );\n }\n }\n}\n","import clsx from \"clsx\";\nimport { GridListItem } from \"react-aria-components\";\nimport { Splash, useSplash } from \"@/components/Splash\";\nimport styles from \"./card.module.css\";\nimport type { CardProps } from \"./types\";\n\n/\n A card container component implementing Material Design 3 Card guidelines.\n \n Cards contain content and actions about a single subject. They present information\n * in a structured format and support three visual variants (`\"filled\"`, `\"elevated\"`, `\"outlined\"`),\n * interactive press states with touch ripple feedback via {@link Splash}, keyboard navigation,\n * and accessible focus management built on top of React Aria's `GridListItem`.\n \n @example\n * ```tsx\n * import { Card, CardIcon } from '@adgytec/web-ui-components';\n * import { Bell } from 'lucide-react';\n \n <Card variant=\"elevated\" onPress={() => console.log('Card clicked')}>\n * <CardIcon icon={Bell} />\n * <h3>Notifications</h3>\n * <p>Manage your alert preferences.</p>\n * </Card>\n * ```\n */\nexport const Card: React.FC<CardProps> = ({\n variant = \"filled\",\n className,\n onPress,\n children,\n ...props\n}) => {\n const { handlePress, splashInfo } = useSplash(onPress);\n\n return (\n <GridListItem\n className={(renderProps) =>\n clsx(\n styles[\"card\"],\n styles[variant],\n typeof className === \"function\"\n ? className(renderProps)\n : className\n )\n }\n onPress={handlePress}\n {...props}\n >\n {(renderProps) => {\n return (\n <>\n {splashInfo && <Splash {...splashInfo} />}\n {typeof children === \"function\"\n ? children(renderProps)\n : children}\n </>\n );\n }}\n </GridListItem>\n );\n};\n"],"mappings":";;;;;;;;;A,GC0BaO,KAA6B,EACtC,aAAU,UACV,cACA,YACA,aACA,GAAGC,QACD;CACF,IAAM,EAAE,gBAAa,kBAAeC,EAAUC,CAAO;CAErD,OACI,kBAACC,GAAD;EACI,YAAY,MACRV,EACIC,EAAOU,MACPV,EAAOW,IACP,OAAOC,KAAc,aACfA,EAAUC,CAAW,IACrBD,CACV;EAEJ,SAASE;EACT,GAAIR;EAEFR,WAAAA,MAEM,kBAAAG,GAAA,EAAA,UAAA,CACKe,KAAc,kBAACd,GAAD,EAAQ,GAAIc,EAAW,CAAA,GACrC,OAAOC,KAAa,aACfA,EAASnB,CAAW,IACpBmB,CACV,EAAA,CAAA;CAGE,CAAA;AAEtB"}

package/dist/chunks/CardIcon CHANGED Viewed

@@ -3,7 +3,7 @@ import { t } from "./Icon";
 import "./types";
 import { clsx as n } from "clsx";
 import { jsx as r } from "react/jsx-runtime";
-import '../assets/CardIcon.css';//#region src/components/Card/CardIcon/cardIcon.module.css
+import '../assets/CardIcon.css';// src/components/Card/CardIcon/cardIcon.module.css
 var i = e(), a = { icon: "_icon_vasd2_2" }, o = (e) => {
 	let o = (0, i.c)(7), s, c;
 	o[0] === e ? (s = o[1], c = o[2]) : ({icon: s, ...c} = e, o[0] = e, o[1] = s, o[2] = c);
@@ -17,7 +17,6 @@ var i = e(), a = { icon: "_icon_vasd2_2" }, o = (e) => {
 		...c
 	}), o[4] = s, o[5] = c, o[6] = u) : u = o[6], u;
 };
-//#endregion
 export { o as t };
 //# sourceMappingURL=CardIcon.map

package/dist/chunks/CardIcon.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CardIcon","names":["icon","CardIconSize"],"sources":["../../src/components/Card/CardIcon/cardIcon.module.css","../../src/components/Card/CardIcon/CardIcon.tsx"],"sourcesContent":["@layer adgytec.comps {\n .icon {\n color: var(--_md-card-icon-color);\n }\n}\n","import { clsx } from \"clsx\";\nimport { Icon } from \"@/components/Icon\";\nimport { CardIconSize } from \"../Card/types\";\nimport styles from \"./cardIcon.module.css\";\n\~~nexport~~ ~~const~~ CardIcon: ~~React.FC<\~~n Omit<React.ComponentPropsWithRef<typeof Icon>, \"size\" \| \"withText\">\n> = ({ icon, ...props }) => {\n return (\n <Icon\n icon={icon}\n size={CardIconSize}\n className={clsx(styles[\"icon\"])}\n {...props}\n />\n );\n};\n"],"mappings":";;;;;;~~4CCKa~~,~~KAET~~,MAAA;CAAA,~~IAAA~~,KAAA,~~GAAA~~,~~EAAA~~,~~EAAA~~,CAAA,CAAA,~~GAAA~~,~~GAAA~~;CAAA,~~AAAA~~,EAAA,~~OAAA~~,KAAmB,~~IAAA~~,EAAA,IAAA,~~IAAA~~,EAAA,OAAlB,~~aAAA~~,~~KAAA~~,GAAkB,EAAA,~~KAAA~~,GAAA,EAAA,~~KAAA~~,GAAA,EAAA,~~KAAA~~;CAAA,~~IAAA~~;CAAA,~~AAAA~~,EAAA,OAAA,OAAA,IAAA,2BAAA,~~KAKA~~,~~IAAA~~,~~EAAK~~,EAAM,IAAQ,GAAC,EAAA,~~KAAA~~,KAAA,~~IAAA~~,EAAA;CAAA,~~IAAA~~;CAEjC,~~OAFiC~~,EAAA,~~OAAA~~,~~KAAA~~,EAAA,~~OAAA~~,KAHnC,IAAA,~~kBAAC~~,GAAD;EACU;~~EACAC~~,MAAAA;EACK,~~WAAA~~;EAAoB,~~GAC3B~~;CAAK,CAAA,GACX,EAAA,~~KAAA~~,GAAA,EAAA,~~KAAA~~,GAAA,EAAA,~~KAAA~~,KAAA,~~IAAA~~,EAAA,~~IALF~~;AAKE"}
1	+ {"version":3,"file":"CardIcon","names":["icon","CardIconSize","_c","styles","require_compiler_runtime","import_compiler_runtime","cardIcon_module_default","CardIcon","$","icon","props","t0","t1","clsx","t2","Icon"],"sources":["../../src/components/Card/CardIcon/cardIcon.module.css","../../src/components/Card/CardIcon/CardIcon.tsx"],"sourcesContent":["@layer adgytec.comps {\n .icon {\n color: var(--_md-card-icon-color);\n }\n}\n","import { clsx } from \"clsx\";\nimport { Icon } from \"@/components/Icon\";\nimport { CardIconSize } from \"../Card/types\";\nimport styles from \"./cardIcon.module.css\";\n\n/*\n Props for the {@link CardIcon} component.\n * Extends {@link Icon} props while omitting `size` and `withText`, which are pre-configured\n * specifically for cards.\n /\nexport interface CardIconProps\n extends Omit<\n React.ComponentPropsWithRef<typeof Icon>,\n \"size\" \| \"withText\"\n > {}\n\n/\n A styled icon component designed specifically for placement inside a {@link Card}.\n \n Automatically standardizes the icon size to 24px ({@link CardIconSize}) and applies\n * theme-aware icon coloring (`--_md-card-icon-color`).\n \n @example\n * ```tsx\n * import { Card, CardIcon } from '@adgytec/web-ui-components';\n * import { Sparkles } from 'lucide-react';\n \n <Card>\n * <CardIcon icon={Sparkles} />\n * <span>Featured Content</span>\n * </Card>\n * ```\n */\nexport const CardIcon: React.FC<CardIconProps> = ({ icon, ...props }) => {\n return (\n <Icon\n icon={icon}\n size={CardIconSize}\n className={clsx(styles[\"icon\"])}\n {...props}\n />\n );\n};\n"],"mappings":";;;;;;A,4CCiCaO,KAAoC,MAAA;CAAA,IAAAC,KAAA,GAAAN,EAAAA,EAAAA,CAAA,CAAA,GAAAO,GAAAC;CAAA,AAAAF,EAAA,OAAAG,KAAmB,IAAAH,EAAA,IAAA,IAAAA,EAAA,OAAlB,UAAA,GAAAE,KAAAC,GAAkB,EAAA,KAAAA,GAAA,EAAA,KAAAF,GAAA,EAAA,KAAAC;CAAA,IAAAE;CAAA,AAAAJ,EAAA,OAAA,OAAA,IAAA,2BAAA,KAK7C,IAAAK,EAAKV,EAAM,IAAQ,GAAC,EAAA,KAAAS,KAAA,IAAAJ,EAAA;CAAA,IAAAM;CAEjC,OAFiCN,EAAA,OAAAC,KAAAD,EAAA,OAAAE,KAHnC,IAAA,kBAACK,GAAD;EACU;EACAd,MAAAA;EACK,WAAAW;EAAoB,GAC3BF;CAAK,CAAA,GACX,EAAA,KAAAD,GAAA,EAAA,KAAAC,GAAA,EAAA,KAAAI,KAAA,IAAAN,EAAA,IALFM;AAKE"}

package/dist/chunks/CenteredSlider CHANGED Viewed

@@ -5,7 +5,7 @@ import { t as u } from "./SliderThumb";
 import d from "clsx";
 import { Fragment as f, jsx as p, jsxs as m } from "react/jsx-runtime";
 import { Slider as h, SliderTrack as g } from "react-aria-components";
-import '../assets/CenteredSlider.css';//#region src/components/Input/Slider/CenteredSlider/centerdSlider.module.css
+import '../assets/CenteredSlider.css';// src/components/Input/Slider/CenteredSlider/centerdSlider.module.css
 var _ = { "inactive-track": "_inactive-track_1pivv_2" }, v = ({ label: v, thumbLabel: y, size: b = "small", minValue: x = 0, maxValue: S = 100, step: C = 1, defaultValue: w = (x + S) / 2, showInBetweenSteps: T, maxStops: E, outputRenderer: D, className: O, ...k }) => /* @__PURE__ */ p(h, {
 	minValue: x,
 	maxValue: S,
@@ -73,7 +73,6 @@ var _ = { "inactive-track": "_inactive-track_1pivv_2" }, v = ({ label: v, thumbL
 		})] });
 	}
 });
-//#endregion
 export { v as t };
 //# sourceMappingURL=CenteredSlider.map

package/dist/chunks/CenteredSlider.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CenteredSlider","names":[],"sources":["../../src/components/Input/Slider/CenteredSlider/centerdSlider.module.css","../../src/components/Input/Slider/CenteredSlider/CenteredSlider.tsx"],"sourcesContent":["@layer adgytec.overrides {\n .inactive-track {\n position: relative;\n\n &[data-orientation=\"horizontal\"] {\n --_inline-size: var(--_range-gap-half);\n --_block-size: var(--_md-slider-track-size);\n }\n\n &[data-orientation=\"vertical\"] {\n --_block-size: var(--_range-gap-half);\n --_inline-size: var(--_md-slider-track-size);\n }\n\n &:not([data-active-direction]):not([data-mid]) {\n &::before,\n &:not([data-disabled])::after {\n content: \"\";\n position: absolute;\n\n inline-size: var(--_inline-size);\n block-size: var(--_block-size);\n\n background-color: inherit;\n }\n\n &[data-track=\"start\"] {\n &[data-orientation=\"horizontal\"] {\n border-start-end-radius: 0;\n border-end-end-radius: 0;\n\n &::before {\n inset-inline-end: 0;\n translate: 100%;\n\n border-start-end-radius: var(\n --_md-slider-track-inner-shape\n );\n border-end-end-radius: var(\n --_md-slider-track-inner-shape\n );\n }\n\n &::after {\n inset-inline-end: 0;\n translate: 50%;\n }\n }\n\n &[data-orientation=\"vertical\"] {\n border-start-end-radius: 0;\n border-start-start-radius: 0;\n\n &::before {\n inset-block-start: 0;\n translate: 0 -100%;\n\n border-start-end-radius: var(\n --_md-slider-track-inner-shape\n );\n border-start-start-radius: var(\n --_md-slider-track-inner-shape\n );\n }\n\n &::after {\n inset-block-start: 0;\n translate: 0 -50%;\n }\n }\n }\n\n &[data-track=\"end\"] {\n &[data-orientation=\"horizontal\"] {\n border-start-start-radius: 0;\n border-end-start-radius: 0;\n\n &::before {\n inset-inline-start: 0;\n translate: -100%;\n\n border-start-start-radius: var(\n --_md-slider-track-inner-shape\n );\n border-end-start-radius: var(\n --_md-slider-track-inner-shape\n );\n }\n\n &::after {\n inset-inline-start: 0;\n translate: -50%;\n }\n }\n\n &[data-orientation=\"vertical\"] {\n border-end-end-radius: 0;\n border-end-start-radius: 0;\n\n &::before {\n inset-block-end: 0;\n translate: 0 100%;\n\n border-end-end-radius: var(\n --_md-slider-track-inner-shape\n );\n border-end-start-radius: var(\n --_md-slider-track-inner-shape\n );\n }\n\n &::after {\n inset-block-end: 0;\n translate: 0 50%;\n }\n }\n }\n }\n }\n}\n","import clsx from \"clsx\";\nimport { Slider as AriaSlider, SliderTrack } from \"react-aria-components\";\nimport { Label } from \"../../Label\";\nimport {\n ActiveTrackStyles,\n InactiveTrackStyles,\n SliderColors,\n SliderSizeStyles,\n SliderStyles,\n TrackContainerStyles,\n TrackStyles,\n VisualTrackStyles,\n} from \"../core\";\nimport { SliderStops } from \"../SliderStops\";\nimport { SliderThumb } from \"../SliderThumb\";\nimport styles from \"./centerdSlider.module.css\";\nimport type { CenteredSliderProps } from \"./types\";\n\nexport const CenteredSlider = <T extends number>({\n label,\n thumbLabel,\n size = \"small\",\n minValue = 0,\n maxValue = 100,\n step = 1,\n defaultValue = ((minValue + maxValue) / 2) as T,\n showInBetweenSteps,\n maxStops,\n outputRenderer,\n className,\n ...props\n}: CenteredSliderProps<T>) => {\n return (\n <AriaSlider\n minValue={minValue}\n maxValue={maxValue}\n step={step}\n defaultValue={defaultValue}\n className={(renderProps) =>\n clsx(\n SliderStyles,\n SliderColors,\n typeof className === \"function\"\n ? className(renderProps)\n : className\n )\n }\n {...props}\n >\n {({ orientation, state, isDisabled }) => {\n const thumbValue = state.getThumbPercent(0);\n const sizeKey =\n orientation === \"horizontal\" ? \"inlineSize\" : \"blockSize\";\n\n const center = 0.5;\n\n const mid = Math.abs(thumbValue - center) * 100;\n const start = Math.min(thumbValue, center) * 100;\n const end = Math.min(1 - thumbValue, center) * 100;\n\n const activeDirection =\n thumbValue < 0.5\n ? \"start\"\n : thumbValue > 0.5\n ? \"end\"\n : undefined;\n\n return (\n <>\n {label && <Label>{label}</Label>}\n\n <div\n className={clsx(TrackContainerStyles)}\n data-orientation={orientation}\n >\n <SliderTrack\n className={clsx(\n TrackStyles,\n SliderSizeStyles(size)\n )}\n >\n <div\n className={clsx(VisualTrackStyles)}\n data-orientation={orientation}\n >\n <div\n className={clsx(\n InactiveTrackStyles,\n styles[\"inactive-track\"]\n )}\n data-active-direction={\n activeDirection === \"start\" \|\|\n undefined\n }\n data-track=\"start\"\n data-orientation={orientation}\n data-mid={\n thumbValue === center \|\| undefined\n }\n data-disabled={isDisabled \|\| undefined}\n style={{\n [sizeKey]: `${start}%`,\n }}\n />\n\n <div\n className={clsx(ActiveTrackStyles)}\n data-orientation={orientation}\n data-track=\"mid\"\n data-disabled={isDisabled \|\| undefined}\n style={{\n [sizeKey]: `${mid}%`,\n }}\n >\n <div data-direction={activeDirection} />\n </div>\n\n <div\n className={clsx(\n InactiveTrackStyles,\n styles[\"inactive-track\"]\n )}\n data-orientation={orientation}\n data-track=\"end\"\n data-active-direction={\n activeDirection === \"end\" \|\|\n undefined\n }\n data-mid={\n thumbValue === center \|\| undefined\n }\n data-disabled={isDisabled \|\| undefined}\n style={{\n [sizeKey]: `${end}%`,\n }}\n />\n </div>\n\n <SliderThumb\n size={size}\n orientation={orientation}\n aria-label={thumbLabel}\n outputRenderer={outputRenderer}\n />\n\n <SliderStops\n slider=\"centered\"\n minValue={minValue}\n maxValue={maxValue}\n step={step}\n orientation={orientation}\n showInBetweenSteps={showInBetweenSteps}\n maxStops={maxStops}\n />\n </SliderTrack>\n </div>\n </>\n );\n }}\n </AriaSlider>\n );\n};\n"],"mappings":";;;;;;;;yDCkBa,KAAoC,EAC7C,UACA,eACA,UAAO,SACP,cAAW,GACX,cAAW,KACX,UAAO,GACP,mBAAiB,IAAW,KAAY,GACxC,uBACA,aACA,mBACA,cACA,GAAG,QAGC,kBAAC,GAAD;CACc;CACA;CACJ;CACQ;CACd,YAAY,MACR,EACI,GACA,GACA,OAAO,KAAc,aACf,EAAU,CAAW,IACrB,CACV;CAEJ,GAAI;YAEF,EAAE,gBAAa,UAAO,oBAAiB;EACrC,IAAM,IAAa,EAAM,gBAAgB,CAAC,GACpC,IACF,MAAgB,eAAe,eAAe,aAE5C,IAAS,IAET,IAAM,KAAK,IAAI,IAAa,CAAM,IAAI,KACtC,IAAQ,KAAK,IAAI,GAAY,CAAM,IAAI,KACvC,IAAM,KAAK,IAAI,IAAI,GAAY,CAAM,IAAI,KAEzC,IACF,IAAa,KACP,UACA,IAAa,KACX,QACA,KAAA;EAEZ,OACI,kBAAA,GAAA,EAAA,UAAA,CACK,KAAS,kBAAC,GAAD,EAAA,UAAQ,EAAa,CAAA,GAE/B,kBAAC,OAAD;GACI,WAAW,EAAK,CAAoB;GACpC,oBAAkB;aAElB,kBAAC,GAAD;IACI,WAAW,EACP,GACA,EAAiB,CAAI,CACzB;cAJJ;KAMI,kBAAC,OAAD;MACI,WAAW,EAAK,CAAiB;MACjC,oBAAkB;gBAFtB;OAII,kBAAC,OAAD;QACI,WAAW,EACP,GACA,EAAO,iBACX;QACA,yBACI,MAAoB,WACpB,KAAA;QAEJ,cAAW;QACX,oBAAkB;QAClB,YACI,MAAe,KAAU,KAAA;QAE7B,iBAAe,KAAc,KAAA;QAC7B,OAAO,GACF,IAAU,GAAG,EAAK,GACvB;OAAE,CAAA;OAGN,kBAAC,OAAD;QACI,WAAW,EAAK,CAAiB;QACjC,oBAAkB;QAClB,cAAW;QACX,iBAAe,KAAc,KAAA;QAC7B,OAAO,GACF,IAAU,GAAG,EAAG,GACrB;kBAEA,kBAAC,OAAD,EAAK,kBAAgB,EAAgB,CAAA;OACpC,CAAA;OAEL,kBAAC,OAAD;QACI,WAAW,EACP,GACA,EAAO,iBACX;QACA,oBAAkB;QAClB,cAAW;QACX,yBACI,MAAoB,SACpB,KAAA;QAEJ,YACI,MAAe,KAAU,KAAA;QAE7B,iBAAe,KAAc,KAAA;QAC7B,OAAO,GACF,IAAU,GAAG,EAAG,GACrB;OAAE,CAAA;MAEL;;KAEL,kBAAC,GAAD;MACU;MACO;MACb,cAAY;MACI;KAAe,CAAA;KAGnC,kBAAC,GAAD;MACI,QAAO;MACG;MACA;MACJ;MACO;MACO;MACV;KAAS,CAAA;IAEd;;EACZ,CAAA,CACT,EAAA,CAAA;CAER;AACQ,CAAA"}
1	+ {"version":3,"file":"CenteredSlider","names":["AriaSlider","clsx","_Fragment","Label","styles","SliderThumb","Label$1","SliderStyles","SliderColors","SliderSizeStyles","InactiveTrackStyles","TrackContainerStyles","VisualTrackStyles","ActiveTrackStyles","SliderStops","SliderThumb$1","clsx$1","centerdSlider_module_default","CenteredSlider","minValue","maxValue","props","Slider","className","renderProps","thumbValue","state","sizeKey","orientation","center","mid","start","end","activeDirection","Fragment","label","SliderTrack","TrackStyles","size","isDisabled","thumbLabel"],"sources":["../../src/components/Input/Slider/CenteredSlider/centerdSlider.module.css","../../src/components/Input/Slider/CenteredSlider/CenteredSlider.tsx"],"sourcesContent":["@layer adgytec.overrides {\n .inactive-track {\n position: relative;\n\n &[data-orientation=\"horizontal\"] {\n --_inline-size: var(--_range-gap-half);\n --_block-size: var(--_md-slider-track-size);\n }\n\n &[data-orientation=\"vertical\"] {\n --_block-size: var(--_range-gap-half);\n --_inline-size: var(--_md-slider-track-size);\n }\n\n &:not([data-active-direction]):not([data-mid]) {\n &::before,\n &:not([data-disabled])::after {\n content: \"\";\n position: absolute;\n\n inline-size: var(--_inline-size);\n block-size: var(--_block-size);\n\n background-color: inherit;\n }\n\n &[data-track=\"start\"] {\n &[data-orientation=\"horizontal\"] {\n border-start-end-radius: 0;\n border-end-end-radius: 0;\n\n &::before {\n inset-inline-end: 0;\n translate: 100%;\n\n border-start-end-radius: var(\n --_md-slider-track-inner-shape\n );\n border-end-end-radius: var(\n --_md-slider-track-inner-shape\n );\n }\n\n &::after {\n inset-inline-end: 0;\n translate: 50%;\n }\n }\n\n &[data-orientation=\"vertical\"] {\n border-start-end-radius: 0;\n border-start-start-radius: 0;\n\n &::before {\n inset-block-start: 0;\n translate: 0 -100%;\n\n border-start-end-radius: var(\n --_md-slider-track-inner-shape\n );\n border-start-start-radius: var(\n --_md-slider-track-inner-shape\n );\n }\n\n &::after {\n inset-block-start: 0;\n translate: 0 -50%;\n }\n }\n }\n\n &[data-track=\"end\"] {\n &[data-orientation=\"horizontal\"] {\n border-start-start-radius: 0;\n border-end-start-radius: 0;\n\n &::before {\n inset-inline-start: 0;\n translate: -100%;\n\n border-start-start-radius: var(\n --_md-slider-track-inner-shape\n );\n border-end-start-radius: var(\n --_md-slider-track-inner-shape\n );\n }\n\n &::after {\n inset-inline-start: 0;\n translate: -50%;\n }\n }\n\n &[data-orientation=\"vertical\"] {\n border-end-end-radius: 0;\n border-end-start-radius: 0;\n\n &::before {\n inset-block-end: 0;\n translate: 0 100%;\n\n border-end-end-radius: var(\n --_md-slider-track-inner-shape\n );\n border-end-start-radius: var(\n --_md-slider-track-inner-shape\n );\n }\n\n &::after {\n inset-block-end: 0;\n translate: 0 50%;\n }\n }\n }\n }\n }\n}\n","import clsx from \"clsx\";\nimport { Slider as AriaSlider, SliderTrack } from \"react-aria-components\";\nimport { Label } from \"../../Label\";\nimport {\n ActiveTrackStyles,\n InactiveTrackStyles,\n SliderColors,\n SliderSizeStyles,\n SliderStyles,\n TrackContainerStyles,\n TrackStyles,\n VisualTrackStyles,\n} from \"../core\";\nimport { SliderStops } from \"../SliderStops\";\nimport { SliderThumb } from \"../SliderThumb\";\nimport styles from \"./centerdSlider.module.css\";\nimport type { CenteredSliderProps } from \"./types\";\n\n/*\n Material Design 3 centered slider component.\n \n Visualizes deviation from a central neutral point (the midpoint between `minValue` and `maxValue`).\n * The active track fills outward from the center towards the thumb in either direction,\n * making it ideal for balance, pan, exposure, or plus/minus adjustments.\n \n @example\n * ```tsx\n * import { CenteredSlider } from \"@adgytec/web-ui-components\";\n \n <CenteredSlider\n * label=\"Stereo Balance\"\n * minValue={-50}\n * maxValue={50}\n * defaultValue={0}\n * step={5}\n * showInBetweenSteps\n * thumbLabel=\"Balance\"\n * />\n * ```\n /\nexport const CenteredSlider = <T extends number>({\n label,\n thumbLabel,\n size = \"small\",\n minValue = 0,\n maxValue = 100,\n step = 1,\n defaultValue = ((minValue + maxValue) / 2) as T,\n showInBetweenSteps,\n maxStops,\n outputRenderer,\n className,\n ...props\n}: CenteredSliderProps<T>) => {\n return (\n <AriaSlider\n minValue={minValue}\n maxValue={maxValue}\n step={step}\n defaultValue={defaultValue}\n className={(renderProps) =>\n clsx(\n SliderStyles,\n SliderColors,\n typeof className === \"function\"\n ? className(renderProps)\n : className\n )\n }\n {...props}\n >\n {({ orientation, state, isDisabled }) => {\n const thumbValue = state.getThumbPercent(0);\n const sizeKey =\n orientation === \"horizontal\" ? \"inlineSize\" : \"blockSize\";\n\n const center = 0.5;\n\n const mid = Math.abs(thumbValue - center) 100;\n const start = Math.min(thumbValue, center) * 100;\n const end = Math.min(1 - thumbValue, center) * 100;\n\n const activeDirection =\n thumbValue < 0.5\n ? \"start\"\n : thumbValue > 0.5\n ? \"end\"\n : undefined;\n\n return (\n <>\n {label && <Label>{label}</Label>}\n\n <div\n className={clsx(TrackContainerStyles)}\n data-orientation={orientation}\n >\n <SliderTrack\n className={clsx(\n TrackStyles,\n SliderSizeStyles(size)\n )}\n >\n <div\n className={clsx(VisualTrackStyles)}\n data-orientation={orientation}\n >\n <div\n className={clsx(\n InactiveTrackStyles,\n styles[\"inactive-track\"]\n )}\n data-active-direction={\n activeDirection === \"start\" \|\|\n undefined\n }\n data-track=\"start\"\n data-orientation={orientation}\n data-mid={\n thumbValue === center \|\| undefined\n }\n data-disabled={isDisabled \|\| undefined}\n style={{\n [sizeKey]: `${start}%`,\n }}\n />\n\n <div\n className={clsx(ActiveTrackStyles)}\n data-orientation={orientation}\n data-track=\"mid\"\n data-disabled={isDisabled \|\| undefined}\n style={{\n [sizeKey]: `${mid}%`,\n }}\n >\n <div data-direction={activeDirection} />\n </div>\n\n <div\n className={clsx(\n InactiveTrackStyles,\n styles[\"inactive-track\"]\n )}\n data-orientation={orientation}\n data-track=\"end\"\n data-active-direction={\n activeDirection === \"end\" \|\|\n undefined\n }\n data-mid={\n thumbValue === center \|\| undefined\n }\n data-disabled={isDisabled \|\| undefined}\n style={{\n [sizeKey]: `${end}%`,\n }}\n />\n </div>\n\n <SliderThumb\n size={size}\n orientation={orientation}\n aria-label={thumbLabel}\n outputRenderer={outputRenderer}\n />\n\n <SliderStops\n slider=\"centered\"\n minValue={minValue}\n maxValue={maxValue}\n step={step}\n orientation={orientation}\n showInBetweenSteps={showInBetweenSteps}\n maxStops={maxStops}\n />\n </SliderTrack>\n </div>\n </>\n );\n }}\n </AriaSlider>\n );\n};\n"],"mappings":";;;;;;;;A,yDCwCakB,KAAoC,EAC7C,UACA,eACA,UAAO,SACP,cAAW,GACX,cAAW,KACX,UAAO,GACP,mBAAiBC,IAAWC,KAAY,GACxC,uBACA,aACA,mBACA,cACA,GAAGC,QAGC,kBAACrB,GAAD;CACc;CACA;CACJ;CACQ;CACd,YAAY,MACRC,EACIM,GACAC,GACA,OAAOe,KAAc,aACfA,EAAUC,CAAW,IACrBD,CACV;CAEJ,GAAIF;CAEF,WAAA,EAAE,gBAAa,UAAO,oBAAiB;EACrC,IAAMI,IAAaC,EAAM,gBAAgB,CAAC,GACpCC,IACFC,MAAgB,eAAe,eAAe,aAE5CC,IAAS,IAETC,IAAM,KAAK,IAAIL,IAAaI,CAAM,IAAI,KACtCE,IAAQ,KAAK,IAAIN,GAAYI,CAAM,IAAI,KACvCG,IAAM,KAAK,IAAI,IAAIP,GAAYI,CAAM,IAAI,KAEzCI,IACFR,IAAa,KACP,UACAA,IAAa,KACX,QACA,KAAA;EAEZ,OACI,kBAAAvB,GAAA,EAAA,UAAA,CACKiC,KAAS,kBAAChC,GAAD,EAAA,UAAQgC,EAAa,CAAA,GAE/B,kBAAC,OAAD;GACI,WAAWlC,EAAKU,CAAoB;GACpC,oBAAkBiB;GAElB,UAAA,kBAACQ,GAAD;IACI,WAAWnC,EACPoC,GACA5B,EAAiB6B,CAAI,CACzB;IAJJ,UAAA;KAMI,kBAAC,OAAD;MACI,WAAWrC,EAAKW,CAAiB;MACjC,oBAAkBgB;MAFtB,UAAA;OAII,kBAAC,OAAD;QACI,WAAW3B,EACPS,GACAN,EAAO,iBACX;QACA,yBACI6B,MAAoB,WACpB,KAAA;QAEJ,cAAW;QACX,oBAAkBL;QAClB,YACIH,MAAeI,KAAU,KAAA;QAE7B,iBAAeU,KAAc,KAAA;QAC7B,OAAO,GACFZ,IAAU,GAAGI,EAAK,GACvB;OAAE,CAAA;OAGN,kBAAC,OAAD;QACI,WAAW9B,EAAKY,CAAiB;QACjC,oBAAkBe;QAClB,cAAW;QACX,iBAAeW,KAAc,KAAA;QAC7B,OAAO,GACFZ,IAAU,GAAGG,EAAG,GACrB;QAEA,UAAA,kBAAC,OAAD,EAAK,kBAAgBG,EAAgB,CAAA;OACpC,CAAA;OAEL,kBAAC,OAAD;QACI,WAAWhC,EACPS,GACAN,EAAO,iBACX;QACA,oBAAkBwB;QAClB,cAAW;QACX,yBACIK,MAAoB,SACpB,KAAA;QAEJ,YACIR,MAAeI,KAAU,KAAA;QAE7B,iBAAeU,KAAc,KAAA;QAC7B,OAAO,GACFZ,IAAU,GAAGK,EAAG,GACrB;OAAE,CAAA;MAEL;;KAEL,kBAAC3B,GAAD;MACU;MACO;MACb,cAAYmC;MACI;KAAe,CAAA;KAGnC,kBAAC1B,GAAD;MACI,QAAO;MACG;MACA;MACJ;MACO;MACO;MACV;KAAS,CAAA;IAEd;;EACZ,CAAA,CACT,EAAA,CAAA;CAER;AACQ,CAAA"}

package/dist/chunks/ComboBox CHANGED Viewed

@@ -8,7 +8,7 @@ import { t as c } from "./context";
 import l from "clsx";
 import { jsx as u, jsxs as d } from "react/jsx-runtime";
 import { ComboBox as f, ComboBoxValue as p, TagGroup as m, TagList as h } from "react-aria-components";
-import '../assets/ComboBox.css';//#region src/components/Input/Select/ComboBox/comboBox.module.css
+import '../assets/ComboBox.css';// src/components/Input/Select/ComboBox/comboBox.module.css
 var g = {
 	"selected-value": "_selected-value_4mif5_2",
 	"tag-list": "_tag-list_4mif5_14"
@@ -51,7 +51,6 @@ var g = {
 		});
 	}
 });
-//#endregion
 export { _ as t };
 //# sourceMappingURL=ComboBox.map

package/dist/chunks/ComboBox.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ComboBox","names":["renderProps"],"sources":["../../src/components/Input/Select/ComboBox/comboBox.module.css","../../src/components/Input/Select/ComboBox/ComboBox.tsx"],"sourcesContent":["@layer adgytec.comps {\n .selected-value {\n color: var(--editor-color);\n\n padding-inline-start: var(--md-sys-layout-space-16);\n padding-inline-end: var(--md-sys-layout-space-12);\n\n &[data-placeholder] {\n color: var(--placeholder-color);\n display: none;\n }\n }\n\n .tag-list {\n display: flex;\n gap: var(--md-sys-layout-space-8);\n\n flex-wrap: wrap;\n }\n}\n","import clsx from \"clsx\";\nimport {\n ComboBox as AriaComboBox,\n ComboBoxValue,\n TagGroup,\n TagList,\n} from \"react-aria-components\";\nimport { Tag } from \"@/components/Tag\";\nimport { typography } from \"@/utils\";\nimport { Colors, InputGroupStyles, SupportingTextStyles } from \"../../core\";\nimport { Description } from \"../../Description\";\nimport { FieldError } from \"../../FieldError\";\nimport { Label } from \"../../Label\";\nimport styles from \"./comboBox.module.css\";\nimport { ComboboxContext } from \"./context\";\nimport type { ComboBoxProps } from \"./types\";\n\nexport const ComboBox = <\n T extends object,\n M extends \"single\" \| \"multiple\" = \"single\",\n>({\n label,\n description,\n errorMessage,\n showDescriptionOnInvalid = false,\n children,\n className,\n hideMultiSelectionValue = false,\n ...props\n}: ComboBoxProps<T, M>) => {\n return (\n <AriaComboBox\n className={(renderProps) =>\n clsx(\n Colors,\n InputGroupStyles,\n typeof className === \"function\"\n ? className(renderProps)\n : className\n )\n }\n {...props}\n >\n {(renderProps) => {\n const { isInvalid } = renderProps;\n const showDescription =\n description &&\n (!isInvalid \|\| (isInvalid && showDescriptionOnInvalid));\n\n return (\n <ComboboxContext value={renderProps}>\n {label && <Label>{label}</Label>}\n\n {typeof children === \"function\"\n ? children(renderProps)\n : children}\n\n {props.selectionMode === \"multiple\" &&\n !hideMultiSelectionValue && (\n <ComboBoxValue<T>\n className={clsx(\n styles[\"selected-value\"],\n typography.bodyLarge\n )}\n >\n {({ state }) => {\n return (\n <TagGroup\n aria-label=\"Selected Items\"\n onRemove={(keys) => {\n if (\n Array.isArray(\n state.value\n )\n ) {\n state.setValue(\n state.value.filter(\n (k) =>\n !keys.has(k)\n )\n );\n }\n }}\n >\n <TagList\n items={state.selectedItems}\n className={clsx(\n styles[\"tag-list\"]\n )}\n >\n {(item) => (\n <Tag\n id={item.key}\n label={\n item.textValue\n }\n />\n )}\n </TagList>\n </TagGroup>\n );\n }}\n </ComboBoxValue>\n )}\n\n {showDescription && (\n <Description className={clsx(SupportingTextStyles)}>\n {description}\n </Description>\n )}\n\n <FieldError className={clsx(SupportingTextStyles)}>\n {errorMessage}\n </FieldError>\n </ComboboxContext>\n );\n }}\n </AriaComboBox>\n );\n};\n"],"mappings":";;;;;;;;;;;;;;~~GCiBa~~,KAGX,EACE,UACA,gBACA,iBACA,8BAA2B,IAC3B,aACA,cACA,6BAA0B,IAC1B,~~GAAG~~,QAGC,~~kBAAC~~,GAAD;CACI,YAAY,~~MACR~~,~~EACI~~,~~GACA~~,GACA,~~OAAO~~,KAAc,~~aACf~~,~~EAAU~~,CAAW,~~IACrB~~,CACV;CAEJ,~~GAAI~~;~~YAEFA~~,MAAgB;EACd,IAAM,EAAE,iBAAcA,~~GAChB~~,~~IACF~~,MACC,~~CAAC~~,~~KAAc~~,~~KAAa~~;EAEjC,OACI,~~kBAAC~~,GAAD;GAAiB,~~OAAOA~~;~~aAAxB~~;~~IACK~~,KAAS,~~kBAAC~~,GAAD,EAAA,~~UAAQ~~,EAAa,CAAA;IAE9B,~~OAAO~~,KAAa,~~aACf~~,~~EAASA~~,CAAW,~~IACpB~~;~~IAEL~~,EAAM,kBAAkB,cACrB,~~CAAC~~,KACG,~~kBAAC~~,GAAD;KACI,~~WAAW~~,~~EACP~~,EAAO,~~mBACP~~,EAAW,SACf;~~gBAEE~~,EAAE,eAEI,~~kBAAC~~,GAAD;MACI,cAAW;MACX,WAAW,MAAS;OAChB,AACI,MAAM,~~QACF~~,EAAM,KACV,~~KAEA~~,EAAM,~~SACF~~,EAAM,MAAM,QACP,MACG,~~CAAC~~,EAAK,~~IAAI~~,CAAC,CACnB,CACJ;MAER;~~gBAEA~~,~~kBAAC~~,GAAD;OACI,~~OAAO~~,EAAM;OACb,~~WAAW~~,~~EACP~~,EAAO,WACX;~~kBAEE~~,MACE,~~kBAAC~~,GAAD;QACI,IAAI,EAAK;QACT,~~OACI~~,EAAK;OACR,CAAA;MAGJ,CAAA;KACH,CAAA;IAGP,CAAA;~~IAGtB~~,KACG,~~kBAAC~~,GAAD;KAAa,~~WAAW~~,~~EAAK~~,CAAoB;~~eAC5C~~;IACQ,CAAA;IAGjB,~~kBAAC~~,GAAD;KAAY,~~WAAW~~,~~EAAK~~,CAAoB;~~eAC3C~~;IACO,CAAA;GACC;;CAEzB;AACU,CAAA"}
1	+ {"version":3,"file":"ComboBox","names":["renderProps","ComboBox","AriaComboBox","clsx","Label","styles","Tag","FieldError","typography","FieldError$1","Label$1","InputGroupStyles","SupportingTextStyles","Colors","Tag$1","ComboboxContext","clsx$1","comboBox_module_default","ComboBox$1","props","ComboBox","className","renderProps","renderProps_0","showDescription","description","isInvalid","showDescriptionOnInvalid","label","children","hideMultiSelectionValue","ComboBoxValue","TagGroup","state","keys","k","TagList","item","Description","errorMessage"],"sources":["../../src/components/Input/Select/ComboBox/comboBox.module.css","../../src/components/Input/Select/ComboBox/ComboBox.tsx"],"sourcesContent":["@layer adgytec.comps {\n .selected-value {\n color: var(--editor-color);\n\n padding-inline-start: var(--md-sys-layout-space-16);\n padding-inline-end: var(--md-sys-layout-space-12);\n\n &[data-placeholder] {\n color: var(--placeholder-color);\n display: none;\n }\n }\n\n .tag-list {\n display: flex;\n gap: var(--md-sys-layout-space-8);\n\n flex-wrap: wrap;\n }\n}\n","import clsx from \"clsx\";\nimport {\n ComboBox as AriaComboBox,\n ComboBoxValue,\n TagGroup,\n TagList,\n} from \"react-aria-components\";\nimport { Tag } from \"@/components/Tag\";\nimport { typography } from \"@/utils\";\nimport { Colors, InputGroupStyles, SupportingTextStyles } from \"../../core\";\nimport { Description } from \"../../Description\";\nimport { FieldError } from \"../../FieldError\";\nimport { Label } from \"../../Label\";\nimport styles from \"./comboBox.module.css\";\nimport { ComboboxContext } from \"./context\";\nimport type { ComboBoxProps } from \"./types\";\n\n/*\n An autocomplete combobox component combining a text input field with a searchable options list popover.\n \n Implements Material Design 3 guidelines for auto-complete search inputs, supporting single or multi-selection,\n * removable selection tag chips, keyboard navigation, and custom filter matching.\n \n @example\n * ```tsx\n * import {\n * ComboBox,\n * ComboBoxTrigger,\n * ComboBoxPopover,\n * SelectList,\n * SelectItem\n * } from '@adgytec/web-ui-components';\n \n <ComboBox label=\"Favorite Framework\">\n * <ComboBoxTrigger placeholder=\"Type to search...\" />\n * <ComboBoxPopover>\n * <SelectList>\n * <SelectItem id=\"react\" label=\"React\" />\n * <SelectItem id=\"vue\" label=\"Vue\" />\n * <SelectItem id=\"svelte\" label=\"Svelte\" />\n * </SelectList>\n * </ComboBoxPopover>\n * </ComboBox>\n * ```\n */\nexport const ComboBox = <\n T extends object,\n M extends \"single\" \| \"multiple\" = \"single\",\n>({\n label,\n description,\n errorMessage,\n showDescriptionOnInvalid = false,\n children,\n className,\n hideMultiSelectionValue = false,\n ...props\n}: ComboBoxProps<T, M>) => {\n return (\n <AriaComboBox\n className={(renderProps) =>\n clsx(\n Colors,\n InputGroupStyles,\n typeof className === \"function\"\n ? className(renderProps)\n : className\n )\n }\n {...props}\n >\n {(renderProps) => {\n const { isInvalid } = renderProps;\n const showDescription =\n description &&\n (!isInvalid \|\| (isInvalid && showDescriptionOnInvalid));\n\n return (\n <ComboboxContext value={renderProps}>\n {label && <Label>{label}</Label>}\n\n {typeof children === \"function\"\n ? children(renderProps)\n : children}\n\n {props.selectionMode === \"multiple\" &&\n !hideMultiSelectionValue && (\n <ComboBoxValue<T>\n className={clsx(\n styles[\"selected-value\"],\n typography.bodyLarge\n )}\n >\n {({ state }) => {\n return (\n <TagGroup\n aria-label=\"Selected Items\"\n onRemove={(keys) => {\n if (\n Array.isArray(\n state.value\n )\n ) {\n state.setValue(\n state.value.filter(\n (k) =>\n !keys.has(k)\n )\n );\n }\n }}\n >\n <TagList\n items={state.selectedItems}\n className={clsx(\n styles[\"tag-list\"]\n )}\n >\n {(item) => (\n <Tag\n id={item.key}\n label={\n item.textValue\n }\n />\n )}\n </TagList>\n </TagGroup>\n );\n }}\n </ComboBoxValue>\n )}\n\n {showDescription && (\n <Description className={clsx(SupportingTextStyles)}>\n {description}\n </Description>\n )}\n\n <FieldError className={clsx(SupportingTextStyles)}>\n {errorMessage}\n </FieldError>\n </ComboboxContext>\n );\n }}\n </AriaComboBox>\n );\n};\n"],"mappings":";;;;;;;;;;;;;;A,GC6CaC,KAGX,EACE,UACA,gBACA,iBACA,8BAA2B,IAC3B,aACA,cACA,6BAA0B,IAC1B,GAAGkB,QAGC,kBAACjB,GAAD;CACI,YAAY,MACRC,EACIU,GACAF,GACA,OAAOU,KAAc,aACfA,EAAUC,CAAW,IACrBD,CACV;CAEJ,GAAIF;CAEFnB,WAAAA,MAAgB;EACd,IAAM,EAAE,iBAAcA,GAChBwB,IACFC,MACC,CAACC,KAAcA,KAAaC;EAEjC,OACI,kBAACZ,GAAD;GAAiB,OAAOf;GAAxB,UAAA;IACK4B,KAAS,kBAACxB,GAAD,EAAA,UAAQwB,EAAa,CAAA;IAE9B,OAAOC,KAAa,aACfA,EAAS7B,CAAW,IACpB6B;IAELV,EAAM,kBAAkB,cACrB,CAACW,KACG,kBAACC,GAAD;KACI,WAAW5B,EACPE,EAAO,mBACPG,EAAW,SACf;KAEE,WAAA,EAAE,eAEI,kBAACwB,GAAD;MACI,cAAW;MACX,WAAW,MAAS;OAChB,AACI,MAAM,QACFC,EAAM,KACV,KAEAA,EAAM,SACFA,EAAM,MAAM,QACP,MACG,CAACC,EAAK,IAAIC,CAAC,CACnB,CACJ;MAER;MAEA,UAAA,kBAACC,GAAD;OACI,OAAOH,EAAM;OACb,WAAW9B,EACPE,EAAO,WACX;OAEE,WAAA,MACE,kBAACC,GAAD;QACI,IAAI+B,EAAK;QACT,OACIA,EAAK;OACR,CAAA;MAGJ,CAAA;KACH,CAAA;IAGP,CAAA;IAGtBb,KACG,kBAACc,GAAD;KAAa,WAAWnC,EAAKS,CAAoB;KAC5C,UAAAa;IACQ,CAAA;IAGjB,kBAAClB,GAAD;KAAY,WAAWJ,EAAKS,CAAoB;KAC3C,UAAA2B;IACO,CAAA;GACC;;CAEzB;AACU,CAAA"}

package/dist/chunks/ComboBoxPopover CHANGED Viewed

@@ -7,7 +7,6 @@ import '../assets/ComboBoxPopover.css';var r = { popover: "_popover_1iwyn_2" },
 	crossOffset: a,
 	...s
 });
-//#endregion
 export { i as t };
 //# sourceMappingURL=ComboBoxPopover.map

package/dist/chunks/ComboBoxPopover.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ComboBoxPopover","names":[],"sources":["../../src/components/Input/Select/ComboBoxPopover/comboBoxPopover.module.css","../../src/components/Input/Select/ComboBoxPopover/ComboBoxPopover.tsx"],"sourcesContent":["@layer adgytec.comps {\n .popover {\n inline-size: calc(var(--trigger-width) + calc(30 * var(--dp, 1px)));\n\n display: grid;\n grid-template-rows: 1fr;\n }\n}\n","import { clsx } from \"clsx\";\nimport { Popover } from \"@/components/Popover\";\nimport styles from \"./comboBoxPopover.module.css\";\n\~~nexport~~ ~~const~~ ComboBoxPopover: ~~React.FC<\~~n React.ComponentPropsWithRef<typeof Popover>\n> = ({\n offset = 25, // (58dp trigger height - 20dp text line-height) / 2 + 2dp outline + 4dp space\n crossOffset = -17, // 16dp padding + 1dp border\n className,\n ...props\n}) => {\n return (\n <Popover\n className={(renderProps) =>\n clsx(\n styles[\"popover\"],\n typeof className === \"function\"\n ? className(renderProps)\n : className\n )\n }\n offset={offset}\n crossOffset={crossOffset}\n {...props}\n />\n );\n};\n"],"mappings":";;;~~yCCIa~~,~~KAER~~,~~EACD~~,YAAS,IACT,iBAAc,KACd,cACA,~~GAAG~~,QAGC,~~kBAAC~~,GAAD;CACI,YAAY,~~MACR~~,~~EACI~~,~~EAAO~~,SACP,~~OAAO~~,KAAc,~~aACf~~,~~EAAU~~,CAAW,~~IACrB~~,CACV;CAEI;CACK;CACb,~~GAAI~~;AAAM,CAAA"}
1	+ {"version":3,"file":"ComboBoxPopover","names":["styles","Popover","comboBoxPopover_module_default","ComboBoxPopover","props","clsx","\"popover\"","className","renderProps"],"sources":["../../src/components/Input/Select/ComboBoxPopover/comboBoxPopover.module.css","../../src/components/Input/Select/ComboBoxPopover/ComboBoxPopover.tsx"],"sourcesContent":["@layer adgytec.comps {\n .popover {\n inline-size: calc(var(--trigger-width) + calc(30 * var(--dp, 1px)));\n\n display: grid;\n grid-template-rows: 1fr;\n }\n}\n","import { clsx } from \"clsx\";\nimport { Popover } from \"@/components/Popover\";\nimport styles from \"./comboBoxPopover.module.css\";\n\n/*\n Props for the {@link ComboBoxPopover} component.\n * Extends {@link Popover} props.\n /\nexport interface ComboBoxPopoverProps\n extends React.ComponentPropsWithRef<typeof Popover> {}\n\n/\n Dropdown popover container sized and positioned specifically beneath a {@link ComboBoxTrigger}.\n */\nexport const ComboBoxPopover: React.FC<ComboBoxPopoverProps> = ({\n offset = 25, // (58dp trigger height - 20dp text line-height) / 2 + 2dp outline + 4dp space\n crossOffset = -17, // 16dp padding + 1dp border\n className,\n ...props\n}) => {\n return (\n <Popover\n className={(renderProps) =>\n clsx(\n styles[\"popover\"],\n typeof className === \"function\"\n ? className(renderProps)\n : className\n )\n }\n offset={offset}\n crossOffset={crossOffset}\n {...props}\n />\n );\n};\n"],"mappings":";;;A,yCCcaG,KAAmD,EAC5D,YAAS,IACT,iBAAc,KACd,cACA,GAAGC,QAGC,kBAACH,GAAD;CACI,YAAY,MACRI,EACIL,EAAOM,SACP,OAAOC,KAAc,aACfA,EAAUC,CAAW,IACrBD,CACV;CAEI;CACK;CACb,GAAIH;AAAM,CAAA"}