@hitachivantara/uikit-react-core 5.2.0 → 5.4.0

package/dist/esm/components/DatePicker/DatePicker.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DatePicker.js","sources":["../../../../src/components/DatePicker/DatePicker.tsx"],"sourcesContent":["import { useState, useEffect, useRef } from \"react\";\nimport { ClassNames } from \"@emotion/react\";\nimport styled from \"@emotion/styled\";\nimport { clsx } from \"clsx\";\nimport { Calendar } from \"@hitachivantara/uikit-react-icons\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport {\n  HvCalendar,\n  HvInfoMessage,\n  HvWarningText,\n  HvCalendarProps,\n  HvActionBar,\n  HvButton,\n  HvFormElement,\n  HvTypography,\n  HvBaseDropdown,\n  HvLabel,\n} from \"@core/components\";\nimport { useControlled, useLabels, useTheme, useUniqueId } from \"@core/hooks\";\nimport { HvBaseProps } from \"@core/types\";\nimport { setId, useSavedState } from \"@core/utils\";\nimport { isInvalid } from \"../Forms/FormElement/validationStates\";\nimport { isDate } from \"../Calendar/utils\";\nimport { getDateLabel } from \"./utils\";\nimport useVisibleDate from \"./useVisibleDate\";\nimport { NAV_OPTIONS } from \"../Calendar/enums\";\nimport datePickerClasses, { HvDatePickerClasses } from \"./datePickerClasses\";\nimport { styles } from \"./DatePicker.styles\";\n\nconst DEFAULT_LABELS = {\n  applyLabel: \"Apply\",\n  cancelLabel: \"Cancel\",\n  clearLabel: \"Clear\",\n};\n\nexport type HvDatePickerStatus = \"standBy\" | \"valid\" | \"invalid\";\n\nexport interface HvDatePickerProps\n  extends HvBaseProps<HTMLDivElement, { onChange }> {\n  /**\n   * Class names to be applied.\n   */\n  className?: string;\n  /**\n   * A Jss Object used to override or extend the component styles applied.\n   */\n  classes?: HvDatePickerClasses;\n  /**\n   * Id to be applied to the form element root node.\n   */\n  id?: string;\n\n  /**\n   * The form element name.\n   */\n  name?: string;\n  /**\n   * The label of the form element.\n   *\n   * The form element must be labeled for accessibility reasons.\n   * If not provided, an aria-label or aria-labelledby must be provided instead.\n   */\n  label?: React.ReactNode;\n  /**\n   * @ignore\n   */\n  \"aria-label\"?: string;\n  /**\n   * @ignore\n   */\n  \"aria-labelledby\"?: string;\n  /**\n   * Provide additional descriptive text for the form element.\n   */\n  description?: React.ReactNode;\n  /**\n   * @ignore\n   */\n  \"aria-describedby\"?: string;\n  /**\n   * The placeholder value when nothing is selected.\n   */\n  placeholder?: string;\n\n  /**\n   * Indicates that the form element is disabled.\n   */\n  disabled?: boolean;\n  /**\n   * Indicates that user input is required on the form element.\n   */\n  required?: boolean;\n\n  /**\n   * The status of the form element.\n   *\n   * Valid is correct, invalid is incorrect and standBy means no validations have run.\n   *\n   * When uncontrolled and unspecified it will default to \"standBy\" and change to either \"valid\"\n   * or \"invalid\" after any change to the state.\n   */\n  status?: HvDatePickerStatus;\n  /**\n   * The error message to show when the validation status is \"invalid\".\n   *\n   * Defaults to \"Required\" when the status is uncontrolled and no `aria-errormessage` is provided.\n   */\n  statusMessage?: React.ReactNode;\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  /**\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\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  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  /**\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   * Disable the portal behavior. The children stay within it's parent DOM hierarchy.\n   */\n  disablePortal?: 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?: Object;\n  /**\n   * If `true` the DatePicker will be in read only mode, unable to be interacted.\n   */\n  readOnly?: boolean;\n  /**\n   * Additional props passed to the HvCalendar component.\n   */\n  calendarProps?: Partial<HvCalendarProps>;\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 = ({\n  classes,\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  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}: HvDatePickerProps) => {\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] = useState(false);\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  const { activeTheme } = useTheme();\n\n  useEffect(() => {\n    setStartDate(rangeMode ? startValue : value, true);\n    setEndDate(endValue, true);\n  }, [value, startValue, endValue, rangeMode]);\n\n  const endDateIsSet = useRef(false);\n  endDateIsSet.current = endDate != null;\n\n  useEffect(() => {\n    if (startDate != null) {\n      dispatchAction({\n        type: NAV_OPTIONS.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: NAV_OPTIONS.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 = (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    setCalendarOpen(open);\n    if (!open) handleCalendarClose();\n  };\n\n  const focusOnContainer = () => {\n    focusTarget.current?.focus();\n  };\n\n  const handleDateChange = (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 = (event, newDate, position) => {\n    if (!isDate(newDate)) return;\n\n    if (!rangeMode) {\n      handleDateChange(event, 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    <ClassNames>\n      {({ css }) => (\n        <HvActionBar\n          className={\n            showClear\n              ? clsx(\n                  datePickerClasses.actionContainer,\n                  classes?.actionContainer,\n                  css(styles.actionContainer)\n                )\n              : \"\"\n          }\n        >\n          {showClear && (\n            <div\n              className={clsx(\n                datePickerClasses.leftContainer,\n                classes?.leftContainer\n              )}\n            >\n              <HvButton\n                id={setId(id, \"action\", \"clear\")}\n                className={clsx(\n                  datePickerClasses.action,\n                  classes?.action,\n                  css(styles.action)\n                )}\n                variant=\"primaryGhost\"\n                onClick={handleClear}\n              >\n                {labels?.clearLabel}\n              </HvButton>\n            </div>\n          )}\n          <div\n            className={clsx(\n              datePickerClasses.rightContainer,\n              classes?.rightContainer\n            )}\n          >\n            <HvButton\n              id={setId(id, \"action\", \"apply\")}\n              className={clsx(\n                datePickerClasses.action,\n                classes?.action,\n                css(styles.action)\n              )}\n              variant=\"primaryGhost\"\n              onClick={handleApply}\n            >\n              {labels?.applyLabel}\n            </HvButton>\n            <HvButton\n              id={setId(id, \"action\", \"cancel\")}\n              className={clsx(\n                datePickerClasses.action,\n                classes?.action,\n                css(styles.action)\n              )}\n              variant=\"primaryGhost\"\n              onClick={handleCancel}\n            >\n              {labels?.cancelLabel}\n            </HvButton>\n          </div>\n        </HvActionBar>\n      )}\n    </ClassNames>\n  );\n\n  const styledTypography = (dateString, variant, text) => {\n    const StyledTypography = styled(HvTypography)({\n      color: dateString\n        ? theme.colors.secondary\n        : theme.datePicker.dropdownPlaceholderColor,\n    });\n\n    return <StyledTypography variant={variant}>{text}</StyledTypography>;\n  };\n\n  const renderInput = (dateString) =>\n    styledTypography(\n      dateString,\n      activeTheme?.datePicker.placeholderVariant,\n      (dateString || placeholder) === undefined ? \"\" : dateString || placeholder\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    <ClassNames>\n      {({ css }) => (\n        <HvFormElement\n          id={id}\n          name={name}\n          value={dateValue}\n          status={validationState}\n          disabled={disabled}\n          required={required}\n          className={clsx(\n            className,\n            datePickerClasses.root,\n            classes?.root,\n            css(styles.root)\n          )}\n          readOnly={readOnly}\n          {...others}\n        >\n          {(hasLabel || hasDescription) && (\n            <div\n              className={clsx(\n                datePickerClasses.labelContainer,\n                classes?.labelContainer,\n                css(styles.labelContainer)\n              )}\n            >\n              {hasLabel && (\n                <HvLabel\n                  id={setId(elementId, \"label\")}\n                  label={label}\n                  className={clsx(\n                    datePickerClasses.label,\n                    classes?.label,\n                    css(styles.label)\n                  )}\n                />\n              )}\n\n              {hasDescription && (\n                <HvInfoMessage\n                  id={setId(elementId, \"description\")}\n                  className={clsx(\n                    datePickerClasses.description,\n                    classes?.description,\n                    css(styles.description)\n                  )}\n                >\n                  {description}\n                </HvInfoMessage>\n              )}\n            </div>\n          )}\n          <HvBaseDropdown\n            role=\"combobox\"\n            classes={{\n              root: clsx(\n                datePickerClasses.dropdown,\n                classes?.dropdown,\n                css(styles.dropdown)\n              ),\n              panel: clsx(\n                datePickerClasses.panel,\n                classes?.panel,\n                css(styles.panel)\n              ),\n              header: isStateInvalid\n                ? clsx(\n                    datePickerClasses.dropdownHeaderInvalid,\n                    classes?.dropdownHeaderInvalid,\n                    css(styles.dropdownHeaderInvalid)\n                  )\n                : undefined,\n              headerOpen: clsx(\n                datePickerClasses.dropdownHeaderOpen,\n                classes?.dropdownHeaderOpen,\n                css(styles.dropdownHeaderOpen)\n              ),\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(\n              getDateLabel(dateValue, rangeMode, locale)\n            )}\n            adornment={\n              <Calendar\n                className={clsx(\n                  datePickerClasses.icon,\n                  classes?.icon,\n                  css(styles.icon)\n                )}\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            />\n            {(rangeMode || showActions) && renderActions()}\n          </HvBaseDropdown>\n          {canShowError && (\n            <HvWarningText\n              id={setId(elementId, \"error\")}\n              disableBorder\n              className={clsx(datePickerClasses.error, classes?.error)}\n            >\n              {validationMessage}\n            </HvWarningText>\n          )}\n        </HvFormElement>\n      )}\n    </ClassNames>\n  );\n};\n"],"names":["DEFAULT_LABELS","applyLabel","cancelLabel","clearLabel","HvDatePicker","classes","className","id","name","required","disabled","readOnly","label","ariaLabel","ariaLabelledBy","description","ariaDescribedBy","onChange","onCancel","onClear","status","statusMessage","ariaErrorMessage","placeholder","labels","labelsProp","value","startValue","endValue","rangeMode","startAdornment","horizontalPlacement","locale","localeProp","showActions","showClear","disablePortal","escapeWithReference","dropdownProps","calendarProps","others","useLabels","elementId","useUniqueId","validationState","setValidationState","useControlled","validationMessage","calendarOpen","setCalendarOpen","useState","startDate","setStartDate","rollbackStartDate","useSavedState","endDate","setEndDate","rollbackEndDate","visibleDate","dispatchAction","useVisibleDate","focusTarget","useRef","activeTheme","useTheme","useEffect","endDateIsSet","current","type","NAV_OPTIONS","MONTH_YEAR","target","year","getFullYear","month","getMonth","handleApply","isDate","handleCancel","handleClear","undefined","handleCalendarClose","shouldSave","handleToggle","evt","open","focusOnContainer","focus","handleDateChange","event","newDate","autoSave","handleInputDateChange","position","renderActions","_jsx","ClassNames","children","css","HvActionBar","clsx","datePickerClasses","actionContainer","styles","leftContainer","HvButton","setId","action","variant","onClick","_jsxs","rightContainer","styledTypography","dateString","text","StyledTypography","HvTypography","process","env","NODE_ENV","color","theme","colors","secondary","datePicker","dropdownPlaceholderColor","renderInput","placeholderVariant","dateValue","hasLabel","hasDescription","canShowError","isStateInvalid","isInvalid","errorMessageId","HvFormElement","root","labelContainer","HvLabel","HvInfoMessage","HvBaseDropdown","role","dropdown","panel","header","dropdownHeaderInvalid","headerOpen","dropdownHeaderOpen","variableWidth","placement","expanded","onToggle","onClickOutside","onContainerCreation","getDateLabel","adornment","Calendar","icon","popperProps","modifiers","enabled","join","trim","ref","tabIndex","HvCalendar","onInputChange","onVisibleDateChange","_event","HvWarningText","disableBorder","error"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6BA,MAAMA,iBAAiB;AAAA,EACrBC,YAAY;AAAA,EACZC,aAAa;AAAA,EACbC,YAAY;AACd;AAiLO,MAAMC,eAAeA,CAAC;AAAA,EAC3BC;AAAAA,EACAC;AAAAA,EAEAC;AAAAA,EACAC;AAAAA,EAEAC,WAAW;AAAA,EACXC,WAAW;AAAA,EACXC;AAAAA,EAEAC;AAAAA,EACA,cAAcC;AAAAA,EACd,mBAAmBC;AAAAA,EACnBC;AAAAA,EACA,oBAAoBC;AAAAA,EAEpBC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACA,qBAAqBC;AAAAA,EAErBC;AAAAA,EAEAC,QAAQC;AAAAA,EAERC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EAEAC,YAAY;AAAA,EACZC;AAAAA,EACAC,sBAAsB;AAAA,EACtBC,QAAQC;AAAAA,EACRC,cAAc;AAAA,EACdC,YAAY;AAAA,EACZC,gBAAgB;AAAA,EAChBC,sBAAsB;AAAA,EACtBC;AAAAA,EACAC;AAAAA,EACA,GAAGC;AACc,MAAM;AACjBhB,QAAAA,SAASiB,UAAUzC,gBAAgByB,UAAU;AAE7CiB,QAAAA,YAAYC,YAAYpC,IAAI,cAAc;AAEhD,QAAM,CAACqC,iBAAiBC,kBAAkB,IAAIC,cAC5C1B,QACA,SAAS;AAGX,QAAM,CAAC2B,iBAAiB,IAAID,cAAczB,eAAe,UAAU;AAEnE,QAAMW,SAASC,cAAc;AAE7B,QAAM,CAACe,cAAcC,eAAe,IAAIC,SAAS,KAAK;AAEhD,QAAA,CAACC,WAAWC,cAAcC,iBAAiB,IAAIC,cACnDzB,YAAYF,aAAaD,KAAK;AAEhC,QAAM,CAAC6B,SAASC,YAAYC,eAAe,IAAIH,cAAc1B,QAAQ;AAErE,QAAM,CAAC8B,aAAaC,cAAc,IAAIC,eAAeT,WAAWI,OAAO;AAEjEM,QAAAA,cAAcC,OAAuB,IAAI;AAEzC,QAAA;AAAA,IAAEC;AAAAA,MAAgBC,SAAU;AAElCC,YAAU,MAAM;AACDpC,iBAAAA,YAAYF,aAAaD,OAAO,IAAI;AACjD8B,eAAW5B,UAAU,IAAI;AAAA,KACxB,CAACF,OAAOC,YAAYC,UAAUC,SAAS,CAAC;AAErCqC,QAAAA,eAAeJ,OAAO,KAAK;AACjCI,eAAaC,UAAUZ,WAAW;AAElCU,YAAU,MAAM;AACd,QAAId,aAAa,MAAM;AACN,qBAAA;AAAA,QACbiB,MAAMC,YAAYC;AAAAA,QAClBC,QAAQL,aAAaC,UAAU,SAAS;AAAA,QACxCK,MAAMrB,UAAUsB,YAAa;AAAA,QAC7BC,OAAOvB,UAAUwB,SAAAA,IAAa;AAAA,MAAA,CAC/B;AAAA,IACH;AAAA,EAAA,GACC,CAAChB,gBAAgBR,SAAS,CAAC;AAE9Bc,YAAU,MAAM;AACd,QAAIV,WAAW,MAAM;AACJ,qBAAA;AAAA,QACba,MAAMC,YAAYC;AAAAA,QAClBC,QAAQ;AAAA,QACRC,MAAMjB,QAAQkB,YAAa;AAAA,QAC3BC,OAAOnB,QAAQoB,SAAAA,IAAa;AAAA,MAAA,CAC7B;AAAA,IACH;AAAA,EAAA,GACC,CAAChB,gBAAgBJ,OAAO,CAAC;AAK5B,QAAMqB,cAAcA,MAAM;AACxBxB,iBAAaD,WAAW,IAAI;AACjBI,eAAAA,WAAWJ,WAAW,IAAI;AAErClC,yCAAWkC,WAAWI;AAEtBV,uBAAmB,MAAM;AAEnBpC,UAAAA,aAAa,CAACoE,OAAO1B,SAAS,KAAMtB,aAAa,CAACgD,OAAOtB,OAAO,IAAK;AAChE,eAAA;AAAA,MACT;AAEO,aAAA;AAAA,IAAA,CACR;AAEDN,oBAAgB,KAAK;AAAA,EAAA;AAMvB,QAAM6B,eAAeA,MAAM;AACN;AACF;AAEL;AAEZ7B,oBAAgB,KAAK;AAAA,EAAA;AAMvB,QAAM8B,cAAcA,MAAM;AACxB3B,iBAAa4B,QAAW,KAAK;AAC7BxB,eAAWwB,QAAW,KAAK;AAChB;AAAA,EAAA;AAGb,QAAMC,sBAAsBA,MAAM;AAC1BC,UAAAA,aAAa,EAAErD,aAAaK;AAClC,QAAIgD,YAAY;AACD;IAAA,OACR;AACS;IAChB;AAAA,EAAA;AAGIC,QAAAA,eAAeA,CAACC,KAAKC,SAAS;AAMlC,QAAID,QAAQ;AAAM;AAClBnC,oBAAgBoC,IAAI;AACpB,QAAI,CAACA;AAA2B;EAAA;AAGlC,QAAMC,mBAAmBA,MAAM;;AAC7BzB,sBAAYM,YAAZN,mBAAqB0B;AAAAA,EAAO;AAGxBC,QAAAA,mBAAmBA,CAACC,OAAOC,YAAY;AACvC,QAAA,CAACb,OAAOa,OAAO;AAAG;AAEhBC,UAAAA,WAAW,CAACzD,eAAe,CAACL;AAElC,QAAIA,WAAW;AACb,UAAI,CAACsB,aAAcA,aAAaI,WAAYmC,UAAUvC,WAAW;AAC/DC,qBAAasC,OAAO;AACpBlC,mBAAWwB,MAAS;AAAA,MAAA,OACf;AACLxB,mBAAWkC,OAAO;AAAA,MACpB;AAAA,IAAA,OACK;AACLtC,mBAAasC,SAASC,QAAQ;AAAA,IAChC;AAEA,QAAIA,UAAU;AACZ1E,2CAAWyE;AAEX7C,yBAAmB,MAAM;AAEvB,YAAIpC,YAAY,CAACoE,OAAOa,OAAO,GAAG;AACzB,iBAAA;AAAA,QACT;AAEO,eAAA;AAAA,MAAA,CACR;AAEDzC,sBAAgB,KAAK;AAAA,IACvB;AAAA,EAAA;AAGF,QAAM2C,wBAAwBA,CAACH,OAAOC,SAASG,aAAa;AACtD,QAAA,CAAChB,OAAOa,OAAO;AAAG;AAEtB,QAAI,CAAC7D,WAAW;AACd2D,uBAAiBC,OAAOC,OAAO;AAC/B;AAAA,IACF;AAEA,QAAIG,aAAa,QAAQ;AACnBtC,UAAAA;AAAsBmC,qBAAAA,UAAUnC,UAAUA,UAAUmC,OAAO;AAAA,IAAA,WACtDG,aAAa,SAAS;AAC/B,UAAI,CAAC1C,WAAW;AACVI,YAAAA;AAAsBmC,uBAAAA,UAAUnC,UAAUA,UAAUmC,OAAO;AAC/D;AAAA,MACF;AACWA,iBAAAA,UAAUvC,YAAYA,YAAYuC,OAAO;AAAA,IACtD;AAAA,EAAA;AAMII,QAAAA,gBAAgBA,MACpBC,oBAACC,YAAU;AAAA,IAAAC,UACRA,CAAC;AAAA,MAAEC;AAAAA,IAAAA,2BACDC,aAAW;AAAA,MACV7F,WACE6B,YACIiE,KACEC,kBAAkBC,iBAClBjG,mCAASiG,iBACTJ,IAAIK,OAAOD,eAAe,CAAC,IAE7B;AAAA,MACLL,UAAA,CAEA9D,aACC4D,oBAAA,OAAA;AAAA,QACEzF,WAAW8F,KACTC,kBAAkBG,eAClBnG,mCAASmG,aAAa;AAAA,QACtBP,8BAEDQ,UAAQ;AAAA,UACPlG,IAAImG,MAAMnG,IAAI,UAAU,OAAO;AAAA,UAC/BD,WAAW8F,KACTC,kBAAkBM,QAClBtG,mCAASsG,QACTT,IAAIK,OAAOI,MAAM,CAAC;AAAA,UAEpBC,SAAQ;AAAA,UACRC,SAAS9B;AAAAA,UAAYkB,UAEpBzE,iCAAQrB;AAAAA,QAAAA,CAAU;AAAA,MAAA,CACV,GAGf2G,qBAAA,OAAA;AAAA,QACExG,WAAW8F,KACTC,kBAAkBU,gBAClB1G,mCAAS0G,cAAc;AAAA,QACvBd,UAAA,CAEFF,oBAACU,UAAQ;AAAA,UACPlG,IAAImG,MAAMnG,IAAI,UAAU,OAAO;AAAA,UAC/BD,WAAW8F,KACTC,kBAAkBM,QAClBtG,mCAASsG,QACTT,IAAIK,OAAOI,MAAM,CAAC;AAAA,UAEpBC,SAAQ;AAAA,UACRC,SAASjC;AAAAA,UAAYqB,UAEpBzE,iCAAQvB;AAAAA,QAAAA,CACA,GACX8F,oBAACU,UAAQ;AAAA,UACPlG,IAAImG,MAAMnG,IAAI,UAAU,QAAQ;AAAA,UAChCD,WAAW8F,KACTC,kBAAkBM,QAClBtG,mCAASsG,QACTT,IAAIK,OAAOI,MAAM,CAAC;AAAA,UAEpBC,SAAQ;AAAA,UACRC,SAAS/B;AAAAA,UAAamB,UAErBzE,iCAAQtB;AAAAA,QAAAA,CACA,CAAA;AAAA,MAAA,CACP,CAAA;AAAA,IAAA,CAAA;AAAA,EAAA,CAIb;AAED,QAAM8G,mBAAmBA,CAACC,YAAYL,SAASM,SAAS;AACtD,UAAMC,mBAA0BC,wBAAAA,cAAYC,QAAAC,IAAAC,aAAA,eAAA;AAAA,MAAAhD,QAAA;AAAA,IAAA,IAAA;AAAA,MAAAA,QAAA;AAAA,MAAA3D,OAAA;AAAA,IAAA,CAAA,EAAE;AAAA,MAC5C4G,OAAOP,aACHQ,MAAMC,OAAOC,YACbF,MAAMG,WAAWC;AAAAA,IAAAA,GACtBR,QAAAC,IAAAC,aAAC,eAAA,KAAA,67zBAAA;AAEF,+BAAQJ,kBAAgB;AAAA,MAACP;AAAAA,MAAiBX,UAAEiB;AAAAA,IAAAA,CAAwB;AAAA,EAAA;AAGtE,QAAMY,cAAeb,CAAAA,eACnBD,iBACEC,YACAlD,2CAAa6D,WAAWG,qBACvBd,cAAc1F,iBAAiByD,SAAY,KAAKiC,cAAc1F,WAAW;AAG9E,QAAMyG,YAAYnG,YAAY;AAAA,IAAEsB;AAAAA,IAAWI;AAAAA,EAAYJ,IAAAA;AAEvD,QAAM8E,WAAWrH,SAAS;AAC1B,QAAMsH,iBAAiBnH,eAAe;AAMhCoH,QAAAA,eACJ7G,oBAAoB,SAClBF,WAAW4D,UAAa3D,kBAAkB2D,UACzC5D,WAAW4D,UAAavE;AAEvB2H,QAAAA,iBAAiBC,UAAUzF,eAAe;AAE5C0F,MAAAA;AACJ,MAAIF,gBAAgB;AAClBE,qBAAiBH,eACbzB,MAAMhE,WAAW,OAAO,IACxBpB;AAAAA,EACN;AAEA,6BACG0E,YAAU;AAAA,IAAAC,UACRA,CAAC;AAAA,MAAEC;AAAAA,IAAAA,2BACDqC,eAAa;AAAA,MACZhI;AAAAA,MACAC;AAAAA,MACAkB,OAAOsG;AAAAA,MACP5G,QAAQwB;AAAAA,MACRlC;AAAAA,MACAD;AAAAA,MACAH,WAAW8F,KACT9F,WACA+F,kBAAkBmC,MAClBnI,mCAASmI,MACTtC,IAAIK,OAAOiC,IAAI,CAAC;AAAA,MAElB7H;AAAAA,MAAmB,GACf6B;AAAAA,MAAMyD,YAERgC,YAAYC,wCACZ,OAAA;AAAA,QACE5H,WAAW8F,KACTC,kBAAkBoC,gBAClBpI,mCAASoI,gBACTvC,IAAIK,OAAOkC,cAAc,CAAC;AAAA,QAC1BxC,UAEDgC,CAAAA,YACClC,oBAAC2C,SAAO;AAAA,UACNnI,IAAImG,MAAMhE,WAAW,OAAO;AAAA,UAC5B9B;AAAAA,UACAN,WAAW8F,KACTC,kBAAkBzF,OAClBP,mCAASO,OACTsF,IAAIK,OAAO3F,KAAK,CAAC;AAAA,QAAA,CACjB,GAILsH,kBACCnC,oBAAC4C,eAAa;AAAA,UACZpI,IAAImG,MAAMhE,WAAW,aAAa;AAAA,UAClCpC,WAAW8F,KACTC,kBAAkBtF,aAClBV,mCAASU,aACTmF,IAAIK,OAAOxF,WAAW,CAAC;AAAA,UACvBkF,UAEDlF;AAAAA,QAAAA,CAEJ,CAAA;AAAA,MAAA,CAEJ,GACD+F,qBAAC8B,gBAAc;AAAA,QACbC,MAAK;AAAA,QACLxI,SAAS;AAAA,UACPmI,MAAMpC,KACJC,kBAAkByC,UAClBzI,mCAASyI,UACT5C,IAAIK,OAAOuC,QAAQ,CAAC;AAAA,UAEtBC,OAAO3C,KACLC,kBAAkB0C,OAClB1I,mCAAS0I,OACT7C,IAAIK,OAAOwC,KAAK,CAAC;AAAA,UAEnBC,QAAQZ,iBACJhC,KACEC,kBAAkB4C,uBAClB5I,mCAAS4I,uBACT/C,IAAIK,OAAO0C,qBAAqB,CAAC,IAEnCjE;AAAAA,UACJkE,YAAY9C,KACVC,kBAAkB8C,oBAClB9I,mCAAS8I,oBACTjD,IAAIK,OAAO4C,kBAAkB,CAAC;AAAA,QAElC;AAAA,QACAxI;AAAAA,QACAD;AAAAA,QACA0B;AAAAA,QACAgH,eAAa;AAAA,QACbC,WAAWtH;AAAAA,QACXuH,UAAUtG;AAAAA,QACVuG,UAAUpE;AAAAA,QACVqE,gBAAgBvE;AAAAA,QAChBwE,qBAAqBnE;AAAAA,QACrB/D,aAAauG,YACX4B,aAAa1B,WAAWnG,WAAWG,MAAM,CAAC;AAAA,QAE5C2H,+BACGC,UAAQ;AAAA,UACPtJ,WAAW8F,KACTC,kBAAkBwD,MAClBxJ,mCAASwJ,MACT3D,IAAIK,OAAOsD,IAAI,CAAC;AAAA,UAElBrC,OAAO9G,WAAW,iBAAiBsE;AAAAA,QAAAA,CAEtC;AAAA,QACD8E,aAAa;AAAA,UACXC,WAAW,CACT;AAAA,YAAEvJ,MAAM;AAAA,YAAmBwJ,SAAS3H;AAAAA,UAAAA,CAAqB;AAAA,QAE7D;AAAA,QACA,iBAAc;AAAA,QACd,cAAYxB;AAAAA,QACZ,mBACE,CAACD,SAAS8F,MAAMhE,WAAW,OAAO,GAAG5B,cAAc,EAChDmJ,KAAK,GAAG,EACRC,UAAUlF;AAAAA,QAEf,gBAAcoD,iBAAiB,OAAOpD;AAAAA,QACtC,qBAAmBsD;AAAAA,QACnB,oBACE,CAACvH,eAAe2F,MAAMhE,WAAW,aAAa,GAAG1B,eAAe,EAC7DiJ,KAAK,GAAG,EACRC,UAAUlF;AAAAA,QACd,GACG1C;AAAAA,QAAa2D,WAEjBF,oBAAA,OAAA;AAAA,UAAKoE,KAAKtG;AAAAA,UAAauG,UAAU;AAAA,QAAA,CAAM,GACvCrE,oBAACsE,YAAU;AAAA,UACT9J,IAAImG,MAAMnG,IAAI,UAAU;AAAA,UACxBuB;AAAAA,UACAb,UAAUuE;AAAAA,UACV8E,eAAe1E;AAAAA,UACf2E,qBAAqBA,CAACC,QAAQpG,MAAMM,OAAOH,WAAW;AACrC,2BAAA;AAAA,cAAEH;AAAAA,cAAMG;AAAAA,cAAQG;AAAAA,YAAAA,CAAO;AAAA,UACxC;AAAA,UACA1C;AAAAA,UAAe,GACX0B;AAAAA,UAAW,GACXnB;AAAAA,QAAa,CAAA,IAEjBV,aAAaK,gBAAgB4D,eAAe;AAAA,MAAA,CAAA,GAE/CqC,gBACCpC,oBAAC0E,eAAa;AAAA,QACZlK,IAAImG,MAAMhE,WAAW,OAAO;AAAA,QAC5BgI,eAAa;AAAA,QACbpK,WAAW8F,KAAKC,kBAAkBsE,OAAOtK,mCAASsK,KAAK;AAAA,QAAE1E,UAExDlD;AAAAA,MAAAA,CAEJ,CAAA;AAAA,IAAA,CAAA;AAAA,EAAA,CAGM;AAEjB;"}

package/dist/esm/components/DatePicker/DatePicker.styles.js

@@ -0,0 +1,78 @@
+import { theme } from "@hitachivantara/uikit-styles";
+import { outlineStyles } from "../../utils/focusUtils.js";
+const styles = {
+  root: {
+    position: "relative"
+  },
+  inputContainer: {
+    position: "relative",
+    background: theme.colors.atmo1,
+    height: 32,
+    paddingLeft: theme.space.xs,
+    paddingRight: theme.space.md,
+    "&:focus": {
+      ...outlineStyles
+    }
+  },
+  actionContainer: {
+    justifyContent: "space-between"
+  },
+  leftContainer: {},
+  rightContainer: {},
+  labelContainer: {
+    display: "flex",
+    alignItems: "flex-start"
+  },
+  label: {
+    paddingBottom: "6px",
+    display: "block"
+  },
+  description: {},
+  error: {},
+  dropdown: {
+    display: "block"
+  },
+  panel: {
+    border: theme.datePicker.panelBorder,
+    backgroundColor: theme.datePicker.panelBackgroundColor
+  },
+  dropdownHeaderInvalid: {
+    border: `1px solid ${theme.colors.negative}`,
+    "&:hover": {
+      border: `1px solid ${theme.colors.negative}`
+    }
+  },
+  dropdownHeaderOpen: {
+    border: theme.datePicker.dropdownHeaderOpenBorder,
+    "&:hover": {
+      border: theme.datePicker.dropdownHeaderOpenBorder
+    }
+  },
+  icon: {
+    position: "absolute",
+    right: -1,
+    bottom: -1
+  },
+  action: {
+    "&:first-of-type": {
+      marginRight: theme.space.xs
+    }
+  },
+  rangeMainContainer: {
+    display: "flex",
+    flexDirection: "column",
+    backgroundColor: theme.colors.atmo1,
+    width: "640px"
+  },
+  rangeCalendarsContainer: {
+    display: "flex",
+    flexDirection: "row"
+  },
+  rangeCalendarContainer: {
+    width: "50%"
+  }
+};
+export {
+  styles
+};
+//# sourceMappingURL=DatePicker.styles.js.map

package/dist/esm/components/DatePicker/DatePicker.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DatePicker.styles.js","sources":["../../../../src/components/DatePicker/DatePicker.styles.tsx"],"sourcesContent":["import { outlineStyles } from \"@core/utils\";\nimport { CSSInterpolation } from \"@emotion/serialize\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nexport const styles: { [key: string]: CSSInterpolation } = {\n  root: {\n    position: \"relative\",\n  },\n  inputContainer: {\n    position: \"relative\",\n    background: theme.colors.atmo1,\n    height: 32,\n    paddingLeft: theme.space.xs,\n    paddingRight: theme.space.md,\n    \"&:focus\": {\n      ...outlineStyles,\n    },\n  },\n  actionContainer: {\n    justifyContent: \"space-between\",\n  },\n  leftContainer: {},\n  rightContainer: {},\n\n  labelContainer: {\n    display: \"flex\",\n    alignItems: \"flex-start\",\n  },\n  label: {\n    paddingBottom: \"6px\",\n    display: \"block\",\n  },\n  description: {},\n  error: {},\n\n  dropdown: {\n    display: \"block\",\n  },\n  panel: {\n    border: theme.datePicker.panelBorder,\n    backgroundColor: theme.datePicker.panelBackgroundColor,\n  },\n\n  dropdownHeaderInvalid: {\n    border: `1px solid ${theme.colors.negative}`,\n    \"&:hover\": {\n      border: `1px solid ${theme.colors.negative}`,\n    },\n  },\n  dropdownHeaderOpen: {\n    border: theme.datePicker.dropdownHeaderOpenBorder,\n    \"&:hover\": {\n      border: theme.datePicker.dropdownHeaderOpenBorder,\n    },\n  },\n  icon: {\n    position: \"absolute\",\n    right: -1,\n    bottom: -1,\n  },\n  action: {\n    \"&:first-of-type\": {\n      marginRight: theme.space.xs,\n    },\n  },\n\n  rangeMainContainer: {\n    display: \"flex\",\n    flexDirection: \"column\",\n    backgroundColor: theme.colors.atmo1,\n    width: \"640px\",\n  },\n  rangeCalendarsContainer: {\n    display: \"flex\",\n    flexDirection: \"row\",\n  },\n  rangeCalendarContainer: {\n    width: \"50%\",\n  },\n};\n\n// export const StyledButton = styled(HvButton)({\n//     \"&:first-of-type\": {\n//         marginRight: theme.space.xs\n//       },\n// })\n\n// export const StyledTypography = styled(\n//     HvTypography,\n//     transientOptions,\n//     )(({ $dateString } : { $dateString: boolean }) => ({\n//         color: theme.colors.secondary_80,\n//     ...($dateString && {\n//         color: theme.colors.secondary,\n//     })\n// }))\n"],"names":["styles","root","position","inputContainer","background","theme","colors","atmo1","height","paddingLeft","space","xs","paddingRight","md","outlineStyles","actionContainer","justifyContent","leftContainer","rightContainer","labelContainer","display","alignItems","label","paddingBottom","description","error","dropdown","panel","border","datePicker","panelBorder","backgroundColor","panelBackgroundColor","dropdownHeaderInvalid","negative","dropdownHeaderOpen","dropdownHeaderOpenBorder","icon","right","bottom","action","marginRight","rangeMainContainer","flexDirection","width","rangeCalendarsContainer","rangeCalendarContainer"],"mappings":";;AAIO,MAAMA,SAA8C;AAAA,EACzDC,MAAM;AAAA,IACJC,UAAU;AAAA,EACZ;AAAA,EACAC,gBAAgB;AAAA,IACdD,UAAU;AAAA,IACVE,YAAYC,MAAMC,OAAOC;AAAAA,IACzBC,QAAQ;AAAA,IACRC,aAAaJ,MAAMK,MAAMC;AAAAA,IACzBC,cAAcP,MAAMK,MAAMG;AAAAA,IAC1B,WAAW;AAAA,MACT,GAAGC;AAAAA,IACL;AAAA,EACF;AAAA,EACAC,iBAAiB;AAAA,IACfC,gBAAgB;AAAA,EAClB;AAAA,EACAC,eAAe,CAAC;AAAA,EAChBC,gBAAgB,CAAC;AAAA,EAEjBC,gBAAgB;AAAA,IACdC,SAAS;AAAA,IACTC,YAAY;AAAA,EACd;AAAA,EACAC,OAAO;AAAA,IACLC,eAAe;AAAA,IACfH,SAAS;AAAA,EACX;AAAA,EACAI,aAAa,CAAC;AAAA,EACdC,OAAO,CAAC;AAAA,EAERC,UAAU;AAAA,IACRN,SAAS;AAAA,EACX;AAAA,EACAO,OAAO;AAAA,IACLC,QAAQvB,MAAMwB,WAAWC;AAAAA,IACzBC,iBAAiB1B,MAAMwB,WAAWG;AAAAA,EACpC;AAAA,EAEAC,uBAAuB;AAAA,IACrBL,QAAS,aAAYvB,MAAMC,OAAO4B;AAAAA,IAClC,WAAW;AAAA,MACTN,QAAS,aAAYvB,MAAMC,OAAO4B;AAAAA,IACpC;AAAA,EACF;AAAA,EACAC,oBAAoB;AAAA,IAClBP,QAAQvB,MAAMwB,WAAWO;AAAAA,IACzB,WAAW;AAAA,MACTR,QAAQvB,MAAMwB,WAAWO;AAAAA,IAC3B;AAAA,EACF;AAAA,EACAC,MAAM;AAAA,IACJnC,UAAU;AAAA,IACVoC,OAAO;AAAA,IACPC,QAAQ;AAAA,EACV;AAAA,EACAC,QAAQ;AAAA,IACN,mBAAmB;AAAA,MACjBC,aAAapC,MAAMK,MAAMC;AAAAA,IAC3B;AAAA,EACF;AAAA,EAEA+B,oBAAoB;AAAA,IAClBtB,SAAS;AAAA,IACTuB,eAAe;AAAA,IACfZ,iBAAiB1B,MAAMC,OAAOC;AAAAA,IAC9BqC,OAAO;AAAA,EACT;AAAA,EACAC,yBAAyB;AAAA,IACvBzB,SAAS;AAAA,IACTuB,eAAe;AAAA,EACjB;AAAA,EACAG,wBAAwB;AAAA,IACtBF,OAAO;AAAA,EACT;AACF;"}

