@hitachivantara/uikit-react-core 5.29.0 → 5.30.1

package/dist/cjs/components/BaseDropdown/BaseDropdown.cjs

@@ -4,7 +4,6 @@ const jsxRuntime = require("@emotion/react/jsx-runtime");
 const React = require("react");
 const reactDom = require("react-dom");
 const material = require("@mui/material");
-const uikitStyles = require("@hitachivantara/uikit-styles");
 const uikitReactIcons = require("@hitachivantara/uikit-react-icons");
 const reactPopper = require("react-popper");
 const core = require("@popperjs/core");
@@ -86,8 +85,7 @@ const HvBaseDropdown = (props) => {
     ...otherPopperProps
   } = popperProps;
   const onFirstUpdate = React.useCallback(() => {
-    if (onContainerCreation)
-      onContainerCreation(popperElement);
+    onContainerCreation == null ? void 0 : onContainerCreation(popperElement);
   }, [onContainerCreation, popperElement]);
   const widthCalculator = React.useCallback(({
     state
@@ -176,53 +174,48 @@ const HvBaseDropdown = (props) => {
     if (disabled || notControlKey || ignoredCombinations)
       return;
     const newOpen = !isOpen;
-    const focusHeader = () => {
+    setIsOpen(() => {
       if (!newOpen) {
         referenceElement == null ? void 0 : referenceElement.focus({
           preventScroll: true
         });
       }
       return newOpen;
-    };
-    setIsOpen(focusHeader());
+    });
     onToggle == null ? void 0 : onToggle(event, newOpen);
   }, [isOpen, disabled, setIsOpen, onToggle, referenceElement]);
-  const headerComponent = (() => {
-    if (component) {
-      return React__default.default.cloneElement(component, {
-        ref: handleDropdownHeaderRef,
-        ...headerControlArias
-      });
+  const ExpanderComponent = isOpen ? uikitReactIcons.DropUpXS : uikitReactIcons.DropDownXS;
+  const defaultHeaderElement = /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      id: setId.setId(id, "header"),
+      className: cx(classes.header, {
+        [classes.headerDisabled]: disabled,
+        [classes.headerReadOnly]: readOnly,
+        [classes.headerOpen]: isOpen,
+        [classes.headerOpenUp]: isOpen && popperPlacement.includes("top"),
+        [classes.headerOpenDown]: isOpen && popperPlacement.includes("bottom")
+      }),
+      role: ariaRole === "combobox" ? "textbox" : void 0,
+      ...headerAriaLabels,
+      style: disabled || readOnly ? {
+        pointerEvents: "none"
+      } : void 0,
+      tabIndex: disabled ? -1 : 0,
+      ref: handleDropdownHeaderRef,
+      ...dropdownHeaderProps,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.selection, children: placeholder && typeof placeholder === "string" ? /* @__PURE__ */ jsxRuntime.jsx(Typography.HvTypography, { className: cx(classes.placeholder, {
+          [classes.selectionDisabled]: disabled
+        }), variant: "body", children: placeholder }) : placeholder }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.arrowContainer, children: adornment || /* @__PURE__ */ jsxRuntime.jsx(ExpanderComponent, { iconSize: "XS", color: disabled ? "secondary_60" : void 0, className: classes.arrow }) })
+      ]
     }
