npm - @adgytec/adgytec-web-ui-components - Versions diffs - 2.2.0 → 2.3.1 - Mend

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

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 (504) hide show

package/dist/chunks/core.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"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"}
1	+ {"version":3,"file":"core","names":["styles","styles","styles","renderProps","iconToRender","iconSize","handlePress","_c","clsx","styles","AriaToggleButton","_c","TooltipTrigger","Tooltip","require_compiler_runtime","typography","Icon","Splash","useSplash","Tooltip$1","TooltipTrigger$1","clsx$1","button_module_default","ButtonReset","ButtonCore","newButtonBaseDataAttrs","shape","size","color","color_module_default","buttonColorConfig","buttonColorBase","\"color\"","size_module_default","ButtonIconSizeMapping","IconButtonIconSizeMapping","ButtonLabelTextMapping","buttonSizeConfig","ButtonSizeBase","\"size\"","connectedButton_module_default","import_compiler_runtime","ConnectedButton","$","children","className","icon","iconPlacement","onPress","props","selectedIcon","tooltip","t0","groupIconPlacement","useConnectedButtonGroupContext","buttonIconPlacement","isChildFunc","t1","TapTarget","renderProps","t2","splashInfo","renderProps_0","dataAttrs","isHovered","isDisabled","isFocused","isFocusVisible","isPressed","isSelected","iconToRender","iconSize","iconComp","t3","handlePress","ToggleButton","t4","withTooltip","useButtonConfig","buttonGroupSize","buttonGroupShape","buttonGroupColor","buttonGroupIconPlacement","useButtonGroupContext","buttonSize","buttonShape","buttonColor","node"],"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\n/*\n Determines whether an icon inside a button is rendered before or after the text label.\n \n - `\"start\"`: Renders icon at the leading edge (before text).\n * - `\"end\"`: Renders icon at the trailing edge (after text).\n /\nexport type ButtonIconPlacement = \"start\" \| \"end\";\n\n/\n Core props shared across standard text/label button components (e.g. `Button`, `LinkButton`).\n /\nexport interface ButtonBaseProps {\n /* Visual style and color scheme of the button. Defaults to `\"filled\"`. /\n color?: ButtonColor;\n /* Size scale of the button. Defaults to `\"small\"`. /\n size?: ButtonSize;\n /* Corner rounding style (`\"round\"` or `\"square\"`). Defaults to `\"round\"`. /\n shape?: ButtonShape;\n /* Optional tooltip text displayed on hover/focus. /\n tooltip?: string;\n /* Optional Lucide icon component displayed alongside label text. /\n icon?: LucideIcon;\n /* Icon placement relative to label text (`\"start\"` or `\"end\"`). Defaults to `\"start\"`. /\n iconPlacement?: ButtonIconPlacement;\n}\n\n/\n Core props shared across icon-only button components (e.g. `IconButton`, `LinkIconButton`).\n /\nexport interface IconButtonBaseProps {\n /* Visual style and color scheme of the icon button. Defaults to `\"standard\"`. /\n color?: IconButtonColor;\n /* Size scale of the icon button. Defaults to `\"small\"`. /\n size?: ButtonSize;\n /* Corner rounding style (`\"round\"` or `\"square\"`). Defaults to `\"round\"`. /\n shape?: ButtonShape;\n /* Width variation (`\"narrow\"`, `\"default\"`, or `\"wide\"`). Defaults to `\"default\"`. /\n width?: IconButtonWidth;\n /* Optional tooltip text displayed on hover/focus. /\n tooltip?: string;\n /* Required Lucide icon component rendered inside the button. /\n icon: LucideIcon;\n}\n\n/* CSS class resetting default button/link styling (outlines, borders, backgrounds). /\nexport const ButtonReset = styles[\"button-reset\"];\n\n/* CSS class providing the core layout and flex alignment for button internals. /\nexport const ButtonCore = styles[\"button-core\"];\n\n/\n Generates standard data attributes (`data-shape`, `data-size`, `data-color`)\n * applied to button DOM nodes for CSS attribute styling.\n \n @param options - Shape, size, and color configuration.\n * @returns Object with data attributes for spreading onto elements.\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\n/\n Fundamental Material 3 button color styles shared across all button variants:\n * - `\"filled\"`: High-emphasis solid surface with inverted text.\n * - `\"tonal\"`: Medium-high emphasis filled container with primary-tonal background.\n * - `\"outlined\"`: Medium-emphasis button with container outline and transparent background.\n /\nexport type CoreButtonColor = \"filled\" \| \"tonal\" \| \"outlined\";\n\n/\n Color variants supported by standard buttons (`Button`, `LinkButton`):\n * - Includes {@link CoreButtonColor} (`\"filled\"`, `\"tonal\"`, `\"outlined\"`).\n * - `\"elevated\"`: Low-emphasis surface container with shadow elevation.\n * - `\"text\"`: Lowest-emphasis flat text button with transparent background.\n /\nexport type ButtonColor = CoreButtonColor \| \"elevated\" \| \"text\";\n\n/\n Color variants supported by toggle buttons (`ToggleButton`):\n * - Includes {@link CoreButtonColor} plus `\"elevated\"`.\n /\nexport type ToggleButtonColor = CoreButtonColor \| \"elevated\";\n\n/\n Color variants supported by icon buttons (`IconButton`, `LinkIconButton`):\n * - Includes {@link CoreButtonColor} plus `\"standard\"` (unfilled, frameless icon).\n /\nexport type IconButtonColor = CoreButtonColor \| \"standard\";\n\n/\n Color variants supported by split buttons (`SplitButton`):\n * - Includes {@link CoreButtonColor} plus `\"elevated\"`.\n /\nexport type SplitButtonColor = CoreButtonColor \| \"elevated\";\n\n/\n Color variants supported by connected button groups (`ConnectedButtonGroup`):\n * - Includes {@link CoreButtonColor} plus `\"elevated\"`.\n /\nexport type ConnectedButtonGroupColor = CoreButtonColor \| \"elevated\";\n\n/\n Union of all valid button color style names across all button components.\n /\nexport type AllButtonColor =\n \| ButtonColor\n \| IconButtonColor\n \| SplitButtonColor\n \| ConnectedButtonGroupColor;\n\n/\n Resolves a button color style name to its CSS module class name.\n \n @param color - The button color identifier.\n * @returns CSS class name applying the color styling rules.\n /\nexport const buttonColorConfig = (color: AllButtonColor) => {\n return styles[color];\n};\n\n/* CSS class providing base color custom properties and transition states. /\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\n/\n Supported size presets for button and button group components.\n * Controls dimensions, typography, icon scale, and internal padding.\n /\nexport type ButtonSize =\n \| \"extra-small\"\n \| \"small\"\n \| \"medium\"\n \| \"large\"\n \| \"extra-large\";\n\n/\n Maps each {@link ButtonSize} preset to its recommended icon size in pixels\n * for standard labeled buttons (with leading or trailing icons).\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\n/\n Maps each {@link ButtonSize} preset to its recommended icon size in pixels\n * for icon-only buttons (e.g. `IconButton`, `ToggleIconButton`, `LinkIconButton`).\n * Note that the `\"small\"` preset uses 24px for icon buttons compared to 20px in labeled buttons.\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\n/\n Maps each {@link ButtonSize} preset to its typography token class name\n * for button label text.\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\n/\n Resolves the CSS module class name for a given button size preset.\n \n @param size - The button size preset to retrieve styling for.\n * @returns The CSS module class name corresponding to the specified size.\n /\nexport const buttonSizeConfig = (size: ButtonSize) => {\n return styles[size];\n};\n\n/\n Base CSS module class name applying common layout and sizing structure across buttons.\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 withTooltip,\n} from \"../../core\";\nimport { useConnectedButtonGroupContext } from \"../ButtonGroupContext\";\nimport styles from \"./connectedButton.module.css\";\nimport type { ConnectedButtonProps } from \"./types\";\n\n/\n An individual toggle button designed for use inside a {@link ConnectedButtonGroup}.\n \n Inherits size, shape, and color styling from the parent `ConnectedButtonGroupContext`,\n * rendering border lines and corner radii coordinated with its neighboring buttons in the segment.\n \n Built on top of React Aria's `ToggleButton`.\n \n @example\n * ```tsx\n * <ConnectedButton id=\"bold\" icon={Bold} aria-label=\"Bold text\" />\n * ```\n /\nexport const ConnectedButton: React.FC<ConnectedButtonProps> = ({\n icon,\n selectedIcon,\n children,\n onPress,\n iconPlacement,\n tooltip,\n className,\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 withTooltip(\n <AriaToggleButton\n onPress={handlePress}\n className={(renderProps) =>\n clsx(\n ButtonReset,\n TapTarget,\n buttonColorConfig(color),\n typeof className === \"function\"\n ? className(renderProps)\n : className\n )\n }\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 tooltip\n );\n};\n","import { useButtonGroupContext } from \"../ButtonGroups\";\nimport type { ButtonIconPlacement } from \"./button\";\nimport type { ButtonShape } from \"./shape\";\nimport type { ButtonSize } from \"./sizes\";\n\n/\n Configuration options passed to {@link useButtonConfig} to resolve button styles.\n /\ntype ButtonConfigOptions<C extends string> = {\n /* Explicit button size preset override. /\n size?: ButtonSize;\n /* Explicit button corner shape override. /\n shape?: ButtonShape;\n /* Explicit button color style override. /\n color?: C;\n /* Explicit icon placement override relative to label. /\n iconPlacement?: ButtonIconPlacement;\n};\n\n/\n Resolves button configuration by prioritizing component-level props and falling back\n * to contextual values from an ancestor `ButtonGroupContext` (or system defaults).\n \n @template C - String union of allowed color variant values for the button type.\n * @param options - Component-level prop overrides.\n * @returns Resolved visual configuration: `buttonSize`, `buttonShape`, `buttonColor`, and `buttonIconPlacement`.\n \n @example\n * ```tsx\n * const { buttonSize, buttonShape, buttonColor, buttonIconPlacement } = useButtonConfig({\n * size,\n * shape,\n * color,\n * iconPlacement,\n * });\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 { ReactNode } from \"react\";\nimport { Tooltip, TooltipTrigger } from \"@/components/Tooltip\";\n\n/\n Conditionally wraps a React node in a tooltip trigger when tooltip text is provided.\n \n @param node - The React element to display (e.g. button or icon button).\n * @param tooltip - The optional tooltip text to show on hover/focus. If omitted or empty, `node` is returned unwrapped.\n * @returns The wrapped element with tooltip, or the original node if no tooltip was supplied.\n */\nexport const withTooltip = (node: ReactNode, tooltip?: string) => {\n if (!tooltip) return node;\n\n return (\n <TooltipTrigger>\n {node}\n\n <Tooltip>{tooltip}</Tooltip>\n </TooltipTrigger>\n );\n};\n"],"mappings":";;;;;;;;;;;;;;;GCoDauB,IAAcvB,EAAO,iBAGrBwB,IAAaxB,EAAO;AASjC,SAAgByB,EAAuB,EACnC,UACA,SACA,YAKD;CACC,OAAO;EACH,cAAcC;EACd,aAAaC;EACb,cAAcC;CAClB;AACJ;;;;;;;;;GErBaE,KAAqB,MACvB7B,EAAO2B,IAILG,IAAkB9B,EAAO+B;;;;;;;GE5CzBE,IAAoD;CAC7D,eAAe;CACf,OAAO;CACP,QAAQ;CACR,OAAO;CACP,eAAe;AACnB,GAOaC,IAAwD;CACjE,eAAe;CACf,OAAO;CACP,QAAQ;CACR,OAAO;CACP,eAAe;AACnB,GAMaC,IAAqD;CAC9D,eAAerB,EAAW;CAC1B,OAAOA,EAAW;CAClB,QAAQA,EAAW;CACnB,OAAOA,EAAW;CAClB,eAAeA,EAAW;AAC9B,GAQasB,KAAoB,MACtBnC,EAAOyB,IAMLW,IAAiBpC,EAAOqC,kDEhCxBG,KAAkD,MAAA;CAAA,IAAAC,KAAA,GAAApC,EAAAA,EAAAA,CAAA,EAAA,GAAAqC,GAAAC,GAAAC,GAAAC,GAAAC,GAAAC,GAAAC,GAAAC;CAAA,AAAAR,EAAA,OAAAS,KAS9D,IAAAT,EAAA,IAAA,IAAAA,EAAA,IAAA,IAAAA,EAAA,IAAA,IAAAA,EAAA,IAAA,IAAAA,EAAA,IAAA,IAAAA,EAAA,IAAA,IAAAA,EAAA,IAAA,IAAAA,EAAA,OAT+D,gGAAA,GAAAM,KAAAG,GAS/D,EAAA,KAAAA,GAAA,EAAA,KAAAR,GAAA,EAAA,KAAAC,GAAA,EAAA,KAAAC,GAAA,EAAA,KAAAC,GAAA,EAAA,KAAAC,GAAA,EAAA,KAAAC,GAAA,EAAA,KAAAC,GAAA,EAAA,KAAAC;CACG,IAAA,EAAA,UAAA,SAAA,UAAA,eAAAE,MAKIC,EAA+B,GAEnCC,IAA4BR,KAAAM,KAAA,SAE5B,EAAA,eAAA,mBAAoCnC,EAAU8B,CAAO,GACrDQ,IAAoB,OAAOZ,KAAa,YAAWa;CAAA,AAAAd,EAAA,OAAAE,KAAAF,EAAA,QAAAf,KAKhC,KAAA,MACPpB,EACIe,GACAmC,GACA5B,EAAkBF,CAAK,GACvB,OAAOiB,KAAc,aACfA,EAAUc,CACF,IAFdd,CAGJ,GAAC,EAAA,KAAAA,GAAA,EAAA,MAAAjB,GAAA,EAAA,MAAA6B,KAAA,IAAAd,EAAA;CAAA,IAAAiB;CAAA,AAAAjB,EAAA,QAAAY,KAAAZ,EAAA,QAAAC,KAAAD,EAAA,QAAAG,KAAAH,EAAA,QAAAa,KAAAb,EAAA,QAAAO,KAAAP,EAAA,QAAAjB,KAAAiB,EAAA,QAAAhB,KAAAgB,EAAA,QAAAkB,KAMJ,KAAA,MAAA;EACG,IAAA,EAAA,eAAA,eAAA,mBAAA,cAAA,cAAA,iBAOI1D,GAEJ4D,IAAkB;GAAA,gBACEC,KAAA,KAAA;GAAsB,iBACrBC,KAAA,KAAA;GAAuB,gBACxBC,KAAA,KAAA;GAAsB,sBAChBC,KAAA,KAAA;GAA2B,gBACjCC,KAAA,KAAA;GAAsB,iBACrBC,KAAA,KAAA;GAAuB,sBAClB;GAAI,cACZ3C;GAAK,sBACG;EAC1B,GAEA4C,IAAmBxB;EACnB,AAAIuB,KAAAnB,MAA4B,IAAeA;EAE/C,IAAAqB,IAAiBrC,EAAsBP,IACvC6C,IAAiBF,KACb,kBAACtD,GAAD;GAAYZ,MAAAkE;GAAoBjE,MAAAkE;EAAQ,CAAA;EAC1C,OAGE,kBAAA,QAAA;GAgBO,GAfCR;GACO,WAAAvD,EACPgB,GACAO,GACAK,EAAuBT,IACvBlB,EAAM,MACV;GAPJ,UAAA;IASKoD,KAAc,kBAAC5C,GAAD,EAAO,GAAK4C,EAAU,CAAA;IAEpCN,MAAwB,WAAxBiB;IAEAhB,IAAcZ,EAASzC,CAAsB,IAA7CyC;IAEAW,MAAwB,SAAxBiB;GACE;;CAAA,GAEd,EAAA,MAAAjB,GAAA,EAAA,MAAAX,GAAA,EAAA,MAAAE,GAAA,EAAA,MAAAU,GAAA,EAAA,MAAAN,GAAA,EAAA,MAAAxB,GAAA,EAAA,MAAAC,GAAA,EAAA,MAAAkC,GAAA,EAAA,MAAAD,KAAA,IAAAjB,EAAA;CAAA,IAAA8B;CAAA,AAAA9B,EAAA,QAAA+B,KAAA/B,EAAA,QAAAM,KAAAN,EAAA,QAAAc,KAAAd,EAAA,QAAAiB,KAjEL,IAAA,kBAAClD,GAAD;EACaJ,SAAAoE;EACE,WAAAjB;EAQN,GAEDR;EACmB,yBAAA;EACvB,eAAA;EAEC,UAAAW;CAhBY,CAAA,GAkEE,EAAA,MAAAc,GAAA,EAAA,MAAAzB,GAAA,EAAA,MAAAQ,GAAA,EAAA,MAAAG,GAAA,EAAA,MAAAa,KAAA,IAAA9B,EAAA;CAAA,IAAAiC;CAEtB,OAFsBjC,EAAA,QAAA8B,KAAA9B,EAAA,QAAAQ,KAnEhB,IAAA0B,EACHJ,GAmEAtB,CACJ,GAAC,EAAA,MAAAsB,GAAA,EAAA,MAAAtB,GAAA,EAAA,MAAAyB,KAAA,IAAAjC,EAAA,KArEMiC;AAqEN;;;ACtFL,SAAOE,EAAA,GAAA;CAAA,IAAAnC,KAAA,GAAAhC,EAAAA,EAAAA,CAAA,CAAA,GAA2C,EAAA,SAAA,UAAA,UAAA,qBAAAyC,GAM9C,EAAA,MAAA2B,GAAA,OAAAC,GAAA,OAAAC,GAAA,eAAAC,MAKIC,EAAsB,GAE1BC,IAAmBzD,KAAAoD,KAAA,SACnBM,IAAoB3D,KAAAsD,KAAA,SACpBM,IAAoB1D,KAAAqD,KAAA,UACpB1B,IACIR,KAAAmC,KAAA,SAAqDzB;CAEW,OAFXd,EAAA,OAAA2C,KAAA3C,EAAA,OAAAY,KAAAZ,EAAA,OAAA0C,KAAA1C,EAAA,OAAAyC,KAElD,IAAA;EAAA;EAAA;EAAA;EAAA;CAA4D,GAAC,EAAA,KAAAE,GAAA,EAAA,KAAA/B,GAAA,EAAA,KAAA8B,GAAA,EAAA,KAAAD,GAAA,EAAA,KAAA3B,KAAA,IAAAd,EAAA,IAA7Dc;AAA6D;;;AC9CxE,IAAaoB,KAAe,GAAiB,MACpC1B,IAGD,kBAACvC,GAAD,EAAA,UAAA,CACK2E,GAED,kBAAC1E,GAAD,EAAA,UAAUsC,EAAiB,CAAA,CACf,EAAA,CAAA,IAPCoC"}