package/dist/esm/components/DatePicker/datePickerClasses.js

@@ -0,0 +1,8 @@
+import { getClasses } from "../../utils/classes.js";
+const classKeys = ["root", "labelContainer", "label", "description", "error", "placeholder", "selectionDisabled", "dropdown", "panel", "action", "icon", "dropdownHeader", "dropdownHeaderInvalid", "dropdownHeaderOpen", "actionContainer", "leftContainer", "rightContainer"];
+const datePickerClasses = getClasses(classKeys, "HvDatePicker");
+const datePickerClasses$1 = datePickerClasses;
+export {
+  datePickerClasses$1 as default
+};
+//# sourceMappingURL=datePickerClasses.js.map

package/dist/esm/components/DatePicker/datePickerClasses.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"datePickerClasses.js","sources":["../../../../src/components/DatePicker/datePickerClasses.tsx"],"sourcesContent":["import { getClasses } from \"@core/utils\";\n\nexport type HvDatePickerClasses = {\n  root?: string;\n  labelContainer?: string;\n  label?: string;\n  description?: string;\n  error?: string;\n  placeholder?: string;\n  selectionDisabled?: string;\n  dropdown?: string;\n  panel?: string;\n  action?: string;\n  icon?: string;\n  dropdownHeader?: string;\n  dropdownHeaderInvalid?: string;\n  dropdownHeaderOpen?: string;\n  actionContainer?: string;\n  leftContainer?: string;\n  rightContainer?: string;\n};\n\nconst classKeys: string[] = [\n  \"root\",\n  \"labelContainer\",\n  \"label\",\n  \"description\",\n  \"error\",\n  \"placeholder\",\n  \"selectionDisabled\",\n  \"dropdown\",\n  \"panel\",\n  \"action\",\n  \"icon\",\n  \"dropdownHeader\",\n  \"dropdownHeaderInvalid\",\n  \"dropdownHeaderOpen\",\n  \"actionContainer\",\n  \"leftContainer\",\n  \"rightContainer\",\n];\n\nconst datePickerClasses = getClasses<HvDatePickerClasses>(\n  classKeys,\n  \"HvDatePicker\"\n);\n\nexport default datePickerClasses;\n"],"names":["classKeys","datePickerClasses","getClasses"],"mappings":";AAsBA,MAAMA,YAAsB,CAC1B,QACA,kBACA,SACA,eACA,SACA,eACA,qBACA,YACA,SACA,UACA,QACA,kBACA,yBACA,sBACA,mBACA,iBACA,gBAAgB;AAGlB,MAAMC,oBAAoBC,WACxBF,WACA,cAAc;AAGhB,MAAA,sBAAeC;"}