-    const ExpanderComponent = isOpen ? uikitReactIcons.DropUpXS : uikitReactIcons.DropDownXS;
-    return /* @__PURE__ */ jsxRuntime.jsxs(
-      "div",
-      {
-        id: setId.setId(id, "header"),
-        className: cx(classes.header, {
-          [classes.headerDisabled]: disabled,
-          [classes.headerReadOnly]: readOnly,
-          [classes.headerOpen]: isOpen,
-          [classes.headerOpenUp]: isOpen && popperPlacement.includes("top"),
-          [classes.headerOpenDown]: isOpen && popperPlacement.includes("bottom")
-        }),
-        role: ariaRole === "combobox" ? "textbox" : void 0,
-        ...headerAriaLabels,
-        style: disabled || readOnly ? {
-          pointerEvents: "none"
-        } : void 0,
-        tabIndex: disabled ? -1 : 0,
-        ref: handleDropdownHeaderRef,
-        ...dropdownHeaderProps,
-        children: [
-          /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.selection, children: placeholder && typeof placeholder === "string" ? /* @__PURE__ */ jsxRuntime.jsx(Typography.HvTypography, { className: cx(classes.placeholder, {
-            [classes.selectionDisabled]: disabled
-          }), variant: "body", children: placeholder }) : placeholder }),
-          /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.arrowContainer, children: adornment || /* @__PURE__ */ jsxRuntime.jsx(ExpanderComponent, { iconSize: "XS", color: disabled ? uikitStyles.theme.colors.secondary_60 : void 0, className: classes.arrow }) })
-        ]
-      }
-    );
-  })();
+  );
+  const headerElement = component && React__default.default.isValidElement(component) ? React__default.default.cloneElement(component, {
+    ref: handleDropdownHeaderRef,
+    ...headerControlArias
+  }) : defaultHeaderElement;
   const containerComponent = (() => {
     const handleContainerKeyDown = (event) => {
       var _a2;
@@ -285,7 +278,7 @@ const HvBaseDropdown = (props) => {
         },
         tabIndex: -1,
         ...others,
-        children: headerComponent
+        children: headerElement
       }
     ),
     isOpen && containerComponent

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

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

package/dist/cjs/components/Calendar/Calendar.styles.cjs

@@ -18,7 +18,7 @@ const {
       "& ~ $singleCalendar": {
         // target the next calendar when the former is hovered
         "& > div": {
-          "& > div:nth-child(3)": {
+          "& > div:nth-of-type(3)": {
             "& > div": {
               "& > div[data-calendar-cell='calendarCell']": {
                 backgroundColor: uikitStyles.theme.colors.atmo1

package/dist/cjs/components/Calendar/Calendar.styles.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Calendar.styles.cjs","sources":["../../../../src/components/Calendar/Calendar.styles.tsx"],"sourcesContent":["import { createClasses } from \"@core/utils/classes\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvCalendar\", {\n  root: {\n    display: \"flex\",\n    justifyContent: \"center\",\n  },\n  rangeCalendarContainer: {\n    display: \"flex\",\n  },\n  singleCalendar: {\n    \"&:hover\": {\n      \"& ~ $singleCalendar\": {\n        // target the next calendar when the former is hovered\n        \"& > div\": {\n          \"& > div:nth-child(3)\": {\n            \"& > div\": {\n              \"& > div[data-calendar-cell='calendarCell']\": {\n                backgroundColor: theme.colors.atmo1,\n              },\n            },\n          },\n        },\n      },\n    },\n  },\n  focusSelection: {},\n  calendarMonthlyCell: {},\n  calendarMonthlyCellSelected: {},\n});\n"],"names":["staticClasses","useClasses","createClasses","root","display","justifyContent","rangeCalendarContainer","singleCalendar","backgroundColor","theme","colors","atmo1","focusSelection","calendarMonthlyCell","calendarMonthlyCellSelected"],"mappings":";;;;AAGa,MAAA;AAAA,EAAEA;AAAAA,EAAeC;AAAW,IAAIC,QAAAA,cAAc,cAAc;AAAA,EACvEC,MAAM;AAAA,IACJC,SAAS;AAAA,IACTC,gBAAgB;AAAA,EAClB;AAAA,EACAC,wBAAwB;AAAA,IACtBF,SAAS;AAAA,EACX;AAAA,EACAG,gBAAgB;AAAA,IACd,WAAW;AAAA,MACT,uBAAuB;AAAA;AAAA,QAErB,WAAW;AAAA,UACT,wBAAwB;AAAA,YACtB,WAAW;AAAA,cACT,8CAA8C;AAAA,gBAC5CC,iBAAiBC,YAAAA,MAAMC,OAAOC;AAAAA,cAChC;AAAA,YACF;AAAA,UACF;AAAA,QACF;AAAA,MACF;AAAA,IACF;AAAA,EACF;AAAA,EACAC,gBAAgB,CAAC;AAAA,EACjBC,qBAAqB,CAAC;AAAA,EACtBC,6BAA6B,CAAC;AAChC,CAAC;;;"}
+{"version":3,"file":"Calendar.styles.cjs","sources":["../../../../src/components/Calendar/Calendar.styles.tsx"],"sourcesContent":["import { createClasses } from \"@core/utils/classes\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvCalendar\", {\n  root: {\n    display: \"flex\",\n    justifyContent: \"center\",\n  },\n  rangeCalendarContainer: {\n    display: \"flex\",\n  },\n  singleCalendar: {\n    \"&:hover\": {\n      \"& ~ $singleCalendar\": {\n        // target the next calendar when the former is hovered\n        \"& > div\": {\n          \"& > div:nth-of-type(3)\": {\n            \"& > div\": {\n              \"& > div[data-calendar-cell='calendarCell']\": {\n                backgroundColor: theme.colors.atmo1,\n              },\n            },\n          },\n        },\n      },\n    },\n  },\n  focusSelection: {},\n  calendarMonthlyCell: {},\n  calendarMonthlyCellSelected: {},\n});\n"],"names":["staticClasses","useClasses","createClasses","root","display","justifyContent","rangeCalendarContainer","singleCalendar","backgroundColor","theme","colors","atmo1","focusSelection","calendarMonthlyCell","calendarMonthlyCellSelected"],"mappings":";;;;AAGa,MAAA;AAAA,EAAEA;AAAAA,EAAeC;AAAW,IAAIC,QAAAA,cAAc,cAAc;AAAA,EACvEC,MAAM;AAAA,IACJC,SAAS;AAAA,IACTC,gBAAgB;AAAA,EAClB;AAAA,EACAC,wBAAwB;AAAA,IACtBF,SAAS;AAAA,EACX;AAAA,EACAG,gBAAgB;AAAA,IACd,WAAW;AAAA,MACT,uBAAuB;AAAA;AAAA,QAErB,WAAW;AAAA,UACT,0BAA0B;AAAA,YACxB,WAAW;AAAA,cACT,8CAA8C;AAAA,gBAC5CC,iBAAiBC,YAAAA,MAAMC,OAAOC;AAAAA,cAChC;AAAA,YACF;AAAA,UACF;AAAA,QACF;AAAA,MACF;AAAA,IACF;AAAA,EACF;AAAA,EACAC,gBAAgB,CAAC;AAAA,EACjBC,qBAAqB,CAAC;AAAA,EACtBC,6BAA6B,CAAC;AAChC,CAAC;;;"}

package/dist/cjs/components/DatePicker/DatePicker.cjs

@@ -4,7 +4,6 @@ const jsxRuntime = require("@emotion/react/jsx-runtime");
 const React = require("react");
 const useDefaultProps = require("../../hooks/useDefaultProps.cjs");
 const uikitReactIcons = require("@hitachivantara/uikit-react-icons");
-const uikitStyles = require("@hitachivantara/uikit-styles");
 const useControlled = require("../../hooks/useControlled.cjs");
 const useUniqueId = require("../../hooks/useUniqueId.cjs");
 const useLabels = require("../../hooks/useLabels.cjs");
@@ -207,9 +206,9 @@ const HvDatePicker = (props) => {
     ] })
   ] });
   const renderInput = (dateString) => {
-    return /* @__PURE__ */ jsxRuntime.jsx(Typography.HvTypography, { color: uikitStyles.theme.colors.secondary, className: cx(classes.inputText, {
+    return /* @__PURE__ */ jsxRuntime.jsx(Typography.HvTypography, { className: cx(classes.inputText, {
       [classes.dateText]: dateString
-    }), variant: "label", children: (dateString || placeholder) === void 0 ? "" : dateString || placeholder });
+    }), variant: "label", children: dateString || placeholder || "" });
   };
   const dateValue = rangeMode ? {
     startDate,

package/dist/cjs/components/DatePicker/DatePicker.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"DatePicker.cjs","sources":["../../../../src/components/DatePicker/DatePicker.tsx"],"sourcesContent":["import { useEffect, useRef } from \"react\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\n\nimport { Calendar } from \"@hitachivantara/uikit-react-icons\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { useControlled } from \"@core/hooks/useControlled\";\nimport { useUniqueId } from \"@core/hooks/useUniqueId\";\nimport { useLabels } from \"@core/hooks/useLabels\";\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { setId } from \"@core/utils/setId\";\nimport { useSavedState } from \"@core/utils/useSavedState\";\nimport {\n  isInvalid,\n  HvLabel,\n  HvFormStatus,\n  HvWarningText,\n  HvFormElement,\n  HvInfoMessage,\n  HvFormElementProps,\n} from \"@core/components/Forms\";\nimport { isDate } from \"@core/components/Calendar/utils\";\nimport { HvCalendar, HvCalendarProps } from \"@core/components/Calendar\";\nimport {\n  HvBaseDropdown,\n  HvBaseDropdownProps,\n} from \"@core/components/BaseDropdown\";\nimport { HvTypography } from \"@core/components/Typography\";\nimport { HvActionBar } from \"@core/components/ActionBar\";\nimport { HvButton } from \"@core/components/Button\";\n\nimport { getDateLabel } from \"./utils\";\nimport useVisibleDate from \"./useVisibleDate\";\nimport { staticClasses, useClasses } from \"./DatePicker.styles\";\n\nexport { staticClasses as datePickerClasses };\n\nexport type HvDatePickerClasses = ExtractNames<typeof useClasses>;\n\nconst DEFAULT_LABELS = {\n  applyLabel: \"Apply\",\n  cancelLabel: \"Cancel\",\n  clearLabel: \"Clear\",\n  invalidLabel: \"Invalid date\",\n};\n\n/** @deprecated use `HvFormStatus` instead */\nexport type HvDatePickerStatus = HvFormStatus;\n\nexport interface HvDatePickerProps\n  extends Omit<HvFormElementProps, \"onChange\">,\n    Pick<\n      HvBaseDropdownProps,\n      \"disablePortal\" | \"expanded\" | \"defaultExpanded\" | \"onToggle\"\n    > {\n  /**\n   * Identifies the element that provides an error message for the date picker.\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?: (date?: Date, endDate?: Date) => void;\n  /**\n   * The callback fired when user clicks on cancel.\n   */\n  onCancel?: () => void;\n  /**\n   * The callback fired when user clicks on clear.\n   */\n  onClear?: () => void;\n  /**\n   * An object containing all the labels for the datepicker.\n   */\n  labels?: {\n    /**\n     * Apply button label.\n     */\n    applyLabel?: string;\n    /**\n     * Cancel button label.\n     */\n    cancelLabel?: string;\n    /**\n     * Clear button label.\n     */\n    clearLabel?: string;\n    /**\n     * Invalid Date label.\n     */\n    invalidDateLabel?: string;\n  };\n  /**\n   * The initial value of the input when in single calendar mode.\n   */\n  value?: Date;\n  /**\n   * The initial value for the start date when in range mode.\n   */\n  startValue?: Date;\n  /**\n   * The initial value for the end date when in range mode.\n   */\n  endValue?: Date;\n  /**\n   * Flag informing if the the component should be in range mode or in single mode.\n   */\n  // TODO: remove this in favour of discriminated union\n  rangeMode?: boolean;\n  /**\n   * The placement where the calendar should be placed according to the input. Options are `left` or `right`.\n   * Note this prop only affects the calendar when in `rangeMode`.\n   */\n  horizontalPlacement?: \"left\" | \"right\";\n  /**\n   * The calendar locale. If undefined, it uses calendar default\n   */\n  locale?: string;\n  /**\n   * Controls if actions buttons are visible at the calendar.\n   */\n  showActions?: boolean;\n  /**\n   * Controls if clear button is visible at the calendar,\n   * only works if showing actions or in range mode.\n   */\n  showClear?: boolean;\n  /**\n   * Sets if the calendar container should follow the date picker input out of the screen or stay visible.\n   */\n  escapeWithReference?: boolean;\n  /**\n   * An element placed before the Calendar\n   */\n  startAdornment?: React.ReactNode;\n  /**\n   * An object containing props to be passed onto the baseDropdown.\n   */\n  dropdownProps?: Partial<HvBaseDropdownProps>;\n  /**\n   * Additional props passed to the HvCalendar component.\n   */\n  calendarProps?: Partial<HvCalendarProps>;\n  /**\n   * A Jss Object used to override or extend the component styles applied.\n   */\n  classes?: HvDatePickerClasses;\n}\n\n/**\n * A date picker, popup calendar or date range picker is a graphical user\n * interface widget which allows the user to select a date from a calendar.\n */\nexport const HvDatePicker = (props: HvDatePickerProps) => {\n  const {\n    classes: classesProp,\n    className,\n\n    id,\n    name,\n\n    required = false,\n    disabled = false,\n    readOnly,\n\n    label,\n    \"aria-label\": ariaLabel,\n    \"aria-labelledby\": ariaLabelledBy,\n    description,\n    \"aria-describedby\": ariaDescribedBy,\n\n    onChange,\n    onCancel,\n    onClear,\n    status,\n    statusMessage,\n    \"aria-errormessage\": ariaErrorMessage,\n\n    placeholder,\n\n    labels: labelsProp,\n\n    value,\n    startValue,\n    endValue,\n\n    expanded,\n    defaultExpanded,\n    onToggle,\n    rangeMode = false,\n    startAdornment,\n    horizontalPlacement = \"right\",\n    locale: localeProp,\n    showActions = false,\n    showClear = false,\n    disablePortal = true,\n    escapeWithReference = true,\n    dropdownProps,\n    calendarProps,\n    ...others\n  } = useDefaultProps(\"HvDatePicker\", props);\n\n  const { classes, cx } = useClasses(classesProp);\n  const labels = useLabels(DEFAULT_LABELS, labelsProp);\n\n  const elementId = useUniqueId(id, \"hvdatepicker\");\n\n  const [validationState, setValidationState] = useControlled(\n    status,\n    \"standBy\"\n  );\n\n  const [validationMessage] = useControlled(statusMessage, \"Required\");\n\n  const locale = localeProp || \"en-US\";\n\n  const [calendarOpen, setCalendarOpen] = useControlled(\n    expanded,\n    Boolean(defaultExpanded)\n  );\n\n  const [startDate, setStartDate, rollbackStartDate] = useSavedState(\n    rangeMode ? startValue : value\n  );\n  const [endDate, setEndDate, rollbackEndDate] = useSavedState(endValue);\n\n  const [visibleDate, dispatchAction] = useVisibleDate(startDate, endDate);\n\n  const focusTarget = useRef<HTMLDivElement>(null);\n\n  useEffect(() => {\n    setStartDate(rangeMode ? startValue : value, true);\n    setEndDate(endValue, true);\n  }, [value, startValue, endValue, rangeMode, setStartDate, setEndDate]);\n\n  const endDateIsSet = useRef(false);\n  endDateIsSet.current = endDate != null;\n\n  useEffect(() => {\n    if (startDate != null) {\n      dispatchAction({\n        type: \"month_year\",\n        target: endDateIsSet.current ? \"left\" : \"best\",\n        year: startDate.getFullYear(),\n        month: startDate.getMonth() + 1,\n      });\n    }\n  }, [dispatchAction, startDate]);\n\n  useEffect(() => {\n    if (endDate != null) {\n      dispatchAction({\n        type: \"month_year\",\n        target: \"right\",\n        year: endDate.getFullYear(),\n        month: endDate.getMonth() + 1,\n      });\n    }\n  }, [dispatchAction, endDate]);\n\n  /**\n   * Handles the `Apply` action. Both single and ranged modes are handled here.\n   */\n  const handleApply = () => {\n    setStartDate(startDate, true);\n    setEndDate(endDate ?? startDate, true);\n\n    onChange?.(startDate, endDate);\n\n    setValidationState(() => {\n      // this will only run if status is uncontrolled\n      if (required && (!isDate(startDate) || (rangeMode && !isDate(endDate)))) {\n        return \"invalid\";\n      }\n\n      return \"valid\";\n    });\n\n    setCalendarOpen(false);\n  };\n\n  /**\n   * Handles the `Cancel` action. Both single and ranged modes are handled here.\n   */\n  const handleCancel = () => {\n    rollbackStartDate();\n    rollbackEndDate();\n\n    onCancel?.();\n\n    setCalendarOpen(false);\n  };\n\n  /**\n   * Handles the `Cancel` action. Both single and ranged modes are handled here.\n   */\n  const handleClear = () => {\n    setStartDate(undefined, false);\n    setEndDate(undefined, false);\n    onClear?.();\n  };\n\n  const handleCalendarClose = () => {\n    const shouldSave = !(rangeMode || showActions);\n    if (shouldSave) {\n      handleApply();\n    } else {\n      handleCancel();\n    }\n  };\n\n  const handleToggle: HvBaseDropdownProps[\"onToggle\"] = (evt, open) => {\n    /* \n     If evt is null this toggle wasn't triggered by the user.\n     instead it was triggered by the baseDropdown useEffect after\n     the datepicker changed the expanded value this baseDropdown behavior needs a review\n    */\n    if (evt === null) return;\n    onToggle?.(evt, open);\n    setCalendarOpen(open);\n    if (!open) handleCalendarClose();\n  };\n\n  const focusOnContainer = () => {\n    focusTarget.current?.focus();\n  };\n\n  const handleDateChange: HvCalendarProps[\"onChange\"] = (event, newDate) => {\n    if (!isDate(newDate)) return;\n\n    const autoSave = !showActions && !rangeMode;\n\n    if (rangeMode) {\n      if (!startDate || (startDate && endDate) || newDate < startDate) {\n        setStartDate(newDate);\n        setEndDate(undefined);\n      } else {\n        setEndDate(newDate);\n      }\n    } else {\n      setStartDate(newDate, autoSave);\n    }\n\n    if (autoSave) {\n      onChange?.(newDate);\n\n      setValidationState(() => {\n        // this will only run if status is uncontrolled\n        if (required && !isDate(newDate)) {\n          return \"invalid\";\n        }\n\n        return \"valid\";\n      });\n\n      setCalendarOpen(false);\n    }\n  };\n\n  const handleInputDateChange: HvCalendarProps[\"onInputChange\"] = (\n    event,\n    newDate,\n    position\n  ) => {\n    if (!isDate(newDate)) return;\n\n    if (!rangeMode) {\n      handleDateChange(event as any, newDate);\n      return;\n    }\n\n    if (position === \"left\") {\n      if (endDate) setStartDate(newDate > endDate ? endDate : newDate);\n    } else if (position === \"right\") {\n      if (!startDate) {\n        if (endDate) setStartDate(newDate > endDate ? endDate : newDate);\n        return;\n      }\n      setEndDate(newDate < startDate ? startDate : newDate);\n    }\n  };\n\n  /**\n   * Renders the container for the action elements.\n   */\n  const renderActions = () => (\n    <HvActionBar className={cx({ [classes.actionContainer]: showClear })}>\n      {showClear && (\n        <div className={classes.leftContainer}>\n          <HvButton\n            id={setId(id, \"action\", \"clear\")}\n            className={classes.action}\n            variant=\"primaryGhost\"\n            onClick={handleClear}\n          >\n            {labels?.clearLabel}\n          </HvButton>\n        </div>\n      )}\n      <div className={classes.rightContainer}>\n        <HvButton\n          id={setId(id, \"action\", \"apply\")}\n          className={classes.action}\n          variant=\"primaryGhost\"\n          onClick={handleApply}\n        >\n          {labels?.applyLabel}\n        </HvButton>\n        <HvButton\n          id={setId(id, \"action\", \"cancel\")}\n          className={classes.action}\n          variant=\"primaryGhost\"\n          onClick={handleCancel}\n        >\n          {labels?.cancelLabel}\n        </HvButton>\n      </div>\n    </HvActionBar>\n  );\n\n  const renderInput = (dateString: string) => {\n    return (\n      <HvTypography\n        color={theme.colors.secondary}\n        className={cx(classes.inputText, { [classes.dateText]: dateString })}\n        variant=\"label\"\n      >\n        {(dateString || placeholder) === undefined\n          ? \"\"\n          : dateString || placeholder}\n      </HvTypography>\n    );\n  };\n  const dateValue = rangeMode ? { startDate, endDate } : startDate;\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      value={dateValue}\n      status={validationState}\n      disabled={disabled}\n      required={required}\n      className={cx(classes.root, className)}\n      readOnly={readOnly}\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        role=\"combobox\"\n        classes={{\n          root: classes.dropdown,\n          panel: classes.panel,\n          header: cx({ [classes.dropdownHeaderInvalid]: isStateInvalid }),\n          headerOpen: classes.dropdownHeaderOpen,\n        }}\n        readOnly={readOnly}\n        disabled={disabled}\n        disablePortal={disablePortal}\n        variableWidth\n        placement={horizontalPlacement}\n        expanded={calendarOpen}\n        onToggle={handleToggle}\n        onClickOutside={handleCalendarClose}\n        onContainerCreation={focusOnContainer}\n        placeholder={renderInput(getDateLabel(dateValue, rangeMode, locale))}\n        adornment={\n          <Calendar\n            className={classes.icon}\n            color={disabled ? \"secondary_80\" : undefined}\n          />\n        }\n        popperProps={{\n          modifiers: [\n            { name: \"preventOverflow\", enabled: escapeWithReference },\n          ],\n        }}\n        aria-haspopup=\"dialog\"\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        {...dropdownProps}\n      >\n        <div ref={focusTarget} tabIndex={-1} />\n        <HvCalendar\n          id={setId(id, \"calendar\")}\n          startAdornment={startAdornment}\n          onChange={handleDateChange}\n          onInputChange={handleInputDateChange}\n          onVisibleDateChange={(_event, type, month, target) => {\n            dispatchAction({ type, target, month });\n          }}\n          locale={locale}\n          {...visibleDate}\n          {...calendarProps}\n          invalidDateLabel={labels?.invalidDateLabel}\n        />\n        {(rangeMode || showActions) && renderActions()}\n      </HvBaseDropdown>\n      {canShowError && (\n        <HvWarningText\n          id={setId(elementId, \"error\")}\n          disableBorder\n          className={cx(classes.error)}\n        >\n          {validationMessage}\n        </HvWarningText>\n      )}\n    </HvFormElement>\n  );\n};\n"],"names":["DEFAULT_LABELS","applyLabel","cancelLabel","clearLabel","invalidLabel","HvDatePicker","props","classes","classesProp","className","id","name","required","disabled","readOnly","label","ariaLabel","ariaLabelledBy","description","ariaDescribedBy","onChange","onCancel","onClear","status","statusMessage","ariaErrorMessage","placeholder","labels","labelsProp","value","startValue","endValue","expanded","defaultExpanded","onToggle","rangeMode","startAdornment","horizontalPlacement","locale","localeProp","showActions","showClear","disablePortal","escapeWithReference","dropdownProps","calendarProps","others","useDefaultProps","cx","useClasses","useLabels","elementId","useUniqueId","validationState","setValidationState","useControlled","validationMessage","calendarOpen","setCalendarOpen","Boolean","startDate","setStartDate","rollbackStartDate","useSavedState","endDate","setEndDate","rollbackEndDate","visibleDate","dispatchAction","useVisibleDate","focusTarget","useRef","useEffect","endDateIsSet","current","type","target","year","getFullYear","month","getMonth","handleApply","isDate","handleCancel","handleClear","undefined","handleCalendarClose","shouldSave","handleToggle","evt","open","focusOnContainer","focus","handleDateChange","event","newDate","autoSave","handleInputDateChange","position","renderActions","jsxs","HvActionBar","actionContainer","jsx","leftContainer","HvButton","setId","action","rightContainer","renderInput","dateString","HvTypography","theme","colors","secondary","inputText","dateText","dateValue","hasLabel","hasDescription","canShowError","isStateInvalid","isInvalid","errorMessageId","HvFormElement","root","labelContainer","HvLabel","HvInfoMessage","HvBaseDropdown","dropdown","panel","header","dropdownHeaderInvalid","headerOpen","dropdownHeaderOpen","getDateLabel","Calendar","icon","modifiers","enabled","join","trim","HvCalendar","_event","invalidDateLabel","HvWarningText","error"],"mappings":"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"}
+{"version":3,"file":"DatePicker.cjs","sources":["../../../../src/components/DatePicker/DatePicker.tsx"],"sourcesContent":["import { useEffect, useRef } from \"react\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\n\nimport { Calendar } from \"@hitachivantara/uikit-react-icons\";\n\nimport { useControlled } from \"@core/hooks/useControlled\";\nimport { useUniqueId } from \"@core/hooks/useUniqueId\";\nimport { useLabels } from \"@core/hooks/useLabels\";\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { setId } from \"@core/utils/setId\";\nimport { useSavedState } from \"@core/utils/useSavedState\";\nimport {\n  isInvalid,\n  HvLabel,\n  HvFormStatus,\n  HvWarningText,\n  HvFormElement,\n  HvInfoMessage,\n  HvFormElementProps,\n} from \"@core/components/Forms\";\nimport { isDate } from \"@core/components/Calendar/utils\";\nimport { HvCalendar, HvCalendarProps } from \"@core/components/Calendar\";\nimport {\n  HvBaseDropdown,\n  HvBaseDropdownProps,\n} from \"@core/components/BaseDropdown\";\nimport { HvTypography } from \"@core/components/Typography\";\nimport { HvActionBar } from \"@core/components/ActionBar\";\nimport { HvButton } from \"@core/components/Button\";\n\nimport { getDateLabel } from \"./utils\";\nimport useVisibleDate from \"./useVisibleDate\";\nimport { staticClasses, useClasses } from \"./DatePicker.styles\";\n\nexport { staticClasses as datePickerClasses };\n\nexport type HvDatePickerClasses = ExtractNames<typeof useClasses>;\n\nconst DEFAULT_LABELS = {\n  applyLabel: \"Apply\",\n  cancelLabel: \"Cancel\",\n  clearLabel: \"Clear\",\n  invalidLabel: \"Invalid date\",\n};\n\n/** @deprecated use `HvFormStatus` instead */\nexport type HvDatePickerStatus = HvFormStatus;\n\nexport interface HvDatePickerProps\n  extends Omit<HvFormElementProps, \"onChange\">,\n    Pick<\n      HvBaseDropdownProps,\n      \"disablePortal\" | \"expanded\" | \"defaultExpanded\" | \"onToggle\"\n    > {\n  /**\n   * Identifies the element that provides an error message for the date picker.\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?: (date?: Date, endDate?: Date) => void;\n  /**\n   * The callback fired when user clicks on cancel.\n   */\n  onCancel?: () => void;\n  /**\n   * The callback fired when user clicks on clear.\n   */\n  onClear?: () => void;\n  /**\n   * An object containing all the labels for the datepicker.\n   */\n  labels?: {\n    /**\n     * Apply button label.\n     */\n    applyLabel?: string;\n    /**\n     * Cancel button label.\n     */\n    cancelLabel?: string;\n    /**\n     * Clear button label.\n     */\n    clearLabel?: string;\n    /**\n     * Invalid Date label.\n     */\n    invalidDateLabel?: string;\n  };\n  /**\n   * The initial value of the input when in single calendar mode.\n   */\n  value?: Date;\n  /**\n   * The initial value for the start date when in range mode.\n   */\n  startValue?: Date;\n  /**\n   * The initial value for the end date when in range mode.\n   */\n  endValue?: Date;\n  /**\n   * Flag informing if the the component should be in range mode or in single mode.\n   */\n  // TODO: remove this in favour of discriminated union\n  rangeMode?: boolean;\n  /**\n   * The placement where the calendar should be placed according to the input. Options are `left` or `right`.\n   * Note this prop only affects the calendar when in `rangeMode`.\n   */\n  horizontalPlacement?: \"left\" | \"right\";\n  /**\n   * The calendar locale. If undefined, it uses calendar default\n   */\n  locale?: string;\n  /**\n   * Controls if actions buttons are visible at the calendar.\n   */\n  showActions?: boolean;\n  /**\n   * Controls if clear button is visible at the calendar,\n   * only works if showing actions or in range mode.\n   */\n  showClear?: boolean;\n  /**\n   * Sets if the calendar container should follow the date picker input out of the screen or stay visible.\n   */\n  escapeWithReference?: boolean;\n  /**\n   * An element placed before the Calendar\n   */\n  startAdornment?: React.ReactNode;\n  /**\n   * An object containing props to be passed onto the baseDropdown.\n   */\n  dropdownProps?: Partial<HvBaseDropdownProps>;\n  /**\n   * Additional props passed to the HvCalendar component.\n   */\n  calendarProps?: Partial<HvCalendarProps>;\n  /**\n   * A Jss Object used to override or extend the component styles applied.\n   */\n  classes?: HvDatePickerClasses;\n}\n\n/**\n * A date picker, popup calendar or date range picker is a graphical user\n * interface widget which allows the user to select a date from a calendar.\n */\nexport const HvDatePicker = (props: HvDatePickerProps) => {\n  const {\n    classes: classesProp,\n    className,\n\n    id,\n    name,\n\n    required = false,\n    disabled = false,\n    readOnly,\n\n    label,\n    \"aria-label\": ariaLabel,\n    \"aria-labelledby\": ariaLabelledBy,\n    description,\n    \"aria-describedby\": ariaDescribedBy,\n\n    onChange,\n    onCancel,\n    onClear,\n    status,\n    statusMessage,\n    \"aria-errormessage\": ariaErrorMessage,\n\n    placeholder,\n\n    labels: labelsProp,\n\n    value,\n    startValue,\n    endValue,\n\n    expanded,\n    defaultExpanded,\n    onToggle,\n    rangeMode = false,\n    startAdornment,\n    horizontalPlacement = \"right\",\n    locale: localeProp,\n    showActions = false,\n    showClear = false,\n    disablePortal = true,\n    escapeWithReference = true,\n    dropdownProps,\n    calendarProps,\n    ...others\n  } = useDefaultProps(\"HvDatePicker\", props);\n\n  const { classes, cx } = useClasses(classesProp);\n  const labels = useLabels(DEFAULT_LABELS, labelsProp);\n\n  const elementId = useUniqueId(id, \"hvdatepicker\");\n\n  const [validationState, setValidationState] = useControlled(\n    status,\n    \"standBy\"\n  );\n\n  const [validationMessage] = useControlled(statusMessage, \"Required\");\n\n  const locale = localeProp || \"en-US\";\n\n  const [calendarOpen, setCalendarOpen] = useControlled(\n    expanded,\n    Boolean(defaultExpanded)\n  );\n\n  const [startDate, setStartDate, rollbackStartDate] = useSavedState(\n    rangeMode ? startValue : value\n  );\n  const [endDate, setEndDate, rollbackEndDate] = useSavedState(endValue);\n\n  const [visibleDate, dispatchAction] = useVisibleDate(startDate, endDate);\n\n  const focusTarget = useRef<HTMLDivElement>(null);\n\n  useEffect(() => {\n    setStartDate(rangeMode ? startValue : value, true);\n    setEndDate(endValue, true);\n  }, [value, startValue, endValue, rangeMode, setStartDate, setEndDate]);\n\n  const endDateIsSet = useRef(false);\n  endDateIsSet.current = endDate != null;\n\n  useEffect(() => {\n    if (startDate != null) {\n      dispatchAction({\n        type: \"month_year\",\n        target: endDateIsSet.current ? \"left\" : \"best\",\n        year: startDate.getFullYear(),\n        month: startDate.getMonth() + 1,\n      });\n    }\n  }, [dispatchAction, startDate]);\n\n  useEffect(() => {\n    if (endDate != null) {\n      dispatchAction({\n        type: \"month_year\",\n        target: \"right\",\n        year: endDate.getFullYear(),\n        month: endDate.getMonth() + 1,\n      });\n    }\n  }, [dispatchAction, endDate]);\n\n  /**\n   * Handles the `Apply` action. Both single and ranged modes are handled here.\n   */\n  const handleApply = () => {\n    setStartDate(startDate, true);\n    setEndDate(endDate ?? startDate, true);\n\n    onChange?.(startDate, endDate);\n\n    setValidationState(() => {\n      // this will only run if status is uncontrolled\n      if (required && (!isDate(startDate) || (rangeMode && !isDate(endDate)))) {\n        return \"invalid\";\n      }\n\n      return \"valid\";\n    });\n\n    setCalendarOpen(false);\n  };\n\n  /**\n   * Handles the `Cancel` action. Both single and ranged modes are handled here.\n   */\n  const handleCancel = () => {\n    rollbackStartDate();\n    rollbackEndDate();\n\n    onCancel?.();\n\n    setCalendarOpen(false);\n  };\n\n  /**\n   * Handles the `Cancel` action. Both single and ranged modes are handled here.\n   */\n  const handleClear = () => {\n    setStartDate(undefined, false);\n    setEndDate(undefined, false);\n    onClear?.();\n  };\n\n  const handleCalendarClose = () => {\n    const shouldSave = !(rangeMode || showActions);\n    if (shouldSave) {\n      handleApply();\n    } else {\n      handleCancel();\n    }\n  };\n\n  const handleToggle: HvBaseDropdownProps[\"onToggle\"] = (evt, open) => {\n    /* \n     If evt is null this toggle wasn't triggered by the user.\n     instead it was triggered by the baseDropdown useEffect after\n     the datepicker changed the expanded value this baseDropdown behavior needs a review\n    */\n    if (evt === null) return;\n    onToggle?.(evt, open);\n    setCalendarOpen(open);\n    if (!open) handleCalendarClose();\n  };\n\n  const focusOnContainer = () => {\n    focusTarget.current?.focus();\n  };\n\n  const handleDateChange: HvCalendarProps[\"onChange\"] = (event, newDate) => {\n    if (!isDate(newDate)) return;\n\n    const autoSave = !showActions && !rangeMode;\n\n    if (rangeMode) {\n      if (!startDate || (startDate && endDate) || newDate < startDate) {\n        setStartDate(newDate);\n        setEndDate(undefined);\n      } else {\n        setEndDate(newDate);\n      }\n    } else {\n      setStartDate(newDate, autoSave);\n    }\n\n    if (autoSave) {\n      onChange?.(newDate);\n\n      setValidationState(() => {\n        // this will only run if status is uncontrolled\n        if (required && !isDate(newDate)) {\n          return \"invalid\";\n        }\n\n        return \"valid\";\n      });\n\n      setCalendarOpen(false);\n    }\n  };\n\n  const handleInputDateChange: HvCalendarProps[\"onInputChange\"] = (\n    event,\n    newDate,\n    position\n  ) => {\n    if (!isDate(newDate)) return;\n\n    if (!rangeMode) {\n      handleDateChange(event as any, newDate);\n      return;\n    }\n\n    if (position === \"left\") {\n      if (endDate) setStartDate(newDate > endDate ? endDate : newDate);\n    } else if (position === \"right\") {\n      if (!startDate) {\n        if (endDate) setStartDate(newDate > endDate ? endDate : newDate);\n        return;\n      }\n      setEndDate(newDate < startDate ? startDate : newDate);\n    }\n  };\n\n  /**\n   * Renders the container for the action elements.\n   */\n  const renderActions = () => (\n    <HvActionBar className={cx({ [classes.actionContainer]: showClear })}>\n      {showClear && (\n        <div className={classes.leftContainer}>\n          <HvButton\n            id={setId(id, \"action\", \"clear\")}\n            className={classes.action}\n            variant=\"primaryGhost\"\n            onClick={handleClear}\n          >\n            {labels?.clearLabel}\n          </HvButton>\n        </div>\n      )}\n      <div className={classes.rightContainer}>\n        <HvButton\n          id={setId(id, \"action\", \"apply\")}\n          className={classes.action}\n          variant=\"primaryGhost\"\n          onClick={handleApply}\n        >\n          {labels?.applyLabel}\n        </HvButton>\n        <HvButton\n          id={setId(id, \"action\", \"cancel\")}\n          className={classes.action}\n          variant=\"primaryGhost\"\n          onClick={handleCancel}\n        >\n          {labels?.cancelLabel}\n        </HvButton>\n      </div>\n    </HvActionBar>\n  );\n\n  const renderInput = (dateString: string) => {\n    return (\n      <HvTypography\n        className={cx(classes.inputText, { [classes.dateText]: dateString })}\n        variant=\"label\"\n      >\n        {dateString || placeholder || \"\"}\n      </HvTypography>\n    );\n  };\n  const dateValue = rangeMode ? { startDate, endDate } : startDate;\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      value={dateValue}\n      status={validationState}\n      disabled={disabled}\n      required={required}\n      className={cx(classes.root, className)}\n      readOnly={readOnly}\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        role=\"combobox\"\n        classes={{\n          root: classes.dropdown,\n          panel: classes.panel,\n          header: cx({ [classes.dropdownHeaderInvalid]: isStateInvalid }),\n          headerOpen: classes.dropdownHeaderOpen,\n        }}\n        readOnly={readOnly}\n        disabled={disabled}\n        disablePortal={disablePortal}\n        variableWidth\n        placement={horizontalPlacement}\n        expanded={calendarOpen}\n        onToggle={handleToggle}\n        onClickOutside={handleCalendarClose}\n        onContainerCreation={focusOnContainer}\n        placeholder={renderInput(getDateLabel(dateValue, rangeMode, locale))}\n        adornment={\n          <Calendar\n            className={classes.icon}\n            color={disabled ? \"secondary_80\" : undefined}\n          />\n        }\n        popperProps={{\n          modifiers: [\n            { name: \"preventOverflow\", enabled: escapeWithReference },\n          ],\n        }}\n        aria-haspopup=\"dialog\"\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        {...dropdownProps}\n      >\n        <div ref={focusTarget} tabIndex={-1} />\n        <HvCalendar\n          id={setId(id, \"calendar\")}\n          startAdornment={startAdornment}\n          onChange={handleDateChange}\n          onInputChange={handleInputDateChange}\n          onVisibleDateChange={(_event, type, month, target) => {\n            dispatchAction({ type, target, month });\n          }}\n          locale={locale}\n          {...visibleDate}\n          {...calendarProps}\n          invalidDateLabel={labels?.invalidDateLabel}\n        />\n        {(rangeMode || showActions) && renderActions()}\n      </HvBaseDropdown>\n      {canShowError && (\n        <HvWarningText\n          id={setId(elementId, \"error\")}\n          disableBorder\n          className={cx(classes.error)}\n        >\n          {validationMessage}\n        </HvWarningText>\n      )}\n    </HvFormElement>\n  );\n};\n"],"names":["DEFAULT_LABELS","applyLabel","cancelLabel","clearLabel","invalidLabel","HvDatePicker","props","classes","classesProp","className","id","name","required","disabled","readOnly","label","ariaLabel","ariaLabelledBy","description","ariaDescribedBy","onChange","onCancel","onClear","status","statusMessage","ariaErrorMessage","placeholder","labels","labelsProp","value","startValue","endValue","expanded","defaultExpanded","onToggle","rangeMode","startAdornment","horizontalPlacement","locale","localeProp","showActions","showClear","disablePortal","escapeWithReference","dropdownProps","calendarProps","others","useDefaultProps","cx","useClasses","useLabels","elementId","useUniqueId","validationState","setValidationState","useControlled","validationMessage","calendarOpen","setCalendarOpen","Boolean","startDate","setStartDate","rollbackStartDate","useSavedState","endDate","setEndDate","rollbackEndDate","visibleDate","dispatchAction","useVisibleDate","focusTarget","useRef","useEffect","endDateIsSet","current","type","target","year","getFullYear","month","getMonth","handleApply","isDate","handleCancel","handleClear","undefined","handleCalendarClose","shouldSave","handleToggle","evt","open","focusOnContainer","focus","handleDateChange","event","newDate","autoSave","handleInputDateChange","position","renderActions","jsxs","HvActionBar","actionContainer","jsx","leftContainer","HvButton","setId","action","rightContainer","renderInput","dateString","HvTypography","inputText","dateText","dateValue","hasLabel","hasDescription","canShowError","isStateInvalid","isInvalid","errorMessageId","HvFormElement","root","labelContainer","HvLabel","HvInfoMessage","HvBaseDropdown","dropdown","panel","header","dropdownHeaderInvalid","headerOpen","dropdownHeaderOpen","getDateLabel","Calendar","icon","modifiers","enabled","join","trim","HvCalendar","_event","invalidDateLabel","HvWarningText","error"],"mappings":"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"}

package/dist/cjs/components/Dialog/Actions/Actions.cjs

@@ -4,6 +4,7 @@ const jsxRuntime = require("@emotion/react/jsx-runtime");
 const MuiDialogActions = require("@mui/material/DialogActions");
 const useDefaultProps = require("../../../hooks/useDefaultProps.cjs");
 const Actions_styles = require("./Actions.styles.cjs");
+const context = require("../context.cjs");
 const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
 const MuiDialogActions__default = /* @__PURE__ */ _interopDefault(MuiDialogActions);
 const HvDialogActions = (props) => {
@@ -11,9 +12,11 @@ const HvDialogActions = (props) => {
     classes: classesProp,
     className,
     children,
-    fullscreen = false,
+    fullscreen: fullScreenProp,
     ...others
   } = useDefaultProps.useDefaultProps("HvDialogActions", props);
+  const context$1 = context.useDialogContext();
+  const fullscreen = fullScreenProp ?? context$1.fullscreen;
   const {
     classes,
     cx

package/dist/cjs/components/Dialog/Actions/Actions.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Actions.cjs","sources":["../../../../../src/components/Dialog/Actions/Actions.tsx"],"sourcesContent":["import MuiDialogActions, {\n  DialogActionsProps as MuiDialogActionsProps,\n} from \"@mui/material/DialogActions\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\n\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { ExtractNames } from \"@core/utils/classes\";\n\nimport { staticClasses, useClasses } from \"./Actions.styles\";\n\nexport { staticClasses as dialogActionClasses };\n\nexport type HvDialogActionClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvDialogActionsProps\n  extends Omit<MuiDialogActionsProps, \"classes\">,\n    HvBaseProps {\n  /** Set the dialog to fullscreen mode. */\n  fullscreen?: boolean;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvDialogActionClasses;\n}\n\nexport const HvDialogActions = (props: HvDialogActionsProps) => {\n  const {\n    classes: classesProp,\n    className,\n    children,\n    fullscreen = false,\n    ...others\n  } = useDefaultProps(\"HvDialogActions\", props);\n\n  const { classes, cx } = useClasses(classesProp);\n\n  return (\n    <MuiDialogActions\n      className={className}\n      classes={{\n        root: cx(classes.root, { [classes.fullscreen]: fullscreen }),\n        spacing: classes.spacing,\n      }}\n      {...others}\n    >\n      {children}\n    </MuiDialogActions>\n  );\n};\n"],"names":["HvDialogActions","props","classes","classesProp","className","children","fullscreen","others","useDefaultProps","cx","useClasses","jsx","MuiDialogActions","root","spacing"],"mappings":";;;;;;;;AAuBaA,MAAAA,kBAAkBA,CAACC,UAAgC;AACxD,QAAA;AAAA,IACJC,SAASC;AAAAA,IACTC;AAAAA,IACAC;AAAAA,IACAC,aAAa;AAAA,IACb,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,gBAAA,mBAAmBP,KAAK;AAEtC,QAAA;AAAA,IAAEC;AAAAA,IAASO;AAAAA,EAAAA,IAAOC,eAAAA,WAAWP,WAAW;AAG5C,SAAAQ,+BAACC,0BAAAA,SACC,EAAA,WACA,SAAS;AAAA,IACPC,MAAMJ,GAAGP,QAAQW,MAAM;AAAA,MAAE,CAACX,QAAQI,UAAU,GAAGA;AAAAA,IAAAA,CAAY;AAAA,IAC3DQ,SAASZ,QAAQY;AAAAA,EAAAA,GAEfP,GAAAA,QAEHF,SACH,CAAA;AAEJ;;;"}
+{"version":3,"file":"Actions.cjs","sources":["../../../../../src/components/Dialog/Actions/Actions.tsx"],"sourcesContent":["import MuiDialogActions, {\n  DialogActionsProps as MuiDialogActionsProps,\n} from \"@mui/material/DialogActions\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\n\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { ExtractNames } from \"@core/utils/classes\";\n\nimport { staticClasses, useClasses } from \"./Actions.styles\";\nimport { useDialogContext } from \"../context\";\n\nexport { staticClasses as dialogActionClasses };\n\nexport type HvDialogActionClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvDialogActionsProps\n  extends Omit<MuiDialogActionsProps, \"classes\">,\n    HvBaseProps {\n  /** Set the dialog to fullscreen mode. @deprecated set `fullscreen` in `HvDialog` */\n  fullscreen?: boolean;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvDialogActionClasses;\n}\n\nexport const HvDialogActions = (props: HvDialogActionsProps) => {\n  const {\n    classes: classesProp,\n    className,\n    children,\n    fullscreen: fullScreenProp,\n    ...others\n  } = useDefaultProps(\"HvDialogActions\", props);\n  const context = useDialogContext();\n  const fullscreen = fullScreenProp ?? context.fullscreen;\n\n  const { classes, cx } = useClasses(classesProp);\n\n  return (\n    <MuiDialogActions\n      className={className}\n      classes={{\n        root: cx(classes.root, { [classes.fullscreen]: fullscreen }),\n        spacing: classes.spacing,\n      }}\n      {...others}\n    >\n      {children}\n    </MuiDialogActions>\n  );\n};\n"],"names":["HvDialogActions","props","classes","classesProp","className","children","fullscreen","fullScreenProp","others","useDefaultProps","context","useDialogContext","cx","useClasses","jsx","MuiDialogActions","root","spacing"],"mappings":";;;;;;;;;AAwBaA,MAAAA,kBAAkBA,CAACC,UAAgC;AACxD,QAAA;AAAA,IACJC,SAASC;AAAAA,IACTC;AAAAA,IACAC;AAAAA,IACAC,YAAYC;AAAAA,IACZ,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,gBAAA,mBAAmBR,KAAK;AAC5C,QAAMS,YAAUC,QAAAA;AACVL,QAAAA,aAAaC,kBAAkBG,UAAQJ;AAEvC,QAAA;AAAA,IAAEJ;AAAAA,IAASU;AAAAA,EAAAA,IAAOC,eAAAA,WAAWV,WAAW;AAG5C,SAAAW,+BAACC,0BAAAA,SACC,EAAA,WACA,SAAS;AAAA,IACPC,MAAMJ,GAAGV,QAAQc,MAAM;AAAA,MAAE,CAACd,QAAQI,UAAU,GAAGA;AAAAA,IAAAA,CAAY;AAAA,IAC3DW,SAASf,QAAQe;AAAAA,EAAAA,GAEfT,GAAAA,QAEHH,SACH,CAAA;AAEJ;;;"}

package/dist/cjs/components/Dialog/Dialog.cjs

@@ -4,19 +4,17 @@ const jsxRuntime = require("@emotion/react/jsx-runtime");
 const React = require("react");
 const useDefaultProps = require("../../hooks/useDefaultProps.cjs");
 const MuiDialog = require("@mui/material/Dialog");
-const MuiBackdrop = require("@mui/material/Backdrop");
 const uikitReactIcons = require("@hitachivantara/uikit-react-icons");
 const uikitStyles = require("@hitachivantara/uikit-styles");
 const setId = require("../../utils/setId.cjs");
-const withTooltip = require("../../hocs/withTooltip.cjs");
 const useTheme = require("../../hooks/useTheme.cjs");
 const hexToRgbA = require("../../utils/hexToRgbA.cjs");
 const Dialog_styles = require("./Dialog.styles.cjs");
+const context = require("./context.cjs");
+const Tooltip = require("../Tooltip/Tooltip.cjs");
 const Button = require("../Button/Button.cjs");
 const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
-const React__default = /* @__PURE__ */ _interopDefault(React);
 const MuiDialog__default = /* @__PURE__ */ _interopDefault(MuiDialog);
-const MuiBackdrop__default = /* @__PURE__ */ _interopDefault(MuiBackdrop);
 const HvDialog = (props) => {
   const {
     variant,
@@ -37,27 +35,19 @@ const HvDialog = (props) => {
     css,
     cx
   } = Dialog_styles.useClasses(classesProp);
-  delete others.fullScreen;
   const {
     rootId,
     colors
   } = useTheme.useTheme();
-  const wrappedClose = React.useCallback((event, bypassValidation = false, reason) => {
-    if (bypassValidation || !disableBackdropClick) {
-      onClose == null ? void 0 : onClose(event, reason);
-    }
-  }, [onClose, disableBackdropClick]);
   const measuredRef = React.useCallback(() => {
     if (!firstFocusable)
       return;
     const element = document.getElementById(firstFocusable);
     element == null ? void 0 : element.focus();
   }, [firstFocusable]);
-  const closeButtonDisplay = () => /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.Close, { role: "presentation" });
-  const CloseButtonTooltipWrapper = buttonTitle ? withTooltip.withTooltip(closeButtonDisplay, buttonTitle, "top") : closeButtonDisplay;
-  const slots = React.useMemo(() => ({
-    backdrop: (backdropProps) => /* @__PURE__ */ jsxRuntime.jsx(MuiBackdrop__default.default, { open, onClick: wrappedClose, ...backdropProps })
-  }), [open, wrappedClose]);
+  const contextValue = React.useMemo(() => ({
+    fullscreen
+  }), [fullscreen]);
   return /* @__PURE__ */ jsxRuntime.jsxs(MuiDialog__default.default, { container: typeof window !== "undefined" ? (
     // TODO: review
     // eslint-disable-next-line ssr-friendly/no-dom-globals-in-react-fc
@@ -66,7 +56,11 @@ const HvDialog = (props) => {
     container: css({
       position: "relative"
     })
-  }, id, ref: measuredRef, open, fullScreen: fullscreen, onClose: (event, reason) => wrappedClose(event, void 0, reason), slots, slotProps: {
+  }, id, ref: measuredRef, open, fullScreen: fullscreen, onClose: (event, reason) => {
+    if (disableBackdropClick)
+      return;
+    onClose == null ? void 0 : onClose(event, reason);
+  }, slotProps: {
     backdrop: {
       classes: {
         root: cx(css({
@@ -83,10 +77,8 @@ const HvDialog = (props) => {
       })
     }
   }, "aria-modal": true, ...others, children: [
-    /* @__PURE__ */ jsxRuntime.jsx(Button.HvButton, { id: setId.setId(id, "close"), className: classes.closeButton, variant: "secondaryGhost", onClick: (event) => wrappedClose(event, true, void 0), "aria-label": buttonTitle, children: /* @__PURE__ */ jsxRuntime.jsx(CloseButtonTooltipWrapper, {}) }),
-    children && typeof children === "object" ? React__default.default.Children.map(children, (c) => c && React__default.default.cloneElement(c, {
-      fullscreen
-    })) : children
+    /* @__PURE__ */ jsxRuntime.jsx(Tooltip.HvTooltip, { placement: "top", title: buttonTitle, children: /* @__PURE__ */ jsxRuntime.jsx(Button.HvButton, { id: setId.setId(id, "close"), className: classes.closeButton, variant: "secondaryGhost", onClick: (event) => onClose == null ? void 0 : onClose(event, void 0), children: /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.Close, { role: "none" }) }) }),
+    /* @__PURE__ */ jsxRuntime.jsx(context.DialogContext.Provider, { value: contextValue, children })
   ] });
 };
 exports.dialogClasses = Dialog_styles.staticClasses;

package/dist/cjs/components/Dialog/Dialog.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Dialog.cjs","sources":["../../../../src/components/Dialog/Dialog.tsx"],"sourcesContent":["import React, { useCallback, useMemo } from \"react\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\n\nimport MuiDialog, { DialogProps as MuiDialogProps } from \"@mui/material/Dialog\";\nimport MuiBackdrop from \"@mui/material/Backdrop\";\n\nimport { Close } from \"@hitachivantara/uikit-react-icons\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { HvButton } from \"@core/components/Button\";\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { setId } from \"@core/utils/setId\";\nimport { withTooltip } from \"@core/hocs/withTooltip\";\nimport { useTheme } from \"@core/hooks/useTheme\";\nimport { hexToRgbA } from \"@core/utils/hexToRgbA\";\n\nimport { staticClasses, useClasses } from \"./Dialog.styles\";\n\nexport { staticClasses as dialogClasses };\n\nexport type HvDialogClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvDialogProps\n  extends Omit<MuiDialogProps, \"fullScreen\" | \"classes\" | \"open\">,\n    HvBaseProps {\n  /** Current state of the Dialog. */\n  open?: boolean;\n  /** Function executed on close. */\n  onClose?: (\n    event: React.SyntheticEvent,\n    reason?: \"escapeKeyDown\" | \"backdropClick\"\n  ) => void;\n  /** @inheritdoc */\n  maxWidth?: MuiDialogProps[\"maxWidth\"];\n  /** @inheritdoc */\n  fullWidth?: MuiDialogProps[\"fullWidth\"];\n  /**\n   * Element id that should be focus when the Dialog opens.\n   * Auto-focusing elements can cause usability issues, so this should be avoided.\n   * @deprecated Use `autoFocus` on the element instead, if auto-focusing is required.\n   */\n  firstFocusable?: string;\n  /** Title for the button close. */\n  buttonTitle?: string;\n  /** Set the dialog to fullscreen mode. */\n  fullscreen?: boolean;\n  /** Prevent closing the dialog when clicking on the backdrop. */\n  disableBackdropClick?: boolean;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvDialogClasses;\n  /** Variant of the dialog. Adds a status bar to the top of the dialog. If not provided, no status bar is added. */\n  variant?: \"success\" | \"error\" | \"warning\";\n  /** @ignore */\n  ref?: MuiDialogProps[\"ref\"];\n  /** @ignore */\n  component?: MuiDialogProps[\"component\"];\n}\n\nexport const HvDialog = (props: HvDialogProps) => {\n  const {\n    variant,\n    classes: classesProp,\n    className,\n    id,\n    children,\n    open = false,\n    onClose,\n    firstFocusable,\n    buttonTitle = \"Close\",\n    fullscreen = false,\n    disableBackdropClick = false,\n    ...others\n  } = useDefaultProps(\"HvDialog\", props);\n\n  const { classes, css, cx } = useClasses(classesProp);\n  delete (others as any).fullScreen;\n\n  const { rootId, colors } = useTheme();\n\n  // Because the `disableBackdropClick` property was deprecated in MUI5\n  // and we want to maintain that functionality to the user we're wrapping\n  // the onClose call here to make that check.\n  const wrappedClose = useCallback(\n    (\n      event: any,\n      bypassValidation: boolean = false,\n      reason?: \"escapeKeyDown\" | \"backdropClick\"\n    ) => {\n      if (bypassValidation || !disableBackdropClick) {\n        onClose?.(event, reason);\n      }\n    },\n    [onClose, disableBackdropClick]\n  );\n\n  const measuredRef = useCallback(() => {\n    if (!firstFocusable) return;\n\n    const element = document.getElementById(firstFocusable);\n    element?.focus();\n  }, [firstFocusable]);\n\n  const closeButtonDisplay = () => <Close role=\"presentation\" />;\n\n  const CloseButtonTooltipWrapper = buttonTitle\n    ? withTooltip(closeButtonDisplay, buttonTitle, \"top\")\n    : closeButtonDisplay;\n\n  const slots = useMemo<MuiDialogProps[\"slots\"]>(\n    () => ({\n      backdrop: (backdropProps) => (\n        <MuiBackdrop open={open} onClick={wrappedClose} {...backdropProps} />\n      ),\n    }),\n    [open, wrappedClose]\n  );\n\n  return (\n    <MuiDialog\n      container={\n        typeof window !== \"undefined\"\n          ? // TODO: review\n            // eslint-disable-next-line ssr-friendly/no-dom-globals-in-react-fc\n            document.getElementById(rootId || \"\") || document.body\n          : undefined\n      }\n      className={cx(classes.root, className)}\n      classes={{ container: css({ position: \"relative\" }) }}\n      id={id}\n      ref={measuredRef}\n      open={open}\n      fullScreen={fullscreen}\n      onClose={(event, reason) => wrappedClose(event, undefined, reason)}\n      slots={slots}\n      slotProps={{\n        backdrop: {\n          classes: {\n            root: cx(\n              css({\n                background: hexToRgbA(colors?.atmo4 || theme.colors.atmo4, 0.8),\n              }),\n              classes.background\n            ),\n          },\n        },\n      }}\n      PaperProps={{\n        classes: {\n          root: cx(\n            css({ position: \"absolute\" }),\n            classes.paper,\n            variant && cx(classes.statusBar, classes[variant]),\n            {\n              [classes.fullscreen]: fullscreen,\n            }\n          ),\n        },\n      }}\n      aria-modal\n      {...others}\n    >\n      <HvButton\n        id={setId(id, \"close\")}\n        className={classes.closeButton}\n        variant=\"secondaryGhost\"\n        onClick={(event) => wrappedClose(event, true, undefined)}\n        aria-label={buttonTitle}\n      >\n        <CloseButtonTooltipWrapper />\n      </HvButton>\n      {children && typeof children === \"object\"\n        ? React.Children.map(\n            children,\n            (c: React.ReactNode) =>\n              c && React.cloneElement(c as React.ReactElement, { fullscreen })\n          )\n        : children}\n    </MuiDialog>\n  );\n};\n"],"names":["HvDialog","props","variant","classes","classesProp","className","id","children","open","onClose","firstFocusable","buttonTitle","fullscreen","disableBackdropClick","others","useDefaultProps","css","cx","useClasses","fullScreen","rootId","colors","useTheme","wrappedClose","useCallback","event","bypassValidation","reason","measuredRef","element","document","getElementById","focus","closeButtonDisplay","jsx","Close","CloseButtonTooltipWrapper","withTooltip","slots","useMemo","backdrop","backdropProps","MuiBackdrop","jsxs","MuiDialog","window","body","undefined","root","container","position","background","hexToRgbA","atmo4","theme","paper","statusBar","HvButton","setId","closeButton","React","Children","map","c","cloneElement"],"mappings":"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"}
+{"version":3,"file":"Dialog.cjs","sources":["../../../../src/components/Dialog/Dialog.tsx"],"sourcesContent":["import { useCallback, useMemo } from \"react\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\n\nimport MuiDialog, { DialogProps as MuiDialogProps } from \"@mui/material/Dialog\";\n\nimport { Close } from \"@hitachivantara/uikit-react-icons\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { HvButton } from \"@core/components/Button\";\nimport { HvTooltip } from \"@core/components/Tooltip\";\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { setId } from \"@core/utils/setId\";\nimport { useTheme } from \"@core/hooks/useTheme\";\nimport { hexToRgbA } from \"@core/utils/hexToRgbA\";\n\nimport { staticClasses, useClasses } from \"./Dialog.styles\";\nimport { DialogContext } from \"./context\";\n\nexport { staticClasses as dialogClasses };\n\nexport type HvDialogClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvDialogProps\n  extends Omit<MuiDialogProps, \"fullScreen\" | \"classes\" | \"open\">,\n    HvBaseProps {\n  /** Current state of the Dialog. */\n  open?: boolean;\n  /** Callback fired when the component requests to be closed. */\n  onClose?: (event: any, reason?: \"escapeKeyDown\" | \"backdropClick\") => void;\n  /** @inheritdoc */\n  maxWidth?: MuiDialogProps[\"maxWidth\"];\n  /** @inheritdoc */\n  fullWidth?: MuiDialogProps[\"fullWidth\"];\n  /**\n   * Element id that should be focus when the Dialog opens.\n   * Auto-focusing elements can cause usability issues, so this should be avoided.\n   * @deprecated Use `autoFocus` on the element instead, if auto-focusing is required.\n   */\n  firstFocusable?: string;\n  /** Title for the button close. */\n  buttonTitle?: string;\n  /** Set the dialog to fullscreen mode. */\n  fullscreen?: boolean;\n  /** Prevent closing the dialog when clicking on the backdrop. */\n  disableBackdropClick?: boolean;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvDialogClasses;\n  /** Variant of the dialog. Adds a status bar to the top of the dialog. If not provided, no status bar is added. */\n  variant?: \"success\" | \"error\" | \"warning\";\n  /** @ignore */\n  ref?: MuiDialogProps[\"ref\"];\n  /** @ignore */\n  component?: MuiDialogProps[\"component\"];\n}\n\nexport const HvDialog = (props: HvDialogProps) => {\n  const {\n    variant,\n    classes: classesProp,\n    className,\n    id,\n    children,\n    open = false,\n    onClose,\n    firstFocusable,\n    buttonTitle = \"Close\",\n    fullscreen = false,\n    disableBackdropClick = false,\n    ...others\n  } = useDefaultProps(\"HvDialog\", props);\n\n  const { classes, css, cx } = useClasses(classesProp);\n  const { rootId, colors } = useTheme();\n\n  const measuredRef = useCallback(() => {\n    if (!firstFocusable) return;\n\n    const element = document.getElementById(firstFocusable);\n    element?.focus();\n  }, [firstFocusable]);\n\n  const contextValue = useMemo(() => ({ fullscreen }), [fullscreen]);\n\n  return (\n    <MuiDialog\n      container={\n        typeof window !== \"undefined\"\n          ? // TODO: review\n            // eslint-disable-next-line ssr-friendly/no-dom-globals-in-react-fc\n            document.getElementById(rootId || \"\") || document.body\n          : undefined\n      }\n      className={cx(classes.root, className)}\n      classes={{ container: css({ position: \"relative\" }) }}\n      id={id}\n      ref={measuredRef}\n      open={open}\n      fullScreen={fullscreen}\n      onClose={(event, reason) => {\n        // `disableBackdropClick` property was removed in MUI5\n        // and we want to maintain that functionality\n        if (disableBackdropClick) return;\n\n        onClose?.(event, reason);\n      }}\n      slotProps={{\n        backdrop: {\n          classes: {\n            root: cx(\n              css({\n                background: hexToRgbA(colors?.atmo4 || theme.colors.atmo4, 0.8),\n              }),\n              classes.background\n            ),\n          },\n        },\n      }}\n      PaperProps={{\n        classes: {\n          root: cx(\n            css({ position: \"absolute\" }),\n            classes.paper,\n            variant && cx(classes.statusBar, classes[variant]),\n            {\n              [classes.fullscreen]: fullscreen,\n            }\n          ),\n        },\n      }}\n      aria-modal\n      {...others}\n    >\n      <HvTooltip placement=\"top\" title={buttonTitle}>\n        <HvButton\n          id={setId(id, \"close\")}\n          className={classes.closeButton}\n          variant=\"secondaryGhost\"\n          onClick={(event) => onClose?.(event, undefined)}\n        >\n          <Close role=\"none\" />\n        </HvButton>\n      </HvTooltip>\n      <DialogContext.Provider value={contextValue}>\n        {children}\n      </DialogContext.Provider>\n    </MuiDialog>\n  );\n};\n"],"names":["HvDialog","props","variant","classes","classesProp","className","id","children","open","onClose","firstFocusable","buttonTitle","fullscreen","disableBackdropClick","others","useDefaultProps","css","cx","useClasses","rootId","colors","useTheme","measuredRef","useCallback","element","document","getElementById","focus","contextValue","useMemo","jsxs","MuiDialog","window","body","undefined","root","container","position","event","reason","backdrop","background","hexToRgbA","atmo4","theme","paper","statusBar","jsx","HvTooltip","HvButton","setId","closeButton","Close","DialogContext"],"mappings":";;;;;;;;;;;;;;;;;AAwDaA,MAAAA,WAAWA,CAACC,UAAyB;AAC1C,QAAA;AAAA,IACJC;AAAAA,IACAC,SAASC;AAAAA,IACTC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC,OAAO;AAAA,IACPC;AAAAA,IACAC;AAAAA,IACAC,cAAc;AAAA,IACdC,aAAa;AAAA,IACbC,uBAAuB;AAAA,IACvB,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,gBAAA,YAAYd,KAAK;AAE/B,QAAA;AAAA,IAAEE;AAAAA,IAASa;AAAAA,IAAKC;AAAAA,EAAAA,IAAOC,cAAAA,WAAWd,WAAW;AAC7C,QAAA;AAAA,IAAEe;AAAAA,IAAQC;AAAAA,MAAWC,SAAS,SAAA;AAE9BC,QAAAA,cAAcC,MAAAA,YAAY,MAAM;AACpC,QAAI,CAACb;AAAgB;AAEfc,UAAAA,UAAUC,SAASC,eAAehB,cAAc;AACtDc,uCAASG;AAAAA,EAAM,GACd,CAACjB,cAAc,CAAC;AAEbkB,QAAAA,eAAeC,MAAAA,QAAQ,OAAO;AAAA,IAAEjB;AAAAA,EAAAA,IAAe,CAACA,UAAU,CAAC;AAEjE,SACGkB,2BAAA,KAAAC,mBAAA,SAAA,EACC,WACE,OAAOC,WAAW;AAAA;AAAA;AAAA,IAGdP,SAASC,eAAeP,UAAU,EAAE,KAAKM,SAASQ;AAAAA,MAClDC,QAEN,WAAWjB,GAAGd,QAAQgC,MAAM9B,SAAS,GACrC,SAAS;AAAA,IAAE+B,WAAWpB,IAAI;AAAA,MAAEqB,UAAU;AAAA,IAAA,CAAY;AAAA,EAAA,GAClD,IACA,KAAKf,aACL,MACA,YAAYV,YACZ,SAAS,CAAC0B,OAAOC,WAAW;AAGtB1B,QAAAA;AAAsB;AAE1BJ,uCAAU6B,OAAOC;AAAAA,KAEnB,WAAW;AAAA,IACTC,UAAU;AAAA,MACRrC,SAAS;AAAA,QACPgC,MAAMlB,GACJD,IAAI;AAAA,UACFyB,YAAYC,UAAUtB,WAAAA,iCAAQuB,UAASC,YAAAA,MAAMxB,OAAOuB,OAAO,GAAG;AAAA,QAAA,CAC/D,GACDxC,QAAQsC,UACV;AAAA,MACF;AAAA,IACF;AAAA,KAEF,YAAY;AAAA,IACVtC,SAAS;AAAA,MACPgC,MAAMlB,GACJD,IAAI;AAAA,QAAEqB,UAAU;AAAA,MAAA,CAAY,GAC5BlC,QAAQ0C,OACR3C,WAAWe,GAAGd,QAAQ2C,WAAW3C,QAAQD,OAAO,CAAC,GACjD;AAAA,QACE,CAACC,QAAQS,UAAU,GAAGA;AAAAA,MAAAA,CAE1B;AAAA,IACF;AAAA,EAEF,GAAA,cAAU,MACV,GAAIE,QAEJ,UAAA;AAAA,IAAAiC,2BAAA,IAACC,QAAU,WAAA,EAAA,WAAU,OAAM,OAAOrC,aAChC,UAAAoC,2BAAA,IAACE,OACC,UAAA,EAAA,IAAIC,MAAM5C,MAAAA,IAAI,OAAO,GACrB,WAAWH,QAAQgD,aACnB,SAAQ,kBACR,SAAUb,CAAU7B,UAAAA,mCAAU6B,OAAOJ,SAErC,UAAAa,2BAAAA,IAACK,gBAAAA,OAAM,EAAA,MAAK,OAAM,CAAA,EACpB,CAAA,GACF;AAAA,mCACCC,QAAc,cAAA,UAAd,EAAuB,OAAOzB,cAC5BrB,UACH;AAAA,EACF,EAAA,CAAA;AAEJ;;;"}