@hitachivantara/uikit-react-core 5.27.5 → 5.27.6

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 (48) hide show
  1. package/dist/cjs/components/Accordion/Accordion.cjs.map +1 -1
  2. package/dist/cjs/components/Banner/Banner.cjs.map +1 -1
  3. package/dist/cjs/components/Carousel/Carousel.cjs.map +1 -1
  4. package/dist/cjs/components/DatePicker/DatePicker.cjs +1 -1
  5. package/dist/cjs/components/DatePicker/DatePicker.cjs.map +1 -1
  6. package/dist/cjs/components/Dialog/Dialog.cjs.map +1 -1
  7. package/dist/cjs/components/Drawer/Drawer.cjs +1 -1
  8. package/dist/cjs/components/Drawer/Drawer.cjs.map +1 -1
  9. package/dist/cjs/components/Dropdown/Dropdown.cjs.map +1 -1
  10. package/dist/cjs/components/InlineEditor/InlineEditor.styles.cjs +1 -1
  11. package/dist/cjs/components/InlineEditor/InlineEditor.styles.cjs.map +1 -1
  12. package/dist/cjs/components/ListContainer/ListContainer.cjs +1 -1
  13. package/dist/cjs/components/ListContainer/ListContainer.cjs.map +1 -1
  14. package/dist/cjs/components/Loading/Loading.cjs.map +1 -1
  15. package/dist/cjs/components/Radio/Radio.cjs.map +1 -1
  16. package/dist/cjs/components/Snackbar/Snackbar.cjs.map +1 -1
  17. package/dist/cjs/components/Switch/Switch.cjs.map +1 -1
  18. package/dist/cjs/components/Tabs/Tabs.cjs.map +1 -1
  19. package/dist/cjs/components/Tag/Tag.cjs.map +1 -1
  20. package/dist/cjs/components/TextArea/TextArea.cjs.map +1 -1
  21. package/dist/cjs/components/TimePicker/TimePicker.cjs.map +1 -1
  22. package/dist/cjs/components/TimePicker/Unit/Unit.styles.cjs +2 -2
  23. package/dist/cjs/components/TimePicker/Unit/Unit.styles.cjs.map +1 -1
  24. package/dist/esm/components/Accordion/Accordion.js.map +1 -1
  25. package/dist/esm/components/Banner/Banner.js.map +1 -1
  26. package/dist/esm/components/Carousel/Carousel.js.map +1 -1
  27. package/dist/esm/components/DatePicker/DatePicker.js +1 -1
  28. package/dist/esm/components/DatePicker/DatePicker.js.map +1 -1
  29. package/dist/esm/components/Dialog/Dialog.js.map +1 -1
  30. package/dist/esm/components/Drawer/Drawer.js +1 -1
  31. package/dist/esm/components/Drawer/Drawer.js.map +1 -1
  32. package/dist/esm/components/Dropdown/Dropdown.js.map +1 -1
  33. package/dist/esm/components/InlineEditor/InlineEditor.styles.js +1 -1
  34. package/dist/esm/components/InlineEditor/InlineEditor.styles.js.map +1 -1
  35. package/dist/esm/components/ListContainer/ListContainer.js +2 -2
  36. package/dist/esm/components/ListContainer/ListContainer.js.map +1 -1
  37. package/dist/esm/components/Loading/Loading.js.map +1 -1
  38. package/dist/esm/components/Radio/Radio.js.map +1 -1
  39. package/dist/esm/components/Snackbar/Snackbar.js.map +1 -1
  40. package/dist/esm/components/Switch/Switch.js.map +1 -1
  41. package/dist/esm/components/Tabs/Tabs.js.map +1 -1
  42. package/dist/esm/components/Tag/Tag.js.map +1 -1
  43. package/dist/esm/components/TextArea/TextArea.js.map +1 -1
  44. package/dist/esm/components/TimePicker/TimePicker.js.map +1 -1
  45. package/dist/esm/components/TimePicker/Unit/Unit.styles.js +2 -2
  46. package/dist/esm/components/TimePicker/Unit/Unit.styles.js.map +1 -1
  47. package/dist/types/index.d.ts +55 -109
  48. package/package.json +2 -2