package/dist/chunks/core2.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"core2","names":[],"sources":["../../src/components/Button/SplitButton/core/size.module.css","../../src/components/Button/SplitButton/core/size.ts"],"sourcesContent":["@layer adgytec.comps {\n .size {\n border-start-start-radius: var(--_shape-start-start);\n border-start-end-radius: var(--_shape-start-end);\n border-end-start-radius: var(--_shape-end-start);\n border-end-end-radius: var(--_shape-end-end);\n\n padding-inline-start: var(--_md-split-button-padding-inline-start);\n padding-inline-end: var(--_md-split-button-padding-inline-end);\n\n padding-block: var(--_md-button-padding-block);\n\n display: flex;\n gap: var(--_md-button-icon-label-gap);\n align-items: center;\n justify-content: center;\n\n box-sizing: border-box;\n min-inline-size: var(--min-tap-target-size);\n }\n\n .primary {\n /* shape /\n --_inner-shape: var(--_md-split-button-inner-corner-shape);\n\n --_shape-start-end: var(--_inner-shape);\n --_shape-end-end: var(--_inner-shape);\n\n --_shape-start-start: var(--_md-split-button-outer-corner-shape);\n --_shape-end-start: var(--_md-split-button-outer-corner-shape);\n\n / padding /\n --_md-split-button-padding-inline-start-base: var(\n --_md-split-button-primary-padding-inline-start\n );\n --_md-split-button-padding-inline-start: var(\n --_md-split-button-padding-inline-start-base\n );\n\n --_md-split-button-padding-inline-end-base: var(\n --_md-split-button-primary-padding-inline-end\n );\n --_md-split-button-padding-inline-end: var(\n --_md-split-button-padding-inline-end-base\n );\n\n --_md-button-padding-block-base: var(\n --_md-split-button-primary-padding-block\n );\n --_md-button-padding-block: var(--_md-button-padding-block-base);\n\n &[data-hovered] {\n --_inner-shape: var(\n --_md-split-button-interaction-inner-corner-shape\n );\n }\n\n &[data-pressed] {\n --_inner-shape: var(\n --_md-split-button-interaction-inner-corner-shape\n );\n }\n }\n\n .trigger {\n / shape /\n --_inner-shape: var(--_md-split-button-inner-corner-shape);\n\n --_shape-start-end: var(--_md-split-button-outer-corner-shape);\n --_shape-end-end: var(--_md-split-button-outer-corner-shape);\n\n --_shape-start-start: var(--_inner-shape);\n --_shape-end-start: var(--_inner-shape);\n\n / padding /\n --_md-split-button-padding-inline-start-base: var(\n --_md-split-button-trigger-padding-inline-start\n );\n --_md-split-button-padding-inline-start: var(\n --_md-split-button-padding-inline-start-base\n );\n\n --_md-split-button-padding-inline-end-base: var(\n --_md-split-button-trigger-padding-inline-end\n );\n --_md-split-button-padding-inline-end: var(\n --_md-split-button-padding-inline-end-base\n );\n\n --_md-button-padding-block-base: var(\n --_md-split-button-trigger-padding-block\n );\n --_md-button-padding-block: var(--_md-button-padding-block-base);\n\n &[data-hovered] {\n --_inner-shape: var(\n --_md-split-button-interaction-inner-corner-shape\n );\n }\n\n &[data-pressed] {\n --_inner-shape: var(--_md-split-button-trigger-pressed-shape);\n\n --_md-split-button-padding-inline-start-base: var(\n --_md-split-button-trigger-pressed-padding-inline-start\n );\n --_md-split-button-padding-inline-end-base: var(\n --_md-split-button-trigger-pressed-padding-inline-end\n );\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-split-button-outer-corner-shape: var(\n --md-sys-shape-corner-radius-full\n );\n --_md-split-button-inner-corner-shape: var(\n --md-sys-shape-corner-radius-extra-small\n );\n --_md-split-button-interaction-inner-corner-shape: var(\n --md-sys-shape-corner-radius-small\n );\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 /* primary button /\n --_md-split-button-primary-padding-inline-start: var(\n --md-sys-layout-space-12\n );\n --_md-split-button-primary-padding-inline-end: calc(\n 10 \n var(--dp, 1px)\n );\n\n --_md-split-button-primary-padding-block: calc(6 * var(--dp, 1px));\n\n /* trigger button /\n --_md-split-button-trigger-padding-inline-start: var(\n --md-sys-layout-space-12\n );\n --_md-split-button-trigger-padding-inline-end: calc(\n 14 \n var(--dp, 1px)\n );\n\n --_md-split-button-trigger-pressed-padding-inline-start: calc(\n 13 \n var(--dp, 1px)\n );\n --_md-split-button-trigger-pressed-padding-inline-end: calc(\n 13 \n var(--dp, 1px)\n );\n\n --_md-split-button-trigger-padding-block: calc(5 * var(--dp, 1px));\n --_md-split-button-trigger-pressed-shape: var(\n --md-sys-shape-corner-radius-full\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-split-button-outer-corner-shape: var(\n --md-sys-shape-corner-radius-full\n );\n --_md-split-button-inner-corner-shape: var(\n --md-sys-shape-corner-radius-extra-small\n );\n --_md-split-button-interaction-inner-corner-shape: var(\n --md-sys-shape-corner-radius-small\n );\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 /* primary button /\n --_md-split-button-primary-padding-inline-start: var(\n --md-sys-layout-space-16\n );\n --_md-split-button-primary-padding-inline-end: var(\n --md-sys-layout-space-12\n );\n\n --_md-split-button-primary-padding-block: calc(10 var(--dp, 1px));\n\n /* trigger button /\n --_md-split-button-trigger-padding-inline-start: var(\n --md-sys-layout-space-12\n );\n --_md-split-button-trigger-padding-inline-end: calc(\n 14 \n var(--dp, 1px)\n );\n\n --_md-split-button-trigger-pressed-padding-inline-start: calc(\n 13 \n var(--dp, 1px)\n );\n --_md-split-button-trigger-pressed-padding-inline-end: calc(\n 13 \n var(--dp, 1px)\n );\n\n --_md-split-button-trigger-padding-block: calc(9 * var(--dp, 1px));\n --_md-split-button-trigger-pressed-shape: var(\n --md-sys-shape-corner-radius-full\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-split-button-outer-corner-shape: var(\n --md-sys-shape-corner-radius-full\n );\n --_md-split-button-inner-corner-shape: var(\n --md-sys-shape-corner-radius-extra-small\n );\n --_md-split-button-interaction-inner-corner-shape: var(\n --md-sys-shape-corner-radius-medium\n );\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 /* primary button /\n --_md-split-button-primary-padding-inline-start: var(\n --md-sys-layout-space-24\n );\n --_md-split-button-primary-padding-inline-end: var(\n --md-sys-layout-space-24\n );\n\n --_md-split-button-primary-padding-block: var(--md-sys-layout-space-16);\n\n / trigger button /\n --_md-split-button-trigger-padding-inline-start: calc(\n 13 \n var(--dp, 1px)\n );\n --_md-split-button-trigger-padding-inline-end: calc(\n 17 \n var(--dp, 1px)\n );\n\n --_md-split-button-trigger-pressed-padding-inline-start: calc(\n 15 \n var(--dp, 1px)\n );\n --_md-split-button-trigger-pressed-padding-inline-end: calc(\n 15 \n var(--dp, 1px)\n );\n\n --_md-split-button-trigger-padding-block: calc(15 var(--dp, 1px));\n --_md-split-button-trigger-pressed-shape: var(\n --md-sys-shape-corner-radius-full\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-split-button-outer-corner-shape: var(\n --md-sys-shape-corner-radius-full\n );\n --_md-split-button-inner-corner-shape: var(\n --md-sys-shape-corner-radius-small\n );\n --_md-split-button-interaction-inner-corner-shape: var(\n --md-sys-shape-corner-radius-large\n );\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 /* primary button /\n --_md-split-button-primary-padding-inline-start: var(\n --md-sys-layout-space-48\n );\n --_md-split-button-primary-padding-inline-end: var(\n --md-sys-layout-space-48\n );\n\n --_md-split-button-primary-padding-block: var(--md-sys-layout-space-32);\n\n / trigger button /\n --_md-split-button-trigger-padding-inline-start: calc(\n 26 \n var(--dp, 1px)\n );\n --_md-split-button-trigger-padding-inline-end: var(\n --md-sys-layout-space-32\n );\n\n --_md-split-button-trigger-pressed-padding-inline-start: calc(\n 29 \n var(--dp, 1px)\n );\n --_md-split-button-trigger-pressed-padding-inline-end: calc(\n 29 \n var(--dp, 1px)\n );\n\n --_md-split-button-trigger-padding-block: calc(29 * var(--dp, 1px));\n --_md-split-button-trigger-pressed-shape: var(\n --md-sys-shape-corner-radius-full\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-split-button-outer-corner-shape: var(\n --md-sys-shape-corner-radius-full\n );\n --_md-split-button-inner-corner-shape: var(\n --md-sys-shape-corner-radius-medium\n );\n --_md-split-button-interaction-inner-corner-shape: var(\n --md-sys-shape-corner-radius-large\n );\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 /* primary button /\n --_md-split-button-primary-padding-inline-start: var(\n --md-sys-layout-space-64\n );\n --_md-split-button-primary-padding-inline-end: var(\n --md-sys-layout-space-64\n );\n\n --_md-split-button-primary-padding-block: var(--md-sys-layout-space-48);\n\n / trigger button /\n --_md-split-button-trigger-padding-inline-start: calc(\n 37 \n var(--dp, 1px)\n );\n --_md-split-button-trigger-padding-inline-end: calc(\n 49 \n var(--dp, 1px)\n );\n\n --_md-split-button-trigger-pressed-padding-inline-start: calc(\n 43 \n var(--dp, 1px)\n );\n --_md-split-button-trigger-pressed-padding-inline-end: calc(\n 43 \n var(--dp, 1px)\n );\n\n --_md-split-button-trigger-padding-block: calc(43 var(--dp, 1px));\n --_md-split-button-trigger-pressed-shape: var(\n --md-sys-shape-corner-radius-full\n );\n }\n}\n","import type { ButtonSize } from \"../../core\";\nimport styles from \"./size.module.css\";\n\nexport const SplitButtonTriggerIconSize: Record<ButtonSize, number> = {\n \"extra-small\": 22,\n small: 22,\n medium: 26,\n large: 38,\n \"extra-large\": 50,\n} as const;\n\nexport const splitButtonSizeConfig = (size: ButtonSize) => {\n return styles[size];\n};\n\nexport const SplitButtonVariantBase = styles[\"size\"];\n\nexport const SplitButtonPrimaryBase = styles[\"primary\"];\nexport const SplitButtonTriggerBase = styles[\"trigger\"];\n"],"mappings":";;;;;;;;;GCGa,IAAyD;CAClE,eAAe;CACf,OAAO;CACP,QAAQ;CACR,OAAO;CACP,eAAe;AACnB,GAEa,KAAyB,MAC3B,EAAO,IAGL,IAAyB,EAAO,MAEhC,IAAyB,EAAO,SAChC,IAAyB,EAAO"}
1	+ {"version":3,"file":"core2","names":["styles","size_module_default","SplitButtonTriggerIconSize","splitButtonSizeConfig","size","SplitButtonVariantBase","\"size\"","SplitButtonPrimaryBase","\"primary\"","SplitButtonTriggerBase","\"trigger\""],"sources":["../../src/components/Button/SplitButton/core/size.module.css","../../src/components/Button/SplitButton/core/size.ts"],"sourcesContent":["@layer adgytec.comps {\n .size {\n border-start-start-radius: var(--_shape-start-start);\n border-start-end-radius: var(--_shape-start-end);\n border-end-start-radius: var(--_shape-end-start);\n border-end-end-radius: var(--_shape-end-end);\n\n padding-inline-start: var(--_md-split-button-padding-inline-start);\n padding-inline-end: var(--_md-split-button-padding-inline-end);\n\n padding-block: var(--_md-button-padding-block);\n\n display: flex;\n gap: var(--_md-button-icon-label-gap);\n align-items: center;\n justify-content: center;\n\n box-sizing: border-box;\n min-inline-size: var(--min-tap-target-size);\n }\n\n .primary {\n /* shape /\n --_inner-shape: var(--_md-split-button-inner-corner-shape);\n\n --_shape-start-end: var(--_inner-shape);\n --_shape-end-end: var(--_inner-shape);\n\n --_shape-start-start: var(--_md-split-button-outer-corner-shape);\n --_shape-end-start: var(--_md-split-button-outer-corner-shape);\n\n / padding /\n --_md-split-button-padding-inline-start-base: var(\n --_md-split-button-primary-padding-inline-start\n );\n --_md-split-button-padding-inline-start: var(\n --_md-split-button-padding-inline-start-base\n );\n\n --_md-split-button-padding-inline-end-base: var(\n --_md-split-button-primary-padding-inline-end\n );\n --_md-split-button-padding-inline-end: var(\n --_md-split-button-padding-inline-end-base\n );\n\n --_md-button-padding-block-base: var(\n --_md-split-button-primary-padding-block\n );\n --_md-button-padding-block: var(--_md-button-padding-block-base);\n\n &[data-hovered] {\n --_inner-shape: var(\n --_md-split-button-interaction-inner-corner-shape\n );\n }\n\n &[data-pressed] {\n --_inner-shape: var(\n --_md-split-button-interaction-inner-corner-shape\n );\n }\n }\n\n .trigger {\n / shape /\n --_inner-shape: var(--_md-split-button-inner-corner-shape);\n\n --_shape-start-end: var(--_md-split-button-outer-corner-shape);\n --_shape-end-end: var(--_md-split-button-outer-corner-shape);\n\n --_shape-start-start: var(--_inner-shape);\n --_shape-end-start: var(--_inner-shape);\n\n / padding /\n --_md-split-button-padding-inline-start-base: var(\n --_md-split-button-trigger-padding-inline-start\n );\n --_md-split-button-padding-inline-start: var(\n --_md-split-button-padding-inline-start-base\n );\n\n --_md-split-button-padding-inline-end-base: var(\n --_md-split-button-trigger-padding-inline-end\n );\n --_md-split-button-padding-inline-end: var(\n --_md-split-button-padding-inline-end-base\n );\n\n --_md-button-padding-block-base: var(\n --_md-split-button-trigger-padding-block\n );\n --_md-button-padding-block: var(--_md-button-padding-block-base);\n\n &[data-hovered] {\n --_inner-shape: var(\n --_md-split-button-interaction-inner-corner-shape\n );\n }\n\n &[data-pressed] {\n --_inner-shape: var(--_md-split-button-trigger-pressed-shape);\n\n --_md-split-button-padding-inline-start-base: var(\n --_md-split-button-trigger-pressed-padding-inline-start\n );\n --_md-split-button-padding-inline-end-base: var(\n --_md-split-button-trigger-pressed-padding-inline-end\n );\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-split-button-outer-corner-shape: var(\n --md-sys-shape-corner-radius-full\n );\n --_md-split-button-inner-corner-shape: var(\n --md-sys-shape-corner-radius-extra-small\n );\n --_md-split-button-interaction-inner-corner-shape: var(\n --md-sys-shape-corner-radius-small\n );\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 /* primary button /\n --_md-split-button-primary-padding-inline-start: var(\n --md-sys-layout-space-12\n );\n --_md-split-button-primary-padding-inline-end: calc(\n 10 \n var(--dp, 1px)\n );\n\n --_md-split-button-primary-padding-block: calc(6 * var(--dp, 1px));\n\n /* trigger button /\n --_md-split-button-trigger-padding-inline-start: var(\n --md-sys-layout-space-12\n );\n --_md-split-button-trigger-padding-inline-end: calc(\n 14 \n var(--dp, 1px)\n );\n\n --_md-split-button-trigger-pressed-padding-inline-start: calc(\n 13 \n var(--dp, 1px)\n );\n --_md-split-button-trigger-pressed-padding-inline-end: calc(\n 13 \n var(--dp, 1px)\n );\n\n --_md-split-button-trigger-padding-block: calc(5 * var(--dp, 1px));\n --_md-split-button-trigger-pressed-shape: var(\n --md-sys-shape-corner-radius-full\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-split-button-outer-corner-shape: var(\n --md-sys-shape-corner-radius-full\n );\n --_md-split-button-inner-corner-shape: var(\n --md-sys-shape-corner-radius-extra-small\n );\n --_md-split-button-interaction-inner-corner-shape: var(\n --md-sys-shape-corner-radius-small\n );\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 /* primary button /\n --_md-split-button-primary-padding-inline-start: var(\n --md-sys-layout-space-16\n );\n --_md-split-button-primary-padding-inline-end: var(\n --md-sys-layout-space-12\n );\n\n --_md-split-button-primary-padding-block: calc(10 var(--dp, 1px));\n\n /* trigger button /\n --_md-split-button-trigger-padding-inline-start: var(\n --md-sys-layout-space-12\n );\n --_md-split-button-trigger-padding-inline-end: calc(\n 14 \n var(--dp, 1px)\n );\n\n --_md-split-button-trigger-pressed-padding-inline-start: calc(\n 13 \n var(--dp, 1px)\n );\n --_md-split-button-trigger-pressed-padding-inline-end: calc(\n 13 \n var(--dp, 1px)\n );\n\n --_md-split-button-trigger-padding-block: calc(9 * var(--dp, 1px));\n --_md-split-button-trigger-pressed-shape: var(\n --md-sys-shape-corner-radius-full\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-split-button-outer-corner-shape: var(\n --md-sys-shape-corner-radius-full\n );\n --_md-split-button-inner-corner-shape: var(\n --md-sys-shape-corner-radius-extra-small\n );\n --_md-split-button-interaction-inner-corner-shape: var(\n --md-sys-shape-corner-radius-medium\n );\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 /* primary button /\n --_md-split-button-primary-padding-inline-start: var(\n --md-sys-layout-space-24\n );\n --_md-split-button-primary-padding-inline-end: var(\n --md-sys-layout-space-24\n );\n\n --_md-split-button-primary-padding-block: var(--md-sys-layout-space-16);\n\n / trigger button /\n --_md-split-button-trigger-padding-inline-start: calc(\n 13 \n var(--dp, 1px)\n );\n --_md-split-button-trigger-padding-inline-end: calc(\n 17 \n var(--dp, 1px)\n );\n\n --_md-split-button-trigger-pressed-padding-inline-start: calc(\n 15 \n var(--dp, 1px)\n );\n --_md-split-button-trigger-pressed-padding-inline-end: calc(\n 15 \n var(--dp, 1px)\n );\n\n --_md-split-button-trigger-padding-block: calc(15 var(--dp, 1px));\n --_md-split-button-trigger-pressed-shape: var(\n --md-sys-shape-corner-radius-full\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-split-button-outer-corner-shape: var(\n --md-sys-shape-corner-radius-full\n );\n --_md-split-button-inner-corner-shape: var(\n --md-sys-shape-corner-radius-small\n );\n --_md-split-button-interaction-inner-corner-shape: var(\n --md-sys-shape-corner-radius-large\n );\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 /* primary button /\n --_md-split-button-primary-padding-inline-start: var(\n --md-sys-layout-space-48\n );\n --_md-split-button-primary-padding-inline-end: var(\n --md-sys-layout-space-48\n );\n\n --_md-split-button-primary-padding-block: var(--md-sys-layout-space-32);\n\n / trigger button /\n --_md-split-button-trigger-padding-inline-start: calc(\n 26 \n var(--dp, 1px)\n );\n --_md-split-button-trigger-padding-inline-end: var(\n --md-sys-layout-space-32\n );\n\n --_md-split-button-trigger-pressed-padding-inline-start: calc(\n 29 \n var(--dp, 1px)\n );\n --_md-split-button-trigger-pressed-padding-inline-end: calc(\n 29 \n var(--dp, 1px)\n );\n\n --_md-split-button-trigger-padding-block: calc(29 * var(--dp, 1px));\n --_md-split-button-trigger-pressed-shape: var(\n --md-sys-shape-corner-radius-full\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-split-button-outer-corner-shape: var(\n --md-sys-shape-corner-radius-full\n );\n --_md-split-button-inner-corner-shape: var(\n --md-sys-shape-corner-radius-medium\n );\n --_md-split-button-interaction-inner-corner-shape: var(\n --md-sys-shape-corner-radius-large\n );\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 /* primary button /\n --_md-split-button-primary-padding-inline-start: var(\n --md-sys-layout-space-64\n );\n --_md-split-button-primary-padding-inline-end: var(\n --md-sys-layout-space-64\n );\n\n --_md-split-button-primary-padding-block: var(--md-sys-layout-space-48);\n\n / trigger button /\n --_md-split-button-trigger-padding-inline-start: calc(\n 37 \n var(--dp, 1px)\n );\n --_md-split-button-trigger-padding-inline-end: calc(\n 49 \n var(--dp, 1px)\n );\n\n --_md-split-button-trigger-pressed-padding-inline-start: calc(\n 43 \n var(--dp, 1px)\n );\n --_md-split-button-trigger-pressed-padding-inline-end: calc(\n 43 \n var(--dp, 1px)\n );\n\n --_md-split-button-trigger-padding-block: calc(43 var(--dp, 1px));\n --_md-split-button-trigger-pressed-shape: var(\n --md-sys-shape-corner-radius-full\n );\n }\n}\n","import type { ButtonSize } from \"../../core\";\nimport styles from \"./size.module.css\";\n\n/*\n Maps each {@link ButtonSize} preset to its corresponding chevron icon size in pixels\n * for {@link SplitButtonTrigger}.\n /\nexport const SplitButtonTriggerIconSize: Record<ButtonSize, number> = {\n \"extra-small\": 22,\n small: 22,\n medium: 26,\n large: 38,\n \"extra-large\": 50,\n} as const;\n\n/\n Resolves the CSS module class name for a given split button size preset.\n \n @param size - The button size preset.\n * @returns The CSS module class name for the split button container size.\n /\nexport const splitButtonSizeConfig = (size: ButtonSize) => {\n return styles[size];\n};\n\n/* Base CSS module class name for split button container sizing. /\nexport const SplitButtonVariantBase = styles[\"size\"];\n\n/* Base CSS module class name for the primary action button part of a split button. /\nexport const SplitButtonPrimaryBase = styles[\"primary\"];\n\n/* Base CSS module class name for the menu trigger button part of a split button. */\nexport const SplitButtonTriggerBase = styles[\"trigger\"];\n"],"mappings":";;;;;;;;;GCOaE,IAAyD;CAClE,eAAe;CACf,OAAO;CACP,QAAQ;CACR,OAAO;CACP,eAAe;AACnB,GAQaC,KAAyB,MAC3BH,EAAOI,IAILC,IAAyBL,EAAOM,MAGhCC,IAAyBP,EAAOQ,SAGhCC,IAAyBT,EAAOU"}