package/dist/esm/components/DatePicker/useVisibleDate.js

@@ -0,0 +1,193 @@
+import { useReducer } from "react";
+import { validateDate } from "./utils.js";
+import { NAV_OPTIONS } from "../Calendar/enums.js";
+function stateToLeftRight({
+  visibleYear,
+  visibleMonth,
+  rightVisibleYear,
+  rightVisibleMonth
+}) {
+  return {
+    left: {
+      year: visibleYear,
+      month: visibleMonth
+    },
+    right: {
+      year: rightVisibleYear,
+      month: rightVisibleMonth
+    }
+  };
+}
+function leftRightToState(left, right) {
+  return {
+    visibleYear: left.year,
+    visibleMonth: left.month,
+    rightVisibleYear: right.year,
+    rightVisibleMonth: right.month
+  };
+}
+function subtractYear({
+  year,
+  month
+}) {
+  return {
+    year: year - 1,
+    month
+  };
+}
+function addYear({
+  year,
+  month
+}) {
+  return {
+    year: year + 1,
+    month
+  };
+}
+function subtractMonth({
+  year,
+  month
+}) {
+  let y = year;
+  let m = month;
+  m -= 1;
+  if (m === 0) {
+    y -= 1;
+    m = 12;
+  }
+  return {
+    year: y,
+    month: m
+  };
+}
+function addMonth({
+  year,
+  month
+}) {
+  let y = year;
+  let m = month;
+  m += 1;
+  if (m === 13) {
+    y += 1;
+    m = 1;
+  }
+  return {
+    year: y,
+    month: m
+  };
+}
+function ensureNoOverlap(left, right, keepRight = false) {
+  let l = left;
+  let r = right;
+  if (left.year > right.year || left.year === right.year && left.month >= right.month) {
+    if (keepRight) {
+      l = subtractMonth(right);
+    } else {
+      r = addMonth(left);
+    }
+  }
+  return leftRightToState(l, r);
+}
+function isSameYearMonth(d1, d2) {
+  return d1.year === d2.year && d1.month === d2.month;
+}
+function visibleDateReducer(state, action) {
+  let {
+    left,
+    right
+  } = stateToLeftRight(state);
+  switch (action.type) {
+    case NAV_OPTIONS.PREVIOUS_YEAR:
+      if (action.target === "right") {
+        right = subtractYear(right);
+        return ensureNoOverlap(left, right, true);
+      }
+      left = subtractYear(left);
+      return ensureNoOverlap(left, right, false);
+    case NAV_OPTIONS.NEXT_YEAR:
+      if (action.target === "right") {
+        right = addYear(right);
+        return ensureNoOverlap(left, right, true);
+      }
+      left = addYear(left);
+      return ensureNoOverlap(left, right, false);
+    case NAV_OPTIONS.PREVIOUS_MONTH:
+      if (action.target === "right") {
+        right = subtractMonth(right);
+        return ensureNoOverlap(left, right, true);
+      }
+      left = subtractMonth(left);
+      return ensureNoOverlap(left, right, false);
+    case NAV_OPTIONS.NEXT_MONTH:
+      if (action.target === "right") {
+        right = addMonth(right);
+        return ensureNoOverlap(left, right, true);
+      }
+      left = addMonth(left);
+      return ensureNoOverlap(left, right, false);
+    case NAV_OPTIONS.MONTH:
+      if (action.month != null) {
+        if (action.target === "right") {
+          if (right.month !== action.month) {
+            right = {
+              year: right.year,
+              month: action.month
+            };
+            return ensureNoOverlap(left, right, true);
+          }
+        } else if (left.month !== action.month) {
+          left = {
+            year: left.year,
+            month: action.month
+          };
+          return ensureNoOverlap(left, right, false);
+        }
+      }
+      break;
+    case NAV_OPTIONS.MONTH_YEAR:
+      if (action.month != null && action.year != null) {
+        if (action.target === "right") {
+          if (!isSameYearMonth(left, action) && !isSameYearMonth(right, action)) {
+            right = {
+              year: action.year,
+              month: action.month
+            };
+            return ensureNoOverlap(left, right, true);
+          }
+        } else if (!isSameYearMonth(left, action) && (action.target === "left" || !isSameYearMonth(right, action))) {
+          left = {
+            year: action.year,
+            month: action.month
+          };
+          return ensureNoOverlap(left, right, false);
+        }
+      }
+      break;
+  }
+  return state;
+}
+function stateFromRange(startDate, endDate) {
+  const initialStartDate = validateDate(startDate);
+  const initialEndDate = endDate != null ? validateDate(endDate) : initialStartDate;
+  return ensureNoOverlap({
+    year: initialStartDate.getFullYear(),
+    month: initialStartDate.getMonth() + 1
+  }, {
+    year: initialEndDate.getFullYear(),
+    month: initialEndDate.getMonth() + 1
+  });
+}
+function useVisibleDate(startDate, endDate) {
+  const [state, dispatchAction] = useReducer(visibleDateReducer, {
+    startDate,
+    endDate
+  }, (initData) => {
+    return stateFromRange(initData.startDate, initData.endDate);
+  });
+  return [state, dispatchAction];
+}
+export {
+  useVisibleDate as default,
+  isSameYearMonth
+};
+//# sourceMappingURL=useVisibleDate.js.map

