npm - @hitachivantara/uikit-react-core - Versions diffs - 5.39.0 → 5.39.2 - Mend

@hitachivantara/uikit-react-core 5.39.0 → 5.39.2

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

Files changed (1634) hide show

package/dist/cjs/components/BaseDropdown/BaseDropdown.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"BaseDropdown.cjs","sources":["../../../../src/components/BaseDropdown/BaseDropdown.tsx"],"sourcesContent":["import React, {\n useMemo,\n useState,\n useCallback,\n KeyboardEventHandler,\n AriaAttributes,\n forwardRef,\n} from \"react\";\n\nimport { createPortal } from \"react-dom\";\n\nimport {\n ClickAwayListener,\n ClickAwayListenerProps,\n PopperPlacementType,\n PopperProps,\n} from \"@mui/material\";\n\nimport { DropDownXS, DropUpXS } from \"@hitachivantara/uikit-react-icons\";\n\nimport { usePopper } from \"react-popper\";\nimport { detectOverflow, ModifierArguments, Options } from \"@popperjs/core\";\n\nimport { HvTypography } from \"@core/components/Typography\";\nimport { useUniqueId } from \"@core/hooks/useUniqueId\";\nimport { useTheme } from \"@core/hooks/useTheme\";\nimport { useForkRef } from \"@core/hooks/useForkRef\";\nimport { useControlled } from \"@core/hooks/useControlled\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { isKey, isOneOfKeys } from \"@core/utils/keyboardUtils\";\nimport { setId } from \"@core/utils/setId\";\nimport { getFirstAndLastFocus } from \"@core/utils/focusableElementFinder\";\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { ExtractNames } from \"@core/utils/classes\";\n\nimport { staticClasses, useClasses } from \"./BaseDropdown.styles\";\nimport BaseDropdownContext from \"./BaseDropdownContext\";\n\nexport { staticClasses as baseDropdownClasses };\n\nexport type HvBaseDropdownClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvBaseDropdownProps\n extends HvBaseProps<HTMLDivElement, \"placeholder\"> {\n /*\n The role of the element that triggers the popup.\n \n Defaults to \"combobox\" if `component` and the default\n * \"textbox\" header is used, undefined otherwise.\n /\n role?: string;\n /\n Header placeholder.\n /\n placeholder?: React.ReactNode;\n /\n If `true` the dropdown is disabled unable to be interacted, if `false` it is enabled.\n /\n disabled?: boolean;\n /\n If `true` the dropdown will be in read only mode, unable to be interacted.\n /\n readOnly?: boolean;\n /\n Indicates that user input is required on the form element.\n /\n required?: boolean;\n /\n Disable the portal behavior.\n * The children stay within it's parent DOM hierarchy.\n /\n disablePortal?: boolean;\n /\n If `true` the dropdown width depends size of content if `false` the width depends on the header size.\n * Defaults to `false`.\n /\n variableWidth?: boolean;\n /\n If `true` the dropdown starts opened if `false` it starts closed.\n /\n expanded?: boolean;\n /\n When uncontrolled, defines the initial expanded state.\n /\n defaultExpanded?: boolean;\n /\n An object containing props to be wired to the popper component.\n /\n popperProps?: Partial<PopperProps>;\n /\n Placement of the dropdown.\n /\n placement?: \"left\" \| \"right\";\n /\n Replacement for the header component.\n /\n component?: React.ReactNode;\n /\n Adornment to replace the default arrows.\n /\n adornment?: React.ReactNode;\n /\n When dropdown changes the expanded state.\n /\n onToggle?: (event: Event, open: boolean) => void;\n /\n When user click outside the open container.\n /\n onClickOutside?: (event: Event) => void;\n /\n Callback called when the dropdown is opened and ready,\n * commonly used to set focus to the content.\n /\n onContainerCreation?: (container: HTMLElement \| null) => void;\n /\n Attributes applied to the dropdown header element.\n /\n dropdownHeaderProps?: React.DetailedHTMLProps<\n React.HTMLAttributes<HTMLDivElement>,\n HTMLDivElement\n >;\n /\n Pass a ref to the dropdown header element.\n /\n dropdownHeaderRef?: React.Ref<HTMLDivElement>;\n /\n A Jss Object used to override or extend the component styles applied.\n /\n classes?: HvBaseDropdownClasses;\n /* @ignore /\n ref?: React.Ref<HTMLDivElement>;\n}\n\nexport const HvBaseDropdown = forwardRef<HTMLDivElement, HvBaseDropdownProps>(\n (props, ref) => {\n const {\n id: idProp,\n className,\n classes: classesProp,\n children,\n role,\n placeholder,\n component,\n adornment,\n expanded,\n dropdownHeaderProps,\n defaultExpanded,\n disabled,\n readOnly,\n required,\n disablePortal,\n variableWidth,\n placement: placementProp = \"right\",\n \"aria-expanded\": ariaExpandedProp,\n \"aria-label\": ariaLabelProp,\n \"aria-labelledby\": ariaLabelledByProp,\n popperProps = {},\n dropdownHeaderRef: dropdownHeaderRefProp,\n onToggle,\n onClickOutside,\n onContainerCreation,\n ...others\n } = useDefaultProps(\"HvBaseDropdown\", props);\n const { classes, cx } = useClasses(classesProp);\n\n const { rootId } = useTheme();\n\n const [isOpen, setIsOpen] = useControlled(\n expanded,\n Boolean(defaultExpanded)\n );\n\n const [referenceElement, setReferenceElement] =\n useState<HTMLElement \| null>(null);\n const [popperElement, setPopperElement] = useState<HTMLElement \| null>(\n null\n );\n const [popperMaxSize, setPopperMaxSize] = useState<{\n width?: number;\n height?: number;\n }>({});\n\n const handleDropdownHeaderRefProp = useForkRef(\n dropdownHeaderRefProp,\n dropdownHeaderProps?.ref\n );\n const handleDropdownHeaderRef = useForkRef(\n setReferenceElement,\n handleDropdownHeaderRefProp\n );\n\n const ariaRole = role \|\| (component == null ? \"combobox\" : undefined);\n\n const ariaExpanded = ariaExpandedProp ?? (ariaRole ? !!isOpen : undefined);\n\n const id = useUniqueId(idProp, \"hvbasedropdown\");\n const containerId = setId(id, \"children-container\");\n\n const headerControlArias = {\n \"aria-required\": required ?? undefined,\n \"aria-readonly\": readOnly ?? undefined,\n\n \"aria-expanded\": ariaExpanded,\n \"aria-owns\": isOpen ? containerId : undefined,\n \"aria-controls\": isOpen ? containerId : undefined,\n } satisfies AriaAttributes;\n\n const headerAriaLabels = {\n \"aria-label\": ariaLabelProp,\n \"aria-labelledby\": ariaLabelledByProp,\n } satisfies AriaAttributes;\n\n const placement: PopperPlacementType = `bottom-${\n placementProp === \"right\" ? \"start\" : \"end\"\n }`;\n\n const extensionWidth = referenceElement\n ? referenceElement?.offsetWidth\n : \"inherit\";\n\n const { modifiers: popperPropsModifiers = [], ...otherPopperProps } =\n popperProps;\n\n const onFirstUpdate = useCallback(() => {\n onContainerCreation?.(popperElement);\n }, [onContainerCreation, popperElement]);\n\n const widthCalculator = useCallback(\n ({ state }: ModifierArguments<Options>) => {\n state.styles.popper.width = `${state.rects.reference.width}px`;\n },\n []\n );\n\n const widthCalculatorEffect = useCallback(\n ({ state }: ModifierArguments<Options>) => {\n state.elements.popper.style.width = `${\n (state.elements.reference as any).offsetWidth\n }px`;\n },\n []\n );\n\n const applyMaxSizeCalculator = useCallback(\n ({ state }: ModifierArguments<Options>) => {\n // The `maxSize` modifier provides this data\n const { width, height } = state.modifiersData.maxSize;\n if (\n width !== popperMaxSize?.width \|\|\n height !== popperMaxSize?.height\n ) {\n setPopperMaxSize({ width, height });\n }\n\n state.styles.popper = {\n ...state.styles.popper,\n maxWidth: `${width}px`,\n maxHeight: `${height}px`,\n };\n },\n [popperMaxSize]\n );\n\n const maxSizeCalculator = useCallback(\n ({ state, name, options }: ModifierArguments<Options>) => {\n const overflow = detectOverflow(state, options);\n\n const x = state.modifiersData.preventOverflow?.x \|\| 0;\n const y = state.modifiersData.preventOverflow?.y \|\| 0;\n\n const popperWidth = state.rects.popper.width;\n const popperHeight = state.rects.popper.height;\n\n const basePlacement = state.placement.split(\"-\")[0];\n\n const widthProp = basePlacement === \"left\" ? \"left\" : \"right\";\n const heightProp = basePlacement === \"top\" ? \"top\" : \"bottom\";\n\n state.modifiersData[name] = {\n width: popperWidth - overflow[widthProp] - x,\n height: popperHeight - overflow[heightProp] - y,\n };\n },\n []\n );\n\n const modifiers = useMemo<PopperProps[\"modifiers\"]>(\n () => [\n {\n name: \"variableWidth\",\n enabled: !variableWidth,\n phase: \"beforeWrite\",\n requires: [\"computeStyles\"],\n fn: widthCalculator,\n effect: widthCalculatorEffect,\n },\n {\n name: \"maxSize\",\n enabled: true,\n phase: \"main\",\n requiresIfExists: [\"offset\", \"preventOverflow\", \"flip\"],\n fn: maxSizeCalculator,\n },\n {\n name: \"applyMaxSize\",\n enabled: true,\n phase: \"beforeWrite\",\n requires: [\"maxSize\"],\n fn: applyMaxSizeCalculator,\n },\n ...popperPropsModifiers,\n ],\n [\n maxSizeCalculator,\n applyMaxSizeCalculator,\n popperPropsModifiers,\n variableWidth,\n widthCalculator,\n widthCalculatorEffect,\n ]\n );\n\n const { styles: popperStyles, attributes } = usePopper(\n referenceElement,\n popperElement,\n {\n placement,\n modifiers,\n onFirstUpdate,\n ...otherPopperProps,\n }\n );\n\n const popperPlacement =\n attributes.popper?.[\"data-popper-placement\"] ?? \"bottom\";\n\n const handleToggle = useCallback(\n (event) => {\n if (event && !isKey(event, \"Tab\")) {\n event.preventDefault();\n }\n\n const notControlKey =\n !!event?.code &&\n !isOneOfKeys(event, [\"Tab\", \"Enter\", \"Esc\", \"ArrowDown\", \"Space\"]);\n\n const ignoredCombinations =\n (isKey(event, \"Esc\") && !isOpen) \|\|\n (isKey(event, \"ArrowDown\") && isOpen) \|\|\n (isKey(event, \"Tab\") && !isOpen);\n\n if (disabled \|\| notControlKey \|\| ignoredCombinations) return;\n\n const newOpen = !isOpen;\n\n / If about to close focus on the header component. /\n setIsOpen(() => {\n if (!newOpen) {\n // Focus-ring won't be visible even if using the keyboard:\n // https://github.com/WICG/focus-visible/issues/88\n referenceElement?.focus({ preventScroll: true });\n }\n\n return newOpen;\n });\n\n onToggle?.(event, newOpen);\n },\n [isOpen, disabled, setIsOpen, onToggle, referenceElement]\n );\n\n const ExpanderComponent = isOpen ? DropUpXS : DropDownXS;\n\n const defaultHeaderElement = (\n <div\n id={setId(id, \"header\")}\n className={cx(classes.header, {\n [classes.headerDisabled]: disabled,\n [classes.headerReadOnly]: readOnly,\n [classes.headerOpen]: isOpen,\n [classes.headerOpenUp]: isOpen && popperPlacement.includes(\"top\"),\n [classes.headerOpenDown]:\n isOpen && popperPlacement.includes(\"bottom\"),\n })}\n // TODO: review \"textbox\" role\n role={ariaRole === \"combobox\" ? \"textbox\" : undefined}\n {...headerAriaLabels}\n style={disabled \|\| readOnly ? { pointerEvents: \"none\" } : undefined}\n // Removes the element from the navigation sequence for keyboard focus if disabled\n tabIndex={disabled ? -1 : 0}\n ref={handleDropdownHeaderRef}\n {...dropdownHeaderProps}\n >\n <div className={classes.selection}>\n {placeholder && typeof placeholder === \"string\" ? (\n <HvTypography\n className={cx(classes.placeholder, {\n [classes.selectionDisabled]: disabled,\n })}\n variant=\"body\"\n >\n {placeholder}\n </HvTypography>\n ) : (\n placeholder\n )}\n </div>\n <div className={classes.arrowContainer}>\n {adornment \|\| (\n <ExpanderComponent\n iconSize=\"XS\"\n color={disabled ? \"secondary_60\" : undefined}\n className={classes.arrow}\n />\n )}\n </div>\n </div>\n );\n\n const headerElement =\n component && React.isValidElement(component)\n ? React.cloneElement(component as React.ReactElement, {\n ref: handleDropdownHeaderRef,\n ...headerControlArias,\n })\n : defaultHeaderElement;\n\n const containerComponent = (() => {\n /\n Handle keyboard inside children container.\n /\n const handleContainerKeyDown: KeyboardEventHandler = (event) => {\n if (isKey(event, \"Esc\")) {\n handleToggle(event);\n }\n if (isKey(event, \"Tab\") && !event.shiftKey) {\n const focusList = getFirstAndLastFocus(popperElement);\n if (document.activeElement === focusList?.last) {\n event.preventDefault();\n focusList?.first?.focus();\n }\n }\n };\n\n const handleOutside: ClickAwayListenerProps[\"onClickAway\"] = (event) => {\n const isButtonClick = referenceElement?.contains(event.target as any);\n if (!isButtonClick) {\n onClickOutside?.(event);\n setIsOpen(false);\n onToggle?.(event, false);\n }\n };\n\n const container = (\n <div\n ref={setPopperElement}\n className={classes.container}\n style={popperStyles.popper}\n {...attributes.popper}\n >\n <ClickAwayListener onClickAway={handleOutside}>\n {/ eslint-disable-next-line jsx-a11y/no-static-element-interactions */}\n <div onKeyDown={handleContainerKeyDown}>\n {popperPlacement.includes(\"bottom\") && (\n <div\n style={{ width: extensionWidth }}\n className={cx(classes.inputExtensionOpen, {\n [classes.inputExtensionLeftPosition]:\n popperPlacement.includes(\"end\"),\n })}\n />\n )}\n <BaseDropdownContext.Provider value={popperMaxSize}>\n <div\n id={containerId}\n className={cx(classes.panel, {\n [classes.panelOpenedUp]: popperPlacement.includes(\"top\"),\n [classes.panelOpenedDown]:\n popperPlacement.includes(\"bottom\"),\n })}\n >\n {children}\n </div>\n </BaseDropdownContext.Provider>\n {popperPlacement.includes(\"top\") && (\n <div\n style={{ width: extensionWidth }}\n className={cx(\n classes.inputExtensionOpen,\n classes.inputExtensionOpenShadow,\n {\n [classes.inputExtensionFloatRight]:\n popperPlacement.includes(\"end\"),\n [classes.inputExtensionFloatLeft]:\n popperPlacement.includes(\"start\"),\n }\n )}\n />\n )}\n </div>\n </ClickAwayListener>\n </div>\n );\n\n if (disablePortal) return container;\n\n return createPortal(\n container,\n document.getElementById(rootId \|\| \"\") \|\| document.body\n );\n })();\n\n return (\n <div className={classes.root}>\n <div\n ref={ref}\n id={id}\n className={cx(\n classes.anchor,\n { [classes.rootDisabled]: disabled },\n className\n )}\n {...(!readOnly && {\n onKeyDown: handleToggle,\n onClick: handleToggle,\n })}\n {...(ariaRole && {\n role: ariaRole,\n ...headerAriaLabels,\n ...headerControlArias,\n })}\n // Removes the element from the navigation sequence for keyboard focus\n tabIndex={-1}\n {...others}\n >\n {headerElement}\n </div>\n {isOpen && containerComponent}\n </div>\n );\n }\n);\n"],"names":["HvBaseDropdown","forwardRef","props","ref","id","idProp","className","classes","classesProp","children","role","placeholder","component","adornment","expanded","dropdownHeaderProps","defaultExpanded","disabled","readOnly","required","disablePortal","variableWidth","placement","placementProp","ariaExpandedProp","ariaLabelProp","ariaLabelledByProp","popperProps","dropdownHeaderRef","dropdownHeaderRefProp","onToggle","onClickOutside","onContainerCreation","others","useDefaultProps","cx","useClasses","rootId","useTheme","isOpen","setIsOpen","useControlled","Boolean","referenceElement","setReferenceElement","useState","popperElement","setPopperElement","popperMaxSize","setPopperMaxSize","handleDropdownHeaderRefProp","useForkRef","handleDropdownHeaderRef","ariaRole","undefined","ariaExpanded","useUniqueId","containerId","setId","headerControlArias","headerAriaLabels","extensionWidth","offsetWidth","modifiers","popperPropsModifiers","otherPopperProps","onFirstUpdate","useCallback","widthCalculator","state","styles","popper","width","rects","reference","widthCalculatorEffect","elements","style","applyMaxSizeCalculator","height","modifiersData","maxSize","maxWidth","maxHeight","maxSizeCalculator","name","options","overflow","detectOverflow","x","preventOverflow","y","popperWidth","popperHeight","basePlacement","split","widthProp","heightProp","useMemo","enabled","phase","requires","fn","effect","requiresIfExists","popperStyles","attributes","usePopper","popperPlacement","handleToggle","event","isKey","preventDefault","notControlKey","code","isOneOfKeys","ignoredCombinations","newOpen","focus","preventScroll","ExpanderComponent","DropUpXS","DropDownXS","defaultHeaderElement","jsxs","header","headerDisabled","headerReadOnly","headerOpen","headerOpenUp","includes","headerOpenDown","pointerEvents","jsx","selection","HvTypography","selectionDisabled","arrowContainer","arrow","headerElement","React","isValidElement","cloneElement","containerComponent","handleContainerKeyDown","shiftKey","focusList","getFirstAndLastFocus","document","activeElement","last","first","handleOutside","isButtonClick","contains","target","container","ClickAwayListener","inputExtensionOpen","inputExtensionLeftPosition","BaseDropdownContext","panel","panelOpenedUp","panelOpenedDown","inputExtensionOpenShadow","inputExtensionFloatRight","inputExtensionFloatLeft","createPortal","getElementById","body","root","anchor","rootDisabled","onKeyDown","onClick"],"mappings":"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"}
1	+ {"version":3,"file":"BaseDropdown.cjs","sources":["../../../../src/components/BaseDropdown/BaseDropdown.tsx"],"sourcesContent":["import React, {\n useMemo,\n useState,\n useCallback,\n KeyboardEventHandler,\n AriaAttributes,\n forwardRef,\n} from \"react\";\n\nimport { createPortal } from \"react-dom\";\n\nimport {\n ClickAwayListener,\n ClickAwayListenerProps,\n PopperPlacementType,\n PopperProps,\n} from \"@mui/material\";\n\nimport { DropDownXS, DropUpXS } from \"@hitachivantara/uikit-react-icons\";\n\nimport { usePopper } from \"react-popper\";\nimport { detectOverflow, ModifierArguments, Options } from \"@popperjs/core\";\n\nimport { HvTypography } from \"@core/components/Typography\";\nimport { useUniqueId } from \"@core/hooks/useUniqueId\";\nimport { useTheme } from \"@core/hooks/useTheme\";\nimport { useForkRef } from \"@core/hooks/useForkRef\";\nimport { useControlled } from \"@core/hooks/useControlled\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { isKey, isOneOfKeys } from \"@core/utils/keyboardUtils\";\nimport { setId } from \"@core/utils/setId\";\nimport { getFirstAndLastFocus } from \"@core/utils/focusableElementFinder\";\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { ExtractNames } from \"@core/utils/classes\";\n\nimport { staticClasses, useClasses } from \"./BaseDropdown.styles\";\nimport BaseDropdownContext from \"./BaseDropdownContext\";\n\nexport { staticClasses as baseDropdownClasses };\n\nexport type HvBaseDropdownClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvBaseDropdownProps extends HvBaseProps {\n /*\n The role of the element that triggers the popup.\n \n Defaults to \"combobox\" if `component` and the default\n * \"textbox\" header is used, undefined otherwise.\n /\n role?: string;\n /\n Header placeholder.\n /\n placeholder?: React.ReactNode;\n /\n If `true` the dropdown is disabled unable to be interacted, if `false` it is enabled.\n /\n disabled?: boolean;\n /\n If `true` the dropdown will be in read only mode, unable to be interacted.\n /\n readOnly?: boolean;\n /\n Indicates that user input is required on the form element.\n /\n required?: boolean;\n /\n Disable the portal behavior.\n * The children stay within it's parent DOM hierarchy.\n /\n disablePortal?: boolean;\n /\n If `true` the dropdown width depends size of content if `false` the width depends on the header size.\n * Defaults to `false`.\n /\n variableWidth?: boolean;\n /\n If `true` the dropdown starts opened if `false` it starts closed.\n /\n expanded?: boolean;\n /\n When uncontrolled, defines the initial expanded state.\n /\n defaultExpanded?: boolean;\n /\n An object containing props to be wired to the popper component.\n /\n popperProps?: Partial<PopperProps>;\n /\n Placement of the dropdown.\n /\n placement?: \"left\" \| \"right\";\n /\n Replacement for the header component.\n /\n component?: React.ReactNode;\n /\n Adornment to replace the default arrows.\n /\n adornment?: React.ReactNode;\n /\n When dropdown changes the expanded state.\n /\n onToggle?: (event: Event, open: boolean) => void;\n /\n When user click outside the open container.\n /\n onClickOutside?: (event: Event) => void;\n /\n Callback called when the dropdown is opened and ready,\n * commonly used to set focus to the content.\n /\n onContainerCreation?: (container: HTMLElement \| null) => void;\n /\n Attributes applied to the dropdown header element.\n /\n dropdownHeaderProps?: React.DetailedHTMLProps<\n React.HTMLAttributes<HTMLDivElement>,\n HTMLDivElement\n >;\n /\n Pass a ref to the dropdown header element.\n /\n dropdownHeaderRef?: React.Ref<HTMLDivElement>;\n /\n A Jss Object used to override or extend the component styles applied.\n /\n classes?: HvBaseDropdownClasses;\n /* @ignore /\n ref?: React.Ref<HTMLDivElement>;\n}\n\nexport const HvBaseDropdown = forwardRef<HTMLDivElement, HvBaseDropdownProps>(\n (props, ref) => {\n const {\n id: idProp,\n className,\n classes: classesProp,\n children,\n role,\n placeholder,\n component,\n adornment,\n expanded,\n dropdownHeaderProps,\n defaultExpanded,\n disabled,\n readOnly,\n required,\n disablePortal,\n variableWidth,\n placement: placementProp = \"right\",\n \"aria-expanded\": ariaExpandedProp,\n \"aria-label\": ariaLabelProp,\n \"aria-labelledby\": ariaLabelledByProp,\n popperProps = {},\n dropdownHeaderRef: dropdownHeaderRefProp,\n onToggle,\n onClickOutside,\n onContainerCreation,\n ...others\n } = useDefaultProps(\"HvBaseDropdown\", props);\n const { classes, cx } = useClasses(classesProp);\n\n const { rootId } = useTheme();\n\n const [isOpen, setIsOpen] = useControlled(\n expanded,\n Boolean(defaultExpanded)\n );\n\n const [referenceElement, setReferenceElement] =\n useState<HTMLElement \| null>(null);\n const [popperElement, setPopperElement] = useState<HTMLElement \| null>(\n null\n );\n const [popperMaxSize, setPopperMaxSize] = useState<{\n width?: number;\n height?: number;\n }>({});\n\n const handleDropdownHeaderRefProp = useForkRef(\n dropdownHeaderRefProp,\n dropdownHeaderProps?.ref\n );\n const handleDropdownHeaderRef = useForkRef(\n setReferenceElement,\n handleDropdownHeaderRefProp\n );\n\n const ariaRole = role \|\| (component == null ? \"combobox\" : undefined);\n\n const ariaExpanded = ariaExpandedProp ?? (ariaRole ? !!isOpen : undefined);\n\n const id = useUniqueId(idProp, \"hvbasedropdown\");\n const containerId = setId(id, \"children-container\");\n\n const headerControlArias = {\n \"aria-required\": required ?? undefined,\n \"aria-readonly\": readOnly ?? undefined,\n\n \"aria-expanded\": ariaExpanded,\n \"aria-owns\": isOpen ? containerId : undefined,\n \"aria-controls\": isOpen ? containerId : undefined,\n } satisfies AriaAttributes;\n\n const headerAriaLabels = {\n \"aria-label\": ariaLabelProp,\n \"aria-labelledby\": ariaLabelledByProp,\n } satisfies AriaAttributes;\n\n const placement: PopperPlacementType = `bottom-${\n placementProp === \"right\" ? \"start\" : \"end\"\n }`;\n\n const extensionWidth = referenceElement\n ? referenceElement?.offsetWidth\n : \"inherit\";\n\n const { modifiers: popperPropsModifiers = [], ...otherPopperProps } =\n popperProps;\n\n const onFirstUpdate = useCallback(() => {\n onContainerCreation?.(popperElement);\n }, [onContainerCreation, popperElement]);\n\n const widthCalculator = useCallback(\n ({ state }: ModifierArguments<Options>) => {\n state.styles.popper.width = `${state.rects.reference.width}px`;\n },\n []\n );\n\n const widthCalculatorEffect = useCallback(\n ({ state }: ModifierArguments<Options>) => {\n state.elements.popper.style.width = `${\n (state.elements.reference as any).offsetWidth\n }px`;\n },\n []\n );\n\n const applyMaxSizeCalculator = useCallback(\n ({ state }: ModifierArguments<Options>) => {\n // The `maxSize` modifier provides this data\n const { width, height } = state.modifiersData.maxSize;\n if (\n width !== popperMaxSize?.width \|\|\n height !== popperMaxSize?.height\n ) {\n setPopperMaxSize({ width, height });\n }\n\n state.styles.popper = {\n ...state.styles.popper,\n maxWidth: `${width}px`,\n maxHeight: `${height}px`,\n };\n },\n [popperMaxSize]\n );\n\n const maxSizeCalculator = useCallback(\n ({ state, name, options }: ModifierArguments<Options>) => {\n const overflow = detectOverflow(state, options);\n\n const x = state.modifiersData.preventOverflow?.x \|\| 0;\n const y = state.modifiersData.preventOverflow?.y \|\| 0;\n\n const popperWidth = state.rects.popper.width;\n const popperHeight = state.rects.popper.height;\n\n const basePlacement = state.placement.split(\"-\")[0];\n\n const widthProp = basePlacement === \"left\" ? \"left\" : \"right\";\n const heightProp = basePlacement === \"top\" ? \"top\" : \"bottom\";\n\n state.modifiersData[name] = {\n width: popperWidth - overflow[widthProp] - x,\n height: popperHeight - overflow[heightProp] - y,\n };\n },\n []\n );\n\n const modifiers = useMemo<PopperProps[\"modifiers\"]>(\n () => [\n {\n name: \"variableWidth\",\n enabled: !variableWidth,\n phase: \"beforeWrite\",\n requires: [\"computeStyles\"],\n fn: widthCalculator,\n effect: widthCalculatorEffect,\n },\n {\n name: \"maxSize\",\n enabled: true,\n phase: \"main\",\n requiresIfExists: [\"offset\", \"preventOverflow\", \"flip\"],\n fn: maxSizeCalculator,\n },\n {\n name: \"applyMaxSize\",\n enabled: true,\n phase: \"beforeWrite\",\n requires: [\"maxSize\"],\n fn: applyMaxSizeCalculator,\n },\n ...popperPropsModifiers,\n ],\n [\n maxSizeCalculator,\n applyMaxSizeCalculator,\n popperPropsModifiers,\n variableWidth,\n widthCalculator,\n widthCalculatorEffect,\n ]\n );\n\n const { styles: popperStyles, attributes } = usePopper(\n referenceElement,\n popperElement,\n {\n placement,\n modifiers,\n onFirstUpdate,\n ...otherPopperProps,\n }\n );\n\n const popperPlacement =\n attributes.popper?.[\"data-popper-placement\"] ?? \"bottom\";\n\n const handleToggle = useCallback(\n (event) => {\n if (event && !isKey(event, \"Tab\")) {\n event.preventDefault();\n }\n\n const notControlKey =\n !!event?.code &&\n !isOneOfKeys(event, [\"Tab\", \"Enter\", \"Esc\", \"ArrowDown\", \"Space\"]);\n\n const ignoredCombinations =\n (isKey(event, \"Esc\") && !isOpen) \|\|\n (isKey(event, \"ArrowDown\") && isOpen) \|\|\n (isKey(event, \"Tab\") && !isOpen);\n\n if (disabled \|\| notControlKey \|\| ignoredCombinations) return;\n\n const newOpen = !isOpen;\n\n / If about to close focus on the header component. /\n setIsOpen(() => {\n if (!newOpen) {\n // Focus-ring won't be visible even if using the keyboard:\n // https://github.com/WICG/focus-visible/issues/88\n referenceElement?.focus({ preventScroll: true });\n }\n\n return newOpen;\n });\n\n onToggle?.(event, newOpen);\n },\n [isOpen, disabled, setIsOpen, onToggle, referenceElement]\n );\n\n const ExpanderComponent = isOpen ? DropUpXS : DropDownXS;\n\n const defaultHeaderElement = (\n <div\n id={setId(id, \"header\")}\n className={cx(classes.header, {\n [classes.headerDisabled]: disabled,\n [classes.headerReadOnly]: readOnly,\n [classes.headerOpen]: isOpen,\n [classes.headerOpenUp]: isOpen && popperPlacement.includes(\"top\"),\n [classes.headerOpenDown]:\n isOpen && popperPlacement.includes(\"bottom\"),\n })}\n // TODO: review \"textbox\" role\n role={ariaRole === \"combobox\" ? \"textbox\" : undefined}\n {...headerAriaLabels}\n style={disabled \|\| readOnly ? { pointerEvents: \"none\" } : undefined}\n // Removes the element from the navigation sequence for keyboard focus if disabled\n tabIndex={disabled ? -1 : 0}\n ref={handleDropdownHeaderRef}\n {...dropdownHeaderProps}\n >\n <div className={classes.selection}>\n {placeholder && typeof placeholder === \"string\" ? (\n <HvTypography\n className={cx(classes.placeholder, {\n [classes.selectionDisabled]: disabled,\n })}\n variant=\"body\"\n >\n {placeholder}\n </HvTypography>\n ) : (\n placeholder\n )}\n </div>\n <div className={classes.arrowContainer}>\n {adornment \|\| (\n <ExpanderComponent\n iconSize=\"XS\"\n color={disabled ? \"secondary_60\" : undefined}\n className={classes.arrow}\n />\n )}\n </div>\n </div>\n );\n\n const headerElement =\n component && React.isValidElement(component)\n ? React.cloneElement(component as React.ReactElement, {\n ref: handleDropdownHeaderRef,\n ...headerControlArias,\n })\n : defaultHeaderElement;\n\n const containerComponent = (() => {\n /\n Handle keyboard inside children container.\n /\n const handleContainerKeyDown: KeyboardEventHandler = (event) => {\n if (isKey(event, \"Esc\")) {\n handleToggle(event);\n }\n if (isKey(event, \"Tab\") && !event.shiftKey) {\n const focusList = getFirstAndLastFocus(popperElement);\n if (document.activeElement === focusList?.last) {\n event.preventDefault();\n focusList?.first?.focus();\n }\n }\n };\n\n const handleOutside: ClickAwayListenerProps[\"onClickAway\"] = (event) => {\n const isButtonClick = referenceElement?.contains(event.target as any);\n if (!isButtonClick) {\n onClickOutside?.(event);\n setIsOpen(false);\n onToggle?.(event, false);\n }\n };\n\n const container = (\n <div\n ref={setPopperElement}\n className={classes.container}\n style={popperStyles.popper}\n {...attributes.popper}\n >\n <ClickAwayListener onClickAway={handleOutside}>\n {/ eslint-disable-next-line jsx-a11y/no-static-element-interactions */}\n <div onKeyDown={handleContainerKeyDown}>\n {popperPlacement.includes(\"bottom\") && (\n <div\n style={{ width: extensionWidth }}\n className={cx(classes.inputExtensionOpen, {\n [classes.inputExtensionLeftPosition]:\n popperPlacement.includes(\"end\"),\n })}\n />\n )}\n <BaseDropdownContext.Provider value={popperMaxSize}>\n <div\n id={containerId}\n className={cx(classes.panel, {\n [classes.panelOpenedUp]: popperPlacement.includes(\"top\"),\n [classes.panelOpenedDown]:\n popperPlacement.includes(\"bottom\"),\n })}\n >\n {children}\n </div>\n </BaseDropdownContext.Provider>\n {popperPlacement.includes(\"top\") && (\n <div\n style={{ width: extensionWidth }}\n className={cx(\n classes.inputExtensionOpen,\n classes.inputExtensionOpenShadow,\n {\n [classes.inputExtensionFloatRight]:\n popperPlacement.includes(\"end\"),\n [classes.inputExtensionFloatLeft]:\n popperPlacement.includes(\"start\"),\n }\n )}\n />\n )}\n </div>\n </ClickAwayListener>\n </div>\n );\n\n if (disablePortal) return container;\n\n return createPortal(\n container,\n document.getElementById(rootId \|\| \"\") \|\| document.body\n );\n })();\n\n return (\n <div className={classes.root}>\n <div\n ref={ref}\n id={id}\n className={cx(\n classes.anchor,\n { [classes.rootDisabled]: disabled },\n className\n )}\n {...(!readOnly && {\n onKeyDown: handleToggle,\n onClick: handleToggle,\n })}\n {...(ariaRole && {\n role: ariaRole,\n ...headerAriaLabels,\n ...headerControlArias,\n })}\n // Removes the element from the navigation sequence for keyboard focus\n tabIndex={-1}\n {...others}\n >\n {headerElement}\n </div>\n {isOpen && containerComponent}\n </div>\n );\n }\n);\n"],"names":["forwardRef","useDefaultProps","useClasses","useTheme","useControlled","useState","useForkRef","useUniqueId","setId","useCallback","detectOverflow","useMemo","usePopper","isKey","isOneOfKeys","DropUpXS","DropDownXS","jsxs","jsx","HvTypography","React","getFirstAndLastFocus","ClickAwayListener","BaseDropdownContext","createPortal"],"mappings":"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"}