package/dist/chunks/core3.map CHANGED Viewed

	@@ -1 +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\";\nimport type { CalendarSelectionMode } from \"react-aria-components/Calendar\";\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<CalendarSelectionMode> \| RangeCalendarState\n): state is RangeCalendarState {\n return \"anchorDate\" in state;\n}\n"],"mappings":";;;;~~ACEA~~,~~IAAa~~,~~IAAqB~~,~~iCAAA~~,~~EAAO~~,~~UAc5B~~,IAAiB,~~MACjB~~,IAA0B;;;~~ACRvC~~,~~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"}
1	+ {"version":3,"file":"core3","names":["styles","CalendarBaseStyles","\"calendar\"","defaultMinYear","defaultMaxYearIncrement","useCalendarState","calendarState","useContext","CalendarStateContext","rangeCalendarState","RangeCalendarStateContext","state","isRangeCalendarState"],"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\n/*\n Base CSS module class name providing layout and styling tokens for calendar containers.\n /\nexport const CalendarBaseStyles = styles[\"calendar\"];\n\n/\n Format style for weekday headers in the calendar grid.\n \n - `\"narrow\"`: Typically a single character (e.g. \"S\", \"M\", \"T\").\n * - `\"short\"`: Abbreviated day name (e.g. \"Sun\", \"Mon\", \"Tue\").\n /\nexport type WeekdayStyle = \"narrow\" \| \"short\";\n\n/\n Represents a selectable month item within the month picker menu.\n /\nexport interface MonthItem {\n /* 1-based month index (1 for January through 12 for December). /\n id: number;\n /* Formatted localized month label (e.g. \"January\" or \"Jan\"). /\n formatted: string;\n}\n\n/\n Represents a selectable year item within the year picker menu.\n /\nexport interface YearItem {\n /* Full numeric year (e.g. 2026). /\n id: number;\n /* Formatted localized year string (e.g. \"2026\"). /\n formatted: string;\n}\n\n/\n Default fallback minimum year used in the year selection menu when no `minValue` is specified.\n /\nexport const defaultMinYear = 1900;\n\n/\n Default number of years added to the current year when determining the maximum year\n * in the year selection menu if no `maxValue` is specified.\n /\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\";\nimport type { CalendarSelectionMode } from \"react-aria-components/Calendar\";\n\n/\n Accesses the active calendar state from the nearest enclosing `Calendar` or `RangeCalendar`.\n \n Checks both {@link CalendarStateContext} (single date) and {@link RangeCalendarStateContext} (range).\n * Throws an error if invoked outside a valid calendar provider context.\n \n @returns The active {@link CalendarState} or {@link RangeCalendarState}.\n * @throws {Error} If called outside of a `Calendar` or `RangeCalendar` component hierarchy.\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\n/\n Type guard function to determine whether a given calendar state is a {@link RangeCalendarState}.\n \n @param state - The calendar state instance to check.\n * @returns `true` if `state` is a `RangeCalendarState` (containing an `anchorDate` property), otherwise `false`.\n */\nexport function isRangeCalendarState(\n state: CalendarState<CalendarSelectionMode> \| RangeCalendarState\n): state is RangeCalendarState {\n return \"anchorDate\" in state;\n}\n"],"mappings":";;;;ACKA,IAAaC,IAAqBD,iCAAAA,EAAOE,UAiC5BC,IAAiB,MAMjBC,IAA0B;;;AC1BvC,SAAOC,IAAA;CACH,IAAAC,IAAsBC,EAAWC,CAAoB,GACrDC,IAA2BF,EAAWG,CAAyB,GAC/DC,IAAcL,KAAAG,KAAA;CAEd,IAAI,CAACE,GACD,MAAM,MACF,+DACJ;CACH,OAEMA;AAAK;AAShB,SAAgBC,EACZ,GAC2B;CAC3B,OAAO,gBAAgBD;AAC3B"}