package/dist/esm/components/DatePicker/useVisibleDate.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useVisibleDate.js","sources":["../../../../src/components/DatePicker/useVisibleDate.tsx"],"sourcesContent":["import { useReducer } from \"react\";\n\nimport { validateDate } from \"./utils\";\n\nimport { NAV_OPTIONS } from \"../Calendar/enums\";\n\nfunction stateToLeftRight({\n  visibleYear,\n  visibleMonth,\n  rightVisibleYear,\n  rightVisibleMonth,\n}) {\n  return {\n    left: { year: visibleYear, month: visibleMonth },\n    right: { year: rightVisibleYear, month: rightVisibleMonth },\n  };\n}\n\nfunction leftRightToState(left, right) {\n  return {\n    visibleYear: left.year,\n    visibleMonth: left.month,\n    rightVisibleYear: right.year,\n    rightVisibleMonth: right.month,\n  };\n}\n\nfunction subtractYear({ year, month }) {\n  return { year: year - 1, month };\n}\n\nfunction addYear({ year, month }) {\n  return { year: year + 1, month };\n}\n\nfunction subtractMonth({ year, month }) {\n  let y = year;\n  let m = month;\n\n  m -= 1;\n  if (m === 0) {\n    y -= 1;\n    m = 12;\n  }\n\n  return { year: y, month: m };\n}\n\nfunction addMonth({ year, month }) {\n  let y = year;\n  let m = month;\n\n  m += 1;\n  if (m === 13) {\n    y += 1;\n    m = 1;\n  }\n\n  return { year: y, month: m };\n}\n\nfunction ensureNoOverlap(left, right, keepRight = false) {\n  let l = left;\n  let r = right;\n  if (\n    left.year > right.year ||\n    (left.year === right.year && left.month >= right.month)\n  ) {\n    if (keepRight) {\n      l = subtractMonth(right);\n    } else {\n      r = addMonth(left);\n    }\n  }\n\n  return leftRightToState(l, r);\n}\n\nexport function isSameYearMonth(d1, d2) {\n  return d1.year === d2.year && d1.month === d2.month;\n}\n\nfunction visibleDateReducer(state, action) {\n  let { left, right } = stateToLeftRight(state);\n\n  switch (action.type) {\n    case NAV_OPTIONS.PREVIOUS_YEAR:\n      if (action.target === \"right\") {\n        right = subtractYear(right);\n        return ensureNoOverlap(left, right, true);\n      }\n\n      left = subtractYear(left);\n      return ensureNoOverlap(left, right, false);\n\n    case NAV_OPTIONS.NEXT_YEAR:\n      if (action.target === \"right\") {\n        right = addYear(right);\n        return ensureNoOverlap(left, right, true);\n      }\n\n      left = addYear(left);\n      return ensureNoOverlap(left, right, false);\n\n    case NAV_OPTIONS.PREVIOUS_MONTH:\n      if (action.target === \"right\") {\n        right = subtractMonth(right);\n        return ensureNoOverlap(left, right, true);\n      }\n\n      left = subtractMonth(left);\n      return ensureNoOverlap(left, right, false);\n\n    case NAV_OPTIONS.NEXT_MONTH:\n      if (action.target === \"right\") {\n        right = addMonth(right);\n        return ensureNoOverlap(left, right, true);\n      }\n\n      left = addMonth(left);\n      return ensureNoOverlap(left, right, false);\n\n    case NAV_OPTIONS.MONTH:\n      if (action.month != null) {\n        if (action.target === \"right\") {\n          if (right.month !== action.month) {\n            right = { year: right.year, month: action.month };\n            return ensureNoOverlap(left, right, true);\n          }\n        } else if (left.month !== action.month) {\n          left = { year: left.year, month: action.month };\n          return ensureNoOverlap(left, right, false);\n        }\n      }\n      break;\n\n    case NAV_OPTIONS.MONTH_YEAR:\n      if (action.month != null && action.year != null) {\n        if (action.target === \"right\") {\n          if (\n            !isSameYearMonth(left, action) &&\n            !isSameYearMonth(right, action)\n          ) {\n            right = { year: action.year, month: action.month };\n            return ensureNoOverlap(left, right, true);\n          }\n        } else if (\n          !isSameYearMonth(left, action) &&\n          (action.target === \"left\" || !isSameYearMonth(right, action))\n        ) {\n          left = { year: action.year, month: action.month };\n          return ensureNoOverlap(left, right, false);\n        }\n      }\n\n      break;\n\n    default:\n  }\n\n  return state;\n}\n\nfunction stateFromRange(startDate, endDate) {\n  const initialStartDate = validateDate(startDate);\n  const initialEndDate =\n    endDate != null ? validateDate(endDate) : initialStartDate;\n\n  return ensureNoOverlap(\n    {\n      year: initialStartDate.getFullYear(),\n      month: initialStartDate.getMonth() + 1,\n    },\n    { year: initialEndDate.getFullYear(), month: initialEndDate.getMonth() + 1 }\n  );\n}\n\nexport default function useVisibleDate(startDate, endDate) {\n  const [state, dispatchAction] = useReducer(\n    visibleDateReducer,\n    { startDate, endDate },\n    (initData) => {\n      return stateFromRange(initData.startDate, initData.endDate);\n    }\n  );\n\n  return [state, dispatchAction];\n}\n"],"names":["stateToLeftRight","visibleYear","visibleMonth","rightVisibleYear","rightVisibleMonth","left","year","month","right","leftRightToState","subtractYear","addYear","subtractMonth","y","m","addMonth","ensureNoOverlap","keepRight","l","r","isSameYearMonth","d1","d2","visibleDateReducer","state","action","type","NAV_OPTIONS","PREVIOUS_YEAR","target","NEXT_YEAR","PREVIOUS_MONTH","NEXT_MONTH","MONTH","MONTH_YEAR","stateFromRange","startDate","endDate","initialStartDate","validateDate","initialEndDate","getFullYear","getMonth","useVisibleDate","dispatchAction","useReducer","initData"],"mappings":"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"}

