@adgytec/adgytec-web-ui-components 2.1.7 → 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/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/package.json +4 -4
package/dist/chunks/Input.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Input","names":[],"sources":["../../src/components/Input/Checkbox/checkbox.module.css","../../src/components/Input/Checkbox/context.ts","../../src/components/Input/Checkbox/Checkbox.tsx","../../src/components/Input/Checkbox/CheckboxGroup.tsx"],"sourcesContent":["/* configurable tokens\n*\n* --md-checkbox-outline-color\n* --md-checkbox-container-color\n*\n* --md-checkbox-interaction-outline-color\n*\n* --md-checkbox-icon-color\n*\n* --md-checkbox-state-layer-color\n* --md-checkbox-selected-state-layer-color\n*\n* configurable tokens end */\n\n@layer adgytec.comps {\n .checkbox-group {\n display: grid;\n gap: var(--md-sys-layout-space-16);\n\n &[data-disabled] {\n color: rgb(\n from currentcolor r g b /\n var(--md-sys-state-disabled-content)\n );\n cursor: default;\n }\n }\n\n .checkbox-items {\n display: grid;\n }\n\n .checkbox {\n /* configurable tokens */\n --_md-checkbox-outline-color: var(\n --md-checkbox-outline-color,\n var(--md-sys-color-on-surface-variant)\n );\n --_md-checkbox-container-color: var(\n --md-checkbox-container-color,\n var(--md-sys-color-primary)\n );\n\n --_md-checkbox-interaction-outline-color: var(\n --md-checkbox-interaction-outline-color,\n var(--md-sys-color-on-surface)\n );\n\n --_md-checkbox-icon-color: var(\n --md-checkbox-icon-color,\n var(--md-sys-color-on-primary)\n );\n\n --_md-checkbox-state-layer-color: var(\n --md-checkbox-state-layer-color,\n var(--md-sys-color-on-surface)\n );\n --_md-checkbox-selected-state-layer-color: var(\n --md-checkbox-selected-state-layer-color,\n var(--_md-checkbox-container-color)\n );\n\n /* configurable tokens end */\n\n /* invalid tokens */\n --_md-checkbox-invalid-outline-color: var(--md-sys-color-error);\n --_md-checkbox-invalid-container-color: var(--md-sys-color-error);\n --_md-checkbox-invalid-icon-color: var(--md-sys-color-on-error);\n\n --_md-checkbox-invalid-state-layer-color: var(\n --_md-checkbox-invalid-container-color\n );\n\n /* checkbox tokens */\n --_md-checkbox-outline-width: var(--md-sys-shape-border-width-thick);\n --_md-checkbox-container-shape: calc(2 * var(--dp, 1px));\n --_md-checkbox-container-size: calc(18 * var(--dp, 1px));\n\n /* state layer tokens */\n --_md-checkbox-state-layer-size: var(--md-sys-layout-space-40);\n --_md-checkbox-state-layer-shape: var(\n --md-sys-shape-corner-radius-full\n );\n\n --_md-checkbox-pressed-state-layer-color: var(\n --_md-checkbox-selected-state-layer-color\n );\n --_md-checkbox-pressed-selected-state-layer-color: var(\n --_md-checkbox-state-layer-color\n );\n\n --_state-layer-opacity: 0;\n --_state-color: var(--_md-checkbox-state-layer-color);\n\n --_state-layer-color: rgb(\n from var(--_state-color) r g b /\n var(--_state-layer-opacity)\n );\n\n /* styles */\n position: relative;\n\n display: flex;\n gap: var(--md-sys-layout-space-16);\n align-items: center;\n\n color: inherit;\n cursor: pointer;\n\n & * {\n cursor: inherit;\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 &[data-indeterminate] {\n --_state-color: var(--_md-checkbox-selected-state-layer-color);\n }\n &[data-selected] {\n --_state-color: var(--_md-checkbox-selected-state-layer-color);\n }\n\n &[data-pressed] {\n --_state-layer-opacity: var(--md-sys-state-pressed);\n --_state-color: var(--_md-checkbox-pressed-state-layer-color);\n\n &[data-indeterminate] {\n --_state-color: var(\n --_md-checkbox-pressed-selected-state-layer-color\n );\n }\n &[data-selected] {\n --_state-color: var(\n --_md-checkbox-pressed-selected-state-layer-color\n );\n }\n }\n\n &[data-invalid] {\n --_state-color: var(--_md-checkbox-invalid-state-layer-color);\n\n &[data-indeterminate] {\n --_state-color: var(--_md-checkbox-invalid-state-layer-color);\n }\n &[data-selected] {\n --_state-color: var(--_md-checkbox-invalid-state-layer-color);\n }\n }\n\n &[data-hovered] {\n --_state-layer-opacity: var(--md-sys-state-hover);\n z-index: 1;\n }\n\n &[data-focus-visible] {\n --_state-layer-opacity: var(--md-sys-state-focus);\n z-index: 1;\n }\n }\n\n .state-layer::before {\n content: \"\";\n\n position: absolute;\n inset: calc(-1 * var(--md-sys-layout-space-12));\n\n background-color: var(--_state-layer-color);\n border-radius: var(--md-sys-shape-corner-radius-extra-small);\n\n pointer-events: none;\n\n transition: background-color\n var(--md-sys-motion-expressive-fast-effects)\n var(--md-sys-motion-expressive-fast-effects-duration);\n\n @media (prefers-reduced-motion) {\n transition: none;\n }\n }\n\n .indicator {\n --_outline-color: var(--_md-checkbox-outline-color);\n --_background: transparent;\n --_icon-color: var(--_md-checkbox-icon-color);\n\n position: relative;\n\n inline-size: var(--_md-checkbox-container-size);\n aspect-ratio: 1;\n border-radius: var(--_md-checkbox-container-shape);\n\n background-color: var(--_background);\n border: var(--_md-checkbox-outline-width) solid var(--_outline-color);\n\n transition:\n background-color var(--md-sys-motion-expressive-default-effects)\n var(--md-sys-motion-expressive-default-effects-duration),\n border-color var(--md-sys-motion-expressive-default-effects)\n var(--md-sys-motion-expressive-default-effects-duration);\n\n @media (prefers-reduced-motion) {\n transition: none;\n }\n\n &[data-filled] {\n --_outline-color: transparent;\n --_background: var(--_md-checkbox-container-color);\n }\n\n &[data-invalid] {\n --_outline-color: var(--_md-checkbox-invalid-outline-color);\n --_icon-color: var(--_md-checkbox-invalid-icon-color);\n --_background: transparent;\n\n &[data-filled] {\n --_outline-color: transparent;\n --_background: var(--_md-checkbox-invalid-container-color);\n }\n }\n\n &[data-pressed],\n &[data-hovered],\n &[data-focus-visible] {\n --_outline-color: var(--_md-checkbox-interaction-outline-color);\n\n &[data-invalid] {\n --_outline-color: var(--_md-checkbox-invalid-outline-color);\n }\n\n &[data-filled] {\n --_outline-color: transparent;\n }\n }\n\n &[data-disabled] {\n --_icon-color: var(--md-sys-color-surface);\n --_outline-color: rgb(\n from var(--md-sys-color-on-surface) r g b /\n var(--md-sys-state-disabled-content)\n );\n --_background: transparent;\n\n &[data-filled] {\n --_outline-color: transparent;\n --_background: rgb(\n from var(--md-sys-color-on-surface) r g b /\n var(--md-sys-state-disabled-content)\n );\n }\n }\n }\n\n /* state layer */\n .indicator[data-show-state-layer]::before {\n content: \"\";\n\n position: absolute;\n inset-inline-start: 50%;\n inset-block-start: 50%;\n transform: translate(-50%, -50%);\n\n inline-size: var(--_md-checkbox-state-layer-size);\n aspect-ratio: 1 / 1;\n border-radius: var(--_md-checkbox-state-layer-shape);\n\n background-color: var(--_state-layer-color);\n\n transition: background-color\n var(--md-sys-motion-expressive-default-effects)\n var(--md-sys-motion-expressive-default-effects-duration);\n\n @media (prefers-reduced-motion) {\n transition: none;\n }\n }\n\n .indicator[data-focus-visible] {\n --focus-indicator-thickness: calc(3 * var(--dp, 1px));\n --focus-indicator-offset: calc(2 * var(--dp, 1px));\n --focus-indicator-color: var(--md-sys-color-secondary);\n\n outline-width: var(--focus-indicator-thickness);\n outline-style: solid;\n outline-offset: var(--focus-indicator-offset);\n outline-color: var(--focus-indicator-color);\n }\n\n /* https://react-aria.adobe.com/Checkbox */\n /* ref this for check animation */\n .svg {\n position: absolute;\n inset-block-start: 50%;\n inset-inline-start: 50%;\n transform: translate(-50%, -50%);\n\n width: calc(12 * var(--dp, 1px));\n aspect-ratio: 1 / 1;\n fill: none;\n\n stroke: var(--_icon-color);\n\n stroke-width: calc(3 * var(--dp, 1px));\n stroke-dasharray: calc(22 * var(--dp, 1px));\n stroke-dashoffset: 66;\n stroke-linecap: round;\n stroke-linejoin: round;\n\n transition: stroke-dashoffset\n var(--md-sys-motion-expressive-default-effects)\n var(--md-sys-motion-expressive-default-effects-duration);\n\n @media (prefers-reduced-motion) {\n transition: none;\n }\n\n &[data-selected] {\n stroke-dashoffset: 44;\n }\n\n &[data-indeterminate] {\n stroke: none;\n fill: var(--_icon-color);\n }\n }\n}\n","import { createContext } from \"react\";\nimport type { CheckboxLabelPlacement } from \"./types\";\n\nexport type CheckboxGroupContextValue = {\n labelPlacement?: CheckboxLabelPlacement;\n containerStateLayer?: boolean;\n};\n\nexport const CheckboxGroupContext = createContext<CheckboxGroupContextValue>(\n {}\n);\n","import clsx from \"clsx\";\nimport { useContext } from \"react\";\nimport { Checkbox as AriaCheckbox } from \"react-aria-components\";\nimport { typography } from \"@/utils\";\nimport { TapTarget } from \"@/utils/tapTarget\";\nimport styles from \"./checkbox.module.css\";\nimport { CheckboxGroupContext } from \"./context\";\nimport type { CheckboxProps } from \"./types\";\n\nexport const Checkbox: React.FC<CheckboxProps> = ({\n children,\n className,\n labelPlacement,\n containerStateLayer,\n ...props\n}) => {\n const {\n labelPlacement: groupLabelPlacement,\n containerStateLayer: groupContainerStateLayer,\n } = useContext(CheckboxGroupContext);\n const placement = labelPlacement ?? groupLabelPlacement ?? \"end\";\n const stateLayer = containerStateLayer ?? groupContainerStateLayer ?? false;\n\n return (\n <AriaCheckbox\n className={(renderProps) =>\n clsx(\n styles[\"checkbox\"],\n stateLayer && styles[\"state-layer\"],\n typography.labelLarge,\n typeof className === \"function\"\n ? className(renderProps)\n : className\n )\n }\n {...props}\n data-checkbox\n >\n {(renderProps) => {\n const {\n isSelected,\n isHovered,\n isDisabled,\n isFocused,\n isFocusVisible,\n isPressed,\n isInvalid,\n isIndeterminate,\n } = renderProps;\n\n const dataAttrs = {\n \"data-selected\": isSelected || undefined,\n \"data-hovered\": isHovered || undefined,\n \"data-disabled\": isDisabled || undefined,\n \"data-focused\": isFocused || undefined,\n \"data-focus-visible\": isFocusVisible || undefined,\n \"data-pressed\": isPressed || undefined,\n \"data-invalid\": isInvalid || undefined,\n \"data-indeterminate\": isIndeterminate || undefined,\n \"data-show-state-layer\": !stateLayer || undefined,\n \"data-filled\": isSelected || isIndeterminate || undefined,\n };\n\n const label =\n typeof children === \"function\"\n ? children(renderProps)\n : children;\n return (\n <>\n {placement === \"start\" && label}\n\n <span\n className={clsx(styles[\"indicator\"], TapTarget)}\n {...dataAttrs}\n >\n <svg\n viewBox=\"0 0 18 18\"\n aria-hidden=\"true\"\n key={\n isIndeterminate ? \"indeterminate\" : \"check\"\n }\n className={styles[\"svg\"]}\n {...dataAttrs}\n >\n {isIndeterminate ? (\n <rect x={1} y={7.5} width={16} height={3} />\n ) : (\n <polyline points=\"2 9 7 14 16 4\" />\n )}\n </svg>\n </span>\n\n {placement === \"end\" && label}\n </>\n );\n }}\n </AriaCheckbox>\n );\n};\n","import clsx from \"clsx\";\nimport { CheckboxGroup as AriaCheckboxGroup } from \"react-aria-components\";\nimport { Description } from \"../Description\";\nimport { FieldError } from \"../FieldError\";\nimport { Label } from \"../Label\";\nimport styles from \"./checkbox.module.css\";\nimport { CheckboxGroupContext } from \"./context\";\nimport type { CheckboxGroupProps } from \"./types\";\n\nexport const CheckboxGroup: React.FC<CheckboxGroupProps> = ({\n label,\n description,\n errorMessage,\n children,\n className,\n checkboxItemsGap = 24,\n labelPlacement,\n containerStateLayer,\n showDescriptionOnInvalid = false,\n ...props\n}) => {\n return (\n <CheckboxGroupContext value={{ labelPlacement, containerStateLayer }}>\n <AriaCheckboxGroup\n className={(renderProps) =>\n clsx(\n styles[\"checkbox-group\"],\n typeof className === \"function\"\n ? className(renderProps)\n : className\n )\n }\n {...props}\n >\n {({ isInvalid }) => {\n const showDescription =\n description &&\n (!isInvalid || (isInvalid && showDescriptionOnInvalid));\n\n return (\n <>\n {label && <Label>{label}</Label>}\n\n <div\n className={clsx(styles[\"checkbox-items\"])}\n style={{\n gap: `calc(${checkboxItemsGap} * var(--dp, 1px))`,\n }}\n >\n {children}\n </div>\n\n {showDescription && (\n <Description>{description}</Description>\n )}\n <FieldError>{errorMessage}</FieldError>\n </>\n );\n }}\n </AriaCheckboxGroup>\n </CheckboxGroupContext>\n );\n};\n"],"mappings":";;;;;;;;;;;;;;;;GCQa,IAAuB,EAChC,CAAC,CACL,GCDa,KAAqC,EAC9C,aACA,cACA,mBACA,wBACA,GAAG,QACD;CACF,IAAM,EACF,gBAAgB,GAChB,qBAAqB,MACrB,EAAW,CAAoB,GAC7B,IAAY,KAAkB,KAAuB,OACrD,IAAa,KAAuB,KAA4B;CAEtE,OACI,kBAAC,GAAD;EACI,YAAY,MACR,EACI,EAAO,UACP,KAAc,EAAO,gBACrB,EAAW,YACX,OAAO,KAAc,aACf,EAAU,CAAW,IACrB,CACV;EAEJ,GAAI;EACJ,iBAAA;aAEE,MAAgB;GACd,IAAM,EACF,eACA,cACA,eACA,cACA,mBACA,cACA,cACA,uBACA,GAEE,IAAY;IACd,iBAAiB,KAAc,KAAA;IAC/B,gBAAgB,KAAa,KAAA;IAC7B,iBAAiB,KAAc,KAAA;IAC/B,gBAAgB,KAAa,KAAA;IAC7B,sBAAsB,KAAkB,KAAA;IACxC,gBAAgB,KAAa,KAAA;IAC7B,gBAAgB,KAAa,KAAA;IAC7B,sBAAsB,KAAmB,KAAA;IACzC,yBAAyB,CAAC,KAAc,KAAA;IACxC,eAAe,KAAc,KAAmB,KAAA;GACpD,GAEM,IACF,OAAO,KAAa,aACd,EAAS,CAAW,IACpB;GACV,OACI,kBAAA,GAAA,EAAA,UAAA;IACK,MAAc,WAAW;IAE1B,kBAAC,QAAD;KACI,WAAW,EAAK,EAAO,WAAc,CAAS;KAC9C,GAAI;eAEJ,kBAAC,OAAD;MACI,SAAQ;MACR,eAAY;MAIZ,WAAW,EAAO;MAClB,GAAI;gBAEH,IACG,kBAAC,QAAD;OAAM,GAAG;OAAG,GAAG;OAAK,OAAO;OAAI,QAAQ;MAAI,CAAA,IAE3C,kBAAC,YAAD,EAAU,QAAO,gBAAiB,CAAA;KAErC,GAVG,IAAkB,kBAAkB,OAUvC;IACH,CAAA;IAEL,MAAc,SAAS;GAC1B,EAAA,CAAA;EAEV;CACU,CAAA;AAEtB,GCzFa,KAA+C,EACxD,UACA,gBACA,iBACA,aACA,cACA,sBAAmB,IACnB,mBACA,wBACA,8BAA2B,IAC3B,GAAG,QAGC,kBAAC,GAAD;CAAsB,OAAO;EAAE;EAAgB;CAAoB;WAC/D,kBAAC,GAAD;EACI,YAAY,MACR,EACI,EAAO,mBACP,OAAO,KAAc,aACf,EAAU,CAAW,IACrB,CACV;EAEJ,GAAI;aAEF,EAAE,mBAAgB;GAChB,IAAM,IACF,MACC,CAAC,KAAc,KAAa;GAEjC,OACI,kBAAA,GAAA,EAAA,UAAA;IACK,KAAS,kBAAC,GAAD,EAAA,UAAQ,EAAa,CAAA;IAE/B,kBAAC,OAAD;KACI,WAAW,EAAK,EAAO,iBAAiB;KACxC,OAAO,EACH,KAAK,QAAQ,EAAiB,oBAClC;KAEC;IACA,CAAA;IAEJ,KACG,kBAAC,GAAD,EAAA,UAAc,EAAyB,CAAA;IAE3C,kBAAC,GAAD,EAAA,UAAa,EAAyB,CAAA;GACxC,EAAA,CAAA;EAEV;CACe,CAAA;AACD,CAAA"}
|
|
1
|
+
{"version":3,"file":"Input","names":["renderProps"],"sources":["../../src/components/Input/Checkbox/checkbox.module.css","../../src/components/Input/Checkbox/context.ts","../../src/components/Input/Checkbox/Checkbox.tsx","../../src/components/Input/Checkbox/CheckboxGroup.tsx"],"sourcesContent":["/* configurable tokens\n*\n* --md-checkbox-outline-color\n* --md-checkbox-container-color\n*\n* --md-checkbox-interaction-outline-color\n*\n* --md-checkbox-icon-color\n*\n* --md-checkbox-state-layer-color\n* --md-checkbox-selected-state-layer-color\n*\n* configurable tokens end */\n\n@layer adgytec.comps {\n .checkbox-group {\n display: grid;\n gap: var(--md-sys-layout-space-16);\n\n &[data-disabled] {\n color: rgb(\n from currentcolor r g b /\n var(--md-sys-state-disabled-content)\n );\n cursor: default;\n }\n }\n\n .checkbox-items {\n display: grid;\n }\n\n .checkbox {\n /* configurable tokens */\n --_md-checkbox-outline-color: var(\n --md-checkbox-outline-color,\n var(--md-sys-color-on-surface-variant)\n );\n --_md-checkbox-container-color: var(\n --md-checkbox-container-color,\n var(--md-sys-color-primary)\n );\n\n --_md-checkbox-interaction-outline-color: var(\n --md-checkbox-interaction-outline-color,\n var(--md-sys-color-on-surface)\n );\n\n --_md-checkbox-icon-color: var(\n --md-checkbox-icon-color,\n var(--md-sys-color-on-primary)\n );\n\n --_md-checkbox-state-layer-color: var(\n --md-checkbox-state-layer-color,\n var(--md-sys-color-on-surface)\n );\n --_md-checkbox-selected-state-layer-color: var(\n --md-checkbox-selected-state-layer-color,\n var(--_md-checkbox-container-color)\n );\n\n /* configurable tokens end */\n\n /* invalid tokens */\n --_md-checkbox-invalid-outline-color: var(--md-sys-color-error);\n --_md-checkbox-invalid-container-color: var(--md-sys-color-error);\n --_md-checkbox-invalid-icon-color: var(--md-sys-color-on-error);\n\n --_md-checkbox-invalid-state-layer-color: var(\n --_md-checkbox-invalid-container-color\n );\n\n /* checkbox tokens */\n --_md-checkbox-outline-width: var(--md-sys-shape-border-width-thick);\n --_md-checkbox-container-shape: calc(2 * var(--dp, 1px));\n --_md-checkbox-container-size: calc(18 * var(--dp, 1px));\n\n /* state layer tokens */\n --_md-checkbox-state-layer-size: var(--md-sys-layout-space-40);\n --_md-checkbox-state-layer-shape: var(\n --md-sys-shape-corner-radius-full\n );\n\n --_md-checkbox-pressed-state-layer-color: var(\n --_md-checkbox-selected-state-layer-color\n );\n --_md-checkbox-pressed-selected-state-layer-color: var(\n --_md-checkbox-state-layer-color\n );\n\n --_state-layer-opacity: 0;\n --_state-color: var(--_md-checkbox-state-layer-color);\n\n --_state-layer-color: rgb(\n from var(--_state-color) r g b /\n var(--_state-layer-opacity)\n );\n\n /* styles */\n position: relative;\n\n display: flex;\n gap: var(--md-sys-layout-space-16);\n align-items: center;\n\n color: inherit;\n cursor: pointer;\n\n & * {\n cursor: inherit;\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 &[data-indeterminate] {\n --_state-color: var(--_md-checkbox-selected-state-layer-color);\n }\n &[data-selected] {\n --_state-color: var(--_md-checkbox-selected-state-layer-color);\n }\n\n &[data-pressed] {\n --_state-layer-opacity: var(--md-sys-state-pressed);\n --_state-color: var(--_md-checkbox-pressed-state-layer-color);\n\n &[data-indeterminate] {\n --_state-color: var(\n --_md-checkbox-pressed-selected-state-layer-color\n );\n }\n &[data-selected] {\n --_state-color: var(\n --_md-checkbox-pressed-selected-state-layer-color\n );\n }\n }\n\n &[data-invalid] {\n --_state-color: var(--_md-checkbox-invalid-state-layer-color);\n\n &[data-indeterminate] {\n --_state-color: var(--_md-checkbox-invalid-state-layer-color);\n }\n &[data-selected] {\n --_state-color: var(--_md-checkbox-invalid-state-layer-color);\n }\n }\n\n &[data-hovered] {\n --_state-layer-opacity: var(--md-sys-state-hover);\n z-index: 1;\n }\n\n &[data-focus-visible] {\n --_state-layer-opacity: var(--md-sys-state-focus);\n z-index: 1;\n }\n }\n\n .state-layer::before {\n content: \"\";\n\n position: absolute;\n inset: calc(-1 * var(--md-sys-layout-space-12));\n\n background-color: var(--_state-layer-color);\n border-radius: var(--md-sys-shape-corner-radius-extra-small);\n\n pointer-events: none;\n\n transition: background-color\n var(--md-sys-motion-expressive-fast-effects)\n var(--md-sys-motion-expressive-fast-effects-duration);\n\n @media (prefers-reduced-motion) {\n transition: none;\n }\n }\n\n .indicator {\n --_outline-color: var(--_md-checkbox-outline-color);\n --_background: transparent;\n --_icon-color: var(--_md-checkbox-icon-color);\n\n position: relative;\n\n inline-size: var(--_md-checkbox-container-size);\n aspect-ratio: 1;\n border-radius: var(--_md-checkbox-container-shape);\n\n background-color: var(--_background);\n border: var(--_md-checkbox-outline-width) solid var(--_outline-color);\n\n transition:\n background-color var(--md-sys-motion-expressive-default-effects)\n var(--md-sys-motion-expressive-default-effects-duration),\n border-color var(--md-sys-motion-expressive-default-effects)\n var(--md-sys-motion-expressive-default-effects-duration);\n\n @media (prefers-reduced-motion) {\n transition: none;\n }\n\n &[data-filled] {\n --_outline-color: transparent;\n --_background: var(--_md-checkbox-container-color);\n }\n\n &[data-invalid] {\n --_outline-color: var(--_md-checkbox-invalid-outline-color);\n --_icon-color: var(--_md-checkbox-invalid-icon-color);\n --_background: transparent;\n\n &[data-filled] {\n --_outline-color: transparent;\n --_background: var(--_md-checkbox-invalid-container-color);\n }\n }\n\n &[data-pressed],\n &[data-hovered],\n &[data-focus-visible] {\n --_outline-color: var(--_md-checkbox-interaction-outline-color);\n\n &[data-invalid] {\n --_outline-color: var(--_md-checkbox-invalid-outline-color);\n }\n\n &[data-filled] {\n --_outline-color: transparent;\n }\n }\n\n &[data-disabled] {\n --_icon-color: var(--md-sys-color-surface);\n --_outline-color: rgb(\n from var(--md-sys-color-on-surface) r g b /\n var(--md-sys-state-disabled-content)\n );\n --_background: transparent;\n\n &[data-filled] {\n --_outline-color: transparent;\n --_background: rgb(\n from var(--md-sys-color-on-surface) r g b /\n var(--md-sys-state-disabled-content)\n );\n }\n }\n }\n\n /* state layer */\n .indicator[data-show-state-layer]::before {\n content: \"\";\n\n position: absolute;\n inset-inline-start: 50%;\n inset-block-start: 50%;\n transform: translate(-50%, -50%);\n\n inline-size: var(--_md-checkbox-state-layer-size);\n aspect-ratio: 1 / 1;\n border-radius: var(--_md-checkbox-state-layer-shape);\n\n background-color: var(--_state-layer-color);\n\n transition: background-color\n var(--md-sys-motion-expressive-default-effects)\n var(--md-sys-motion-expressive-default-effects-duration);\n\n @media (prefers-reduced-motion) {\n transition: none;\n }\n }\n\n .indicator[data-focus-visible] {\n --focus-indicator-thickness: calc(3 * var(--dp, 1px));\n --focus-indicator-offset: calc(2 * var(--dp, 1px));\n --focus-indicator-color: var(--md-sys-color-secondary);\n\n outline-width: var(--focus-indicator-thickness);\n outline-style: solid;\n outline-offset: var(--focus-indicator-offset);\n outline-color: var(--focus-indicator-color);\n }\n\n /* https://react-aria.adobe.com/Checkbox */\n /* ref this for check animation */\n .svg {\n position: absolute;\n inset-block-start: 50%;\n inset-inline-start: 50%;\n transform: translate(-50%, -50%);\n\n width: calc(12 * var(--dp, 1px));\n aspect-ratio: 1 / 1;\n fill: none;\n\n stroke: var(--_icon-color);\n\n stroke-width: calc(3 * var(--dp, 1px));\n stroke-dasharray: calc(22 * var(--dp, 1px));\n stroke-dashoffset: 66;\n stroke-linecap: round;\n stroke-linejoin: round;\n\n transition: stroke-dashoffset\n var(--md-sys-motion-expressive-default-effects)\n var(--md-sys-motion-expressive-default-effects-duration);\n\n @media (prefers-reduced-motion) {\n transition: none;\n }\n\n &[data-selected] {\n stroke-dashoffset: 44;\n }\n\n &[data-indeterminate] {\n stroke: none;\n fill: var(--_icon-color);\n }\n }\n}\n","import { createContext } from \"react\";\nimport type { CheckboxLabelPlacement } from \"./types\";\n\nexport type CheckboxGroupContextValue = {\n labelPlacement?: CheckboxLabelPlacement;\n containerStateLayer?: boolean;\n};\n\nexport const CheckboxGroupContext = createContext<CheckboxGroupContextValue>(\n {}\n);\n","import clsx from \"clsx\";\nimport { useContext } from \"react\";\nimport { Checkbox as AriaCheckbox } from \"react-aria-components\";\nimport { typography } from \"@/utils\";\nimport { TapTarget } from \"@/utils/tapTarget\";\nimport styles from \"./checkbox.module.css\";\nimport { CheckboxGroupContext } from \"./context\";\nimport type { CheckboxProps } from \"./types\";\n\nexport const Checkbox: React.FC<CheckboxProps> = ({\n children,\n className,\n labelPlacement,\n containerStateLayer,\n ...props\n}) => {\n const {\n labelPlacement: groupLabelPlacement,\n containerStateLayer: groupContainerStateLayer,\n } = useContext(CheckboxGroupContext);\n const placement = labelPlacement ?? groupLabelPlacement ?? \"end\";\n const stateLayer = containerStateLayer ?? groupContainerStateLayer ?? false;\n\n return (\n <AriaCheckbox\n className={(renderProps) =>\n clsx(\n styles[\"checkbox\"],\n stateLayer && styles[\"state-layer\"],\n typography.labelLarge,\n typeof className === \"function\"\n ? className(renderProps)\n : className\n )\n }\n {...props}\n data-checkbox\n >\n {(renderProps) => {\n const {\n isSelected,\n isHovered,\n isDisabled,\n isFocused,\n isFocusVisible,\n isPressed,\n isInvalid,\n isIndeterminate,\n } = renderProps;\n\n const dataAttrs = {\n \"data-selected\": isSelected || undefined,\n \"data-hovered\": isHovered || undefined,\n \"data-disabled\": isDisabled || undefined,\n \"data-focused\": isFocused || undefined,\n \"data-focus-visible\": isFocusVisible || undefined,\n \"data-pressed\": isPressed || undefined,\n \"data-invalid\": isInvalid || undefined,\n \"data-indeterminate\": isIndeterminate || undefined,\n \"data-show-state-layer\": !stateLayer || undefined,\n \"data-filled\": isSelected || isIndeterminate || undefined,\n };\n\n const label =\n typeof children === \"function\"\n ? children(renderProps)\n : children;\n return (\n <>\n {placement === \"start\" && label}\n\n <span\n className={clsx(styles[\"indicator\"], TapTarget)}\n {...dataAttrs}\n >\n <svg\n viewBox=\"0 0 18 18\"\n aria-hidden=\"true\"\n key={\n isIndeterminate ? \"indeterminate\" : \"check\"\n }\n className={styles[\"svg\"]}\n {...dataAttrs}\n >\n {isIndeterminate ? (\n <rect x={1} y={7.5} width={16} height={3} />\n ) : (\n <polyline points=\"2 9 7 14 16 4\" />\n )}\n </svg>\n </span>\n\n {placement === \"end\" && label}\n </>\n );\n }}\n </AriaCheckbox>\n );\n};\n","import clsx from \"clsx\";\nimport { CheckboxGroup as AriaCheckboxGroup } from \"react-aria-components\";\nimport { Description } from \"../Description\";\nimport { FieldError } from \"../FieldError\";\nimport { Label } from \"../Label\";\nimport styles from \"./checkbox.module.css\";\nimport { CheckboxGroupContext } from \"./context\";\nimport type { CheckboxGroupProps } from \"./types\";\n\nexport const CheckboxGroup: React.FC<CheckboxGroupProps> = ({\n label,\n description,\n errorMessage,\n children,\n className,\n checkboxItemsGap = 24,\n labelPlacement,\n containerStateLayer,\n showDescriptionOnInvalid = false,\n ...props\n}) => {\n return (\n <CheckboxGroupContext value={{ labelPlacement, containerStateLayer }}>\n <AriaCheckboxGroup\n className={(renderProps) =>\n clsx(\n styles[\"checkbox-group\"],\n typeof className === \"function\"\n ? className(renderProps)\n : className\n )\n }\n {...props}\n >\n {({ isInvalid }) => {\n const showDescription =\n description &&\n (!isInvalid || (isInvalid && showDescriptionOnInvalid));\n\n return (\n <>\n {label && <Label>{label}</Label>}\n\n <div\n className={clsx(styles[\"checkbox-items\"])}\n style={{\n gap: `calc(${checkboxItemsGap} * var(--dp, 1px))`,\n }}\n >\n {children}\n </div>\n\n {showDescription && (\n <Description>{description}</Description>\n )}\n <FieldError>{errorMessage}</FieldError>\n </>\n );\n }}\n </AriaCheckboxGroup>\n </CheckboxGroupContext>\n );\n};\n"],"mappings":"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"}
|
package/dist/chunks/Input2
CHANGED
|
@@ -1,20 +1,21 @@
|
|
|
1
|
-
import { t as e } from "./
|
|
2
|
-
import { t } from "./
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
5
|
-
import {
|
|
6
|
-
import {
|
|
7
|
-
import {
|
|
8
|
-
import { n as
|
|
9
|
-
import {
|
|
10
|
-
import {
|
|
11
|
-
import _ from "
|
|
12
|
-
import
|
|
13
|
-
import {
|
|
14
|
-
import {
|
|
1
|
+
import { t as e } from "./compiler-runtime";
|
|
2
|
+
import { t } from "./base";
|
|
3
|
+
import { t as n } from "./Icon";
|
|
4
|
+
import { IconButton as r } from "../components/Button/IconButton/index.js";
|
|
5
|
+
import { Description as i } from "../components/Input/Description/index.js";
|
|
6
|
+
import { t as a } from "./FieldError";
|
|
7
|
+
import { Label as o } from "../components/Input/Label/index.js";
|
|
8
|
+
import { a as s, c, d as l, l as u, n as d, o as f, s as p } from "./core4";
|
|
9
|
+
import { n as m, t as h } from "./useHover";
|
|
10
|
+
import { CharacterCount as g } from "../components/Input/CharacterCount/index.js";
|
|
11
|
+
import { useControllableState as _ } from "../components/Input/hooks/index.js";
|
|
12
|
+
import v from "clsx";
|
|
13
|
+
import { cloneElement as y, isValidElement as b, useCallback as x, useMemo as S, useRef as C } from "react";
|
|
14
|
+
import { Fragment as w, jsx as T, jsxs as E } from "react/jsx-runtime";
|
|
15
|
+
import { Input as D, TextField as O } from "react-aria-components";
|
|
15
16
|
import '../assets/Input2.css';//#region node_modules/react-aria/dist/private/utils/useObjectRef.mjs
|
|
16
|
-
function
|
|
17
|
-
let t =
|
|
17
|
+
function k(e) {
|
|
18
|
+
let t = C(null), n = C(void 0), r = x((t) => {
|
|
18
19
|
if (typeof e == "function") {
|
|
19
20
|
let n = e, r = n(t);
|
|
20
21
|
return () => {
|
|
@@ -24,7 +25,7 @@ function O(e) {
|
|
|
24
25
|
e.current = null;
|
|
25
26
|
};
|
|
26
27
|
}, [e]);
|
|
27
|
-
return
|
|
28
|
+
return S(() => ({
|
|
28
29
|
get current() {
|
|
29
30
|
return t.current;
|
|
30
31
|
},
|
|
@@ -33,115 +34,124 @@ function O(e) {
|
|
|
33
34
|
}
|
|
34
35
|
}), [r]);
|
|
35
36
|
}
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
37
|
+
//#endregion
|
|
38
|
+
//#region src/components/Input/Input/input.module.css
|
|
39
|
+
var A = e(), j = { button: "_button_650ys_2" }, M = (e) => {
|
|
40
|
+
let t = (0, A.c)(10), n, i, a;
|
|
41
|
+
t[0] === e ? (n = t[1], i = t[2], a = t[3]) : ({icon: i, className: n, ...a} = e, t[0] = e, t[1] = n, t[2] = i, t[3] = a);
|
|
42
|
+
let o;
|
|
43
|
+
t[4] === n ? o = t[5] : (o = (e) => v(j.button, typeof n == "function" ? n(e) : n), t[4] = n, t[5] = o);
|
|
44
|
+
let s;
|
|
45
|
+
return t[6] !== i || t[7] !== a || t[8] !== o ? (s = /* @__PURE__ */ T(r, {
|
|
46
|
+
className: o,
|
|
47
|
+
icon: i,
|
|
48
|
+
color: "standard",
|
|
49
|
+
size: "small",
|
|
50
|
+
width: "default",
|
|
51
|
+
...a
|
|
52
|
+
}), t[6] = i, t[7] = a, t[8] = o, t[9] = s) : s = t[9], s;
|
|
53
|
+
};
|
|
44
54
|
//#endregion
|
|
45
55
|
//#region src/components/Input/Input/handleInputButton.ts
|
|
46
|
-
function
|
|
47
|
-
return !
|
|
56
|
+
function N({ node: e, isInvalid: t, isDisabled: n }) {
|
|
57
|
+
return !b(e) || e.type !== M ? e : y(e, {
|
|
48
58
|
"data-invalid": t || void 0,
|
|
49
59
|
isDisabled: n
|
|
50
60
|
});
|
|
51
61
|
}
|
|
52
62
|
//#endregion
|
|
53
63
|
//#region src/components/Input/Input/Input.tsx
|
|
54
|
-
var
|
|
55
|
-
let H =
|
|
64
|
+
var P = ({ label: e, description: r, errorMessage: y, showDescriptionOnInvalid: b = !1, placeholder: x, editorDir: S, prefix: C, suffix: A, leadingIcon: j, trailing: M, className: P, showCharacterCount: F, maxLength: I, value: L, defaultValue: R, ref: z, onChange: B, ...V }) => {
|
|
65
|
+
let H = k(z), { currentValue: U, setValue: W } = _({
|
|
56
66
|
value: L,
|
|
57
67
|
defaultValue: R,
|
|
58
68
|
onChange: B
|
|
59
|
-
}), { isFocused: G, isFocusVisible: K, focusProps: q } =
|
|
60
|
-
"data-trailing":
|
|
61
|
-
"data-leading":
|
|
69
|
+
}), { isFocused: G, isFocusVisible: K, focusProps: q } = m(), { isHovered: J, hoverProps: Y } = h({}), X = {
|
|
70
|
+
"data-trailing": M ? !0 : void 0,
|
|
71
|
+
"data-leading": j ? !0 : void 0
|
|
62
72
|
};
|
|
63
|
-
return /* @__PURE__ */
|
|
64
|
-
className: (e) =>
|
|
73
|
+
return /* @__PURE__ */ T(O, {
|
|
74
|
+
className: (e) => v(d, c, typeof P == "function" ? P(e) : P),
|
|
65
75
|
maxLength: I,
|
|
66
76
|
value: U,
|
|
67
77
|
defaultValue: R,
|
|
68
78
|
onChange: W,
|
|
69
79
|
...V,
|
|
70
80
|
...X,
|
|
71
|
-
children: ({ isDisabled:
|
|
72
|
-
let
|
|
81
|
+
children: ({ isDisabled: c, isInvalid: d }) => {
|
|
82
|
+
let m = {
|
|
73
83
|
...X,
|
|
74
84
|
"data-hovered": J || void 0,
|
|
75
85
|
"data-focused": G || void 0,
|
|
76
86
|
"data-focus-visible": K || void 0,
|
|
77
|
-
"data-disabled":
|
|
78
|
-
"data-invalid":
|
|
79
|
-
},
|
|
80
|
-
return /* @__PURE__ */
|
|
81
|
-
|
|
82
|
-
/* @__PURE__ */
|
|
87
|
+
"data-disabled": c || void 0,
|
|
88
|
+
"data-invalid": d || void 0
|
|
89
|
+
}, h = r && (!d || d && b);
|
|
90
|
+
return /* @__PURE__ */ E(w, { children: [
|
|
91
|
+
e && /* @__PURE__ */ T(o, { children: e }),
|
|
92
|
+
/* @__PURE__ */ E("span", {
|
|
83
93
|
onPointerDown: (e) => {
|
|
84
94
|
let t = e.target;
|
|
85
95
|
H.current?.contains(t) || t.closest("button, a, [role='button']") || (e.preventDefault(), H.current?.focus());
|
|
86
96
|
},
|
|
87
97
|
...Y,
|
|
88
|
-
...
|
|
89
|
-
className:
|
|
98
|
+
...m,
|
|
99
|
+
className: v(p),
|
|
90
100
|
"data-input": !0,
|
|
91
101
|
children: [
|
|
92
|
-
|
|
93
|
-
icon:
|
|
102
|
+
j && /* @__PURE__ */ T(n, {
|
|
103
|
+
icon: j,
|
|
94
104
|
size: 24
|
|
95
105
|
}),
|
|
96
|
-
/* @__PURE__ */
|
|
97
|
-
className:
|
|
106
|
+
/* @__PURE__ */ E("span", {
|
|
107
|
+
className: v(s, t.bodyLarge),
|
|
98
108
|
children: [
|
|
99
|
-
|
|
100
|
-
isDisabled:
|
|
101
|
-
isInvalid:
|
|
102
|
-
}) :
|
|
103
|
-
/* @__PURE__ */
|
|
109
|
+
C && typeof C == "function" ? C({
|
|
110
|
+
isDisabled: c,
|
|
111
|
+
isInvalid: d
|
|
112
|
+
}) : C,
|
|
113
|
+
/* @__PURE__ */ T(D, {
|
|
104
114
|
ref: H,
|
|
105
|
-
className:
|
|
115
|
+
className: v(l, f, t.bodyLarge),
|
|
106
116
|
...q,
|
|
107
117
|
placeholder: x,
|
|
108
118
|
dir: S,
|
|
109
119
|
"data-input": !0
|
|
110
120
|
}),
|
|
111
121
|
A && typeof A == "function" ? A({
|
|
112
|
-
isDisabled:
|
|
113
|
-
isInvalid:
|
|
122
|
+
isDisabled: c,
|
|
123
|
+
isInvalid: d
|
|
114
124
|
}) : A
|
|
115
125
|
]
|
|
116
126
|
}),
|
|
117
|
-
|
|
118
|
-
isDisabled:
|
|
119
|
-
isInvalid:
|
|
120
|
-
}) :
|
|
121
|
-
node:
|
|
122
|
-
isDisabled:
|
|
123
|
-
isInvalid:
|
|
127
|
+
M && typeof M == "function" ? M({
|
|
128
|
+
isDisabled: c,
|
|
129
|
+
isInvalid: d
|
|
130
|
+
}) : N({
|
|
131
|
+
node: M,
|
|
132
|
+
isDisabled: c,
|
|
133
|
+
isInvalid: d
|
|
124
134
|
})
|
|
125
135
|
]
|
|
126
136
|
}),
|
|
127
|
-
|
|
137
|
+
h && /* @__PURE__ */ E("span", {
|
|
128
138
|
...X,
|
|
129
|
-
className:
|
|
130
|
-
children: [/* @__PURE__ */
|
|
139
|
+
className: v(u),
|
|
140
|
+
children: [/* @__PURE__ */ T(i, { children: r }), F && /* @__PURE__ */ T(g, {
|
|
131
141
|
count: U.length,
|
|
132
142
|
maxLength: I
|
|
133
143
|
})]
|
|
134
144
|
}),
|
|
135
|
-
!
|
|
145
|
+
!h && F && /* @__PURE__ */ E("span", {
|
|
136
146
|
...X,
|
|
137
|
-
className:
|
|
138
|
-
children: [/* @__PURE__ */
|
|
147
|
+
className: v(u),
|
|
148
|
+
children: [/* @__PURE__ */ T(a, { children: y }), /* @__PURE__ */ T(g, {
|
|
139
149
|
count: U.length,
|
|
140
150
|
maxLength: I
|
|
141
151
|
})]
|
|
142
152
|
}),
|
|
143
|
-
|
|
144
|
-
className:
|
|
153
|
+
h || !F ? /* @__PURE__ */ T(a, {
|
|
154
|
+
className: v(u),
|
|
145
155
|
children: y
|
|
146
156
|
}) : null
|
|
147
157
|
] });
|
|
@@ -149,6 +159,6 @@ var M = ({ label: n, description: v, errorMessage: y, showDescriptionOnInvalid:
|
|
|
149
159
|
});
|
|
150
160
|
};
|
|
151
161
|
//#endregion
|
|
152
|
-
export {
|
|
162
|
+
export { M as n, P as t };
|
|
153
163
|
|
|
154
164
|
//# sourceMappingURL=Input2.map
|
package/dist/chunks/Input2.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Input2","names":["$i6EpZ$useRef","$i6EpZ$useCallback","$i6EpZ$useMemo"],"sources":["../../node_modules/react-aria/dist/private/utils/useObjectRef.mjs","../../src/components/Input/Input/input.module.css","../../src/components/Input/Input/InputButton.tsx","../../src/components/Input/Input/handleInputButton.ts","../../src/components/Input/Input/Input.tsx"],"sourcesContent":["import {useRef as $i6EpZ$useRef, useCallback as $i6EpZ$useCallback, useMemo as $i6EpZ$useMemo} from \"react\";\n\n/*\n * Copyright 2021 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */ \nfunction $03e8ab2d84d7657a$export$4338b53315abf666(ref) {\n const objRef = (0, $i6EpZ$useRef)(null);\n const cleanupRef = (0, $i6EpZ$useRef)(undefined);\n const refEffect = (0, $i6EpZ$useCallback)((instance)=>{\n if (typeof ref === 'function') {\n const refCallback = ref;\n const refCleanup = refCallback(instance);\n return ()=>{\n if (typeof refCleanup === 'function') refCleanup();\n else refCallback(null);\n };\n } else if (ref) {\n ref.current = instance;\n return ()=>{\n ref.current = null;\n };\n }\n }, [\n ref\n ]);\n return (0, $i6EpZ$useMemo)(()=>({\n get current () {\n return objRef.current;\n },\n set current (value){\n objRef.current = value;\n if (cleanupRef.current) {\n cleanupRef.current();\n cleanupRef.current = undefined;\n }\n if (value != null) cleanupRef.current = refEffect(value);\n }\n }), [\n refEffect\n ]);\n}\n\n\nexport {$03e8ab2d84d7657a$export$4338b53315abf666 as useObjectRef};\n//# sourceMappingURL=useObjectRef.mjs.map\n","@layer adgytec.overrides {\n .button[data-invalid] {\n --md-button-color: var(--group-color);\n }\n}\n","import clsx from \"clsx\";\nimport { IconButton, type IconButtonProps } from \"@/components/Button\";\nimport styles from \"./input.module.css\";\n\nexport const InputButton: React.FC<\n Omit<IconButtonProps, \"color\" | \"size\" | \"width\">\n> = ({ icon, className, ...props }) => {\n return (\n <IconButton\n className={(renderProps) =>\n clsx(\n styles[\"button\"],\n typeof className === \"function\"\n ? className(renderProps)\n : className\n )\n }\n icon={icon}\n color=\"standard\"\n size=\"small\"\n width=\"default\"\n {...props}\n />\n );\n};\n","import { cloneElement, isValidElement, type ReactNode } from \"react\";\nimport { InputButton } from \"./InputButton\";\n\ntype InputButtonProps = React.ComponentProps<typeof InputButton> & {\n \"data-invalid\"?: boolean;\n};\n\nexport function addStateAttrsToInputButton({\n node,\n isInvalid,\n isDisabled,\n}: {\n node: ReactNode;\n isInvalid: boolean;\n isDisabled: boolean;\n}) {\n if (!isValidElement<InputButtonProps>(node)) {\n return node;\n }\n\n if (node.type !== InputButton) return node;\n\n return cloneElement(node, {\n \"data-invalid\": isInvalid || undefined,\n isDisabled,\n });\n}\n","import clsx from \"clsx\";\nimport { useFocusRing } from \"react-aria/useFocusRing\";\nimport { useHover } from \"react-aria/useHover\";\nimport { useObjectRef } from \"react-aria/useObjectRef\";\nimport {\n Input as AriaInput,\n TextField as AriaTextField,\n} from \"react-aria-components\";\nimport { Icon } from \"@/components/Icon\";\nimport { typography } from \"@/utils\";\nimport { CharacterCount } from \"../CharacterCount\";\nimport {\n Colors,\n EditorInputGroupStyles,\n EditorInputStyles,\n EditorStyles,\n InputGroupStyles,\n SupportingTextStyles,\n TextFieldIconSize,\n UnsetStyles,\n} from \"../core\";\nimport { Description } from \"../Description\";\nimport { FieldError } from \"../FieldError\";\nimport { useControllableState } from \"../hooks\";\nimport { Label } from \"../Label\";\nimport { addStateAttrsToInputButton } from \"./handleInputButton\";\nimport type { InputProps } from \"./types\";\n\nexport const Input: React.FC<InputProps> = ({\n label,\n description,\n errorMessage,\n showDescriptionOnInvalid = false,\n placeholder,\n editorDir,\n prefix,\n suffix,\n leadingIcon,\n trailing,\n className,\n showCharacterCount: hasCharacterCount,\n maxLength,\n value,\n defaultValue,\n ref,\n onChange,\n ...props\n}) => {\n const inputRef = useObjectRef(ref);\n\n const { currentValue, setValue } = useControllableState({\n value,\n defaultValue,\n onChange,\n });\n\n const { isFocused, isFocusVisible, focusProps } = useFocusRing();\n const { isHovered, hoverProps } = useHover({});\n\n const layoutDataAttrs = {\n \"data-trailing\": trailing ? true : undefined,\n \"data-leading\": leadingIcon ? true : undefined,\n };\n\n return (\n <AriaTextField\n className={(renderProps) =>\n clsx(\n Colors,\n InputGroupStyles,\n typeof className === \"function\"\n ? className(renderProps)\n : className\n )\n }\n maxLength={maxLength}\n value={currentValue}\n defaultValue={defaultValue}\n onChange={setValue}\n {...props}\n {...layoutDataAttrs}\n >\n {({ isDisabled, isInvalid }) => {\n const dataAttrs = {\n ...layoutDataAttrs,\n \"data-hovered\": isHovered || undefined,\n \"data-focused\": isFocused || undefined,\n \"data-focus-visible\": isFocusVisible || undefined,\n \"data-disabled\": isDisabled || undefined,\n \"data-invalid\": isInvalid || undefined,\n };\n\n const hasDescription =\n description &&\n (!isInvalid || (isInvalid && showDescriptionOnInvalid));\n\n return (\n <>\n {label && <Label>{label}</Label>}\n\n <span\n onPointerDown={(e) => {\n const target = e.target as HTMLElement;\n\n if (\n inputRef.current?.contains(target) ||\n target.closest(\"button, a, [role='button']\")\n ) {\n return;\n }\n\n e.preventDefault();\n inputRef.current?.focus();\n }}\n {...hoverProps}\n {...dataAttrs}\n className={clsx(EditorStyles)}\n data-input={true}\n >\n {leadingIcon && (\n <Icon\n icon={leadingIcon}\n size={TextFieldIconSize}\n />\n )}\n <span\n className={clsx(\n EditorInputGroupStyles,\n typography.bodyLarge\n )}\n >\n {prefix && typeof prefix === \"function\"\n ? prefix({ isDisabled, isInvalid })\n : prefix}\n <AriaInput\n ref={inputRef}\n className={clsx(\n UnsetStyles,\n EditorInputStyles,\n typography.bodyLarge\n )}\n {...focusProps}\n placeholder={placeholder}\n dir={editorDir}\n data-input={true}\n />\n {suffix && typeof suffix === \"function\"\n ? suffix({ isDisabled, isInvalid })\n : suffix}\n </span>\n\n {trailing && typeof trailing === \"function\"\n ? trailing({ isDisabled, isInvalid })\n : addStateAttrsToInputButton({\n node: trailing,\n isDisabled,\n isInvalid,\n })}\n </span>\n\n {hasDescription && (\n <span\n {...layoutDataAttrs}\n className={clsx(SupportingTextStyles)}\n >\n <Description>{description}</Description>\n\n {hasCharacterCount && (\n <CharacterCount\n count={currentValue.length}\n maxLength={maxLength}\n />\n )}\n </span>\n )}\n\n {!hasDescription && hasCharacterCount && (\n <span\n {...layoutDataAttrs}\n className={clsx(SupportingTextStyles)}\n >\n <FieldError>{errorMessage}</FieldError>\n\n <CharacterCount\n count={currentValue.length}\n maxLength={maxLength}\n />\n </span>\n )}\n\n {/* Error placement */}\n {hasDescription || !hasCharacterCount ? (\n <FieldError className={clsx(SupportingTextStyles)}>\n {errorMessage}\n </FieldError>\n ) : null}\n </>\n );\n }}\n </AriaTextField>\n );\n};\n"],"x_google_ignoreList":[0],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Input2","names":["$i6EpZ$useRef","$i6EpZ$useCallback","$i6EpZ$useMemo","icon"],"sources":["../../node_modules/react-aria/dist/private/utils/useObjectRef.mjs","../../src/components/Input/Input/input.module.css","../../src/components/Input/Input/InputButton.tsx","../../src/components/Input/Input/handleInputButton.ts","../../src/components/Input/Input/Input.tsx"],"sourcesContent":["import {useRef as $i6EpZ$useRef, useCallback as $i6EpZ$useCallback, useMemo as $i6EpZ$useMemo} from \"react\";\n\n/*\n * Copyright 2021 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */ \nfunction $03e8ab2d84d7657a$export$4338b53315abf666(ref) {\n const objRef = (0, $i6EpZ$useRef)(null);\n const cleanupRef = (0, $i6EpZ$useRef)(undefined);\n const refEffect = (0, $i6EpZ$useCallback)((instance)=>{\n if (typeof ref === 'function') {\n const refCallback = ref;\n const refCleanup = refCallback(instance);\n return ()=>{\n if (typeof refCleanup === 'function') refCleanup();\n else refCallback(null);\n };\n } else if (ref) {\n ref.current = instance;\n return ()=>{\n ref.current = null;\n };\n }\n }, [\n ref\n ]);\n return (0, $i6EpZ$useMemo)(()=>({\n get current () {\n return objRef.current;\n },\n set current (value){\n objRef.current = value;\n if (cleanupRef.current) {\n cleanupRef.current();\n cleanupRef.current = undefined;\n }\n if (value != null) cleanupRef.current = refEffect(value);\n }\n }), [\n refEffect\n ]);\n}\n\n\nexport {$03e8ab2d84d7657a$export$4338b53315abf666 as useObjectRef};\n//# sourceMappingURL=useObjectRef.mjs.map\n","@layer adgytec.overrides {\n .button[data-invalid] {\n --md-button-color: var(--group-color);\n }\n}\n","import clsx from \"clsx\";\nimport { IconButton, type IconButtonProps } from \"@/components/Button\";\nimport styles from \"./input.module.css\";\n\nexport const InputButton: React.FC<\n Omit<IconButtonProps, \"color\" | \"size\" | \"width\">\n> = ({ icon, className, ...props }) => {\n return (\n <IconButton\n className={(renderProps) =>\n clsx(\n styles[\"button\"],\n typeof className === \"function\"\n ? className(renderProps)\n : className\n )\n }\n icon={icon}\n color=\"standard\"\n size=\"small\"\n width=\"default\"\n {...props}\n />\n );\n};\n","import { cloneElement, isValidElement, type ReactNode } from \"react\";\nimport { InputButton } from \"./InputButton\";\n\ntype InputButtonProps = React.ComponentProps<typeof InputButton> & {\n \"data-invalid\"?: boolean;\n};\n\nexport function addStateAttrsToInputButton({\n node,\n isInvalid,\n isDisabled,\n}: {\n node: ReactNode;\n isInvalid: boolean;\n isDisabled: boolean;\n}) {\n if (!isValidElement<InputButtonProps>(node)) {\n return node;\n }\n\n if (node.type !== InputButton) return node;\n\n return cloneElement(node, {\n \"data-invalid\": isInvalid || undefined,\n isDisabled,\n });\n}\n","import clsx from \"clsx\";\nimport { useFocusRing } from \"react-aria/useFocusRing\";\nimport { useHover } from \"react-aria/useHover\";\nimport { useObjectRef } from \"react-aria/useObjectRef\";\nimport {\n Input as AriaInput,\n TextField as AriaTextField,\n} from \"react-aria-components\";\nimport { Icon } from \"@/components/Icon\";\nimport { typography } from \"@/utils\";\nimport { CharacterCount } from \"../CharacterCount\";\nimport {\n Colors,\n EditorInputGroupStyles,\n EditorInputStyles,\n EditorStyles,\n InputGroupStyles,\n SupportingTextStyles,\n TextFieldIconSize,\n UnsetStyles,\n} from \"../core\";\nimport { Description } from \"../Description\";\nimport { FieldError } from \"../FieldError\";\nimport { useControllableState } from \"../hooks\";\nimport { Label } from \"../Label\";\nimport { addStateAttrsToInputButton } from \"./handleInputButton\";\nimport type { InputProps } from \"./types\";\n\nexport const Input: React.FC<InputProps> = ({\n label,\n description,\n errorMessage,\n showDescriptionOnInvalid = false,\n placeholder,\n editorDir,\n prefix,\n suffix,\n leadingIcon,\n trailing,\n className,\n showCharacterCount: hasCharacterCount,\n maxLength,\n value,\n defaultValue,\n ref,\n onChange,\n ...props\n}) => {\n const inputRef = useObjectRef(ref);\n\n const { currentValue, setValue } = useControllableState({\n value,\n defaultValue,\n onChange,\n });\n\n const { isFocused, isFocusVisible, focusProps } = useFocusRing();\n const { isHovered, hoverProps } = useHover({});\n\n const layoutDataAttrs = {\n \"data-trailing\": trailing ? true : undefined,\n \"data-leading\": leadingIcon ? true : undefined,\n };\n\n return (\n <AriaTextField\n className={(renderProps) =>\n clsx(\n Colors,\n InputGroupStyles,\n typeof className === \"function\"\n ? className(renderProps)\n : className\n )\n }\n maxLength={maxLength}\n value={currentValue}\n defaultValue={defaultValue}\n onChange={setValue}\n {...props}\n {...layoutDataAttrs}\n >\n {({ isDisabled, isInvalid }) => {\n const dataAttrs = {\n ...layoutDataAttrs,\n \"data-hovered\": isHovered || undefined,\n \"data-focused\": isFocused || undefined,\n \"data-focus-visible\": isFocusVisible || undefined,\n \"data-disabled\": isDisabled || undefined,\n \"data-invalid\": isInvalid || undefined,\n };\n\n const hasDescription =\n description &&\n (!isInvalid || (isInvalid && showDescriptionOnInvalid));\n\n return (\n <>\n {label && <Label>{label}</Label>}\n\n <span\n onPointerDown={(e) => {\n const target = e.target as HTMLElement;\n\n if (\n inputRef.current?.contains(target) ||\n target.closest(\"button, a, [role='button']\")\n ) {\n return;\n }\n\n e.preventDefault();\n inputRef.current?.focus();\n }}\n {...hoverProps}\n {...dataAttrs}\n className={clsx(EditorStyles)}\n data-input={true}\n >\n {leadingIcon && (\n <Icon\n icon={leadingIcon}\n size={TextFieldIconSize}\n />\n )}\n <span\n className={clsx(\n EditorInputGroupStyles,\n typography.bodyLarge\n )}\n >\n {prefix && typeof prefix === \"function\"\n ? prefix({ isDisabled, isInvalid })\n : prefix}\n <AriaInput\n ref={inputRef}\n className={clsx(\n UnsetStyles,\n EditorInputStyles,\n typography.bodyLarge\n )}\n {...focusProps}\n placeholder={placeholder}\n dir={editorDir}\n data-input={true}\n />\n {suffix && typeof suffix === \"function\"\n ? suffix({ isDisabled, isInvalid })\n : suffix}\n </span>\n\n {trailing && typeof trailing === \"function\"\n ? trailing({ isDisabled, isInvalid })\n : addStateAttrsToInputButton({\n node: trailing,\n isDisabled,\n isInvalid,\n })}\n </span>\n\n {hasDescription && (\n <span\n {...layoutDataAttrs}\n className={clsx(SupportingTextStyles)}\n >\n <Description>{description}</Description>\n\n {hasCharacterCount && (\n <CharacterCount\n count={currentValue.length}\n maxLength={maxLength}\n />\n )}\n </span>\n )}\n\n {!hasDescription && hasCharacterCount && (\n <span\n {...layoutDataAttrs}\n className={clsx(SupportingTextStyles)}\n >\n <FieldError>{errorMessage}</FieldError>\n\n <CharacterCount\n count={currentValue.length}\n maxLength={maxLength}\n />\n </span>\n )}\n\n {/* Error placement */}\n {hasDescription || !hasCharacterCount ? (\n <FieldError className={clsx(SupportingTextStyles)}>\n {errorMessage}\n </FieldError>\n ) : null}\n </>\n );\n }}\n </AriaTextField>\n );\n};\n"],"x_google_ignoreList":[0],"mappings":"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"}
|
package/dist/chunks/Loader
CHANGED
|
@@ -1,13 +1,20 @@
|
|
|
1
|
-
import { t as e } from "./
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
5
|
-
import
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
1
|
+
import { t as e } from "./compiler-runtime";
|
|
2
|
+
import { t } from "./Icon";
|
|
3
|
+
import { clsx as n } from "clsx";
|
|
4
|
+
import { jsx as r } from "react/jsx-runtime";
|
|
5
|
+
import { LoaderCircle as i } from "lucide-react";
|
|
6
|
+
import '../assets/Loader.css';//#region src/components/Loader/loader.module.css
|
|
7
|
+
var a = e(), o = { loader: "_loader_kal5x_2" }, s = (e) => {
|
|
8
|
+
let s = (0, a.c)(3), c;
|
|
9
|
+
s[0] === Symbol.for("react.memo_cache_sentinel") ? (c = n(o.loader), s[0] = c) : c = s[0];
|
|
10
|
+
let l;
|
|
11
|
+
return s[1] === e ? l = s[2] : (l = /* @__PURE__ */ r(t, {
|
|
12
|
+
icon: i,
|
|
13
|
+
className: c,
|
|
14
|
+
...e
|
|
15
|
+
}), s[1] = e, s[2] = l), l;
|
|
16
|
+
};
|
|
10
17
|
//#endregion
|
|
11
|
-
export {
|
|
18
|
+
export { s as t };
|
|
12
19
|
|
|
13
20
|
//# sourceMappingURL=Loader.map
|
package/dist/chunks/Loader.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Loader","names":[],"sources":["../../src/components/Loader/loader.module.css","../../src/components/Loader/Loader.tsx"],"sourcesContent":["@layer adgytec.comps {\n .loader {\n animation: loader 1s infinite linear;\n }\n\n @keyframes loader {\n from {\n rotate: 0deg;\n }\n to {\n rotate: 360deg;\n }\n }\n}\n","import { clsx } from \"clsx\";\nimport { LoaderCircle } from \"lucide-react\";\nimport { Icon } from \"../Icon\";\nimport styles from \"./loader.module.css\";\n\nexport const Loader: React.FC<\n Omit<React.ComponentPropsWithRef<typeof Icon>, \"icon\" | \"className\">\n> = (props) => {\n return (\n <Icon\n icon={LoaderCircle}\n className={clsx(styles[\"loader\"])}\n {...props}\n />\n );\n};\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"Loader","names":["LoaderCircle"],"sources":["../../src/components/Loader/loader.module.css","../../src/components/Loader/Loader.tsx"],"sourcesContent":["@layer adgytec.comps {\n .loader {\n animation: loader 1s infinite linear;\n }\n\n @keyframes loader {\n from {\n rotate: 0deg;\n }\n to {\n rotate: 360deg;\n }\n }\n}\n","import { clsx } from \"clsx\";\nimport { LoaderCircle } from \"lucide-react\";\nimport { Icon } from \"../Icon\";\nimport styles from \"./loader.module.css\";\n\nexport const Loader: React.FC<\n Omit<React.ComponentPropsWithRef<typeof Icon>, \"icon\" | \"className\">\n> = (props) => {\n return (\n <Icon\n icon={LoaderCircle}\n className={clsx(styles[\"loader\"])}\n {...props}\n />\n );\n};\n"],"mappings":";;;;;;gDCKa,KAET,MAAA;CAAA,IAAA,KAAA,GAAA,EAAA,EAAA,CAAA,CAAA,GAAA;CAAA,AAAA,EAAA,OAAA,OAAA,IAAA,2BAAA,KAImB,IAAA,EAAK,EAAM,MAAU,GAAC,EAAA,KAAA,KAAA,IAAA,EAAA;CAAA,IAAA;CAEnC,OAFmC,EAAA,OAAA,IAEnC,IAAA,EAAA,MAJF,IAAA,kBAAC,GAAD;EACUA,MAAA;EACK,WAAA;EAAsB,GAC7B;CAAK,CAAA,GACX,EAAA,KAAA,GAAA,EAAA,KAAA,IAJF;AAIE"}
|
package/dist/chunks/MenuPopover
CHANGED
|
@@ -1,11 +1,20 @@
|
|
|
1
|
-
import { t as e } from "./
|
|
2
|
-
import t from "
|
|
3
|
-
import
|
|
4
|
-
import
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
1
|
+
import { t as e } from "./compiler-runtime";
|
|
2
|
+
import { t } from "./Popover";
|
|
3
|
+
import n from "clsx";
|
|
4
|
+
import { jsx as r } from "react/jsx-runtime";
|
|
5
|
+
import '../assets/MenuPopover.css';//#region src/components/Menu/MenuPopover/menuPopover.module.css
|
|
6
|
+
var i = e(), a = { popover: "_popover_1whgu_2" }, o = (e) => {
|
|
7
|
+
let o = (0, i.c)(8), s, c;
|
|
8
|
+
o[0] === e ? (s = o[1], c = o[2]) : ({className: s, ...c} = e, o[0] = e, o[1] = s, o[2] = c);
|
|
9
|
+
let l;
|
|
10
|
+
o[3] === s ? l = o[4] : (l = (e) => n(a.popover, typeof s == "function" ? s(e) : s), o[3] = s, o[4] = l);
|
|
11
|
+
let u;
|
|
12
|
+
return o[5] !== c || o[6] !== l ? (u = /* @__PURE__ */ r(t, {
|
|
13
|
+
className: l,
|
|
14
|
+
...c
|
|
15
|
+
}), o[5] = c, o[6] = l, o[7] = u) : u = o[7], u;
|
|
16
|
+
};
|
|
8
17
|
//#endregion
|
|
9
|
-
export {
|
|
18
|
+
export { o as t };
|
|
10
19
|
|
|
11
20
|
//# sourceMappingURL=MenuPopover.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MenuPopover","names":[],"sources":["../../src/components/Menu/MenuPopover/menuPopover.module.css","../../src/components/Menu/MenuPopover/MenuPopover.tsx"],"sourcesContent":["@layer adgytec.comps {\n .popover {\n display: grid;\n grid-template-rows: 1fr;\n }\n}\n","import clsx from \"clsx\";\nimport { Popover } from \"@/components/Popover\";\nimport styles from \"./menuPopover.module.css\";\n\nexport const MenuPopover: React.FC<\n React.ComponentPropsWithRef<typeof Popover>\n> = ({ className, ...props }) => {\n return (\n <Popover\n className={(renderProps) =>\n clsx(\n styles[\"popover\"],\n typeof className === \"function\"\n ? className(renderProps)\n : className\n )\n }\n {...props}\n />\n );\n};\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"MenuPopover","names":[],"sources":["../../src/components/Menu/MenuPopover/menuPopover.module.css","../../src/components/Menu/MenuPopover/MenuPopover.tsx"],"sourcesContent":["@layer adgytec.comps {\n .popover {\n display: grid;\n grid-template-rows: 1fr;\n }\n}\n","import clsx from \"clsx\";\nimport { Popover } from \"@/components/Popover\";\nimport styles from \"./menuPopover.module.css\";\n\nexport const MenuPopover: React.FC<\n React.ComponentPropsWithRef<typeof Popover>\n> = ({ className, ...props }) => {\n return (\n <Popover\n className={(renderProps) =>\n clsx(\n styles[\"popover\"],\n typeof className === \"function\"\n ? className(renderProps)\n : className\n )\n }\n {...props}\n />\n );\n};\n"],"mappings":";;;;;kDCIa,KAET,MAAA;CAAA,IAAA,KAAA,GAAA,EAAA,EAAA,CAAA,CAAA,GAAA,GAAA;CAAA,AAAA,EAAA,OAAA,KAAwB,IAAA,EAAA,IAAA,IAAA,EAAA,OAAvB,kBAAA,KAAA,GAAuB,EAAA,KAAA,GAAA,EAAA,KAAA,GAAA,EAAA,KAAA;CAAA,IAAA;CAAA,AAAA,EAAA,OAAA,IASX,IAAA,EAAA,MANM,KAAA,MACP,EACI,EAAM,SACN,OAAO,KAAc,aACf,EAAU,CACF,IAFd,CAGJ,GAAC,EAAA,KAAA,GAAA,EAAA,KAAA;CAAA,IAAA;CAGP,OAHO,EAAA,OAAA,KAAA,EAAA,OAAA,KAPT,IAAA,kBAAC,GAAD;EACe,WAAA;EAMN,GAED;CAAK,CAAA,GACX,EAAA,KAAA,GAAA,EAAA,KAAA,GAAA,EAAA,KAAA,KAAA,IAAA,EAAA,IAVF;AAUE"}
|
package/dist/chunks/Modal
CHANGED
|
@@ -1,11 +1,20 @@
|
|
|
1
|
-
import e from "
|
|
2
|
-
import
|
|
3
|
-
import {
|
|
4
|
-
import
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
1
|
+
import { t as e } from "./compiler-runtime";
|
|
2
|
+
import t from "clsx";
|
|
3
|
+
import { jsx as n } from "react/jsx-runtime";
|
|
4
|
+
import { Modal as r } from "react-aria-components";
|
|
5
|
+
import '../assets/Modal.css';//#region src/components/Dialog/Modal/modal.module.css
|
|
6
|
+
var i = e(), a = { modal: "_modal_1sjxc_2" }, o = (e) => {
|
|
7
|
+
let o = (0, i.c)(8), s, c;
|
|
8
|
+
o[0] === e ? (s = o[1], c = o[2]) : ({className: s, ...c} = e, o[0] = e, o[1] = s, o[2] = c);
|
|
9
|
+
let l;
|
|
10
|
+
o[3] === s ? l = o[4] : (l = (e) => t(a.modal, typeof s == "function" ? s(e) : s), o[3] = s, o[4] = l);
|
|
11
|
+
let u;
|
|
12
|
+
return o[5] !== c || o[6] !== l ? (u = /* @__PURE__ */ n(r, {
|
|
13
|
+
className: l,
|
|
14
|
+
...c
|
|
15
|
+
}), o[5] = c, o[6] = l, o[7] = u) : u = o[7], u;
|
|
16
|
+
};
|
|
8
17
|
//#endregion
|
|
9
|
-
export {
|
|
18
|
+
export { o as t };
|
|
10
19
|
|
|
11
20
|
//# sourceMappingURL=Modal.map
|
package/dist/chunks/Modal.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Modal","names":[],"sources":["../../src/components/Dialog/Modal/modal.module.css","../../src/components/Dialog/Modal/Modal.tsx"],"sourcesContent":["@layer adgytec.comps {\n .modal {\n padding-inline: var(--md-sys-layout-window-size-compact-margin);\n\n position: fixed;\n inset: 0;\n\n display: flex;\n align-items: center;\n justify-content: center;\n\n transition: scale var(--md-sys-motion-expressive-fast-spatial)\n var(--md-sys-motion-expressive-fast-spatial-duration);\n\n @media (prefers-reduced-motion) {\n transition: none;\n }\n\n &[data-entering] {\n scale: 0.75;\n }\n }\n}\n","import clsx from \"clsx\";\nimport { Modal as AriaModal } from \"react-aria-components\";\nimport styles from \"./modal.module.css\";\n\nexport const Modal: React.FC<React.ComponentPropsWithRef<typeof AriaModal>> = ({\n className,\n ...props\n}) => {\n return (\n <AriaModal\n className={(renderProps) =>\n clsx(\n styles[\"modal\"],\n typeof className === \"function\"\n ? className(renderProps)\n : className\n )\n }\n {...props}\n />\n );\n};\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"Modal","names":[],"sources":["../../src/components/Dialog/Modal/modal.module.css","../../src/components/Dialog/Modal/Modal.tsx"],"sourcesContent":["@layer adgytec.comps {\n .modal {\n padding-inline: var(--md-sys-layout-window-size-compact-margin);\n\n position: fixed;\n inset: 0;\n\n display: flex;\n align-items: center;\n justify-content: center;\n\n transition: scale var(--md-sys-motion-expressive-fast-spatial)\n var(--md-sys-motion-expressive-fast-spatial-duration);\n\n @media (prefers-reduced-motion) {\n transition: none;\n }\n\n &[data-entering] {\n scale: 0.75;\n }\n }\n}\n","import clsx from \"clsx\";\nimport { Modal as AriaModal } from \"react-aria-components\";\nimport styles from \"./modal.module.css\";\n\nexport const Modal: React.FC<React.ComponentPropsWithRef<typeof AriaModal>> = ({\n className,\n ...props\n}) => {\n return (\n <AriaModal\n className={(renderProps) =>\n clsx(\n styles[\"modal\"],\n typeof className === \"function\"\n ? className(renderProps)\n : className\n )\n }\n {...props}\n />\n );\n};\n"],"mappings":";;;;;8CCIa,KAAiE,MAAA;CAAA,IAAA,KAAA,GAAA,EAAA,EAAA,CAAA,CAAA,GAAA,GAAA;CAAA,AAAA,EAAA,OAAA,KAG7E,IAAA,EAAA,IAAA,IAAA,EAAA,OAH8E,kBAAA,KAAA,GAG9E,EAAA,KAAA,GAAA,EAAA,KAAA,GAAA,EAAA,KAAA;CAAA,IAAA;CAAA,AAAA,EAAA,OAAA,IASgB,IAAA,EAAA,MANM,KAAA,MACP,EACI,EAAM,OACN,OAAO,KAAc,aACf,EAAU,CACF,IAFd,CAGJ,GAAC,EAAA,KAAA,GAAA,EAAA,KAAA;CAAA,IAAA;CAGP,OAHO,EAAA,OAAA,KAAA,EAAA,OAAA,KAPT,IAAA,kBAAC,GAAD;EACe,WAAA;EAMN,GAED;CAAK,CAAA,GACX,EAAA,KAAA,GAAA,EAAA,KAAA,GAAA,EAAA,KAAA,KAAA,IAAA,EAAA,IAVF;AAUE"}
|
package/dist/chunks/ModalOverlay
CHANGED
|
@@ -1,11 +1,20 @@
|
|
|
1
|
-
import e from "
|
|
2
|
-
import
|
|
3
|
-
import {
|
|
4
|
-
import
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
1
|
+
import { t as e } from "./compiler-runtime";
|
|
2
|
+
import t from "clsx";
|
|
3
|
+
import { jsx as n } from "react/jsx-runtime";
|
|
4
|
+
import { ModalOverlay as r } from "react-aria-components";
|
|
5
|
+
import '../assets/ModalOverlay.css';//#region src/components/Dialog/ModalOverlay/modalOverlay.module.css
|
|
6
|
+
var i = e(), a = { overlay: "_overlay_jlm1y_8" }, o = (e) => {
|
|
7
|
+
let o = (0, i.c)(8), s, c;
|
|
8
|
+
o[0] === e ? (s = o[1], c = o[2]) : ({className: s, ...c} = e, o[0] = e, o[1] = s, o[2] = c);
|
|
9
|
+
let l;
|
|
10
|
+
o[3] === s ? l = o[4] : (l = (e) => t(a.overlay, typeof s == "function" ? s(e) : s), o[3] = s, o[4] = l);
|
|
11
|
+
let u;
|
|
12
|
+
return o[5] !== c || o[6] !== l ? (u = /* @__PURE__ */ n(r, {
|
|
13
|
+
className: l,
|
|
14
|
+
...c
|
|
15
|
+
}), o[5] = c, o[6] = l, o[7] = u) : u = o[7], u;
|
|
16
|
+
};
|
|
8
17
|
//#endregion
|
|
9
|
-
export {
|
|
18
|
+
export { o as t };
|
|
10
19
|
|
|
11
20
|
//# sourceMappingURL=ModalOverlay.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ModalOverlay","names":[],"sources":["../../src/components/Dialog/ModalOverlay/modalOverlay.module.css","../../src/components/Dialog/ModalOverlay/ModalOverlay.tsx"],"sourcesContent":["/* configurable tokens\n*\n* --md-dialog-overlay\n*\n* configurable tokens end */\n\n@layer adgytec.comps {\n .overlay {\n /* configurable tokens */\n --_md-dialog-overlay: var(\n --md-dialog-overlay,\n var(--md-sys-color-scrim)\n );\n\n /* configurable tokens end */\n\n --_modal-motion: var(--md-sys-motion-expressive-default-effects);\n --_modal-motion-duration: var(\n --md-sys-motion-expressive-default-effects-duration\n );\n\n background-color: rgb(\n from var(--_md-dialog-overlay) r g b /\n var(--md-sys-state-backdrop)\n );\n\n position: fixed;\n inset: 0;\n z-index: 1000;\n\n transition: opacity var(--_modal-motion) var(--_modal-motion-duration);\n\n @media (prefers-reduced-motion) {\n transition: none;\n }\n\n &[data-entering],\n &[data-exiting] {\n opacity: 0;\n }\n }\n}\n","import clsx from \"clsx\";\nimport { ModalOverlay as AriaModalOverlay } from \"react-aria-components\";\nimport styles from \"./modalOverlay.module.css\";\n\nexport const ModalOverlay: React.FC<\n React.ComponentPropsWithRef<typeof AriaModalOverlay>\n> = ({ className, ...props }) => {\n return (\n <AriaModalOverlay\n className={(renderProps) =>\n clsx(\n styles[\"overlay\"],\n typeof className === \"function\"\n ? className(renderProps)\n : className\n )\n }\n {...props}\n />\n );\n};\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"ModalOverlay","names":[],"sources":["../../src/components/Dialog/ModalOverlay/modalOverlay.module.css","../../src/components/Dialog/ModalOverlay/ModalOverlay.tsx"],"sourcesContent":["/* configurable tokens\n*\n* --md-dialog-overlay\n*\n* configurable tokens end */\n\n@layer adgytec.comps {\n .overlay {\n /* configurable tokens */\n --_md-dialog-overlay: var(\n --md-dialog-overlay,\n var(--md-sys-color-scrim)\n );\n\n /* configurable tokens end */\n\n --_modal-motion: var(--md-sys-motion-expressive-default-effects);\n --_modal-motion-duration: var(\n --md-sys-motion-expressive-default-effects-duration\n );\n\n background-color: rgb(\n from var(--_md-dialog-overlay) r g b /\n var(--md-sys-state-backdrop)\n );\n\n position: fixed;\n inset: 0;\n z-index: 1000;\n\n transition: opacity var(--_modal-motion) var(--_modal-motion-duration);\n\n @media (prefers-reduced-motion) {\n transition: none;\n }\n\n &[data-entering],\n &[data-exiting] {\n opacity: 0;\n }\n }\n}\n","import clsx from \"clsx\";\nimport { ModalOverlay as AriaModalOverlay } from \"react-aria-components\";\nimport styles from \"./modalOverlay.module.css\";\n\nexport const ModalOverlay: React.FC<\n React.ComponentPropsWithRef<typeof AriaModalOverlay>\n> = ({ className, ...props }) => {\n return (\n <AriaModalOverlay\n className={(renderProps) =>\n clsx(\n styles[\"overlay\"],\n typeof className === \"function\"\n ? className(renderProps)\n : className\n )\n }\n {...props}\n />\n );\n};\n"],"mappings":";;;;;kDCIa,KAET,MAAA;CAAA,IAAA,KAAA,GAAA,EAAA,EAAA,CAAA,CAAA,GAAA,GAAA;CAAA,AAAA,EAAA,OAAA,KAAwB,IAAA,EAAA,IAAA,IAAA,EAAA,OAAvB,kBAAA,KAAA,GAAuB,EAAA,KAAA,GAAA,EAAA,KAAA,GAAA,EAAA,KAAA;CAAA,IAAA;CAAA,AAAA,EAAA,OAAA,IASX,IAAA,EAAA,MANM,KAAA,MACP,EACI,EAAM,SACN,OAAO,KAAc,aACf,EAAU,CACF,IAFd,CAGJ,GAAC,EAAA,KAAA,GAAA,EAAA,KAAA;CAAA,IAAA;CAGP,OAHO,EAAA,OAAA,KAAA,EAAA,OAAA,KAPT,IAAA,kBAAC,GAAD;EACe,WAAA;EAMN,GAED;CAAK,CAAA,GACX,EAAA,KAAA,GAAA,EAAA,KAAA,GAAA,EAAA,KAAA,KAAA,IAAA,EAAA,IAVF;AAUE"}
|