package/dist/chunks/core4.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"core4","names":[],"sources":["../../src/components/Input/core/textField.module.css","../../src/components/Input/core/textField.ts"],"sourcesContent":["/* configurable tokens\n\n --md-textfield-focused-outline-color\n\n configurable tokens end /\n\n@layer adgytec.comps {\n .unset {\n all: unset;\n }\n\n .colors {\n --disabled-color: rgb(\n from var(--md-sys-color-on-surface) r g b /\n var(--md-sys-state-disabled-content)\n );\n\n / outline color /\n --outline-color-normal: var(--md-sys-color-outline);\n --outline-color-invalid: var(--md-sys-color-error);\n\n --outline-width: calc(1 var(--dp, 1px));\n --outline-width-focused: calc(2 * var(--dp, 1px));\n\n --outline-color-hovered-normal: var(--md-sys-color-on-surface);\n --outline-color-hovered-invalid: var(--md-sys-color-on-error-container);\n\n --outline-color-focused-normal: var(\n --md-textfield-focused-outline-color,\n var(--md-sys-color-primary)\n );\n --outline-color-focused-invalid: var(--md-sys-color-error);\n\n /* group color /\n --group-color-normal: var(--md-sys-color-on-surface-variant);\n --group-color-invalid: var(--md-sys-color-error);\n\n / editor /\n --editor-infix-text-color-normal: var(\n --md-sys-color-on-surface-variant\n );\n --editor-color-normal: var(--md-sys-color-on-surface);\n\n / caret color /\n --caret-color-normal: var(--md-sys-color-primary);\n --caret-color-invalid: var(--md-sys-color-error);\n\n / variable to use /\n --group-color: var(--group-color-normal);\n\n --editor-infix-color: var(--editor-infix-text-color-normal);\n --editor-color: var(--editor-color-normal);\n\n --caret-color: var(--caret-color-normal);\n\n --outline-color: var(--outline-color-normal);\n --outline-color-focused: transparent;\n\n --placeholder-color: var(--group-color-normal);\n\n &[data-invalid] {\n --group-color: var(--group-color-invalid);\n --caret-color: var(--caret-color-invalid);\n --outline-color: var(--outline-color-invalid);\n }\n\n &[data-disabled] {\n --group-color: var(--disabled-color);\n\n --editor-infix-color: var(--disabled-color);\n --editor-color: var(--disabled-color);\n\n --caret-color: var(--disabled-color);\n\n --outline-color: var(--disabled-color);\n --placeholder-color: var(--disabled-color);\n }\n }\n\n .group {\n --label-padding-inline-start: var(--md-sys-layout-space-16);\n --label-padding-inline-end: var(--md-sys-layout-space-16);\n\n display: inline-grid;\n gap: var(--md-sys-layout-space-4);\n\n color: var(--group-color);\n caret-color: var(--caret-color);\n\n > [slot=\"label\"] {\n padding-inline-start: var(--label-padding-inline-start);\n padding-inline-end: var(--label-padding-inline-end);\n }\n\n &[data-leading] {\n --label-padding-inline-start: var(--md-sys-layout-space-12);\n }\n\n &[data-trailing] {\n --label-padding-inline-end: var(--md-sys-layout-space-12);\n }\n }\n\n .date-segment {\n border-radius: var(--md-sys-shape-corner-radius-extra-small);\n\n &[data-focused],\n &[data-focus-visible] {\n outline: calc(2 var(--dp, 1px)) solid var(--outline-color);\n outline-offset: calc(-4 * var(--dp, 1px));\n }\n\n &:not([data-type=\"literal\"]) {\n padding: var(--md-sys-layout-space-8);\n }\n }\n\n .editor {\n border-radius: var(--md-sys-shape-corner-radius-extra-small);\n\n border: var(--outline-width) solid var(--outline-color);\n outline: var(--outline-width-focused) solid var(--outline-color-focused);\n\n padding: var(--md-sys-layout-space-16);\n\n display: inline-flex;\n align-items: center;\n gap: var(--md-sys-layout-space-16);\n\n color: var(--editor-infix-color);\n\n overflow: auto;\n scrollbar-width: none;\n\n transition:\n border-color var(--md-sys-motion-expressive-fast-effects)\n var(--md-sys-motion-expressive-fast-effects-duration),\n outline-color var(--md-sys-motion-expressive-fast-effects)\n var(--md-sys-motion-expressive-fast-effects-duration);\n\n &[data-input] {\n cursor: text;\n }\n\n &[data-trailing] {\n padding-inline-end: var(--md-sys-layout-space-12);\n padding-block: var(--md-sys-layout-space-8);\n }\n\n &[data-leading] {\n padding-inline-start: var(--md-sys-layout-space-12);\n }\n\n &:not([data-disabled]) {\n &[data-hovered] {\n --outline-color: var(--outline-color-hovered-normal);\n\n &[data-invalid] {\n --outline-color: var(--outline-color-hovered-invalid);\n }\n }\n\n &[data-focus-visible],\n &[data-focus-within],\n &[data-focused],\n &[data-open] {\n --outline-color: var(--outline-color-focused-normal);\n --outline-color-focused: var(--outline-color);\n\n &[data-invalid] {\n --outline-color: var(--outline-color-focused-invalid);\n }\n }\n }\n\n &[data-disabled] {\n cursor: default;\n }\n\n &[data-date-input] {\n gap: 0;\n padding: var(--md-sys-layout-space-8);\n }\n }\n\n .editor-input-group {\n display: inline-flex;\n align-items: center;\n inline-size: 100%;\n }\n\n .editor-input {\n color: var(--editor-color);\n\n &[data-input] {\n inline-size: 100%;\n }\n\n &[data-textarea] {\n resize: vertical;\n\n /* 2dp for border thickness /\n min-block-size: calc(58 var(--dp, 1px));\n max-block-size: calc(300 * var(--dp, 1px));\n\n &[data-disabled] {\n resize: none;\n }\n }\n\n &[data-date-input] {\n inline-size: 100%;\n }\n\n &::placeholder {\n color: var(--placeholder-color);\n }\n }\n\n .supporting-text {\n padding-inline: var(--md-sys-layout-space-16);\n\n display: inline-flex;\n align-items: flex-start;\n justify-content: space-between;\n gap: var(--md-sys-layout-space-16);\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-leading] {\n padding-inline-start: var(--md-sys-layout-space-12);\n }\n\n &[data-trailing] {\n padding-inline-end: var(--md-sys-layout-space-12);\n }\n }\n\n .character-count {\n margin-inline-start: auto;\n }\n}\n","import styles from \"./textField.module.css\";\n\nexport const TextFieldIconSize = 24;\n\nexport const UnsetStyles = styles[\"unset\"];\n\nexport const Colors = styles[\"colors\"];\n\nexport const InputGroupStyles = styles[\"group\"];\nexport const EditorStyles = styles[\"editor\"];\nexport const EditorInputGroupStyles = styles[\"editor-input-group\"];\nexport const EditorInputStyles = styles[\"editor-input\"];\n\nexport const SupportingTextStyles = styles[\"supporting-text\"];\nexport const CharacterCountStyles = styles[\"character-count\"];\n\nexport const DateInputStyles = styles[\"date-input\"];\nexport const DateSegmentStyles = styles[\"date-segment\"];\n"],"mappings":";;;;;;;;;;~~GCEa~~,IAAoB,~~IAEpB~~,~~IAAc~~,~~EAAO~~,~~OAErB~~,~~IAAS~~,~~EAAO~~,~~QAEhB~~,~~IAAmB~~,~~EAAO~~,~~OAC1B~~,~~IAAe~~,~~EAAO~~,~~QACtB~~,~~IAAyB~~,EAAO,~~uBAChC~~,~~IAAoB~~,EAAO,~~iBAE3B~~,~~IAAuB~~,EAAO,~~oBAC9B~~,~~IAAuB~~,EAAO,~~oBAE9B~~,~~IAAkB~~,EAAO,~~eACzB~~,~~IAAoB~~,EAAO"}
1	+ {"version":3,"file":"core4","names":["styles","textField_module_default","TextFieldIconSize","UnsetStyles","\"unset\"","Colors","\"colors\"","InputGroupStyles","\"group\"","EditorStyles","\"editor\"","EditorInputGroupStyles","EditorInputStyles","SupportingTextStyles","CharacterCountStyles","DateInputStyles","DateSegmentStyles"],"sources":["../../src/components/Input/core/textField.module.css","../../src/components/Input/core/textField.ts"],"sourcesContent":["/* configurable tokens\n\n --md-textfield-focused-outline-color\n\n configurable tokens end /\n\n@layer adgytec.comps {\n .unset {\n all: unset;\n }\n\n .colors {\n --disabled-color: rgb(\n from var(--md-sys-color-on-surface) r g b /\n var(--md-sys-state-disabled-content)\n );\n\n / outline color /\n --outline-color-normal: var(--md-sys-color-outline);\n --outline-color-invalid: var(--md-sys-color-error);\n\n --outline-width: calc(1 var(--dp, 1px));\n --outline-width-focused: calc(2 * var(--dp, 1px));\n\n --outline-color-hovered-normal: var(--md-sys-color-on-surface);\n --outline-color-hovered-invalid: var(--md-sys-color-on-error-container);\n\n --outline-color-focused-normal: var(\n --md-textfield-focused-outline-color,\n var(--md-sys-color-primary)\n );\n --outline-color-focused-invalid: var(--md-sys-color-error);\n\n /* group color /\n --group-color-normal: var(--md-sys-color-on-surface-variant);\n --group-color-invalid: var(--md-sys-color-error);\n\n / editor /\n --editor-infix-text-color-normal: var(\n --md-sys-color-on-surface-variant\n );\n --editor-color-normal: var(--md-sys-color-on-surface);\n\n / caret color /\n --caret-color-normal: var(--md-sys-color-primary);\n --caret-color-invalid: var(--md-sys-color-error);\n\n / variable to use /\n --group-color: var(--group-color-normal);\n\n --editor-infix-color: var(--editor-infix-text-color-normal);\n --editor-color: var(--editor-color-normal);\n\n --caret-color: var(--caret-color-normal);\n\n --outline-color: var(--outline-color-normal);\n --outline-color-focused: transparent;\n\n --placeholder-color: var(--group-color-normal);\n\n &[data-invalid] {\n --group-color: var(--group-color-invalid);\n --caret-color: var(--caret-color-invalid);\n --outline-color: var(--outline-color-invalid);\n }\n\n &[data-disabled] {\n --group-color: var(--disabled-color);\n\n --editor-infix-color: var(--disabled-color);\n --editor-color: var(--disabled-color);\n\n --caret-color: var(--disabled-color);\n\n --outline-color: var(--disabled-color);\n --placeholder-color: var(--disabled-color);\n }\n }\n\n .group {\n --label-padding-inline-start: var(--md-sys-layout-space-16);\n --label-padding-inline-end: var(--md-sys-layout-space-16);\n\n display: inline-grid;\n gap: var(--md-sys-layout-space-4);\n\n color: var(--group-color);\n caret-color: var(--caret-color);\n\n > [slot=\"label\"] {\n padding-inline-start: var(--label-padding-inline-start);\n padding-inline-end: var(--label-padding-inline-end);\n }\n\n &[data-leading] {\n --label-padding-inline-start: var(--md-sys-layout-space-12);\n }\n\n &[data-trailing] {\n --label-padding-inline-end: var(--md-sys-layout-space-12);\n }\n }\n\n .date-segment {\n border-radius: var(--md-sys-shape-corner-radius-extra-small);\n\n &[data-focused],\n &[data-focus-visible] {\n outline: calc(2 var(--dp, 1px)) solid var(--outline-color);\n outline-offset: calc(-4 * var(--dp, 1px));\n }\n\n &:not([data-type=\"literal\"]) {\n padding: var(--md-sys-layout-space-8);\n }\n }\n\n .editor {\n border-radius: var(--md-sys-shape-corner-radius-extra-small);\n\n border: var(--outline-width) solid var(--outline-color);\n outline: var(--outline-width-focused) solid var(--outline-color-focused);\n\n padding: var(--md-sys-layout-space-16);\n\n display: inline-flex;\n align-items: center;\n gap: var(--md-sys-layout-space-16);\n\n color: var(--editor-infix-color);\n\n overflow: auto;\n scrollbar-width: none;\n\n transition:\n border-color var(--md-sys-motion-expressive-fast-effects)\n var(--md-sys-motion-expressive-fast-effects-duration),\n outline-color var(--md-sys-motion-expressive-fast-effects)\n var(--md-sys-motion-expressive-fast-effects-duration);\n\n &[data-input] {\n cursor: text;\n }\n\n &[data-trailing] {\n padding-inline-end: var(--md-sys-layout-space-12);\n padding-block: var(--md-sys-layout-space-8);\n }\n\n &[data-leading] {\n padding-inline-start: var(--md-sys-layout-space-12);\n }\n\n &:not([data-disabled]) {\n &[data-hovered] {\n --outline-color: var(--outline-color-hovered-normal);\n\n &[data-invalid] {\n --outline-color: var(--outline-color-hovered-invalid);\n }\n }\n\n &[data-focus-visible],\n &[data-focus-within],\n &[data-focused],\n &[data-open] {\n --outline-color: var(--outline-color-focused-normal);\n --outline-color-focused: var(--outline-color);\n\n &[data-invalid] {\n --outline-color: var(--outline-color-focused-invalid);\n }\n }\n }\n\n &[data-disabled] {\n cursor: default;\n }\n\n &[data-date-input] {\n gap: 0;\n padding: var(--md-sys-layout-space-8);\n }\n }\n\n .editor-input-group {\n display: inline-flex;\n align-items: center;\n inline-size: 100%;\n }\n\n .editor-input {\n color: var(--editor-color);\n\n &[data-input] {\n inline-size: 100%;\n }\n\n &[data-textarea] {\n resize: vertical;\n\n /* 2dp for border thickness /\n min-block-size: calc(58 var(--dp, 1px));\n max-block-size: calc(300 * var(--dp, 1px));\n\n &[data-disabled] {\n resize: none;\n }\n }\n\n &[data-date-input] {\n inline-size: 100%;\n }\n\n &::placeholder {\n color: var(--placeholder-color);\n }\n }\n\n .supporting-text {\n padding-inline: var(--md-sys-layout-space-16);\n\n display: inline-flex;\n align-items: flex-start;\n justify-content: space-between;\n gap: var(--md-sys-layout-space-16);\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-leading] {\n padding-inline-start: var(--md-sys-layout-space-12);\n }\n\n &[data-trailing] {\n padding-inline-end: var(--md-sys-layout-space-12);\n }\n }\n\n .character-count {\n margin-inline-start: auto;\n }\n}\n","import styles from \"./textField.module.css\";\n\n/*\n Standard icon size (in pixels) for leading and trailing icons in text fields.\n /\nexport const TextFieldIconSize = 24;\n\n/* CSS class resetting browser-default text field container styles. /\nexport const UnsetStyles = styles[\"unset\"];\n\n/* CSS class providing color tokens for text fields. /\nexport const Colors = styles[\"colors\"];\n\n/* CSS class for the composite input group container. /\nexport const InputGroupStyles = styles[\"group\"];\n\n/* CSS class for the editable input container. /\nexport const EditorStyles = styles[\"editor\"];\n\n/* CSS class for the input element wrapper group. /\nexport const EditorInputGroupStyles = styles[\"editor-input-group\"];\n\n/* CSS class for native `<input>` and `<textarea>` elements. /\nexport const EditorInputStyles = styles[\"editor-input\"];\n\n/* CSS class for supporting text below text fields. /\nexport const SupportingTextStyles = styles[\"supporting-text\"];\n\n/* CSS class for the character count display. /\nexport const CharacterCountStyles = styles[\"character-count\"];\n\n/* CSS class for date field composite inputs. /\nexport const DateInputStyles = styles[\"date-input\"];\n\n/* CSS class for individual date segments within a date field. */\nexport const DateSegmentStyles = styles[\"date-segment\"];\n"],"mappings":";;;;;;;;;;GCKaE,IAAoB,IAGpBC,IAAcH,EAAOI,OAGrBC,IAASL,EAAOM,QAGhBC,IAAmBP,EAAOQ,OAG1BC,IAAeT,EAAOU,QAGtBC,IAAyBX,EAAO,uBAGhCY,IAAoBZ,EAAO,iBAG3Ba,IAAuBb,EAAO,oBAG9Bc,IAAuBd,EAAO,oBAG9Be,IAAkBf,EAAO,eAGzBgB,IAAoBhB,EAAO"}