package/dist/cjs/components/BaseDropdown/BaseDropdown.styles.cjs CHANGED Viewed

@@ -3,28 +3,16 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const uikitStyles = require("@hitachivantara/uikit-styles");
 const focusUtils = require("../../utils/focusUtils.cjs");
 const classes = require("../../utils/classes.cjs");
-const {
-  useClasses,
-  staticClasses
-} = classes.createClasses("HvBaseDropdown", {
-  root: {
-    width: "100%",
-    position: "relative"
-  },
+const { useClasses, staticClasses } = classes.createClasses("HvBaseDropdown", {
+  root: { width: "100%", position: "relative" },
   rootDisabled: {
     cursor: "not-allowed",
     "&:focus": {
       outline: "none"
     }
   },
-  anchor: {
-    display: "inline-block",
-    width: "100%"
-  },
-  container: {
-    zIndex: uikitStyles.theme.zIndices.popover,
-    width: "auto"
-  },
+  anchor: { display: "inline-block", width: "100%" },
+  container: { zIndex: uikitStyles.theme.zIndices.popover, width: "auto" },
   header: {
     cursor: "pointer",
     userSelect: "none",
@@ -98,9 +86,7 @@ const {
     ...uikitStyles.theme.typography.body,
     color: uikitStyles.theme.colors.secondary_80
   },
-  selectionDisabled: {
-    color: uikitStyles.theme.colors.secondary_60
-  },
+  selectionDisabled: { color: uikitStyles.theme.colors.secondary_60 },
   panel: {
     position: "relative",
     backgroundColor: uikitStyles.theme.colors.atmo1,
@@ -122,18 +108,12 @@ const {
     borderRight: `1px solid ${uikitStyles.theme.colors.secondary}`,
     borderLeft: `1px solid ${uikitStyles.theme.colors.secondary}`
   },
-  inputExtensionLeftPosition: {
-    marginLeft: "auto"
-  },
+  inputExtensionLeftPosition: { marginLeft: "auto" },
   inputExtensionOpenShadow: {
     boxShadow: `0px 8px 0px ${uikitStyles.theme.colors.atmo1}, 0px 0px 9px 0px rgba(65,65,65,.12)`
   },
-  inputExtensionFloatRight: {
-    float: "right"
-  },
-  inputExtensionFloatLeft: {
-    float: "left"
-  }
+  inputExtensionFloatRight: { float: "right" },
+  inputExtensionFloatLeft: { float: "left" }
 });
 exports.staticClasses = staticClasses;
 exports.useClasses = useClasses;

package/dist/cjs/components/BaseDropdown/BaseDropdown.styles.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"BaseDropdown.styles.cjs","sources":["../../../../src/components/BaseDropdown/BaseDropdown.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { outlineStyles } from \"@core/utils/focusUtils\";\nimport { createClasses } from \"@core/utils/classes\";\n\nexport const { useClasses, staticClasses } = createClasses(\"HvBaseDropdown\", {\n root: { width: \"100%\", position: \"relative\" },\n rootDisabled: {\n cursor: \"not-allowed\",\n \"&:focus\": {\n outline: \"none\",\n },\n },\n anchor: { display: \"inline-block\", width: \"100%\" },\n container: { zIndex: theme.zIndices.popover, width: \"auto\" },\n header: {\n cursor: \"pointer\",\n userSelect: \"none\",\n position: \"relative\",\n background: theme.colors.atmo1,\n boxSizing: \"border-box\",\n border: `1px solid ${theme.colors.secondary}`,\n borderRadius: theme.radii.base,\n \"&:hover\": {\n border: `1px solid ${theme.colors.primary}`,\n },\n \"&:focus\": {\n outline: \"none\",\n },\n \"&:focus-visible\": {\n ...outlineStyles,\n border: `1px solid ${theme.colors.primary}`,\n },\n },\n headerOpen: {\n border: `1px solid ${theme.colors.secondary}`,\n\n \"&:hover\": {\n border: `1px solid ${theme.colors.secondary}`,\n },\n },\n headerOpenUp: {\n borderRadius: `0px 0px ${theme.radii.base} ${theme.radii.base}`,\n },\n headerOpenDown: {\n borderRadius: `${theme.radii.base} ${theme.radii.base} 0px 0px`,\n },\n headerDisabled: {\n cursor: \"not-allowed\",\n pointerEvents: \"none\",\n border: `1px solid ${theme.colors.secondary_60}`,\n background: theme.colors.atmo2,\n \"&:hover\": {\n border: `1px solid ${theme.colors.secondary_60}`,\n },\n },\n headerReadOnly: {\n cursor: \"not-allowed\",\n pointerEvents: \"none\",\n border: `1px solid ${theme.colors.secondary_60}`,\n background: theme.colors.atmo2,\n userSelect: \"text\",\n \"&:focus-visible\": {\n outline: \"none\",\n border: `1px solid ${theme.colors.secondary_60}`,\n },\n },\n arrowContainer: {\n position: \"absolute\",\n pointerEvents: \"none\",\n top: -1,\n right: -1,\n },\n arrow: {},\n selection: {\n display: \"flex\",\n alignItems: \"center\",\n height: \"30px\",\n boxSizing: \"border-box\",\n paddingLeft: theme.space.xs,\n },\n placeholder: {\n display: \"block\",\n overflow: \"hidden\",\n textOverflow: \"ellipsis\",\n whiteSpace: \"nowrap\",\n ...theme.typography.body,\n color: theme.colors.secondary_80,\n },\n selectionDisabled: { color: theme.colors.secondary_60 },\n panel: {\n position: \"relative\",\n\n backgroundColor: theme.colors.atmo1,\n border: `1px solid ${theme.colors.secondary}`,\n },\n panelOpenedUp: {\n top: 1,\n borderRadius: `${theme.radii.base} ${theme.radii.base} 0 0`,\n },\n panelOpenedDown: {\n top: -1,\n borderRadius: `0 0 ${theme.radii.base} ${theme.radii.base}`,\n },\n inputExtensionOpen: {\n height: \"0px\",\n backgroundColor: theme.colors.atmo1,\n borderTop: \"none\",\n borderBottom: \"none\",\n borderRight: `1px solid ${theme.colors.secondary}`,\n borderLeft: `1px solid ${theme.colors.secondary}`,\n },\n inputExtensionLeftPosition: { marginLeft: \"auto\" },\n inputExtensionOpenShadow: {\n boxShadow: `0px 8px 0px ${theme.colors.atmo1}, 0px 0px 9px 0px rgba(65,65,65,.12)`,\n },\n inputExtensionFloatRight: { float: \"right\" },\n inputExtensionFloatLeft: { float: \"left\" },\n});\n"],"names":["~~useClasses","staticClasses","~~createClasses","~~root","width","position","rootDisabled","cursor","outline","anchor","display","container","zIndex","~~theme","~~zIndices","popover","header","userSelect","background","colors","atmo1","boxSizing","border","secondary","borderRadius","radii","base","primary","~~outlineStyles","headerOpen","headerOpenUp","headerOpenDown","headerDisabled","pointerEvents","secondary_60","atmo2","headerReadOnly","arrowContainer","top","right","arrow","selection","alignItems","height","paddingLeft","space","xs","placeholder","overflow","textOverflow","whiteSpace","typography","body","color","secondary_80","selectionDisabled","panel","backgroundColor","panelOpenedUp","panelOpenedDown","inputExtensionOpen","borderTop","borderBottom","borderRight","borderLeft","inputExtensionLeftPosition","marginLeft","inputExtensionOpenShadow","boxShadow","inputExtensionFloatRight","float","inputExtensionFloatLeft"],"mappings":";;;;;~~AAKa~~,~~MAAA;AAAA~~,~~EAAEA;AAAAA~~,~~EAAYC;AAAc~~,~~IAAIC~~,QAAAA,cAAc,kBAAkB;AAAA,~~EAC3EC~~,MAAM~~;AAAA~~,~~IAAEC~~,OAAO~~;AAAA~~,~~IAAQC~~,UAAU~~;AAAA~~,~~EAAW~~;AAAA,~~EAC5CC~~,cAAc;AAAA,~~IACZC~~,QAAQ;AAAA,IACR,WAAW;AAAA,~~MACTC~~,SAAS;AAAA,IACX;AAAA,EACF;AAAA,~~EACAC~~,QAAQ~~;AAAA~~,~~IAAEC~~,SAAS~~;AAAA~~,~~IAAgBN~~,OAAO~~;AAAA~~,~~EAAO~~;AAAA,~~EACjDO~~,WAAW~~;AAAA~~,~~IAAEC~~,QAAQC,~~YAAAA~~,~~MAAMC~~,~~SAASC;AAAAA~~,~~IAASX~~,OAAO;AAAA,~~EAAO;AAAA~~,~~EAC3DY,~~QAAQ;AAAA,~~IACNT~~,QAAQ;AAAA,~~IACRU~~,YAAY;AAAA,~~IACZZ~~,UAAU;AAAA,~~IACVa~~,~~YAAYL~~,YAAAA,~~MAAMM~~,~~OAAOC~~;~~AAAAA~~,~~IACzBC~~,WAAW;AAAA,~~IACXC~~,~~QAAS~~,~~aAAYT~~,~~YAAMM~~,~~MAAAA~~,~~OAAOI~~,~~SAAU~~;AAAA,~~IAC5CC~~,~~cAAcX~~,YAAAA,~~MAAMY~~,~~MAAMC~~;~~AAAAA~~,IAC1B,WAAW;AAAA,~~MACTJ~~,~~QAAS~~,~~aAAYT~~,~~YAAMM~~,~~MAAAA~~,~~OAAOQ~~,~~OAAQ~~;AAAA,~~IAC5C~~;AAAA,IACA,WAAW;AAAA,~~MACTnB~~,SAAS;AAAA,IACX;AAAA,IACA,mBAAmB;AAAA,MACjB,~~GAAGoB~~,~~WAAAA~~;~~AAAAA~~,~~MACHN~~,~~QAAS~~,~~aAAYT~~,~~YAAMM~~,~~MAAAA~~,~~OAAOQ~~,~~OAAQ~~;AAAA,~~IAC5C~~;AAAA,EACF;AAAA,~~EACAE~~,YAAY;AAAA,~~IACVP~~,~~QAAS~~,~~aAAYT~~,~~YAAMM~~,~~MAAAA~~,~~OAAOI~~,~~SAAU~~;AAAA,~~IAE5C~~,WAAW;AAAA,~~MACTD~~,~~QAAS~~,~~aAAYT~~,~~YAAMM~~,~~MAAAA~~,~~OAAOI~~,~~SAAU~~;AAAA,~~IAC9C~~;AAAA,EACF;AAAA,~~EACAO~~,cAAc;AAAA,~~IACZN~~,~~cAAe~~,~~WAAUX~~,YAAAA,~~MAAMY~~,~~MAAMC~~,~~IAAK~~,~~IAAGb~~,~~YAAAA~~,~~MAAMY~~,~~MAAMC~~,~~IAAK~~;AAAA,~~EAChE~~;AAAA,~~EACAK~~,gBAAgB;AAAA,~~IACdP~~,~~cAAe~~,~~GAAEX~~,~~YAAMY~~,~~MAAAA~~,~~MAAMC~~,~~IAAK~~,~~IAAGb~~,~~kBAAMY~~,~~MAAMC~~,~~IAAK~~;AAAA,~~EACxD~~;AAAA,~~EACAM~~,gBAAgB;AAAA,~~IACdzB~~,QAAQ;AAAA,~~IACR0B~~,eAAe;AAAA,~~IACfX~~,~~QAAS~~,~~aAAYT~~,~~YAAMM~~,~~MAAAA~~,~~OAAOe~~,~~YAAa~~;AAAA,~~IAC/ChB~~,~~YAAYL~~,YAAAA,~~MAAMM~~,~~OAAOgB~~;~~AAAAA~~,IACzB,WAAW;AAAA,~~MACTb~~,~~QAAS~~,~~aAAYT~~,~~YAAMM~~,~~MAAAA~~,~~OAAOe~~,~~YAAa~~;AAAA,~~IACjD~~;AAAA,EACF;AAAA,~~EACAE~~,gBAAgB;AAAA,~~IACd7B~~,QAAQ;AAAA,~~IACR0B~~,eAAe;AAAA,~~IACfX~~,~~QAAS~~,~~aAAYT~~,~~YAAMM~~,~~MAAAA~~,~~OAAOe~~,~~YAAa~~;AAAA,~~IAC/ChB~~,~~YAAYL~~,YAAAA,~~MAAMM~~,~~OAAOgB~~;~~AAAAA~~,~~IACzBlB~~,YAAY;AAAA,IACZ,mBAAmB;AAAA,~~MACjBT~~,SAAS;AAAA,~~MACTc~~,~~QAAS~~,~~aAAYT~~,~~YAAMM~~,~~MAAAA~~,~~OAAOe~~,~~YAAa~~;AAAA,~~IACjD~~;AAAA,EACF;AAAA,~~EACAG~~,gBAAgB;AAAA,~~IACdhC~~,UAAU;AAAA,~~IACV4B~~,eAAe;AAAA,~~IACfK~~,KAAK;AAAA,~~IACLC~~,OAAO;AAAA,EACT;AAAA,~~EACAC~~,OAAO,CAAC;AAAA,~~EACRC~~,WAAW;AAAA,IACT/B,SAAS;AAAA,~~IACTgC~~,YAAY;AAAA,~~IACZC~~,QAAQ;AAAA,~~IACRtB~~,WAAW;AAAA,~~IACXuB~~,~~aAAa/B~~,YAAAA,~~MAAMgC~~,~~MAAMC~~;~~AAAAA~~,EAC3B;AAAA,~~EACAC~~,aAAa;AAAA,~~IACXrC~~,SAAS;AAAA,~~IACTsC~~,UAAU;AAAA,~~IACVC~~,cAAc;AAAA,~~IACdC~~,YAAY;AAAA,IACZ,~~GAAGrC~~,YAAAA,~~MAAMsC~~,~~WAAWC~~;~~AAAAA~~,~~IACpBC~~,~~OAAOxC~~,YAAAA,~~MAAMM~~,~~OAAOmC~~;~~AAAAA~~,EACtB;AAAA,~~EACAC~~,mBAAmB~~;AAAA~~,~~IAAEF~~,~~OAAOxC~~,~~YAAAA~~,~~MAAMM~~,~~OAAOe~~;~~AAAAA,EAAa;~~AAAA,~~EACtDsB~~,OAAO;AAAA,~~IACLnD~~,UAAU;AAAA,~~IAEVoD~~,~~iBAAiB5C~~,YAAAA,~~MAAMM~~,~~OAAOC~~;~~AAAAA~~,~~IAC9BE~~,~~QAAS~~,~~aAAYT~~,~~YAAMM~~,~~MAAAA~~,~~OAAOI~~,~~SAAU~~;AAAA,~~EAC9C~~;AAAA,~~EACAmC~~,eAAe;AAAA,~~IACbpB~~,KAAK;AAAA,~~IACLd~~,~~cAAe~~,~~GAAEX~~,~~YAAMY~~,~~MAAAA~~,~~MAAMC~~,~~IAAK~~,~~IAAGb~~,~~kBAAMY~~,~~MAAMC~~,~~IAAK~~;AAAA,~~EACxD~~;AAAA,~~EACAiC~~,iBAAiB;AAAA,~~IACfrB~~,KAAK;AAAA,~~IACLd~~,~~cAAe~~,~~OAAMX~~,YAAAA,~~MAAMY~~,~~MAAMC~~,~~IAAK~~,~~IAAGb~~,~~YAAAA~~,~~MAAMY~~,~~MAAMC~~,~~IAAK~~;AAAA,~~EAC5D~~;AAAA,~~EACAkC~~,oBAAoB;AAAA,~~IAClBjB~~,QAAQ;AAAA,~~IACRc~~,~~iBAAiB5C~~,YAAAA,~~MAAMM~~,~~OAAOC~~;~~AAAAA~~,~~IAC9ByC~~,WAAW;AAAA,~~IACXC~~,cAAc;AAAA,~~IACdC~~,~~aAAc~~,~~aAAYlD~~,~~YAAMM~~,~~MAAAA~~,~~OAAOI~~,~~SAAU~~;AAAA,~~IACjDyC~~,~~YAAa~~,~~aAAYnD~~,~~YAAMM~~,~~MAAAA~~,~~OAAOI~~,~~SAAU~~;AAAA,~~EAClD~~;AAAA,~~EACA0C~~,4BAA4B~~;AAAA~~,~~IAAEC~~,YAAY~~;AAAA~~,~~EAAO~~;AAAA,~~EACjDC~~,0BAA0B;AAAA,~~IACxBC~~,~~WAAY~~,~~eAAcvD~~,YAAAA,~~MAAMM~~,~~OAAOC~~,~~KAAM~~;AAAA,~~EAC/C~~;AAAA,~~EACAiD~~,0BAA0B~~;AAAA~~,~~IAAEC~~,OAAO~~;AAAA~~,~~EAAQ~~;AAAA,~~EAC3CC~~,yBAAyB~~;AAAA~~,~~IAAED~~,OAAO~~;AAAA~~,~~EAAO~~;AAC3C,CAAC;;;"}
1	+ {"version":3,"file":"BaseDropdown.styles.cjs","sources":["../../../../src/components/BaseDropdown/BaseDropdown.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { outlineStyles } from \"@core/utils/focusUtils\";\nimport { createClasses } from \"@core/utils/classes\";\n\nexport const { useClasses, staticClasses } = createClasses(\"HvBaseDropdown\", {\n root: { width: \"100%\", position: \"relative\" },\n rootDisabled: {\n cursor: \"not-allowed\",\n \"&:focus\": {\n outline: \"none\",\n },\n },\n anchor: { display: \"inline-block\", width: \"100%\" },\n container: { zIndex: theme.zIndices.popover, width: \"auto\" },\n header: {\n cursor: \"pointer\",\n userSelect: \"none\",\n position: \"relative\",\n background: theme.colors.atmo1,\n boxSizing: \"border-box\",\n border: `1px solid ${theme.colors.secondary}`,\n borderRadius: theme.radii.base,\n \"&:hover\": {\n border: `1px solid ${theme.colors.primary}`,\n },\n \"&:focus\": {\n outline: \"none\",\n },\n \"&:focus-visible\": {\n ...outlineStyles,\n border: `1px solid ${theme.colors.primary}`,\n },\n },\n headerOpen: {\n border: `1px solid ${theme.colors.secondary}`,\n\n \"&:hover\": {\n border: `1px solid ${theme.colors.secondary}`,\n },\n },\n headerOpenUp: {\n borderRadius: `0px 0px ${theme.radii.base} ${theme.radii.base}`,\n },\n headerOpenDown: {\n borderRadius: `${theme.radii.base} ${theme.radii.base} 0px 0px`,\n },\n headerDisabled: {\n cursor: \"not-allowed\",\n pointerEvents: \"none\",\n border: `1px solid ${theme.colors.secondary_60}`,\n background: theme.colors.atmo2,\n \"&:hover\": {\n border: `1px solid ${theme.colors.secondary_60}`,\n },\n },\n headerReadOnly: {\n cursor: \"not-allowed\",\n pointerEvents: \"none\",\n border: `1px solid ${theme.colors.secondary_60}`,\n background: theme.colors.atmo2,\n userSelect: \"text\",\n \"&:focus-visible\": {\n outline: \"none\",\n border: `1px solid ${theme.colors.secondary_60}`,\n },\n },\n arrowContainer: {\n position: \"absolute\",\n pointerEvents: \"none\",\n top: -1,\n right: -1,\n },\n arrow: {},\n selection: {\n display: \"flex\",\n alignItems: \"center\",\n height: \"30px\",\n boxSizing: \"border-box\",\n paddingLeft: theme.space.xs,\n },\n placeholder: {\n display: \"block\",\n overflow: \"hidden\",\n textOverflow: \"ellipsis\",\n whiteSpace: \"nowrap\",\n ...theme.typography.body,\n color: theme.colors.secondary_80,\n },\n selectionDisabled: { color: theme.colors.secondary_60 },\n panel: {\n position: \"relative\",\n\n backgroundColor: theme.colors.atmo1,\n border: `1px solid ${theme.colors.secondary}`,\n },\n panelOpenedUp: {\n top: 1,\n borderRadius: `${theme.radii.base} ${theme.radii.base} 0 0`,\n },\n panelOpenedDown: {\n top: -1,\n borderRadius: `0 0 ${theme.radii.base} ${theme.radii.base}`,\n },\n inputExtensionOpen: {\n height: \"0px\",\n backgroundColor: theme.colors.atmo1,\n borderTop: \"none\",\n borderBottom: \"none\",\n borderRight: `1px solid ${theme.colors.secondary}`,\n borderLeft: `1px solid ${theme.colors.secondary}`,\n },\n inputExtensionLeftPosition: { marginLeft: \"auto\" },\n inputExtensionOpenShadow: {\n boxShadow: `0px 8px 0px ${theme.colors.atmo1}, 0px 0px 9px 0px rgba(65,65,65,.12)`,\n },\n inputExtensionFloatRight: { float: \"right\" },\n inputExtensionFloatLeft: { float: \"left\" },\n});\n"],"names":["createClasses","theme","outlineStyles"],"mappings":"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"}

package/dist/cjs/components/BaseDropdown/BaseDropdownContext/BaseDropdownContext.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"BaseDropdownContext.cjs","sources":["../../../../../src/components/BaseDropdown/BaseDropdownContext/BaseDropdownContext.tsx"],"sourcesContent":["import React from \"react\";\n\nconst BaseDropdownContext = React.createContext<{\n width?: number;\n height?: number;\n}>({});\n\nBaseDropdownContext.displayName = \"BaseDropdownContext\";\n\nexport default BaseDropdownContext;\n"],"names":["~~BaseDropdownContext","~~React"~~,"createContext","displayName"~~],"mappings":";;;;;AAEA,~~MAAMA~~,~~sBAAsBC~~,~~eAAAA~~,~~QAAMC~~,cAG/B,CAAA,CAAE;~~AAELF~~,~~oBAAoBG~~,cAAc;AAElC,MAAA,~~wBAAeH~~;;"}
1	+ {"version":3,"file":"BaseDropdownContext.cjs","sources":["../../../../../src/components/BaseDropdown/BaseDropdownContext/BaseDropdownContext.tsx"],"sourcesContent":["import React from \"react\";\n\nconst BaseDropdownContext = React.createContext<{\n width?: number;\n height?: number;\n}>({});\n\nBaseDropdownContext.displayName = \"BaseDropdownContext\";\n\nexport default BaseDropdownContext;\n"],"names":["React"],"mappings":";;;;;AAEA,MAAM,sBAAsBA,eAAA,QAAM,cAG/B,CAAA,CAAE;AAEL,oBAAoB,cAAc;AAElC,MAAA,wBAAe;;"}

package/dist/cjs/components/BaseInput/BaseInput.cjs CHANGED Viewed

@@ -10,7 +10,7 @@ const BaseInput_styles = require("./BaseInput.styles.cjs");
 const FormUtils = require("../Forms/FormElement/utils/FormUtils.cjs");
 const FormElementContext = require("../Forms/FormElement/context/FormElementContext.cjs");
 const FormElementDescriptorsContext = require("../Forms/FormElement/context/FormElementDescriptorsContext.cjs");
-const baseInputStyles = /* @__PURE__ */ react.css({
+const baseInputStyles = react.css({
   "input:-webkit-autofill": {
     WebkitBoxShadow: `0 0 0px 1000px ${uikitStyles.theme.colors.atmo1} inset`,
     WebkitTextFillColor: uikitStyles.theme.colors.secondary
@@ -31,7 +31,7 @@ const baseInputStyles = /* @__PURE__ */ react.css({
   "input::-webkit-search-decoration,input::-webkit-search-cancel-button,input::-webkit-search-results-button,input::-webkit-search-results-decoration": {
     display: "none"
   }
-}, process.env.NODE_ENV === "production" ? "" : ";label:baseInputStyles;", process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvQmFzZUlucHV0L0Jhc2VJbnB1dC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBNkJ3QiIsImZpbGUiOiIvaG9tZS9ydW5uZXIvd29yay9odi11aWtpdC1yZWFjdC9odi11aWtpdC1yZWFjdC9wYWNrYWdlcy9jb3JlL3NyYy9jb21wb25lbnRzL0Jhc2VJbnB1dC9CYXNlSW5wdXQudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgdXNlQ29udGV4dCB9IGZyb20gXCJyZWFjdFwiO1xuXG5pbXBvcnQge1xuICBJbnB1dEJhc2VDb21wb25lbnRQcm9wcyBhcyBNdWlJbnB1dEJhc2VDb21wb25lbnRQcm9wcyxcbiAgSW5wdXRQcm9wcyBhcyBNdWlJbnB1dFByb3BzLFxuICBJbnB1dCBhcyBNdWlJbnB1dCxcbiAgSW5wdXRCYXNlUHJvcHMsXG59IGZyb20gXCJAbXVpL21hdGVyaWFsXCI7XG5cbmltcG9ydCB7IGNzcyBhcyBlbW90aW9uQ3NzLCBHbG9iYWwgfSBmcm9tIFwiQGVtb3Rpb24vcmVhY3RcIjtcblxuaW1wb3J0IHsgdGhlbWUgfSBmcm9tIFwiQGhpdGFjaGl2YW50YXJhL3Vpa2l0LXN0eWxlc1wiO1xuXG5pbXBvcnQgeyBFeHRyYWN0TmFtZXMgfSBmcm9tIFwiQGNvcmUvdXRpbHMvY2xhc3Nlc1wiO1xuaW1wb3J0IHtcbiAgSHZGb3JtRWxlbWVudENvbnRleHQsXG4gIEh2Rm9ybUVsZW1lbnREZXNjcmlwdG9yc0NvbnRleHQsXG4gIGJ1aWxkRm9ybUVsZW1lbnRQcm9wc0Zyb21Db250ZXh0LFxuICBidWlsZEFyaWFQcm9wc0Zyb21Db250ZXh0LFxufSBmcm9tIFwiQGNvcmUvY29tcG9uZW50cy9Gb3Jtc1wiO1xuaW1wb3J0IHsgdXNlRGVmYXVsdFByb3BzIH0gZnJvbSBcIkBjb3JlL2hvb2tzL3VzZURlZmF1bHRQcm9wc1wiO1xuXG5pbXBvcnQgeyBzdGF0aWNDbGFzc2VzLCB1c2VDbGFzc2VzIH0gZnJvbSBcIi4vQmFzZUlucHV0LnN0eWxlc1wiO1xuXG5leHBvcnQgeyBzdGF0aWNDbGFzc2VzIGFzIGJhc2VJbnB1dENsYXNzZXMgfTtcblxuZXhwb3J0IHR5cGUgSHZCYXNlSW5wdXRDbGFzc2VzID0gRXh0cmFjdE5hbWVzPHR5cGVvZiB1c2VDbGFzc2VzPjtcblxuLy8gR2xvYmFsIHN0eWxlcyBmb3IgdGhlIGJhc2UgaW5wdXQuXG5jb25zdCBiYXNlSW5wdXRTdHlsZXMgPSBlbW90aW9uQ3NzKHtcbiAgXCJpbnB1dDotd2Via2l0LWF1dG9maWxsXCI6IHtcbiAgICBXZWJraXRCb3hTaGFkb3c6IGAwIDAgMHB4IDEwMDBweCAke3RoZW1lLmNvbG9ycy5hdG1vMX0gaW5zZXRgLFxuICAgIFdlYmtpdFRleHRGaWxsQ29sb3I6IHRoZW1lLmNvbG9ycy5zZWNvbmRhcnksXG4gIH0sXG5cbiAgLy8gQ2xlYXJzIG51bWJlciBpbnB1dCB1cC9kb3duIGFycm93cyBpbiBDaHJvbWUgYW5kIEZpcmVmb3hcbiAgXCJpbnB1dDo6LXdlYmtpdC1vdXRlci1zcGluLWJ1dHRvbixpbnB1dDo6LXdlYmtpdC1pbm5lci1zcGluLWJ1dHRvblwiOiB7XG4gICAgV2Via2l0QXBwZWFyYW5jZTogXCJub25lXCIsXG4gICAgbWFyZ2luOiAwLFxuICB9LFxuICBcImlucHV0W3R5cGU9bnVtYmVyXVwiOiB7XG4gICAgTW96QXBwZWFyYW5jZTogXCJ0ZXh0ZmllbGRcIixcbiAgfSxcblxuICAvLyBDbGVhcnMgdGltZSBpbnB1dCBjbG9jayBpbiBDaHJvbWVcbiAgXCJpbnB1dDo6LXdlYmtpdC1jYWxlbmRhci1waWNrZXItaW5kaWNhdG9yXCI6IHtcbiAgICBkaXNwbGF5OiBcIm5vbmVcIixcbiAgfSxcblxuICAvLyBDbGVhcnMgc2VhcmNoIGlucHV0IGNsZWFyIGJ1dHRvbiBpbiBDaHJvbWVcbiAgXCJpbnB1dDo6LXdlYmtpdC1zZWFyY2gtZGVjb3JhdGlvbixpbnB1dDo6LXdlYmtpdC1zZWFyY2gtY2FuY2VsLWJ1dHRvbixpbnB1dDo6LXdlYmtpdC1zZWFyY2gtcmVzdWx0cy1idXR0b24saW5wdXQ6Oi13ZWJraXQtc2VhcmNoLXJlc3VsdHMtZGVjb3JhdGlvblwiOlxuICAgIHtcbiAgICAgIGRpc3BsYXk6IFwibm9uZVwiLFxuICAgIH0sXG59KTtcblxuZXhwb3J0IGludGVyZmFjZSBIdkJhc2VJbnB1dFByb3BzXG4gIGV4dGVuZHMgT21pdDxNdWlJbnB1dFByb3BzLCBcIm9uQ2hhbmdlXCIgfCBcImNsYXNzZXNcIj4ge1xuICAvKiogVGhlIGlucHV0IG5hbWUuICovXG4gIG5hbWU/OiBzdHJpbmc7XG4gIC8qKiBUaGUgdmFsdWUgb2YgdGhlIGlucHV0LCB3aGVuIGNvbnRyb2xsZWQuICovXG4gIHZhbHVlPzogc3RyaW5nO1xuICAvKiogVGhlIGluaXRpYWwgdmFsdWUgb2YgdGhlIGlucHV0LCB3aGVuIHVuY29udHJvbGxlZC4gKi9cbiAgZGVmYXVsdFZhbHVlPzogc3RyaW5nO1xuICAvKiogSWYgYHRydWVgIHRoZSBpbnB1dCBpcyBkaXNhYmxlZC4gKi9cbiAgZGlzYWJsZWQ/OiBib29sZWFuO1xuICAvKiogSW5kaWNhdGVzIHRoYXQgdGhlIGlucHV0IGlzIG5vdCBlZGl0YWJsZS4gKi9cbiAgcmVhZE9ubHk/OiBib29sZWFuO1xuICAvKiogSWYgdHJ1ZSwgdGhlIGlucHV0IGVsZW1lbnQgd2lsbCBiZSByZXF1aXJlZC4gKi9cbiAgcmVxdWlyZWQ/OiBib29sZWFuO1xuICAvKiogVGhlIGZ1bmN0aW9uIHRoYXQgd2lsbCBiZSBleGVjdXRlZCBvbkNoYW5nZSwgYWxsb3dzIG1vZGlmaWNhdGlvbiBvZiB0aGUgaW5wdXQsXG4gICAqIGl0IHJlY2VpdmVzIHRoZSB2YWx1ZS4gSWYgYSBuZXcgdmFsdWUgc2hvdWxkIGJlIHByZXNlbnRlZCBpdCBtdXN0IHJldHVybmVkIGl0LiAqL1xuICBvbkNoYW5nZT86IChcbiAgICBldmVudDogUmVhY3QuQ2hhbmdlRXZlbnQ8SFRNTElucHV0RWxlbWVudCB8IEhUTUxUZXh0QXJlYUVsZW1lbnQ+LFxuICAgIHZhbHVlOiBzdHJpbmdcbiAgKSA9PiB2b2lkO1xuICAvKiogVGhlIGlucHV0IHR5cGUuICovXG4gIHR5cGU/OiBzdHJpbmc7XG4gIC8qKiBMYWJlbCBpbnNpZGUgdGhlIGlucHV0IHVzZWQgdG8gaGVscCB1c2VyLiAqL1xuICBwbGFjZWhvbGRlcj86IHN0cmluZztcbiAgLyoqIElmIHRydWUsIGEgdGV4dGFyZWEgZWxlbWVudCB3aWxsIGJlIHJlbmRlcmVkLiAqL1xuICBtdWx0aWxpbmU/OiBib29sZWFuO1xuICAvKiogSWYgdHJ1ZSBhbmQgbXVsdGlsaW5lIGlzIGFsc28gdHJ1ZSB0aGUgdGV4dGFyZWEgZWxlbWVudCB3aWxsIGJlIHJlc2l6YWJsZS4gKi9cbiAgcmVzaXphYmxlPzogYm9vbGVhbjtcbiAgLyoqIERlbm90ZXMgaWYgdGhlIGlucHV0IGlzIGluIGFuIGludmFsaWQgc3RhdGUuICovXG4gIGludmFsaWQ/OiBib29sZWFuO1xuICAvKiogQXR0cmlidXRlcyBhcHBsaWVkIHRvIHRoZSBpbnB1dCBlbGVtZW50LiAqL1xuICBpbnB1dFByb3BzPzogTXVpSW5wdXRCYXNlQ29tcG9uZW50UHJvcHM7XG4gIC8qKiBBbGxvd3MgcGFzc2luZyBhIHJlZiB0byB0aGUgdW5kZXJseWluZyBpbnB1dCAqL1xuICBpbnB1dFJlZj86IElucHV0QmFzZVByb3BzW1wiaW5wdXRSZWZcIl07XG4gIC8qKiBBIEpzcyBPYmplY3QgdXNlZCB0byBvdmVycmlkZSBvciBleHRlbmQgdGhlIHN0eWxlcyBhcHBsaWVkIHRvIHRoZSBjb21wb25lbnQuICovXG4gIGNsYXNzZXM/OiBIdkJhc2VJbnB1dENsYXNzZXM7XG59XG5cbi8qKlxuICogQW4gSW5wdXQgY29tcG9uZW50IHRoYXQgb25seSBwb3NzZXMgdGhlIG1vc3QgYmFzaWMgZnVuY3Rpb25hbGl0aWVzLlxuICogSXQgc2hvdWxkIGJlIHVzZWQgYWxvbmdzaWRlIHRoZSBvdGhlciBmb3JtIGVsZW1lbnRzIHRvIGNvbnN0cnVjdCBhIHByb3BlciBhY2Nlc3NpYmxlIGZvcm0uXG4gKi9cbmV4cG9ydCBjb25zdCBIdkJhc2VJbnB1dCA9IChwcm9wczogSHZCYXNlSW5wdXRQcm9wcykgPT4ge1xuICBjb25zdCB7XG4gICAgY2xhc3NlczogY2xhc3Nlc1Byb3AsXG4gICAgY2xhc3NOYW1lID0gXCJcIixcbiAgICBpZCxcbiAgICBuYW1lLFxuICAgIHZhbHVlLFxuICAgIGRlZmF1bHRWYWx1ZSxcbiAgICByZXF1aXJlZCxcbiAgICByZWFkT25seSxcbiAgICBkaXNhYmxlZCxcbiAgICBvbkNoYW5nZSxcbiAgICB0eXBlID0gXCJ0ZXh0XCIsXG4gICAgcGxhY2Vob2xkZXIsXG4gICAgbXVsdGlsaW5lID0gZmFsc2UsXG4gICAgcmVzaXphYmxlID0gZmFsc2UsXG4gICAgaW52YWxpZCA9IGZhbHNlLFxuICAgIGlucHV0UmVmLFxuICAgIGlucHV0UHJvcHMgPSB7fSxcbiAgICAuLi5vdGhlcnNcbiAgfSA9IHVzZURlZmF1bHRQcm9wcyhcIkh2QmFzZUlucHV0XCIsIHByb3BzKTtcbiAgY29uc3QgeyBjbGFzc2VzLCBjeCB9ID0gdXNlQ2xhc3NlcyhjbGFzc2VzUHJvcCk7XG4gIGNvbnN0IGZvcm1FbGVtZW50Q29udGV4dCA9IHVzZUNvbnRleHQoSHZGb3JtRWxlbWVudENvbnRleHQpO1xuICBjb25zdCBmb3JtRWxlbWVudFByb3BzID0gYnVpbGRGb3JtRWxlbWVudFByb3BzRnJvbUNvbnRleHQoXG4gICAgbmFtZSxcbiAgICBkaXNhYmxlZCxcbiAgICByZWFkT25seSxcbiAgICByZXF1aXJlZCxcbiAgICBmb3JtRWxlbWVudENvbnRleHRcbiAgKTtcblxuICBjb25zdCBsb2NhbEludmFsaWQgPSBpbnZhbGlkIHx8IGZvcm1FbGVtZW50UHJvcHMuc3RhdHVzID09PSBcImludmFsaWRcIjtcblxuICBjb25zdCBmb3JtRWxlbWVudERlc2NyaXB0b3JzQ29udGV4dCA9IHVzZUNvbnRleHQoXG4gICAgSHZGb3JtRWxlbWVudERlc2NyaXB0b3JzQ29udGV4dFxuICApO1xuICBjb25zdCBhcmlhUHJvcHMgPSBidWlsZEFyaWFQcm9wc0Zyb21Db250ZXh0KFxuICAgIGlucHV0UHJvcHMsXG4gICAgZm9ybUVsZW1lbnREZXNjcmlwdG9yc0NvbnRleHQsXG4gICAgbG9jYWxJbnZhbGlkLFxuICAgIGlkXG4gICk7XG5cbiAgY29uc3Qgb25DaGFuZ2VIYW5kbGVyOiBNdWlJbnB1dFByb3BzW1wib25DaGFuZ2VcIl0gPSAoZXZlbnQpID0+IHtcbiAgICBvbkNoYW5nZT8uKGV2ZW50LCBldmVudC50YXJnZXQudmFsdWUpO1xuICB9O1xuXG4gIHJldHVybiAoXG4gICAgPD5cbiAgICAgIDxHbG9iYWwgc3R5bGVzPXtiYXNlSW5wdXRTdHlsZXN9IC8+XG4gICAgICA8ZGl2XG4gICAgICAgIGNsYXNzTmFtZT17Y3goY2xhc3Nlcy5yb290LCBjbGFzc05hbWUsIHtcbiAgICAgICAgICBbY2xhc3Nlcy5kaXNhYmxlZF06IGZvcm1FbGVtZW50UHJvcHMuZGlzYWJsZWQsXG4gICAgICAgICAgW2NsYXNzZXMuaW52YWxpZF06IGxvY2FsSW52YWxpZCxcbiAgICAgICAgICBbY2xhc3Nlcy5yZXNpemFibGVdOiBtdWx0aWxpbmUgJiYgcmVzaXphYmxlLFxuICAgICAgICAgIFtjbGFzc2VzLnJlYWRPbmx5XTogZm9ybUVsZW1lbnRQcm9wcy5yZWFkT25seSxcbiAgICAgICAgfSl9XG4gICAgICA+XG4gICAgICAgIDxNdWlJbnB1dFxuICAgICAgICAgIGlkPXtpZH1cbiAgICAgICAgICBuYW1lPXtmb3JtRWxlbWVudFByb3BzLm5hbWV9XG4gICAgICAgICAgdmFsdWU9e3ZhbHVlfVxuICAgICAgICAgIGRlZmF1bHRWYWx1ZT17ZGVmYXVsdFZhbHVlfVxuICAgICAgICAgIHR5cGU9e3R5cGV9XG4gICAgICAgICAgcGxhY2Vob2xkZXI9e3BsYWNlaG9sZGVyfVxuICAgICAgICAgIHJlYWRPbmx5PXshIWZvcm1FbGVtZW50UHJvcHMucmVhZE9ubHl9XG4gICAgICAgICAgZGlzYWJsZWQ9e2Zvcm1FbGVtZW50UHJvcHMuZGlzYWJsZWR9XG4gICAgICAgICAgb25DaGFuZ2U9e29uQ2hhbmdlSGFuZGxlcn1cbiAgICAgICAgICBjbGFzc05hbWU9e2N4KHtcbiAgICAgICAgICAgIFtjbGFzc2VzLmlucHV0Um9vdEludmFsaWRdOiBsb2NhbEludmFsaWQsXG4gICAgICAgICAgICBbY2xhc3Nlcy5pbnB1dFJvb3RSZWFkT25seV06IGZvcm1FbGVtZW50UHJvcHMucmVhZE9ubHksXG4gICAgICAgICAgfSl9XG4gICAgICAgICAgY2xhc3Nlcz17e1xuICAgICAgICAgICAgcm9vdDogY2xhc3Nlcy5pbnB1dFJvb3QsXG4gICAgICAgICAgICBmb2N1c2VkOiBjbGFzc2VzLmlucHV0Um9vdEZvY3VzZWQsXG4gICAgICAgICAgICBkaXNhYmxlZDogY2xhc3Nlcy5pbnB1dFJvb3REaXNhYmxlZCxcbiAgICAgICAgICAgIG11bHRpbGluZTogY2xhc3Nlcy5pbnB1dFJvb3RNdWx0aWxpbmUsXG4gICAgICAgICAgICBpbnB1dDogY3goY2xhc3Nlcy5pbnB1dCwge1xuICAgICAgICAgICAgICBbY2xhc3Nlcy5pbnB1dFJlc2l6YWJsZV06ICFmb3JtRWxlbWVudFByb3BzLmRpc2FibGVkICYmIHJlc2l6YWJsZSxcbiAgICAgICAgICAgICAgW2NsYXNzZXMuaW5wdXREaXNhYmxlZF06IGZvcm1FbGVtZW50UHJvcHMuZGlzYWJsZWQsXG4gICAgICAgICAgICAgIFtjbGFzc2VzLmlucHV0UmVhZE9ubHldOiBmb3JtRWxlbWVudFByb3BzLnJlYWRPbmx5LFxuICAgICAgICAgICAgfSksXG4gICAgICAgICAgfX1cbiAgICAgICAgICBpbnB1dFByb3BzPXt7XG4gICAgICAgICAgICAvLyBBdm9pZCB0aGUgcmVxdWlyZWQgYXR0cmlidXRlIGF0IHRoZSByb290IG5vZGVcbiAgICAgICAgICAgIHJlcXVpcmVkOiBmb3JtRWxlbWVudFByb3BzLnJlcXVpcmVkLFxuICAgICAgICAgICAgLi4uaW5wdXRQcm9wcyxcbiAgICAgICAgICAgIC4uLmFyaWFQcm9wcyxcbiAgICAgICAgICB9fVxuICAgICAgICAgIGlucHV0UmVmPXtpbnB1dFJlZn1cbiAgICAgICAgICBtdWx0aWxpbmU9e211bHRpbGluZX1cbiAgICAgICAgICByb3dzPXsxMH1cbiAgICAgICAgICB7Li4ub3RoZXJzfVxuICAgICAgICAvPlxuICAgICAgICB7IW11bHRpbGluZSAmJiAoXG4gICAgICAgICAgPGRpdiByb2xlPVwicHJlc2VudGF0aW9uXCIgY2xhc3NOYW1lPXtjbGFzc2VzLmlucHV0Qm9yZGVyQ29udGFpbmVyfSAvPlxuICAgICAgICApfVxuICAgICAgPC9kaXY+XG4gICAgPC8+XG4gICk7XG59O1xuIl19 */");
+});
 const HvBaseInput = (props) => {
   const {
     classes: classesProp,
@@ -53,47 +53,83 @@ const HvBaseInput = (props) => {
     inputProps = {},
     ...others
   } = useDefaultProps.useDefaultProps("HvBaseInput", props);
-  const {
-    classes,
-    cx
-  } = BaseInput_styles.useClasses(classesProp);
+  const { classes, cx } = BaseInput_styles.useClasses(classesProp);
   const formElementContext = React.useContext(FormElementContext.HvFormElementContext);
-  const formElementProps = FormUtils.buildFormElementPropsFromContext(name, disabled, readOnly, required, formElementContext);
+  const formElementProps = FormUtils.buildFormElementPropsFromContext(
+    name,
+    disabled,
+    readOnly,
+    required,
+    formElementContext
+  );
   const localInvalid = invalid || formElementProps.status === "invalid";
-  const formElementDescriptorsContext = React.useContext(FormElementDescriptorsContext.HvFormElementDescriptorsContext);
-  const ariaProps = FormUtils.buildAriaPropsFromContext(inputProps, formElementDescriptorsContext, localInvalid, id);
+  const formElementDescriptorsContext = React.useContext(
+    FormElementDescriptorsContext.HvFormElementDescriptorsContext
+  );
+  const ariaProps = FormUtils.buildAriaPropsFromContext(
+    inputProps,
+    formElementDescriptorsContext,
+    localInvalid,
+    id
+  );
   const onChangeHandler = (event) => {
     onChange?.(event, event.target.value);
   };
   return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
     /* @__PURE__ */ jsxRuntime.jsx(react.Global, { styles: baseInputStyles }),
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx(classes.root, className, {
-      [classes.disabled]: formElementProps.disabled,
-      [classes.invalid]: localInvalid,
-      [classes.resizable]: multiline && resizable,
-      [classes.readOnly]: formElementProps.readOnly
-    }), children: [
-      /* @__PURE__ */ jsxRuntime.jsx(material.Input, { id, name: formElementProps.name, value, defaultValue, type, placeholder, readOnly: !!formElementProps.readOnly, disabled: formElementProps.disabled, onChange: onChangeHandler, className: cx({
-        [classes.inputRootInvalid]: localInvalid,
-        [classes.inputRootReadOnly]: formElementProps.readOnly
-      }), classes: {
-        root: classes.inputRoot,
-        focused: classes.inputRootFocused,
-        disabled: classes.inputRootDisabled,
-        multiline: classes.inputRootMultiline,
-        input: cx(classes.input, {
-          [classes.inputResizable]: !formElementProps.disabled && resizable,
-          [classes.inputDisabled]: formElementProps.disabled,
-          [classes.inputReadOnly]: formElementProps.readOnly
-        })
-      }, inputProps: {
-        // Avoid the required attribute at the root node
-        required: formElementProps.required,
-        ...inputProps,
-        ...ariaProps
-      }, inputRef, multiline, rows: 10, ...others }),
-      !multiline && /* @__PURE__ */ jsxRuntime.jsx("div", { role: "presentation", className: classes.inputBorderContainer })
-    ] })
+    /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        className: cx(classes.root, className, {
+          [classes.disabled]: formElementProps.disabled,
+          [classes.invalid]: localInvalid,
+          [classes.resizable]: multiline && resizable,
+          [classes.readOnly]: formElementProps.readOnly
+        }),
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            material.Input,
+            {
+              id,
+              name: formElementProps.name,
+              value,
+              defaultValue,
+              type,
+              placeholder,
+              readOnly: !!formElementProps.readOnly,
+              disabled: formElementProps.disabled,
+              onChange: onChangeHandler,
+              className: cx({
+                [classes.inputRootInvalid]: localInvalid,
+                [classes.inputRootReadOnly]: formElementProps.readOnly
+              }),
+              classes: {
+                root: classes.inputRoot,
+                focused: classes.inputRootFocused,
+                disabled: classes.inputRootDisabled,
+                multiline: classes.inputRootMultiline,
+                input: cx(classes.input, {
+                  [classes.inputResizable]: !formElementProps.disabled && resizable,
+                  [classes.inputDisabled]: formElementProps.disabled,
+                  [classes.inputReadOnly]: formElementProps.readOnly
+                })
+              },
+              inputProps: {
+                // Avoid the required attribute at the root node
+                required: formElementProps.required,
+                ...inputProps,
+                ...ariaProps
+              },
+              inputRef,
+              multiline,
+              rows: 10,
+              ...others
+            }
+          ),
+          !multiline && /* @__PURE__ */ jsxRuntime.jsx("div", { role: "presentation", className: classes.inputBorderContainer })
+        ]
+      }
+    )
   ] });
 };
 exports.baseInputClasses = BaseInput_styles.staticClasses;