package/dist/esm/components/DatePicker/utils.js

@@ -0,0 +1,32 @@
+import { REPRESENTATION_VALUES } from "../Calendar/enums.js";
+import { isDate, getFormattedDate, isSameMonth, getMonthName } from "../Calendar/utils.js";
+const validateDate = (date) => isDate(date) && date || /* @__PURE__ */ new Date();
+const getFormattedDateRange = (date, locale, rep = REPRESENTATION_VALUES.SHORT) => {
+  const {
+    startDate,
+    endDate
+  } = date;
+  const monthYear = `${getMonthName(startDate, locale, rep)} ${startDate.getFullYear()}`;
+  return `${startDate.getDate()} - ${endDate.getDate()} ${monthYear}`;
+};
+const getSingleDateLabel = (date, locale) => isDate(date) ? getFormattedDate(date, locale) : "";
+const getRangeDateLabel = ({
+  startDate,
+  endDate
+}, locale) => {
+  if (!(isDate(startDate) && isDate(endDate)))
+    return getSingleDateLabel(startDate);
+  return isSameMonth(startDate, endDate) ? getFormattedDateRange({
+    startDate,
+    endDate
+  }, locale) : `${getFormattedDate(startDate, locale)} - ${getFormattedDate(endDate, locale)}`;
+};
+const getDateLabel = (date, rangeMode, locale) => rangeMode ? getRangeDateLabel(date, locale) : getSingleDateLabel(date, locale);
+export {
+  getDateLabel,
+  getFormattedDateRange,
+  getRangeDateLabel,
+  getSingleDateLabel,
+  validateDate
+};
+//# sourceMappingURL=utils.js.map