package/dist/chunks/core5.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"core5","names":[],"sources":["../../src/components/Input/DatePicker/core/datePicker.module.css","../../src/components/Input/DatePicker/core/datePicker.ts"],"sourcesContent":["@layer adgytec.comps {\n .group {\n white-space: nowrap;\n }\n\n .range-group {\n white-space: nowrap;\n }\n\n .popover {\n box-shadow: var(--md-sys-elevation-shadow-3);\n border-radius: var(--md-sys-shape-corner-radius-large);\n\n overflow: auto;\n scrollbar-width: thin;\n }\n}\n","import styles from \"./datePicker.module.css\";\n\nexport const DatePickerPopoverStyles = styles[\"popover\"];\nexport const DatePickerGroupStyles = styles[\"group\"];\nexport const DateRangePickerDateInputGroupStyles = styles[\"range-group\"];\n"],"mappings":";;;;~~GCEa~~,~~IAA0B~~,~~EAAO~~,~~SACjC~~,~~IAAwB~~,~~EAAO~~,~~OAC~~/B,~~IAAsC~~,EAAO"}
1	+ {"version":3,"file":"core5","names":["styles","datePicker_module_default","DatePickerPopoverStyles","\"popover\"","DatePickerGroupStyles","\"group\"","DateRangePickerDateInputGroupStyles"],"sources":["../../src/components/Input/DatePicker/core/datePicker.module.css","../../src/components/Input/DatePicker/core/datePicker.ts"],"sourcesContent":["@layer adgytec.comps {\n .group {\n white-space: nowrap;\n }\n\n .range-group {\n white-space: nowrap;\n }\n\n .popover {\n box-shadow: var(--md-sys-elevation-shadow-3);\n border-radius: var(--md-sys-shape-corner-radius-large);\n\n overflow: auto;\n scrollbar-width: thin;\n }\n}\n","import styles from \"./datePicker.module.css\";\n\n/** CSS class for the date picker popover container. /\nexport const DatePickerPopoverStyles = styles[\"popover\"];\n\n/* CSS class for the date picker input group container. /\nexport const DatePickerGroupStyles = styles[\"group\"];\n\n/* CSS class for the date range picker input group container. */\nexport const DateRangePickerDateInputGroupStyles = styles[\"range-group\"];\n"],"mappings":";;;;GCGaE,IAA0BF,EAAOG,SAGjCC,IAAwBJ,EAAOK,OAG/BC,IAAsCN,EAAO"}

package/dist/chunks/core6 CHANGED Viewed

@@ -1,20 +1,20 @@
 import '../assets/core7.css';var e = {
-	color: "_color_1dbnb_19",
-	label: "_label_1dbnb_112",
-	"menu-color": "_menu-color_1dbnb_116",
-	standard: "_standard_1dbnb_161",
-	vibrant: "_vibrant_1dbnb_192"
+	color: "_color_tp8ri_19",
+	label: "_label_tp8ri_112",
+	"menu-color": "_menu-color_tp8ri_116",
+	standard: "_standard_tp8ri_161",
+	vibrant: "_vibrant_tp8ri_192"
 }, t = e.color, n = e.label, r = (t) => e[t], i = e["menu-color"], a = {
 	layout: "_layout_1rvzv_3",
 	standard: "_standard_1rvzv_43",
 	grouped: "_grouped_1rvzv_58"
 }, o = 20, s = a.layout, c = (e) => a[e], l = {
-	menu: "_menu_px1ka_2",
-	"menu-section": "_menu-section_px1ka_26",
-	"menu-section-header": "_menu-section-header_px1ka_43",
-	"menu-item": "_menu-item_px1ka_49",
-	"menu-item-leading": "_menu-item-leading_px1ka_87",
-	"menu-item-trailing": "_menu-item-trailing_px1ka_88"
+	menu: "_menu_16sld_2",
+	"menu-section": "_menu-section_16sld_26",
+	"menu-section-header": "_menu-section-header_16sld_43",
+	"menu-item": "_menu-item_16sld_49",
+	"menu-item-leading": "_menu-item-leading_16sld_87",
+	"menu-item-trailing": "_menu-item-trailing_16sld_88"
 }, u = l.menu, d = l["menu-section"], f = l["menu-section-header"], p = l["menu-item"], m = l["menu-item-leading"], h = l["menu-item-trailing"];
 //#endregion
 export { d as a, o as c, r as d, t as f, f as i, c as l, p as n, u as o, n as p, h as r, s, m as t, i as u };