package/dist/cjs/components/BaseInput/BaseInput.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"BaseInput.cjs","sources":["../../../../src/components/BaseInput/BaseInput.tsx"],"sourcesContent":["import { useContext } from \"react\";\n\nimport {\n InputBaseComponentProps as MuiInputBaseComponentProps,\n InputProps as MuiInputProps,\n Input as MuiInput,\n InputBaseProps,\n} from \"@mui/material\";\n\nimport { css as emotionCss, Global } from \"@emotion/react\";\n\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { ExtractNames } from \"@core/utils/classes\";\nimport {\n HvFormElementContext,\n HvFormElementDescriptorsContext,\n buildFormElementPropsFromContext,\n buildAriaPropsFromContext,\n} from \"@core/components/Forms\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\n\nimport { staticClasses, useClasses } from \"./BaseInput.styles\";\n\nexport { staticClasses as baseInputClasses };\n\nexport type HvBaseInputClasses = ExtractNames<typeof useClasses>;\n\n// Global styles for the base input.\nconst baseInputStyles = emotionCss({\n \"input:-webkit-autofill\": {\n WebkitBoxShadow: `0 0 0px 1000px ${theme.colors.atmo1} inset`,\n WebkitTextFillColor: theme.colors.secondary,\n },\n\n // Clears number input up/down arrows in Chrome and Firefox\n \"input::-webkit-outer-spin-button,input::-webkit-inner-spin-button\": {\n WebkitAppearance: \"none\",\n margin: 0,\n },\n \"input[type=number]\": {\n MozAppearance: \"textfield\",\n },\n\n // Clears time input clock in Chrome\n \"input::-webkit-calendar-picker-indicator\": {\n display: \"none\",\n },\n\n // Clears search input clear button in Chrome\n \"input::-webkit-search-decoration,input::-webkit-search-cancel-button,input::-webkit-search-results-button,input::-webkit-search-results-decoration\":\n {\n display: \"none\",\n },\n});\n\nexport interface HvBaseInputProps\n extends Omit<MuiInputProps, \"onChange\" \| \"classes\"> {\n /** The input name. /\n name?: string;\n /* The value of the input, when controlled. /\n value?: string;\n /* The initial value of the input, when uncontrolled. /\n defaultValue?: string;\n /* If `true` the input is disabled. /\n disabled?: boolean;\n /* Indicates that the input is not editable. /\n readOnly?: boolean;\n /* If true, the input element will be required. /\n required?: boolean;\n /* The function that will be executed onChange, allows modification of the input,\n * it receives the value. If a new value should be presented it must returned it. /\n onChange?: (\n event: React.ChangeEvent<HTMLInputElement \| HTMLTextAreaElement>,\n value: string\n ) => void;\n /* The input type. /\n type?: string;\n /* Label inside the input used to help user. /\n placeholder?: string;\n /* If true, a textarea element will be rendered. /\n multiline?: boolean;\n /* If true and multiline is also true the textarea element will be resizable. /\n resizable?: boolean;\n /* Denotes if the input is in an invalid state. /\n invalid?: boolean;\n /* Attributes applied to the input element. /\n inputProps?: MuiInputBaseComponentProps;\n /* Allows passing a ref to the underlying input /\n inputRef?: InputBaseProps[\"inputRef\"];\n /* A Jss Object used to override or extend the styles applied to the component. /\n classes?: HvBaseInputClasses;\n}\n\n/\n An Input component that only posses the most basic functionalities.\n * It should be used alongside the other form elements to construct a proper accessible form.\n */\nexport const HvBaseInput = (props: HvBaseInputProps) => {\n const {\n classes: classesProp,\n className = \"\",\n id,\n name,\n value,\n defaultValue,\n required,\n readOnly,\n disabled,\n onChange,\n type = \"text\",\n placeholder,\n multiline = false,\n resizable = false,\n invalid = false,\n inputRef,\n inputProps = {},\n ...others\n } = useDefaultProps(\"HvBaseInput\", props);\n const { classes, cx } = useClasses(classesProp);\n const formElementContext = useContext(HvFormElementContext);\n const formElementProps = buildFormElementPropsFromContext(\n name,\n disabled,\n readOnly,\n required,\n formElementContext\n );\n\n const localInvalid = invalid \|\| formElementProps.status === \"invalid\";\n\n const formElementDescriptorsContext = useContext(\n HvFormElementDescriptorsContext\n );\n const ariaProps = buildAriaPropsFromContext(\n inputProps,\n formElementDescriptorsContext,\n localInvalid,\n id\n );\n\n const onChangeHandler: MuiInputProps[\"onChange\"] = (event) => {\n onChange?.(event, event.target.value);\n };\n\n return (\n <>\n <Global styles={baseInputStyles} />\n <div\n className={cx(classes.root, className, {\n [classes.disabled]: formElementProps.disabled,\n [classes.invalid]: localInvalid,\n [classes.resizable]: multiline && resizable,\n [classes.readOnly]: formElementProps.readOnly,\n })}\n >\n <MuiInput\n id={id}\n name={formElementProps.name}\n value={value}\n defaultValue={defaultValue}\n type={type}\n placeholder={placeholder}\n readOnly={!!formElementProps.readOnly}\n disabled={formElementProps.disabled}\n onChange={onChangeHandler}\n className={cx({\n [classes.inputRootInvalid]: localInvalid,\n [classes.inputRootReadOnly]: formElementProps.readOnly,\n })}\n classes={{\n root: classes.inputRoot,\n focused: classes.inputRootFocused,\n disabled: classes.inputRootDisabled,\n multiline: classes.inputRootMultiline,\n input: cx(classes.input, {\n [classes.inputResizable]: !formElementProps.disabled && resizable,\n [classes.inputDisabled]: formElementProps.disabled,\n [classes.inputReadOnly]: formElementProps.readOnly,\n }),\n }}\n inputProps={{\n // Avoid the required attribute at the root node\n required: formElementProps.required,\n ...inputProps,\n ...ariaProps,\n }}\n inputRef={inputRef}\n multiline={multiline}\n rows={10}\n {...others}\n />\n {!multiline && (\n <div role=\"presentation\" className={classes.inputBorderContainer} />\n )}\n </div>\n </>\n );\n};\n"],"names":["~~baseInputStyles","~~emotionCss","~~WebkitBoxShadow","~~theme","colors","atmo1","WebkitTextFillColor","secondary","WebkitAppearance","margin","MozAppearance","display","process","env","NODE_ENV","HvBaseInput","props","classes","classesProp","className","id","name","value","defaultValue","required","readOnly","disabled","onChange","type","placeholder","multiline","resizable","invalid","inputRef","inputProps","others","useDefaultProps","~~cx","~~useClasses","~~formElementContext","~~useContext","HvFormElementContext","~~formElementProps","~~buildFormElementPropsFromContext","~~localInvalid","status","formElementDescriptorsContext","~~HvFormElementDescriptorsContext","~~ariaProps","~~buildAriaPropsFromContext","~~onChangeHandler","event","target","~~jsxs","Fragment","jsx","Global","~~root","~~MuiInput","inputRootInvalid","inputRootReadOnly","inputRoot","focused","inputRootFocused","inputRootDisabled","inputRootMultiline","input","inputResizable","inputDisabled","inputReadOnly","inputBorderContainer"],"mappings":";;;;;;;;;;;;AA6BA,~~MAAMA~~,~~kBAA6BC~~,~~sBAAAA~~,~~IAAA~~;AAAA,EACjC,0BAA0B;AAAA,~~IACxBC~~,~~iBAAkB~~,~~kBAAiBC~~,YAAAA,~~MAAMC~~,~~OAAOC~~,~~KAAM~~;AAAA,~~IACtDC~~,~~qBAAqBH~~,YAAAA,~~MAAMC~~,~~OAAOG~~;~~AAAAA~~,EACpC;AAAA;AAAA,EAGA,qEAAqE;AAAA,~~IACnEC~~,kBAAkB;AAAA,~~IAClBC~~,QAAQ;AAAA,EACV;AAAA,EACA,sBAAsB;AAAA,~~IACpBC~~,eAAe;AAAA,EACjB;AAAA;AAAA,EAGA,4CAA4C;AAAA,~~IAC1CC~~,SAAS;AAAA,EACX;AAAA;AAAA,EAGA,sJACE;AAAA,~~IACEA~~,SAAS;AAAA,EACX;AACJ,~~GAACC,QAAAC,IAAAC,aAAAF,eAAAA,KAAAA,2BAAAA,QAAAC,IAAAC,aAAC,eAAA,KAAA,qvRAAA~~;~~AA4CWC~~,~~MAAAA~~,~~cAAcA~~,~~CAACC~~,UAA4B;AAChD,QAAA;AAAA,~~IACJC~~,~~SAASC~~;~~AAAAA~~,~~IACTC~~,YAAY;AAAA,~~IACZC~~;~~AAAAA~~,~~IACAC~~;~~AAAAA~~,~~IACAC~~;~~AAAAA~~,~~IACAC~~;~~AAAAA~~,~~IACAC~~;~~AAAAA~~,~~IACAC~~;~~AAAAA~~,~~IACAC~~;~~AAAAA~~,~~IACAC~~;~~AAAAA~~,~~IACAC~~,OAAO;AAAA,~~IACPC~~;~~AAAAA~~,~~IACAC~~,YAAY;AAAA,~~IACZC~~,YAAY;AAAA,~~IACZC~~,UAAU;AAAA,~~IACVC~~;~~AAAAA~~,~~IACAC~~,aAAa,CAAC;AAAA,IACd,~~GAAGC~~;~~AAAAA~~,~~EAAAA~~,IACDC,gBAAgB,gBAAA,~~eAAepB~~,KAAK;~~AAClC~~,~~QAAA;AAAA~~,~~IAAEC;AAAAA~~,~~IAASoB;AAAAA~~,~~EAAAA~~,~~IAAOC~~,~~iBAAAA~~,~~WAAWpB,~~WAAW;~~AACxCqB~~,~~QAAAA~~,qBAAqBC,iBAAWC,mBAAAA,oBAAoB;AAC1D,~~QAAMC~~,mBAAmBC,~~UAAAA~~,~~iCACvBtB~~,~~MACAK~~,~~UACAD~~,~~UACAD~~,~~UACAe~~,~~kBACF~~;~~AAEMK~~,~~QAAAA~~,~~eAAeZ~~,~~WAAWU~~,~~iBAAiBG~~,WAAW;~~AAEtDC~~,~~QAAAA~~,~~gCAAgCN~~,~~iBACpCO~~,~~8BAAAA,+BACF~~;~~AACA~~,~~QAAMC~~,YAAYC,~~UAAAA~~,~~0BAChBf~~,~~YACAY,+BACAF~~,~~cACAxB~~,~~EACF~~;~~AAEA~~,~~QAAM8B~~,~~kBAA8CC~~,~~CAAU~~,~~UAAA~~;~~AACjDA~~,~~eAAAA~~,~~OAAOA~~,~~MAAMC~~,~~OAAO9B~~,KAAK;AAAA,EAAA;AAGtC,~~SAEI+B~~,2BAAA,KAAAC,qBAAA,EAAA,UAAA;AAAA,IAACC,2BAAAA,IAAAC,MAAA,QAAA,EAAO,~~QAAQxD~~,~~gBAAgB~~,CAAA;AAAA,~~oCAC/B~~,~~OACC~~,~~EAAA~~,~~WAAWqC~~,~~GAAGpB~~,~~QAAQwC~~,~~MAAMtC~~,WAAW;AAAA,~~MACrC~~,~~CAACF~~,~~QAAQS~~,QAAQ,~~GAAGgB~~,~~iBAAiBhB~~;~~AAAAA~~,~~MACrC~~,~~CAACT~~,~~QAAQe~~,OAAO,~~GAAGY~~;~~AAAAA~~,~~MACnB~~,~~CAAC3B~~,~~QAAQc~~,SAAS,~~GAAGD~~,~~aAAaC~~;~~AAAAA~~,~~MAClC~~,~~CAACd~~,~~QAAQQ~~,QAAQ,~~GAAGiB~~,~~iBAAiBjB~~;~~AAAAA~~,~~IACtC~~,~~CAAA~~,~~GAED~~,UAAA;AAAA,~~MAAC8B,+BAAAG~~,~~SAAAA~~,~~OAAA~~,~~EACC~~,~~IACA~~,~~MAAMhB~~,~~iBAAiBrB~~,~~MACvB~~,~~OACA~~,cACA,~~MACA~~,~~aACA~~,UAAU,CAAC,~~CAACqB~~,~~iBAAiBjB~~,~~UAC7B~~,~~UAAUiB~~,~~iBAAiBhB~~,~~UAC3B~~,~~UAAUwB~~,~~iBACV~~,~~WAAWb~~,GAAG;AAAA,~~QACZ~~,~~CAACpB~~,~~QAAQ0C~~,gBAAgB,~~GAAGf~~;~~AAAAA~~,~~QAC5B~~,~~CAAC3B~~,~~QAAQ2C~~,iBAAiB,~~GAAGlB~~,~~iBAAiBjB~~;~~AAAAA~~,~~MAC~~/C,~~CAAA~~,~~GACD,~~SAAS;AAAA,~~QACPgC~~,~~MAAMxC~~,~~QAAQ4C~~;~~AAAAA~~,~~QACdC~~,~~SAAS7C~~,~~QAAQ8C~~;~~AAAAA~~,~~QACjBrC~~,~~UAAUT~~,QAAQ+C;~~AAAAA~~,~~QAClBlC~~,~~WAAWb~~,~~QAAQgD~~;~~AAAAA~~,~~QACnBC~~,~~OAAO7B~~,~~GAAGpB~~,~~QAAQiD~~,OAAO;AAAA,~~UACvB~~,~~CAACjD~~,~~QAAQkD~~,cAAc,GAAG,~~CAACzB~~,~~iBAAiBhB~~,~~YAAYK~~;~~AAAAA~~,~~UACxD~~,~~CAACd~~,~~QAAQmD~~,aAAa,~~GAAG1B~~,~~iBAAiBhB~~;~~AAAAA~~,~~UAC1C~~,~~CAACT~~,~~QAAQoD~~,aAAa,~~GAAG3B~~,~~iBAAiBjB~~;~~AAAAA~~,~~QAAAA~~,CAC3C;AAAA,~~SAEH~~,YAAY;AAAA;AAAA,~~QAEVD~~,~~UAAUkB~~,~~iBAAiBlB~~;~~AAAAA~~,~~QAC3B~~,~~GAAGU~~;~~AAAAA~~,~~QACH~~,~~GAAGc~~;~~AAAAA~~,~~MAAAA~~,~~GAEL~~,~~UACA~~,~~WACA~~,MAAM,~~IACFb~~,~~GAAAA~~,~~OAAO~~,~~CAAA~~;AAAA,~~MAEZ~~,~~CAACL~~,~~aACCyB~~,+BAAA,OAAA,EAAI,MAAK,gBAAe,~~WAAWtC~~,~~QAAQqD~~,~~sBAC7C~~;AAAA,~~IAAA~~,~~GACH~~;AAAA,EACF,EAAA,CAAA;AAEJ;;;"}
1	+ {"version":3,"file":"BaseInput.cjs","sources":["../../../../src/components/BaseInput/BaseInput.tsx"],"sourcesContent":["import { useContext } from \"react\";\n\nimport {\n InputBaseComponentProps as MuiInputBaseComponentProps,\n InputProps as MuiInputProps,\n Input as MuiInput,\n InputBaseProps,\n} from \"@mui/material\";\n\nimport { css as emotionCss, Global } from \"@emotion/react\";\n\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { ExtractNames } from \"@core/utils/classes\";\nimport {\n HvFormElementContext,\n HvFormElementDescriptorsContext,\n buildFormElementPropsFromContext,\n buildAriaPropsFromContext,\n} from \"@core/components/Forms\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\n\nimport { staticClasses, useClasses } from \"./BaseInput.styles\";\n\nexport { staticClasses as baseInputClasses };\n\nexport type HvBaseInputClasses = ExtractNames<typeof useClasses>;\n\n// Global styles for the base input.\nconst baseInputStyles = emotionCss({\n \"input:-webkit-autofill\": {\n WebkitBoxShadow: `0 0 0px 1000px ${theme.colors.atmo1} inset`,\n WebkitTextFillColor: theme.colors.secondary,\n },\n\n // Clears number input up/down arrows in Chrome and Firefox\n \"input::-webkit-outer-spin-button,input::-webkit-inner-spin-button\": {\n WebkitAppearance: \"none\",\n margin: 0,\n },\n \"input[type=number]\": {\n MozAppearance: \"textfield\",\n },\n\n // Clears time input clock in Chrome\n \"input::-webkit-calendar-picker-indicator\": {\n display: \"none\",\n },\n\n // Clears search input clear button in Chrome\n \"input::-webkit-search-decoration,input::-webkit-search-cancel-button,input::-webkit-search-results-button,input::-webkit-search-results-decoration\":\n {\n display: \"none\",\n },\n});\n\nexport interface HvBaseInputProps\n extends Omit<MuiInputProps, \"onChange\" \| \"classes\"> {\n /** The input name. /\n name?: string;\n /* The value of the input, when controlled. /\n value?: string;\n /* The initial value of the input, when uncontrolled. /\n defaultValue?: string;\n /* If `true` the input is disabled. /\n disabled?: boolean;\n /* Indicates that the input is not editable. /\n readOnly?: boolean;\n /* If true, the input element will be required. /\n required?: boolean;\n /* The function that will be executed onChange, allows modification of the input,\n * it receives the value. If a new value should be presented it must returned it. /\n onChange?: (\n event: React.ChangeEvent<HTMLInputElement \| HTMLTextAreaElement>,\n value: string\n ) => void;\n /* The input type. /\n type?: string;\n /* Label inside the input used to help user. /\n placeholder?: string;\n /* If true, a textarea element will be rendered. /\n multiline?: boolean;\n /* If true and multiline is also true the textarea element will be resizable. /\n resizable?: boolean;\n /* Denotes if the input is in an invalid state. /\n invalid?: boolean;\n /* Attributes applied to the input element. /\n inputProps?: MuiInputBaseComponentProps;\n /* Allows passing a ref to the underlying input /\n inputRef?: InputBaseProps[\"inputRef\"];\n /* A Jss Object used to override or extend the styles applied to the component. /\n classes?: HvBaseInputClasses;\n}\n\n/\n An Input component that only posses the most basic functionalities.\n * It should be used alongside the other form elements to construct a proper accessible form.\n */\nexport const HvBaseInput = (props: HvBaseInputProps) => {\n const {\n classes: classesProp,\n className = \"\",\n id,\n name,\n value,\n defaultValue,\n required,\n readOnly,\n disabled,\n onChange,\n type = \"text\",\n placeholder,\n multiline = false,\n resizable = false,\n invalid = false,\n inputRef,\n inputProps = {},\n ...others\n } = useDefaultProps(\"HvBaseInput\", props);\n const { classes, cx } = useClasses(classesProp);\n const formElementContext = useContext(HvFormElementContext);\n const formElementProps = buildFormElementPropsFromContext(\n name,\n disabled,\n readOnly,\n required,\n formElementContext\n );\n\n const localInvalid = invalid \|\| formElementProps.status === \"invalid\";\n\n const formElementDescriptorsContext = useContext(\n HvFormElementDescriptorsContext\n );\n const ariaProps = buildAriaPropsFromContext(\n inputProps,\n formElementDescriptorsContext,\n localInvalid,\n id\n );\n\n const onChangeHandler: MuiInputProps[\"onChange\"] = (event) => {\n onChange?.(event, event.target.value);\n };\n\n return (\n <>\n <Global styles={baseInputStyles} />\n <div\n className={cx(classes.root, className, {\n [classes.disabled]: formElementProps.disabled,\n [classes.invalid]: localInvalid,\n [classes.resizable]: multiline && resizable,\n [classes.readOnly]: formElementProps.readOnly,\n })}\n >\n <MuiInput\n id={id}\n name={formElementProps.name}\n value={value}\n defaultValue={defaultValue}\n type={type}\n placeholder={placeholder}\n readOnly={!!formElementProps.readOnly}\n disabled={formElementProps.disabled}\n onChange={onChangeHandler}\n className={cx({\n [classes.inputRootInvalid]: localInvalid,\n [classes.inputRootReadOnly]: formElementProps.readOnly,\n })}\n classes={{\n root: classes.inputRoot,\n focused: classes.inputRootFocused,\n disabled: classes.inputRootDisabled,\n multiline: classes.inputRootMultiline,\n input: cx(classes.input, {\n [classes.inputResizable]: !formElementProps.disabled && resizable,\n [classes.inputDisabled]: formElementProps.disabled,\n [classes.inputReadOnly]: formElementProps.readOnly,\n }),\n }}\n inputProps={{\n // Avoid the required attribute at the root node\n required: formElementProps.required,\n ...inputProps,\n ...ariaProps,\n }}\n inputRef={inputRef}\n multiline={multiline}\n rows={10}\n {...others}\n />\n {!multiline && (\n <div role=\"presentation\" className={classes.inputBorderContainer} />\n )}\n </div>\n </>\n );\n};\n"],"names":["emotionCss","theme","useDefaultProps","useClasses","useContext","HvFormElementContext","buildFormElementPropsFromContext","HvFormElementDescriptorsContext","buildAriaPropsFromContext","jsxs","Fragment","jsx","Global","MuiInput"],"mappings":"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"}