@@ -1 +1 @@
1
- {"version":3,"file":"Dropdown.cjs","sources":["../../../../src/components/Dropdown/Dropdown.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from \"react\";\n\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { PopperProps } from \"@mui/material\";\n\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { setId } from \"@core/utils/setId\";\nimport { useLabels, useUniqueId, useControlled } from \"@core/hooks\";\nimport { HvBaseProps } from \"@core/types/generic\";\nimport {\n HvBaseDropdown,\n HvBaseDropdownProps,\n} from \"@core/components/BaseDropdown\";\nimport { HvListValue } from \"@core/components/List\";\nimport {\n isInvalid,\n HvInfoMessage,\n HvWarningText,\n HvFormElement,\n HvLabel,\n} from \"@core/components/Forms\";\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { HvTypography } from \"@core/components/Typography\";\n\nimport { getSelected, getSelectionLabel } from \"./utils\";\nimport { HvDropdownList, HvDropdownListProps } from \"./List\";\nimport { staticClasses, useClasses } from \"./Dropdown.styles\";\nimport { HvDropdownLabelsProps, HvDropdownStatus } from \"./types\";\n\nexport { staticClasses as dropdownClasses };\n\nexport type HvDropdownClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvDropdownProps\n extends HvBaseProps<HTMLDivElement, \"onChange\"> {\n /**\n * Class names to be applied.\n */\n className?: string;\n /**\n * A Jss Object used to override or extend the component styles applied.\n */\n classes?: HvDropdownClasses;\n /**\n * Id to be applied to the form element root node.\n */\n id?: string;\n /**\n * The form element name.\n */\n name?: string;\n /**\n * The label of the form element.\n *\n * The form element must be labeled for accessibility reasons.\n * If not provided, an aria-label or aria-labelledby must be provided instead.\n */\n label?: any;\n /**\n * @ignore\n */\n \"aria-label\"?: string;\n /**\n * @ignore\n */\n \"aria-labelledby\"?: string;\n /**\n * Provide additional descriptive text for the form element.\n */\n description?: any;\n /**\n * @ignore\n */\n \"aria-describedby\"?: string;\n /**\n * The placeholder value when nothing is selected.\n */\n placeholder?: string;\n\n /**\n * Indicates that the form element is disabled.\n */\n disabled?: boolean;\n /**\n * Indicates that the form element is in read only mode.\n */\n readOnly?: boolean;\n /**\n * Indicates that user input is required on the form element.\n */\n required?: boolean;\n /**\n * The status of the form element.\n *\n * Valid is correct, invalid is incorrect and standBy means no validations have run.\n *\n * When uncontrolled and unspecified it will default to \"standBy\" and change to either \"valid\"\n * or \"invalid\" after any change to the state.\n */\n status?: HvDropdownStatus;\n /**\n * The error message to show when the validation status is \"invalid\".\n *\n * Defaults to \"Required\" when the status is uncontrolled and no `aria-errormessage` is provided.\n */\n statusMessage?: any;\n /**\n * Identifies the element that provides an error message for the dropdown.\n *\n * Will only be used when the validation status is invalid.\n */\n \"aria-errormessage\"?: string;\n\n /**\n * The callback fired when the value changes.\n */\n onChange?: (selected: HvListValue | HvListValue[] | undefined) => void;\n\n /**\n * The list to be rendered by the dropdown.\n */\n values?: HvListValue[];\n /**\n * If `true` the dropdown is multiSelect, if `false` the dropdown is single select.\n */\n multiSelect?: boolean;\n /**\n * If `true` the dropdown is rendered with a search bar, if `false` there won't be a search bar.\n */\n showSearch?: 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 * If 'true' the dropdown will notify on the first render.\n */\n notifyChangesOnFirstRender?: boolean;\n /**\n * An object containing all the labels for the dropdown.\n */\n labels?: HvDropdownLabelsProps;\n /**\n * If `true` the dropdown will show tooltips when user mouseenter text in list\n */\n hasTooltips?: 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`, selection can be toggled when single selection.\n */\n singleSelectionToggle?: boolean;\n /**\n * Placement of the dropdown.\n */\n placement?: \"left\" | \"right\";\n /**\n * An object containing props to be wired to the popper component.\n */\n popperProps?: Partial<PopperProps>;\n\n /**\n * Callback called when the user cancels the changes.\n *\n * Called when the cancel button is used and when the user clicks outside the open container.\n *\n * @param {object} event The event source of the callback.\n */\n onCancel?: (event: Event) => void;\n /**\n * Callback called when dropdown changes the expanded state.\n *\n * @param {object} event The event source of the callback.\n * @param {boolean} open If the dropdown new state is open (`true`) or closed (`false`).\n */\n onToggle?: (event: Event, open: boolean) => void;\n /**\n * Callback called when the user clicks outside the open container.\n *\n * @param {object} event The event source of the callback.\n */\n onClickOutside?: (event: Event) => void;\n /**\n * @ignore\n */\n onFocus?: React.FocusEventHandler<any>;\n /**\n * @ignore\n */\n onBlur?: React.FocusEventHandler<any>;\n /**\n * Experimental. Height of the dropdown, in case you want to control it from a prop. Styles can also be used through dropdownListContainer class. Required in case virtualized is used\n */\n height?: number;\n /**\n * Experimental. Height of the dropdown, in case you want to control it from a prop. Styles can also be used through dropdownListContainer class. Required in case virtualized is used\n */\n maxHeight?: number;\n /**\n * Experimental. Uses dropdown in a virtualized form, where not all options are rendered initially. Good for use cases with a lot of options.\n */\n virtualized?: boolean;\n /**\n * Extra props passed to the dropdown.\n */\n baseDropdownProps?: HvBaseDropdownProps;\n /**\n * Extra props passed to the list.\n */\n listProps?: HvDropdownListProps;\n}\n\nconst DEFAULT_LABELS: HvDropdownLabelsProps = {\n select: undefined,\n selectAll: \"All\",\n cancelLabel: \"Cancel\",\n applyLabel: \"Apply\",\n searchPlaceholder: \"Search\",\n multiSelectionConjunction: \"/\",\n};\n\n/**\n * A dropdown list is a graphical control element, similar to a list box, that allows the user to choose one value from a list.\n */\nexport const HvDropdown = (props: HvDropdownProps) => {\n const {\n classes: classesProp,\n className,\n\n id,\n name,\n\n required = false,\n disabled = false,\n readOnly = false,\n\n label,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n description,\n \"aria-describedby\": ariaDescribedBy,\n\n placeholder = \"Select...\",\n\n onChange,\n\n status,\n statusMessage,\n \"aria-errormessage\": ariaErrorMessage,\n\n onCancel,\n onToggle,\n onClickOutside,\n\n onFocus,\n onBlur,\n\n values,\n multiSelect = false,\n showSearch = false,\n expanded,\n defaultExpanded = false,\n notifyChangesOnFirstRender = false,\n labels: labelsProp,\n hasTooltips = false,\n disablePortal = false,\n singleSelectionToggle = true,\n placement,\n variableWidth = false,\n popperProps = {},\n height,\n maxHeight,\n virtualized = false,\n baseDropdownProps = {},\n listProps = {},\n ...others\n } = useDefaultProps(\"HvDropdown\", props);\n\n const { classes, cx, css } = useClasses(classesProp);\n\n const labels = useLabels(DEFAULT_LABELS, labelsProp);\n\n const elementId = useUniqueId(id, \"hvdropdown\");\n\n const [validationState, setValidationState] = useControlled(\n status,\n \"standBy\"\n );\n\n const [validationMessage] = useControlled(statusMessage, \"Required\");\n\n const [isOpen, setIsOpen] = useControlled(expanded, Boolean(defaultExpanded));\n const [selectionLabel, setSelectionLabel] = useState(\n getSelectionLabel(labels, placeholder, multiSelect, values)\n );\n const [internalValues, setInternalValues] = useState(values);\n\n useEffect(() => {\n setInternalValues(values);\n }, [values]);\n\n useEffect(() => {\n setSelectionLabel(\n getSelectionLabel(labels, placeholder, multiSelect, values)\n );\n }, [labels, multiSelect, placeholder, values]);\n\n if (virtualized && !height && process.env.NODE_ENV !== \"production\") {\n // eslint-disable-next-line no-console\n console.error(\n \"Dropdown/List in virtualized mode requires a height. Please define it.\"\n );\n }\n\n const dropdownHeaderRef = useRef<HTMLDivElement>();\n\n const handleToggle: HvBaseDropdownProps[\"onToggle\"] = (event, open) => {\n onToggle?.(event, open);\n\n setIsOpen(open);\n\n if (!open) {\n // also run built-in validation when closing without changes\n // as the user \"touched\" the input\n setValidationState(() => {\n // this will only run if status is uncontrolled\n if (required) {\n const hasSelection = getSelected(internalValues).length > 0;\n\n if (!hasSelection) {\n return \"invalid\";\n }\n }\n\n return \"valid\";\n });\n }\n };\n\n /** Applies the selected values to the state */\n const handleSelection: HvDropdownListProps[\"onChange\"] = (\n listValues,\n commitChanges,\n toggle,\n notifyChanges = true\n ) => {\n const selected = getSelected(listValues);\n\n if (commitChanges) {\n setInternalValues(listValues);\n setSelectionLabel(\n getSelectionLabel(labels, placeholder, multiSelect, listValues)\n );\n\n setValidationState(() => {\n // this will only run if status is uncontrolled\n if (required && selected.length === 0) {\n return \"invalid\";\n }\n\n return \"valid\";\n });\n }\n if (notifyChanges) onChange?.(multiSelect ? selected : selected[0]);\n if (toggle) {\n handleToggle(undefined as any, false);\n\n // focus-ring won't be visible even if using the keyboard:\n // https://github.com/WICG/focus-visible/issues/88\n dropdownHeaderRef.current?.focus({ preventScroll: true });\n }\n };\n\n /**\n * Handles the `Cancel` action. Both single and ranged modes are handled here.\n */\n const handleCancel: HvDropdownListProps[\"onCancel\"] = (evt) => {\n onCancel?.(evt as any);\n\n handleToggle(evt as any, false);\n\n // focus-ring won't be visible even if using the keyboard:\n // https://github.com/WICG/focus-visible/issues/88\n dropdownHeaderRef.current?.focus({ preventScroll: true });\n };\n\n const handleClickOutside: HvBaseDropdownProps[\"onClickOutside\"] = (evt) => {\n onClickOutside?.(evt);\n onCancel?.(evt);\n };\n\n const setFocusToContent: HvBaseDropdownProps[\"onContainerCreation\"] = (\n containerRef\n ) => {\n const inputs = containerRef?.getElementsByTagName(\"input\");\n if (inputs && inputs.length > 0) {\n inputs[0].focus();\n return;\n }\n const listItems =\n containerRef != null ? [...containerRef.getElementsByTagName(\"li\")] : [];\n listItems.every((listItem) => {\n if (listItem.tabIndex >= 0) {\n listItem.focus();\n return false;\n }\n return true;\n });\n };\n\n const buildHeaderLabel = () => {\n const hasSelection = getSelected(internalValues).length > 0;\n return labels?.select || !multiSelect ? (\n <HvTypography\n component=\"div\"\n variant=\"body\"\n className={cx(\n classes.placeholder,\n {\n [classes.selectionDisabled]: disabled,\n },\n !(isOpen || hasSelection) &&\n css({ color: theme.dropdown.placeholderColor })\n )}\n >\n {selectionLabel.selected}\n </HvTypography>\n ) : (\n <HvTypography\n component=\"div\"\n className={cx(classes.placeholder, {\n [classes.selectionDisabled]: disabled,\n })}\n variant=\"body\"\n >\n <b>{selectionLabel.selected}</b>\n {` ${labels?.multiSelectionConjunction} ${selectionLabel.total}`}\n </HvTypography>\n );\n };\n\n const hasLabel = label != null;\n const hasDescription = description != null;\n\n // the error message area will only be created if:\n // - an external element that provides an error message isn't identified via aria-errormessage AND\n // - both status and statusMessage properties are being controlled OR\n // - status is uncontrolled and required is true\n const canShowError =\n ariaErrorMessage == null &&\n ((status !== undefined && statusMessage !== undefined) ||\n (status === undefined && required));\n\n const isStateInvalid = isInvalid(validationState);\n\n let errorMessageId;\n if (isStateInvalid) {\n errorMessageId = canShowError\n ? setId(elementId, \"error\")\n : ariaErrorMessage;\n }\n\n return (\n <HvFormElement\n id={id}\n name={name}\n status={validationState}\n disabled={disabled}\n readOnly={readOnly}\n required={required}\n className={cx(\n classes.root,\n disabled && css({ color: theme.dropdown.disabledColor }),\n className\n )}\n {...others}\n >\n {(hasLabel || hasDescription) && (\n <div className={classes.labelContainer}>\n {hasLabel && (\n <HvLabel\n id={setId(elementId, \"label\")}\n label={label}\n className={classes.label}\n />\n )}\n\n {hasDescription && (\n <HvInfoMessage\n id={setId(elementId, \"description\")}\n className={classes.description}\n >\n {description}\n </HvInfoMessage>\n )}\n </div>\n )}\n <HvBaseDropdown\n id={setId(id, \"dropdown\")}\n classes={{\n root: cx(\n classes.dropdown,\n readOnly &&\n css({\n [`& .${staticClasses.dropdownHeader}`]: {\n border: theme.dropdown.readOnlyBorder,\n backgroundColor: theme.dropdown.readOnlyBackgroundColor,\n },\n })\n ),\n arrow: classes.arrow,\n header: cx(classes.dropdownHeader, {\n [classes.dropdownHeaderInvalid]: isStateInvalid,\n }),\n headerOpen: classes.dropdownHeaderOpen,\n }}\n expanded={isOpen}\n disabled={disabled}\n readOnly={readOnly}\n required={required}\n disablePortal={disablePortal}\n placement={placement}\n popperProps={popperProps}\n placeholder={buildHeaderLabel()}\n onToggle={handleToggle}\n onClickOutside={handleClickOutside}\n onContainerCreation={setFocusToContent}\n role=\"combobox\"\n variableWidth={variableWidth}\n aria-label={ariaLabel}\n aria-labelledby={\n [label && setId(elementId, \"label\"), ariaLabelledBy]\n .join(\" \")\n .trim() || undefined\n }\n aria-invalid={isStateInvalid ? true : undefined}\n aria-errormessage={errorMessageId}\n aria-describedby={\n [description && setId(elementId, \"description\"), ariaDescribedBy]\n .join(\" \")\n .trim() || undefined\n }\n onFocus={onFocus}\n onBlur={onBlur}\n dropdownHeaderRef={dropdownHeaderRef}\n {...baseDropdownProps}\n >\n <HvDropdownList\n id={setId(elementId, \"values\")}\n classes={{\n rootList: classes.rootList,\n dropdownListContainer: classes.dropdownListContainer,\n }}\n values={internalValues}\n multiSelect={multiSelect}\n showSearch={showSearch}\n onChange={handleSelection}\n onCancel={handleCancel}\n labels={labels}\n notifyChangesOnFirstRender={notifyChangesOnFirstRender}\n hasTooltips={hasTooltips}\n singleSelectionToggle={singleSelectionToggle}\n aria-label={ariaLabel}\n aria-labelledby={hasLabel ? setId(elementId, \"label\") : undefined}\n height={height}\n maxHeight={maxHeight}\n virtualized={virtualized}\n {...listProps}\n />\n </HvBaseDropdown>\n {canShowError && (\n <HvWarningText\n id={setId(elementId, \"error\")}\n disableBorder\n className={classes.error}\n >\n {validationMessage}\n </HvWarningText>\n )}\n </HvFormElement>\n );\n};\n"],"names":["DEFAULT_LABELS","select","undefined","selectAll","cancelLabel","applyLabel","searchPlaceholder","multiSelectionConjunction","HvDropdown","props","classes","classesProp","className","id","name","required","disabled","readOnly","label","ariaLabel","ariaLabelledBy","description","ariaDescribedBy","placeholder","onChange","status","statusMessage","ariaErrorMessage","onCancel","onToggle","onClickOutside","onFocus","onBlur","values","multiSelect","showSearch","expanded","defaultExpanded","notifyChangesOnFirstRender","labels","labelsProp","hasTooltips","disablePortal","singleSelectionToggle","placement","variableWidth","popperProps","height","maxHeight","virtualized","baseDropdownProps","listProps","others","useDefaultProps","cx","css","useClasses","useLabels","elementId","useUniqueId","validationState","setValidationState","useControlled","validationMessage","isOpen","setIsOpen","Boolean","selectionLabel","setSelectionLabel","useState","getSelectionLabel","internalValues","setInternalValues","useEffect","process","env","NODE_ENV","console","error","dropdownHeaderRef","useRef","handleToggle","event","open","hasSelection","getSelected","length","handleSelection","listValues","commitChanges","toggle","notifyChanges","selected","current","focus","preventScroll","handleCancel","evt","handleClickOutside","setFocusToContent","containerRef","inputs","getElementsByTagName","listItems","every","listItem","tabIndex","buildHeaderLabel","HvTypography","component","variant","selectionDisabled","color","theme","dropdown","placeholderColor","children","_jsxs","_jsx","total","hasLabel","hasDescription","canShowError","isStateInvalid","isInvalid","errorMessageId","setId","HvFormElement","root","disabledColor","labelContainer","HvLabel","HvInfoMessage","HvBaseDropdown","staticClasses","dropdownHeader","border","readOnlyBorder","backgroundColor","readOnlyBackgroundColor","arrow","header","dropdownHeaderInvalid","headerOpen","dropdownHeaderOpen","onContainerCreation","role","join","trim","HvDropdownList","rootList","dropdownListContainer","HvWarningText","disableBorder"],"mappings":"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"}
1
+ {"version":3,"file":"Dropdown.cjs","sources":["../../../../src/components/Dropdown/Dropdown.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from \"react\";\n\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { PopperProps } from \"@mui/material\";\n\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { setId } from \"@core/utils/setId\";\nimport { useLabels, useUniqueId, useControlled } from \"@core/hooks\";\nimport { HvBaseProps } from \"@core/types/generic\";\nimport {\n HvBaseDropdown,\n HvBaseDropdownProps,\n} from \"@core/components/BaseDropdown\";\nimport { HvListValue } from \"@core/components/List\";\nimport {\n isInvalid,\n HvInfoMessage,\n HvWarningText,\n HvFormElement,\n HvLabel,\n} from \"@core/components/Forms\";\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { HvTypography } from \"@core/components/Typography\";\n\nimport { getSelected, getSelectionLabel } from \"./utils\";\nimport { HvDropdownList, HvDropdownListProps } from \"./List\";\nimport { staticClasses, useClasses } from \"./Dropdown.styles\";\nimport { HvDropdownLabelsProps, HvDropdownStatus } from \"./types\";\n\nexport { staticClasses as dropdownClasses };\n\nexport type HvDropdownClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvDropdownProps\n extends HvBaseProps<HTMLDivElement, \"onChange\"> {\n /**\n * A Jss Object used to override or extend the component styles applied.\n */\n classes?: HvDropdownClasses;\n /**\n * The form element name.\n */\n name?: string;\n /**\n * The label of the form element.\n *\n * The form element must be labeled for accessibility reasons.\n * If not provided, an aria-label or aria-labelledby must be provided instead.\n */\n label?: any;\n /**\n * Provide additional descriptive text for the form element.\n */\n description?: any;\n /**\n * The placeholder value when nothing is selected.\n */\n placeholder?: string;\n /**\n * Indicates that the form element is disabled.\n */\n disabled?: boolean;\n /**\n * Indicates that the form element is in read only mode.\n */\n readOnly?: boolean;\n /**\n * Indicates that user input is required on the form element.\n */\n required?: boolean;\n /**\n * The status of the form element.\n *\n * Valid is correct, invalid is incorrect and standBy means no validations have run.\n *\n * When uncontrolled and unspecified it will default to \"standBy\" and change to either \"valid\"\n * or \"invalid\" after any change to the state.\n */\n status?: HvDropdownStatus;\n /**\n * The error message to show when the validation status is \"invalid\".\n *\n * Defaults to \"Required\" when the status is uncontrolled and no `aria-errormessage` is provided.\n */\n statusMessage?: any;\n /**\n * Identifies the element that provides an error message for the dropdown.\n *\n * Will only be used when the validation status is invalid.\n */\n \"aria-errormessage\"?: string;\n /**\n * The callback fired when the value changes.\n */\n onChange?: (selected: HvListValue | HvListValue[] | undefined) => void;\n /**\n * The list to be rendered by the dropdown.\n */\n values?: HvListValue[];\n /**\n * If `true` the dropdown is multiSelect, if `false` the dropdown is single select.\n */\n multiSelect?: boolean;\n /**\n * If `true` the dropdown is rendered with a search bar, if `false` there won't be a search bar.\n */\n showSearch?: 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 * If 'true' the dropdown will notify on the first render.\n */\n notifyChangesOnFirstRender?: boolean;\n /**\n * An object containing all the labels for the dropdown.\n */\n labels?: HvDropdownLabelsProps;\n /**\n * If `true` the dropdown will show tooltips when user mouseenter text in list\n */\n hasTooltips?: 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`, selection can be toggled when single selection.\n */\n singleSelectionToggle?: boolean;\n /**\n * Placement of the dropdown.\n */\n placement?: \"left\" | \"right\";\n /**\n * An object containing props to be wired to the popper component.\n */\n popperProps?: Partial<PopperProps>;\n /**\n * Callback called when the user cancels the changes.\n *\n * Called when the cancel button is used and when the user clicks outside the open container.\n *\n * @param {object} event The event source of the callback.\n */\n onCancel?: (event: Event) => void;\n /**\n * Callback called when dropdown changes the expanded state.\n *\n * @param {object} event The event source of the callback.\n * @param {boolean} open If the dropdown new state is open (`true`) or closed (`false`).\n */\n onToggle?: (event: Event, open: boolean) => void;\n /**\n * Callback called when the user clicks outside the open container.\n *\n * @param {object} event The event source of the callback.\n */\n onClickOutside?: (event: Event) => void;\n /**\n * @ignore\n */\n onFocus?: React.FocusEventHandler<any>;\n /**\n * @ignore\n */\n onBlur?: React.FocusEventHandler<any>;\n /**\n * Experimental. Height of the dropdown, in case you want to control it from a prop. Styles can also be used through dropdownListContainer class. Required in case virtualized is used\n */\n height?: number;\n /**\n * Experimental. Height of the dropdown, in case you want to control it from a prop. Styles can also be used through dropdownListContainer class. Required in case virtualized is used\n */\n maxHeight?: number;\n /**\n * Experimental. Uses dropdown in a virtualized form, where not all options are rendered initially. Good for use cases with a lot of options.\n */\n virtualized?: boolean;\n /**\n * Extra props passed to the dropdown.\n */\n baseDropdownProps?: HvBaseDropdownProps;\n /**\n * Extra props passed to the list.\n */\n listProps?: HvDropdownListProps;\n}\n\nconst DEFAULT_LABELS: HvDropdownLabelsProps = {\n select: undefined,\n selectAll: \"All\",\n cancelLabel: \"Cancel\",\n applyLabel: \"Apply\",\n searchPlaceholder: \"Search\",\n multiSelectionConjunction: \"/\",\n};\n\n/**\n * A dropdown list is a graphical control element, similar to a list box, that allows the user to choose one value from a list.\n */\nexport const HvDropdown = (props: HvDropdownProps) => {\n const {\n classes: classesProp,\n className,\n\n id,\n name,\n\n required = false,\n disabled = false,\n readOnly = false,\n\n label,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n description,\n \"aria-describedby\": ariaDescribedBy,\n\n placeholder = \"Select...\",\n\n onChange,\n\n status,\n statusMessage,\n \"aria-errormessage\": ariaErrorMessage,\n\n onCancel,\n onToggle,\n onClickOutside,\n\n onFocus,\n onBlur,\n\n values,\n multiSelect = false,\n showSearch = false,\n expanded,\n defaultExpanded = false,\n notifyChangesOnFirstRender = false,\n labels: labelsProp,\n hasTooltips = false,\n disablePortal = false,\n singleSelectionToggle = true,\n placement,\n variableWidth = false,\n popperProps = {},\n height,\n maxHeight,\n virtualized = false,\n baseDropdownProps = {},\n listProps = {},\n ...others\n } = useDefaultProps(\"HvDropdown\", props);\n\n const { classes, cx, css } = useClasses(classesProp);\n\n const labels = useLabels(DEFAULT_LABELS, labelsProp);\n\n const elementId = useUniqueId(id, \"hvdropdown\");\n\n const [validationState, setValidationState] = useControlled(\n status,\n \"standBy\"\n );\n\n const [validationMessage] = useControlled(statusMessage, \"Required\");\n\n const [isOpen, setIsOpen] = useControlled(expanded, Boolean(defaultExpanded));\n const [selectionLabel, setSelectionLabel] = useState(\n getSelectionLabel(labels, placeholder, multiSelect, values)\n );\n const [internalValues, setInternalValues] = useState(values);\n\n useEffect(() => {\n setInternalValues(values);\n }, [values]);\n\n useEffect(() => {\n setSelectionLabel(\n getSelectionLabel(labels, placeholder, multiSelect, values)\n );\n }, [labels, multiSelect, placeholder, values]);\n\n if (virtualized && !height && process.env.NODE_ENV !== \"production\") {\n // eslint-disable-next-line no-console\n console.error(\n \"Dropdown/List in virtualized mode requires a height. Please define it.\"\n );\n }\n\n const dropdownHeaderRef = useRef<HTMLDivElement>();\n\n const handleToggle: HvBaseDropdownProps[\"onToggle\"] = (event, open) => {\n onToggle?.(event, open);\n\n setIsOpen(open);\n\n if (!open) {\n // also run built-in validation when closing without changes\n // as the user \"touched\" the input\n setValidationState(() => {\n // this will only run if status is uncontrolled\n if (required) {\n const hasSelection = getSelected(internalValues).length > 0;\n\n if (!hasSelection) {\n return \"invalid\";\n }\n }\n\n return \"valid\";\n });\n }\n };\n\n /** Applies the selected values to the state */\n const handleSelection: HvDropdownListProps[\"onChange\"] = (\n listValues,\n commitChanges,\n toggle,\n notifyChanges = true\n ) => {\n const selected = getSelected(listValues);\n\n if (commitChanges) {\n setInternalValues(listValues);\n setSelectionLabel(\n getSelectionLabel(labels, placeholder, multiSelect, listValues)\n );\n\n setValidationState(() => {\n // this will only run if status is uncontrolled\n if (required && selected.length === 0) {\n return \"invalid\";\n }\n\n return \"valid\";\n });\n }\n if (notifyChanges) onChange?.(multiSelect ? selected : selected[0]);\n if (toggle) {\n handleToggle(undefined as any, false);\n\n // focus-ring won't be visible even if using the keyboard:\n // https://github.com/WICG/focus-visible/issues/88\n dropdownHeaderRef.current?.focus({ preventScroll: true });\n }\n };\n\n /**\n * Handles the `Cancel` action. Both single and ranged modes are handled here.\n */\n const handleCancel: HvDropdownListProps[\"onCancel\"] = (evt) => {\n onCancel?.(evt as any);\n\n handleToggle(evt as any, false);\n\n // focus-ring won't be visible even if using the keyboard:\n // https://github.com/WICG/focus-visible/issues/88\n dropdownHeaderRef.current?.focus({ preventScroll: true });\n };\n\n const handleClickOutside: HvBaseDropdownProps[\"onClickOutside\"] = (evt) => {\n onClickOutside?.(evt);\n onCancel?.(evt);\n };\n\n const setFocusToContent: HvBaseDropdownProps[\"onContainerCreation\"] = (\n containerRef\n ) => {\n const inputs = containerRef?.getElementsByTagName(\"input\");\n if (inputs && inputs.length > 0) {\n inputs[0].focus();\n return;\n }\n const listItems =\n containerRef != null ? [...containerRef.getElementsByTagName(\"li\")] : [];\n listItems.every((listItem) => {\n if (listItem.tabIndex >= 0) {\n listItem.focus();\n return false;\n }\n return true;\n });\n };\n\n const buildHeaderLabel = () => {\n const hasSelection = getSelected(internalValues).length > 0;\n return labels?.select || !multiSelect ? (\n <HvTypography\n component=\"div\"\n variant=\"body\"\n className={cx(\n classes.placeholder,\n {\n [classes.selectionDisabled]: disabled,\n },\n !(isOpen || hasSelection) &&\n css({ color: theme.dropdown.placeholderColor })\n )}\n >\n {selectionLabel.selected}\n </HvTypography>\n ) : (\n <HvTypography\n component=\"div\"\n className={cx(classes.placeholder, {\n [classes.selectionDisabled]: disabled,\n })}\n variant=\"body\"\n >\n <b>{selectionLabel.selected}</b>\n {` ${labels?.multiSelectionConjunction} ${selectionLabel.total}`}\n </HvTypography>\n );\n };\n\n const hasLabel = label != null;\n const hasDescription = description != null;\n\n // the error message area will only be created if:\n // - an external element that provides an error message isn't identified via aria-errormessage AND\n // - both status and statusMessage properties are being controlled OR\n // - status is uncontrolled and required is true\n const canShowError =\n ariaErrorMessage == null &&\n ((status !== undefined && statusMessage !== undefined) ||\n (status === undefined && required));\n\n const isStateInvalid = isInvalid(validationState);\n\n let errorMessageId;\n if (isStateInvalid) {\n errorMessageId = canShowError\n ? setId(elementId, \"error\")\n : ariaErrorMessage;\n }\n\n return (\n <HvFormElement\n id={id}\n name={name}\n status={validationState}\n disabled={disabled}\n readOnly={readOnly}\n required={required}\n className={cx(\n classes.root,\n disabled && css({ color: theme.dropdown.disabledColor }),\n className\n )}\n {...others}\n >\n {(hasLabel || hasDescription) && (\n <div className={classes.labelContainer}>\n {hasLabel && (\n <HvLabel\n id={setId(elementId, \"label\")}\n label={label}\n className={classes.label}\n />\n )}\n\n {hasDescription && (\n <HvInfoMessage\n id={setId(elementId, \"description\")}\n className={classes.description}\n >\n {description}\n </HvInfoMessage>\n )}\n </div>\n )}\n <HvBaseDropdown\n id={setId(id, \"dropdown\")}\n classes={{\n root: cx(\n classes.dropdown,\n readOnly &&\n css({\n [`& .${staticClasses.dropdownHeader}`]: {\n border: theme.dropdown.readOnlyBorder,\n backgroundColor: theme.dropdown.readOnlyBackgroundColor,\n },\n })\n ),\n arrow: classes.arrow,\n header: cx(classes.dropdownHeader, {\n [classes.dropdownHeaderInvalid]: isStateInvalid,\n }),\n headerOpen: classes.dropdownHeaderOpen,\n }}\n expanded={isOpen}\n disabled={disabled}\n readOnly={readOnly}\n required={required}\n disablePortal={disablePortal}\n placement={placement}\n popperProps={popperProps}\n placeholder={buildHeaderLabel()}\n onToggle={handleToggle}\n onClickOutside={handleClickOutside}\n onContainerCreation={setFocusToContent}\n role=\"combobox\"\n variableWidth={variableWidth}\n aria-label={ariaLabel}\n aria-labelledby={\n [label && setId(elementId, \"label\"), ariaLabelledBy]\n .join(\" \")\n .trim() || undefined\n }\n aria-invalid={isStateInvalid ? true : undefined}\n aria-errormessage={errorMessageId}\n aria-describedby={\n [description && setId(elementId, \"description\"), ariaDescribedBy]\n .join(\" \")\n .trim() || undefined\n }\n onFocus={onFocus}\n onBlur={onBlur}\n dropdownHeaderRef={dropdownHeaderRef}\n {...baseDropdownProps}\n >\n <HvDropdownList\n id={setId(elementId, \"values\")}\n classes={{\n rootList: classes.rootList,\n dropdownListContainer: classes.dropdownListContainer,\n }}\n values={internalValues}\n multiSelect={multiSelect}\n showSearch={showSearch}\n onChange={handleSelection}\n onCancel={handleCancel}\n labels={labels}\n notifyChangesOnFirstRender={notifyChangesOnFirstRender}\n hasTooltips={hasTooltips}\n singleSelectionToggle={singleSelectionToggle}\n aria-label={ariaLabel}\n aria-labelledby={hasLabel ? setId(elementId, \"label\") : undefined}\n height={height}\n maxHeight={maxHeight}\n virtualized={virtualized}\n {...listProps}\n />\n </HvBaseDropdown>\n {canShowError && (\n <HvWarningText\n id={setId(elementId, \"error\")}\n disableBorder\n className={classes.error}\n >\n {validationMessage}\n </HvWarningText>\n )}\n </HvFormElement>\n );\n};\n"],"names":["DEFAULT_LABELS","select","undefined","selectAll","cancelLabel","applyLabel","searchPlaceholder","multiSelectionConjunction","HvDropdown","props","classes","classesProp","className","id","name","required","disabled","readOnly","label","ariaLabel","ariaLabelledBy","description","ariaDescribedBy","placeholder","onChange","status","statusMessage","ariaErrorMessage","onCancel","onToggle","onClickOutside","onFocus","onBlur","values","multiSelect","showSearch","expanded","defaultExpanded","notifyChangesOnFirstRender","labels","labelsProp","hasTooltips","disablePortal","singleSelectionToggle","placement","variableWidth","popperProps","height","maxHeight","virtualized","baseDropdownProps","listProps","others","useDefaultProps","cx","css","useClasses","useLabels","elementId","useUniqueId","validationState","setValidationState","useControlled","validationMessage","isOpen","setIsOpen","Boolean","selectionLabel","setSelectionLabel","useState","getSelectionLabel","internalValues","setInternalValues","useEffect","process","env","NODE_ENV","console","error","dropdownHeaderRef","useRef","handleToggle","event","open","hasSelection","getSelected","length","handleSelection","listValues","commitChanges","toggle","notifyChanges","selected","current","focus","preventScroll","handleCancel","evt","handleClickOutside","setFocusToContent","containerRef","inputs","getElementsByTagName","listItems","every","listItem","tabIndex","buildHeaderLabel","HvTypography","component","variant","selectionDisabled","color","theme","dropdown","placeholderColor","children","_jsxs","_jsx","total","hasLabel","hasDescription","canShowError","isStateInvalid","isInvalid","errorMessageId","setId","HvFormElement","root","disabledColor","labelContainer","HvLabel","HvInfoMessage","HvBaseDropdown","staticClasses","dropdownHeader","border","readOnlyBorder","backgroundColor","readOnlyBackgroundColor","arrow","header","dropdownHeaderInvalid","headerOpen","dropdownHeaderOpen","onContainerCreation","role","join","trim","HvDropdownList","rootList","dropdownListContainer","HvWarningText","disableBorder"],"mappings":"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"}
@@ -28,7 +28,7 @@ const {
28
28
  },