package/dist/chunks/core6.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"core6","names":[],"sources":["../../src/components/Menu/core/color.module.css","../../src/components/Menu/core/color.ts","../../src/components/Menu/core/layout.module.css","../../src/components/Menu/core/layout.ts","../../src/components/Menu/core/menu.module.css","../../src/components/Menu/core/menu.ts"],"sourcesContent":["/* configurable tokens\n\n --md-menu-background\n* --md-menu-section-label-color\n\n --md-menu-item-background\n* --md-menu-item-selected-background\n\n --md-menu-item-color\n* --md-menu-item-selected-color\n\n --md-menu-item-label-color\n* --menu-item-selected-label-color\n\n configurable tokens end /\n\n@layer adgytec.comps {\n / this is used by individual menu items /\n .color {\n / state layer /\n --_state-color: var(--_label-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 / variables to use /\n --_background-color: var(--_md-menu-item-background);\n --_color: var(--_md-menu-item-color);\n --_label-color: var(--_md-menu-item-label-color);\n\n / styles /\n background-color: var(--_background-color);\n color: var(--_color);\n\n &[data-selected] {\n --_background-color: var(--_md-menu-item-selected-background);\n --_color: var(--_md-menu-item-selected-color);\n --_label-color: var(--_menu-item-selected-label-color);\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-open] {\n --_state-layer-opacity: 0.08;\n }\n\n &[data-pressed] {\n --_state-layer-opacity: var(--md-sys-state-pressed);\n }\n\n &[data-disabled] {\n --_label-color: rgb(\n from var(--_md-menu-item-label-color) r g b /\n var(--md-sys-state-disabled-content)\n );\n --_color: var(--_label-color);\n\n &[data-selected] {\n --_background-color: rgb(\n from var(--_md-menu-item-selected-background) r g b /\n var(--md-sys-state-disabled-container)\n );\n --_label-color: rgb(\n from var(--_menu-item-selected-label-color) r g b /\n var(--md-sys-state-disabled-content)\n );\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 z-index: 1;\n }\n\n /* menu label /\n .label {\n color: var(--_label-color);\n }\n\n .menu-color {\n --_md-menu-background: var(\n --md-menu-background,\n var(--_md-menu-background-default)\n );\n --_md-menu-section-label-color: var(\n --md-menu-section-label-color,\n var(--_md-menu-section-label-color-default)\n );\n\n / menu item /\n\n / background /\n --_md-menu-item-background: var(\n --md-menu-item-background,\n var(--_md-menu-item-background-default)\n );\n --_md-menu-item-selected-background: var(\n --md-menu-item-selected-background,\n var(--_md-menu-item-selected-background-default)\n );\n\n / color /\n --_md-menu-item-color: var(\n --md-menu-item-color,\n var(--_md-menu-item-color-default)\n );\n --_md-menu-item-selected-color: var(\n --md-menu-item-selected-color,\n var(--_md-menu-item-selected-color-default)\n );\n\n / label color /\n --_md-menu-item-label-color: var(\n --md-menu-item-label-color,\n var(--_md-menu-item-label-color-default)\n );\n --_menu-item-selected-label-color: var(\n --menu-item-selected-label-color,\n var(--_menu-item-selected-label-color-default)\n );\n\n --md-divider-color: var(--_md-menu-item-color);\n }\n\n .standard {\n --_md-menu-background-default: var(\n --md-sys-color-surface-container-low\n );\n --_md-menu-section-label-color-default: var(\n --md-sys-color-on-surface-variant\n );\n\n / menu item /\n\n / background /\n --_md-menu-item-background-default: var(\n --md-sys-color-surface-container-low\n );\n --_md-menu-item-selected-background-default: var(\n --md-sys-color-tertiary-container\n );\n\n / color /\n --_md-menu-item-color-default: var(--md-sys-color-on-surface-variant);\n --_md-menu-item-selected-color-default: var(\n --md-sys-color-on-tertiary-container\n );\n\n / label color /\n --_md-menu-item-label-color-default: var(--md-sys-color-on-surface);\n --_menu-item-selected-label-color-default: var(\n --md-sys-color-on-tertiary-container\n );\n }\n\n .vibrant {\n --_md-menu-background-default: var(--md-sys-color-tertiary-container);\n --_md-menu-section-label-color-default: var(\n --md-sys-color-on-tertiary-container\n );\n\n / menu item /\n\n / background /\n --_md-menu-item-background-default: var(\n --md-sys-color-tertiary-container\n );\n --_md-menu-item-selected-background-default: var(\n --md-sys-color-tertiary\n );\n\n / color /\n --_md-menu-item-color-default: var(\n --md-sys-color-on-tertiary-container\n );\n --_md-menu-item-selected-color-default: var(--md-sys-color-on-tertiary);\n\n / label color /\n --_md-menu-item-label-color-default: var(\n --md-sys-color-on-tertiary-container\n );\n --_menu-item-selected-label-color-default: var(\n --md-sys-color-on-tertiary\n );\n }\n}\n","import styles from \"./color.module.css\";\n\nexport type MenuColor = \"standard\" \| \"vibrant\";\n\nexport const menuItemBaseColor = styles[\"color\"];\n\nexport const menuItemLabelColor = styles[\"label\"];\n\nexport const menuColorConfig = (color: MenuColor) => {\n return styles[color];\n};\nexport const menuBaseColor = styles[\"menu-color\"];\n","@layer adgytec.comps {\n / core menu tokens /\n .layout {\n / tokens used either by menu or menu section based on layout value /\n --_md-menu-elevation: var(--md-sys-elevation-shadow-3);\n --_md-menu-gap: calc(2 var(--dp, 1px));\n --_md-menu-padding: var(--md-sys-layout-space-4);\n\n /* shape /\n --_md-menu-shape: var(--md-sys-shape-corner-radius-small);\n --_md-menu-section-shape: var(--md-sys-shape-corner-radius-small);\n\n / menu item /\n\n --_md-menu-item-shape: var(--md-sys-shape-corner-radius-extra-small);\n --_md-menu-item-outer-shape: var(--md-sys-shape-corner-radius-medium);\n --_md-menu-item-selected-shape: var(\n --md-sys-shape-corner-radius-medium\n );\n\n / Vertical padding when item contains only a single-line label /\n / Centers 20px label within 44px container /\n --_md-menu-item-padding-block-single-line: var(\n --md-sys-layout-space-12\n );\n\n / Vertical padding when item contains label + supporting text /\n / Reduced padding to fit two text lines (20px + 16px) with 2px gap inside 44px container /\n --_md-menu-item-padding-block-multi-line: calc(3 var(--dp, 1px));\n\n /* Horizontal padding inside each menu item (excluding outer menu padding) /\n / Total visual inset = menu container padding (4) + this value (12) /\n --_md-menu-item-padding-inline-content: var(--md-sys-layout-space-12);\n\n / Spacing between elements inside a menu item (icon, text, trailing, etc.) /\n --_md-menu-item-content-gap: var(--md-sys-layout-space-8);\n\n &:focus-within {\n --_md-menu-shape: var(--md-sys-shape-corner-radius-large);\n }\n }\n\n .standard {\n --_menu-elevation: var(--_md-menu-elevation);\n --_menu-padding: var(--_md-menu-padding);\n --_menu-shape: var(--_md-menu-shape);\n --_menu-background: var(--_md-menu-background);\n\n --_menu-section-elevation: none;\n --_menu-section-padding: 0;\n --_menu-section-shape: 0;\n --_menu-section-outer-shape: 0;\n --_menu-section-background: transparent;\n\n --_menu-item-elevation: none;\n }\n\n .grouped {\n --_menu-elevation: none;\n --_menu-padding: 0;\n --_menu-shape: var(--_md-menu-shape);\n --_menu-background: transparent;\n\n --_menu-section-elevation: var(--_md-menu-elevation);\n --_menu-section-padding: var(--_md-menu-padding);\n --_menu-section-outer-shape: var(--_md-menu-shape);\n --_menu-section-shape: var(--_md-menu-section-shape);\n --_menu-section-background: var(--_md-menu-background);\n\n --_menu-item-elevation: var(--_md-menu-elevation);\n }\n}\n","import styles from \"./layout.module.css\";\n\nexport type MenuLayout = \"standard\" \| \"grouped\";\n\nexport const MenuItemIconSize = 20;\n\nexport const MenuBaseLayout = styles[\"layout\"];\n\nexport const menuLayoutConfig = (layout: MenuLayout) => {\n return styles[layout];\n};\n","@layer adgytec.comps {\n .menu {\n background-color: var(--_menu-background);\n box-shadow: var(--_menu-elevation);\n border-radius: var(--_menu-shape);\n padding: var(--_menu-padding);\n\n outline: none;\n\n display: grid;\n gap: var(--_md-menu-gap);\n\n min-inline-size: min(100svi, calc(160 var(--dp, 1px)));\n\n overflow: auto;\n scrollbar-width: thin;\n\n transition: border-radius 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 .menu-section {\n background-color: var(--_menu-section-background);\n box-shadow: var(--_menu-section-elevation);\n border-radius: var(--_menu-section-shape);\n padding: var(--_menu-section-padding);\n\n display: grid;\n gap: var(--_md-menu-gap);\n\n transition: border-radius 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 .menu-section-header {\n padding-inline: var(--_md-menu-item-padding-inline-content);\n padding-block: var(--md-sys-layout-space-8);\n color: var(--_md-menu-section-label-color);\n }\n\n .menu-item {\n --_menu-item-padding-block: var(\n --_md-menu-item-padding-block-single-line\n );\n\n position: relative;\n outline: none;\n overflow: clip;\n\n display: flex;\n gap: var(--_md-menu-item-content-gap);\n align-items: center;\n justify-content: space-between;\n\n padding-inline: var(--_md-menu-item-padding-inline-content);\n padding-block: var(--_menu-item-padding-block);\n\n border-radius: var(--_md-menu-item-shape);\n\n transition:\n border-radius var(--md-sys-motion-expressive-fast-spatial)\n var(--md-sys-motion-expressive-fast-spatial-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\n &[data-multi-line] {\n --_menu-item-padding-block: var(\n --_md-menu-item-padding-block-multi-line\n );\n }\n\n &[data-selected] {\n border-radius: var(--_md-menu-item-selected-shape);\n }\n }\n\n .menu-item-leading,\n .menu-item-trailing {\n display: flex;\n gap: var(--_md-menu-item-content-gap);\n align-items: center;\n }\n\n /* menu -> menu item elevation /\n .menu > .menu-item {\n box-shadow: var(--_menu-item-elevation);\n }\n\n / menu -> menu section shape /\n .menu > .menu-section:first-child {\n border-start-start-radius: var(--_menu-section-outer-shape);\n border-start-end-radius: var(--_menu-section-outer-shape);\n }\n\n .menu > .menu-section:last-child {\n border-end-start-radius: var(--_menu-section-outer-shape);\n border-end-end-radius: var(--_menu-section-outer-shape);\n }\n\n / menu -> menu item shape (only if NOT selected) /\n .menu > .menu-item:not([data-selected]):first-child {\n border-start-start-radius: var(--_md-menu-shape);\n border-start-end-radius: var(--_md-menu-shape);\n }\n\n .menu > .menu-item:not([data-selected]):last-child {\n border-end-start-radius: var(--_md-menu-shape);\n border-end-end-radius: var(--_md-menu-shape);\n }\n\n / menu section -> menu item shape (only if NOT selected) */\n .menu > .menu-section:first-child\n > .menu-item:not([data-selected]):first-child {\n border-start-start-radius: var(--_md-menu-shape);\n border-start-end-radius: var(--_md-menu-shape);\n }\n\n .menu\n > .menu-section:last-child\n > .menu-item:not([data-selected]):last-child {\n border-end-start-radius: var(--_md-menu-shape);\n border-end-end-radius: var(--_md-menu-shape);\n }\n}\n","import styles from \"./menu.module.css\";\n\nexport const MenuStyles = styles[\"menu\"];\nexport const MenuSectionStyles = styles[\"menu-section\"];\nexport const MenuSectionHeaderStyles = styles[\"menu-section-header\"];\n\nexport const MenuItemStyles = styles[\"menu-item\"];\nexport const MenuItemLeadingStyles = styles[\"menu-item-leading\"];\nexport const MenuItemTrailingStyles = styles[\"menu-item-trailing\"];\n"],"mappings":";;;;;;GCIa,IAAoB,EAAO,OAE3B,IAAqB,EAAO,OAE5B,KAAmB,MACrB,EAAO,IAEL,IAAgB,EAAO;;;;GEPvB,IAAmB,IAEnB,IAAiB,EAAO,QAExB,KAAoB,MACtB,EAAO;;;;;;;GEPL,IAAa,EAAO,MACpB,IAAoB,EAAO,iBAC3B,IAA0B,EAAO,wBAEjC,IAAiB,EAAO,cACxB,IAAwB,EAAO,sBAC/B,IAAyB,EAAO"}
1	+ {"version":3,"file":"core6","names":["standard","styles","styles","styles","color_module_default","menuItemBaseColor","\"color\"","menuItemLabelColor","\"label\"","menuColorConfig","color","menuBaseColor","layout_module_default","MenuItemIconSize","MenuBaseLayout","\"layout\"","menuLayoutConfig","layout","menu_module_default","MenuStyles","\"menu\"","MenuSectionStyles","MenuSectionHeaderStyles","MenuItemStyles","MenuItemLeadingStyles","MenuItemTrailingStyles"],"sources":["../../src/components/Menu/core/color.module.css","../../src/components/Menu/core/color.ts","../../src/components/Menu/core/layout.module.css","../../src/components/Menu/core/layout.ts","../../src/components/Menu/core/menu.module.css","../../src/components/Menu/core/menu.ts"],"sourcesContent":["/* configurable tokens\n\n --md-menu-background\n* --md-menu-section-label-color\n\n --md-menu-item-background\n* --md-menu-item-selected-background\n\n --md-menu-item-color\n* --md-menu-item-selected-color\n\n --md-menu-item-label-color\n* --menu-item-selected-label-color\n\n configurable tokens end /\n\n@layer adgytec.comps {\n / this is used by individual menu items /\n .color {\n / state layer /\n --_state-color: var(--_label-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 / variables to use /\n --_background-color: var(--_md-menu-item-background);\n --_color: var(--_md-menu-item-color);\n --_label-color: var(--_md-menu-item-label-color);\n\n / styles /\n background-color: var(--_background-color);\n color: var(--_color);\n\n &[data-selected] {\n --_background-color: var(--_md-menu-item-selected-background);\n --_color: var(--_md-menu-item-selected-color);\n --_label-color: var(--_menu-item-selected-label-color);\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-open] {\n --_state-layer-opacity: 0.08;\n }\n\n &[data-pressed] {\n --_state-layer-opacity: var(--md-sys-state-pressed);\n }\n\n &[data-disabled] {\n --_label-color: rgb(\n from var(--_md-menu-item-label-color) r g b /\n var(--md-sys-state-disabled-content)\n );\n --_color: var(--_label-color);\n\n &[data-selected] {\n --_background-color: rgb(\n from var(--_md-menu-item-selected-background) r g b /\n var(--md-sys-state-disabled-container)\n );\n --_label-color: rgb(\n from var(--_menu-item-selected-label-color) r g b /\n var(--md-sys-state-disabled-content)\n );\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(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 z-index: 1;\n }\n\n /* menu label /\n .label {\n color: var(--_label-color);\n }\n\n .menu-color {\n --_md-menu-background: var(\n --md-menu-background,\n var(--_md-menu-background-default)\n );\n --_md-menu-section-label-color: var(\n --md-menu-section-label-color,\n var(--_md-menu-section-label-color-default)\n );\n\n / menu item /\n\n / background /\n --_md-menu-item-background: var(\n --md-menu-item-background,\n var(--_md-menu-item-background-default)\n );\n --_md-menu-item-selected-background: var(\n --md-menu-item-selected-background,\n var(--_md-menu-item-selected-background-default)\n );\n\n / color /\n --_md-menu-item-color: var(\n --md-menu-item-color,\n var(--_md-menu-item-color-default)\n );\n --_md-menu-item-selected-color: var(\n --md-menu-item-selected-color,\n var(--_md-menu-item-selected-color-default)\n );\n\n / label color /\n --_md-menu-item-label-color: var(\n --md-menu-item-label-color,\n var(--_md-menu-item-label-color-default)\n );\n --_menu-item-selected-label-color: var(\n --menu-item-selected-label-color,\n var(--_menu-item-selected-label-color-default)\n );\n\n --md-divider-color: var(--_md-menu-item-color);\n }\n\n .standard {\n --_md-menu-background-default: var(\n --md-sys-color-surface-container-low\n );\n --_md-menu-section-label-color-default: var(\n --md-sys-color-on-surface-variant\n );\n\n / menu item /\n\n / background /\n --_md-menu-item-background-default: var(\n --md-sys-color-surface-container-low\n );\n --_md-menu-item-selected-background-default: var(\n --md-sys-color-tertiary-container\n );\n\n / color /\n --_md-menu-item-color-default: var(--md-sys-color-on-surface-variant);\n --_md-menu-item-selected-color-default: var(\n --md-sys-color-on-tertiary-container\n );\n\n / label color /\n --_md-menu-item-label-color-default: var(--md-sys-color-on-surface);\n --_menu-item-selected-label-color-default: var(\n --md-sys-color-on-tertiary-container\n );\n }\n\n .vibrant {\n --_md-menu-background-default: var(--md-sys-color-tertiary-container);\n --_md-menu-section-label-color-default: var(\n --md-sys-color-on-tertiary-container\n );\n\n / menu item /\n\n / background /\n --_md-menu-item-background-default: var(\n --md-sys-color-tertiary-container\n );\n --_md-menu-item-selected-background-default: var(\n --md-sys-color-tertiary\n );\n\n / color /\n --_md-menu-item-color-default: var(\n --md-sys-color-on-tertiary-container\n );\n --_md-menu-item-selected-color-default: var(--md-sys-color-on-tertiary);\n\n / label color /\n --_md-menu-item-label-color-default: var(\n --md-sys-color-on-tertiary-container\n );\n --_menu-item-selected-label-color-default: var(\n --md-sys-color-on-tertiary\n );\n }\n}\n","import styles from \"./color.module.css\";\n\n/\n Color scheme variants for the menu system:\n * - `\"standard\"`: Neutral container surface with on-surface text and secondary container selection.\n * - `\"vibrant\"`: Tertiary container surface with high-contrast tertiary accents.\n /\nexport type MenuColor = \"standard\" \| \"vibrant\";\n\n/\n CSS class applying the base icon and supporting text color to menu items.\n /\nexport const menuItemBaseColor = styles[\"color\"];\n\n/\n CSS class applying the primary label text color to menu items.\n /\nexport const menuItemLabelColor = styles[\"label\"];\n\n/\n Resolves the CSS class corresponding to a given [`MenuColor`](file:///home/rohan/work/adgytec/adgytec-web-ui-components/src/components/Menu/core/color.ts#L8) variant.\n \n @param color - The selected color variant.\n * @returns The CSS class name.\n /\nexport const menuColorConfig = (color: MenuColor) => {\n return styles[color];\n};\n\n/\n CSS class applying base surface coloring to the menu container.\n /\nexport const menuBaseColor = styles[\"menu-color\"];\n","@layer adgytec.comps {\n / core menu tokens /\n .layout {\n / tokens used either by menu or menu section based on layout value /\n --_md-menu-elevation: var(--md-sys-elevation-shadow-3);\n --_md-menu-gap: calc(2 var(--dp, 1px));\n --_md-menu-padding: var(--md-sys-layout-space-4);\n\n /* shape /\n --_md-menu-shape: var(--md-sys-shape-corner-radius-small);\n --_md-menu-section-shape: var(--md-sys-shape-corner-radius-small);\n\n / menu item /\n\n --_md-menu-item-shape: var(--md-sys-shape-corner-radius-extra-small);\n --_md-menu-item-outer-shape: var(--md-sys-shape-corner-radius-medium);\n --_md-menu-item-selected-shape: var(\n --md-sys-shape-corner-radius-medium\n );\n\n / Vertical padding when item contains only a single-line label /\n / Centers 20px label within 44px container /\n --_md-menu-item-padding-block-single-line: var(\n --md-sys-layout-space-12\n );\n\n / Vertical padding when item contains label + supporting text /\n / Reduced padding to fit two text lines (20px + 16px) with 2px gap inside 44px container /\n --_md-menu-item-padding-block-multi-line: calc(3 var(--dp, 1px));\n\n /* Horizontal padding inside each menu item (excluding outer menu padding) /\n / Total visual inset = menu container padding (4) + this value (12) /\n --_md-menu-item-padding-inline-content: var(--md-sys-layout-space-12);\n\n / Spacing between elements inside a menu item (icon, text, trailing, etc.) /\n --_md-menu-item-content-gap: var(--md-sys-layout-space-8);\n\n &:focus-within {\n --_md-menu-shape: var(--md-sys-shape-corner-radius-large);\n }\n }\n\n .standard {\n --_menu-elevation: var(--_md-menu-elevation);\n --_menu-padding: var(--_md-menu-padding);\n --_menu-shape: var(--_md-menu-shape);\n --_menu-background: var(--_md-menu-background);\n\n --_menu-section-elevation: none;\n --_menu-section-padding: 0;\n --_menu-section-shape: 0;\n --_menu-section-outer-shape: 0;\n --_menu-section-background: transparent;\n\n --_menu-item-elevation: none;\n }\n\n .grouped {\n --_menu-elevation: none;\n --_menu-padding: 0;\n --_menu-shape: var(--_md-menu-shape);\n --_menu-background: transparent;\n\n --_menu-section-elevation: var(--_md-menu-elevation);\n --_menu-section-padding: var(--_md-menu-padding);\n --_menu-section-outer-shape: var(--_md-menu-shape);\n --_menu-section-shape: var(--_md-menu-section-shape);\n --_menu-section-background: var(--_md-menu-background);\n\n --_menu-item-elevation: var(--_md-menu-elevation);\n }\n}\n","import styles from \"./layout.module.css\";\n\n/\n Layout density variants for the menu:\n * - `\"standard\"`: Default density with standard item heights and padding.\n * - `\"grouped\"`: Grouped layout with compact spacing for nested or sectioned menus.\n /\nexport type MenuLayout = \"standard\" \| \"grouped\";\n\n/\n Standard dimension (20px) for leading and trailing icons in menu items.\n /\nexport const MenuItemIconSize = 20;\n\n/\n CSS class applying the base flex layout to the menu list.\n /\nexport const MenuBaseLayout = styles[\"layout\"];\n\n/\n Resolves the CSS class corresponding to a given [`MenuLayout`](file:///home/rohan/work/adgytec/adgytec-web-ui-components/src/components/Menu/core/layout.ts#L8) variant.\n \n @param layout - The layout density variant.\n * @returns The CSS class name.\n /\nexport const menuLayoutConfig = (layout: MenuLayout) => {\n return styles[layout];\n};\n","@layer adgytec.comps {\n .menu {\n background-color: var(--_menu-background);\n box-shadow: var(--_menu-elevation);\n border-radius: var(--_menu-shape);\n padding: var(--_menu-padding);\n\n outline: none;\n\n display: grid;\n gap: var(--_md-menu-gap);\n\n min-inline-size: min(100svi, calc(160 var(--dp, 1px)));\n\n overflow: auto;\n scrollbar-width: thin;\n\n transition: border-radius 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 .menu-section {\n background-color: var(--_menu-section-background);\n box-shadow: var(--_menu-section-elevation);\n border-radius: var(--_menu-section-shape);\n padding: var(--_menu-section-padding);\n\n display: grid;\n gap: var(--_md-menu-gap);\n\n transition: border-radius 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 .menu-section-header {\n padding-inline: var(--_md-menu-item-padding-inline-content);\n padding-block: var(--md-sys-layout-space-8);\n color: var(--_md-menu-section-label-color);\n }\n\n .menu-item {\n --_menu-item-padding-block: var(\n --_md-menu-item-padding-block-single-line\n );\n\n position: relative;\n outline: none;\n overflow: clip;\n\n display: flex;\n gap: var(--_md-menu-item-content-gap);\n align-items: center;\n justify-content: space-between;\n\n padding-inline: var(--_md-menu-item-padding-inline-content);\n padding-block: var(--_menu-item-padding-block);\n\n border-radius: var(--_md-menu-item-shape);\n\n transition:\n border-radius var(--md-sys-motion-expressive-fast-spatial)\n var(--md-sys-motion-expressive-fast-spatial-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\n &[data-multi-line] {\n --_menu-item-padding-block: var(\n --_md-menu-item-padding-block-multi-line\n );\n }\n\n &[data-selected] {\n border-radius: var(--_md-menu-item-selected-shape);\n }\n }\n\n .menu-item-leading,\n .menu-item-trailing {\n display: flex;\n gap: var(--_md-menu-item-content-gap);\n align-items: center;\n }\n\n /* menu -> menu item elevation /\n .menu > .menu-item {\n box-shadow: var(--_menu-item-elevation);\n }\n\n / menu -> menu section shape /\n .menu > .menu-section:first-child {\n border-start-start-radius: var(--_menu-section-outer-shape);\n border-start-end-radius: var(--_menu-section-outer-shape);\n }\n\n .menu > .menu-section:last-child {\n border-end-start-radius: var(--_menu-section-outer-shape);\n border-end-end-radius: var(--_menu-section-outer-shape);\n }\n\n / menu -> menu item shape (only if NOT selected) /\n .menu > .menu-item:not([data-selected]):first-child {\n border-start-start-radius: var(--_md-menu-shape);\n border-start-end-radius: var(--_md-menu-shape);\n }\n\n .menu > .menu-item:not([data-selected]):last-child {\n border-end-start-radius: var(--_md-menu-shape);\n border-end-end-radius: var(--_md-menu-shape);\n }\n\n / menu section -> menu item shape (only if NOT selected) /\n .menu\n > .menu-section:first-child\n > .menu-item:not([data-selected]):first-child {\n border-start-start-radius: var(--_md-menu-shape);\n border-start-end-radius: var(--_md-menu-shape);\n }\n\n .menu\n > .menu-section:last-child\n > .menu-item:not([data-selected]):last-child {\n border-end-start-radius: var(--_md-menu-shape);\n border-end-end-radius: var(--_md-menu-shape);\n }\n}\n","import styles from \"./menu.module.css\";\n\n/\n CSS class for the root menu list element.\n /\nexport const MenuStyles = styles[\"menu\"];\n\n/\n CSS class for a menu section grouping element.\n /\nexport const MenuSectionStyles = styles[\"menu-section\"];\n\n/\n CSS class for a menu section header text element.\n /\nexport const MenuSectionHeaderStyles = styles[\"menu-section-header\"];\n\n/\n CSS class for an individual interactive menu item container.\n /\nexport const MenuItemStyles = styles[\"menu-item\"];\n\n/\n CSS class for the leading content wrapper (icon, label, supporting text) of a menu item.\n /\nexport const MenuItemLeadingStyles = styles[\"menu-item-leading\"];\n\n/\n CSS class for the trailing content wrapper (trailing text, shortcut, chevron) of a menu item.\n */\nexport const MenuItemTrailingStyles = styles[\"menu-item-trailing\"];\n"],"mappings":";;;;;;GCYaK,IAAoBJ,EAAOK,OAK3BC,IAAqBN,EAAOO,OAQ5BC,KAAmB,MACrBR,EAAOS,IAMLC,IAAgBV,EAAO;;;;GEpBvBY,IAAmB,IAKnBC,IAAiBZ,EAAOa,QAQxBC,KAAoB,MACtBd,EAAOe;;;;;;;GErBLE,IAAahB,EAAOiB,MAKpBC,IAAoBlB,EAAO,iBAK3BmB,IAA0BnB,EAAO,wBAKjCoB,IAAiBpB,EAAO,cAKxBqB,IAAwBrB,EAAO,sBAK/BsB,IAAyBtB,EAAO"}

