@adgytec/adgytec-web-ui-components 2.1.6 → 2.1.8
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.
- package/dist/assets/core.css +1 -1
- package/dist/chunks/ActionDialog.map +1 -1
- package/dist/chunks/AppBarAction.map +1 -1
- package/dist/chunks/AppBarAvatar +38 -30
- package/dist/chunks/AppBarAvatar.map +1 -1
- package/dist/chunks/AppBarHeadline +18 -12
- package/dist/chunks/AppBarHeadline.map +1 -1
- package/dist/chunks/BaseCalendar.map +1 -1
- package/dist/chunks/BottomSheet +23 -16
- package/dist/chunks/BottomSheet.map +1 -1
- package/dist/chunks/BottomSheetModal.map +1 -1
- package/dist/chunks/ButtonGroup +28 -20
- package/dist/chunks/ButtonGroup.map +1 -1
- package/dist/chunks/CalendarCell.map +1 -1
- package/dist/chunks/CalendarGrid +40 -22
- package/dist/chunks/CalendarGrid.map +1 -1
- package/dist/chunks/CalendarMenuItem +18 -9
- package/dist/chunks/CalendarMenuItem.map +1 -1
- package/dist/chunks/CenteredSlider.map +1 -1
- package/dist/chunks/ComboBox.map +1 -1
- package/dist/chunks/ComboBoxPopover.map +1 -1
- package/dist/chunks/ComboBoxTrigger +66 -44
- package/dist/chunks/ComboBoxTrigger.map +1 -1
- package/dist/chunks/ConnectedButtonGroup.map +1 -1
- package/dist/chunks/Dialog +21 -12
- package/dist/chunks/Dialog.map +1 -1
- package/dist/chunks/Disclosure +17 -8
- package/dist/chunks/Disclosure.map +1 -1
- package/dist/chunks/DisclosureGroup +28 -15
- package/dist/chunks/DisclosureGroup.map +1 -1
- package/dist/chunks/DisclosureHeader +53 -35
- package/dist/chunks/DisclosureHeader.map +1 -1
- package/dist/chunks/DisclosurePanel +22 -12
- package/dist/chunks/DisclosurePanel.map +1 -1
- package/dist/chunks/Divider +18 -9
- package/dist/chunks/Divider.map +1 -1
- package/dist/chunks/FieldError +18 -9
- package/dist/chunks/FieldError.map +1 -1
- package/dist/chunks/Icon +20 -15
- package/dist/chunks/Icon.map +1 -1
- package/dist/chunks/Input +72 -64
- package/dist/chunks/Input.map +1 -1
- package/dist/chunks/Input2 +82 -72
- package/dist/chunks/Input2.map +1 -1
- package/dist/chunks/Loader +17 -10
- package/dist/chunks/Loader.map +1 -1
- package/dist/chunks/MenuPopover +17 -8
- package/dist/chunks/MenuPopover.map +1 -1
- package/dist/chunks/Modal +17 -8
- package/dist/chunks/Modal.map +1 -1
- package/dist/chunks/ModalOverlay +17 -8
- package/dist/chunks/ModalOverlay.map +1 -1
- package/dist/chunks/Navigation +46 -36
- package/dist/chunks/Navigation.map +1 -1
- package/dist/chunks/NavigationScrollContainer +37 -27
- package/dist/chunks/NavigationScrollContainer.map +1 -1
- package/dist/chunks/NavigationSection +16 -7
- package/dist/chunks/NavigationSection.map +1 -1
- package/dist/chunks/NavigationSectionLabel +18 -9
- package/dist/chunks/NavigationSectionLabel.map +1 -1
- package/dist/chunks/NavigationState.map +1 -1
- package/dist/chunks/Popover +17 -8
- package/dist/chunks/Popover.map +1 -1
- package/dist/chunks/Radio +59 -52
- package/dist/chunks/Radio.map +1 -1
- package/dist/chunks/RichTooltip +17 -8
- package/dist/chunks/RichTooltip.map +1 -1
- package/dist/chunks/RichTooltipActions +16 -7
- package/dist/chunks/RichTooltipActions.map +1 -1
- package/dist/chunks/RichTooltipInfo +16 -7
- package/dist/chunks/RichTooltipInfo.map +1 -1
- package/dist/chunks/SearchField.map +1 -1
- package/dist/chunks/SelectPopover +17 -8
- package/dist/chunks/SelectPopover.map +1 -1
- package/dist/chunks/SelectTrigger +34 -24
- package/dist/chunks/SelectTrigger.map +1 -1
- package/dist/chunks/SideSheet +64 -52
- package/dist/chunks/SideSheet.map +1 -1
- package/dist/chunks/SideSheetModal.map +1 -1
- package/dist/chunks/Slider.map +1 -1
- package/dist/chunks/SliderOutput +21 -16
- package/dist/chunks/SliderOutput.map +1 -1
- package/dist/chunks/SliderStops.map +1 -1
- package/dist/chunks/Snackbar.map +1 -1
- package/dist/chunks/SplitButtonTrigger +48 -38
- package/dist/chunks/SplitButtonTrigger.map +1 -1
- package/dist/chunks/SubmenuPopover.map +1 -1
- package/dist/chunks/Switch.map +1 -1
- package/dist/chunks/Tab +41 -29
- package/dist/chunks/Tab.map +1 -1
- package/dist/chunks/TabList +16 -8
- package/dist/chunks/TabList.map +1 -1
- package/dist/chunks/TabPanel +16 -8
- package/dist/chunks/TabPanel.map +1 -1
- package/dist/chunks/TabPanels +17 -9
- package/dist/chunks/TabPanels.map +1 -1
- package/dist/chunks/Tabs +17 -8
- package/dist/chunks/Tabs.map +1 -1
- package/dist/chunks/Tag.map +1 -1
- package/dist/chunks/ThemeSelector +73 -72
- package/dist/chunks/ThemeSelector.map +1 -1
- package/dist/chunks/Toolbar +20 -12
- package/dist/chunks/Toolbar.map +1 -1
- package/dist/chunks/Tooltip.map +1 -1
- package/dist/chunks/compiler-runtime +24 -0
- package/dist/chunks/compiler-runtime.map +1 -0
- package/dist/chunks/core +75 -68
- package/dist/chunks/core.map +1 -1
- package/dist/chunks/core3.map +1 -1
- package/dist/chunks/core8.map +1 -1
- package/dist/chunks/core9.map +1 -1
- package/dist/chunks/navContext.map +1 -1
- package/dist/chunks/useGlobalListeners.map +1 -1
- package/dist/chunks/useHover +1 -1
- package/dist/chunks/useHover.map +1 -1
- package/dist/chunks/usePress +1 -1
- package/dist/chunks/usePress.map +1 -1
- package/dist/chunks/useSplash +42 -27
- package/dist/chunks/useSplash.map +1 -1
- package/dist/components/AppBar/core/index.js.map +1 -1
- package/dist/components/Button/Button/index.js +61 -48
- package/dist/components/Button/Button/index.js.map +1 -1
- package/dist/components/Button/ButtonGroups/ButtonGroupContext/index.js.map +1 -1
- package/dist/components/Button/IconButton/index.js.map +1 -1
- package/dist/components/Button/LinkButton/index.js +61 -48
- package/dist/components/Button/LinkButton/index.js.map +1 -1
- package/dist/components/Button/LinkIconButton/index.js.map +1 -1
- package/dist/components/Button/SplitButton/SplitButtonContext/index.js.map +1 -1
- package/dist/components/Button/SplitButton/SplitButtonPrimary/index.js.map +1 -1
- package/dist/components/Button/ToggleButton/index.js +69 -54
- package/dist/components/Button/ToggleButton/index.js.map +1 -1
- package/dist/components/Button/ToggleIconButton/index.js.map +1 -1
- package/dist/components/Calendar/Calendar/index.js +22 -12
- package/dist/components/Calendar/Calendar/index.js.map +1 -1
- package/dist/components/Calendar/CalendarMonthMenu/index.js +38 -33
- package/dist/components/Calendar/CalendarMonthMenu/index.js.map +1 -1
- package/dist/components/Calendar/CalendarYearMenu/index.js +31 -26
- package/dist/components/Calendar/CalendarYearMenu/index.js.map +1 -1
- package/dist/components/Calendar/RangeCalendar/index.js +25 -15
- package/dist/components/Calendar/RangeCalendar/index.js.map +1 -1
- package/dist/components/Dialog/core/index.js.map +1 -1
- package/dist/components/Disclosure/context/index.js +11 -12
- package/dist/components/Disclosure/context/index.js.map +1 -1
- package/dist/components/Image/index.js.map +1 -1
- package/dist/components/Input/CharacterCount/index.js +18 -10
- package/dist/components/Input/CharacterCount/index.js.map +1 -1
- package/dist/components/Input/DateField/index.js.map +1 -1
- package/dist/components/Input/DatePicker/DatePicker/index.js.map +1 -1
- package/dist/components/Input/DatePicker/DateRangePicker/index.js.map +1 -1
- package/dist/components/Input/Description/index.js +21 -10
- package/dist/components/Input/Description/index.js.map +1 -1
- package/dist/components/Input/Label/index.js +18 -10
- package/dist/components/Input/Label/index.js.map +1 -1
- package/dist/components/Input/Select/Select/index.js.map +1 -1
- package/dist/components/Input/Select/SelectItem/index.js.map +1 -1
- package/dist/components/Input/Select/SelectList/index.js.map +1 -1
- package/dist/components/Input/Select/SelectListSection/index.js +17 -9
- package/dist/components/Input/Select/SelectListSection/index.js.map +1 -1
- package/dist/components/Input/Select/SelectListSectionHeader/index.js +18 -10
- package/dist/components/Input/Select/SelectListSectionHeader/index.js.map +1 -1
- package/dist/components/Input/Slider/RangeSlider/index.js.map +1 -1
- package/dist/components/Input/TextArea/index.js.map +1 -1
- package/dist/components/Input/TimeField/index.js.map +1 -1
- package/dist/components/Input/hooks/index.js +16 -10
- package/dist/components/Input/hooks/index.js.map +1 -1
- package/dist/components/Menu/Menu/index.js +19 -14
- package/dist/components/Menu/Menu/index.js.map +1 -1
- package/dist/components/Menu/MenuItem/index.js +48 -38
- package/dist/components/Menu/MenuItem/index.js.map +1 -1
- package/dist/components/Menu/MenuSection/index.js +18 -10
- package/dist/components/Menu/MenuSection/index.js.map +1 -1
- package/dist/components/Menu/MenuSectionHeader/index.js +18 -10
- package/dist/components/Menu/MenuSectionHeader/index.js.map +1 -1
- package/dist/components/Menu/MenuShortcut/index.js +16 -8
- package/dist/components/Menu/MenuShortcut/index.js.map +1 -1
- package/dist/components/Menu/MenuTrailingText/index.js +16 -8
- package/dist/components/Menu/MenuTrailingText/index.js.map +1 -1
- package/dist/components/Menu/MenuTrigger/index.js +21 -11
- package/dist/components/Menu/MenuTrigger/index.js.map +1 -1
- package/dist/components/Menu/context/index.js.map +1 -1
- package/dist/components/Navigation/NavigationItem/NavigationButton/index.js +30 -21
- package/dist/components/Navigation/NavigationItem/NavigationButton/index.js.map +1 -1
- package/dist/components/Navigation/NavigationItem/NavigationItemIconRenderer/index.js +30 -8
- package/dist/components/Navigation/NavigationItem/NavigationItemIconRenderer/index.js.map +1 -1
- package/dist/components/Navigation/NavigationItem/NavigationLink/index.js +29 -20
- package/dist/components/Navigation/NavigationItem/NavigationLink/index.js.map +1 -1
- package/dist/components/Navigation/SubNavigation/SubNavigation/index.js +69 -56
- package/dist/components/Navigation/SubNavigation/SubNavigation/index.js.map +1 -1
- package/dist/components/Navigation/SubNavigation/SubNavigationTrigger/index.js +48 -29
- package/dist/components/Navigation/SubNavigation/SubNavigationTrigger/index.js.map +1 -1
- package/dist/components/Tooltip/RichTooltip/RichTooltipInfo/RichTooltipSubhead/index.js +17 -9
- package/dist/components/Tooltip/RichTooltip/RichTooltipInfo/RichTooltipSubhead/index.js.map +1 -1
- package/dist/components/Tooltip/RichTooltip/RichTooltipInfo/RichTooltipText/index.js +17 -9
- package/dist/components/Tooltip/RichTooltip/RichTooltipInfo/RichTooltipText/index.js.map +1 -1
- package/dist/components/Tooltip/TooltipTrigger/index.js.map +1 -1
- package/dist/index.js.map +1 -1
- package/dist/src/components/Navigation/NavigationItem/core/navigationItem.d.ts +1 -1
- package/package.json +4 -4
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ButtonGroup","names":[],"sources":["../../src/components/Button/ButtonGroups/ButtonGroup/buttonGroup.module.css","../../src/components/Button/ButtonGroups/ButtonGroup/ButtonGroup.tsx"],"sourcesContent":["@layer adgytec.comps {\n .button-group {\n display: inline-flex;\n align-items: center;\n\n gap: var(--_md-button-group-gap);\n }\n\n .button-group [data-visual-button] {\n padding-inline: calc(\n var(--_md-button-padding-inline) +\n var(--_morph, 0px)\n );\n }\n\n /* pressed item */\n .button-group > [data-pressed] {\n --_morph: var(--_morph-pressed, 0px);\n }\n\n /* next sibling */\n .button-group > [data-pressed] + * {\n --_morph: var(--_morph-pressed-sibling, 0px);\n }\n\n /* previous sibling */\n .button-group > *:has(+ [data-pressed]) {\n --_morph: var(--_morph-pressed-sibling, 0px);\n }\n\n /* next sibling ONLY if pressed is first */\n .button-group > [data-pressed]:first-child + * {\n --_morph: var(--_morph-edge-pressed-sibling, 0px);\n }\n\n /* previous sibling ONLY if pressed is last */\n .button-group > *:has(+ [data-pressed]:last-child) {\n --_morph: var(--_morph-edge-pressed-sibling, 0px);\n }\n\n .extra-small {\n --_md-button-group-gap: calc(18 * var(--dp, 1px));\n\n --_morph-pressed: var(--md-sys-layout-space-4);\n --_morph-pressed-sibling: calc(-1 * calc(var(--_morph-pressed) / 2));\n --_morph-edge-pressed-sibling: calc(-1 * var(--_morph-pressed));\n }\n\n .small {\n --_md-button-group-gap: var(--md-sys-layout-space-12);\n\n --_morph-pressed: calc(6 * var(--dp, 1px));\n --_morph-pressed-sibling: calc(-1 * calc(var(--_morph-pressed) / 2));\n --_morph-edge-pressed-sibling: calc(-1 * var(--_morph-pressed));\n }\n\n .medium {\n --_md-button-group-gap: var(--md-sys-layout-space-8);\n\n --_morph-pressed: var(--md-sys-layout-space-12);\n --_morph-pressed-sibling: calc(-1 * calc(var(--_morph-pressed) / 2));\n --_morph-edge-pressed-sibling: calc(-1 * var(--_morph-pressed));\n }\n\n .large {\n --_md-button-group-gap: var(--md-sys-layout-space-8);\n\n --_morph-pressed: var(--md-sys-layout-space-16);\n --_morph-pressed-sibling: calc(-1 * calc(var(--_morph-pressed) / 2));\n --_morph-edge-pressed-sibling: calc(-1 * var(--_morph-pressed));\n }\n\n .extra-large {\n --_md-button-group-gap: var(--md-sys-layout-space-8);\n\n --_morph-pressed: var(--md-sys-layout-space-20);\n --_morph-pressed-sibling: calc(-1 * calc(var(--_morph-pressed) / 2));\n --_morph-edge-pressed-sibling: calc(-1 * var(--_morph-pressed));\n }\n}\n","import { clsx } from \"clsx\";\nimport { useMemo } from \"react\";\nimport { ToggleButtonGroup as AriaToggleButtonGroup } from \"react-aria-components\";\nimport { ButtonGroupContext } from \"../ButtonGroupContext\";\nimport styles from \"./buttonGroup.module.css\";\nimport type { ButtonGroupProps } from \"./types\";\n\nexport const ButtonGroup: React.FC<ButtonGroupProps> = ({\n size,\n shape,\n color,\n className,\n iconPlacement,\n ...props\n}) => {\n const contextValue = useMemo(\n () => ({ size, shape, color, iconPlacement }),\n [size, shape, color, iconPlacement]\n );\n\n return (\n <ButtonGroupContext value={contextValue}>\n <AriaToggleButtonGroup\n className={(renderProps) =>\n clsx(\n styles[\"button-group\"],\n styles[size ?? \"small\"],\n typeof className === \"function\"\n ? className(renderProps)\n : className\n )\n }\n {...props}\n data-button-group\n />\n </ButtonGroupContext>\n );\n};\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"ButtonGroup","names":["contextValue"],"sources":["../../src/components/Button/ButtonGroups/ButtonGroup/buttonGroup.module.css","../../src/components/Button/ButtonGroups/ButtonGroup/ButtonGroup.tsx"],"sourcesContent":["@layer adgytec.comps {\n .button-group {\n display: inline-flex;\n align-items: center;\n\n gap: var(--_md-button-group-gap);\n }\n\n .button-group [data-visual-button] {\n padding-inline: calc(\n var(--_md-button-padding-inline) +\n var(--_morph, 0px)\n );\n }\n\n /* pressed item */\n .button-group > [data-pressed] {\n --_morph: var(--_morph-pressed, 0px);\n }\n\n /* next sibling */\n .button-group > [data-pressed] + * {\n --_morph: var(--_morph-pressed-sibling, 0px);\n }\n\n /* previous sibling */\n .button-group > *:has(+ [data-pressed]) {\n --_morph: var(--_morph-pressed-sibling, 0px);\n }\n\n /* next sibling ONLY if pressed is first */\n .button-group > [data-pressed]:first-child + * {\n --_morph: var(--_morph-edge-pressed-sibling, 0px);\n }\n\n /* previous sibling ONLY if pressed is last */\n .button-group > *:has(+ [data-pressed]:last-child) {\n --_morph: var(--_morph-edge-pressed-sibling, 0px);\n }\n\n .extra-small {\n --_md-button-group-gap: calc(18 * var(--dp, 1px));\n\n --_morph-pressed: var(--md-sys-layout-space-4);\n --_morph-pressed-sibling: calc(-1 * calc(var(--_morph-pressed) / 2));\n --_morph-edge-pressed-sibling: calc(-1 * var(--_morph-pressed));\n }\n\n .small {\n --_md-button-group-gap: var(--md-sys-layout-space-12);\n\n --_morph-pressed: calc(6 * var(--dp, 1px));\n --_morph-pressed-sibling: calc(-1 * calc(var(--_morph-pressed) / 2));\n --_morph-edge-pressed-sibling: calc(-1 * var(--_morph-pressed));\n }\n\n .medium {\n --_md-button-group-gap: var(--md-sys-layout-space-8);\n\n --_morph-pressed: var(--md-sys-layout-space-12);\n --_morph-pressed-sibling: calc(-1 * calc(var(--_morph-pressed) / 2));\n --_morph-edge-pressed-sibling: calc(-1 * var(--_morph-pressed));\n }\n\n .large {\n --_md-button-group-gap: var(--md-sys-layout-space-8);\n\n --_morph-pressed: var(--md-sys-layout-space-16);\n --_morph-pressed-sibling: calc(-1 * calc(var(--_morph-pressed) / 2));\n --_morph-edge-pressed-sibling: calc(-1 * var(--_morph-pressed));\n }\n\n .extra-large {\n --_md-button-group-gap: var(--md-sys-layout-space-8);\n\n --_morph-pressed: var(--md-sys-layout-space-20);\n --_morph-pressed-sibling: calc(-1 * calc(var(--_morph-pressed) / 2));\n --_morph-edge-pressed-sibling: calc(-1 * var(--_morph-pressed));\n }\n}\n","import { clsx } from \"clsx\";\nimport { useMemo } from \"react\";\nimport { ToggleButtonGroup as AriaToggleButtonGroup } from \"react-aria-components\";\nimport { ButtonGroupContext } from \"../ButtonGroupContext\";\nimport styles from \"./buttonGroup.module.css\";\nimport type { ButtonGroupProps } from \"./types\";\n\nexport const ButtonGroup: React.FC<ButtonGroupProps> = ({\n size,\n shape,\n color,\n className,\n iconPlacement,\n ...props\n}) => {\n const contextValue = useMemo(\n () => ({ size, shape, color, iconPlacement }),\n [size, shape, color, iconPlacement]\n );\n\n return (\n <ButtonGroupContext value={contextValue}>\n <AriaToggleButtonGroup\n className={(renderProps) =>\n clsx(\n styles[\"button-group\"],\n styles[size ?? \"small\"],\n typeof className === \"function\"\n ? className(renderProps)\n : className\n )\n }\n {...props}\n data-button-group\n />\n </ButtonGroupContext>\n );\n};\n"],"mappings":";;;;;;;;;;;;;;GCOa,KAA0C,MAAA;CAAA,IAAA,KAAA,GAAA,EAAA,EAAA,CAAA,EAAA,GAAA,GAAA,GAAA,GAAA,GAAA,GAAA;CAAA,AAAA,EAAA,OAAA,KAOtD,IAAA,EAAA,IAAA,IAAA,EAAA,IAAA,IAAA,EAAA,IAAA,IAAA,EAAA,IAAA,IAAA,EAAA,IAAA,IAAA,EAAA,OAPuD,iEAAA,KAAA,GAOvD,EAAA,KAAA,GAAA,EAAA,KAAA,GAAA,EAAA,KAAA,GAAA,EAAA,KAAA,GAAA,EAAA,KAAA,GAAA,EAAA,KAAA,GAAA,EAAA,KAAA;CAAA,IAAA;CAAA,AAAA,EAAA,OAAA,KAAA,EAAA,OAAA,KAAA,EAAA,OAAA,KAAA,EAAA,QAAA,KAEc,IAAA;EAAA;EAAA;EAAA;EAAA;CAAoC,GAAC,EAAA,KAAA,GAAA,EAAA,KAAA,GAAA,EAAA,KAAA,GAAA,EAAA,MAAA,GAAA,EAAA,MAAA,KAAA,IAAA,EAAA;CADhD,IAAA,IACW,GAET;CAAA,AAAA,EAAA,QAAA,KAAA,EAAA,QAAA,KAKqB,KAAA,MACP,EACI,EAAO,iBACP,EAAO,KAAA,UACP,OAAO,KAAc,aACf,EAAU,CACF,IAFd,CAGJ,GAAC,EAAA,MAAA,GAAA,EAAA,MAAA,GAAA,EAAA,MAAA,KAAA,IAAA,EAAA;CAAA,IAAA;CAAA,AAAA,EAAA,QAAA,KAAA,EAAA,QAAA,KART,IAAA,kBAAC,GAAD;EACe,WAAA;EAON,GAED;EACJ,qBAAA;CAAiB,CAAA,GACnB,EAAA,MAAA,GAAA,EAAA,MAAA,GAAA,EAAA,MAAA,KAAA,IAAA,EAAA;CAAA,IAAA;CACe,OADf,EAAA,QAAA,KAAA,EAAA,QAAA,KAbN,IAAA,kBAAC,GAAD;EAA2BA,OAAA;YACvB;CADe,CAAA,GAcE,EAAA,MAAA,GAAA,EAAA,MAAA,GAAA,EAAA,MAAA,KAAA,IAAA,EAAA,KAdrB;AAcqB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CalendarCell","names":[],"sources":["../../src/components/Calendar/CalendarCell/calendarCell.module.css","../../src/components/Calendar/CalendarCell/CalendarCell.tsx"],"sourcesContent":["@layer adgytec.comps {\n .cell {\n --_state-color: var(--_md-calendar-cell-state-layer-color,);\n --_state-layer-opacity: 0;\n\n --_state-layer-color: rgb(\n from var(--_state-color) r g b /\n var(--_state-layer-opacity)\n );\n\n position: relative;\n text-align: center;\n outline: none;\n\n inline-size: var(--_md-calendar-cell-size);\n block-size: var(--_md-calendar-cell-size);\n\n display: flex;\n align-items: center;\n justify-content: center;\n\n z-index: 0;\n\n cursor: pointer;\n color: var(--_md-calendar-cell-color);\n\n transition: color var(--md-sys-motion-expressive-fast-effects)\n var(--md-sys-motion-expressive-fast-effects-duration);\n\n @media (prefers-reduced-motion) {\n transition: none;\n }\n\n &[data-focus-visible] {\n z-index: 1;\n --_state-layer-opacity: var(--md-sys-state-focus);\n }\n\n &[data-hovered] {\n --_state-layer-opacity: var(--md-sys-state-hover);\n }\n\n &[data-pressed] {\n --_state-layer-opacity: var(--md-sys-state-pressed);\n }\n\n &[data-today] {\n color: var(--_md-calendar-cell-today-color);\n --_state-color: currentColor;\n\n &::before {\n border: calc(1 * var(--dp, 1px)) solid currentColor;\n }\n }\n\n &[data-selected],\n &[data-selection-start],\n &[data-selection-end] {\n color: var(--_md-calendar-selected-color);\n --_state-color: currentColor;\n\n &::before {\n border-width: 0;\n background-color: var(--_md-calendar-cell-selected-background);\n }\n }\n\n &[data-unavailable] {\n text-decoration: line-through;\n }\n\n &[data-range-calendar][data-selected] {\n &:not([data-selection-start]):not([data-selection-end]) {\n color: var(--_md-calendar-in-active-range-color);\n\n &::before {\n background-color: transparent;\n }\n }\n }\n\n &[data-disabled],\n &[data-outside-month],\n &[data-outside-visible-range] {\n color: rgb(\n from currentColor r g b /\n var(--md-sys-state-disabled-content)\n );\n cursor: default;\n\n &::before {\n border-width: 0;\n background-color: transparent;\n }\n }\n\n &[data-invalid] {\n color: var(--md-sys-color-on-error);\n --_state-layer: currentColor;\n\n &::before {\n background-color: var(--md-sys-color-error);\n }\n\n &[data-range-calendar]:not([data-selection-start]):not(\n [data-selection-end]\n ) {\n color: var(--md-sys-color-on-error-container,);\n\n &::before {\n background-color: transparent;\n }\n }\n }\n }\n\n .cell::before,\n .cell::after,\n .splash-container {\n z-index: -1;\n content: \"\";\n\n position: absolute;\n inset: var(--md-sys-layout-space-4);\n border-radius: var(--md-sys-shape-corner-radius-full);\n\n transition: background-color\n var(--md-sys-motion-expressive-fast-effects)\n var(--md-sys-motion-expressive-fast-effects-duration);\n\n @media (prefers-reduced-motion) {\n transition: none;\n }\n }\n\n .splash-container {\n overflow: hidden;\n }\n\n .cell::after {\n background-color: var(--_state-layer-color);\n }\n\n .cell[data-focus-visible]::before {\n --focus-indicator-thickness: calc(3 * var(--dp, 1px));\n --focus-indicator-offset: calc(2 * var(--dp, 1px));\n --focus-indicator-color: var(--md-sys-color-secondary);\n\n outline-width: var(--focus-indicator-thickness);\n outline-style: solid;\n outline-offset: var(--focus-indicator-offset);\n outline-color: var(--focus-indicator-color);\n }\n\n .range-indicator {\n --_range-indicator-background: var(\n --_md-calendar-in-active-range-background\n );\n\n z-index: -2;\n position: absolute;\n inset: 0;\n inset-block: var(--md-sys-layout-space-4);\n\n transition: background-color\n var(--md-sys-motion-expressive-fast-effects)\n var(--md-sys-motion-expressive-fast-effects-duration);\n\n @media (prefers-reduced-motion) {\n transition: none;\n }\n\n &[data-invalid] {\n --_range-indicator-background: var(--md-sys-color-error-container);\n }\n\n &[data-in-range] {\n background-color: var(--_range-indicator-background);\n }\n\n &[data-selection-start] {\n inset-inline-start: var(--md-sys-layout-space-4);\n\n border-start-start-radius: var(--md-sys-shape-corner-radius-full);\n border-end-start-radius: var(--md-sys-shape-corner-radius-full);\n\n background-color: var(--_range-indicator-background);\n }\n\n &[data-selection-end] {\n inset-inline-end: var(--md-sys-layout-space-4);\n\n border-start-end-radius: var(--md-sys-shape-corner-radius-full);\n border-end-end-radius: var(--md-sys-shape-corner-radius-full);\n\n background-color: var(--_range-indicator-background);\n }\n\n &[data-disabled],\n &[data-outside-month],\n &[data-outside-visible-range] {\n --_range-indicator-background: transparent;\n }\n }\n}\n","import clsx from \"clsx\";\nimport { usePress } from \"react-aria/usePress\";\nimport { CalendarCell as AriaCalendarCell } from \"react-aria-components\";\nimport { Splash } from \"@/components/Splash/Splash\";\nimport { useSplash } from \"@/components/Splash/useSplash\";\nimport { typography } from \"@/utils\";\nimport styles from \"./calendarCell.module.css\";\n\nexport const CalendarCell: React.FC<\n Omit<React.ComponentPropsWithRef<typeof AriaCalendarCell>, \"children\"> & {\n isRangeCalendar?: boolean;\n }\n> = ({ className, isRangeCalendar = false, ...props }) => {\n const { splashInfo, handlePress } = useSplash();\n const { pressProps } = usePress({ onPress: handlePress });\n\n return (\n <AriaCalendarCell\n className={(renderProps) =>\n clsx(\n styles[\"cell\"],\n typography.bodyLarge,\n typeof className === \"function\"\n ? className(renderProps)\n : className\n )\n }\n {...pressProps}\n {...props}\n data-range-calendar={isRangeCalendar || undefined}\n >\n {({\n formattedDate,\n isDisabled,\n isOutsideVisibleRange,\n isOutsideMonth,\n isInvalid,\n isSelected,\n isSelectionStart,\n isSelectionEnd,\n }) => {\n const inBetweenRange =\n isRangeCalendar &&\n isSelected &&\n !isSelectionStart &&\n !isSelectionEnd;\n\n const disableSplash =\n isDisabled || isOutsideMonth || isOutsideVisibleRange;\n\n return (\n <>\n {!disableSplash && splashInfo && (\n <span className={clsx(styles[\"splash-container\"])}>\n <Splash {...splashInfo} />\n </span>\n )}\n\n {isRangeCalendar && (\n <span\n className={clsx(styles[\"range-indicator\"])}\n data-in-range={inBetweenRange || undefined}\n data-selection-start={\n isSelectionStart || undefined\n }\n data-selection-end={isSelectionEnd || undefined}\n data-invalid={isInvalid || undefined}\n data-disabled={isDisabled || undefined}\n data-outside-month={isOutsideMonth || undefined}\n data-outside-visible-range={\n isOutsideVisibleRange || undefined\n }\n ></span>\n )}\n\n {formattedDate}\n </>\n );\n }}\n </AriaCalendarCell>\n );\n};\n"],"mappings":";;;;;;;;;;GCQa,KAIR,EAAE,cAAW,qBAAkB,IAAO,GAAG,QAAY;CACtD,IAAM,EAAE,eAAY,mBAAgB,EAAU,GACxC,EAAE,kBAAe,EAAS,EAAE,SAAS,EAAY,CAAC;CAExD,OACI,kBAAC,GAAD;EACI,YAAY,MACR,EACI,EAAO,MACP,EAAW,WACX,OAAO,KAAc,aACf,EAAU,CAAW,IACrB,CACV;EAEJ,GAAI;EACJ,GAAI;EACJ,uBAAqB,KAAmB,KAAA;aAEtC,EACE,kBACA,eACA,0BACA,mBACA,cACA,eACA,qBACA,wBACE;GACF,IAAM,IACF,KACA,KACA,CAAC,KACD,CAAC;GAKL,OACI,kBAAA,GAAA,EAAA,UAAA;IACK,EAJL,KAAc,KAAkB,MAIT,KACf,kBAAC,QAAD;KAAM,WAAW,EAAK,EAAO,mBAAmB;eAC5C,kBAAC,GAAD,EAAQ,GAAI,EAAa,CAAA;IACvB,CAAA;IAGT,KACG,kBAAC,QAAD;KACI,WAAW,EAAK,EAAO,kBAAkB;KACzC,iBAAe,KAAkB,KAAA;KACjC,wBACI,KAAoB,KAAA;KAExB,sBAAoB,KAAkB,KAAA;KACtC,gBAAc,KAAa,KAAA;KAC3B,iBAAe,KAAc,KAAA;KAC7B,sBAAoB,KAAkB,KAAA;KACtC,8BACI,KAAyB,KAAA;IAE1B,CAAA;IAGV;GACH,EAAA,CAAA;EAEV;CACc,CAAA;AAE1B"}
|
|
1
|
+
{"version":3,"file":"CalendarCell","names":[],"sources":["../../src/components/Calendar/CalendarCell/calendarCell.module.css","../../src/components/Calendar/CalendarCell/CalendarCell.tsx"],"sourcesContent":["@layer adgytec.comps {\n .cell {\n --_state-color: var(--_md-calendar-cell-state-layer-color,);\n --_state-layer-opacity: 0;\n\n --_state-layer-color: rgb(\n from var(--_state-color) r g b /\n var(--_state-layer-opacity)\n );\n\n position: relative;\n text-align: center;\n outline: none;\n\n inline-size: var(--_md-calendar-cell-size);\n block-size: var(--_md-calendar-cell-size);\n\n display: flex;\n align-items: center;\n justify-content: center;\n\n z-index: 0;\n\n cursor: pointer;\n color: var(--_md-calendar-cell-color);\n\n transition: color var(--md-sys-motion-expressive-fast-effects)\n var(--md-sys-motion-expressive-fast-effects-duration);\n\n @media (prefers-reduced-motion) {\n transition: none;\n }\n\n &[data-focus-visible] {\n z-index: 1;\n --_state-layer-opacity: var(--md-sys-state-focus);\n }\n\n &[data-hovered] {\n --_state-layer-opacity: var(--md-sys-state-hover);\n }\n\n &[data-pressed] {\n --_state-layer-opacity: var(--md-sys-state-pressed);\n }\n\n &[data-today] {\n color: var(--_md-calendar-cell-today-color);\n --_state-color: currentColor;\n\n &::before {\n border: calc(1 * var(--dp, 1px)) solid currentColor;\n }\n }\n\n &[data-selected],\n &[data-selection-start],\n &[data-selection-end] {\n color: var(--_md-calendar-selected-color);\n --_state-color: currentColor;\n\n &::before {\n border-width: 0;\n background-color: var(--_md-calendar-cell-selected-background);\n }\n }\n\n &[data-unavailable] {\n text-decoration: line-through;\n }\n\n &[data-range-calendar][data-selected] {\n &:not([data-selection-start]):not([data-selection-end]) {\n color: var(--_md-calendar-in-active-range-color);\n\n &::before {\n background-color: transparent;\n }\n }\n }\n\n &[data-disabled],\n &[data-outside-month],\n &[data-outside-visible-range] {\n color: rgb(\n from currentColor r g b /\n var(--md-sys-state-disabled-content)\n );\n cursor: default;\n\n &::before {\n border-width: 0;\n background-color: transparent;\n }\n }\n\n &[data-invalid] {\n color: var(--md-sys-color-on-error);\n --_state-layer: currentColor;\n\n &::before {\n background-color: var(--md-sys-color-error);\n }\n\n &[data-range-calendar]:not([data-selection-start]):not(\n [data-selection-end]\n ) {\n color: var(--md-sys-color-on-error-container,);\n\n &::before {\n background-color: transparent;\n }\n }\n }\n }\n\n .cell::before,\n .cell::after,\n .splash-container {\n z-index: -1;\n content: \"\";\n\n position: absolute;\n inset: var(--md-sys-layout-space-4);\n border-radius: var(--md-sys-shape-corner-radius-full);\n\n transition: background-color\n var(--md-sys-motion-expressive-fast-effects)\n var(--md-sys-motion-expressive-fast-effects-duration);\n\n @media (prefers-reduced-motion) {\n transition: none;\n }\n }\n\n .splash-container {\n overflow: hidden;\n }\n\n .cell::after {\n background-color: var(--_state-layer-color);\n }\n\n .cell[data-focus-visible]::before {\n --focus-indicator-thickness: calc(3 * var(--dp, 1px));\n --focus-indicator-offset: calc(2 * var(--dp, 1px));\n --focus-indicator-color: var(--md-sys-color-secondary);\n\n outline-width: var(--focus-indicator-thickness);\n outline-style: solid;\n outline-offset: var(--focus-indicator-offset);\n outline-color: var(--focus-indicator-color);\n }\n\n .range-indicator {\n --_range-indicator-background: var(\n --_md-calendar-in-active-range-background\n );\n\n z-index: -2;\n position: absolute;\n inset: 0;\n inset-block: var(--md-sys-layout-space-4);\n\n transition: background-color\n var(--md-sys-motion-expressive-fast-effects)\n var(--md-sys-motion-expressive-fast-effects-duration);\n\n @media (prefers-reduced-motion) {\n transition: none;\n }\n\n &[data-invalid] {\n --_range-indicator-background: var(--md-sys-color-error-container);\n }\n\n &[data-in-range] {\n background-color: var(--_range-indicator-background);\n }\n\n &[data-selection-start] {\n inset-inline-start: var(--md-sys-layout-space-4);\n\n border-start-start-radius: var(--md-sys-shape-corner-radius-full);\n border-end-start-radius: var(--md-sys-shape-corner-radius-full);\n\n background-color: var(--_range-indicator-background);\n }\n\n &[data-selection-end] {\n inset-inline-end: var(--md-sys-layout-space-4);\n\n border-start-end-radius: var(--md-sys-shape-corner-radius-full);\n border-end-end-radius: var(--md-sys-shape-corner-radius-full);\n\n background-color: var(--_range-indicator-background);\n }\n\n &[data-disabled],\n &[data-outside-month],\n &[data-outside-visible-range] {\n --_range-indicator-background: transparent;\n }\n }\n}\n","import clsx from \"clsx\";\nimport { usePress } from \"react-aria/usePress\";\nimport { CalendarCell as AriaCalendarCell } from \"react-aria-components\";\nimport { Splash } from \"@/components/Splash/Splash\";\nimport { useSplash } from \"@/components/Splash/useSplash\";\nimport { typography } from \"@/utils\";\nimport styles from \"./calendarCell.module.css\";\n\nexport const CalendarCell: React.FC<\n Omit<React.ComponentPropsWithRef<typeof AriaCalendarCell>, \"children\"> & {\n isRangeCalendar?: boolean;\n }\n> = ({ className, isRangeCalendar = false, ...props }) => {\n const { splashInfo, handlePress } = useSplash();\n const { pressProps } = usePress({ onPress: handlePress });\n\n return (\n <AriaCalendarCell\n className={(renderProps) =>\n clsx(\n styles[\"cell\"],\n typography.bodyLarge,\n typeof className === \"function\"\n ? className(renderProps)\n : className\n )\n }\n {...pressProps}\n {...props}\n data-range-calendar={isRangeCalendar || undefined}\n >\n {({\n formattedDate,\n isDisabled,\n isOutsideVisibleRange,\n isOutsideMonth,\n isInvalid,\n isSelected,\n isSelectionStart,\n isSelectionEnd,\n }) => {\n const inBetweenRange =\n isRangeCalendar &&\n isSelected &&\n !isSelectionStart &&\n !isSelectionEnd;\n\n const disableSplash =\n isDisabled || isOutsideMonth || isOutsideVisibleRange;\n\n return (\n <>\n {!disableSplash && splashInfo && (\n <span className={clsx(styles[\"splash-container\"])}>\n <Splash {...splashInfo} />\n </span>\n )}\n\n {isRangeCalendar && (\n <span\n className={clsx(styles[\"range-indicator\"])}\n data-in-range={inBetweenRange || undefined}\n data-selection-start={\n isSelectionStart || undefined\n }\n data-selection-end={isSelectionEnd || undefined}\n data-invalid={isInvalid || undefined}\n data-disabled={isDisabled || undefined}\n data-outside-month={isOutsideMonth || undefined}\n data-outside-visible-range={\n isOutsideVisibleRange || undefined\n }\n ></span>\n )}\n\n {formattedDate}\n </>\n );\n }}\n </AriaCalendarCell>\n );\n};\n"],"mappings":";;;;;;;;;;GCQa,KAIR,EAAE,cAAW,qBAAkB,IAAO,GAAG,QAAY;CACtD,IAAM,EAAE,eAAY,mBAAgB,EAAU,GACxC,EAAE,kBAAe,EAAS,EAAE,SAAS,EAAY,CAAC;CAExD,OACI,kBAAC,GAAD;EACI,YAAY,MACR,EACI,EAAO,MACP,EAAW,WACX,OAAO,KAAc,aACf,EAAU,CAAW,IACrB,CACV;EAEJ,GAAI;EACJ,GAAI;EACJ,uBAAqB,KAAmB,KAAA;aAEtC,EACE,kBACA,eACA,0BACA,mBACA,cACA,eACA,qBACA,wBACE;GACF,IAAM,IACF,KACA,KACA,CAAC,KACD,CAAC;GAKL,OACI,kBAAA,GAAA,EAAA,UAAA;IACK,EAJL,KAAc,KAAkB,MAIT,KACf,kBAAC,QAAD;KAAM,WAAW,EAAK,EAAO,mBAAmB;eAC5C,kBAAC,GAAD,EAAQ,GAAI,EAAW,CAAA;IACrB,CAAA;IAGT,KACG,kBAAC,QAAD;KACI,WAAW,EAAK,EAAO,kBAAkB;KACzC,iBAAe,KAAkB,KAAA;KACjC,wBACI,KAAoB,KAAA;KAExB,sBAAoB,KAAkB,KAAA;KACtC,gBAAc,KAAa,KAAA;KAC3B,iBAAe,KAAc,KAAA;KAC7B,sBAAoB,KAAkB,KAAA;KACtC,8BACI,KAAyB,KAAA;IAE1B,CAAA;IAGV;GACL,EAAA,CAAA;EAER;CACc,CAAA;AAE1B"}
|
package/dist/chunks/CalendarGrid
CHANGED
|
@@ -1,30 +1,48 @@
|
|
|
1
|
-
import { t as e } from "./
|
|
2
|
-
import { t } from "./
|
|
3
|
-
import n from "
|
|
4
|
-
import
|
|
5
|
-
import {
|
|
6
|
-
import
|
|
1
|
+
import { t as e } from "./compiler-runtime";
|
|
2
|
+
import { t } from "./base";
|
|
3
|
+
import { t as n } from "./CalendarCell";
|
|
4
|
+
import r from "clsx";
|
|
5
|
+
import { jsx as i, jsxs as a } from "react/jsx-runtime";
|
|
6
|
+
import { CalendarGrid as o, CalendarGridBody as s, CalendarGridHeader as c, CalendarHeaderCell as l } from "react-aria-components";
|
|
7
|
+
import '../assets/CalendarGrid.css';//#region src/components/Calendar/CalendarGrid/calendarGrid.module.css
|
|
8
|
+
var u = e(), d = {
|
|
7
9
|
grid: "_grid_1uey9_2",
|
|
8
10
|
header: "_header_1uey9_7",
|
|
9
11
|
"header-cell": "_header-cell_1uey9_17"
|
|
10
|
-
},
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
}),
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
12
|
+
}, f = (e) => {
|
|
13
|
+
let t = (0, u.c)(11), l, f;
|
|
14
|
+
t[0] === e ? (l = t[1], f = t[2]) : ({isRangeCalendar: l, ...f} = e, t[0] = e, t[1] = l, t[2] = f);
|
|
15
|
+
let m;
|
|
16
|
+
t[3] === Symbol.for("react.memo_cache_sentinel") ? (m = r(d.grid), t[3] = m) : m = t[3];
|
|
17
|
+
let h;
|
|
18
|
+
t[4] === Symbol.for("react.memo_cache_sentinel") ? (h = /* @__PURE__ */ i(c, {
|
|
19
|
+
className: r(d.header),
|
|
20
|
+
children: p
|
|
21
|
+
}), t[4] = h) : h = t[4];
|
|
22
|
+
let g;
|
|
23
|
+
t[5] === Symbol.for("react.memo_cache_sentinel") ? (g = r(d.body), t[5] = g) : g = t[5];
|
|
24
|
+
let _;
|
|
25
|
+
t[6] === l ? _ = t[7] : (_ = /* @__PURE__ */ i(s, {
|
|
26
|
+
className: g,
|
|
27
|
+
children: (e) => /* @__PURE__ */ i(n, {
|
|
28
|
+
isRangeCalendar: l,
|
|
23
29
|
date: e
|
|
24
30
|
})
|
|
25
|
-
})]
|
|
26
|
-
|
|
31
|
+
}), t[6] = l, t[7] = _);
|
|
32
|
+
let v;
|
|
33
|
+
return t[8] !== f || t[9] !== _ ? (v = /* @__PURE__ */ a(o, {
|
|
34
|
+
...f,
|
|
35
|
+
className: m,
|
|
36
|
+
children: [h, _]
|
|
37
|
+
}), t[8] = f, t[9] = _, t[10] = v) : v = t[10], v;
|
|
38
|
+
};
|
|
39
|
+
function p(e) {
|
|
40
|
+
return /* @__PURE__ */ i(l, {
|
|
41
|
+
className: r(d["header-cell"], t.bodyLarge),
|
|
42
|
+
children: e
|
|
43
|
+
});
|
|
44
|
+
}
|
|
27
45
|
//#endregion
|
|
28
|
-
export {
|
|
46
|
+
export { f as t };
|
|
29
47
|
|
|
30
48
|
//# sourceMappingURL=CalendarGrid.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CalendarGrid","names":[],"sources":["../../src/components/Calendar/CalendarGrid/calendarGrid.module.css","../../src/components/Calendar/CalendarGrid/CalendarGrid.tsx"],"sourcesContent":["@layer adgytec.comps {\n .grid {\n padding-inline: var(--md-sys-layout-space-12);\n border-spacing: 0;\n }\n\n .header {\n color: var(--_md-calendar-header-cell-color);\n }\n\n .header::after {\n content: \"\";\n display: block;\n block-size: var(--md-sys-layout-space-4);\n }\n\n .header-cell {\n inline-size: var(--_md-calendar-cell-size);\n block-size: var(--_md-calendar-cell-size);\n }\n}\n","import clsx from \"clsx\";\nimport {\n CalendarGrid as AriaCalendarGrid,\n CalendarGridBody,\n CalendarGridHeader,\n CalendarHeaderCell,\n} from \"react-aria-components\";\nimport { typography } from \"@/utils\";\nimport { CalendarCell } from \"../CalendarCell\";\nimport styles from \"./calendarGrid.module.css\";\n\nexport const CalendarGrid: React.FC<\n Omit<\n React.ComponentPropsWithRef<typeof AriaCalendarGrid>,\n \"children\" | \"className\"\n > & { isRangeCalendar?: boolean }\n> = ({ isRangeCalendar, ...props }) => {\n return (\n <AriaCalendarGrid {...props} className={clsx(styles[\"grid\"])}>\n <CalendarGridHeader className={clsx(styles[\"header\"])}>\n {(day) => (\n <CalendarHeaderCell\n className={clsx(\n styles[\"header-cell\"],\n typography.bodyLarge\n )}\n >\n {day}\n </CalendarHeaderCell>\n )}\n </CalendarGridHeader>\n\n <CalendarGridBody className={clsx(styles[\"body\"])}>\n {(date) => (\n <CalendarCell\n isRangeCalendar={isRangeCalendar}\n date={date}\n />\n )}\n </CalendarGridBody>\n </AriaCalendarGrid>\n );\n};\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"CalendarGrid","names":["isRangeCalendar","date","day"],"sources":["../../src/components/Calendar/CalendarGrid/calendarGrid.module.css","../../src/components/Calendar/CalendarGrid/CalendarGrid.tsx"],"sourcesContent":["@layer adgytec.comps {\n .grid {\n padding-inline: var(--md-sys-layout-space-12);\n border-spacing: 0;\n }\n\n .header {\n color: var(--_md-calendar-header-cell-color);\n }\n\n .header::after {\n content: \"\";\n display: block;\n block-size: var(--md-sys-layout-space-4);\n }\n\n .header-cell {\n inline-size: var(--_md-calendar-cell-size);\n block-size: var(--_md-calendar-cell-size);\n }\n}\n","import clsx from \"clsx\";\nimport {\n CalendarGrid as AriaCalendarGrid,\n CalendarGridBody,\n CalendarGridHeader,\n CalendarHeaderCell,\n} from \"react-aria-components\";\nimport { typography } from \"@/utils\";\nimport { CalendarCell } from \"../CalendarCell\";\nimport styles from \"./calendarGrid.module.css\";\n\nexport const CalendarGrid: React.FC<\n Omit<\n React.ComponentPropsWithRef<typeof AriaCalendarGrid>,\n \"children\" | \"className\"\n > & { isRangeCalendar?: boolean }\n> = ({ isRangeCalendar, ...props }) => {\n return (\n <AriaCalendarGrid {...props} className={clsx(styles[\"grid\"])}>\n <CalendarGridHeader className={clsx(styles[\"header\"])}>\n {(day) => (\n <CalendarHeaderCell\n className={clsx(\n styles[\"header-cell\"],\n typography.bodyLarge\n )}\n >\n {day}\n </CalendarHeaderCell>\n )}\n </CalendarGridHeader>\n\n <CalendarGridBody className={clsx(styles[\"body\"])}>\n {(date) => (\n <CalendarCell\n isRangeCalendar={isRangeCalendar}\n date={date}\n />\n )}\n </CalendarGridBody>\n </AriaCalendarGrid>\n );\n};\n"],"mappings":";;;;;;;;;;;GCWa,KAKT,MAAA;CAAA,IAAA,KAAA,GAAA,EAAA,EAAA,CAAA,EAAA,GAAA,GAAA;CAAA,AAAA,EAAA,OAAA,KAA8B,IAAA,EAAA,IAAA,IAAA,EAAA,OAA7B,wBAAA,KAAA,GAA6B,EAAA,KAAA,GAAA,EAAA,KAAA,GAAA,EAAA,KAAA;CAAA,IAAA;CAAA,AAAA,EAAA,OAAA,OAAA,IAAA,2BAAA,KAEc,IAAA,EAAK,EAAM,IAAQ,GAAC,EAAA,KAAA,KAAA,IAAA,EAAA;CAAA,IAAA;CAAA,AAAA,EAAA,OAAA,OAAA,IAAA,2BAAA,KACxD,IAAA,kBAAC,GAAD;EAA+B,WAAA,EAAK,EAAM,MAAU;YAC/C;CADc,CAAA,GAWE,EAAA,KAAA,KAAA,IAAA,EAAA;CAAA,IAAA;CAAA,AAAA,EAAA,OAAA,OAAA,IAAA,2BAAA,KAEQ,IAAA,EAAK,EAAM,IAAQ,GAAC,EAAA,KAAA,KAAA,IAAA,EAAA;CAAA,IAAA;CAAA,AAAA,EAAA,OAAA,IAO9B,IAAA,EAAA,MAPnB,IAAA,kBAAC,GAAD;EAA6B,WAAA;aACxB,MACG,kBAAC,GAAD;GACqB;GACX;EAAI,CAAA;CAJL,CAAA,GAOE,EAAA,KAAA,GAAA,EAAA,KAAA;CAAA,IAAA;CACJ,OADI,EAAA,OAAA,KAAA,EAAA,OAAA,KArBvB,IAAA,kBAAC,GAAD;EAAiB,GAAK;EAAkB,WAAA;YAAxC,CACI,GAaA,CAda;KAsBE,EAAA,KAAA,GAAA,EAAA,KAAA,GAAA,EAAA,MAAA,KAAA,IAAA,EAAA,KAtBnB;AAsBmB;AAxBvB,SAAA,EAAA,GAAA;CAAA,OAKgB,kBAAC,GAAD;EACe,WAAA,EACP,EAAO,gBACP,EAAU,SACd;YAEC;CANc,CAAA;AAOE"}
|
|
@@ -1,12 +1,21 @@
|
|
|
1
|
-
import { t as e } from "./
|
|
2
|
-
import t from "
|
|
3
|
-
import
|
|
4
|
-
import {
|
|
5
|
-
import
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
1
|
+
import { t as e } from "./compiler-runtime";
|
|
2
|
+
import { t } from "./base";
|
|
3
|
+
import n from "clsx";
|
|
4
|
+
import { jsx as r } from "react/jsx-runtime";
|
|
5
|
+
import { ListBoxItem as i } from "react-aria-components";
|
|
6
|
+
import '../assets/CalendarMenuItem.css';//#region src/components/Calendar/CalendarMenuItem/calendarMenuItem.module.css
|
|
7
|
+
var a = e(), o = { item: "_item_tzerc_2" }, s = (e) => {
|
|
8
|
+
let s = (0, a.c)(8), c, l;
|
|
9
|
+
s[0] === e ? (c = s[1], l = s[2]) : ({className: c, ...l} = e, s[0] = e, s[1] = c, s[2] = l);
|
|
10
|
+
let u;
|
|
11
|
+
s[3] === c ? u = s[4] : (u = (e) => n(o.item, t.bodyLarge, typeof c == "function" ? c(e) : c), s[3] = c, s[4] = u);
|
|
12
|
+
let d;
|
|
13
|
+
return s[5] !== l || s[6] !== u ? (d = /* @__PURE__ */ r(i, {
|
|
14
|
+
className: u,
|
|
15
|
+
...l
|
|
16
|
+
}), s[5] = l, s[6] = u, s[7] = d) : d = s[7], d;
|
|
17
|
+
};
|
|
9
18
|
//#endregion
|
|
10
|
-
export {
|
|
19
|
+
export { s as t };
|
|
11
20
|
|
|
12
21
|
//# sourceMappingURL=CalendarMenuItem.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CalendarMenuItem","names":[],"sources":["../../src/components/Calendar/CalendarMenuItem/calendarMenuItem.module.css","../../src/components/Calendar/CalendarMenuItem/CalendarMenuItem.tsx"],"sourcesContent":["@layer adgytec.comps {\n .item {\n --_state-color: var(--_md-calendar-cell-state-layer-color,);\n --_state-layer-opacity: 0;\n\n --_state-layer-color: rgb(\n from var(--_state-color) r g b /\n var(--_state-layer-opacity)\n );\n\n padding-block: var(--md-sys-layout-space-12);\n padding-inline-start: calc(52 * var(--dp, 1px));\n margin-inline-end: var(--md-sys-layout-space-12);\n\n color: var(--_md-calendar-cell-color);\n\n position: relative;\n\n cursor: pointer;\n\n border-end-end-radius: var(--md-sys-shape-corner-radius-extra-small);\n border-start-end-radius: var(--md-sys-shape-corner-radius-extra-small);\n outline: none;\n\n [data-selected-icon] {\n position: absolute;\n\n inset-inline-start: var(--md-sys-layout-space-12);\n inset-block-start: 50%;\n translate: 0 -50%;\n }\n\n &[data-selected] {\n color: var(--_md-calendar-menu-selected-color);\n background-color: var(--_md-calendar-menu-selected-background);\n }\n\n &[data-focus-visible] {\n z-index: 1;\n --_state-layer-opacity: var(--md-sys-state-focus);\n }\n\n &[data-hovered] {\n --_state-layer-opacity: var(--md-sys-state-hover);\n }\n\n &[data-pressed] {\n --_state-layer-opacity: var(--md-sys-state-pressed);\n }\n\n &[data-disabled] {\n color: rgb(\n from currentColor r g b /\n var(--md-sys-state-disabled-content)\n );\n cursor: default;\n }\n }\n\n .item::before,\n .item::after {\n content: \"\";\n\n position: absolute;\n inset: 0;\n border-radius: inherit;\n\n transition: background-color\n var(--md-sys-motion-expressive-fast-effects)\n var(--md-sys-motion-expressive-fast-effects-duration);\n\n @media (prefers-reduced-motion) {\n transition: none;\n }\n }\n\n .item::after {\n background-color: var(--_state-layer-color);\n }\n\n .item[data-focus-visible]::before {\n --focus-indicator-thickness: calc(3 * var(--dp, 1px));\n --focus-indicator-offset: calc(1 * var(--dp, 1px));\n --focus-indicator-color: var(--md-sys-color-secondary);\n\n outline-width: var(--focus-indicator-thickness);\n outline-style: solid;\n outline-offset: var(--focus-indicator-offset);\n outline-color: var(--focus-indicator-color);\n }\n}\n","import clsx from \"clsx\";\nimport { ListBoxItem } from \"react-aria-components\";\nimport { typography } from \"@/utils\";\nimport styles from \"./calendarMenuItem.module.css\";\n\nexport const CalendarMenuItem: React.FC<\n React.ComponentPropsWithRef<typeof ListBoxItem>\n> = ({ className, ...props }) => {\n return (\n <ListBoxItem\n className={(renderProps) =>\n clsx(\n styles[\"item\"],\n typography.bodyLarge,\n typeof className === \"function\"\n ? className(renderProps)\n : className\n )\n }\n {...props}\n />\n );\n};\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"CalendarMenuItem","names":[],"sources":["../../src/components/Calendar/CalendarMenuItem/calendarMenuItem.module.css","../../src/components/Calendar/CalendarMenuItem/CalendarMenuItem.tsx"],"sourcesContent":["@layer adgytec.comps {\n .item {\n --_state-color: var(--_md-calendar-cell-state-layer-color,);\n --_state-layer-opacity: 0;\n\n --_state-layer-color: rgb(\n from var(--_state-color) r g b /\n var(--_state-layer-opacity)\n );\n\n padding-block: var(--md-sys-layout-space-12);\n padding-inline-start: calc(52 * var(--dp, 1px));\n margin-inline-end: var(--md-sys-layout-space-12);\n\n color: var(--_md-calendar-cell-color);\n\n position: relative;\n\n cursor: pointer;\n\n border-end-end-radius: var(--md-sys-shape-corner-radius-extra-small);\n border-start-end-radius: var(--md-sys-shape-corner-radius-extra-small);\n outline: none;\n\n [data-selected-icon] {\n position: absolute;\n\n inset-inline-start: var(--md-sys-layout-space-12);\n inset-block-start: 50%;\n translate: 0 -50%;\n }\n\n &[data-selected] {\n color: var(--_md-calendar-menu-selected-color);\n background-color: var(--_md-calendar-menu-selected-background);\n }\n\n &[data-focus-visible] {\n z-index: 1;\n --_state-layer-opacity: var(--md-sys-state-focus);\n }\n\n &[data-hovered] {\n --_state-layer-opacity: var(--md-sys-state-hover);\n }\n\n &[data-pressed] {\n --_state-layer-opacity: var(--md-sys-state-pressed);\n }\n\n &[data-disabled] {\n color: rgb(\n from currentColor r g b /\n var(--md-sys-state-disabled-content)\n );\n cursor: default;\n }\n }\n\n .item::before,\n .item::after {\n content: \"\";\n\n position: absolute;\n inset: 0;\n border-radius: inherit;\n\n transition: background-color\n var(--md-sys-motion-expressive-fast-effects)\n var(--md-sys-motion-expressive-fast-effects-duration);\n\n @media (prefers-reduced-motion) {\n transition: none;\n }\n }\n\n .item::after {\n background-color: var(--_state-layer-color);\n }\n\n .item[data-focus-visible]::before {\n --focus-indicator-thickness: calc(3 * var(--dp, 1px));\n --focus-indicator-offset: calc(1 * var(--dp, 1px));\n --focus-indicator-color: var(--md-sys-color-secondary);\n\n outline-width: var(--focus-indicator-thickness);\n outline-style: solid;\n outline-offset: var(--focus-indicator-offset);\n outline-color: var(--focus-indicator-color);\n }\n}\n","import clsx from \"clsx\";\nimport { ListBoxItem } from \"react-aria-components\";\nimport { typography } from \"@/utils\";\nimport styles from \"./calendarMenuItem.module.css\";\n\nexport const CalendarMenuItem: React.FC<\n React.ComponentPropsWithRef<typeof ListBoxItem>\n> = ({ className, ...props }) => {\n return (\n <ListBoxItem\n className={(renderProps) =>\n clsx(\n styles[\"item\"],\n typography.bodyLarge,\n typeof className === \"function\"\n ? className(renderProps)\n : className\n )\n }\n {...props}\n />\n );\n};\n"],"mappings":";;;;;;4CCKa,KAET,MAAA;CAAA,IAAA,KAAA,GAAA,EAAA,EAAA,CAAA,CAAA,GAAA,GAAA;CAAA,AAAA,EAAA,OAAA,KAAwB,IAAA,EAAA,IAAA,IAAA,EAAA,OAAvB,kBAAA,KAAA,GAAuB,EAAA,KAAA,GAAA,EAAA,KAAA,GAAA,EAAA,KAAA;CAAA,IAAA;CAAA,AAAA,EAAA,OAAA,IAUX,IAAA,EAAA,MAPM,KAAA,MACP,EACI,EAAM,MACN,EAAU,WACV,OAAO,KAAc,aACf,EAAU,CACF,IAFd,CAGJ,GAAC,EAAA,KAAA,GAAA,EAAA,KAAA;CAAA,IAAA;CAGP,OAHO,EAAA,OAAA,KAAA,EAAA,OAAA,KART,IAAA,kBAAC,GAAD;EACe,WAAA;EAON,GAED;CAAK,CAAA,GACX,EAAA,KAAA,GAAA,EAAA,KAAA,GAAA,EAAA,KAAA,KAAA,IAAA,EAAA,IAXF;AAWE"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CenteredSlider","names":[],"sources":["../../src/components/Input/Slider/CenteredSlider/centerdSlider.module.css","../../src/components/Input/Slider/CenteredSlider/CenteredSlider.tsx"],"sourcesContent":["@layer adgytec.overrides {\n .inactive-track {\n position: relative;\n\n &[data-orientation=\"horizontal\"] {\n --_inline-size: var(--_range-gap-half);\n --_block-size: var(--_md-slider-track-size);\n }\n\n &[data-orientation=\"vertical\"] {\n --_block-size: var(--_range-gap-half);\n --_inline-size: var(--_md-slider-track-size);\n }\n\n &:not([data-active-direction]):not([data-mid]) {\n &::before,\n &:not([data-disabled])::after {\n content: \"\";\n position: absolute;\n\n inline-size: var(--_inline-size);\n block-size: var(--_block-size);\n\n background-color: inherit;\n }\n\n &[data-track=\"start\"] {\n &[data-orientation=\"horizontal\"] {\n border-start-end-radius: 0;\n border-end-end-radius: 0;\n\n &::before {\n inset-inline-end: 0;\n translate: 100%;\n\n border-start-end-radius: var(\n --_md-slider-track-inner-shape\n );\n border-end-end-radius: var(\n --_md-slider-track-inner-shape\n );\n }\n\n &::after {\n inset-inline-end: 0;\n translate: 50%;\n }\n }\n\n &[data-orientation=\"vertical\"] {\n border-start-end-radius: 0;\n border-start-start-radius: 0;\n\n &::before {\n inset-block-start: 0;\n translate: 0 -100%;\n\n border-start-end-radius: var(\n --_md-slider-track-inner-shape\n );\n border-start-start-radius: var(\n --_md-slider-track-inner-shape\n );\n }\n\n &::after {\n inset-block-start: 0;\n translate: 0 -50%;\n }\n }\n }\n\n &[data-track=\"end\"] {\n &[data-orientation=\"horizontal\"] {\n border-start-start-radius: 0;\n border-end-start-radius: 0;\n\n &::before {\n inset-inline-start: 0;\n translate: -100%;\n\n border-start-start-radius: var(\n --_md-slider-track-inner-shape\n );\n border-end-start-radius: var(\n --_md-slider-track-inner-shape\n );\n }\n\n &::after {\n inset-inline-start: 0;\n translate: -50%;\n }\n }\n\n &[data-orientation=\"vertical\"] {\n border-end-end-radius: 0;\n border-end-start-radius: 0;\n\n &::before {\n inset-block-end: 0;\n translate: 0 100%;\n\n border-end-end-radius: var(\n --_md-slider-track-inner-shape\n );\n border-end-start-radius: var(\n --_md-slider-track-inner-shape\n );\n }\n\n &::after {\n inset-block-end: 0;\n translate: 0 50%;\n }\n }\n }\n }\n }\n}\n","import clsx from \"clsx\";\nimport { Slider as AriaSlider, SliderTrack } from \"react-aria-components\";\nimport { Label } from \"../../Label\";\nimport {\n ActiveTrackStyles,\n InactiveTrackStyles,\n SliderColors,\n SliderSizeStyles,\n SliderStyles,\n TrackContainerStyles,\n TrackStyles,\n VisualTrackStyles,\n} from \"../core\";\nimport { SliderStops } from \"../SliderStops\";\nimport { SliderThumb } from \"../SliderThumb\";\nimport styles from \"./centerdSlider.module.css\";\nimport type { CenteredSliderProps } from \"./types\";\n\nexport const CenteredSlider = <T extends number>({\n label,\n thumbLabel,\n size = \"small\",\n minValue = 0,\n maxValue = 100,\n step = 1,\n defaultValue = ((minValue + maxValue) / 2) as T,\n showInBetweenSteps,\n maxStops,\n outputRenderer,\n className,\n ...props\n}: CenteredSliderProps<T>) => {\n return (\n <AriaSlider\n minValue={minValue}\n maxValue={maxValue}\n step={step}\n defaultValue={defaultValue}\n className={(renderProps) =>\n clsx(\n SliderStyles,\n SliderColors,\n typeof className === \"function\"\n ? className(renderProps)\n : className\n )\n }\n {...props}\n >\n {({ orientation, state, isDisabled }) => {\n const thumbValue = state.getThumbPercent(0);\n const sizeKey =\n orientation === \"horizontal\" ? \"inlineSize\" : \"blockSize\";\n\n const center = 0.5;\n\n const mid = Math.abs(thumbValue - center) * 100;\n const start = Math.min(thumbValue, center) * 100;\n const end = Math.min(1 - thumbValue, center) * 100;\n\n const activeDirection =\n thumbValue < 0.5\n ? \"start\"\n : thumbValue > 0.5\n ? \"end\"\n : undefined;\n\n return (\n <>\n {label && <Label>{label}</Label>}\n\n <div\n className={clsx(TrackContainerStyles)}\n data-orientation={orientation}\n >\n <SliderTrack\n className={clsx(\n TrackStyles,\n SliderSizeStyles(size)\n )}\n >\n <div\n className={clsx(VisualTrackStyles)}\n data-orientation={orientation}\n >\n <div\n className={clsx(\n InactiveTrackStyles,\n styles[\"inactive-track\"]\n )}\n data-active-direction={\n activeDirection === \"start\" ||\n undefined\n }\n data-track=\"start\"\n data-orientation={orientation}\n data-mid={\n thumbValue === center || undefined\n }\n data-disabled={isDisabled || undefined}\n style={{\n [sizeKey]: `${start}%`,\n }}\n />\n\n <div\n className={clsx(ActiveTrackStyles)}\n data-orientation={orientation}\n data-track=\"mid\"\n data-disabled={isDisabled || undefined}\n style={{\n [sizeKey]: `${mid}%`,\n }}\n >\n <div data-direction={activeDirection} />\n </div>\n\n <div\n className={clsx(\n InactiveTrackStyles,\n styles[\"inactive-track\"]\n )}\n data-orientation={orientation}\n data-track=\"end\"\n data-active-direction={\n activeDirection === \"end\" ||\n undefined\n }\n data-mid={\n thumbValue === center || undefined\n }\n data-disabled={isDisabled || undefined}\n style={{\n [sizeKey]: `${end}%`,\n }}\n />\n </div>\n\n <SliderThumb\n size={size}\n orientation={orientation}\n aria-label={thumbLabel}\n outputRenderer={outputRenderer}\n />\n\n <SliderStops\n slider=\"centered\"\n minValue={minValue}\n maxValue={maxValue}\n step={step}\n orientation={orientation}\n showInBetweenSteps={showInBetweenSteps}\n maxStops={maxStops}\n />\n </SliderTrack>\n </div>\n </>\n );\n }}\n </AriaSlider>\n );\n};\n"],"mappings":";;;;;;;;yDCkBa,KAAoC,EAC7C,UACA,eACA,UAAO,SACP,cAAW,GACX,cAAW,KACX,UAAO,GACP,mBAAiB,IAAW,KAAY,GACxC,uBACA,aACA,mBACA,cACA,GAAG,QAGC,kBAAC,GAAD;CACc;CACA;CACJ;CACQ;CACd,YAAY,MACR,EACI,GACA,GACA,OAAO,KAAc,aACf,EAAU,CAAW,IACrB,CACV;CAEJ,GAAI;YAEF,EAAE,gBAAa,UAAO,oBAAiB;EACrC,IAAM,IAAa,EAAM,gBAAgB,CAAC,GACpC,IACF,MAAgB,eAAe,eAAe,aAE5C,IAAS,IAET,IAAM,KAAK,IAAI,IAAa,CAAM,IAAI,KACtC,IAAQ,KAAK,IAAI,GAAY,CAAM,IAAI,KACvC,IAAM,KAAK,IAAI,IAAI,GAAY,CAAM,IAAI,KAEzC,IACF,IAAa,KACP,UACA,IAAa,KACX,QACA,KAAA;EAEZ,OACI,kBAAA,GAAA,EAAA,UAAA,CACK,KAAS,kBAAC,GAAD,EAAA,UAAQ,EAAa,CAAA,GAE/B,kBAAC,OAAD;GACI,WAAW,EAAK,CAAoB;GACpC,oBAAkB;aAElB,kBAAC,GAAD;IACI,WAAW,EACP,GACA,EAAiB,CAAI,CACzB;cAJJ;KAMI,kBAAC,OAAD;MACI,WAAW,EAAK,CAAiB;MACjC,oBAAkB;gBAFtB;OAII,kBAAC,OAAD;QACI,WAAW,EACP,GACA,EAAO,iBACX;QACA,yBACI,MAAoB,WACpB,KAAA;QAEJ,cAAW;QACX,oBAAkB;QAClB,YACI,MAAe,KAAU,KAAA;QAE7B,iBAAe,KAAc,KAAA;QAC7B,OAAO,GACF,IAAU,GAAG,EAAM,GACxB;OACH,CAAA;OAED,kBAAC,OAAD;QACI,WAAW,EAAK,CAAiB;QACjC,oBAAkB;QAClB,cAAW;QACX,iBAAe,KAAc,KAAA;QAC7B,OAAO,GACF,IAAU,GAAG,EAAI,GACtB;kBAEA,kBAAC,OAAD,EAAK,kBAAgB,EAAkB,CAAA;OACtC,CAAA;OAEL,kBAAC,OAAD;QACI,WAAW,EACP,GACA,EAAO,iBACX;QACA,oBAAkB;QAClB,cAAW;QACX,yBACI,MAAoB,SACpB,KAAA;QAEJ,YACI,MAAe,KAAU,KAAA;QAE7B,iBAAe,KAAc,KAAA;QAC7B,OAAO,GACF,IAAU,GAAG,EAAI,GACtB;OACH,CAAA;MACA;;KAEL,kBAAC,GAAD;MACU;MACO;MACb,cAAY;MACI;KACnB,CAAA;KAED,kBAAC,GAAD;MACI,QAAO;MACG;MACA;MACJ;MACO;MACO;MACV;KACb,CAAA;IACQ;;EACZ,CAAA,CACP,EAAA,CAAA;CAEV;AACQ,CAAA"}
|
|
1
|
+
{"version":3,"file":"CenteredSlider","names":[],"sources":["../../src/components/Input/Slider/CenteredSlider/centerdSlider.module.css","../../src/components/Input/Slider/CenteredSlider/CenteredSlider.tsx"],"sourcesContent":["@layer adgytec.overrides {\n .inactive-track {\n position: relative;\n\n &[data-orientation=\"horizontal\"] {\n --_inline-size: var(--_range-gap-half);\n --_block-size: var(--_md-slider-track-size);\n }\n\n &[data-orientation=\"vertical\"] {\n --_block-size: var(--_range-gap-half);\n --_inline-size: var(--_md-slider-track-size);\n }\n\n &:not([data-active-direction]):not([data-mid]) {\n &::before,\n &:not([data-disabled])::after {\n content: \"\";\n position: absolute;\n\n inline-size: var(--_inline-size);\n block-size: var(--_block-size);\n\n background-color: inherit;\n }\n\n &[data-track=\"start\"] {\n &[data-orientation=\"horizontal\"] {\n border-start-end-radius: 0;\n border-end-end-radius: 0;\n\n &::before {\n inset-inline-end: 0;\n translate: 100%;\n\n border-start-end-radius: var(\n --_md-slider-track-inner-shape\n );\n border-end-end-radius: var(\n --_md-slider-track-inner-shape\n );\n }\n\n &::after {\n inset-inline-end: 0;\n translate: 50%;\n }\n }\n\n &[data-orientation=\"vertical\"] {\n border-start-end-radius: 0;\n border-start-start-radius: 0;\n\n &::before {\n inset-block-start: 0;\n translate: 0 -100%;\n\n border-start-end-radius: var(\n --_md-slider-track-inner-shape\n );\n border-start-start-radius: var(\n --_md-slider-track-inner-shape\n );\n }\n\n &::after {\n inset-block-start: 0;\n translate: 0 -50%;\n }\n }\n }\n\n &[data-track=\"end\"] {\n &[data-orientation=\"horizontal\"] {\n border-start-start-radius: 0;\n border-end-start-radius: 0;\n\n &::before {\n inset-inline-start: 0;\n translate: -100%;\n\n border-start-start-radius: var(\n --_md-slider-track-inner-shape\n );\n border-end-start-radius: var(\n --_md-slider-track-inner-shape\n );\n }\n\n &::after {\n inset-inline-start: 0;\n translate: -50%;\n }\n }\n\n &[data-orientation=\"vertical\"] {\n border-end-end-radius: 0;\n border-end-start-radius: 0;\n\n &::before {\n inset-block-end: 0;\n translate: 0 100%;\n\n border-end-end-radius: var(\n --_md-slider-track-inner-shape\n );\n border-end-start-radius: var(\n --_md-slider-track-inner-shape\n );\n }\n\n &::after {\n inset-block-end: 0;\n translate: 0 50%;\n }\n }\n }\n }\n }\n}\n","import clsx from \"clsx\";\nimport { Slider as AriaSlider, SliderTrack } from \"react-aria-components\";\nimport { Label } from \"../../Label\";\nimport {\n ActiveTrackStyles,\n InactiveTrackStyles,\n SliderColors,\n SliderSizeStyles,\n SliderStyles,\n TrackContainerStyles,\n TrackStyles,\n VisualTrackStyles,\n} from \"../core\";\nimport { SliderStops } from \"../SliderStops\";\nimport { SliderThumb } from \"../SliderThumb\";\nimport styles from \"./centerdSlider.module.css\";\nimport type { CenteredSliderProps } from \"./types\";\n\nexport const CenteredSlider = <T extends number>({\n label,\n thumbLabel,\n size = \"small\",\n minValue = 0,\n maxValue = 100,\n step = 1,\n defaultValue = ((minValue + maxValue) / 2) as T,\n showInBetweenSteps,\n maxStops,\n outputRenderer,\n className,\n ...props\n}: CenteredSliderProps<T>) => {\n return (\n <AriaSlider\n minValue={minValue}\n maxValue={maxValue}\n step={step}\n defaultValue={defaultValue}\n className={(renderProps) =>\n clsx(\n SliderStyles,\n SliderColors,\n typeof className === \"function\"\n ? className(renderProps)\n : className\n )\n }\n {...props}\n >\n {({ orientation, state, isDisabled }) => {\n const thumbValue = state.getThumbPercent(0);\n const sizeKey =\n orientation === \"horizontal\" ? \"inlineSize\" : \"blockSize\";\n\n const center = 0.5;\n\n const mid = Math.abs(thumbValue - center) * 100;\n const start = Math.min(thumbValue, center) * 100;\n const end = Math.min(1 - thumbValue, center) * 100;\n\n const activeDirection =\n thumbValue < 0.5\n ? \"start\"\n : thumbValue > 0.5\n ? \"end\"\n : undefined;\n\n return (\n <>\n {label && <Label>{label}</Label>}\n\n <div\n className={clsx(TrackContainerStyles)}\n data-orientation={orientation}\n >\n <SliderTrack\n className={clsx(\n TrackStyles,\n SliderSizeStyles(size)\n )}\n >\n <div\n className={clsx(VisualTrackStyles)}\n data-orientation={orientation}\n >\n <div\n className={clsx(\n InactiveTrackStyles,\n styles[\"inactive-track\"]\n )}\n data-active-direction={\n activeDirection === \"start\" ||\n undefined\n }\n data-track=\"start\"\n data-orientation={orientation}\n data-mid={\n thumbValue === center || undefined\n }\n data-disabled={isDisabled || undefined}\n style={{\n [sizeKey]: `${start}%`,\n }}\n />\n\n <div\n className={clsx(ActiveTrackStyles)}\n data-orientation={orientation}\n data-track=\"mid\"\n data-disabled={isDisabled || undefined}\n style={{\n [sizeKey]: `${mid}%`,\n }}\n >\n <div data-direction={activeDirection} />\n </div>\n\n <div\n className={clsx(\n InactiveTrackStyles,\n styles[\"inactive-track\"]\n )}\n data-orientation={orientation}\n data-track=\"end\"\n data-active-direction={\n activeDirection === \"end\" ||\n undefined\n }\n data-mid={\n thumbValue === center || undefined\n }\n data-disabled={isDisabled || undefined}\n style={{\n [sizeKey]: `${end}%`,\n }}\n />\n </div>\n\n <SliderThumb\n size={size}\n orientation={orientation}\n aria-label={thumbLabel}\n outputRenderer={outputRenderer}\n />\n\n <SliderStops\n slider=\"centered\"\n minValue={minValue}\n maxValue={maxValue}\n step={step}\n orientation={orientation}\n showInBetweenSteps={showInBetweenSteps}\n maxStops={maxStops}\n />\n </SliderTrack>\n </div>\n </>\n );\n }}\n </AriaSlider>\n );\n};\n"],"mappings":";;;;;;;;yDCkBa,KAAoC,EAC7C,UACA,eACA,UAAO,SACP,cAAW,GACX,cAAW,KACX,UAAO,GACP,mBAAiB,IAAW,KAAY,GACxC,uBACA,aACA,mBACA,cACA,GAAG,QAGC,kBAAC,GAAD;CACc;CACA;CACJ;CACQ;CACd,YAAY,MACR,EACI,GACA,GACA,OAAO,KAAc,aACf,EAAU,CAAW,IACrB,CACV;CAEJ,GAAI;YAEF,EAAE,gBAAa,UAAO,oBAAiB;EACrC,IAAM,IAAa,EAAM,gBAAgB,CAAC,GACpC,IACF,MAAgB,eAAe,eAAe,aAE5C,IAAS,IAET,IAAM,KAAK,IAAI,IAAa,CAAM,IAAI,KACtC,IAAQ,KAAK,IAAI,GAAY,CAAM,IAAI,KACvC,IAAM,KAAK,IAAI,IAAI,GAAY,CAAM,IAAI,KAEzC,IACF,IAAa,KACP,UACA,IAAa,KACX,QACA,KAAA;EAEZ,OACI,kBAAA,GAAA,EAAA,UAAA,CACK,KAAS,kBAAC,GAAD,EAAA,UAAQ,EAAa,CAAA,GAE/B,kBAAC,OAAD;GACI,WAAW,EAAK,CAAoB;GACpC,oBAAkB;aAElB,kBAAC,GAAD;IACI,WAAW,EACP,GACA,EAAiB,CAAI,CACzB;cAJJ;KAMI,kBAAC,OAAD;MACI,WAAW,EAAK,CAAiB;MACjC,oBAAkB;gBAFtB;OAII,kBAAC,OAAD;QACI,WAAW,EACP,GACA,EAAO,iBACX;QACA,yBACI,MAAoB,WACpB,KAAA;QAEJ,cAAW;QACX,oBAAkB;QAClB,YACI,MAAe,KAAU,KAAA;QAE7B,iBAAe,KAAc,KAAA;QAC7B,OAAO,GACF,IAAU,GAAG,EAAK,GACvB;OAAE,CAAA;OAGN,kBAAC,OAAD;QACI,WAAW,EAAK,CAAiB;QACjC,oBAAkB;QAClB,cAAW;QACX,iBAAe,KAAc,KAAA;QAC7B,OAAO,GACF,IAAU,GAAG,EAAG,GACrB;kBAEA,kBAAC,OAAD,EAAK,kBAAgB,EAAgB,CAAA;OACpC,CAAA;OAEL,kBAAC,OAAD;QACI,WAAW,EACP,GACA,EAAO,iBACX;QACA,oBAAkB;QAClB,cAAW;QACX,yBACI,MAAoB,SACpB,KAAA;QAEJ,YACI,MAAe,KAAU,KAAA;QAE7B,iBAAe,KAAc,KAAA;QAC7B,OAAO,GACF,IAAU,GAAG,EAAG,GACrB;OAAE,CAAA;MAEL;;KAEL,kBAAC,GAAD;MACU;MACO;MACb,cAAY;MACI;KAAe,CAAA;KAGnC,kBAAC,GAAD;MACI,QAAO;MACG;MACA;MACJ;MACO;MACO;MACV;KAAS,CAAA;IAEd;;EACZ,CAAA,CACT,EAAA,CAAA;CAER;AACQ,CAAA"}
|
package/dist/chunks/ComboBox.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ComboBox","names":[],"sources":["../../src/components/Input/Select/ComboBox/comboBox.module.css","../../src/components/Input/Select/ComboBox/ComboBox.tsx"],"sourcesContent":["@layer adgytec.comps {\n .selected-value {\n color: var(--editor-color);\n\n padding-inline-start: var(--md-sys-layout-space-16);\n padding-inline-end: var(--md-sys-layout-space-12);\n\n &[data-placeholder] {\n color: var(--placeholder-color);\n display: none;\n }\n }\n\n .tag-list {\n display: flex;\n gap: var(--md-sys-layout-space-8);\n\n flex-wrap: wrap;\n }\n}\n","import clsx from \"clsx\";\nimport {\n ComboBox as AriaComboBox,\n ComboBoxValue,\n TagGroup,\n TagList,\n} from \"react-aria-components\";\nimport { Tag } from \"@/components/Tag\";\nimport { typography } from \"@/utils\";\nimport { Colors, InputGroupStyles, SupportingTextStyles } from \"../../core\";\nimport { Description } from \"../../Description\";\nimport { FieldError } from \"../../FieldError\";\nimport { Label } from \"../../Label\";\nimport styles from \"./comboBox.module.css\";\nimport { ComboboxContext } from \"./context\";\nimport type { ComboBoxProps } from \"./types\";\n\nexport const ComboBox = <\n T extends object,\n M extends \"single\" | \"multiple\" = \"single\",\n>({\n label,\n description,\n errorMessage,\n showDescriptionOnInvalid = false,\n children,\n className,\n hideMultiSelectionValue = false,\n ...props\n}: ComboBoxProps<T, M>) => {\n return (\n <AriaComboBox\n className={(renderProps) =>\n clsx(\n Colors,\n InputGroupStyles,\n typeof className === \"function\"\n ? className(renderProps)\n : className\n )\n }\n {...props}\n >\n {(renderProps) => {\n const { isInvalid } = renderProps;\n const showDescription =\n description &&\n (!isInvalid || (isInvalid && showDescriptionOnInvalid));\n\n return (\n <ComboboxContext value={renderProps}>\n {label && <Label>{label}</Label>}\n\n {typeof children === \"function\"\n ? children(renderProps)\n : children}\n\n {props.selectionMode === \"multiple\" &&\n !hideMultiSelectionValue && (\n <ComboBoxValue<T>\n className={clsx(\n styles[\"selected-value\"],\n typography.bodyLarge\n )}\n >\n {({ state }) => {\n return (\n <TagGroup\n aria-label=\"Selected Items\"\n onRemove={(keys) => {\n if (\n Array.isArray(\n state.value\n )\n ) {\n state.setValue(\n state.value.filter(\n (k) =>\n !keys.has(k)\n )\n );\n }\n }}\n >\n <TagList\n items={state.selectedItems}\n className={clsx(\n styles[\"tag-list\"]\n )}\n >\n {(item) => (\n <Tag\n id={item.key}\n label={\n item.textValue\n }\n />\n )}\n </TagList>\n </TagGroup>\n );\n }}\n </ComboBoxValue>\n )}\n\n {showDescription && (\n <Description className={clsx(SupportingTextStyles)}>\n {description}\n </Description>\n )}\n\n <FieldError className={clsx(SupportingTextStyles)}>\n {errorMessage}\n </FieldError>\n </ComboboxContext>\n );\n }}\n </AriaComboBox>\n );\n};\n"],"mappings":";;;;;;;;;;;;;;GCiBa,KAGX,EACE,UACA,gBACA,iBACA,8BAA2B,IAC3B,aACA,cACA,6BAA0B,IAC1B,GAAG,QAGC,kBAAC,GAAD;CACI,YAAY,MACR,EACI,GACA,GACA,OAAO,KAAc,aACf,EAAU,CAAW,IACrB,CACV;CAEJ,GAAI;
|
|
1
|
+
{"version":3,"file":"ComboBox","names":["renderProps"],"sources":["../../src/components/Input/Select/ComboBox/comboBox.module.css","../../src/components/Input/Select/ComboBox/ComboBox.tsx"],"sourcesContent":["@layer adgytec.comps {\n .selected-value {\n color: var(--editor-color);\n\n padding-inline-start: var(--md-sys-layout-space-16);\n padding-inline-end: var(--md-sys-layout-space-12);\n\n &[data-placeholder] {\n color: var(--placeholder-color);\n display: none;\n }\n }\n\n .tag-list {\n display: flex;\n gap: var(--md-sys-layout-space-8);\n\n flex-wrap: wrap;\n }\n}\n","import clsx from \"clsx\";\nimport {\n ComboBox as AriaComboBox,\n ComboBoxValue,\n TagGroup,\n TagList,\n} from \"react-aria-components\";\nimport { Tag } from \"@/components/Tag\";\nimport { typography } from \"@/utils\";\nimport { Colors, InputGroupStyles, SupportingTextStyles } from \"../../core\";\nimport { Description } from \"../../Description\";\nimport { FieldError } from \"../../FieldError\";\nimport { Label } from \"../../Label\";\nimport styles from \"./comboBox.module.css\";\nimport { ComboboxContext } from \"./context\";\nimport type { ComboBoxProps } from \"./types\";\n\nexport const ComboBox = <\n T extends object,\n M extends \"single\" | \"multiple\" = \"single\",\n>({\n label,\n description,\n errorMessage,\n showDescriptionOnInvalid = false,\n children,\n className,\n hideMultiSelectionValue = false,\n ...props\n}: ComboBoxProps<T, M>) => {\n return (\n <AriaComboBox\n className={(renderProps) =>\n clsx(\n Colors,\n InputGroupStyles,\n typeof className === \"function\"\n ? className(renderProps)\n : className\n )\n }\n {...props}\n >\n {(renderProps) => {\n const { isInvalid } = renderProps;\n const showDescription =\n description &&\n (!isInvalid || (isInvalid && showDescriptionOnInvalid));\n\n return (\n <ComboboxContext value={renderProps}>\n {label && <Label>{label}</Label>}\n\n {typeof children === \"function\"\n ? children(renderProps)\n : children}\n\n {props.selectionMode === \"multiple\" &&\n !hideMultiSelectionValue && (\n <ComboBoxValue<T>\n className={clsx(\n styles[\"selected-value\"],\n typography.bodyLarge\n )}\n >\n {({ state }) => {\n return (\n <TagGroup\n aria-label=\"Selected Items\"\n onRemove={(keys) => {\n if (\n Array.isArray(\n state.value\n )\n ) {\n state.setValue(\n state.value.filter(\n (k) =>\n !keys.has(k)\n )\n );\n }\n }}\n >\n <TagList\n items={state.selectedItems}\n className={clsx(\n styles[\"tag-list\"]\n )}\n >\n {(item) => (\n <Tag\n id={item.key}\n label={\n item.textValue\n }\n />\n )}\n </TagList>\n </TagGroup>\n );\n }}\n </ComboBoxValue>\n )}\n\n {showDescription && (\n <Description className={clsx(SupportingTextStyles)}>\n {description}\n </Description>\n )}\n\n <FieldError className={clsx(SupportingTextStyles)}>\n {errorMessage}\n </FieldError>\n </ComboboxContext>\n );\n }}\n </AriaComboBox>\n );\n};\n"],"mappings":";;;;;;;;;;;;;;GCiBa,KAGX,EACE,UACA,gBACA,iBACA,8BAA2B,IAC3B,aACA,cACA,6BAA0B,IAC1B,GAAG,QAGC,kBAAC,GAAD;CACI,YAAY,MACR,EACI,GACA,GACA,OAAO,KAAc,aACf,EAAU,CAAW,IACrB,CACV;CAEJ,GAAI;YAEFA,MAAgB;EACd,IAAM,EAAE,iBAAcA,GAChB,IACF,MACC,CAAC,KAAc,KAAa;EAEjC,OACI,kBAAC,GAAD;GAAiB,OAAOA;aAAxB;IACK,KAAS,kBAAC,GAAD,EAAA,UAAQ,EAAa,CAAA;IAE9B,OAAO,KAAa,aACf,EAASA,CAAW,IACpB;IAEL,EAAM,kBAAkB,cACrB,CAAC,KACG,kBAAC,GAAD;KACI,WAAW,EACP,EAAO,mBACP,EAAW,SACf;gBAEE,EAAE,eAEI,kBAAC,GAAD;MACI,cAAW;MACX,WAAW,MAAS;OAChB,AACI,MAAM,QACF,EAAM,KACV,KAEA,EAAM,SACF,EAAM,MAAM,QACP,MACG,CAAC,EAAK,IAAI,CAAC,CACnB,CACJ;MAER;gBAEA,kBAAC,GAAD;OACI,OAAO,EAAM;OACb,WAAW,EACP,EAAO,WACX;kBAEE,MACE,kBAAC,GAAD;QACI,IAAI,EAAK;QACT,OACI,EAAK;OACR,CAAA;MAGJ,CAAA;KACH,CAAA;IAGP,CAAA;IAGtB,KACG,kBAAC,GAAD;KAAa,WAAW,EAAK,CAAoB;eAC5C;IACQ,CAAA;IAGjB,kBAAC,GAAD;KAAY,WAAW,EAAK,CAAoB;eAC3C;IACO,CAAA;GACC;;CAEzB;AACU,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ComboBoxPopover","names":[],"sources":["../../src/components/Input/Select/ComboBoxPopover/comboBoxPopover.module.css","../../src/components/Input/Select/ComboBoxPopover/ComboBoxPopover.tsx"],"sourcesContent":["@layer adgytec.comps {\n .popover {\n inline-size: calc(var(--trigger-width) + calc(30 * var(--dp, 1px)));\n\n display: grid;\n grid-template-rows: 1fr;\n }\n}\n","import { clsx } from \"clsx\";\nimport { Popover } from \"@/components/Popover\";\nimport styles from \"./comboBoxPopover.module.css\";\n\nexport const ComboBoxPopover: React.FC<\n React.ComponentPropsWithRef<typeof Popover>\n> = ({\n offset = 25, // (58dp trigger height - 20dp text line-height) / 2 + 2dp outline + 4dp space\n crossOffset = -17, // 16dp padding + 1dp border\n className,\n ...props\n}) => {\n return (\n <Popover\n className={(renderProps) =>\n clsx(\n styles[\"popover\"],\n typeof className === \"function\"\n ? className(renderProps)\n : className\n )\n }\n offset={offset}\n crossOffset={crossOffset}\n {...props}\n />\n );\n};\n"],"mappings":";;;yCCIa,KAER,EACD,YAAS,IACT,iBAAc,KACd,cACA,GAAG,QAGC,kBAAC,GAAD;CACI,YAAY,MACR,EACI,EAAO,SACP,OAAO,KAAc,aACf,EAAU,CAAW,IACrB,CACV;CAEI;CACK;CACb,GAAI;
|
|
1
|
+
{"version":3,"file":"ComboBoxPopover","names":[],"sources":["../../src/components/Input/Select/ComboBoxPopover/comboBoxPopover.module.css","../../src/components/Input/Select/ComboBoxPopover/ComboBoxPopover.tsx"],"sourcesContent":["@layer adgytec.comps {\n .popover {\n inline-size: calc(var(--trigger-width) + calc(30 * var(--dp, 1px)));\n\n display: grid;\n grid-template-rows: 1fr;\n }\n}\n","import { clsx } from \"clsx\";\nimport { Popover } from \"@/components/Popover\";\nimport styles from \"./comboBoxPopover.module.css\";\n\nexport const ComboBoxPopover: React.FC<\n React.ComponentPropsWithRef<typeof Popover>\n> = ({\n offset = 25, // (58dp trigger height - 20dp text line-height) / 2 + 2dp outline + 4dp space\n crossOffset = -17, // 16dp padding + 1dp border\n className,\n ...props\n}) => {\n return (\n <Popover\n className={(renderProps) =>\n clsx(\n styles[\"popover\"],\n typeof className === \"function\"\n ? className(renderProps)\n : className\n )\n }\n offset={offset}\n crossOffset={crossOffset}\n {...props}\n />\n );\n};\n"],"mappings":";;;yCCIa,KAER,EACD,YAAS,IACT,iBAAc,KACd,cACA,GAAG,QAGC,kBAAC,GAAD;CACI,YAAY,MACR,EACI,EAAO,SACP,OAAO,KAAc,aACf,EAAU,CAAW,IACrB,CACV;CAEI;CACK;CACb,GAAI;AAAM,CAAA"}
|
|
@@ -1,53 +1,75 @@
|
|
|
1
|
-
import { t as e } from "./
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
5
|
-
import {
|
|
6
|
-
import { t as c } from "./
|
|
7
|
-
import l from "
|
|
8
|
-
import
|
|
9
|
-
import {
|
|
10
|
-
import {
|
|
11
|
-
import {
|
|
12
|
-
import {
|
|
13
|
-
import
|
|
1
|
+
import { t as e } from "./compiler-runtime";
|
|
2
|
+
import { t } from "./base";
|
|
3
|
+
import { IconButton as n } from "../components/Button/IconButton/index.js";
|
|
4
|
+
import { t as r } from "./usePress";
|
|
5
|
+
import { d as i, o as a, s as o } from "./core4";
|
|
6
|
+
import { n as s, t as c } from "./useHover";
|
|
7
|
+
import { t as l } from "./context";
|
|
8
|
+
import u from "clsx";
|
|
9
|
+
import { useContext as d } from "react";
|
|
10
|
+
import { jsx as f, jsxs as p } from "react/jsx-runtime";
|
|
11
|
+
import { Input as m } from "react-aria-components";
|
|
12
|
+
import { ChevronDown as h } from "lucide-react";
|
|
13
|
+
import { useObjectRef as g } from "react-aria";
|
|
14
|
+
import '../assets/ComboBoxTrigger.css';//#region src/components/Input/Select/ComboBoxTrigger/comboBoxTrigger.module.css
|
|
15
|
+
var _ = e(), v = {
|
|
14
16
|
trigger: "_trigger_83n0r_2",
|
|
15
17
|
input: "_input_83n0r_26"
|
|
16
|
-
},
|
|
17
|
-
let
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
18
|
+
}, y = (e) => {
|
|
19
|
+
let y = (0, _.c)(36), b, x, S, C, w;
|
|
20
|
+
y[0] === e ? (b = y[1], x = y[2], S = y[3], C = y[4], w = y[5]) : ({className: b, placeholder: S, dir: x, ref: w, ...C} = e, y[0] = e, y[1] = b, y[2] = x, y[3] = S, y[4] = C, y[5] = w);
|
|
21
|
+
let T = g(w), { isInvalid: E, isDisabled: D, isOpen: O } = d(l), k;
|
|
22
|
+
y[6] === Symbol.for("react.memo_cache_sentinel") ? (k = { isTextInput: !0 }, y[6] = k) : k = y[6];
|
|
23
|
+
let { isFocused: A, isFocusVisible: j, focusProps: M } = s(k), N;
|
|
24
|
+
y[7] === Symbol.for("react.memo_cache_sentinel") ? (N = {}, y[7] = N) : N = y[7];
|
|
25
|
+
let { isHovered: P, hoverProps: F } = c(N), I;
|
|
26
|
+
y[8] === T ? I = y[9] : (I = { onPress: () => {
|
|
27
|
+
T.current?.focus();
|
|
28
|
+
} }, y[8] = T, y[9] = I);
|
|
29
|
+
let { pressProps: L } = r(I), R = P || void 0, z = A || void 0, B = j || void 0, V = E || void 0, H = D || void 0, U = O || void 0, W;
|
|
30
|
+
y[10] !== R || y[11] !== z || y[12] !== B || y[13] !== V || y[14] !== H || y[15] !== U ? (W = {
|
|
31
|
+
"data-hovered": R,
|
|
32
|
+
"data-focused": z,
|
|
33
|
+
"data-focus-visible": B,
|
|
23
34
|
"data-trailing": !0,
|
|
24
|
-
"data-invalid":
|
|
35
|
+
"data-invalid": V,
|
|
25
36
|
"data-input": !0,
|
|
26
|
-
"data-disabled":
|
|
27
|
-
"data-open":
|
|
28
|
-
};
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
37
|
+
"data-disabled": H,
|
|
38
|
+
"data-open": U
|
|
39
|
+
}, y[10] = R, y[11] = z, y[12] = B, y[13] = V, y[14] = H, y[15] = U, y[16] = W) : W = y[16];
|
|
40
|
+
let G = W, K;
|
|
41
|
+
y[17] === b ? K = y[18] : (K = u(o, b), y[17] = b, y[18] = K);
|
|
42
|
+
let q;
|
|
43
|
+
y[19] === Symbol.for("react.memo_cache_sentinel") ? (q = u(i, a, t.bodyLarge, v.input), y[19] = q) : q = y[19];
|
|
44
|
+
let J;
|
|
45
|
+
y[20] !== x || y[21] !== M || y[22] !== T || y[23] !== S ? (J = /* @__PURE__ */ f(m, {
|
|
46
|
+
ref: T,
|
|
34
47
|
...M,
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
});
|
|
48
|
+
placeholder: S,
|
|
49
|
+
className: q,
|
|
50
|
+
"data-input": !0,
|
|
51
|
+
dir: x
|
|
52
|
+
}), y[20] = x, y[21] = M, y[22] = T, y[23] = S, y[24] = J) : J = y[24];
|
|
53
|
+
let Y;
|
|
54
|
+
y[25] === Symbol.for("react.memo_cache_sentinel") ? (Y = u(v.trigger), y[25] = Y) : Y = y[25];
|
|
55
|
+
let X = E || void 0, Z;
|
|
56
|
+
y[26] === X ? Z = y[27] : (Z = /* @__PURE__ */ f(n, {
|
|
57
|
+
className: Y,
|
|
58
|
+
icon: h,
|
|
59
|
+
color: "standard",
|
|
60
|
+
"data-invalid": X
|
|
61
|
+
}), y[26] = X, y[27] = Z);
|
|
62
|
+
let Q;
|
|
63
|
+
return y[28] !== G || y[29] !== F || y[30] !== L || y[31] !== C || y[32] !== K || y[33] !== J || y[34] !== Z ? (Q = /* @__PURE__ */ p("span", {
|
|
64
|
+
...L,
|
|
65
|
+
...F,
|
|
66
|
+
className: K,
|
|
67
|
+
...C,
|
|
68
|
+
...G,
|
|
69
|
+
children: [J, Z]
|
|
70
|
+
}), y[28] = G, y[29] = F, y[30] = L, y[31] = C, y[32] = K, y[33] = J, y[34] = Z, y[35] = Q) : Q = y[35], Q;
|
|
49
71
|
};
|
|
50
72
|
//#endregion
|
|
51
|
-
export {
|
|
73
|
+
export { y as t };
|
|
52
74
|
|
|
53
75
|
//# sourceMappingURL=ComboBoxTrigger.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ComboBoxTrigger","names":[],"sources":["../../src/components/Input/Select/ComboBoxTrigger/comboBoxTrigger.module.css","../../src/components/Input/Select/ComboBoxTrigger/ComboBoxTrigger.tsx"],"sourcesContent":["@layer adgytec.overrides {\n .trigger[data-invalid] > [data-button] {\n --md-button-color: var(--group-color);\n }\n}\n\n@layer adgytec.comps {\n .trigger {\n --rotate: 0;\n\n &[data-pressed] {\n --rotate: 180deg;\n }\n\n & svg {\n rotate: var(--rotate);\n transition: rotate var(--md-sys-motion-expressive-fast-spatial)\n var(--md-sys-motion-expressive-fast-spatial-duration);\n\n @media (prefers-reduced-motion) {\n transition: none;\n }\n }\n }\n\n .input {\n flex: 1;\n text-align: start;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n}\n","import clsx from \"clsx\";\nimport { ChevronDown } from \"lucide-react\";\nimport { useContext } from \"react\";\nimport { useObjectRef } from \"react-aria\";\nimport { useFocusRing } from \"react-aria/useFocusRing\";\nimport { useHover } from \"react-aria/useHover\";\nimport { usePress } from \"react-aria/usePress\";\nimport { Input } from \"react-aria-components\";\nimport { IconButton } from \"@/components/Button\";\nimport { type RefProp, typography } from \"@/utils\";\nimport { EditorInputStyles, EditorStyles, UnsetStyles } from \"../../core\";\nimport { ComboboxContext } from \"../ComboBox/context\";\nimport styles from \"./comboBoxTrigger.module.css\";\n\nexport const ComboBoxTrigger: React.FC<\n Omit<React.ComponentPropsWithoutRef<\"span\">, \"children\"> &\n RefProp<typeof Input> & {\n placeholder?: string;\n }\n> = ({ className, placeholder, dir, ref, ...props }) => {\n const inputRef = useObjectRef(ref);\n\n const { isInvalid, isDisabled, isOpen } = useContext(ComboboxContext);\n const { isFocused, isFocusVisible, focusProps } = useFocusRing({\n isTextInput: true,\n });\n const { isHovered, hoverProps } = useHover({});\n const { pressProps } = usePress({\n onPress: () => {\n inputRef.current?.focus();\n },\n });\n\n const dataAttrs = {\n \"data-hovered\": isHovered || undefined,\n \"data-focused\": isFocused || undefined,\n \"data-focus-visible\": isFocusVisible || undefined,\n \"data-trailing\": true,\n \"data-invalid\": isInvalid || undefined,\n \"data-input\": true,\n \"data-disabled\": isDisabled || undefined,\n \"data-open\": isOpen || undefined,\n };\n\n return (\n <span\n {...pressProps}\n {...hoverProps}\n className={clsx(EditorStyles, className)}\n {...props}\n {...dataAttrs}\n >\n <Input\n ref={inputRef}\n {...focusProps}\n placeholder={placeholder}\n className={clsx(\n UnsetStyles,\n EditorInputStyles,\n typography.bodyLarge,\n styles[\"input\"]\n )}\n data-input={true}\n dir={dir}\n />\n <IconButton\n className={clsx(styles[\"trigger\"])}\n icon={ChevronDown}\n color=\"standard\"\n data-invalid={isInvalid || undefined}\n />\n </span>\n );\n};\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"ComboBoxTrigger","names":["inputRef","placeholder","dir","ChevronDown"],"sources":["../../src/components/Input/Select/ComboBoxTrigger/comboBoxTrigger.module.css","../../src/components/Input/Select/ComboBoxTrigger/ComboBoxTrigger.tsx"],"sourcesContent":["@layer adgytec.overrides {\n .trigger[data-invalid] > [data-button] {\n --md-button-color: var(--group-color);\n }\n}\n\n@layer adgytec.comps {\n .trigger {\n --rotate: 0;\n\n &[data-pressed] {\n --rotate: 180deg;\n }\n\n & svg {\n rotate: var(--rotate);\n transition: rotate var(--md-sys-motion-expressive-fast-spatial)\n var(--md-sys-motion-expressive-fast-spatial-duration);\n\n @media (prefers-reduced-motion) {\n transition: none;\n }\n }\n }\n\n .input {\n flex: 1;\n text-align: start;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n}\n","import clsx from \"clsx\";\nimport { ChevronDown } from \"lucide-react\";\nimport { useContext } from \"react\";\nimport { useObjectRef } from \"react-aria\";\nimport { useFocusRing } from \"react-aria/useFocusRing\";\nimport { useHover } from \"react-aria/useHover\";\nimport { usePress } from \"react-aria/usePress\";\nimport { Input } from \"react-aria-components\";\nimport { IconButton } from \"@/components/Button\";\nimport { type RefProp, typography } from \"@/utils\";\nimport { EditorInputStyles, EditorStyles, UnsetStyles } from \"../../core\";\nimport { ComboboxContext } from \"../ComboBox/context\";\nimport styles from \"./comboBoxTrigger.module.css\";\n\nexport const ComboBoxTrigger: React.FC<\n Omit<React.ComponentPropsWithoutRef<\"span\">, \"children\"> &\n RefProp<typeof Input> & {\n placeholder?: string;\n }\n> = ({ className, placeholder, dir, ref, ...props }) => {\n const inputRef = useObjectRef(ref);\n\n const { isInvalid, isDisabled, isOpen } = useContext(ComboboxContext);\n const { isFocused, isFocusVisible, focusProps } = useFocusRing({\n isTextInput: true,\n });\n const { isHovered, hoverProps } = useHover({});\n const { pressProps } = usePress({\n onPress: () => {\n inputRef.current?.focus();\n },\n });\n\n const dataAttrs = {\n \"data-hovered\": isHovered || undefined,\n \"data-focused\": isFocused || undefined,\n \"data-focus-visible\": isFocusVisible || undefined,\n \"data-trailing\": true,\n \"data-invalid\": isInvalid || undefined,\n \"data-input\": true,\n \"data-disabled\": isDisabled || undefined,\n \"data-open\": isOpen || undefined,\n };\n\n return (\n <span\n {...pressProps}\n {...hoverProps}\n className={clsx(EditorStyles, className)}\n {...props}\n {...dataAttrs}\n >\n <Input\n ref={inputRef}\n {...focusProps}\n placeholder={placeholder}\n className={clsx(\n UnsetStyles,\n EditorInputStyles,\n typography.bodyLarge,\n styles[\"input\"]\n )}\n data-input={true}\n dir={dir}\n />\n <IconButton\n className={clsx(styles[\"trigger\"])}\n icon={ChevronDown}\n color=\"standard\"\n data-invalid={isInvalid || undefined}\n />\n </span>\n );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;GCca,KAKT,MAAA;CAAA,IAAA,KAAA,GAAA,EAAA,EAAA,CAAA,EAAA,GAAA,GAAA,GAAA,GAAA,GAAA;CAAA,AAAA,EAAA,OAAA,KAA+C,IAAA,EAAA,IAAA,IAAA,EAAA,IAAA,IAAA,EAAA,IAAA,IAAA,EAAA,IAAA,IAAA,EAAA,OAA9C,kDAAA,KAAA,GAA8C,EAAA,KAAA,GAAA,EAAA,KAAA,GAAA,EAAA,KAAA,GAAA,EAAA,KAAA,GAAA,EAAA,KAAA,GAAA,EAAA,KAAA;CAC/C,IAAA,IAAiB,EAAa,CAAG,GAEjC,EAAA,cAAA,eAAA,cAA0C,EAAW,CAAe,GAAE;CAAA,AAAA,EAAA,OAAA,OAAA,IAAA,2BAAA,KACP,IAAA,EAAA,aAC9C,GACjB,GAAC,EAAA,KAAA,KAAA,IAAA,EAAA;CAFD,IAAA,EAAA,cAAA,mBAAA,kBAAkD,EAAa,CAE9D,GAAE;CAAA,AAAA,EAAA,OAAA,OAAA,IAAA,2BAAA,KACwC,IAAA,CAAC,GAAC,EAAA,KAAA,KAAA,IAAA,EAAA;CAA7C,IAAA,EAAA,cAAA,kBAAkC,EAAS,CAAE,GAAE;CAAA,AAAA,EAAA,OAAA,IAK9C,IAAA,EAAA,MAJ+B,IAAA,EAAA,eACnB;EACL,EAAQ,SAAe,MAAC;CAAC,EAEjC,GAAC,EAAA,KAAA,GAAA,EAAA,KAAA;CAJD,IAAA,EAAA,kBAAuB,EAAS,CAI/B,GAGmB,IAAA,KAAA,KAAA,GACA,IAAA,KAAA,KAAA,GACM,IAAA,KAAA,KAAA,GAEN,IAAA,KAAA,KAAA,GAEC,IAAA,KAAA,KAAA,GACJ,IAAA,KAAA,KAAA,GAAmB;CAAA,AAAA,EAAA,QAAA,KAAA,EAAA,QAAA,KAAA,EAAA,QAAA,KAAA,EAAA,QAAA,KAAA,EAAA,QAAA,KAAA,EAAA,QAAA,KARlB,IAAA;EAAA,gBACE;EAAsB,gBACtB;EAAsB,sBAChB;EAA2B,iBAChC;EAAI,gBACL;EAAsB,cACxB;EAAI,iBACD;EAAuB,aAC3B;CACjB,GAAC,EAAA,MAAA,GAAA,EAAA,MAAA,GAAA,EAAA,MAAA,GAAA,EAAA,MAAA,GAAA,EAAA,MAAA,GAAA,EAAA,MAAA,GAAA,EAAA,MAAA,KAAA,IAAA,EAAA;CATD,IAAA,IAAkB,GAShB;CAAA,AAAA,EAAA,QAAA,IAM8C,IAAA,EAAA,OAA7B,IAAA,EAAK,GAAc,CAAS,GAAC,EAAA,MAAA,GAAA,EAAA,MAAA;CAAA,IAAA;CAAA,AAAA,EAAA,QAAA,OAAA,IAAA,2BAAA,KAQzB,IAAA,EACP,GACA,GACA,EAAU,WACV,EAAM,KACV,GAAC,EAAA,MAAA,KAAA,IAAA,EAAA;CAAA,IAAA;CAAA,AAAA,EAAA,QAAA,KAAA,EAAA,QAAA,KAAA,EAAA,QAAA,KAAA,EAAA,QAAA,KATL,IAAA,kBAAC,GAAD;EACSA,KAAA;EAAQ,GACT;EACS;EACF,WAAA;EAMC,cAAA;EACP;CAAG,CAAA,GACV,EAAA,MAAA,GAAA,EAAA,MAAA,GAAA,EAAA,MAAA,GAAA,EAAA,MAAA,GAAA,EAAA,MAAA,KAAA,IAAA,EAAA;CAAA,IAAA;CAAA,AAAA,EAAA,QAAA,OAAA,IAAA,2BAAA,KAEa,IAAA,EAAK,EAAM,OAAW,GAAC,EAAA,MAAA,KAAA,IAAA,EAAA;CAGpB,IAAA,IAAA,KAAA,KAAA,GAAsB;CAAA,AAAA,EAAA,QAAA,IACtC,IAAA,EAAA,OALF,IAAA,kBAAC,GAAD;EACe,WAAA;EACLG,MAAA;EACA,OAAA;EACQ,gBAAA;CAAsB,CAAA,GACtC,EAAA,MAAA,GAAA,EAAA,MAAA;CAAA,IAAA;CACC,OADD,EAAA,QAAA,KAAA,EAAA,QAAA,KAAA,EAAA,QAAA,KAAA,EAAA,QAAA,KAAA,EAAA,QAAA,KAAA,EAAA,QAAA,KAAA,EAAA,QAAA,KAzBN,IAAA,kBAAA,QAAA;EA0BO,GAzBC;EAAU,GACV;EACO,WAAA;EAA6B,GACpC;EAAK,GACL;YALR,CAOI,GAaA,CAMG;KAAA,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,KA1BP;AA0BO"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ConnectedButtonGroup","names":[],"sources":["../../src/components/Button/ButtonGroups/ConnectedButtonGroup/connectedButtonGroup.module.css","../../src/components/Button/ButtonGroups/ConnectedButtonGroup/ConnectedButtonGroup.tsx"],"sourcesContent":["@layer adgytec.comps {\n .group {\n /* shape */\n --_shape-start-start: var(--_inner-shape);\n --_shape-end-start: var(--_inner-shape);\n --_shape-start-end: var(--_inner-shape);\n --_shape-end-end: var(--_inner-shape);\n\n display: inline-flex;\n align-items: center;\n gap: calc(2 * var(--dp, 1px));\n }\n\n .group > [data-pressed] {\n --_shape-start-start: var(--_pressed-shape);\n --_shape-end-start: var(--_pressed-shape);\n --_shape-start-end: var(--_pressed-shape);\n --_shape-end-end: var(--_pressed-shape);\n }\n\n .group > [data-connected-button]:first-child {\n --_shape-start-start: var(--_outer-shape);\n --_shape-end-start: var(--_outer-shape);\n }\n\n .group > [data-connected-button]:last-child {\n --_shape-start-end: var(--_outer-shape);\n --_shape-end-end: var(--_outer-shape);\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 --_md-button-padding-inline: var(--md-sys-layout-space-12);\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 --_outer-shape: var(--md-sys-shape-corner-radius-full);\n --_inner-shape: var(--md-sys-shape-corner-radius-small);\n --_pressed-shape: var(--md-sys-shape-corner-radius-extra-small);\n --_selected-shape: var(--md-sys-shape-corner-radius-full);\n\n &[data-shape=\"square\"] {\n --_outer-shape: var(--md-sys-shape-corner-radius-small);\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 --_md-button-padding-inline: var(--md-sys-layout-space-16);\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 --_outer-shape: var(--md-sys-shape-corner-radius-full);\n --_inner-shape: var(--md-sys-shape-corner-radius-small);\n --_pressed-shape: var(--md-sys-shape-corner-radius-extra-small);\n --_selected-shape: var(--md-sys-shape-corner-radius-full);\n\n &[data-shape=\"square\"] {\n --_outer-shape: var(--md-sys-shape-corner-radius-small);\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 --_md-button-padding-inline: var(--md-sys-layout-space-24);\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 --_outer-shape: var(--md-sys-shape-corner-radius-full);\n --_inner-shape: var(--md-sys-shape-corner-radius-small);\n --_pressed-shape: var(--md-sys-shape-corner-radius-extra-small);\n --_selected-shape: var(--md-sys-shape-corner-radius-full);\n\n &[data-shape=\"square\"] {\n --_outer-shape: var(--md-sys-shape-corner-radius-small);\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 --_md-button-padding-inline: var(--md-sys-layout-space-48);\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 --_outer-shape: var(--md-sys-shape-corner-radius-full);\n --_inner-shape: var(--md-sys-shape-corner-radius-large);\n --_pressed-shape: var(--md-sys-shape-corner-radius-medium);\n --_selected-shape: var(--md-sys-shape-corner-radius-full);\n\n &[data-shape=\"square\"] {\n --_outer-shape: var(--md-sys-shape-corner-radius-large);\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 --_md-button-padding-inline: var(--md-sys-layout-space-64);\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 --_outer-shape: var(--md-sys-shape-corner-radius-full);\n --_inner-shape: var(--md-sys-shape-corner-radius-large-increased);\n --_pressed-shape: var(--md-sys-shape-corner-radius-large);\n --_selected-shape: var(--md-sys-shape-corner-radius-full);\n\n &[data-shape=\"square\"] {\n --_outer-shape: var(--md-sys-shape-corner-radius-large-increased);\n }\n }\n}\n","import { clsx } from \"clsx\";\nimport { useMemo } from \"react\";\nimport { ToggleButtonGroup as AriaToggleButtonGroup } from \"react-aria-components\";\nimport { ConnectedButtonGroupContext } from \"../ButtonGroupContext\";\nimport styles from \"./connectedButtonGroup.module.css\";\nimport type { ConnectedButtonGroupProps } from \"./types\";\n\nexport const ConnectedButtonGroup: React.FC<ConnectedButtonGroupProps> = ({\n size = \"small\",\n shape = \"round\",\n color = \"filled\",\n iconPlacement,\n className,\n ...props\n}) => {\n const contextValue = useMemo(\n () => ({ size, shape, color, iconPlacement }),\n [size, shape, color, iconPlacement]\n );\n\n return (\n <ConnectedButtonGroupContext value={contextValue}>\n <AriaToggleButtonGroup\n className={(renderProps) =>\n clsx(\n styles[\"group\"],\n styles[size],\n typeof className === \"function\"\n ? className(renderProps)\n : className\n )\n }\n {...props}\n data-shape={shape}\n data-connected-button-group\n />\n </ConnectedButtonGroupContext>\n );\n};\n"],"mappings":";;;;;;;;;;;;GCOa,KAA6D,EACtE,UAAO,SACP,WAAQ,SACR,WAAQ,UACR,kBACA,cACA,GAAG,QAQC,kBAAC,GAAD;CAA6B,OANZ,SACV;EAAE;EAAM;EAAO;EAAO;CAAc,IAC3C;EAAC;EAAM;EAAO;EAAO;CAAa,CAIE;WAChC,kBAAC,GAAD;EACI,YAAY,MACR,EACI,EAAO,OACP,EAAO,IACP,OAAO,KAAc,aACf,EAAU,CAAW,IACrB,CACV;EAEJ,GAAI;EACJ,cAAY;EACZ,+BAAA;
|
|
1
|
+
{"version":3,"file":"ConnectedButtonGroup","names":[],"sources":["../../src/components/Button/ButtonGroups/ConnectedButtonGroup/connectedButtonGroup.module.css","../../src/components/Button/ButtonGroups/ConnectedButtonGroup/ConnectedButtonGroup.tsx"],"sourcesContent":["@layer adgytec.comps {\n .group {\n /* shape */\n --_shape-start-start: var(--_inner-shape);\n --_shape-end-start: var(--_inner-shape);\n --_shape-start-end: var(--_inner-shape);\n --_shape-end-end: var(--_inner-shape);\n\n display: inline-flex;\n align-items: center;\n gap: calc(2 * var(--dp, 1px));\n }\n\n .group > [data-pressed] {\n --_shape-start-start: var(--_pressed-shape);\n --_shape-end-start: var(--_pressed-shape);\n --_shape-start-end: var(--_pressed-shape);\n --_shape-end-end: var(--_pressed-shape);\n }\n\n .group > [data-connected-button]:first-child {\n --_shape-start-start: var(--_outer-shape);\n --_shape-end-start: var(--_outer-shape);\n }\n\n .group > [data-connected-button]:last-child {\n --_shape-start-end: var(--_outer-shape);\n --_shape-end-end: var(--_outer-shape);\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 --_md-button-padding-inline: var(--md-sys-layout-space-12);\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 --_outer-shape: var(--md-sys-shape-corner-radius-full);\n --_inner-shape: var(--md-sys-shape-corner-radius-small);\n --_pressed-shape: var(--md-sys-shape-corner-radius-extra-small);\n --_selected-shape: var(--md-sys-shape-corner-radius-full);\n\n &[data-shape=\"square\"] {\n --_outer-shape: var(--md-sys-shape-corner-radius-small);\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 --_md-button-padding-inline: var(--md-sys-layout-space-16);\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 --_outer-shape: var(--md-sys-shape-corner-radius-full);\n --_inner-shape: var(--md-sys-shape-corner-radius-small);\n --_pressed-shape: var(--md-sys-shape-corner-radius-extra-small);\n --_selected-shape: var(--md-sys-shape-corner-radius-full);\n\n &[data-shape=\"square\"] {\n --_outer-shape: var(--md-sys-shape-corner-radius-small);\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 --_md-button-padding-inline: var(--md-sys-layout-space-24);\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 --_outer-shape: var(--md-sys-shape-corner-radius-full);\n --_inner-shape: var(--md-sys-shape-corner-radius-small);\n --_pressed-shape: var(--md-sys-shape-corner-radius-extra-small);\n --_selected-shape: var(--md-sys-shape-corner-radius-full);\n\n &[data-shape=\"square\"] {\n --_outer-shape: var(--md-sys-shape-corner-radius-small);\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 --_md-button-padding-inline: var(--md-sys-layout-space-48);\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 --_outer-shape: var(--md-sys-shape-corner-radius-full);\n --_inner-shape: var(--md-sys-shape-corner-radius-large);\n --_pressed-shape: var(--md-sys-shape-corner-radius-medium);\n --_selected-shape: var(--md-sys-shape-corner-radius-full);\n\n &[data-shape=\"square\"] {\n --_outer-shape: var(--md-sys-shape-corner-radius-large);\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 --_md-button-padding-inline: var(--md-sys-layout-space-64);\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 --_outer-shape: var(--md-sys-shape-corner-radius-full);\n --_inner-shape: var(--md-sys-shape-corner-radius-large-increased);\n --_pressed-shape: var(--md-sys-shape-corner-radius-large);\n --_selected-shape: var(--md-sys-shape-corner-radius-full);\n\n &[data-shape=\"square\"] {\n --_outer-shape: var(--md-sys-shape-corner-radius-large-increased);\n }\n }\n}\n","import { clsx } from \"clsx\";\nimport { useMemo } from \"react\";\nimport { ToggleButtonGroup as AriaToggleButtonGroup } from \"react-aria-components\";\nimport { ConnectedButtonGroupContext } from \"../ButtonGroupContext\";\nimport styles from \"./connectedButtonGroup.module.css\";\nimport type { ConnectedButtonGroupProps } from \"./types\";\n\nexport const ConnectedButtonGroup: React.FC<ConnectedButtonGroupProps> = ({\n size = \"small\",\n shape = \"round\",\n color = \"filled\",\n iconPlacement,\n className,\n ...props\n}) => {\n const contextValue = useMemo(\n () => ({ size, shape, color, iconPlacement }),\n [size, shape, color, iconPlacement]\n );\n\n return (\n <ConnectedButtonGroupContext value={contextValue}>\n <AriaToggleButtonGroup\n className={(renderProps) =>\n clsx(\n styles[\"group\"],\n styles[size],\n typeof className === \"function\"\n ? className(renderProps)\n : className\n )\n }\n {...props}\n data-shape={shape}\n data-connected-button-group\n />\n </ConnectedButtonGroupContext>\n );\n};\n"],"mappings":";;;;;;;;;;;;GCOa,KAA6D,EACtE,UAAO,SACP,WAAQ,SACR,WAAQ,UACR,kBACA,cACA,GAAG,QAQC,kBAAC,GAAD;CAA6B,OANZ,SACV;EAAE;EAAM;EAAO;EAAO;CAAc,IAC3C;EAAC;EAAM;EAAO;EAAO;CAAa,CAIE;WAChC,kBAAC,GAAD;EACI,YAAY,MACR,EACI,EAAO,OACP,EAAO,IACP,OAAO,KAAc,aACf,EAAU,CAAW,IACrB,CACV;EAEJ,GAAI;EACJ,cAAY;EACZ,+BAAA;CAA2B,CAAA;AAEN,CAAA"}
|
package/dist/chunks/Dialog
CHANGED
|
@@ -1,15 +1,24 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import t from "
|
|
3
|
-
import
|
|
4
|
-
import {
|
|
5
|
-
import
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
1
|
+
import { t as e } from "./compiler-runtime";
|
|
2
|
+
import { DialogContext as t } from "../components/Dialog/core/index.js";
|
|
3
|
+
import n from "clsx";
|
|
4
|
+
import { jsx as r } from "react/jsx-runtime";
|
|
5
|
+
import { Dialog as i } from "react-aria-components";
|
|
6
|
+
import '../assets/Dialog.css';//#region src/components/Dialog/Dialog/dialog.module.css
|
|
7
|
+
var a = e(), o = { dialog: "_dialog_a2pbf_11" }, s = (e) => {
|
|
8
|
+
let s = (0, a.c)(8), c, l;
|
|
9
|
+
s[0] === e ? (c = s[1], l = s[2]) : ({className: c, ...l} = e, s[0] = e, s[1] = c, s[2] = l);
|
|
10
|
+
let u;
|
|
11
|
+
s[3] === c ? u = s[4] : (u = n(o.dialog, c), s[3] = c, s[4] = u);
|
|
12
|
+
let d;
|
|
13
|
+
return s[5] !== l || s[6] !== u ? (d = /* @__PURE__ */ r(t, {
|
|
14
|
+
value: !0,
|
|
15
|
+
children: /* @__PURE__ */ r(i, {
|
|
16
|
+
className: u,
|
|
17
|
+
...l
|
|
18
|
+
})
|
|
19
|
+
}), s[5] = l, s[6] = u, s[7] = d) : d = s[7], d;
|
|
20
|
+
};
|
|
12
21
|
//#endregion
|
|
13
|
-
export {
|
|
22
|
+
export { s as t };
|
|
14
23
|
|
|
15
24
|
//# sourceMappingURL=Dialog.map
|
package/dist/chunks/Dialog.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Dialog","names":[],"sources":["../../src/components/Dialog/Dialog/dialog.module.css","../../src/components/Dialog/Dialog/Dialog.tsx"],"sourcesContent":["/* configurable tokens\n*\n* --md-dialog-container-background\n* --md-dialog-headline-text-color\n* --md-dialog-icon-color\n* --md-dialog-body-text-color\n*\n* configurable tokens end */\n\n@layer adgytec.comps {\n .dialog {\n --md-divider-color: currentcolor;\n\n /* container */\n --_md-dialog-container-min-inline-size: calc(280 * var(--dp, 1px));\n --_md-dialog-container-max-inline-size: calc(560 * var(--dp, 1px));\n --_md-dialog-container-max-block-size: 90svb;\n\n --_md-dialog-container-background: var(\n --md-dialog-container-background,\n var(--md-sys-color-surface-container-high)\n );\n --_md-dialog-container-shape: var(\n --md-sys-shape-corner-radius-extra-large\n );\n --_md-dialog-container-elevation: var(--md-sys-elevation-shadow-3);\n --_md-dialog-container-padding: var(--md-sys-layout-space-24);\n\n /* color */\n --_md-dialog-headline-text-color: var(\n --md-dialog-headline-text-color,\n var(--md-sys-color-on-surface)\n );\n --_md-dialog-icon-color: var(\n --md-dialog-icon-color,\n var(--md-sys-color-secondary)\n );\n --_md-dialog-body-text-color: var(\n --md-dialog-body-text-color,\n var(--md-sys-color-on-surface-variant)\n );\n\n /* spacing */\n --_md-dialog-action-gap: var(--md-sys-layout-space-8);\n --_md-dialog-title-body-gap: var(--md-sys-layout-space-16);\n --_md-dialog-title-icon-gap: var(--md-sys-layout-space-16);\n --_md-dialog-body-action-gap: var(--md-sys-layout-space-24);\n\n /* styles */\n padding: var(--_md-dialog-container-padding);\n border-radius: var(--_md-dialog-container-shape);\n\n background-color: var(--_md-dialog-container-background);\n color: var(--_md-dialog-body-text-color);\n box-shadow: var(--_md-dialog-container-elevation);\n\n min-inline-size: min(\n 100svi,\n var(--_md-dialog-container-min-inline-size)\n );\n max-inline-size: var(--_md-dialog-container-max-inline-size);\n max-block-size: var(--_md-dialog-container-max-block-size);\n }\n}\n","import clsx from \"clsx\";\nimport { Dialog as AriaDialog } from \"react-aria-components\";\nimport { DialogContext } from \"../core\";\nimport styles from \"./dialog.module.css\";\n\nexport const Dialog: React.FC<\n React.ComponentPropsWithRef<typeof AriaDialog>\n> = ({ className, ...props }) => {\n return (\n <DialogContext value={true}>\n <AriaDialog\n className={clsx(styles[\"dialog\"], className)}\n {...props}\n />\n </DialogContext>\n );\n};\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"Dialog","names":[],"sources":["../../src/components/Dialog/Dialog/dialog.module.css","../../src/components/Dialog/Dialog/Dialog.tsx"],"sourcesContent":["/* configurable tokens\n*\n* --md-dialog-container-background\n* --md-dialog-headline-text-color\n* --md-dialog-icon-color\n* --md-dialog-body-text-color\n*\n* configurable tokens end */\n\n@layer adgytec.comps {\n .dialog {\n --md-divider-color: currentcolor;\n\n /* container */\n --_md-dialog-container-min-inline-size: calc(280 * var(--dp, 1px));\n --_md-dialog-container-max-inline-size: calc(560 * var(--dp, 1px));\n --_md-dialog-container-max-block-size: 90svb;\n\n --_md-dialog-container-background: var(\n --md-dialog-container-background,\n var(--md-sys-color-surface-container-high)\n );\n --_md-dialog-container-shape: var(\n --md-sys-shape-corner-radius-extra-large\n );\n --_md-dialog-container-elevation: var(--md-sys-elevation-shadow-3);\n --_md-dialog-container-padding: var(--md-sys-layout-space-24);\n\n /* color */\n --_md-dialog-headline-text-color: var(\n --md-dialog-headline-text-color,\n var(--md-sys-color-on-surface)\n );\n --_md-dialog-icon-color: var(\n --md-dialog-icon-color,\n var(--md-sys-color-secondary)\n );\n --_md-dialog-body-text-color: var(\n --md-dialog-body-text-color,\n var(--md-sys-color-on-surface-variant)\n );\n\n /* spacing */\n --_md-dialog-action-gap: var(--md-sys-layout-space-8);\n --_md-dialog-title-body-gap: var(--md-sys-layout-space-16);\n --_md-dialog-title-icon-gap: var(--md-sys-layout-space-16);\n --_md-dialog-body-action-gap: var(--md-sys-layout-space-24);\n\n /* styles */\n padding: var(--_md-dialog-container-padding);\n border-radius: var(--_md-dialog-container-shape);\n\n background-color: var(--_md-dialog-container-background);\n color: var(--_md-dialog-body-text-color);\n box-shadow: var(--_md-dialog-container-elevation);\n\n min-inline-size: min(\n 100svi,\n var(--_md-dialog-container-min-inline-size)\n );\n max-inline-size: var(--_md-dialog-container-max-inline-size);\n max-block-size: var(--_md-dialog-container-max-block-size);\n }\n}\n","import clsx from \"clsx\";\nimport { Dialog as AriaDialog } from \"react-aria-components\";\nimport { DialogContext } from \"../core\";\nimport styles from \"./dialog.module.css\";\n\nexport const Dialog: React.FC<\n React.ComponentPropsWithRef<typeof AriaDialog>\n> = ({ className, ...props }) => {\n return (\n <DialogContext value={true}>\n <AriaDialog\n className={clsx(styles[\"dialog\"], className)}\n {...props}\n />\n </DialogContext>\n );\n};\n"],"mappings":";;;;;;iDCKa,KAET,MAAA;CAAA,IAAA,KAAA,GAAA,EAAA,EAAA,CAAA,CAAA,GAAA,GAAA;CAAA,AAAA,EAAA,OAAA,KAAwB,IAAA,EAAA,IAAA,IAAA,EAAA,OAAvB,kBAAA,KAAA,GAAuB,EAAA,KAAA,GAAA,EAAA,KAAA,GAAA,EAAA,KAAA;CAAA,IAAA;CAAA,AAAA,EAAA,OAAA,IAIgC,IAAA,EAAA,MAAjC,IAAA,EAAK,EAAM,QAAY,CAAS,GAAC,EAAA,KAAA,GAAA,EAAA,KAAA;CAAA,IAAA;CAGpC,OAHoC,EAAA,OAAA,KAAA,EAAA,OAAA,KAFpD,IAAA,kBAAC,GAAD;EAAsB,OAAA;YAClB,kBAAC,GAAD;GACe,WAAA;GAAiC,GACxC;EAAK,CAAA;CAHH,CAAA,GAKE,EAAA,KAAA,GAAA,EAAA,KAAA,GAAA,EAAA,KAAA,KAAA,IAAA,EAAA,IALhB;AAKgB"}
|