package/dist/esm/components/DatePicker/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.js","sources":["../../../../src/components/DatePicker/utils.tsx"],"sourcesContent":["import { REPRESENTATION_VALUES } from \"../Calendar/enums\";\nimport {\n  getFormattedDate,\n  getMonthName,\n  isDate,\n  isSameMonth,\n} from \"../Calendar/utils\";\n\nexport const validateDate = (date) => (isDate(date) && date) || new Date();\n\nexport const getFormattedDateRange = (\n  date,\n  locale,\n  rep = REPRESENTATION_VALUES.SHORT\n) => {\n  const { startDate, endDate } = date;\n  const monthYear = `${getMonthName(\n    startDate,\n    locale,\n    rep\n  )} ${startDate.getFullYear()}`;\n  return `${startDate.getDate()} - ${endDate.getDate()} ${monthYear}`;\n};\n\nexport const getSingleDateLabel = (date, locale?) =>\n  isDate(date) ? getFormattedDate(date, locale) : \"\";\n\nexport const getRangeDateLabel = ({ startDate, endDate }, locale) => {\n  if (!(isDate(startDate) && isDate(endDate)))\n    return getSingleDateLabel(startDate);\n\n  return isSameMonth(startDate, endDate)\n    ? getFormattedDateRange({ startDate, endDate }, locale)\n    : `${getFormattedDate(startDate, locale)} - ${getFormattedDate(\n        endDate,\n        locale\n      )}`;\n};\n\nexport const getDateLabel = (date, rangeMode, locale) =>\n  rangeMode\n    ? getRangeDateLabel(date, locale)\n    : getSingleDateLabel(date, locale);\n"],"names":["validateDate","date","isDate","Date","getFormattedDateRange","locale","rep","REPRESENTATION_VALUES","SHORT","startDate","endDate","monthYear","getMonthName","getFullYear","getDate","getSingleDateLabel","getFormattedDate","getRangeDateLabel","isSameMonth","getDateLabel","rangeMode"],"mappings":";;AAQO,MAAMA,eAAgBC,CAAUC,SAAAA,OAAOD,IAAI,KAAKA,4BAAaE,KAAM;AAEnE,MAAMC,wBAAwBA,CACnCH,MACAI,QACAC,MAAMC,sBAAsBC,UACzB;AACG,QAAA;AAAA,IAAEC;AAAAA,IAAWC;AAAAA,EAAYT,IAAAA;AACzBU,QAAAA,YAAa,GAAEC,aACnBH,WACAJ,QACAC,GAAG,KACAG,UAAUI;AACf,SAAQ,GAAEJ,UAAUK,QAAAA,OAAeJ,QAAQI,aAAaH;AAC1D;AAEaI,MAAAA,qBAAqBA,CAACd,MAAMI,WACvCH,OAAOD,IAAI,IAAIe,iBAAiBf,MAAMI,MAAM,IAAI;AAE3C,MAAMY,oBAAoBA,CAAC;AAAA,EAAER;AAAAA,EAAWC;AAAQ,GAAGL,WAAW;AACnE,MAAI,EAAEH,OAAOO,SAAS,KAAKP,OAAOQ,OAAO;AACvC,WAAOK,mBAAmBN,SAAS;AAErC,SAAOS,YAAYT,WAAWC,OAAO,IACjCN,sBAAsB;AAAA,IAAEK;AAAAA,IAAWC;AAAAA,EAAQ,GAAGL,MAAM,IACnD,GAAEW,iBAAiBP,WAAWJ,MAAM,OAAOW,iBAC1CN,SACAL,MAAM;AAEd;AAEO,MAAMc,eAAeA,CAAClB,MAAMmB,WAAWf,WAC5Ce,YACIH,kBAAkBhB,MAAMI,MAAM,IAC9BU,mBAAmBd,MAAMI,MAAM;"}