package/dist/chunks/core7.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"core7","names":[],"sources":["../../src/components/Input/Slider/core/color.module.css","../../src/components/Input/Slider/core/color.ts","../../src/components/Input/Slider/core/size.module.css","../../src/components/Input/Slider/core/size.ts","../../src/components/Input/Slider/core/variant.module.css","../../src/components/Input/Slider/core/variant.ts"],"sourcesContent":["/* configurable tokens\n\n --md-slider-active-track-color\n* --md-slider-inactive-track-color\n\n --md-slider-thumb-color\n\n --md-slider-active-stop-color\n* --md-slider-inactive-stop-color\n\n --md-slider-output-background\n* --md-slider-output-color\n\n --md-slider-icon-color\n* --md-slider-minimum-value-icon-color\n\n configurable tokens end /\n\n@layer adgytec.comps {\n .colors {\n --_md-slider-active-track-color: var(\n --md-slider-active-track-color,\n var(--md-sys-color-primary)\n );\n --_md-slider-inactive-track-color: var(\n --md-slider-inactive-track-color,\n var(--md-sys-color-secondary-container)\n );\n\n --_md-slider-thumb-color: var(\n --md-slider-thumb-color,\n var(--_md-slider-active-track-color)\n );\n\n --_md-slider-active-stop-color: var(\n --md-slider-active-stop-color,\n var(--md-sys-color-on-primary)\n );\n --_md-slider-inactive-stop-color: var(\n --md-slider-inactive-stop-color,\n var(--md-sys-color-on-secondary-container)\n );\n\n --_md-slider-output-background: var(\n --md-slider-output-background,\n var(--md-sys-color-inverse-surface)\n );\n --_md-slider-output-color: var(\n --md-slider-output-color,\n var(--md-sys-color-inverse-on-surface)\n );\n\n --_md-slider-icon-color: var(\n --md-slider-icon-color,\n var(--md-sys-color-on-primary)\n );\n --_md-slider-minimum-value-icon-color: var(\n --md-slider-minimum-value-icon-color,\n var(--md-sys-color-on-secondary-container)\n );\n }\n}\n","import styles from \"./color.module.css\";\n\nexport const SliderColors = styles[\"colors\"];\n","@layer adgytec.comps {\n .slider {\n --_track-gap: var(--md-sys-layout-space-16);\n --_orientation-inset: calc(-1 calc(var(--_track-gap) / 2));\n\n display: flex;\n flex-direction: column;\n gap: var(--md-sys-layout-space-4);\n\n block-size: 100%;\n }\n\n .track-container {\n flex: 1;\n padding: calc(-1 * var(--_orientation-inset));\n\n &[data-orientation=\"vertical\"] {\n align-self: center;\n }\n }\n\n .track {\n --_md-slider-track-inner-shape: calc(2 * var(--dp, 1px));\n\n --_active-track-color: var(--_md-slider-active-track-color);\n --_inactive-track-color: var(--_md-slider-inactive-track-color);\n\n &[data-orientation=\"horizontal\"] {\n inline-size: 100%;\n block-size: var(--_md-slider-track-size);\n }\n\n &[data-orientation=\"vertical\"] {\n block-size: 100%;\n inline-size: var(--_md-slider-track-size);\n }\n\n &[data-disabled] {\n --_active-track-color: rgb(\n from var(--md-sys-color-on-surface) r g b /\n var(--md-sys-state-disabled-content)\n );\n --_inactive-track-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 .extra-small {\n --_md-slider-track-shape: var(--md-sys-shape-corner-radius-small);\n --_md-slider-track-size: var(--md-sys-layout-space-16);\n }\n\n .small {\n --_md-slider-track-shape: var(--md-sys-shape-corner-radius-small);\n --_md-slider-track-size: var(--md-sys-layout-space-24);\n }\n\n .medium {\n --_md-slider-track-shape: var(--md-sys-shape-corner-radius-medium);\n --_md-slider-track-size: var(--md-sys-layout-space-40);\n }\n\n .large {\n --_md-slider-track-shape: var(--md-sys-shape-corner-radius-large);\n --_md-slider-track-size: var(--md-sys-layout-space-56);\n }\n\n .extra-large {\n --_md-slider-track-shape: var(--md-sys-shape-corner-radius-extra-large);\n --_md-slider-track-size: var(--md-sys-layout-space-96);\n }\n}\n","import styles from \"./size.module.css\";\n\nexport type SliderSize =\n \| \"extra-small\"\n \| \"small\"\n \| \"medium\"\n \| \"large\"\n \| \"extra-large\";\n\nexport const SliderStyles = styles[\"slider\"];\n\nexport const TrackContainerStyles = styles[\"track-container\"];\nexport const TrackStyles = styles[\"track\"];\n\nexport function SliderSizeStyles(size: SliderSize) {\n return styles[size];\n}\n","@layer adgytec.comps {\n .visual-track {\n --_range-gap: calc(var(--_track-gap) / 2);\n --_range-gap-half: calc(var(--_range-gap) / 2);\n\n position: absolute;\n inset: 0;\n z-index: 0;\n\n border-radius: var(--_md-slider-track-shape);\n display: flex;\n gap: var(--_range-gap);\n\n &[data-orientation=\"horizontal\"] {\n inset-inline: var(--_orientation-inset);\n }\n\n &[data-orientation=\"vertical\"] {\n flex-direction: column-reverse;\n inset-block: var(--_orientation-inset);\n }\n }\n\n .active-track {\n display: grid;\n\n > div {\n border-radius: var(--_md-slider-track-inner-shape);\n background-color: var(--_active-track-color);\n }\n\n &[data-orientation=\"horizontal\"] {\n > div {\n margin-inline: var(--_range-gap);\n\n &[data-direction=\"start\"] {\n margin-inline-end: var(--_range-gap-half);\n }\n\n &[data-direction=\"end\"] {\n margin-inline-start: var(--_range-gap-half);\n }\n }\n }\n\n &[data-orientation=\"vertical\"] {\n > div {\n margin-block: var(--_range-gap);\n\n &[data-direction=\"start\"] {\n margin-block-start: var(--_range-gap-half);\n }\n\n &[data-direction=\"end\"] {\n margin-block-end: var(--_range-gap-half);\n }\n }\n }\n }\n\n .inactive-track {\n background-color: var(--_inactive-track-color);\n border-radius: var(--_md-slider-track-shape);\n\n &[data-orientation=\"horizontal\"] {\n &[data-track=\"start\"] {\n border-start-end-radius: var(--_md-slider-track-inner-shape);\n border-end-end-radius: var(--_md-slider-track-inner-shape);\n }\n\n &[data-track=\"end\"] {\n border-start-start-radius: var(--_md-slider-track-inner-shape);\n border-end-start-radius: var(--_md-slider-track-inner-shape);\n }\n }\n\n &[data-orientation=\"vertical\"] {\n &[data-track=\"start\"] {\n border-start-end-radius: var(--_md-slider-track-inner-shape);\n border-start-start-radius: var(--_md-slider-track-inner-shape);\n }\n\n &[data-track=\"end\"] {\n border-end-end-radius: var(--_md-slider-track-inner-shape);\n border-end-start-radius: var(--_md-slider-track-inner-shape);\n }\n }\n }\n}\n","import styles from \"./variant.module.css\";\n\nexport type SliderVariant = \"standard\" \| \"centered\" \| \"range\";\n\nexport const VisualTrackStyles = styles[\"visual-track\"];\n\nexport const ActiveTrackStyles = styles[\"active-track\"];\nexport const InactiveTrackStyles = styles[\"inactive-track\"];\n"],"mappings":";;~~ACEA~~,~~IAAa~~,~~IAAe~~,~~6BAAA~~,~~EAAO~~;;;;;;;;;~~GEOtB~~,~~IAAe~~,~~EAAO~~,~~QAEtB~~,~~IAAuB~~,EAAO,~~oBAC9B~~,~~IAAc~~,~~EAAO~~;~~AAElC~~,~~SAAgB~~,EAAiB,GAAkB;CAC/C,~~OAAO~~,~~EAAO~~;AAClB;;;;;;;~~GEZa~~,~~IAAoB~~,EAAO,~~iBAE3B~~,~~IAAoB~~,EAAO,~~iBAC3B~~,~~IAAsB~~,EAAO"}
1	+ {"version":3,"file":"core7","names":["styles","styles","styles","SliderColors","\"colors\"","size_module_default","SliderStyles","\"slider\"","TrackContainerStyles","TrackStyles","\"track\"","SliderSizeStyles","size","variant_module_default","VisualTrackStyles","ActiveTrackStyles","InactiveTrackStyles"],"sources":["../../src/components/Input/Slider/core/color.module.css","../../src/components/Input/Slider/core/color.ts","../../src/components/Input/Slider/core/size.module.css","../../src/components/Input/Slider/core/size.ts","../../src/components/Input/Slider/core/variant.module.css","../../src/components/Input/Slider/core/variant.ts"],"sourcesContent":["/* configurable tokens\n\n --md-slider-active-track-color\n* --md-slider-inactive-track-color\n\n --md-slider-thumb-color\n\n --md-slider-active-stop-color\n* --md-slider-inactive-stop-color\n\n --md-slider-output-background\n* --md-slider-output-color\n\n --md-slider-icon-color\n* --md-slider-minimum-value-icon-color\n\n configurable tokens end /\n\n@layer adgytec.comps {\n .colors {\n --_md-slider-active-track-color: var(\n --md-slider-active-track-color,\n var(--md-sys-color-primary)\n );\n --_md-slider-inactive-track-color: var(\n --md-slider-inactive-track-color,\n var(--md-sys-color-secondary-container)\n );\n\n --_md-slider-thumb-color: var(\n --md-slider-thumb-color,\n var(--_md-slider-active-track-color)\n );\n\n --_md-slider-active-stop-color: var(\n --md-slider-active-stop-color,\n var(--md-sys-color-on-primary)\n );\n --_md-slider-inactive-stop-color: var(\n --md-slider-inactive-stop-color,\n var(--md-sys-color-on-secondary-container)\n );\n\n --_md-slider-output-background: var(\n --md-slider-output-background,\n var(--md-sys-color-inverse-surface)\n );\n --_md-slider-output-color: var(\n --md-slider-output-color,\n var(--md-sys-color-inverse-on-surface)\n );\n\n --_md-slider-icon-color: var(\n --md-slider-icon-color,\n var(--md-sys-color-on-primary)\n );\n --_md-slider-minimum-value-icon-color: var(\n --md-slider-minimum-value-icon-color,\n var(--md-sys-color-on-secondary-container)\n );\n }\n}\n","import styles from \"./color.module.css\";\n\n/* CSS class providing theme color tokens for sliders. /\nexport const SliderColors = styles[\"colors\"];\n","@layer adgytec.comps {\n .slider {\n --_track-gap: var(--md-sys-layout-space-16);\n --_orientation-inset: calc(-1 calc(var(--_track-gap) / 2));\n\n display: flex;\n flex-direction: column;\n gap: var(--md-sys-layout-space-4);\n\n block-size: 100%;\n }\n\n .track-container {\n flex: 1;\n padding: calc(-1 * var(--_orientation-inset));\n\n &[data-orientation=\"vertical\"] {\n align-self: center;\n }\n }\n\n .track {\n --_md-slider-track-inner-shape: calc(2 * var(--dp, 1px));\n\n --_active-track-color: var(--_md-slider-active-track-color);\n --_inactive-track-color: var(--_md-slider-inactive-track-color);\n\n &[data-orientation=\"horizontal\"] {\n inline-size: 100%;\n block-size: var(--_md-slider-track-size);\n }\n\n &[data-orientation=\"vertical\"] {\n block-size: 100%;\n inline-size: var(--_md-slider-track-size);\n }\n\n &[data-disabled] {\n --_active-track-color: rgb(\n from var(--md-sys-color-on-surface) r g b /\n var(--md-sys-state-disabled-content)\n );\n --_inactive-track-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 .extra-small {\n --_md-slider-track-shape: var(--md-sys-shape-corner-radius-small);\n --_md-slider-track-size: var(--md-sys-layout-space-16);\n }\n\n .small {\n --_md-slider-track-shape: var(--md-sys-shape-corner-radius-small);\n --_md-slider-track-size: var(--md-sys-layout-space-24);\n }\n\n .medium {\n --_md-slider-track-shape: var(--md-sys-shape-corner-radius-medium);\n --_md-slider-track-size: var(--md-sys-layout-space-40);\n }\n\n .large {\n --_md-slider-track-shape: var(--md-sys-shape-corner-radius-large);\n --_md-slider-track-size: var(--md-sys-layout-space-56);\n }\n\n .extra-large {\n --_md-slider-track-shape: var(--md-sys-shape-corner-radius-extra-large);\n --_md-slider-track-size: var(--md-sys-layout-space-96);\n }\n}\n","import styles from \"./size.module.css\";\n\n/*\n Size presets for slider track height and thumb diameter.\n /\nexport type SliderSize =\n \| \"extra-small\"\n \| \"small\"\n \| \"medium\"\n \| \"large\"\n \| \"extra-large\";\n\n/* Base CSS class for the slider container. /\nexport const SliderStyles = styles[\"slider\"];\n\n/* CSS class for the track wrapper container. /\nexport const TrackContainerStyles = styles[\"track-container\"];\n\n/* CSS class for the interactive slider track. /\nexport const TrackStyles = styles[\"track\"];\n\n/\n Resolves the CSS module class for a given slider size preset.\n \n @param size - The desired slider size preset.\n * @returns The corresponding CSS class name.\n /\nexport function SliderSizeStyles(size: SliderSize) {\n return styles[size];\n}\n","@layer adgytec.comps {\n .visual-track {\n --_range-gap: calc(var(--_track-gap) / 2);\n --_range-gap-half: calc(var(--_range-gap) / 2);\n\n position: absolute;\n inset: 0;\n z-index: 0;\n\n border-radius: var(--_md-slider-track-shape);\n display: flex;\n gap: var(--_range-gap);\n\n &[data-orientation=\"horizontal\"] {\n inset-inline: var(--_orientation-inset);\n }\n\n &[data-orientation=\"vertical\"] {\n flex-direction: column-reverse;\n inset-block: var(--_orientation-inset);\n }\n }\n\n .active-track {\n display: grid;\n\n > div {\n border-radius: var(--_md-slider-track-inner-shape);\n background-color: var(--_active-track-color);\n }\n\n &[data-orientation=\"horizontal\"] {\n > div {\n margin-inline: var(--_range-gap);\n\n &[data-direction=\"start\"] {\n margin-inline-end: var(--_range-gap-half);\n }\n\n &[data-direction=\"end\"] {\n margin-inline-start: var(--_range-gap-half);\n }\n }\n }\n\n &[data-orientation=\"vertical\"] {\n > div {\n margin-block: var(--_range-gap);\n\n &[data-direction=\"start\"] {\n margin-block-start: var(--_range-gap-half);\n }\n\n &[data-direction=\"end\"] {\n margin-block-end: var(--_range-gap-half);\n }\n }\n }\n }\n\n .inactive-track {\n background-color: var(--_inactive-track-color);\n border-radius: var(--_md-slider-track-shape);\n\n &[data-orientation=\"horizontal\"] {\n &[data-track=\"start\"] {\n border-start-end-radius: var(--_md-slider-track-inner-shape);\n border-end-end-radius: var(--_md-slider-track-inner-shape);\n }\n\n &[data-track=\"end\"] {\n border-start-start-radius: var(--_md-slider-track-inner-shape);\n border-end-start-radius: var(--_md-slider-track-inner-shape);\n }\n }\n\n &[data-orientation=\"vertical\"] {\n &[data-track=\"start\"] {\n border-start-end-radius: var(--_md-slider-track-inner-shape);\n border-start-start-radius: var(--_md-slider-track-inner-shape);\n }\n\n &[data-track=\"end\"] {\n border-end-end-radius: var(--_md-slider-track-inner-shape);\n border-end-start-radius: var(--_md-slider-track-inner-shape);\n }\n }\n }\n}\n","import styles from \"./variant.module.css\";\n\n/\n Functional slider track variants.\n \n - `\"standard\"`: Single thumb sliding from minimum to maximum.\n * - `\"centered\"`: Single thumb sliding bidirectional deviations from center (zero/neutral point).\n * - `\"range\"`: Two thumbs selecting a range interval between lower and upper bounds.\n /\nexport type SliderVariant = \"standard\" \| \"centered\" \| \"range\";\n\n/* CSS class for visual track background. /\nexport const VisualTrackStyles = styles[\"visual-track\"];\n\n/* CSS class for the active/highlighted portion of the slider track. /\nexport const ActiveTrackStyles = styles[\"active-track\"];\n\n/* CSS class for the inactive/unselected portion of the slider track. */\nexport const InactiveTrackStyles = styles[\"inactive-track\"];\n"],"mappings":";;ACGA,IAAaG,IAAeH,6BAAAA,EAAOI;;;;;;;;;GEUtBE,IAAeL,EAAOM,QAGtBC,IAAuBP,EAAO,oBAG9BQ,IAAcR,EAAOS;AAQlC,SAAgBC,EAAiB,GAAkB;CAC/C,OAAOV,EAAOW;AAClB;;;;;;;GEjBaE,IAAoBZ,EAAO,iBAG3Ba,IAAoBb,EAAO,iBAG3Bc,IAAsBd,EAAO"}