29
29
  largeText: {},
30
30
  textEmpty: {
31
- color: uikitStyles.theme.typography.placeholderText.color
31
+ color: uikitStyles.theme.colors.secondary_60
32
32
  },
33
33
  button: {
34
34
  padding: uikitStyles.theme.spacing("6px", "8px", "5px", "8px"),
@@ -1 +1 @@
1
- {"version":3,"file":"InlineEditor.styles.cjs","sources":["../../../../src/components/InlineEditor/InlineEditor.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { createClasses } from \"@core/utils/classes\";\nimport { inputClasses } from \"@core/components/Input\";\nimport { baseInputClasses } from \"@core/components/BaseInput\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvInlineEditor\", {\n root: {\n [`& .${baseInputClasses.inputRoot}.${inputClasses.inputRoot}`]: {\n height: \"100%\",\n minHeight: \"32px\",\n },\n },\n inputBorderContainer: {\n top: \"unset\",\n bottom: 0,\n },\n input: {},\n inputRoot: {},\n text: {\n overflow: \"hidden\",\n textOverflow: \"ellipsis\",\n whiteSpace: \"nowrap\",\n alignSelf: \"center\",\n },\n largeText: {},\n textEmpty: {\n color: theme.typography.placeholderText.color,\n },\n button: {\n padding: theme.spacing(\"6px\", \"8px\", \"5px\", \"8px\"),\n minHeight: \"32px\",\n\n boxSizing: \"border-box\",\n cursor: \"text\",\n height: \"100%\",\n width: \"100%\",\n maxWidth: \"100%\",\n justifyContent: \"flex-start\",\n alignItems: \"center\",\n\n backgroundColor: \"transparent\",\n border: `${theme.inlineEditor.borderWidth} solid transparent`,\n\n \"&:hover, &:focus\": {\n border: `${theme.inlineEditor.borderWidth} solid ${theme.inlineEditor.hoverBorderColor}`,\n backgroundColor: \"transparent\",\n\n \"& $icon\": {\n visibility: \"visible\",\n },\n },\n\n \"&:active\": {\n border: `${theme.inlineEditor.borderWidth} solid ${theme.inlineEditor.activeBorderColor}`,\n backgroundColor: \"transparent\",\n\n \"& $icon\": {\n visibility: \"visible\",\n },\n },\n\n \"& > div\": {\n width: \"100%\",\n },\n \"& > div > span\": {\n width: \"100%\",\n },\n },\n icon: {\n cursor: \"pointer\",\n visibility: \"hidden\",\n alignSelf: \"center\",\n height: \"16px\",\n width: \"32px\",\n minWidth: \"32px\",\n\n \"& svg\": {\n margin: theme.spacing(0, \"xs\"),\n },\n },\n iconVisible: {\n visibility: \"visible\",\n },\n});\n"],"names":["staticClasses","useClasses","createClasses","root","baseInputClasses","inputRoot","inputClasses","height","minHeight","inputBorderContainer","top","bottom","input","text","overflow","textOverflow","whiteSpace","alignSelf","largeText","textEmpty","color","theme","typography","placeholderText","button","padding","spacing","boxSizing","cursor","width","maxWidth","justifyContent","alignItems","backgroundColor","border","inlineEditor","borderWidth","hoverBorderColor","visibility","activeBorderColor","icon","minWidth","margin","iconVisible"],"mappings":";;;;;;AAMa,MAAA;AAAA,EAAEA;AAAAA,EAAeC;AAAW,IAAIC,QAAAA,cAAc,kBAAkB;AAAA,EAC3EC,MAAM;AAAA,IACJ,CAAE,MAAKC,+BAAiBC,SAAU,IAAGC,aAAaD,cAAAA,SAAU,EAAC,GAAG;AAAA,MAC9DE,QAAQ;AAAA,MACRC,WAAW;AAAA,IACb;AAAA,EACF;AAAA,EACAC,sBAAsB;AAAA,IACpBC,KAAK;AAAA,IACLC,QAAQ;AAAA,EACV;AAAA,EACAC,OAAO,CAAC;AAAA,EACRP,WAAW,CAAC;AAAA,EACZQ,MAAM;AAAA,IACJC,UAAU;AAAA,IACVC,cAAc;AAAA,IACdC,YAAY;AAAA,IACZC,WAAW;AAAA,EACb;AAAA,EACAC,WAAW,CAAC;AAAA,EACZC,WAAW;AAAA,IACTC,OAAOC,YAAMC,MAAAA,WAAWC,gBAAgBH;AAAAA,EAC1C;AAAA,EACAI,QAAQ;AAAA,IACNC,SAASJ,YAAMK,MAAAA,QAAQ,OAAO,OAAO,OAAO,KAAK;AAAA,IACjDlB,WAAW;AAAA,IAEXmB,WAAW;AAAA,IACXC,QAAQ;AAAA,IACRrB,QAAQ;AAAA,IACRsB,OAAO;AAAA,IACPC,UAAU;AAAA,IACVC,gBAAgB;AAAA,IAChBC,YAAY;AAAA,IAEZC,iBAAiB;AAAA,IACjBC,QAAS,GAAEb,YAAAA,MAAMc,aAAaC,WAAY;AAAA,IAE1C,oBAAoB;AAAA,MAClBF,QAAS,GAAEb,YAAMc,MAAAA,aAAaC,WAAY,UAASf,YAAAA,MAAMc,aAAaE,gBAAiB;AAAA,MACvFJ,iBAAiB;AAAA,MAEjB,WAAW;AAAA,QACTK,YAAY;AAAA,MACd;AAAA,IACF;AAAA,IAEA,YAAY;AAAA,MACVJ,QAAS,GAAEb,YAAMc,MAAAA,aAAaC,WAAY,UAASf,YAAAA,MAAMc,aAAaI,iBAAkB;AAAA,MACxFN,iBAAiB;AAAA,MAEjB,WAAW;AAAA,QACTK,YAAY;AAAA,MACd;AAAA,IACF;AAAA,IAEA,WAAW;AAAA,MACTT,OAAO;AAAA,IACT;AAAA,IACA,kBAAkB;AAAA,MAChBA,OAAO;AAAA,IACT;AAAA,EACF;AAAA,EACAW,MAAM;AAAA,IACJZ,QAAQ;AAAA,IACRU,YAAY;AAAA,IACZrB,WAAW;AAAA,IACXV,QAAQ;AAAA,IACRsB,OAAO;AAAA,IACPY,UAAU;AAAA,IAEV,SAAS;AAAA,MACPC,QAAQrB,YAAAA,MAAMK,QAAQ,GAAG,IAAI;AAAA,IAC/B;AAAA,EACF;AAAA,EACAiB,aAAa;AAAA,IACXL,YAAY;AAAA,EACd;AACF,CAAC;;;"}
1
+ {"version":3,"file":"InlineEditor.styles.cjs","sources":["../../../../src/components/InlineEditor/InlineEditor.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { createClasses } from \"@core/utils/classes\";\nimport { inputClasses } from \"@core/components/Input\";\nimport { baseInputClasses } from \"@core/components/BaseInput\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvInlineEditor\", {\n root: {\n [`& .${baseInputClasses.inputRoot}.${inputClasses.inputRoot}`]: {\n height: \"100%\",\n minHeight: \"32px\",\n },\n },\n inputBorderContainer: {\n top: \"unset\",\n bottom: 0,\n },\n input: {},\n inputRoot: {},\n text: {\n overflow: \"hidden\",\n textOverflow: \"ellipsis\",\n whiteSpace: \"nowrap\",\n alignSelf: \"center\",\n },\n largeText: {},\n textEmpty: {\n color: theme.colors.secondary_60,\n },\n button: {\n padding: theme.spacing(\"6px\", \"8px\", \"5px\", \"8px\"),\n minHeight: \"32px\",\n\n boxSizing: \"border-box\",\n cursor: \"text\",\n height: \"100%\",\n width: \"100%\",\n maxWidth: \"100%\",\n justifyContent: \"flex-start\",\n alignItems: \"center\",\n\n backgroundColor: \"transparent\",\n border: `${theme.inlineEditor.borderWidth} solid transparent`,\n\n \"&:hover, &:focus\": {\n border: `${theme.inlineEditor.borderWidth} solid ${theme.inlineEditor.hoverBorderColor}`,\n backgroundColor: \"transparent\",\n\n \"& $icon\": {\n visibility: \"visible\",\n },\n },\n\n \"&:active\": {\n border: `${theme.inlineEditor.borderWidth} solid ${theme.inlineEditor.activeBorderColor}`,\n backgroundColor: \"transparent\",\n\n \"& $icon\": {\n visibility: \"visible\",\n },\n },\n\n \"& > div\": {\n width: \"100%\",\n },\n \"& > div > span\": {\n width: \"100%\",\n },\n },\n icon: {\n cursor: \"pointer\",\n visibility: \"hidden\",\n alignSelf: \"center\",\n height: \"16px\",\n width: \"32px\",\n minWidth: \"32px\",\n\n \"& svg\": {\n margin: theme.spacing(0, \"xs\"),\n },\n },\n iconVisible: {\n visibility: \"visible\",\n },\n});\n"],"names":["staticClasses","useClasses","createClasses","root","baseInputClasses","inputRoot","inputClasses","height","minHeight","inputBorderContainer","top","bottom","input","text","overflow","textOverflow","whiteSpace","alignSelf","largeText","textEmpty","color","theme","colors","secondary_60","button","padding","spacing","boxSizing","cursor","width","maxWidth","justifyContent","alignItems","backgroundColor","border","inlineEditor","borderWidth","hoverBorderColor","visibility","activeBorderColor","icon","minWidth","margin","iconVisible"],"mappings":";;;;;;AAMa,MAAA;AAAA,EAAEA;AAAAA,EAAeC;AAAW,IAAIC,QAAAA,cAAc,kBAAkB;AAAA,EAC3EC,MAAM;AAAA,IACJ,CAAE,MAAKC,+BAAiBC,SAAU,IAAGC,aAAaD,cAAAA,SAAU,EAAC,GAAG;AAAA,MAC9DE,QAAQ;AAAA,MACRC,WAAW;AAAA,IACb;AAAA,EACF;AAAA,EACAC,sBAAsB;AAAA,IACpBC,KAAK;AAAA,IACLC,QAAQ;AAAA,EACV;AAAA,EACAC,OAAO,CAAC;AAAA,EACRP,WAAW,CAAC;AAAA,EACZQ,MAAM;AAAA,IACJC,UAAU;AAAA,IACVC,cAAc;AAAA,IACdC,YAAY;AAAA,IACZC,WAAW;AAAA,EACb;AAAA,EACAC,WAAW,CAAC;AAAA,EACZC,WAAW;AAAA,IACTC,OAAOC,YAAAA,MAAMC,OAAOC;AAAAA,EACtB;AAAA,EACAC,QAAQ;AAAA,IACNC,SAASJ,YAAMK,MAAAA,QAAQ,OAAO,OAAO,OAAO,KAAK;AAAA,IACjDlB,WAAW;AAAA,IAEXmB,WAAW;AAAA,IACXC,QAAQ;AAAA,IACRrB,QAAQ;AAAA,IACRsB,OAAO;AAAA,IACPC,UAAU;AAAA,IACVC,gBAAgB;AAAA,IAChBC,YAAY;AAAA,IAEZC,iBAAiB;AAAA,IACjBC,QAAS,GAAEb,YAAAA,MAAMc,aAAaC,WAAY;AAAA,IAE1C,oBAAoB;AAAA,MAClBF,QAAS,GAAEb,YAAMc,MAAAA,aAAaC,WAAY,UAASf,YAAAA,MAAMc,aAAaE,gBAAiB;AAAA,MACvFJ,iBAAiB;AAAA,MAEjB,WAAW;AAAA,QACTK,YAAY;AAAA,MACd;AAAA,IACF;AAAA,IAEA,YAAY;AAAA,MACVJ,QAAS,GAAEb,YAAMc,MAAAA,aAAaC,WAAY,UAASf,YAAAA,MAAMc,aAAaI,iBAAkB;AAAA,MACxFN,iBAAiB;AAAA,MAEjB,WAAW;AAAA,QACTK,YAAY;AAAA,MACd;AAAA,IACF;AAAA,IAEA,WAAW;AAAA,MACTT,OAAO;AAAA,IACT;AAAA,IACA,kBAAkB;AAAA,MAChBA,OAAO;AAAA,IACT;AAAA,EACF;AAAA,EACAW,MAAM;AAAA,IACJZ,QAAQ;AAAA,IACRU,YAAY;AAAA,IACZrB,WAAW;AAAA,IACXV,QAAQ;AAAA,IACRsB,OAAO;AAAA,IACPY,UAAU;AAAA,IAEV,SAAS;AAAA,MACPC,QAAQrB,YAAAA,MAAMK,QAAQ,GAAG,IAAI;AAAA,IAC/B;AAAA,EACF;AAAA,EACAiB,aAAa;AAAA,IACXL,YAAY;AAAA,EACd;AACF,CAAC;;;"}
@@ -8,7 +8,7 @@ const jsxRuntime = require("@emotion/react/jsx-runtime");
8
8
  const ListContext = require("./ListContext/ListContext.cjs");
9
9
  const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
10
10
  const React__default = /* @__PURE__ */ _interopDefault(React);
11
- const HvListContainer = React__default.default.forwardRef((props, externalRef) => {
11
+ const HvListContainer = React.forwardRef((props, externalRef) => {
12
12
  const {
13
13
  id,
14
14
  classes: classesProp,
@@ -1 +1 @@
1
- {"version":3,"file":"ListContainer.cjs","sources":["../../../../src/components/ListContainer/ListContainer.tsx"],"sourcesContent":["import React, { useRef, useContext, useMemo } from \"react\";\n\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { useForkRef } from \"@core/hooks/useForkRef\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { ExtractNames } from \"@core/utils/classes\";\n\nimport { staticClasses, useClasses } from \"./ListContainer.styles\";\nimport HvListContext from \"./ListContext\";\n\nexport { staticClasses as listContainerClasses };\n\nexport type HvListContainerClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvListContainerProps extends HvBaseProps<HTMLUListElement> {\n /**\n * If the list items should be focusable and react to mouse over events.\n * Defaults to true if the list is selectable, false otherwise.\n */\n interactive?: boolean;\n /** If `true` compact the vertical spacing between list items. */\n condensed?: boolean;\n /** If `true`, the list items' left and right padding is removed. */\n disableGutters?: boolean;\n /** A Jss Object used to override or extend the styles applied to the component. */\n classes?: HvListContainerClasses;\n}\n\n/**\n * A <b>list</b> is any enumeration of a set of items.\n * The simple list is for continuous <b>vertical indexes of text or icons+text</b>. The content of these lists must be simple: ideally simples fields.\n * This pattern is ideal for <b>selections</b>. It should be used inside a HvPanel.\n */\nexport const HvListContainer = React.forwardRef(\n (props: HvListContainerProps, externalRef) => {\n const {\n id,\n classes: classesProp,\n className,\n interactive = false,\n condensed,\n disableGutters,\n children,\n ...others\n } = useDefaultProps(\"HvListContainer\", props);\n\n const { classes, cx } = useClasses(classesProp);\n\n const containerRef = useRef(null);\n\n const { topContainerRef, nesting = -1 } = useContext(HvListContext);\n\n const listContext = useMemo(\n () => ({\n topContainerRef: topContainerRef || containerRef,\n condensed,\n disableGutters,\n interactive,\n nesting: nesting + 1,\n }),\n [condensed, disableGutters, interactive, nesting, topContainerRef]\n );\n\n const renderChildren = () => {\n if (!interactive) {\n return children;\n }\n\n const anySelected = React.Children.toArray(children)\n .map((child: any) => child.props.selected && !child.props.disabled)\n .reduce((result, selected) => result || selected, false);\n\n return React.Children.map(children, (child: any, i) => {\n const tabIndex =\n child.props.tabIndex ||\n (!anySelected && i === 0) ||\n (child.props.selected && !child.props.disabled)\n ? 0\n : -1;\n\n return React.cloneElement(child, {\n tabIndex,\n interactive,\n });\n });\n };\n\n const handleRef = useForkRef(externalRef, containerRef);\n\n return (\n <HvListContext.Provider value={listContext}>\n <ul\n ref={handleRef}\n id={id}\n className={cx(classes.root, className)}\n {...others}\n >\n {renderChildren()}\n </ul>\n </HvListContext.Provider>\n );\n }\n);\n"],"names":["HvListContainer","React","forwardRef","props","externalRef","id","classes","classesProp","className","interactive","condensed","disableGutters","children","others","useDefaultProps","cx","useClasses","containerRef","useRef","topContainerRef","nesting","useContext","HvListContext","listContext","useMemo","renderChildren","anySelected","Children","toArray","map","child","selected","disabled","reduce","result","i","tabIndex","cloneElement","handleRef","useForkRef","_jsx","Provider","value","ref","root"],"mappings":";;;;;;;;;;AAiCO,MAAMA,kBAAkBC,eAAAA,QAAMC,WACnC,CAACC,OAA6BC,gBAAgB;AACtC,QAAA;AAAA,IACJC;AAAAA,IACAC,SAASC;AAAAA,IACTC;AAAAA,IACAC,cAAc;AAAA,IACdC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACA,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,gBAAA,mBAAmBX,KAAK;AAEtC,QAAA;AAAA,IAAEG;AAAAA,IAASS;AAAAA,EAAAA,IAAOC,qBAAAA,WAAWT,WAAW;AAExCU,QAAAA,eAAeC,aAAO,IAAI;AAE1B,QAAA;AAAA,IAAEC;AAAAA,IAAiBC,UAAU;AAAA,EAAA,IAAOC,MAAAA,WAAWC,YAAAA,OAAa;AAE5DC,QAAAA,cAAcC,MAAAA,QAClB,OAAO;AAAA,IACLL,iBAAiBA,mBAAmBF;AAAAA,IACpCP;AAAAA,IACAC;AAAAA,IACAF;AAAAA,IACAW,SAASA,UAAU;AAAA,EAAA,IAErB,CAACV,WAAWC,gBAAgBF,aAAaW,SAASD,eAAe,CACnE;AAEA,QAAMM,iBAAiBA,MAAM;AAC3B,QAAI,CAAChB,aAAa;AACTG,aAAAA;AAAAA,IACT;AAEMc,UAAAA,cAAczB,eAAAA,QAAM0B,SAASC,QAAQhB,QAAQ,EAChDiB,IAAI,CAACC,UAAeA,MAAM3B,MAAM4B,YAAY,CAACD,MAAM3B,MAAM6B,QAAQ,EACjEC,OAAO,CAACC,QAAQH,aAAaG,UAAUH,UAAU,KAAK;AAEzD,WAAO9B,eAAAA,QAAM0B,SAASE,IAAIjB,UAAU,CAACkB,OAAYK,MAAM;AACrD,YAAMC,WACJN,MAAM3B,MAAMiC,YACX,CAACV,eAAeS,MAAM,KACtBL,MAAM3B,MAAM4B,YAAY,CAACD,MAAM3B,MAAM6B,WAClC,IACA;AAEC/B,aAAAA,eAAAA,QAAMoC,aAAaP,OAAO;AAAA,QAC/BM;AAAAA,QACA3B;AAAAA,MAAAA,CACD;AAAA,IAAA,CACF;AAAA,EAAA;AAGG6B,QAAAA,YAAYC,WAAAA,WAAWnC,aAAaa,YAAY;AAGpDuB,SAAAA,2BAAAA,IAAClB,oBAAcmB,UAAQ;AAAA,IAACC,OAAOnB;AAAAA,IAAYX,yCACzC,MAAA;AAAA,MACE+B,KAAKL;AAAAA,MACLjC;AAAAA,MACAG,WAAWO,GAAGT,QAAQsC,MAAMpC,SAAS;AAAA,MAAE,GACnCK;AAAAA,MAAMD,UAETa,eAAe;AAAA,IAAA,CACd;AAAA,EAAA,CACkB;AAE5B,CACF;;;"}
1
+ {"version":3,"file":"ListContainer.cjs","sources":["../../../../src/components/ListContainer/ListContainer.tsx"],"sourcesContent":["import React, { useRef, useContext, useMemo, forwardRef } from \"react\";\n\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { useForkRef } from \"@core/hooks/useForkRef\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { ExtractNames } from \"@core/utils/classes\";\n\nimport { staticClasses, useClasses } from \"./ListContainer.styles\";\nimport HvListContext from \"./ListContext\";\n\nexport { staticClasses as listContainerClasses };\n\nexport type HvListContainerClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvListContainerProps extends HvBaseProps<HTMLUListElement> {\n /**\n * If the list items should be focusable and react to mouse over events.\n * Defaults to true if the list is selectable, false otherwise.\n */\n interactive?: boolean;\n /** If `true` compact the vertical spacing between list items. */\n condensed?: boolean;\n /** If `true`, the list items' left and right padding is removed. */\n disableGutters?: boolean;\n /** A Jss Object used to override or extend the styles applied to the component. */\n classes?: HvListContainerClasses;\n}\n\n/**\n * A <b>list</b> is any enumeration of a set of items.\n * The simple list is for continuous <b>vertical indexes of text or icons+text</b>. The content of these lists must be simple: ideally simples fields.\n * This pattern is ideal for <b>selections</b>. It should be used inside a HvPanel.\n */\nexport const HvListContainer = forwardRef(\n (props: HvListContainerProps, externalRef) => {\n const {\n id,\n classes: classesProp,\n className,\n interactive = false,\n condensed,\n disableGutters,\n children,\n ...others\n } = useDefaultProps(\"HvListContainer\", props);\n\n const { classes, cx } = useClasses(classesProp);\n\n const containerRef = useRef(null);\n\n const { topContainerRef, nesting = -1 } = useContext(HvListContext);\n\n const listContext = useMemo(\n () => ({\n topContainerRef: topContainerRef || containerRef,\n condensed,\n disableGutters,\n interactive,\n nesting: nesting + 1,\n }),\n [condensed, disableGutters, interactive, nesting, topContainerRef]\n );\n\n const renderChildren = () => {\n if (!interactive) {\n return children;\n }\n\n const anySelected = React.Children.toArray(children)\n .map((child: any) => child.props.selected && !child.props.disabled)\n .reduce((result, selected) => result || selected, false);\n\n return React.Children.map(children, (child: any, i) => {\n const tabIndex =\n child.props.tabIndex ||\n (!anySelected && i === 0) ||\n (child.props.selected && !child.props.disabled)\n ? 0\n : -1;\n\n return React.cloneElement(child, {\n tabIndex,\n interactive,\n });\n });\n };\n\n const handleRef = useForkRef(externalRef, containerRef);\n\n return (\n <HvListContext.Provider value={listContext}>\n <ul\n ref={handleRef}\n id={id}\n className={cx(classes.root, className)}\n {...others}\n >\n {renderChildren()}\n </ul>\n </HvListContext.Provider>\n );\n }\n);\n"],"names":["HvListContainer","forwardRef","props","externalRef","id","classes","classesProp","className","interactive","condensed","disableGutters","children","others","useDefaultProps","cx","useClasses","containerRef","useRef","topContainerRef","nesting","useContext","HvListContext","listContext","useMemo","renderChildren","anySelected","React","Children","toArray","map","child","selected","disabled","reduce","result","i","tabIndex","cloneElement","handleRef","useForkRef","_jsx","Provider","value","ref","root"],"mappings":";;;;;;;;;;AAiCO,MAAMA,kBAAkBC,MAAAA,WAC7B,CAACC,OAA6BC,gBAAgB;AACtC,QAAA;AAAA,IACJC;AAAAA,IACAC,SAASC;AAAAA,IACTC;AAAAA,IACAC,cAAc;AAAA,IACdC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACA,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,gBAAA,mBAAmBX,KAAK;AAEtC,QAAA;AAAA,IAAEG;AAAAA,IAASS;AAAAA,EAAAA,IAAOC,qBAAAA,WAAWT,WAAW;AAExCU,QAAAA,eAAeC,aAAO,IAAI;AAE1B,QAAA;AAAA,IAAEC;AAAAA,IAAiBC,UAAU;AAAA,EAAA,IAAOC,MAAAA,WAAWC,YAAAA,OAAa;AAE5DC,QAAAA,cAAcC,MAAAA,QAClB,OAAO;AAAA,IACLL,iBAAiBA,mBAAmBF;AAAAA,IACpCP;AAAAA,IACAC;AAAAA,IACAF;AAAAA,IACAW,SAASA,UAAU;AAAA,EAAA,IAErB,CAACV,WAAWC,gBAAgBF,aAAaW,SAASD,eAAe,CACnE;AAEA,QAAMM,iBAAiBA,MAAM;AAC3B,QAAI,CAAChB,aAAa;AACTG,aAAAA;AAAAA,IACT;AAEMc,UAAAA,cAAcC,eAAAA,QAAMC,SAASC,QAAQjB,QAAQ,EAChDkB,IAAI,CAACC,UAAeA,MAAM5B,MAAM6B,YAAY,CAACD,MAAM5B,MAAM8B,QAAQ,EACjEC,OAAO,CAACC,QAAQH,aAAaG,UAAUH,UAAU,KAAK;AAEzD,WAAOL,eAAAA,QAAMC,SAASE,IAAIlB,UAAU,CAACmB,OAAYK,MAAM;AACrD,YAAMC,WACJN,MAAM5B,MAAMkC,YACX,CAACX,eAAeU,MAAM,KACtBL,MAAM5B,MAAM6B,YAAY,CAACD,MAAM5B,MAAM8B,WAClC,IACA;AAECN,aAAAA,eAAAA,QAAMW,aAAaP,OAAO;AAAA,QAC/BM;AAAAA,QACA5B;AAAAA,MAAAA,CACD;AAAA,IAAA,CACF;AAAA,EAAA;AAGG8B,QAAAA,YAAYC,WAAAA,WAAWpC,aAAaa,YAAY;AAGpDwB,SAAAA,2BAAAA,IAACnB,oBAAcoB,UAAQ;AAAA,IAACC,OAAOpB;AAAAA,IAAYX,yCACzC,MAAA;AAAA,MACEgC,KAAKL;AAAAA,MACLlC;AAAAA,MACAG,WAAWO,GAAGT,QAAQuC,MAAMrC,SAAS;AAAA,MAAE,GACnCK;AAAAA,MAAMD,UAETa,eAAe;AAAA,IAAA,CACd;AAAA,EAAA,CACkB;AAE5B,CACF;;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"Loading.cjs","sources":["../../../../src/components/Loading/Loading.tsx"],"sourcesContent":["import { HvColorAny, getColor } from \"@hitachivantara/uikit-styles\";\n\nimport range from \"lodash/range\";\n\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { HvTypography } from \"@core/components/Typography\";\n\nimport { staticClasses, useClasses } from \"./Loading.styles\";\n\nexport { staticClasses as loadingClasses };\n\nexport type HvLoadingClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvLoadingProps extends HvBaseProps {\n /** Indicates if the component should be render in a small size. */\n small?: boolean;\n /** The label to be displayed. */\n label?: string | React.ReactNode;\n /** Whether the loading animation is hidden. */\n hidden?: boolean;\n /** Color applied to the bars. */\n color?: HvColorAny;\n classes?: HvLoadingClasses;\n}\n\n/**\n * Loading provides feedback about a process that is taking place in the application.\n */\nexport const HvLoading = (props: HvLoadingProps) => {\n const {\n color,\n hidden,\n small,\n label,\n classes: classesProp,\n className,\n ...others\n } = useDefaultProps(\"HvLoading\", props);\n\n const { classes, cx } = useClasses(classesProp);\n\n const size = small ? \"small\" : \"regular\";\n const colorVariant = color ? \"Color\" : \"\";\n const variant = `${size}${colorVariant}` as const;\n\n const inline = {\n backgroundColor: getColor(color, small ? \"secondary\" : \"brand\"),\n };\n return (\n <div\n hidden={!!hidden}\n className={cx(\n classes.root,\n {\n [classes.hidden]: hidden,\n },\n className\n )}\n {...others}\n >\n <div className={classes.barContainer}>\n {range(0, 3).map((e) => (\n <div\n key={e}\n style={inline}\n className={cx(classes.loadingBar, classes[variant])}\n />\n ))}\n </div>\n {label && (\n <HvTypography variant=\"caption1\" className={classes.label}>\n {label}\n </HvTypography>\n )}\n </div>\n );\n};\n"],"names":["HvLoading","props","color","hidden","small","label","classes","classesProp","className","others","useDefaultProps","cx","useClasses","size","colorVariant","variant","inline","backgroundColor","getColor","root","children","_jsx","barContainer","range","map","e","style","loadingBar","HvTypography"],"mappings":";;;;;;;;;;AA8BaA,MAAAA,YAAYA,CAACC,UAA0B;AAC5C,QAAA;AAAA,IACJC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC,SAASC;AAAAA,IACTC;AAAAA,IACA,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,gBAAA,aAAaT,KAAK;AAEhC,QAAA;AAAA,IAAEK;AAAAA,IAASK;AAAAA,EAAAA,IAAOC,eAAAA,WAAWL,WAAW;AAExCM,QAAAA,OAAOT,QAAQ,UAAU;AACzBU,QAAAA,eAAeZ,QAAQ,UAAU;AACvC,QAAMa,UAAW,GAAEF,IAAK,GAAEC,YAAa;AAEvC,QAAME,SAAS;AAAA,IACbC,iBAAiBC,YAAAA,SAAShB,OAAOE,QAAQ,cAAc,OAAO;AAAA,EAAA;AAEhE,yCACE,OAAA;AAAA,IACED,QAAQ,CAAC,CAACA;AAAAA,IACVK,WAAWG,GACTL,QAAQa,MACR;AAAA,MACE,CAACb,QAAQH,MAAM,GAAGA;AAAAA,OAEpBK,SACF;AAAA,IAAE,GACEC;AAAAA,IAAMW,WAEVC,2BAAAA,IAAA,OAAA;AAAA,MAAKb,WAAWF,QAAQgB;AAAAA,MAAaF,UAClCG,eAAAA,QAAM,GAAG,CAAC,EAAEC,IAAKC,CAAAA,qCAChB,OAAA;AAAA,QAEEC,OAAOV;AAAAA,QACPR,WAAWG,GAAGL,QAAQqB,YAAYrB,QAAQS,OAAO,CAAC;AAAA,MAAE,GAF/CU,CAGN,CACF;AAAA,IAAA,CACE,GACJpB,SACCgB,2BAAAA,IAACO,yBAAY;AAAA,MAACb,SAAQ;AAAA,MAAWP,WAAWF,QAAQD;AAAAA,MAAMe,UACvDf;AAAAA,IAAAA,CACW,CACf;AAAA,EAAA,CACE;AAET;;;"}
1
+ {"version":3,"file":"Loading.cjs","sources":["../../../../src/components/Loading/Loading.tsx"],"sourcesContent":["import { HvColorAny, getColor } from \"@hitachivantara/uikit-styles\";\n\nimport range from \"lodash/range\";\n\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { HvTypography } from \"@core/components/Typography\";\n\nimport { staticClasses, useClasses } from \"./Loading.styles\";\n\nexport { staticClasses as loadingClasses };\n\nexport type HvLoadingClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvLoadingProps extends HvBaseProps {\n /** Indicates if the component should be render in a small size. */\n small?: boolean;\n /** The label to be displayed. */\n label?: string | React.ReactNode;\n /** Whether the loading animation is hidden. */\n hidden?: boolean;\n /** Color applied to the bars. */\n color?: HvColorAny;\n /** A Jss Object used to override or extend the styles applied to the component. */\n classes?: HvLoadingClasses;\n}\n\n/**\n * Loading provides feedback about a process that is taking place in the application.\n */\nexport const HvLoading = (props: HvLoadingProps) => {\n const {\n color,\n hidden,\n small,\n label,\n classes: classesProp,\n className,\n ...others\n } = useDefaultProps(\"HvLoading\", props);\n\n const { classes, cx } = useClasses(classesProp);\n\n const size = small ? \"small\" : \"regular\";\n const colorVariant = color ? \"Color\" : \"\";\n const variant = `${size}${colorVariant}` as const;\n\n const inline = {\n backgroundColor: getColor(color, small ? \"secondary\" : \"brand\"),\n };\n return (\n <div\n hidden={!!hidden}\n className={cx(\n classes.root,\n {\n [classes.hidden]: hidden,\n },\n className\n )}\n {...others}\n >\n <div className={classes.barContainer}>\n {range(0, 3).map((e) => (\n <div\n key={e}\n style={inline}\n className={cx(classes.loadingBar, classes[variant])}\n />\n ))}\n </div>\n {label && (\n <HvTypography variant=\"caption1\" className={classes.label}>\n {label}\n </HvTypography>\n )}\n </div>\n );\n};\n"],"names":["HvLoading","props","color","hidden","small","label","classes","classesProp","className","others","useDefaultProps","cx","useClasses","size","colorVariant","variant","inline","backgroundColor","getColor","root","children","_jsx","barContainer","range","map","e","style","loadingBar","HvTypography"],"mappings":";;;;;;;;;;AA+BaA,MAAAA,YAAYA,CAACC,UAA0B;AAC5C,QAAA;AAAA,IACJC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC,SAASC;AAAAA,IACTC;AAAAA,IACA,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,gBAAA,aAAaT,KAAK;AAEhC,QAAA;AAAA,IAAEK;AAAAA,IAASK;AAAAA,EAAAA,IAAOC,eAAAA,WAAWL,WAAW;AAExCM,QAAAA,OAAOT,QAAQ,UAAU;AACzBU,QAAAA,eAAeZ,QAAQ,UAAU;AACvC,QAAMa,UAAW,GAAEF,IAAK,GAAEC,YAAa;AAEvC,QAAME,SAAS;AAAA,IACbC,iBAAiBC,YAAAA,SAAShB,OAAOE,QAAQ,cAAc,OAAO;AAAA,EAAA;AAEhE,yCACE,OAAA;AAAA,IACED,QAAQ,CAAC,CAACA;AAAAA,IACVK,WAAWG,GACTL,QAAQa,MACR;AAAA,MACE,CAACb,QAAQH,MAAM,GAAGA;AAAAA,OAEpBK,SACF;AAAA,IAAE,GACEC;AAAAA,IAAMW,WAEVC,2BAAAA,IAAA,OAAA;AAAA,MAAKb,WAAWF,QAAQgB;AAAAA,MAAaF,UAClCG,eAAAA,QAAM,GAAG,CAAC,EAAEC,IAAKC,CAAAA,qCAChB,OAAA;AAAA,QAEEC,OAAOV;AAAAA,QACPR,WAAWG,GAAGL,QAAQqB,YAAYrB,QAAQS,OAAO,CAAC;AAAA,MAAE,GAF/CU,CAGN,CACF;AAAA,IAAA,CACE,GACJpB,SACCgB,2BAAAA,IAACO,yBAAY;AAAA,MAACb,SAAQ;AAAA,MAAWP,WAAWF,QAAQD;AAAAA,MAAMe,UACvDf;AAAAA,IAAAA,CACW,CACf;AAAA,EAAA,CACE;AAET;;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"Radio.cjs","sources":["../../../../src/components/Radio/Radio.tsx"],"sourcesContent":["import React, { useCallback, useState } from \"react\";\n\nimport { RadioProps as MuiRadioProps } from \"@mui/material\";\n\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { HvBaseRadio } from \"@core/components/BaseRadio\";\nimport {\n HvWarningText,\n HvLabelProps,\n isInvalid,\n HvFormElement,\n HvLabel,\n} from \"@core/components/Forms\";\nimport { useUniqueId } from \"@core/hooks/useUniqueId\";\nimport { useControlled } from \"@core/hooks/useControlled\";\nimport { setId } from \"@core/utils/setId\";\nimport { ExtractNames } from \"@core/utils/classes\";\n\nimport { staticClasses, useClasses } from \"./Radio.styles\";\n\nexport { staticClasses as radioClasses };\n\nexport type HvRadioClasses = ExtractNames<typeof useClasses>;\n\nexport type HvRadioStatus = \"standBy\" | \"valid\" | \"invalid\";\n\nexport interface HvRadioProps\n extends Omit<MuiRadioProps, \"onChange\" | \"classes\">,\n HvBaseProps<HTMLButtonElement, \"onChange\" | \"color\"> {\n /**\n * Class names to be applied.\n */\n className?: string;\n /**\n * A Jss Object used to override or extend the styles applied to the radio button.\n */\n classes?: HvRadioClasses;\n /**\n * Id to be applied to the form element root node.\n */\n id?: string;\n /**\n * The form element name.\n */\n name?: string;\n /**\n * The value of the form element.\n *\n * The default value is \"on\".\n */\n value?: any;\n /**\n * The label of the form element.\n *\n * The form element must be labeled for accessibility reasons.\n * If not provided, an aria-label or aria-labelledby must be provided.\n */\n label?: React.ReactNode;\n /**\n * @ignore\n */\n \"aria-label\"?: string;\n /**\n * @ignore\n */\n \"aria-labelledby\"?: string;\n /**\n * @ignore\n */\n \"aria-describedby\"?: string;\n /**\n * Properties passed on to the label element.\n */\n labelProps?: HvLabelProps;\n /**\n * Indicates that user input is required on the form element.\n *\n * If a single radio button in a group has the required attribute, a radio button in\n * that group must be check, though it doesn't have to be the one with the attribute is applied.\n *\n * For that reason, the component doesn't make any uncontrolled changes to its validation status.\n * That should ideally be managed in the context of a radio button group.\n */\n required?: boolean;\n /**\n * Indicates that the form element is not editable.\n */\n readOnly?: boolean;\n /**\n * Indicates that the form element is disabled.\n */\n disabled?: boolean;\n /**\n * If `true` the radio button is selected, if set to `false` the radio button is not selected.\n *\n * When defined the radio button state becomes controlled.\n */\n checked?: boolean;\n /**\n * When uncontrolled, defines the initial checked state.\n */\n defaultChecked?: boolean;\n /**\n * The status of the form element.\n *\n * Valid is correct, invalid is incorrect and standBy means no validations have run.\n */\n status?: HvRadioStatus;\n /**\n * The error message to show when `status` is \"invalid\".\n */\n statusMessage?: string;\n /**\n * Identifies the element that provides an error message for the radio button.\n *\n * Will only be used when the validation status is invalid.\n */\n \"aria-errormessage\"?: string;\n /**\n * The callback fired when the radio button is pressed.\n */\n onChange?: (\n event: React.ChangeEvent<HTMLInputElement>,\n checked: boolean,\n value: any\n ) => void;\n /**\n * Whether the selector should use semantic colors.\n */\n semantic?: boolean;\n /**\n * Properties passed on to the input element.\n */\n inputProps?: React.InputHTMLAttributes<HTMLInputElement>;\n /**\n * Callback fired when the component is focused with a keyboard.\n * We trigger a `onFocus` callback too.\n */\n onFocusVisible?: (event: React.FocusEvent<any>) => void;\n /**\n * @ignore\n */\n onBlur?: (event: React.FocusEvent<any>) => void;\n}\n\n/**\n * A Radio Button is a mechanism that allows user to select just an option from a group of options.\n *\n * It should used in a Radio Button Group to present the user with a range of options from\n * which the user <b>may select just one option</b> to complete their task.\n *\n * Individual use of radio buttons, at least uncontrolled, is unadvised as React state management doesn't\n * respond to the browser's native management of radio inputs checked state.\n */\nexport const HvRadio = (props: HvRadioProps) => {\n const {\n classes: classesProp,\n className,\n id,\n name,\n value = \"on\",\n required = false,\n readOnly = false,\n disabled = false,\n label,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-describedby\": ariaDescribedBy,\n labelProps,\n checked,\n defaultChecked = false,\n onChange,\n status = \"standBy\",\n statusMessage,\n \"aria-errormessage\": ariaErrorMessage,\n semantic = false,\n inputProps,\n onFocusVisible,\n onBlur,\n ...others\n } = useDefaultProps(\"HvRadio\", props);\n\n const { classes, cx } = useClasses(classesProp);\n\n const elementId = useUniqueId(id, \"hvradio\");\n\n const [focusVisible, setFocusVisible] = useState(false);\n\n const onFocusVisibleCallback = useCallback(\n (evt: React.FocusEvent<any>) => {\n setFocusVisible(true);\n onFocusVisible?.(evt);\n },\n [onFocusVisible]\n );\n\n const onBlurCallback = useCallback(\n (evt: React.FocusEvent<any>) => {\n setFocusVisible(false);\n onBlur?.(evt);\n },\n [onBlur]\n );\n\n const [isChecked, setIsChecked] = useControlled(\n checked,\n Boolean(defaultChecked)\n );\n\n const onLocalChange = useCallback(\n (evt: React.ChangeEvent<HTMLInputElement>, newChecked: boolean) => {\n setIsChecked(newChecked);\n\n onChange?.(evt, newChecked, value);\n },\n [onChange, setIsChecked, value]\n );\n\n // the error message area will only be created if:\n // - an external element that provides an error message isn't identified via aria-errormessage AND\n // - both status and statusMessage properties are being controlled\n const canShowError =\n ariaErrorMessage == null &&\n status !== undefined &&\n statusMessage !== undefined;\n\n const hasLabel = label != null;\n\n const isStateInvalid = isInvalid(status);\n\n let errorMessageId: string | undefined;\n if (isStateInvalid) {\n errorMessageId = canShowError\n ? setId(elementId, \"error\")\n : ariaErrorMessage;\n }\n\n const radio = (\n <HvBaseRadio\n id={label ? setId(elementId, \"input\") : setId(id, \"input\")}\n name={name}\n className={cx(classes.radio, { [classes.invalidRadio]: isStateInvalid })}\n disabled={disabled}\n readOnly={readOnly}\n onChange={onLocalChange}\n value={value}\n checked={isChecked}\n semantic={semantic}\n inputProps={{\n \"aria-invalid\": isStateInvalid ? true : undefined,\n \"aria-errormessage\": errorMessageId,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-describedby\": ariaDescribedBy,\n ...inputProps,\n }}\n onFocusVisible={onFocusVisibleCallback}\n onBlur={onBlurCallback}\n {...others}\n />\n );\n\n return (\n <HvFormElement\n id={id}\n name={name}\n status={status || \"standBy\"}\n disabled={disabled}\n required={required}\n readOnly={readOnly}\n className={cx(classes.root, className)}\n >\n {hasLabel ? (\n <div\n className={cx(classes.container, {\n [classes.disabled]: disabled,\n [classes.focusVisible]: !!(focusVisible && label),\n [classes.invalidContainer]: isStateInvalid,\n })}\n >\n {radio}\n <HvLabel\n id={setId(elementId, \"label\")}\n htmlFor={setId(elementId, \"input\")}\n label={label}\n className={classes.label}\n {...labelProps}\n />\n </div>\n ) : (\n radio\n )}\n {canShowError && (\n <HvWarningText id={setId(elementId, \"error\")} disableBorder>\n {statusMessage}\n </HvWarningText>\n )}\n </HvFormElement>\n );\n};\n"],"names":["HvRadio","props","classes","classesProp","className","id","name","value","required","readOnly","disabled","label","ariaLabel","ariaLabelledBy","ariaDescribedBy","labelProps","checked","defaultChecked","onChange","status","statusMessage","ariaErrorMessage","semantic","inputProps","onFocusVisible","onBlur","others","useDefaultProps","cx","useClasses","elementId","useUniqueId","focusVisible","setFocusVisible","useState","onFocusVisibleCallback","useCallback","evt","onBlurCallback","isChecked","setIsChecked","useControlled","Boolean","onLocalChange","newChecked","canShowError","undefined","hasLabel","isStateInvalid","isInvalid","errorMessageId","setId","radio","HvBaseRadio","invalidRadio","HvFormElement","root","children","_jsxs","container","invalidContainer","_jsx","HvLabel","htmlFor","HvWarningText","disableBorder"],"mappings":"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"}
1
+ {"version":3,"file":"Radio.cjs","sources":["../../../../src/components/Radio/Radio.tsx"],"sourcesContent":["import React, { useCallback, useState } from \"react\";\n\nimport { RadioProps as MuiRadioProps } from \"@mui/material\";\n\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { HvBaseRadio } from \"@core/components/BaseRadio\";\nimport {\n HvWarningText,\n HvLabelProps,\n isInvalid,\n HvFormElement,\n HvLabel,\n} from \"@core/components/Forms\";\nimport { useUniqueId } from \"@core/hooks/useUniqueId\";\nimport { useControlled } from \"@core/hooks/useControlled\";\nimport { setId } from \"@core/utils/setId\";\nimport { ExtractNames } from \"@core/utils/classes\";\n\nimport { staticClasses, useClasses } from \"./Radio.styles\";\n\nexport { staticClasses as radioClasses };\n\nexport type HvRadioClasses = ExtractNames<typeof useClasses>;\n\nexport type HvRadioStatus = \"standBy\" | \"valid\" | \"invalid\";\n\nexport interface HvRadioProps\n extends Omit<MuiRadioProps, \"onChange\" | \"classes\">,\n HvBaseProps<HTMLButtonElement, \"onChange\" | \"color\"> {\n /**\n * A Jss Object used to override or extend the styles applied to the radio button.\n */\n classes?: HvRadioClasses;\n /**\n * The form element name.\n */\n name?: string;\n /**\n * The value of the form element.\n *\n * The default value is \"on\".\n */\n value?: any;\n /**\n * The label of the form element.\n *\n * The form element must be labeled for accessibility reasons.\n * If not provided, an aria-label or aria-labelledby must be provided.\n */\n label?: React.ReactNode;\n /**\n * Properties passed on to the label element.\n */\n labelProps?: HvLabelProps;\n /**\n * Indicates that user input is required on the form element.\n *\n * If a single radio button in a group has the required attribute, a radio button in\n * that group must be check, though it doesn't have to be the one with the attribute is applied.\n *\n * For that reason, the component doesn't make any uncontrolled changes to its validation status.\n * That should ideally be managed in the context of a radio button group.\n */\n required?: boolean;\n /**\n * Indicates that the form element is not editable.\n */\n readOnly?: boolean;\n /**\n * Indicates that the form element is disabled.\n */\n disabled?: boolean;\n /**\n * If `true` the radio button is selected, if set to `false` the radio button is not selected.\n *\n * When defined the radio button state becomes controlled.\n */\n checked?: boolean;\n /**\n * When uncontrolled, defines the initial checked state.\n */\n defaultChecked?: boolean;\n /**\n * The status of the form element.\n *\n * Valid is correct, invalid is incorrect and standBy means no validations have run.\n */\n status?: HvRadioStatus;\n /**\n * The error message to show when `status` is \"invalid\".\n */\n statusMessage?: string;\n /**\n * Identifies the element that provides an error message for the radio button.\n *\n * Will only be used when the validation status is invalid.\n */\n \"aria-errormessage\"?: string;\n /**\n * The callback fired when the radio button is pressed.\n */\n onChange?: (\n event: React.ChangeEvent<HTMLInputElement>,\n checked: boolean,\n value: any\n ) => void;\n /**\n * Whether the selector should use semantic colors.\n */\n semantic?: boolean;\n /**\n * Properties passed on to the input element.\n */\n inputProps?: React.InputHTMLAttributes<HTMLInputElement>;\n /**\n * Callback fired when the component is focused with a keyboard.\n * We trigger a `onFocus` callback too.\n */\n onFocusVisible?: (event: React.FocusEvent<any>) => void;\n /** @ignore */\n ref?: MuiRadioProps[\"ref\"];\n /** @ignore */\n component?: MuiRadioProps[\"component\"];\n}\n\n/**\n * A Radio Button is a mechanism that allows user to select just an option from a group of options.\n *\n * It should used in a Radio Button Group to present the user with a range of options from\n * which the user <b>may select just one option</b> to complete their task.\n *\n * Individual use of radio buttons, at least uncontrolled, is unadvised as React state management doesn't\n * respond to the browser's native management of radio inputs checked state.\n */\nexport const HvRadio = (props: HvRadioProps) => {\n const {\n classes: classesProp,\n className,\n id,\n name,\n value = \"on\",\n required = false,\n readOnly = false,\n disabled = false,\n label,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-describedby\": ariaDescribedBy,\n labelProps,\n checked,\n defaultChecked = false,\n onChange,\n status = \"standBy\",\n statusMessage,\n \"aria-errormessage\": ariaErrorMessage,\n semantic = false,\n inputProps,\n onFocusVisible,\n onBlur,\n ...others\n } = useDefaultProps(\"HvRadio\", props);\n\n const { classes, cx } = useClasses(classesProp);\n\n const elementId = useUniqueId(id, \"hvradio\");\n\n const [focusVisible, setFocusVisible] = useState(false);\n\n const onFocusVisibleCallback = useCallback(\n (evt: React.FocusEvent<any>) => {\n setFocusVisible(true);\n onFocusVisible?.(evt);\n },\n [onFocusVisible]\n );\n\n const onBlurCallback = useCallback(\n (evt: React.FocusEvent<any>) => {\n setFocusVisible(false);\n onBlur?.(evt);\n },\n [onBlur]\n );\n\n const [isChecked, setIsChecked] = useControlled(\n checked,\n Boolean(defaultChecked)\n );\n\n const onLocalChange = useCallback(\n (evt: React.ChangeEvent<HTMLInputElement>, newChecked: boolean) => {\n setIsChecked(newChecked);\n\n onChange?.(evt, newChecked, value);\n },\n [onChange, setIsChecked, value]\n );\n\n // the error message area will only be created if:\n // - an external element that provides an error message isn't identified via aria-errormessage AND\n // - both status and statusMessage properties are being controlled\n const canShowError =\n ariaErrorMessage == null &&\n status !== undefined &&\n statusMessage !== undefined;\n\n const hasLabel = label != null;\n\n const isStateInvalid = isInvalid(status);\n\n let errorMessageId: string | undefined;\n if (isStateInvalid) {\n errorMessageId = canShowError\n ? setId(elementId, \"error\")\n : ariaErrorMessage;\n }\n\n const radio = (\n <HvBaseRadio\n id={label ? setId(elementId, \"input\") : setId(id, \"input\")}\n name={name}\n className={cx(classes.radio, { [classes.invalidRadio]: isStateInvalid })}\n disabled={disabled}\n readOnly={readOnly}\n onChange={onLocalChange}\n value={value}\n checked={isChecked}\n semantic={semantic}\n inputProps={{\n \"aria-invalid\": isStateInvalid ? true : undefined,\n \"aria-errormessage\": errorMessageId,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-describedby\": ariaDescribedBy,\n ...inputProps,\n }}\n onFocusVisible={onFocusVisibleCallback}\n onBlur={onBlurCallback}\n {...others}\n />\n );\n\n return (\n <HvFormElement\n id={id}\n name={name}\n status={status || \"standBy\"}\n disabled={disabled}\n required={required}\n readOnly={readOnly}\n className={cx(classes.root, className)}\n >\n {hasLabel ? (\n <div\n className={cx(classes.container, {\n [classes.disabled]: disabled,\n [classes.focusVisible]: !!(focusVisible && label),\n [classes.invalidContainer]: isStateInvalid,\n })}\n >\n {radio}\n <HvLabel\n id={setId(elementId, \"label\")}\n htmlFor={setId(elementId, \"input\")}\n label={label}\n className={classes.label}\n {...labelProps}\n />\n </div>\n ) : (\n radio\n )}\n {canShowError && (\n <HvWarningText id={setId(elementId, \"error\")} disableBorder>\n {statusMessage}\n </HvWarningText>\n )}\n </HvFormElement>\n );\n};\n"],"names":["HvRadio","props","classes","classesProp","className","id","name","value","required","readOnly","disabled","label","ariaLabel","ariaLabelledBy","ariaDescribedBy","labelProps","checked","defaultChecked","onChange","status","statusMessage","ariaErrorMessage","semantic","inputProps","onFocusVisible","onBlur","others","useDefaultProps","cx","useClasses","elementId","useUniqueId","focusVisible","setFocusVisible","useState","onFocusVisibleCallback","useCallback","evt","onBlurCallback","isChecked","setIsChecked","useControlled","Boolean","onLocalChange","newChecked","canShowError","undefined","hasLabel","isStateInvalid","isInvalid","errorMessageId","setId","radio","HvBaseRadio","invalidRadio","HvFormElement","root","children","_jsxs","container","invalidContainer","_jsx","HvLabel","htmlFor","HvWarningText","disableBorder"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"Snackbar.cjs","sources":["../../../../src/components/Snackbar/Snackbar.tsx"],"sourcesContent":["import Slide from \"@mui/material/Slide\";\nimport {\n SnackbarCloseReason,\n SnackbarOrigin,\n SnackbarProps as MuiSnackbarProps,\n} from \"@mui/material/Snackbar\";\nimport { Snackbar as MuiSnackbar } from \"@mui/material\";\n\nimport capitalize from \"lodash/capitalize\";\n\nimport { SyntheticEvent } from \"react\";\n\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { setId } from \"@core/utils/setId\";\nimport { HvActionGeneric } from \"@core/components/ActionsGeneric\";\n\nimport { HvSnackbarContentProps, HvSnackbarContent } from \"./SnackbarContent\";\nimport { staticClasses, useClasses } from \"./Snackbar.styles\";\nimport { HvSnackbarVariant } from \"./types\";\n\nexport { staticClasses as snackbarClasses };\n\nexport type HvSnackbarClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvSnackbarProps\n extends Omit<MuiSnackbarProps, \"action\" | \"classes\">,\n Omit<HvBaseProps, \"children\"> {\n /** If true, Snackbar is open. */\n open?: boolean;\n /** Callback fired when the component requests to be closed. Typically onClose is used to set state in the parent component, which is used to control the Snackbar open prop. The reason parameter can optionally be used to control the response to onClose, for example ignoring clickaway. */\n onClose?:\n | ((\n event: Event | SyntheticEvent<any, Event>,\n reason: SnackbarCloseReason\n ) => void)\n | undefined;\n /** The message to display. */\n label?: React.ReactNode;\n /** The anchor of the Snackbar. vertical: \"top\", \"bottom\" | horizontal: \"left\",\"center\",\"right. It defines where the snackbar will end his animation */\n anchorOrigin?: SnackbarOrigin;\n /** The number of milliseconds to wait before automatically calling the onClose function. onClose should then set the state of the open prop to hide the Snackbar */\n autoHideDuration?: number;\n /** Variant of the snackbar. */\n variant?: HvSnackbarVariant;\n /** Custom icon to replace the variant default. */\n customIcon?: React.ReactNode;\n /** Controls if the associated icon to the variant should be shown. */\n showIcon?: boolean;\n /** Action to display. */\n action?: React.ReactNode | HvActionGeneric;\n /** The callback function ran when an action is triggered, receiving `action` as param */\n actionCallback?: (\n event: React.SyntheticEvent,\n id: string,\n action: HvActionGeneric\n ) => void;\n /** Duration of transition in milliseconds. */\n transitionDuration?: number;\n /** Direction of slide transition. */\n transitionDirection?: \"up\" | \"down\" | \"left\" | \"right\";\n /** Custom offset from top/bottom of the page, in px. */\n offset?: number;\n /** Others applied to the content of the snackbar. */\n snackbarContentProps?: HvSnackbarContentProps;\n /** A Jss Object used to override or extend the styles applied to the component. */\n classes?: HvSnackbarClasses;\n}\n\nconst transLeft = (props) => <Slide {...props} direction=\"left\" />;\nconst transRight = (props) => <Slide {...props} direction=\"right\" />;\nconst transUp = (props) => <Slide {...props} direction=\"up\" />;\nconst transDown = (props) => <Slide {...props} direction=\"down\" />;\n\nconst snackBarDirComponent = (direction) => {\n switch (direction) {\n case \"right\":\n return transRight;\n case \"up\":\n return transUp;\n case \"down\":\n return transDown;\n case \"left\":\n default:\n return transLeft;\n }\n};\n\n/**\n * A Snackbar provides brief messages about app processes.\n * It is dismissed automatically after a given interval.\n *\n * Snackbar can be built with two different components.\n * One is the HvSnackbar, which wraps all the positioning, transition, auto hide, etc.\n * The other is the HvSnackbarContent, which allows a finer control and customization of the content of the Snackbar.\n */\nexport const HvSnackbar = ({\n classes: classesProp,\n className,\n id,\n open = false,\n onClose,\n label = \"\",\n anchorOrigin = { vertical: \"top\", horizontal: \"right\" },\n autoHideDuration = 5000,\n variant = \"default\",\n showIcon = false,\n customIcon = null,\n action = null,\n actionCallback,\n transitionDuration = 300,\n transitionDirection = \"left\",\n offset = 60,\n snackbarContentProps,\n ...others\n}: HvSnackbarProps) => {\n const { classes } = useClasses(classesProp);\n\n const anchorOriginOffset = {\n anchorOriginTop: {\n top: `${offset}px`,\n },\n anchorOriginBottom: {\n bottom: `${offset}px`,\n },\n };\n\n return (\n <MuiSnackbar\n style={\n anchorOriginOffset[`anchorOrigin${capitalize(anchorOrigin.vertical)}`]\n }\n classes={classes}\n className={className}\n id={id}\n anchorOrigin={anchorOrigin}\n open={open}\n onClose={onClose}\n autoHideDuration={autoHideDuration}\n transitionDuration={transitionDuration}\n TransitionComponent={snackBarDirComponent(transitionDirection)}\n {...others}\n >\n <HvSnackbarContent\n id={setId(id, \"content\")}\n label={label}\n variant={variant}\n customIcon={customIcon}\n showIcon={showIcon}\n action={action}\n actionCallback={actionCallback}\n {...snackbarContentProps}\n />\n </MuiSnackbar>\n );\n};\n"],"names":["transLeft","props","_jsx","Slide","direction","transRight","transUp","transDown","snackBarDirComponent","HvSnackbar","classes","classesProp","className","id","open","onClose","label","anchorOrigin","vertical","horizontal","autoHideDuration","variant","showIcon","customIcon","action","actionCallback","transitionDuration","transitionDirection","offset","snackbarContentProps","others","useClasses","anchorOriginOffset","anchorOriginTop","top","anchorOriginBottom","bottom","MuiSnackbar","style","capitalize","TransitionComponent","children","HvSnackbarContent","setId"],"mappings":";;;;;;;;;;;;AAqEA,MAAMA,YAAaC,CAAUC,UAAAA,2BAAAA,IAACC,wBAAK;AAAA,EAAA,GAAKF;AAAAA,EAAOG,WAAU;AAAM,CAAE;AACjE,MAAMC,aAAcJ,CAAUC,UAAAA,2BAAAA,IAACC,wBAAK;AAAA,EAAA,GAAKF;AAAAA,EAAOG,WAAU;AAAO,CAAE;AACnE,MAAME,UAAWL,CAAUC,UAAAA,2BAAAA,IAACC,wBAAK;AAAA,EAAA,GAAKF;AAAAA,EAAOG,WAAU;AAAI,CAAE;AAC7D,MAAMG,YAAaN,CAAUC,UAAAA,2BAAAA,IAACC,wBAAK;AAAA,EAAA,GAAKF;AAAAA,EAAOG,WAAU;AAAM,CAAE;AAEjE,MAAMI,uBAAwBJ,CAAc,cAAA;AAC1C,UAAQA,WAAS;AAAA,IACf,KAAK;AACIC,aAAAA;AAAAA,IACT,KAAK;AACIC,aAAAA;AAAAA,IACT,KAAK;AACIC,aAAAA;AAAAA,IACT,KAAK;AAAA,IACL;AACSP,aAAAA;AAAAA,EACX;AACF;AAUO,MAAMS,aAAaA,CAAC;AAAA,EACzBC,SAASC;AAAAA,EACTC;AAAAA,EACAC;AAAAA,EACAC,OAAO;AAAA,EACPC;AAAAA,EACAC,QAAQ;AAAA,EACRC,eAAe;AAAA,IAAEC,UAAU;AAAA,IAAOC,YAAY;AAAA,EAAQ;AAAA,EACtDC,mBAAmB;AAAA,EACnBC,UAAU;AAAA,EACVC,WAAW;AAAA,EACXC,aAAa;AAAA,EACbC,SAAS;AAAA,EACTC;AAAAA,EACAC,qBAAqB;AAAA,EACrBC,sBAAsB;AAAA,EACtBC,SAAS;AAAA,EACTC;AAAAA,EACA,GAAGC;AACY,MAAM;AACf,QAAA;AAAA,IAAEpB;AAAAA,EAAAA,IAAYqB,gBAAAA,WAAWpB,WAAW;AAE1C,QAAMqB,qBAAqB;AAAA,IACzBC,iBAAiB;AAAA,MACfC,KAAM,GAAEN,MAAO;AAAA,IACjB;AAAA,IACAO,oBAAoB;AAAA,MAClBC,QAAS,GAAER,MAAO;AAAA,IACpB;AAAA,EAAA;AAGF,wCACGS,SAAAA,UAAW;AAAA,IACVC,OACEN,mBAAoB,eAAcO,4BAAWtB,aAAaC,QAAQ,CAAE,EAAC;AAAA,IAEvER;AAAAA,IACAE;AAAAA,IACAC;AAAAA,IACAI;AAAAA,IACAH;AAAAA,IACAC;AAAAA,IACAK;AAAAA,IACAM;AAAAA,IACAc,qBAAqBhC,qBAAqBmB,mBAAmB;AAAA,IAAE,GAC3DG;AAAAA,IAAMW,yCAETC,mCAAiB;AAAA,MAChB7B,IAAI8B,MAAAA,MAAM9B,IAAI,SAAS;AAAA,MACvBG;AAAAA,MACAK;AAAAA,MACAE;AAAAA,MACAD;AAAAA,MACAE;AAAAA,MACAC;AAAAA,MAA+B,GAC3BI;AAAAA,IAAAA,CACL;AAAA,EAAA,CACU;AAEjB;;;"}
1
+ {"version":3,"file":"Snackbar.cjs","sources":["../../../../src/components/Snackbar/Snackbar.tsx"],"sourcesContent":["import Slide from \"@mui/material/Slide\";\nimport {\n SnackbarCloseReason,\n SnackbarOrigin,\n SnackbarProps as MuiSnackbarProps,\n} from \"@mui/material/Snackbar\";\nimport { Snackbar as MuiSnackbar } from \"@mui/material\";\n\nimport capitalize from \"lodash/capitalize\";\n\nimport { SyntheticEvent } from \"react\";\n\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { setId } from \"@core/utils/setId\";\nimport { HvActionGeneric } from \"@core/components/ActionsGeneric\";\n\nimport { HvSnackbarContentProps, HvSnackbarContent } from \"./SnackbarContent\";\nimport { staticClasses, useClasses } from \"./Snackbar.styles\";\nimport { HvSnackbarVariant } from \"./types\";\n\nexport { staticClasses as snackbarClasses };\n\nexport type HvSnackbarClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvSnackbarProps\n extends Omit<MuiSnackbarProps, \"action\" | \"classes\">,\n Omit<HvBaseProps, \"children\"> {\n /** If true, Snackbar is open. */\n open?: boolean;\n /** Callback fired when the component requests to be closed. Typically onClose is used to set state in the parent component, which is used to control the Snackbar open prop. The reason parameter can optionally be used to control the response to onClose, for example ignoring clickaway. */\n onClose?:\n | ((\n event: Event | SyntheticEvent<any, Event>,\n reason: SnackbarCloseReason\n ) => void)\n | undefined;\n /** The message to display. */\n label?: React.ReactNode;\n /** The anchor of the Snackbar. vertical: \"top\", \"bottom\" | horizontal: \"left\",\"center\",\"right. It defines where the snackbar will end his animation */\n anchorOrigin?: SnackbarOrigin;\n /** The number of milliseconds to wait before automatically calling the onClose function. onClose should then set the state of the open prop to hide the Snackbar */\n autoHideDuration?: number;\n /** Variant of the snackbar. */\n variant?: HvSnackbarVariant;\n /** Custom icon to replace the variant default. */\n customIcon?: React.ReactNode;\n /** Controls if the associated icon to the variant should be shown. */\n showIcon?: boolean;\n /** Action to display. */\n action?: React.ReactNode | HvActionGeneric;\n /** The callback function ran when an action is triggered, receiving `action` as param */\n actionCallback?: (\n event: React.SyntheticEvent,\n id: string,\n action: HvActionGeneric\n ) => void;\n /** Duration of transition in milliseconds. */\n transitionDuration?: number;\n /** Direction of slide transition. */\n transitionDirection?: \"up\" | \"down\" | \"left\" | \"right\";\n /** Custom offset from top/bottom of the page, in px. */\n offset?: number;\n /** Others applied to the content of the snackbar. */\n snackbarContentProps?: HvSnackbarContentProps;\n /** A Jss Object used to override or extend the styles applied to the component. */\n classes?: HvSnackbarClasses;\n /** @ignore */\n ref?: MuiSnackbarProps[\"ref\"];\n}\n\nconst transLeft = (props) => <Slide {...props} direction=\"left\" />;\nconst transRight = (props) => <Slide {...props} direction=\"right\" />;\nconst transUp = (props) => <Slide {...props} direction=\"up\" />;\nconst transDown = (props) => <Slide {...props} direction=\"down\" />;\n\nconst snackBarDirComponent = (direction) => {\n switch (direction) {\n case \"right\":\n return transRight;\n case \"up\":\n return transUp;\n case \"down\":\n return transDown;\n case \"left\":\n default:\n return transLeft;\n }\n};\n\n/**\n * A Snackbar provides brief messages about app processes.\n * It is dismissed automatically after a given interval.\n *\n * Snackbar can be built with two different components.\n * One is the HvSnackbar, which wraps all the positioning, transition, auto hide, etc.\n * The other is the HvSnackbarContent, which allows a finer control and customization of the content of the Snackbar.\n */\nexport const HvSnackbar = ({\n classes: classesProp,\n className,\n id,\n open = false,\n onClose,\n label = \"\",\n anchorOrigin = { vertical: \"top\", horizontal: \"right\" },\n autoHideDuration = 5000,\n variant = \"default\",\n showIcon = false,\n customIcon = null,\n action = null,\n actionCallback,\n transitionDuration = 300,\n transitionDirection = \"left\",\n offset = 60,\n snackbarContentProps,\n ...others\n}: HvSnackbarProps) => {\n const { classes } = useClasses(classesProp);\n\n const anchorOriginOffset = {\n anchorOriginTop: {\n top: `${offset}px`,\n },\n anchorOriginBottom: {\n bottom: `${offset}px`,\n },\n };\n\n return (\n <MuiSnackbar\n style={\n anchorOriginOffset[`anchorOrigin${capitalize(anchorOrigin.vertical)}`]\n }\n classes={classes}\n className={className}\n id={id}\n anchorOrigin={anchorOrigin}\n open={open}\n onClose={onClose}\n autoHideDuration={autoHideDuration}\n transitionDuration={transitionDuration}\n TransitionComponent={snackBarDirComponent(transitionDirection)}\n {...others}\n >\n <HvSnackbarContent\n id={setId(id, \"content\")}\n label={label}\n variant={variant}\n customIcon={customIcon}\n showIcon={showIcon}\n action={action}\n actionCallback={actionCallback}\n {...snackbarContentProps}\n />\n </MuiSnackbar>\n );\n};\n"],"names":["transLeft","props","_jsx","Slide","direction","transRight","transUp","transDown","snackBarDirComponent","HvSnackbar","classes","classesProp","className","id","open","onClose","label","anchorOrigin","vertical","horizontal","autoHideDuration","variant","showIcon","customIcon","action","actionCallback","transitionDuration","transitionDirection","offset","snackbarContentProps","others","useClasses","anchorOriginOffset","anchorOriginTop","top","anchorOriginBottom","bottom","MuiSnackbar","style","capitalize","TransitionComponent","children","HvSnackbarContent","setId"],"mappings":";;;;;;;;;;;;AAuEA,MAAMA,YAAaC,CAAUC,UAAAA,2BAAAA,IAACC,wBAAK;AAAA,EAAA,GAAKF;AAAAA,EAAOG,WAAU;AAAM,CAAE;AACjE,MAAMC,aAAcJ,CAAUC,UAAAA,2BAAAA,IAACC,wBAAK;AAAA,EAAA,GAAKF;AAAAA,EAAOG,WAAU;AAAO,CAAE;AACnE,MAAME,UAAWL,CAAUC,UAAAA,2BAAAA,IAACC,wBAAK;AAAA,EAAA,GAAKF;AAAAA,EAAOG,WAAU;AAAI,CAAE;AAC7D,MAAMG,YAAaN,CAAUC,UAAAA,2BAAAA,IAACC,wBAAK;AAAA,EAAA,GAAKF;AAAAA,EAAOG,WAAU;AAAM,CAAE;AAEjE,MAAMI,uBAAwBJ,CAAc,cAAA;AAC1C,UAAQA,WAAS;AAAA,IACf,KAAK;AACIC,aAAAA;AAAAA,IACT,KAAK;AACIC,aAAAA;AAAAA,IACT,KAAK;AACIC,aAAAA;AAAAA,IACT,KAAK;AAAA,IACL;AACSP,aAAAA;AAAAA,EACX;AACF;AAUO,MAAMS,aAAaA,CAAC;AAAA,EACzBC,SAASC;AAAAA,EACTC;AAAAA,EACAC;AAAAA,EACAC,OAAO;AAAA,EACPC;AAAAA,EACAC,QAAQ;AAAA,EACRC,eAAe;AAAA,IAAEC,UAAU;AAAA,IAAOC,YAAY;AAAA,EAAQ;AAAA,EACtDC,mBAAmB;AAAA,EACnBC,UAAU;AAAA,EACVC,WAAW;AAAA,EACXC,aAAa;AAAA,EACbC,SAAS;AAAA,EACTC;AAAAA,EACAC,qBAAqB;AAAA,EACrBC,sBAAsB;AAAA,EACtBC,SAAS;AAAA,EACTC;AAAAA,EACA,GAAGC;AACY,MAAM;AACf,QAAA;AAAA,IAAEpB;AAAAA,EAAAA,IAAYqB,gBAAAA,WAAWpB,WAAW;AAE1C,QAAMqB,qBAAqB;AAAA,IACzBC,iBAAiB;AAAA,MACfC,KAAM,GAAEN,MAAO;AAAA,IACjB;AAAA,IACAO,oBAAoB;AAAA,MAClBC,QAAS,GAAER,MAAO;AAAA,IACpB;AAAA,EAAA;AAGF,wCACGS,SAAAA,UAAW;AAAA,IACVC,OACEN,mBAAoB,eAAcO,4BAAWtB,aAAaC,QAAQ,CAAE,EAAC;AAAA,IAEvER;AAAAA,IACAE;AAAAA,IACAC;AAAAA,IACAI;AAAAA,IACAH;AAAAA,IACAC;AAAAA,IACAK;AAAAA,IACAM;AAAAA,IACAc,qBAAqBhC,qBAAqBmB,mBAAmB;AAAA,IAAE,GAC3DG;AAAAA,IAAMW,yCAETC,mCAAiB;AAAA,MAChB7B,IAAI8B,MAAAA,MAAM9B,IAAI,SAAS;AAAA,MACvBG;AAAAA,MACAK;AAAAA,MACAE;AAAAA,MACAD;AAAAA,MACAE;AAAAA,MACAC;AAAAA,MAA+B,GAC3BI;AAAAA,IAAAA,CACL;AAAA,EAAA,CACU;AAEjB;;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"Switch.cjs","sources":["../../../../src/components/Switch/Switch.tsx"],"sourcesContent":["import React, { useCallback } from \"react\";\n\nimport { SwitchProps as MuiSwitchProps } from \"@mui/material\";\n\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { useUniqueId } from \"@core/hooks/useUniqueId\";\nimport { useControlled } from \"@core/hooks/useControlled\";\nimport { setId } from \"@core/utils/setId\";\nimport {\n HvWarningText,\n HvLabelProps,\n HvFormStatus,\n HvFormElement,\n HvLabel,\n} from \"@core/components/Forms\";\nimport { HvBaseSwitch } from \"@core/components/BaseSwitch\";\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { isInvalid } from \"@core/components/Forms/FormElement/validationStates\";\nimport { ExtractNames } from \"@core/utils/classes\";\n\nimport { staticClasses, useClasses } from \"./Switch.styles\";\n\nexport { staticClasses as switchClasses };\n\nexport type HvSwitchClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvSwitchProps\n extends Omit<MuiSwitchProps, \"onChange\" | \"classes\">,\n HvBaseProps<HTMLButtonElement, \"onChange\" | \"color\"> {\n /**\n * Class names to be applied.\n */\n className?: string;\n /**\n * A Jss Object used to override or extend the styles applied to the switch.\n */\n classes?: HvSwitchClasses;\n /**\n * Id to be applied to the form element root node.\n */\n id?: string;\n /**\n * The form element name.\n */\n name?: string;\n /**\n * The value of the form element.\n *\n * Is up to the application's logic when to consider the submission of this value.\n * Generally it should be used only when the switch is neither unchecked nor indeterminate.\n *\n * The default value is \"on\".\n */\n value?: any;\n /**\n * The label of the form element.\n *\n * The form element must be labeled for accessibility reasons.\n * If not provided, an aria-label or aria-labelledby must be inputted via inputProps.\n */\n label?: React.ReactNode;\n /**\n * @ignore\n */\n \"aria-label\"?: string;\n /**\n * @ignore\n */\n \"aria-labelledby\"?: string;\n /**\n * @ignore\n */\n \"aria-describedby\"?: string;\n /**\n * Properties passed on to the label element.\n */\n labelProps?: HvLabelProps;\n /**\n * Indicates that the form element is disabled.\n */\n disabled?: boolean;\n /**\n * Indicates that the form element is not editable.\n */\n readOnly?: boolean;\n /**\n * Indicates that user input is required on the form element.\n */\n required?: boolean;\n /**\n * If `true` the switch is selected, if set to `false` the switch is not selected.\n *\n * When defined the switch state becomes controlled.\n */\n checked?: boolean;\n /**\n * When uncontrolled, defines the initial checked state.\n */\n defaultChecked?: boolean;\n /**\n * The status of the form element.\n *\n * Valid is correct, invalid is incorrect and standBy means no validations have run.\n *\n * When uncontrolled and unspecified it will default to \"standBy\" and change to either \"valid\"\n * or \"invalid\" after any change to `checked`, depending of the values of both `required` and `checked`.\n */\n status?: HvFormStatus;\n /**\n * The error message to show when the validation status is \"invalid\".\n *\n * Defaults to \"Required\" when the status is uncontrolled and no `aria-errormessage` is provided.\n */\n statusMessage?: string;\n /**\n * Identifies the element that provides an error message for the switch.\n *\n * Will only be used when the validation status is invalid.\n */\n \"aria-errormessage\"?: string;\n /**\n * The callback fired when the switch is pressed.\n */\n onChange?: (event: React.ChangeEvent, checked: boolean, value: any) => void;\n /**\n * Properties passed on to the input element.\n */\n inputProps?: React.InputHTMLAttributes<HTMLInputElement>;\n}\n\n/**\n * A Switch is <b>binary</b> and work as a digital on/off button.\n *\n * Use when two states are <b>opposite</b> and to trigger immediate\n * changes in the system.\n */\nexport const HvSwitch = (props: HvSwitchProps) => {\n const {\n classes: classesProp,\n className,\n\n id,\n name,\n value = \"on\",\n required = false,\n readOnly = false,\n disabled = false,\n\n label,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-describedby\": ariaDescribedBy,\n labelProps,\n\n checked,\n defaultChecked = false,\n\n onChange,\n\n status,\n statusMessage,\n \"aria-errormessage\": ariaErrorMessage,\n\n inputProps,\n\n ...others\n } = useDefaultProps(\"HvSwitch\", props);\n\n const { classes, cx } = useClasses(classesProp);\n\n const elementId = useUniqueId(id, \"hvswitch\");\n\n const [isChecked, setIsChecked] = useControlled(\n checked,\n Boolean(defaultChecked)\n );\n\n const [validationState, setValidationState] = useControlled(\n status,\n \"standBy\"\n );\n\n const [validationMessage] = useControlled(statusMessage, \"Required\");\n\n const onLocalChange = useCallback(\n (evt, newChecked) => {\n setIsChecked(() => {\n // this will only run if uncontrolled\n if (required && !newChecked) {\n setValidationState(\"invalid\");\n } else {\n setValidationState(\"valid\");\n }\n\n return newChecked;\n });\n\n onChange?.(evt, newChecked, value);\n },\n [onChange, required, setIsChecked, setValidationState, value]\n );\n\n // the error message area will only be created if:\n // - an external element that provides an error message isn't identified via aria-errormessage AND\n // - both status and statusMessage properties are being controlled OR\n // - status is uncontrolled and required is true\n const canShowError =\n ariaErrorMessage == null &&\n ((status !== undefined && statusMessage !== undefined) ||\n (status === undefined && required));\n\n const isStateInvalid = isInvalid(validationState);\n\n let errorMessageId: string | undefined;\n if (isStateInvalid) {\n errorMessageId = canShowError\n ? setId(elementId, \"error\")\n : ariaErrorMessage;\n }\n\n return (\n <HvFormElement\n id={id}\n name={name}\n status={validationState}\n disabled={disabled}\n required={required}\n readOnly={readOnly}\n className={cx(classes.root, className)}\n >\n {label && (\n <HvLabel\n id={setId(elementId, \"label\")}\n htmlFor={setId(elementId, \"input\")}\n label={label}\n className={classes.label}\n {...labelProps}\n />\n )}\n <div\n className={cx(classes.switchContainer, {\n [classes.invalidSwitch]: isStateInvalid,\n })}\n >\n <HvBaseSwitch\n id={label ? setId(elementId, \"input\") : setId(id, \"input\")}\n name={name}\n disabled={disabled}\n readOnly={readOnly}\n required={required}\n onChange={onLocalChange}\n value={value}\n checked={isChecked}\n inputProps={{\n \"aria-invalid\": isStateInvalid ? true : undefined,\n \"aria-errormessage\": errorMessageId,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-describedby\": ariaDescribedBy,\n ...inputProps,\n }}\n {...others}\n />\n </div>\n {canShowError && (\n <HvWarningText\n id={setId(elementId, \"error\")}\n className={classes.error}\n disableBorder\n disableAdornment\n hideText\n >\n {validationMessage}\n </HvWarningText>\n )}\n </HvFormElement>\n );\n};\n"],"names":["HvSwitch","props","classes","classesProp","className","id","name","value","required","readOnly","disabled","label","ariaLabel","ariaLabelledBy","ariaDescribedBy","labelProps","checked","defaultChecked","onChange","status","statusMessage","ariaErrorMessage","inputProps","others","useDefaultProps","cx","useClasses","elementId","useUniqueId","isChecked","setIsChecked","useControlled","Boolean","validationState","setValidationState","validationMessage","onLocalChange","useCallback","evt","newChecked","canShowError","undefined","isStateInvalid","isInvalid","errorMessageId","setId","HvFormElement","root","children","_jsx","HvLabel","htmlFor","switchContainer","invalidSwitch","HvBaseSwitch","HvWarningText","error","disableBorder","disableAdornment","hideText"],"mappings":";;;;;;;;;;;;;;AAwIaA,MAAAA,WAAWA,CAACC,UAAyB;AAC1C,QAAA;AAAA,IACJC,SAASC;AAAAA,IACTC;AAAAA,IAEAC;AAAAA,IACAC;AAAAA,IACAC,QAAQ;AAAA,IACRC,WAAW;AAAA,IACXC,WAAW;AAAA,IACXC,WAAW;AAAA,IAEXC;AAAAA,IACA,cAAcC;AAAAA,IACd,mBAAmBC;AAAAA,IACnB,oBAAoBC;AAAAA,IACpBC;AAAAA,IAEAC;AAAAA,IACAC,iBAAiB;AAAA,IAEjBC;AAAAA,IAEAC;AAAAA,IACAC;AAAAA,IACA,qBAAqBC;AAAAA,IAErBC;AAAAA,IAEA,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,gBAAA,YAAYvB,KAAK;AAE/B,QAAA;AAAA,IAAEC;AAAAA,IAASuB;AAAAA,EAAAA,IAAOC,cAAAA,WAAWvB,WAAW;AAExCwB,QAAAA,YAAYC,YAAAA,YAAYvB,IAAI,UAAU;AAEtC,QAAA,CAACwB,WAAWC,YAAY,IAAIC,cAAAA,cAChCf,SACAgB,QAAQf,cAAc,CACxB;AAEA,QAAM,CAACgB,iBAAiBC,kBAAkB,IAAIH,cAAAA,cAC5CZ,QACA,SACF;AAEA,QAAM,CAACgB,iBAAiB,IAAIJ,cAAAA,cAAcX,eAAe,UAAU;AAEnE,QAAMgB,gBAAgBC,MAAAA,YACpB,CAACC,KAAKC,eAAe;AACnBT,iBAAa,MAAM;AAEbtB,UAAAA,YAAY,CAAC+B,YAAY;AAC3BL,2BAAmB,SAAS;AAAA,MAAA,OACvB;AACLA,2BAAmB,OAAO;AAAA,MAC5B;AAEOK,aAAAA;AAAAA,IAAAA,CACR;AAEUD,yCAAAA,KAAKC,YAAYhC;AAAAA,EAAK,GAEnC,CAACW,UAAUV,UAAUsB,cAAcI,oBAAoB3B,KAAK,CAC9D;AAMMiC,QAAAA,eACJnB,oBAAoB,SAClBF,WAAWsB,UAAarB,kBAAkBqB,UACzCtB,WAAWsB,UAAajC;AAEvBkC,QAAAA,iBAAiBC,2BAAUV,eAAe;AAE5CW,MAAAA;AACJ,MAAIF,gBAAgB;AAClBE,qBAAiBJ,eACbK,MAAAA,MAAMlB,WAAW,OAAO,IACxBN;AAAAA,EACN;AAEA,yCACGyB,YAAAA,eAAa;AAAA,IACZzC;AAAAA,IACAC;AAAAA,IACAa,QAAQc;AAAAA,IACRvB;AAAAA,IACAF;AAAAA,IACAC;AAAAA,IACAL,WAAWqB,GAAGvB,QAAQ6C,MAAM3C,SAAS;AAAA,IAAE4C,UAEtCrC,CAAAA,SACCsC,2BAAAA,IAACC,eAAO;AAAA,MACN7C,IAAIwC,MAAAA,MAAMlB,WAAW,OAAO;AAAA,MAC5BwB,SAASN,MAAAA,MAAMlB,WAAW,OAAO;AAAA,MACjChB;AAAAA,MACAP,WAAWF,QAAQS;AAAAA,MAAM,GACrBI;AAAAA,IAAAA,CACL,GAEHkC,2BAAAA,IAAA,OAAA;AAAA,MACE7C,WAAWqB,GAAGvB,QAAQkD,iBAAiB;AAAA,QACrC,CAAClD,QAAQmD,aAAa,GAAGX;AAAAA,MAAAA,CAC1B;AAAA,MAAEM,yCAEFM,yBAAY;AAAA,QACXjD,IAAIM,QAAQkC,MAAAA,MAAMlB,WAAW,OAAO,IAAIkB,MAAAA,MAAMxC,IAAI,OAAO;AAAA,QACzDC;AAAAA,QACAI;AAAAA,QACAD;AAAAA,QACAD;AAAAA,QACAU,UAAUkB;AAAAA,QACV7B;AAAAA,QACAS,SAASa;AAAAA,QACTP,YAAY;AAAA,UACV,gBAAgBoB,iBAAiB,OAAOD;AAAAA,UACxC,qBAAqBG;AAAAA,UACrB,cAAchC;AAAAA,UACd,mBAAmBC;AAAAA,UACnB,oBAAoBC;AAAAA,UACpB,GAAGQ;AAAAA,QACL;AAAA,QAAE,GACEC;AAAAA,MAAAA,CACL;AAAA,IAAA,CACE,GACJiB,gBACCS,2BAAAA,IAACM,2BAAa;AAAA,MACZlD,IAAIwC,MAAAA,MAAMlB,WAAW,OAAO;AAAA,MAC5BvB,WAAWF,QAAQsD;AAAAA,MACnBC,eAAa;AAAA,MACbC,kBAAgB;AAAA,MAChBC,UAAQ;AAAA,MAAAX,UAEPb;AAAAA,IAAAA,CACY,CAChB;AAAA,EAAA,CACY;AAEnB;;;"}
1
+ {"version":3,"file":"Switch.cjs","sources":["../../../../src/components/Switch/Switch.tsx"],"sourcesContent":["import React, { useCallback } from \"react\";\n\nimport { SwitchProps as MuiSwitchProps } from \"@mui/material\";\n\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { useUniqueId } from \"@core/hooks/useUniqueId\";\nimport { useControlled } from \"@core/hooks/useControlled\";\nimport { setId } from \"@core/utils/setId\";\nimport {\n HvWarningText,\n HvLabelProps,\n HvFormStatus,\n HvFormElement,\n HvLabel,\n} from \"@core/components/Forms\";\nimport { HvBaseSwitch } from \"@core/components/BaseSwitch\";\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { isInvalid } from \"@core/components/Forms/FormElement/validationStates\";\nimport { ExtractNames } from \"@core/utils/classes\";\n\nimport { staticClasses, useClasses } from \"./Switch.styles\";\n\nexport { staticClasses as switchClasses };\n\nexport type HvSwitchClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvSwitchProps\n extends Omit<MuiSwitchProps, \"onChange\" | \"classes\">,\n HvBaseProps<HTMLButtonElement, \"onChange\" | \"color\"> {\n /**\n * A Jss Object used to override or extend the styles applied to the switch.\n */\n classes?: HvSwitchClasses;\n /**\n * The form element name.\n */\n name?: string;\n /**\n * The value of the form element.\n *\n * Is up to the application's logic when to consider the submission of this value.\n * Generally it should be used only when the switch is neither unchecked nor indeterminate.\n *\n * The default value is \"on\".\n */\n value?: any;\n /**\n * The label of the form element.\n *\n * The form element must be labeled for accessibility reasons.\n * If not provided, an aria-label or aria-labelledby must be inputted via inputProps.\n */\n label?: React.ReactNode;\n /**\n * Properties passed on to the label element.\n */\n labelProps?: HvLabelProps;\n /**\n * Indicates that the form element is disabled.\n */\n disabled?: boolean;\n /**\n * Indicates that the form element is not editable.\n */\n readOnly?: boolean;\n /**\n * Indicates that user input is required on the form element.\n */\n required?: boolean;\n /**\n * If `true` the switch is selected, if set to `false` the switch is not selected.\n *\n * When defined the switch state becomes controlled.\n */\n checked?: boolean;\n /**\n * When uncontrolled, defines the initial checked state.\n */\n defaultChecked?: boolean;\n /**\n * The status of the form element.\n *\n * Valid is correct, invalid is incorrect and standBy means no validations have run.\n *\n * When uncontrolled and unspecified it will default to \"standBy\" and change to either \"valid\"\n * or \"invalid\" after any change to `checked`, depending of the values of both `required` and `checked`.\n */\n status?: HvFormStatus;\n /**\n * The error message to show when the validation status is \"invalid\".\n *\n * Defaults to \"Required\" when the status is uncontrolled and no `aria-errormessage` is provided.\n */\n statusMessage?: string;\n /**\n * Identifies the element that provides an error message for the switch.\n *\n * Will only be used when the validation status is invalid.\n */\n \"aria-errormessage\"?: string;\n /**\n * The callback fired when the switch is pressed.\n */\n onChange?: (event: React.ChangeEvent, checked: boolean, value: any) => void;\n /**\n * Properties passed on to the input element.\n */\n inputProps?: React.InputHTMLAttributes<HTMLInputElement>;\n /** @ignore */\n ref?: MuiSwitchProps[\"ref\"];\n /** @ignore */\n component?: MuiSwitchProps[\"component\"];\n}\n\n/**\n * A Switch is <b>binary</b> and work as a digital on/off button.\n *\n * Use when two states are <b>opposite</b> and to trigger immediate\n * changes in the system.\n */\nexport const HvSwitch = (props: HvSwitchProps) => {\n const {\n classes: classesProp,\n className,\n\n id,\n name,\n value = \"on\",\n required = false,\n readOnly = false,\n disabled = false,\n\n label,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-describedby\": ariaDescribedBy,\n labelProps,\n\n checked,\n defaultChecked = false,\n\n onChange,\n\n status,\n statusMessage,\n \"aria-errormessage\": ariaErrorMessage,\n\n inputProps,\n\n ...others\n } = useDefaultProps(\"HvSwitch\", props);\n\n const { classes, cx } = useClasses(classesProp);\n\n const elementId = useUniqueId(id, \"hvswitch\");\n\n const [isChecked, setIsChecked] = useControlled(\n checked,\n Boolean(defaultChecked)\n );\n\n const [validationState, setValidationState] = useControlled(\n status,\n \"standBy\"\n );\n\n const [validationMessage] = useControlled(statusMessage, \"Required\");\n\n const onLocalChange = useCallback(\n (evt, newChecked) => {\n setIsChecked(() => {\n // this will only run if uncontrolled\n if (required && !newChecked) {\n setValidationState(\"invalid\");\n } else {\n setValidationState(\"valid\");\n }\n\n return newChecked;\n });\n\n onChange?.(evt, newChecked, value);\n },\n [onChange, required, setIsChecked, setValidationState, value]\n );\n\n // the error message area will only be created if:\n // - an external element that provides an error message isn't identified via aria-errormessage AND\n // - both status and statusMessage properties are being controlled OR\n // - status is uncontrolled and required is true\n const canShowError =\n ariaErrorMessage == null &&\n ((status !== undefined && statusMessage !== undefined) ||\n (status === undefined && required));\n\n const isStateInvalid = isInvalid(validationState);\n\n let errorMessageId: string | undefined;\n if (isStateInvalid) {\n errorMessageId = canShowError\n ? setId(elementId, \"error\")\n : ariaErrorMessage;\n }\n\n return (\n <HvFormElement\n id={id}\n name={name}\n status={validationState}\n disabled={disabled}\n required={required}\n readOnly={readOnly}\n className={cx(classes.root, className)}\n >\n {label && (\n <HvLabel\n id={setId(elementId, \"label\")}\n htmlFor={setId(elementId, \"input\")}\n label={label}\n className={classes.label}\n {...labelProps}\n />\n )}\n <div\n className={cx(classes.switchContainer, {\n [classes.invalidSwitch]: isStateInvalid,\n })}\n >\n <HvBaseSwitch\n id={label ? setId(elementId, \"input\") : setId(id, \"input\")}\n name={name}\n disabled={disabled}\n readOnly={readOnly}\n required={required}\n onChange={onLocalChange}\n value={value}\n checked={isChecked}\n inputProps={{\n \"aria-invalid\": isStateInvalid ? true : undefined,\n \"aria-errormessage\": errorMessageId,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-describedby\": ariaDescribedBy,\n ...inputProps,\n }}\n {...others}\n />\n </div>\n {canShowError && (\n <HvWarningText\n id={setId(elementId, \"error\")}\n className={classes.error}\n disableBorder\n disableAdornment\n hideText\n >\n {validationMessage}\n </HvWarningText>\n )}\n </HvFormElement>\n );\n};\n"],"names":["HvSwitch","props","classes","classesProp","className","id","name","value","required","readOnly","disabled","label","ariaLabel","ariaLabelledBy","ariaDescribedBy","labelProps","checked","defaultChecked","onChange","status","statusMessage","ariaErrorMessage","inputProps","others","useDefaultProps","cx","useClasses","elementId","useUniqueId","isChecked","setIsChecked","useControlled","Boolean","validationState","setValidationState","validationMessage","onLocalChange","useCallback","evt","newChecked","canShowError","undefined","isStateInvalid","isInvalid","errorMessageId","setId","HvFormElement","root","children","_jsx","HvLabel","htmlFor","switchContainer","invalidSwitch","HvBaseSwitch","HvWarningText","error","disableBorder","disableAdornment","hideText"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"Tabs.cjs","sources":["../../../../src/components/Tabs/Tabs.tsx"],"sourcesContent":["import { Tabs, TabsProps as MuiTabsProps } from \"@mui/material\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { staticClasses, useClasses } from \"./Tabs.styles\";\n\nexport { staticClasses as tabsClasses };\n\nexport type HvTabsClasses = ExtractNames<typeof useClasses>;\n\n// Mui Tabs props: https://mui.com/material-ui/api/tabs/#props\nexport interface HvTabsProps extends Omit<MuiTabsProps, \"onChange\"> {\n /**\n * The value of the currently selected Tab. If you don't want any selected Tab, you can set this property to `false`.\n */\n value?: any;\n /**\n * Callback fired when the value changes.\n */\n onChange?: (event: React.SyntheticEvent, value: any) => void;\n /**\n * A Jss Object used to override or extend the component styles.\n */\n classes?: HvTabsClasses;\n}\n\n/**\n * A Tab is a graphical control element that allows multiple documents or panels to be contained within a single window.\n * Tabs can be used as a navigational widget for switching between sets of documents.\n */\nexport const HvTabs = (props: HvTabsProps) => {\n const { classes: classesProp, ...others } = useDefaultProps(\"HvTabs\", props);\n\n const { classes } = useClasses(classesProp);\n\n return (\n <Tabs\n classes={{\n root: classes.root,\n flexContainer: classes.flexContainer,\n indicator: classes.indicator,\n scroller: classes.scroller,\n }}\n TabIndicatorProps={{ children: <div /> }}\n {...others}\n />\n );\n};\n"],"names":["HvTabs","props","classes","classesProp","others","useDefaultProps","useClasses","Tabs","root","flexContainer","indicator","scroller","TabIndicatorProps","children","_jsx"],"mappings":";;;;;;AA6BaA,MAAAA,SAASA,CAACC,UAAuB;AACtC,QAAA;AAAA,IAAEC,SAASC;AAAAA,IAAa,GAAGC;AAAAA,EAAAA,IAAWC,gBAAgB,gBAAA,UAAUJ,KAAK;AAErE,QAAA;AAAA,IAAEC;AAAAA,EAAAA,IAAYI,YAAAA,WAAWH,WAAW;AAE1C,wCACGI,SAAAA,MAAI;AAAA,IACHL,SAAS;AAAA,MACPM,MAAMN,QAAQM;AAAAA,MACdC,eAAeP,QAAQO;AAAAA,MACvBC,WAAWR,QAAQQ;AAAAA,MACnBC,UAAUT,QAAQS;AAAAA,IACpB;AAAA,IACAC,mBAAmB;AAAA,MAAEC,UAAUC,2BAAAA,IAAM,OAAA,EAAA;AAAA,IAAE;AAAA,IAAE,GACrCV;AAAAA,EAAAA,CACL;AAEL;;;"}
1
+ {"version":3,"file":"Tabs.cjs","sources":["../../../../src/components/Tabs/Tabs.tsx"],"sourcesContent":["import { Tabs, TabsProps as MuiTabsProps } from \"@mui/material\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { staticClasses, useClasses } from \"./Tabs.styles\";\n\nexport { staticClasses as tabsClasses };\n\nexport type HvTabsClasses = ExtractNames<typeof useClasses>;\n\n// Mui Tabs props: https://mui.com/material-ui/api/tabs/#props\nexport interface HvTabsProps extends Omit<MuiTabsProps, \"onChange\"> {\n /**\n * The value of the currently selected Tab. If you don't want any selected Tab, you can set this property to `false`.\n */\n value?: any;\n /**\n * Callback fired when the value changes.\n */\n onChange?: (event: React.SyntheticEvent, value: any) => void;\n /**\n * A Jss Object used to override or extend the component styles.\n */\n classes?: HvTabsClasses;\n /** @ignore */\n ref?: MuiTabsProps[\"ref\"];\n /** @ignore */\n component?: MuiTabsProps[\"component\"];\n}\n\n/**\n * A Tab is a graphical control element that allows multiple documents or panels to be contained within a single window.\n * Tabs can be used as a navigational widget for switching between sets of documents.\n */\nexport const HvTabs = (props: HvTabsProps) => {\n const { classes: classesProp, ...others } = useDefaultProps(\"HvTabs\", props);\n\n const { classes } = useClasses(classesProp);\n\n return (\n <Tabs\n classes={{\n root: classes.root,\n flexContainer: classes.flexContainer,\n indicator: classes.indicator,\n scroller: classes.scroller,\n }}\n TabIndicatorProps={{ children: <div /> }}\n {...others}\n />\n );\n};\n"],"names":["HvTabs","props","classes","classesProp","others","useDefaultProps","useClasses","Tabs","root","flexContainer","indicator","scroller","TabIndicatorProps","children","_jsx"],"mappings":";;;;;;AAiCaA,MAAAA,SAASA,CAACC,UAAuB;AACtC,QAAA;AAAA,IAAEC,SAASC;AAAAA,IAAa,GAAGC;AAAAA,EAAAA,IAAWC,gBAAgB,gBAAA,UAAUJ,KAAK;AAErE,QAAA;AAAA,IAAEC;AAAAA,EAAAA,IAAYI,YAAAA,WAAWH,WAAW;AAE1C,wCACGI,SAAAA,MAAI;AAAA,IACHL,SAAS;AAAA,MACPM,MAAMN,QAAQM;AAAAA,MACdC,eAAeP,QAAQO;AAAAA,MACvBC,WAAWR,QAAQQ;AAAAA,MACnBC,UAAUT,QAAQS;AAAAA,IACpB;AAAA,IACAC,mBAAmB;AAAA,MAAEC,UAAUC,2BAAAA,IAAM,OAAA,EAAA;AAAA,IAAE;AAAA,IAAE,GACrCV;AAAAA,EAAAA,CACL;AAEL;;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"Tag.cjs","sources":["../../../../src/components/Tag/Tag.tsx"],"sourcesContent":["import { CSSProperties, useState } from \"react\";\nimport { HvColorAny, theme } from \"@hitachivantara/uikit-styles\";\nimport Chip, { ChipProps as MuiChipProps } from \"@mui/material/Chip\";\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { useTheme } from \"@core/hooks/useTheme\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { HvButton, HvButtonProps } from \"@core/components/Button\";\n\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { CloseXS } from \"@hitachivantara/uikit-react-icons\";\nimport { staticClasses, useClasses } from \"./Tag.styles\";\nimport { getOnDeleteCallback, hasDeleteAction, hasClickAction } from \"./utils\";\n\nexport { staticClasses as tagClasses };\n\nexport type HvTagClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvTagProps\n extends Omit<MuiChipProps, \"color\" | \"classes\">,\n HvBaseProps<HTMLDivElement, \"children\"> {\n /** Inline styles to be applied to the root element. */\n style?: CSSProperties;\n /** The label of the tag element. */\n label?: React.ReactNode;\n /** Indicates that the form element is disabled. */\n disabled?: boolean;\n /** The type of the tag element. A tag can be of semantic or categoric type. */\n type?: \"semantic\" | \"categorical\";\n /** Background color to be applied to the tag */\n color?: HvColorAny;\n /** Icon used to customize the delete icon in the Chip element */\n deleteIcon?: React.ReactElement;\n /**\n * The callback fired when the delete icon is pressed.\n * This function has to be provided to the component, in order to render the delete icon\n * */\n onDelete?: (event: React.MouseEvent<HTMLElement>) => void;\n /** Callback triggered when any item is clicked. */\n onClick?: (event: React.MouseEvent<HTMLElement>) => void;\n /** The role of the element with an attributed event. */\n role?: string;\n /** Aria properties to apply to delete button in tag */\n deleteButtonArialLabel?: string; // TODO: fix typo \"ArialLabel\" in next version\n /** Props to apply to delete button */\n deleteButtonProps?: HvButtonProps;\n /** A Jss Object used to override or extend the styles applied to the component. */\n classes?: HvTagClasses;\n}\n\nconst getColor = (customColor, type, colors) => {\n const defaultSemanticColor = theme.colors.neutral_20;\n const defaultCategoricalColor = colors.cat1;\n\n let backgroundColor;\n\n if (type === \"semantic\") {\n backgroundColor =\n theme.colors[customColor] || customColor || defaultSemanticColor;\n }\n if (type === \"categorical\") {\n backgroundColor =\n colors[customColor] || customColor || defaultCategoricalColor;\n }\n return backgroundColor;\n};\n\n/**\n * A Tag is one word that describes a specific aspect of an asset. A single asset can have\n * multiple tags.\n * Use tags to highlight an item's status for quick recognition and navigation\n * Use color to indicate meanings that users can learn and recognize across products\n *\n * It leverages the Chip component from Material UI\n */\nexport const HvTag = (props: HvTagProps) => {\n const {\n classes: classesProp,\n className,\n style,\n label,\n disabled,\n type = \"semantic\",\n color,\n deleteIcon,\n onDelete,\n onClick,\n role,\n deleteButtonArialLabel = \"Delete tag\",\n deleteButtonProps = {},\n ...others\n } = useDefaultProps(\"HvTag\", props);\n const { colors } = useTheme();\n const { classes, cx, css } = useClasses(classesProp);\n\n const getDeleteIcon = () => {\n const disabledSemanticColor =\n type === \"semantic\" ? \"secondary_60\" : \"base_dark\";\n const { tabIndex = 0 } = deleteButtonProps;\n\n const closeIconStyles = css({\n ...(disabled ? { cursor: \"not-allowed\" } : undefined),\n height: 16,\n \"& svg .color0\": {\n fill: theme.colors[disabled ? disabledSemanticColor : \"base_dark\"],\n },\n });\n return (\n <HvButton\n classes={{\n startIcon: classes.tagButton,\n focusVisible: classes.focusVisible,\n root: classes.button,\n }}\n aria-label={deleteButtonArialLabel}\n tabIndex={tabIndex}\n variant=\"secondaryGhost\"\n {...deleteButtonProps}\n >\n <CloseXS\n iconSize=\"XS\"\n className={closeIconStyles}\n color={disabled ? disabledSemanticColor : \"base_dark\"}\n />\n </HvButton>\n );\n };\n\n const inlineStyle = {\n ...style,\n };\n\n const categoricalBackgroundColor =\n type === \"categorical\" ? getColor(color, type, colors) : undefined;\n\n if (type === \"semantic\") {\n inlineStyle.backgroundColor = getColor(color, type, {});\n } else if (type === \"categorical\") {\n inlineStyle.backgroundColor = `${categoricalBackgroundColor}30`;\n }\n\n const [hover, setHover] = useState(false);\n\n return (\n <Chip\n label={label}\n className={cx(classes.root, className)}\n onMouseEnter={() => {\n setHover(!!onClick);\n }}\n onMouseLeave={() => {\n setHover(false);\n }}\n style={{\n ...(disabled ? null : inlineStyle),\n ...(hover && !disabled\n ? { boxShadow: `0 0 0 1pt ${categoricalBackgroundColor}` }\n : null),\n }}\n classes={{\n root: cx(classes.chipRoot, {\n [classes.disabled]: disabled,\n [classes.clickable]: !!onClick,\n [classes.categorical]: type === \"categorical\",\n [classes.categoricalFocus]: type === \"categorical\" && !disabled,\n [classes.categoricalDisabled]: type === \"categorical\" && disabled,\n }),\n label: classes.label,\n deleteIcon: cx(classes.deleteIcon, {\n [classes.disabledDeleteIcon]: disabled,\n }),\n }}\n deleteIcon={(hasDeleteAction(onDelete) && deleteIcon) || getDeleteIcon()}\n onDelete={getOnDeleteCallback(disabled, onDelete)}\n onClick={disabled ? undefined : onClick}\n role={role || (hasClickAction(onClick) ? \"button\" : undefined)}\n tabIndex={hasDeleteAction(onDelete) ? undefined : 0}\n {...others}\n />\n );\n};\n"],"names":["getColor","customColor","type","colors","defaultSemanticColor","theme","neutral_20","defaultCategoricalColor","cat1","backgroundColor","HvTag","props","classes","classesProp","className","style","label","disabled","color","deleteIcon","onDelete","onClick","role","deleteButtonArialLabel","deleteButtonProps","others","useDefaultProps","useTheme","cx","css","useClasses","getDeleteIcon","disabledSemanticColor","tabIndex","closeIconStyles","cursor","undefined","height","fill","HvButton","startIcon","tagButton","focusVisible","root","button","variant","children","CloseXS","iconSize","inlineStyle","categoricalBackgroundColor","hover","setHover","useState","Chip","onMouseEnter","onMouseLeave","boxShadow","chipRoot","clickable","categorical","categoricalFocus","categoricalDisabled","disabledDeleteIcon","hasDeleteAction","getOnDeleteCallback","hasClickAction"],"mappings":"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"}
1
+ {"version":3,"file":"Tag.cjs","sources":["../../../../src/components/Tag/Tag.tsx"],"sourcesContent":["import { useState } from \"react\";\nimport { HvColorAny, theme } from \"@hitachivantara/uikit-styles\";\nimport Chip, { ChipProps as MuiChipProps } from \"@mui/material/Chip\";\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { useTheme } from \"@core/hooks/useTheme\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { HvButton, HvButtonProps } from \"@core/components/Button\";\n\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { CloseXS } from \"@hitachivantara/uikit-react-icons\";\nimport { staticClasses, useClasses } from \"./Tag.styles\";\nimport { getOnDeleteCallback, hasDeleteAction, hasClickAction } from \"./utils\";\n\nexport { staticClasses as tagClasses };\n\nexport type HvTagClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvTagProps\n extends Omit<MuiChipProps, \"color\" | \"classes\">,\n HvBaseProps<HTMLDivElement, \"children\"> {\n /** The label of the tag element. */\n label?: React.ReactNode;\n /** Indicates that the form element is disabled. */\n disabled?: boolean;\n /** The type of the tag element. A tag can be of semantic or categoric type. */\n type?: \"semantic\" | \"categorical\";\n /** Background color to be applied to the tag */\n color?: HvColorAny;\n /** Icon used to customize the delete icon in the Chip element */\n deleteIcon?: React.ReactElement;\n /**\n * The callback fired when the delete icon is pressed.\n * This function has to be provided to the component, in order to render the delete icon\n * */\n onDelete?: (event: React.MouseEvent<HTMLElement>) => void;\n /** Callback triggered when any item is clicked. */\n onClick?: (event: React.MouseEvent<HTMLElement>) => void;\n /** The role of the element with an attributed event. */\n role?: string;\n /** Aria properties to apply to delete button in tag */\n deleteButtonArialLabel?: string; // TODO: fix typo \"ArialLabel\" in next version\n /** Props to apply to delete button */\n deleteButtonProps?: HvButtonProps;\n /** A Jss Object used to override or extend the styles applied to the component. */\n classes?: HvTagClasses;\n /** @ignore */\n ref?: MuiChipProps[\"ref\"];\n /** @ignore */\n component?: MuiChipProps[\"component\"];\n}\n\nconst getColor = (customColor, type, colors) => {\n const defaultSemanticColor = theme.colors.neutral_20;\n const defaultCategoricalColor = colors.cat1;\n\n let backgroundColor;\n\n if (type === \"semantic\") {\n backgroundColor =\n theme.colors[customColor] || customColor || defaultSemanticColor;\n }\n if (type === \"categorical\") {\n backgroundColor =\n colors[customColor] || customColor || defaultCategoricalColor;\n }\n return backgroundColor;\n};\n\n/**\n * A Tag is one word that describes a specific aspect of an asset. A single asset can have\n * multiple tags.\n * Use tags to highlight an item's status for quick recognition and navigation\n * Use color to indicate meanings that users can learn and recognize across products\n *\n * It leverages the Chip component from Material UI\n */\nexport const HvTag = (props: HvTagProps) => {\n const {\n classes: classesProp,\n className,\n style,\n label,\n disabled,\n type = \"semantic\",\n color,\n deleteIcon,\n onDelete,\n onClick,\n role,\n deleteButtonArialLabel = \"Delete tag\",\n deleteButtonProps = {},\n ...others\n } = useDefaultProps(\"HvTag\", props);\n const { colors } = useTheme();\n const { classes, cx, css } = useClasses(classesProp);\n\n const getDeleteIcon = () => {\n const disabledSemanticColor =\n type === \"semantic\" ? \"secondary_60\" : \"base_dark\";\n const { tabIndex = 0 } = deleteButtonProps;\n\n const closeIconStyles = css({\n ...(disabled ? { cursor: \"not-allowed\" } : undefined),\n height: 16,\n \"& svg .color0\": {\n fill: theme.colors[disabled ? disabledSemanticColor : \"base_dark\"],\n },\n });\n return (\n <HvButton\n classes={{\n startIcon: classes.tagButton,\n focusVisible: classes.focusVisible,\n root: classes.button,\n }}\n aria-label={deleteButtonArialLabel}\n tabIndex={tabIndex}\n variant=\"secondaryGhost\"\n {...deleteButtonProps}\n >\n <CloseXS\n iconSize=\"XS\"\n className={closeIconStyles}\n color={disabled ? disabledSemanticColor : \"base_dark\"}\n />\n </HvButton>\n );\n };\n\n const inlineStyle = {\n ...style,\n };\n\n const categoricalBackgroundColor =\n type === \"categorical\" ? getColor(color, type, colors) : undefined;\n\n if (type === \"semantic\") {\n inlineStyle.backgroundColor = getColor(color, type, {});\n } else if (type === \"categorical\") {\n inlineStyle.backgroundColor = `${categoricalBackgroundColor}30`;\n }\n\n const [hover, setHover] = useState(false);\n\n return (\n <Chip\n label={label}\n className={cx(classes.root, className)}\n onMouseEnter={() => {\n setHover(!!onClick);\n }}\n onMouseLeave={() => {\n setHover(false);\n }}\n style={{\n ...(disabled ? null : inlineStyle),\n ...(hover && !disabled\n ? { boxShadow: `0 0 0 1pt ${categoricalBackgroundColor}` }\n : null),\n }}\n classes={{\n root: cx(classes.chipRoot, {\n [classes.disabled]: disabled,\n [classes.clickable]: !!onClick,\n [classes.categorical]: type === \"categorical\",\n [classes.categoricalFocus]: type === \"categorical\" && !disabled,\n [classes.categoricalDisabled]: type === \"categorical\" && disabled,\n }),\n label: classes.label,\n deleteIcon: cx(classes.deleteIcon, {\n [classes.disabledDeleteIcon]: disabled,\n }),\n }}\n deleteIcon={(hasDeleteAction(onDelete) && deleteIcon) || getDeleteIcon()}\n onDelete={getOnDeleteCallback(disabled, onDelete)}\n onClick={disabled ? undefined : onClick}\n role={role || (hasClickAction(onClick) ? \"button\" : undefined)}\n tabIndex={hasDeleteAction(onDelete) ? undefined : 0}\n {...others}\n />\n );\n};\n"],"names":["getColor","customColor","type","colors","defaultSemanticColor","theme","neutral_20","defaultCategoricalColor","cat1","backgroundColor","HvTag","props","classes","classesProp","className","style","label","disabled","color","deleteIcon","onDelete","onClick","role","deleteButtonArialLabel","deleteButtonProps","others","useDefaultProps","useTheme","cx","css","useClasses","getDeleteIcon","disabledSemanticColor","tabIndex","closeIconStyles","cursor","undefined","height","fill","HvButton","startIcon","tagButton","focusVisible","root","button","variant","children","CloseXS","iconSize","inlineStyle","categoricalBackgroundColor","hover","setHover","useState","Chip","onMouseEnter","onMouseLeave","boxShadow","chipRoot","clickable","categorical","categoricalFocus","categoricalDisabled","disabledDeleteIcon","hasDeleteAction","getOnDeleteCallback","hasClickAction"],"mappings":"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"}