package/dist/cjs/components/BaseInput/BaseInput.styles.cjs CHANGED Viewed

@@ -3,10 +3,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const uikitStyles = require("@hitachivantara/uikit-styles");
 const focusUtils = require("../../utils/focusUtils.cjs");
 const classes = require("../../utils/classes.cjs");
-const {
-  staticClasses,
-  useClasses
-} = classes.createClasses("HvBaseInput", {
+const { staticClasses, useClasses } = classes.createClasses("HvBaseInput", {
   root: {
     display: "inline-block",
     width: "100%",
@@ -71,9 +68,7 @@ const {
       }
     }
   },
-  resizable: {
-    width: "auto"
-  },
+  resizable: { width: "auto" },
   readOnly: {
     "& $inputBorderContainer": {
       backgroundColor: "transparent"
@@ -111,9 +106,7 @@ const {
     left: "2px",
     backgroundColor: uikitStyles.theme.colors.atmo4
   },
-  inputRootInvalid: {
-    borderColor: uikitStyles.theme.colors.negative
-  },
+  inputRootInvalid: { borderColor: uikitStyles.theme.colors.negative },
   inputRootReadOnly: {
     borderColor: uikitStyles.theme.colors.secondary_60,
     backgroundColor: uikitStyles.theme.colors.atmo2
@@ -200,10 +193,7 @@ const {
   inputReadOnly: {
     color: uikitStyles.theme.colors.secondary_80
   },
-  inputResizable: {
-    resize: "both",
-    width: "100%"
-  }
+  inputResizable: { resize: "both", width: "100%" }
 });
 exports.staticClasses = staticClasses;
 exports.useClasses = useClasses;

package/dist/cjs/components/BaseInput/BaseInput.styles.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"BaseInput.styles.cjs","sources":["../../../../src/components/BaseInput/BaseInput.styles.tsx"],"sourcesContent":["import { CSSProperties } from \"react\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { outlineStyles } from \"@core/utils/focusUtils\";\nimport { createClasses } from \"@core/utils/classes\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvBaseInput\", {\n root: {\n display: \"inline-block\",\n width: \"100%\",\n position: \"relative\",\n\n \"&:hover $inputBorderContainer\": {\n backgroundColor: theme.colors.primary,\n },\n\n \"&:focus-within $inputBorderContainer\": {\n backgroundColor: theme.colors.primary,\n },\n },\n disabled: {\n \"& $inputRoot\": {\n backgroundColor: theme.colors.atmo2,\n borderColor: theme.colors.secondary_60,\n },\n\n \"& $inputBorderContainer\": {\n backgroundColor: theme.colors.atmo4,\n },\n\n \"&:hover $inputBorderContainer\": {\n backgroundColor: theme.colors.atmo4,\n },\n\n \"&& $input\": {\n color: theme.colors.secondary_60,\n WebkitTextFillColor: theme.colors.secondary_60,\n },\n\n \"& $inputRootMultiline\": {\n \"& $input\": {\n backgroundColor: theme.colors.atmo2,\n border: `1px solid ${theme.colors.secondary_60}`,\n },\n },\n\n \"&:hover $inputRootMultiline\": {\n \"& $input\": {\n backgroundColor: theme.colors.atmo2,\n border: `1px solid ${theme.colors.secondary_60}`,\n },\n },\n },\n invalid: {\n \"&:not(.disabled)\": {\n \"& $inputBorderContainer\": {\n backgroundColor: theme.colors.negative,\n },\n\n \"&:hover $inputBorderContainer\": {\n backgroundColor: theme.colors.negative,\n },\n\n \"& $inputRootMultiline\": {\n \"& $input\": {\n border: `1px solid ${theme.colors.negative}`,\n },\n },\n\n \"&:hover $inputRootMultiline\": {\n \"& $input\": {\n border: `1px solid ${theme.colors.negative}`,\n },\n },\n\n \"&:focus-within $inputRootMultiline\": {\n \"& $input\": {\n border: `1px solid ${theme.colors.negative}`,\n },\n },\n },\n },\n resizable: { width: \"auto\" },\n readOnly: {\n \"& $inputBorderContainer\": {\n backgroundColor: \"transparent\",\n },\n\n \"&:hover $inputBorderContainer\": {\n backgroundColor: \"transparent\",\n },\n\n \"&:focus-within $inputBorderContainer\": {\n backgroundColor: \"transparent\",\n },\n\n \"& $inputRootMultiline\": {\n \"& $input\": {\n border: `1px solid ${theme.colors.secondary_60}`,\n backgroundColor: theme.colors.atmo2,\n },\n },\n\n \"&:hover $inputRootMultiline\": {\n \"& $input\": {\n border: `1px solid ${theme.colors.secondary_60}`,\n backgroundColor: theme.colors.atmo2,\n },\n },\n\n \"&:focus-within $inputRootMultiline\": {\n \"& $input\": {\n border: `1px solid ${theme.colors.secondary_60}`,\n backgroundColor: theme.colors.atmo2,\n },\n },\n },\n inputBorderContainer: {\n position: \"absolute\",\n width: \"calc(100% - 4px)\",\n height: \"0px\",\n top: \"31px\",\n left: \"2px\",\n backgroundColor: theme.colors.atmo4,\n },\n inputRootInvalid: { borderColor: theme.colors.negative },\n inputRootReadOnly: {\n borderColor: theme.colors.secondary_60,\n backgroundColor: theme.colors.atmo2,\n },\n inputRoot: {\n margin: 0,\n width: \"100%\",\n borderRadius: theme.radii.base,\n height: \"32px\",\n border: `1px solid ${theme.colors.secondary}`,\n boxSizing: \"border-box\",\n backgroundColor: theme.colors.atmo1,\n fontFamily: theme.fontFamily.body,\n\n \"&:hover:not($inputRootDisabled):not($inputRootInvalid):not($inputRootReadOnly)\":\n {\n borderColor: theme.colors.primary,\n },\n\n \"&:hover:not($inputRootDisabled)::before\": {\n borderBottom: \"none\",\n },\n\n \"&::before\": {\n borderBottom: \"none\",\n },\n\n \"&::after\": {\n borderBottom: \"none\",\n },\n },\n inputRootFocused: {\n backgroundColor: theme.colors.atmo1,\n ...outlineStyles,\n\n \"&:hover\": {\n backgroundColor: theme.colors.atmo1,\n },\n\n \"&$inputRootReadOnly\": {\n backgroundColor: theme.colors.atmo2,\n },\n },\n inputRootDisabled: {\n cursor: \"not-allowed\",\n\n \"&&::before\": {\n borderBottomStyle: \"none\",\n },\n },\n inputRootMultiline: {\n padding: 0,\n backgroundColor: \"transparent\",\n overflow: \"auto\",\n border: \"none\",\n height: \"auto\",\n\n \"& $input\": {\n border: `1px solid ${theme.colors.secondary}`,\n borderRadius: theme.radii.base,\n backgroundColor: theme.colors.atmo1,\n height: \"auto\",\n minHeight: \"21px\",\n padding: \"5px 10px\",\n overflow: \"auto\",\n marginLeft: \"0px\",\n marginRight: \"0px\",\n\n \"&:hover\": {\n border: `1px solid ${theme.colors.primary}`,\n },\n },\n },\n input: {\n height: \"19px\",\n marginLeft: theme.space.xs,\n marginRight: theme.space.xs,\n padding: \"6px 0 5px\",\n overflow: \"hidden\",\n textOverflow: \"ellipsis\",\n outline: \"none\",\n width: \"initial\",\n flexGrow: 1,\n ...(theme.typography.body as CSSProperties),\n\n \"&::placeholder\": {\n opacity: 1,\n color: theme.colors.secondary_80,\n },\n\n \"&::-ms-clear\": {\n display: \"none\",\n },\n },\n inputDisabled: {},\n inputReadOnly: {\n color: theme.colors.secondary_80,\n },\n inputResizable: { resize: \"both\", width: \"100%\" },\n});\n"],"names":["staticClasses","useClasses","createClasses","root","display","width","position","backgroundColor","theme","colors","primary","disabled","atmo2","borderColor","secondary_60","atmo4","color","WebkitTextFillColor","border","invalid","negative","resizable","readOnly","inputBorderContainer","height","top","left","inputRootInvalid","inputRootReadOnly","inputRoot","margin","borderRadius","radii","base","secondary","boxSizing","atmo1","fontFamily","body","borderBottom","inputRootFocused","outlineStyles","inputRootDisabled","cursor","borderBottomStyle","inputRootMultiline","padding","overflow","minHeight","marginLeft","marginRight","input","space","xs","textOverflow","outline","flexGrow","typography","opacity","secondary_80","inputDisabled","inputReadOnly","inputResizable","resize"],"mappings":"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"}
1	+ {"version":3,"file":"BaseInput.styles.cjs","sources":["../../../../src/components/BaseInput/BaseInput.styles.tsx"],"sourcesContent":["import { CSSProperties } from \"react\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { outlineStyles } from \"@core/utils/focusUtils\";\nimport { createClasses } from \"@core/utils/classes\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvBaseInput\", {\n root: {\n display: \"inline-block\",\n width: \"100%\",\n position: \"relative\",\n\n \"&:hover $inputBorderContainer\": {\n backgroundColor: theme.colors.primary,\n },\n\n \"&:focus-within $inputBorderContainer\": {\n backgroundColor: theme.colors.primary,\n },\n },\n disabled: {\n \"& $inputRoot\": {\n backgroundColor: theme.colors.atmo2,\n borderColor: theme.colors.secondary_60,\n },\n\n \"& $inputBorderContainer\": {\n backgroundColor: theme.colors.atmo4,\n },\n\n \"&:hover $inputBorderContainer\": {\n backgroundColor: theme.colors.atmo4,\n },\n\n \"&& $input\": {\n color: theme.colors.secondary_60,\n WebkitTextFillColor: theme.colors.secondary_60,\n },\n\n \"& $inputRootMultiline\": {\n \"& $input\": {\n backgroundColor: theme.colors.atmo2,\n border: `1px solid ${theme.colors.secondary_60}`,\n },\n },\n\n \"&:hover $inputRootMultiline\": {\n \"& $input\": {\n backgroundColor: theme.colors.atmo2,\n border: `1px solid ${theme.colors.secondary_60}`,\n },\n },\n },\n invalid: {\n \"&:not(.disabled)\": {\n \"& $inputBorderContainer\": {\n backgroundColor: theme.colors.negative,\n },\n\n \"&:hover $inputBorderContainer\": {\n backgroundColor: theme.colors.negative,\n },\n\n \"& $inputRootMultiline\": {\n \"& $input\": {\n border: `1px solid ${theme.colors.negative}`,\n },\n },\n\n \"&:hover $inputRootMultiline\": {\n \"& $input\": {\n border: `1px solid ${theme.colors.negative}`,\n },\n },\n\n \"&:focus-within $inputRootMultiline\": {\n \"& $input\": {\n border: `1px solid ${theme.colors.negative}`,\n },\n },\n },\n },\n resizable: { width: \"auto\" },\n readOnly: {\n \"& $inputBorderContainer\": {\n backgroundColor: \"transparent\",\n },\n\n \"&:hover $inputBorderContainer\": {\n backgroundColor: \"transparent\",\n },\n\n \"&:focus-within $inputBorderContainer\": {\n backgroundColor: \"transparent\",\n },\n\n \"& $inputRootMultiline\": {\n \"& $input\": {\n border: `1px solid ${theme.colors.secondary_60}`,\n backgroundColor: theme.colors.atmo2,\n },\n },\n\n \"&:hover $inputRootMultiline\": {\n \"& $input\": {\n border: `1px solid ${theme.colors.secondary_60}`,\n backgroundColor: theme.colors.atmo2,\n },\n },\n\n \"&:focus-within $inputRootMultiline\": {\n \"& $input\": {\n border: `1px solid ${theme.colors.secondary_60}`,\n backgroundColor: theme.colors.atmo2,\n },\n },\n },\n inputBorderContainer: {\n position: \"absolute\",\n width: \"calc(100% - 4px)\",\n height: \"0px\",\n top: \"31px\",\n left: \"2px\",\n backgroundColor: theme.colors.atmo4,\n },\n inputRootInvalid: { borderColor: theme.colors.negative },\n inputRootReadOnly: {\n borderColor: theme.colors.secondary_60,\n backgroundColor: theme.colors.atmo2,\n },\n inputRoot: {\n margin: 0,\n width: \"100%\",\n borderRadius: theme.radii.base,\n height: \"32px\",\n border: `1px solid ${theme.colors.secondary}`,\n boxSizing: \"border-box\",\n backgroundColor: theme.colors.atmo1,\n fontFamily: theme.fontFamily.body,\n\n \"&:hover:not($inputRootDisabled):not($inputRootInvalid):not($inputRootReadOnly)\":\n {\n borderColor: theme.colors.primary,\n },\n\n \"&:hover:not($inputRootDisabled)::before\": {\n borderBottom: \"none\",\n },\n\n \"&::before\": {\n borderBottom: \"none\",\n },\n\n \"&::after\": {\n borderBottom: \"none\",\n },\n },\n inputRootFocused: {\n backgroundColor: theme.colors.atmo1,\n ...outlineStyles,\n\n \"&:hover\": {\n backgroundColor: theme.colors.atmo1,\n },\n\n \"&$inputRootReadOnly\": {\n backgroundColor: theme.colors.atmo2,\n },\n },\n inputRootDisabled: {\n cursor: \"not-allowed\",\n\n \"&&::before\": {\n borderBottomStyle: \"none\",\n },\n },\n inputRootMultiline: {\n padding: 0,\n backgroundColor: \"transparent\",\n overflow: \"auto\",\n border: \"none\",\n height: \"auto\",\n\n \"& $input\": {\n border: `1px solid ${theme.colors.secondary}`,\n borderRadius: theme.radii.base,\n backgroundColor: theme.colors.atmo1,\n height: \"auto\",\n minHeight: \"21px\",\n padding: \"5px 10px\",\n overflow: \"auto\",\n marginLeft: \"0px\",\n marginRight: \"0px\",\n\n \"&:hover\": {\n border: `1px solid ${theme.colors.primary}`,\n },\n },\n },\n input: {\n height: \"19px\",\n marginLeft: theme.space.xs,\n marginRight: theme.space.xs,\n padding: \"6px 0 5px\",\n overflow: \"hidden\",\n textOverflow: \"ellipsis\",\n outline: \"none\",\n width: \"initial\",\n flexGrow: 1,\n ...(theme.typography.body as CSSProperties),\n\n \"&::placeholder\": {\n opacity: 1,\n color: theme.colors.secondary_80,\n },\n\n \"&::-ms-clear\": {\n display: \"none\",\n },\n },\n inputDisabled: {},\n inputReadOnly: {\n color: theme.colors.secondary_80,\n },\n inputResizable: { resize: \"both\", width: \"100%\" },\n});\n"],"names":["createClasses","theme","outlineStyles"],"mappings":";;;;;AAMO,MAAM,EAAE,eAAe,eAAeA,QAAAA,cAAc,eAAe;AAAA,EACxE,MAAM;AAAA,IACJ,SAAS;AAAA,IACT,OAAO;AAAA,IACP,UAAU;AAAA,IAEV,iCAAiC;AAAA,MAC/B,iBAAiBC,YAAAA,MAAM,OAAO;AAAA,IAChC;AAAA,IAEA,wCAAwC;AAAA,MACtC,iBAAiBA,YAAAA,MAAM,OAAO;AAAA,IAChC;AAAA,EACF;AAAA,EACA,UAAU;AAAA,IACR,gBAAgB;AAAA,MACd,iBAAiBA,YAAAA,MAAM,OAAO;AAAA,MAC9B,aAAaA,YAAAA,MAAM,OAAO;AAAA,IAC5B;AAAA,IAEA,2BAA2B;AAAA,MACzB,iBAAiBA,YAAAA,MAAM,OAAO;AAAA,IAChC;AAAA,IAEA,iCAAiC;AAAA,MAC/B,iBAAiBA,YAAAA,MAAM,OAAO;AAAA,IAChC;AAAA,IAEA,aAAa;AAAA,MACX,OAAOA,YAAAA,MAAM,OAAO;AAAA,MACpB,qBAAqBA,YAAAA,MAAM,OAAO;AAAA,IACpC;AAAA,IAEA,yBAAyB;AAAA,MACvB,YAAY;AAAA,QACV,iBAAiBA,YAAAA,MAAM,OAAO;AAAA,QAC9B,QAAQ,aAAaA,YAAM,MAAA,OAAO,YAAY;AAAA,MAChD;AAAA,IACF;AAAA,IAEA,+BAA+B;AAAA,MAC7B,YAAY;AAAA,QACV,iBAAiBA,YAAAA,MAAM,OAAO;AAAA,QAC9B,QAAQ,aAAaA,YAAM,MAAA,OAAO,YAAY;AAAA,MAChD;AAAA,IACF;AAAA,EACF;AAAA,EACA,SAAS;AAAA,IACP,oBAAoB;AAAA,MAClB,2BAA2B;AAAA,QACzB,iBAAiBA,YAAAA,MAAM,OAAO;AAAA,MAChC;AAAA,MAEA,iCAAiC;AAAA,QAC/B,iBAAiBA,YAAAA,MAAM,OAAO;AAAA,MAChC;AAAA,MAEA,yBAAyB;AAAA,QACvB,YAAY;AAAA,UACV,QAAQ,aAAaA,YAAM,MAAA,OAAO,QAAQ;AAAA,QAC5C;AAAA,MACF;AAAA,MAEA,+BAA+B;AAAA,QAC7B,YAAY;AAAA,UACV,QAAQ,aAAaA,YAAM,MAAA,OAAO,QAAQ;AAAA,QAC5C;AAAA,MACF;AAAA,MAEA,sCAAsC;AAAA,QACpC,YAAY;AAAA,UACV,QAAQ,aAAaA,YAAM,MAAA,OAAO,QAAQ;AAAA,QAC5C;AAAA,MACF;AAAA,IACF;AAAA,EACF;AAAA,EACA,WAAW,EAAE,OAAO,OAAO;AAAA,EAC3B,UAAU;AAAA,IACR,2BAA2B;AAAA,MACzB,iBAAiB;AAAA,IACnB;AAAA,IAEA,iCAAiC;AAAA,MAC/B,iBAAiB;AAAA,IACnB;AAAA,IAEA,wCAAwC;AAAA,MACtC,iBAAiB;AAAA,IACnB;AAAA,IAEA,yBAAyB;AAAA,MACvB,YAAY;AAAA,QACV,QAAQ,aAAaA,YAAM,MAAA,OAAO,YAAY;AAAA,QAC9C,iBAAiBA,YAAAA,MAAM,OAAO;AAAA,MAChC;AAAA,IACF;AAAA,IAEA,+BAA+B;AAAA,MAC7B,YAAY;AAAA,QACV,QAAQ,aAAaA,YAAM,MAAA,OAAO,YAAY;AAAA,QAC9C,iBAAiBA,YAAAA,MAAM,OAAO;AAAA,MAChC;AAAA,IACF;AAAA,IAEA,sCAAsC;AAAA,MACpC,YAAY;AAAA,QACV,QAAQ,aAAaA,YAAM,MAAA,OAAO,YAAY;AAAA,QAC9C,iBAAiBA,YAAAA,MAAM,OAAO;AAAA,MAChC;AAAA,IACF;AAAA,EACF;AAAA,EACA,sBAAsB;AAAA,IACpB,UAAU;AAAA,IACV,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,KAAK;AAAA,IACL,MAAM;AAAA,IACN,iBAAiBA,YAAAA,MAAM,OAAO;AAAA,EAChC;AAAA,EACA,kBAAkB,EAAE,aAAaA,kBAAM,OAAO,SAAS;AAAA,EACvD,mBAAmB;AAAA,IACjB,aAAaA,YAAAA,MAAM,OAAO;AAAA,IAC1B,iBAAiBA,YAAAA,MAAM,OAAO;AAAA,EAChC;AAAA,EACA,WAAW;AAAA,IACT,QAAQ;AAAA,IACR,OAAO;AAAA,IACP,cAAcA,YAAAA,MAAM,MAAM;AAAA,IAC1B,QAAQ;AAAA,IACR,QAAQ,aAAaA,YAAM,MAAA,OAAO,SAAS;AAAA,IAC3C,WAAW;AAAA,IACX,iBAAiBA,YAAAA,MAAM,OAAO;AAAA,IAC9B,YAAYA,YAAAA,MAAM,WAAW;AAAA,IAE7B,kFACE;AAAA,MACE,aAAaA,YAAAA,MAAM,OAAO;AAAA,IAC5B;AAAA,IAEF,2CAA2C;AAAA,MACzC,cAAc;AAAA,IAChB;AAAA,IAEA,aAAa;AAAA,MACX,cAAc;AAAA,IAChB;AAAA,IAEA,YAAY;AAAA,MACV,cAAc;AAAA,IAChB;AAAA,EACF;AAAA,EACA,kBAAkB;AAAA,IAChB,iBAAiBA,YAAAA,MAAM,OAAO;AAAA,IAC9B,GAAGC,WAAA;AAAA,IAEH,WAAW;AAAA,MACT,iBAAiBD,YAAAA,MAAM,OAAO;AAAA,IAChC;AAAA,IAEA,uBAAuB;AAAA,MACrB,iBAAiBA,YAAAA,MAAM,OAAO;AAAA,IAChC;AAAA,EACF;AAAA,EACA,mBAAmB;AAAA,IACjB,QAAQ;AAAA,IAER,cAAc;AAAA,MACZ,mBAAmB;AAAA,IACrB;AAAA,EACF;AAAA,EACA,oBAAoB;AAAA,IAClB,SAAS;AAAA,IACT,iBAAiB;AAAA,IACjB,UAAU;AAAA,IACV,QAAQ;AAAA,IACR,QAAQ;AAAA,IAER,YAAY;AAAA,MACV,QAAQ,aAAaA,YAAM,MAAA,OAAO,SAAS;AAAA,MAC3C,cAAcA,YAAAA,MAAM,MAAM;AAAA,MAC1B,iBAAiBA,YAAAA,MAAM,OAAO;AAAA,MAC9B,QAAQ;AAAA,MACR,WAAW;AAAA,MACX,SAAS;AAAA,MACT,UAAU;AAAA,MACV,YAAY;AAAA,MACZ,aAAa;AAAA,MAEb,WAAW;AAAA,QACT,QAAQ,aAAaA,YAAM,MAAA,OAAO,OAAO;AAAA,MAC3C;AAAA,IACF;AAAA,EACF;AAAA,EACA,OAAO;AAAA,IACL,QAAQ;AAAA,IACR,YAAYA,YAAAA,MAAM,MAAM;AAAA,IACxB,aAAaA,YAAAA,MAAM,MAAM;AAAA,IACzB,SAAS;AAAA,IACT,UAAU;AAAA,IACV,cAAc;AAAA,IACd,SAAS;AAAA,IACT,OAAO;AAAA,IACP,UAAU;AAAA,IACV,GAAIA,YAAAA,MAAM,WAAW;AAAA,IAErB,kBAAkB;AAAA,MAChB,SAAS;AAAA,MACT,OAAOA,YAAAA,MAAM,OAAO;AAAA,IACtB;AAAA,IAEA,gBAAgB;AAAA,MACd,SAAS;AAAA,IACX;AAAA,EACF;AAAA,EACA,eAAe,CAAC;AAAA,EAChB,eAAe;AAAA,IACb,OAAOA,YAAAA,MAAM,OAAO;AAAA,EACtB;AAAA,EACA,gBAAgB,EAAE,QAAQ,QAAQ,OAAO,OAAO;AAClD,CAAC;;;"}