package/dist/esm/components/Dialog/Dialog.js

@@ -4,12 +4,12 @@ import MuiDialog from "@mui/material/Dialog";
 import { Close } from "@hitachivantara/uikit-react-icons";
 import { theme } from "@hitachivantara/uikit-styles";
 import isNil from "lodash/isNil";
-import { StyledBackdrop, StyledPaper, StyledClose } from "./Dialog.styles.js";
+import { StyledBackdrop, styles, StyledClose } from "./Dialog.styles.js";
 import dialogClasses from "./dialogClasses.js";
 import { ClassNames } from "@emotion/react";
 import { jsx, jsxs } from "@emotion/react/jsx-runtime";
 import { getFocusableList } from "../../utils/focusableElementFinder.js";
-import withTooltip from "../../hocs/withTooltip.js";
+import withTooltipUtil from "../../hocs/withTooltip.js";
 import { useTheme } from "../../hooks/useTheme.js";
 import { setId } from "../../utils/setId.js";
 import { isKeypress } from "../../utils/keyboardUtils/keyCheck.js";
@@ -88,7 +88,7 @@ const HvDialog = ({
   const closeButtonDisplay = () => /* @__PURE__ */ jsx(Close, {
     role: "presentation"
   });
-  const CloseButtonTooltipWrapper = buttonTitle ? withTooltip(closeButtonDisplay, buttonTitle, "top", null, null, null) : closeButtonDisplay;
+  const CloseButtonTooltipWrapper = buttonTitle ? withTooltipUtil(closeButtonDisplay, buttonTitle, "top") : closeButtonDisplay;
   return /* @__PURE__ */ jsx(ClassNames, {
     children: ({
       css
@@ -124,15 +124,11 @@ const HvDialog = ({
           root: clsx(classes == null ? void 0 : classes.background, dialogClasses.background)
         }
       },
-      PaperComponent: (paperProps) => /* @__PURE__ */ jsx(StyledPaper, {
-        $fullscreen: fullscreen,
-        ...paperProps
-      }),
       PaperProps: {
         classes: {
-          root: clsx(css({
+          root: clsx(css(styles.paper), classes == null ? void 0 : classes.paper, dialogClasses.paper, css({
             position: "absolute"
-          }), classes == null ? void 0 : classes.paper, dialogClasses.paper, fullscreen && clsx(dialogClasses.fullscreen, classes == null ? void 0 : classes.fullscreen))
+          }), fullscreen && clsx(dialogClasses.fullscreen, classes == null ? void 0 : classes.fullscreen, "fullscreen"))
         }
       },
       "aria-modal": true,

package/dist/esm/components/Dialog/Dialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"Dialog.js","sources":["../../../../src/components/Dialog/Dialog.tsx"],"sourcesContent":["import React, { useCallback, useRef } from \"react\";\nimport { clsx } from \"clsx\";\nimport MuiDialog, { DialogProps as MuiDialogProps } from \"@mui/material/Dialog\";\nimport { Close } from \"@hitachivantara/uikit-react-icons\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport isNil from \"lodash/isNil\";\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { StyledBackdrop, StyledClose, StyledPaper } from \"./Dialog.styles\";\nimport {\n  isKeypress,\n  keyboardCodes,\n  setId,\n  getFocusableList,\n} from \"@core/utils\";\nimport { withTooltip } from \"@core/hocs\";\nimport dialogClasses, { HvDialogClasses } from \"./dialogClasses\";\nimport { useTheme } from \"@core/hooks\";\nimport { ClassNames } from \"@emotion/react\";\n\nexport interface HvDialogProps\n  extends Omit<MuiDialogProps, \"fullScreen\" | \"classes\" | \"open\">,\n    HvBaseProps {\n  /** Id to be applied to the root node. */\n  id?: string;\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  /** Element id that should be focus when the Dialog opens. */\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}\n\nexport const HvDialog = ({\n  classes,\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}: HvDialogProps) => {\n  delete (others as any).fullScreen;\n\n  const { activeTheme, selectedMode, rootId } = useTheme();\n\n  const focusableQueue = useRef<{\n    first?: HTMLElement;\n    last?: HTMLElement;\n  }>({ first: undefined, last: undefined });\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 = (\n    event,\n    bypassValidation: boolean = false,\n    reason?: \"escapeKeyDown\" | \"backdropClick\"\n  ) => {\n    if (bypassValidation) {\n      onClose?.(event, reason);\n    } else if (!disableBackdropClick) {\n      onClose?.(event, reason);\n    }\n  };\n\n  const measuredRef = useCallback(\n    (node) => {\n      if (node) {\n        const focusableList = getFocusableList(node);\n        focusableQueue.current = {\n          first: focusableList[1],\n          last: focusableList[focusableList.length - 2],\n        };\n        if (isNil(firstFocusable)) focusableList[1].focus();\n        else {\n          const element =\n            firstFocusable && document.getElementById(firstFocusable);\n          if (element) element.focus();\n          else {\n            console.warn(`firstFocusable element ${firstFocusable} not found.`);\n\n            focusableList[1].focus();\n          }\n        }\n      }\n    },\n    [firstFocusable]\n  );\n\n  const keyDownHandler = (event) => {\n    if (\n      isKeypress(event, keyboardCodes.Tab) &&\n      !isNil(event.target) &&\n      !isNil(focusableQueue)\n    ) {\n      if (event.shiftKey && event.target === focusableQueue.current.first) {\n        focusableQueue.current.last?.focus();\n        event.preventDefault();\n      }\n      if (!event.shiftKey && event.target === focusableQueue.current.last) {\n        focusableQueue.current.first?.focus();\n        event.preventDefault();\n      }\n    }\n    // Needed as this handler overrides the one in the material ui Modal.\n    else if (isKeypress(event, keyboardCodes.Esc)) {\n      if (\n        \"onEscapeKeyDown\" in others &&\n        typeof others.onEscapeKeyDown === \"function\"\n      ) {\n        others.onEscapeKeyDown(event);\n      }\n\n      if (!others.disableEscapeKeyDown) {\n        // Swallow the event, in case someone is listening for the escape key on the body.\n        event.stopPropagation();\n\n        wrappedClose(event, true, \"escapeKeyDown\");\n      }\n    }\n  };\n\n  const closeButtonDisplay = () => <Close role=\"presentation\" />;\n\n  const CloseButtonTooltipWrapper = buttonTitle\n    ? withTooltip(closeButtonDisplay, buttonTitle, \"top\", null, null, null)\n    : closeButtonDisplay;\n\n  return (\n    <ClassNames>\n      {({ css }) => (\n        <MuiDialog\n          container={document.getElementById(rootId || \"\") || document.body}\n          className={clsx(dialogClasses.root, classes?.root, className)}\n          id={id}\n          ref={measuredRef}\n          open={open}\n          fullScreen={fullscreen}\n          onClose={(event, reason) => wrappedClose(event, undefined, reason)}\n          onKeyDown={keyDownHandler}\n          fullWidth\n          maxWidth={false}\n          slots={{\n            backdrop: (backdropProps) => (\n              <StyledBackdrop\n                open={open}\n                onClick={(event) => wrappedClose(event)}\n                $backColor={\n                  activeTheme?.colors?.modes[selectedMode].atmo4 ||\n                  theme.colors.atmo4\n                }\n                {...backdropProps}\n              />\n            ),\n          }}\n          classes={{ container: css({ position: \"relative\" }) }}\n          BackdropProps={{\n            classes: {\n              root: clsx(classes?.background, dialogClasses.background),\n            },\n          }}\n          PaperComponent={(paperProps) => (\n            <StyledPaper $fullscreen={fullscreen} {...paperProps} />\n          )}\n          PaperProps={{\n            classes: {\n              root: clsx(\n                css({ position: \"absolute\" }),\n                classes?.paper,\n                dialogClasses.paper,\n                fullscreen &&\n                  clsx(dialogClasses.fullscreen, classes?.fullscreen)\n              ),\n            },\n          }}\n          aria-modal\n          {...others}\n        >\n          <StyledClose\n            id={setId(id, \"close\")}\n            className={clsx(dialogClasses.closeButton, classes?.closeButton)}\n            variant=\"secondaryGhost\"\n            onClick={(event) => wrappedClose(event, true, undefined)}\n            aria-label={buttonTitle}\n          >\n            <CloseButtonTooltipWrapper />\n          </StyledClose>\n          {children && typeof children === \"object\"\n            ? React.Children.map(\n                children,\n                (c: React.ReactNode) =>\n                  c &&\n                  React.cloneElement(c as React.ReactElement, { fullscreen })\n              )\n            : children}\n        </MuiDialog>\n      )}\n    </ClassNames>\n  );\n};\n"],"names":["HvDialog","classes","className","id","children","open","onClose","firstFocusable","buttonTitle","fullscreen","disableBackdropClick","others","fullScreen","activeTheme","selectedMode","rootId","useTheme","focusableQueue","useRef","first","undefined","last","wrappedClose","event","bypassValidation","reason","measuredRef","useCallback","node","focusableList","getFocusableList","current","length","isNil","focus","element","document","getElementById","warn","keyDownHandler","isKeypress","keyboardCodes","Tab","target","shiftKey","preventDefault","Esc","onEscapeKeyDown","disableEscapeKeyDown","stopPropagation","closeButtonDisplay","_jsx","Close","role","CloseButtonTooltipWrapper","withTooltip","ClassNames","css","MuiDialog","container","body","clsx","dialogClasses","root","ref","onKeyDown","fullWidth","maxWidth","slots","backdrop","backdropProps","StyledBackdrop","onClick","$backColor","colors","modes","atmo4","theme","position","BackdropProps","background","PaperComponent","paperProps","StyledPaper","$fullscreen","PaperProps","paper","StyledClose","setId","closeButton","variant","React","Children","map","c","cloneElement"],"mappings":"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"}
+{"version":3,"file":"Dialog.js","sources":["../../../../src/components/Dialog/Dialog.tsx"],"sourcesContent":["import React, { useCallback, useRef } from \"react\";\nimport { clsx } from \"clsx\";\nimport MuiDialog, { DialogProps as MuiDialogProps } from \"@mui/material/Dialog\";\nimport { Close } from \"@hitachivantara/uikit-react-icons\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport isNil from \"lodash/isNil\";\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { StyledBackdrop, StyledClose, styles } from \"./Dialog.styles\";\nimport {\n  isKeypress,\n  keyboardCodes,\n  setId,\n  getFocusableList,\n} from \"@core/utils\";\nimport { withTooltip } from \"@core/hocs\";\nimport dialogClasses, { HvDialogClasses } from \"./dialogClasses\";\nimport { useTheme } from \"@core/hooks\";\nimport { ClassNames } from \"@emotion/react\";\n\nexport interface HvDialogProps\n  extends Omit<MuiDialogProps, \"fullScreen\" | \"classes\" | \"open\">,\n    HvBaseProps {\n  /** Id to be applied to the root node. */\n  id?: string;\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  /** Element id that should be focus when the Dialog opens. */\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}\n\nexport const HvDialog = ({\n  classes,\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}: HvDialogProps) => {\n  delete (others as any).fullScreen;\n\n  const { activeTheme, selectedMode, rootId } = useTheme();\n\n  const focusableQueue = useRef<{\n    first?: HTMLElement;\n    last?: HTMLElement;\n  }>({ first: undefined, last: undefined });\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 = (\n    event,\n    bypassValidation: boolean = false,\n    reason?: \"escapeKeyDown\" | \"backdropClick\"\n  ) => {\n    if (bypassValidation) {\n      onClose?.(event, reason);\n    } else if (!disableBackdropClick) {\n      onClose?.(event, reason);\n    }\n  };\n\n  const measuredRef = useCallback(\n    (node) => {\n      if (node) {\n        const focusableList = getFocusableList(node);\n        focusableQueue.current = {\n          first: focusableList[1],\n          last: focusableList[focusableList.length - 2],\n        };\n        if (isNil(firstFocusable)) focusableList[1].focus();\n        else {\n          const element =\n            firstFocusable && document.getElementById(firstFocusable);\n          if (element) element.focus();\n          else {\n            console.warn(`firstFocusable element ${firstFocusable} not found.`);\n\n            focusableList[1].focus();\n          }\n        }\n      }\n    },\n    [firstFocusable]\n  );\n\n  const keyDownHandler = (event) => {\n    if (\n      isKeypress(event, keyboardCodes.Tab) &&\n      !isNil(event.target) &&\n      !isNil(focusableQueue)\n    ) {\n      if (event.shiftKey && event.target === focusableQueue.current.first) {\n        focusableQueue.current.last?.focus();\n        event.preventDefault();\n      }\n      if (!event.shiftKey && event.target === focusableQueue.current.last) {\n        focusableQueue.current.first?.focus();\n        event.preventDefault();\n      }\n    }\n    // Needed as this handler overrides the one in the material ui Modal.\n    else if (isKeypress(event, keyboardCodes.Esc)) {\n      if (\n        \"onEscapeKeyDown\" in others &&\n        typeof others.onEscapeKeyDown === \"function\"\n      ) {\n        others.onEscapeKeyDown(event);\n      }\n\n      if (!others.disableEscapeKeyDown) {\n        // Swallow the event, in case someone is listening for the escape key on the body.\n        event.stopPropagation();\n\n        wrappedClose(event, true, \"escapeKeyDown\");\n      }\n    }\n  };\n\n  const closeButtonDisplay = () => <Close role=\"presentation\" />;\n\n  const CloseButtonTooltipWrapper = buttonTitle\n    ? withTooltip(closeButtonDisplay, buttonTitle, \"top\")\n    : closeButtonDisplay;\n\n  return (\n    <ClassNames>\n      {({ css }) => (\n        <MuiDialog\n          container={document.getElementById(rootId || \"\") || document.body}\n          className={clsx(dialogClasses.root, classes?.root, className)}\n          id={id}\n          ref={measuredRef}\n          open={open}\n          fullScreen={fullscreen}\n          onClose={(event, reason) => wrappedClose(event, undefined, reason)}\n          onKeyDown={keyDownHandler}\n          fullWidth\n          maxWidth={false}\n          slots={{\n            backdrop: (backdropProps) => (\n              <StyledBackdrop\n                open={open}\n                onClick={(event) => wrappedClose(event)}\n                $backColor={\n                  activeTheme?.colors?.modes[selectedMode].atmo4 ||\n                  theme.colors.atmo4\n                }\n                {...backdropProps}\n              />\n            ),\n          }}\n          classes={{ container: css({ position: \"relative\" }) }}\n          BackdropProps={{\n            classes: {\n              root: clsx(classes?.background, dialogClasses.background),\n            },\n          }}\n          PaperProps={{\n            classes: {\n              root: clsx(\n                css(styles.paper),\n                classes?.paper,\n                dialogClasses.paper,\n                css({ position: \"absolute\" }),\n                fullscreen &&\n                  clsx(\n                    dialogClasses.fullscreen,\n                    classes?.fullscreen,\n                    \"fullscreen\"\n                  )\n              ),\n            },\n          }}\n          aria-modal\n          {...others}\n        >\n          <StyledClose\n            id={setId(id, \"close\")}\n            className={clsx(dialogClasses.closeButton, classes?.closeButton)}\n            variant=\"secondaryGhost\"\n            onClick={(event) => wrappedClose(event, true, undefined)}\n            aria-label={buttonTitle}\n          >\n            <CloseButtonTooltipWrapper />\n          </StyledClose>\n          {children && typeof children === \"object\"\n            ? React.Children.map(\n                children,\n                (c: React.ReactNode) =>\n                  c &&\n                  React.cloneElement(c as React.ReactElement, { fullscreen })\n              )\n            : children}\n        </MuiDialog>\n      )}\n    </ClassNames>\n  );\n};\n"],"names":["HvDialog","classes","className","id","children","open","onClose","firstFocusable","buttonTitle","fullscreen","disableBackdropClick","others","fullScreen","activeTheme","selectedMode","rootId","useTheme","focusableQueue","useRef","first","undefined","last","wrappedClose","event","bypassValidation","reason","measuredRef","useCallback","node","focusableList","getFocusableList","current","length","isNil","focus","element","document","getElementById","warn","keyDownHandler","isKeypress","keyboardCodes","Tab","target","shiftKey","preventDefault","Esc","onEscapeKeyDown","disableEscapeKeyDown","stopPropagation","closeButtonDisplay","_jsx","Close","role","CloseButtonTooltipWrapper","withTooltip","ClassNames","css","MuiDialog","container","body","clsx","dialogClasses","root","ref","onKeyDown","fullWidth","maxWidth","slots","backdrop","backdropProps","StyledBackdrop","onClick","$backColor","colors","modes","atmo4","theme","position","BackdropProps","background","PaperProps","styles","paper","StyledClose","setId","closeButton","variant","React","Children","map","c","cloneElement"],"mappings":"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"}