package/dist/chunks/core8.map CHANGED Viewed

	@@ -1 +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~~,~~SAAO~~,IAAA;CACH,~~IAAA~~,~~IAAY~~,~~EAAW~~,CAAqB;CAC5C,~~IAAI~~,KAAO,MACP,MAAU,MACN,mHACJ;CACH,~~OAEM~~;AAAG;;;~~ACfd~~,~~IAAa~~,~~IAAkB~~,EAAmC,KAAA,CAAS"}
1	+ {"version":3,"file":"core8","names":["styles","navigation_module_default","NavigationStyles","\"navigation\"","NavigationHeaderStyles","SubNavigationHeaderStyles","NavigationInfoContext","createContext","useNavigationInfo","ctx","useContext","NavLabelContext"],"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\n/*\n CSS class for the root navigation container layout and surface styling.\n /\nexport const NavigationStyles = styles[\"navigation\"];\n\n/\n CSS class for the header area of a root [`Navigation`](file:///home/rohan/work/adgytec/adgytec-web-ui-components/src/components/Navigation/Navigation/Navigation.tsx) container.\n /\nexport const NavigationHeaderStyles = styles[\"nav-header\"];\n\n/\n CSS class for the header area of a sliding [`SubNavigation`](file:///home/rohan/work/adgytec/adgytec-web-ui-components/src/components/Navigation/SubNavigation/SubNavigation/SubNavigation.tsx) panel.\n /\nexport const SubNavigationHeaderStyles = styles[\"sub-nav-header\"];\n","import { createContext, useContext } from \"react\";\n\n/\n Identifier and nesting depth information for the current navigation level.\n /\nexport type NavigationInfoContextType = {\n /\n Unique identifier for this navigation level/panel.\n /\n id: string;\n /\n Current nesting hierarchy depth (root is 0, sub-navigations increment from 1).\n /\n depth: number;\n};\n\n/\n React context providing the current navigation level's ID and hierarchy depth.\n /\nexport const NavigationInfoContext =\n createContext<NavigationInfoContextType \| null>(null);\n\n/\n Hook to access the current navigation level's unique ID and nesting depth.\n \n @throws If rendered outside of a [`Navigation`](file:///home/rohan/work/adgytec/adgytec-web-ui-components/src/components/Navigation/Navigation/Navigation.tsx)\n * or [`SubNavigation`](file:///home/rohan/work/adgytec/adgytec-web-ui-components/src/components/Navigation/SubNavigation/SubNavigation/SubNavigation.tsx) component.\n * @returns The current {@link NavigationInfoContextType}.\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\n/\n Context value representing the label inherited from a parent navigation trigger.\n /\nexport type NavLabelContextType = ReactNode;\n\n/\n React context providing the trigger label to descendant navigation items or sub-navigation panels.\n */\nexport const NavLabelContext = createContext<NavLabelContextType>(undefined);\n"],"mappings":";;;;;GCKaE,IAAmBF,EAAOG,YAK1BC,IAAyBJ,EAAO,eAKhCK,IAA4BL,EAAO,mBCInCM,IACTC,EAAgD,IAAI;AASxD,SAAOC,IAAA;CACH,IAAAC,IAAYC,EAAWJ,CAAqB;CAC5C,IAAIG,KAAO,MACP,MAAU,MACN,mHACJ;CACH,OAEMA;AAAG;;;AC3Bd,IAAaE,IAAkBJ,EAAmC,KAAA,CAAS"}

package/dist/chunks/core9.map CHANGED Viewed

	@@ -1 +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 \| ((value?: string) => boolean);\n}\n\nexport const NavigationItemLabelTypography = typography.titleSmall;\nexport const NavigationItemStyles = styles[\"item\"];\n"],"mappings":";~~oCCYa~~,~~IAAgC~~,EAAW,~~YAC3C~~,~~IAAuB~~,~~EAAO~~"}
1	+ {"version":3,"file":"core9","names":["styles","typography","navigationItem_module_default","NavigationItemLabelTypography","NavigationItemStyles","\"item\""],"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\n/*\n Common configuration properties shared across navigation items ([`NavigationLink`](file:///home/rohan/work/adgytec/adgytec-web-ui-components/src/components/Navigation/NavigationItem/NavigationLink/NavigationLink.tsx)\n * and [`NavigationButton`](file:///home/rohan/work/adgytec/adgytec-web-ui-components/src/components/Navigation/NavigationItem/NavigationButton/NavigationButton.tsx)).\n /\nexport interface NavigationItemProps {\n /\n Primary label content for the navigation item.\n /\n label: ReactNode;\n\n /\n Optional icon displayed when the navigation item is in its inactive state.\n /\n icon?: LucideIcon;\n\n /\n Optional alternate icon displayed when the navigation item is in its active state.\n /\n activeIcon?: LucideIcon;\n\n /\n Override flag or predicate function evaluating whether the item is currently active.\n /\n isActive?: boolean \| ((value?: string) => boolean);\n}\n\n/\n Standard typography style (`titleSmall`) for navigation item label text.\n /\nexport const NavigationItemLabelTypography = typography.titleSmall;\n\n/\n CSS class for individual navigation item styling, interactive state layers, and padding.\n */\nexport const NavigationItemStyles = styles[\"item\"];\n"],"mappings":";oCCkCaG,IAAgCF,EAAW,YAK3CG,IAAuBJ,EAAOK"}

package/dist/chunks/navContext.map CHANGED Viewed

	@@ -1 +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~~,~~SAAO~~,IAAA;CACH,~~IAAA~~,~~IAAY~~,~~EAAW~~,CAAiB;CACxC,~~IAAI~~,MAAQ,MACR,MAAU,MACN,0FACJ;CACH,~~OAEM~~;AAAG"}
1	+ {"version":3,"file":"navContext","names":["NavigationContext","createContext","useNavigationContext","ctx","useContext"],"sources":["../../src/components/Navigation/Navigation/navContext.ts"],"sourcesContent":["import { createContext, useContext } from \"react\";\nimport type { IsButtonActive, IsLinkActive } from \"./types\";\n\n/*\n Context value carrying active predicate functions for child navigation items.\n /\nexport type NavigationContextType = {\n /\n Active predicate function for links.\n /\n isLinkActive?: IsLinkActive;\n /\n Active predicate function for buttons.\n /\n isButtonActive?: IsButtonActive;\n};\n\n/\n React context providing link and button active state predicates to descendant navigation items.\n /\nexport const NavigationContext = createContext<NavigationContextType \| null>(\n null\n);\n\n/\n Hook to access active state predicates (`isLinkActive` and `isButtonActive`) from the parent\n * [`Navigation`](file:///home/rohan/work/adgytec/adgytec-web-ui-components/src/components/Navigation/Navigation/Navigation.tsx) container.\n \n @throws If called outside of a `Navigation` component.\n * @returns The current {@link NavigationContextType}.\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":";;AAoBA,IAAaA,IAAoBC,EAC7B,IACJ;AASA,SAAOC,IAAA;CACH,IAAAC,IAAYC,EAAWJ,CAAiB;CACxC,IAAIG,MAAQ,MACR,MAAU,MACN,0FACJ;CACH,OAEMA;AAAG"}