@hitachivantara/uikit-react-core 5.24.3 → 5.24.5

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

@@ -1,19 +1,17 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const clsx = require("clsx");
 const useDefaultProps = require("../../hooks/useDefaultProps.cjs");
 const React = require("react");
 const setId = require("../../utils/setId.cjs");
 const utils = require("./utils.cjs");
-const calendarClasses = require("./calendarClasses.cjs");
 const Calendar_styles = require("./Calendar.styles.cjs");
 const jsxRuntime = require("@emotion/react/jsx-runtime");
+const SingleCalendar = require("./SingleCalendar/SingleCalendar.cjs");
 const FormElementContext = require("../Forms/FormElement/context/FormElementContext.cjs");
 const FormElementValueContext = require("../Forms/FormElement/context/FormElementValueContext.cjs");
-const SingleCalendar = require("./SingleCalendar/SingleCalendar.cjs");
 const HvCalendar = (props) => {
   const {
-    classes,
+    classes: classesProp,
     id,
     locale = "en-US",
     value,
@@ -30,6 +28,9 @@ const HvCalendar = (props) => {
     invalidDateLabel,
     ...others
   } = useDefaultProps.useDefaultProps("HvCalendar", props);
+  const {
+    classes
+  } = Calendar_styles.useClasses(classesProp);
   const {
     elementId
   } = React.useContext(FormElementContext.HvFormElementContext);
@@ -53,10 +54,10 @@ const HvCalendar = (props) => {
     invalidDateLabel,
     ...others
   });
-  const rangeCalendar = /* @__PURE__ */ jsxRuntime.jsxs(Calendar_styles.StyledRangeCalendarContainer, {
-    className: clsx.clsx(calendarClasses.default.rangeCalendarContainer, classes == null ? void 0 : classes.rangeCalendarContainer),
+  const rangeCalendar = /* @__PURE__ */ jsxRuntime.jsxs("div", {
+    className: classes.rangeCalendarContainer,
     children: [/* @__PURE__ */ jsxRuntime.jsx(SingleCalendar.HvSingleCalendar, {
-      className: clsx.clsx(calendarClasses.default.singleCalendar, classes == null ? void 0 : classes.singleCalendar),
+      className: classes.singleCalendar,
       id: localId,
       locale,
       value: localValue,
@@ -70,7 +71,7 @@ const HvCalendar = (props) => {
       invalidDateLabel,
       ...others
     }), /* @__PURE__ */ jsxRuntime.jsx(SingleCalendar.HvSingleCalendar, {
-      className: clsx.clsx(calendarClasses.default.singleCalendar, classes == null ? void 0 : classes.singleCalendar),
+      className: classes.singleCalendar,
       id: rightCalendarId,
       locale,
       value: localValue,
@@ -88,10 +89,11 @@ const HvCalendar = (props) => {
       ...others
     })]
   });
-  return /* @__PURE__ */ jsxRuntime.jsxs(Calendar_styles.StyledRoot, {
-    className: clsx.clsx(calendarClasses.default.root, classes == null ? void 0 : classes.root),
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", {
+    className: classes.root,
     children: [startAdornment, rangeMode ? rangeCalendar : singleCalendar]
   });
 };
+exports.calendarClasses = Calendar_styles.staticClasses;
 exports.HvCalendar = HvCalendar;
 //# sourceMappingURL=Calendar.cjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"Calendar.cjs","sources":["../../../../src/components/Calendar/Calendar.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\n\nimport React, { useContext } from \"react\";\n\nimport { setId } from \"@core/utils/setId\";\nimport {\n  HvFormElementContext,\n  HvFormElementValueContext,\n} from \"@core/components/Forms\";\n\nimport { isRange } from \"./utils\";\nimport { HvSingleCalendar } from \"./SingleCalendar\";\nimport calendarClasses, { HvCalendarClasses } from \"./calendarClasses\";\nimport { StyledRangeCalendarContainer, StyledRoot } from \"./Calendar.styles\";\nimport { DateRangeProp, VisibilitySelectorActions } from \"./types\";\n\nexport interface HvCalendarProps {\n  /**\n   * Styles applied from the theme.\n   */\n  classes?: HvCalendarClasses;\n  /**\n   * Identifier.\n   */\n  id?: string;\n  /**\n   * The calendar locale. If undefined, it defaults to en-US\n   *\n   */\n  locale?: string;\n  /**\n   * Date that the calendar would show.\n   * if using the object format the calendar enter in range mode showing two calendars\n   */\n  value?: DateRangeProp | Date;\n  /**\n   * Controls the visible month of the Calendar\n   */\n  visibleMonth?: number;\n  /**\n   * Controls the visible year of the Calendar\n   */\n  visibleYear?: number;\n  /**\n   * Controls the visible month of the Calendar on the right side of the datepicker\n   */\n  rightVisibleMonth?: number;\n  /**\n   * Controls the visible year of the Calendar on the right side of the datepicker\n   */\n  rightVisibleYear?: number;\n  /**\n   * Callback function to be triggered when the selected date has changed.\n   */\n  onChange?: (\n    event:\n      | React.ChangeEvent<HTMLTextAreaElement | HTMLInputElement>\n      | undefined,\n    value: Date | DateRangeProp\n  ) => void;\n  /**\n   * Callback function to be triggered when the selected date input has changed.\n   */\n  onInputChange?: (\n    event:\n      | React.ChangeEvent<\n          HTMLTextAreaElement | HTMLInputElement | HTMLButtonElement\n        >\n      | undefined,\n    value: Date | DateRangeProp,\n    position: \"left\" | \"right\"\n  ) => void;\n  /**\n   * Callback function to be triggered when the user clicks on the month or year selector.\n   * it receives the action that was pressed:\n   * previous_month, next_month, previous_year, next_year,month\n   */\n  onVisibleDateChange?: (\n    event:\n      | React.ChangeEvent<HTMLTextAreaElement | HTMLInputElement>\n      | undefined,\n    action: VisibilitySelectorActions,\n    value?: Date | DateRangeProp | number,\n    position?: \"left\" | \"right\"\n  ) => void;\n  /**\n   * The maximum selectable date after this all values are disabled.\n   */\n  maximumDate?: Date;\n  /**\n   * The minimum selectable date before this all values are disabled.\n   */\n  minimumDate?: Date;\n  /**\n   * An element placed before the Calendar\n   */\n  startAdornment?: React.ReactNode;\n  /**\n   * Indicates if header should display the day of week.\n   */\n  showDayOfWeek?: boolean;\n  /**\n   * Label shown when date is invalid.\n   */\n  invalidDateLabel?: string;\n}\n\nexport const HvCalendar = (props: HvCalendarProps) => {\n  const {\n    classes,\n    id,\n    locale = \"en-US\",\n    value,\n    visibleMonth,\n    visibleYear,\n    rightVisibleMonth,\n    rightVisibleYear,\n    minimumDate,\n    maximumDate,\n    startAdornment,\n    onChange,\n    onInputChange,\n    onVisibleDateChange,\n    invalidDateLabel,\n    ...others\n  } = useDefaultProps(\"HvCalendar\", props);\n\n  const { elementId } = useContext(HvFormElementContext);\n  const elementValue = useContext(HvFormElementValueContext);\n  const localValue = value ?? elementValue;\n  const localId = id ?? setId(elementId, \"single-calendar\");\n  const rangeMode = isRange(localValue);\n  const rightCalendarId = setId(localId, \"single-calendar-right\");\n  const clampedMonth =\n    visibleMonth && visibleMonth % 13 > 0 ? visibleMonth % 13 : 1;\n\n  const singleCalendar = (\n    <HvSingleCalendar\n      id={localId}\n      locale={locale}\n      value={localValue}\n      visibleMonth={clampedMonth}\n      visibleYear={visibleYear}\n      minimumDate={minimumDate}\n      maximumDate={maximumDate}\n      onChange={onChange}\n      onInputChange={(evt, date) =>\n        onInputChange && onInputChange(evt, date, \"left\")\n      }\n      onVisibleDateChange={onVisibleDateChange}\n      invalidDateLabel={invalidDateLabel}\n      {...others}\n    />\n  );\n\n  const rangeCalendar = (\n    <StyledRangeCalendarContainer\n      className={clsx(\n        calendarClasses.rangeCalendarContainer,\n        classes?.rangeCalendarContainer\n      )}\n    >\n      <HvSingleCalendar\n        className={clsx(\n          calendarClasses.singleCalendar,\n          classes?.singleCalendar\n        )}\n        id={localId}\n        locale={locale}\n        value={localValue}\n        visibleMonth={clampedMonth}\n        visibleYear={visibleYear}\n        minimumDate={minimumDate}\n        maximumDate={maximumDate}\n        onChange={onChange}\n        onInputChange={(evt, date) =>\n          onInputChange && onInputChange(evt, date, \"left\")\n        }\n        onVisibleDateChange={(event, action, index) =>\n          onVisibleDateChange?.(event, action, index, \"left\")\n        }\n        invalidDateLabel={invalidDateLabel}\n        {...others}\n      />\n\n      <HvSingleCalendar\n        className={clsx(\n          calendarClasses.singleCalendar,\n          classes?.singleCalendar\n        )}\n        id={rightCalendarId}\n        locale={locale}\n        value={localValue}\n        visibleMonth={rightVisibleMonth}\n        visibleYear={rightVisibleYear}\n        minimumDate={minimumDate}\n        maximumDate={maximumDate}\n        onChange={onChange}\n        onInputChange={(evt, date) =>\n          onInputChange && onInputChange(evt, date, \"right\")\n        }\n        onVisibleDateChange={(event, action, index) => {\n          onVisibleDateChange?.(event, action, index, \"right\");\n        }}\n        showEndDate\n        invalidDateLabel={invalidDateLabel}\n        {...others}\n      />\n    </StyledRangeCalendarContainer>\n  );\n\n  return (\n    <StyledRoot className={clsx(calendarClasses.root, classes?.root)}>\n      {startAdornment}\n      {rangeMode ? rangeCalendar : singleCalendar}\n    </StyledRoot>\n  );\n};\n"],"names":["HvCalendar","props","classes","id","locale","value","visibleMonth","visibleYear","rightVisibleMonth","rightVisibleYear","minimumDate","maximumDate","startAdornment","onChange","onInputChange","onVisibleDateChange","invalidDateLabel","others","useDefaultProps","elementId","useContext","HvFormElementContext","elementValue","HvFormElementValueContext","localValue","localId","setId","rangeMode","isRange","rightCalendarId","clampedMonth","singleCalendar","HvSingleCalendar","evt","date","rangeCalendar","StyledRangeCalendarContainer","className","clsx","calendarClasses","rangeCalendarContainer","children","_jsx","event","action","index","showEndDate","StyledRoot","root"],"mappings":"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"}
+{"version":3,"file":"Calendar.cjs","sources":["../../../../src/components/Calendar/Calendar.tsx"],"sourcesContent":["import { useDefaultProps } from \"@core/hooks/useDefaultProps\";\n\nimport React, { useContext } from \"react\";\n\nimport { setId } from \"@core/utils/setId\";\nimport {\n  HvFormElementContext,\n  HvFormElementValueContext,\n} from \"@core/components/Forms\";\n\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { isRange } from \"./utils\";\nimport { HvSingleCalendar } from \"./SingleCalendar\";\nimport { DateRangeProp, VisibilitySelectorActions } from \"./types\";\n\nimport { staticClasses, useClasses } from \"./Calendar.styles\";\n\nexport { staticClasses as calendarClasses };\n\nexport type HvCalendarClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvCalendarProps {\n  /**\n   * Styles applied from the theme.\n   */\n  classes?: HvCalendarClasses;\n  /**\n   * Identifier.\n   */\n  id?: string;\n  /**\n   * The calendar locale. If undefined, it defaults to en-US\n   *\n   */\n  locale?: string;\n  /**\n   * Date that the calendar would show.\n   * if using the object format the calendar enter in range mode showing two calendars\n   */\n  value?: DateRangeProp | Date;\n  /**\n   * Controls the visible month of the Calendar\n   */\n  visibleMonth?: number;\n  /**\n   * Controls the visible year of the Calendar\n   */\n  visibleYear?: number;\n  /**\n   * Controls the visible month of the Calendar on the right side of the datepicker\n   */\n  rightVisibleMonth?: number;\n  /**\n   * Controls the visible year of the Calendar on the right side of the datepicker\n   */\n  rightVisibleYear?: number;\n  /**\n   * Callback function to be triggered when the selected date has changed.\n   */\n  onChange?: (\n    event:\n      | React.ChangeEvent<HTMLTextAreaElement | HTMLInputElement>\n      | undefined,\n    value: Date | DateRangeProp\n  ) => void;\n  /**\n   * Callback function to be triggered when the selected date input has changed.\n   */\n  onInputChange?: (\n    event:\n      | React.ChangeEvent<\n          HTMLTextAreaElement | HTMLInputElement | HTMLButtonElement\n        >\n      | undefined,\n    value: Date | DateRangeProp,\n    position: \"left\" | \"right\"\n  ) => void;\n  /**\n   * Callback function to be triggered when the user clicks on the month or year selector.\n   * it receives the action that was pressed:\n   * previous_month, next_month, previous_year, next_year,month\n   */\n  onVisibleDateChange?: (\n    event:\n      | React.ChangeEvent<HTMLTextAreaElement | HTMLInputElement>\n      | undefined,\n    action: VisibilitySelectorActions,\n    value?: Date | DateRangeProp | number,\n    position?: \"left\" | \"right\"\n  ) => void;\n  /**\n   * The maximum selectable date after this all values are disabled.\n   */\n  maximumDate?: Date;\n  /**\n   * The minimum selectable date before this all values are disabled.\n   */\n  minimumDate?: Date;\n  /**\n   * An element placed before the Calendar\n   */\n  startAdornment?: React.ReactNode;\n  /**\n   * Indicates if header should display the day of week.\n   */\n  showDayOfWeek?: boolean;\n  /**\n   * Label shown when date is invalid.\n   */\n  invalidDateLabel?: string;\n}\n\nexport const HvCalendar = (props: HvCalendarProps) => {\n  const {\n    classes: classesProp,\n    id,\n    locale = \"en-US\",\n    value,\n    visibleMonth,\n    visibleYear,\n    rightVisibleMonth,\n    rightVisibleYear,\n    minimumDate,\n    maximumDate,\n    startAdornment,\n    onChange,\n    onInputChange,\n    onVisibleDateChange,\n    invalidDateLabel,\n    ...others\n  } = useDefaultProps(\"HvCalendar\", props);\n  const { classes } = useClasses(classesProp);\n\n  const { elementId } = useContext(HvFormElementContext);\n  const elementValue = useContext(HvFormElementValueContext);\n  const localValue = value ?? elementValue;\n  const localId = id ?? setId(elementId, \"single-calendar\");\n  const rangeMode = isRange(localValue);\n  const rightCalendarId = setId(localId, \"single-calendar-right\");\n  const clampedMonth =\n    visibleMonth && visibleMonth % 13 > 0 ? visibleMonth % 13 : 1;\n\n  const singleCalendar = (\n    <HvSingleCalendar\n      id={localId}\n      locale={locale}\n      value={localValue}\n      visibleMonth={clampedMonth}\n      visibleYear={visibleYear}\n      minimumDate={minimumDate}\n      maximumDate={maximumDate}\n      onChange={onChange}\n      onInputChange={(evt, date) =>\n        onInputChange && onInputChange(evt, date, \"left\")\n      }\n      onVisibleDateChange={onVisibleDateChange}\n      invalidDateLabel={invalidDateLabel}\n      {...others}\n    />\n  );\n\n  const rangeCalendar = (\n    <div className={classes.rangeCalendarContainer}>\n      <HvSingleCalendar\n        className={classes.singleCalendar}\n        id={localId}\n        locale={locale}\n        value={localValue}\n        visibleMonth={clampedMonth}\n        visibleYear={visibleYear}\n        minimumDate={minimumDate}\n        maximumDate={maximumDate}\n        onChange={onChange}\n        onInputChange={(evt, date) =>\n          onInputChange && onInputChange(evt, date, \"left\")\n        }\n        onVisibleDateChange={(event, action, index) =>\n          onVisibleDateChange?.(event, action, index, \"left\")\n        }\n        invalidDateLabel={invalidDateLabel}\n        {...others}\n      />\n\n      <HvSingleCalendar\n        className={classes.singleCalendar}\n        id={rightCalendarId}\n        locale={locale}\n        value={localValue}\n        visibleMonth={rightVisibleMonth}\n        visibleYear={rightVisibleYear}\n        minimumDate={minimumDate}\n        maximumDate={maximumDate}\n        onChange={onChange}\n        onInputChange={(evt, date) =>\n          onInputChange && onInputChange(evt, date, \"right\")\n        }\n        onVisibleDateChange={(event, action, index) => {\n          onVisibleDateChange?.(event, action, index, \"right\");\n        }}\n        showEndDate\n        invalidDateLabel={invalidDateLabel}\n        {...others}\n      />\n    </div>\n  );\n\n  return (\n    <div className={classes.root}>\n      {startAdornment}\n      {rangeMode ? rangeCalendar : singleCalendar}\n    </div>\n  );\n};\n"],"names":["HvCalendar","props","classes","classesProp","id","locale","value","visibleMonth","visibleYear","rightVisibleMonth","rightVisibleYear","minimumDate","maximumDate","startAdornment","onChange","onInputChange","onVisibleDateChange","invalidDateLabel","others","useDefaultProps","useClasses","elementId","useContext","HvFormElementContext","elementValue","HvFormElementValueContext","localValue","localId","setId","rangeMode","isRange","rightCalendarId","clampedMonth","singleCalendar","HvSingleCalendar","evt","date","rangeCalendar","className","rangeCalendarContainer","children","_jsx","event","action","index","showEndDate","root"],"mappings":";;;;;;;;;;;AAgHaA,MAAAA,aAAaA,CAACC,UAA2B;AAC9C,QAAA;AAAA,IACJC,SAASC;AAAAA,IACTC;AAAAA,IACAC,SAAS;AAAA,IACTC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACA,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,gBAAA,cAAclB,KAAK;AACjC,QAAA;AAAA,IAAEC;AAAAA,EAAAA,IAAYkB,gBAAAA,WAAWjB,WAAW;AAEpC,QAAA;AAAA,IAAEkB;AAAAA,EAAAA,IAAcC,MAAAA,WAAWC,mBAAAA,oBAAoB;AAC/CC,QAAAA,eAAeF,iBAAWG,wBAAAA,yBAAyB;AACzD,QAAMC,aAAapB,SAASkB;AAC5B,QAAMG,UAAUvB,MAAMwB,MAAMP,MAAAA,WAAW,iBAAiB;AAClDQ,QAAAA,YAAYC,cAAQJ,UAAU;AAC9BK,QAAAA,kBAAkBH,MAAAA,MAAMD,SAAS,uBAAuB;AAC9D,QAAMK,eACJzB,gBAAgBA,eAAe,KAAK,IAAIA,eAAe,KAAK;AAExD0B,QAAAA,gDACHC,iCAAgB;AAAA,IACf9B,IAAIuB;AAAAA,IACJtB;AAAAA,IACAC,OAAOoB;AAAAA,IACPnB,cAAcyB;AAAAA,IACdxB;AAAAA,IACAG;AAAAA,IACAC;AAAAA,IACAE;AAAAA,IACAC,eAAeA,CAACoB,KAAKC,SACnBrB,iBAAiBA,cAAcoB,KAAKC,MAAM,MAAM;AAAA,IAElDpB;AAAAA,IACAC;AAAAA,IAAmC,GAC/BC;AAAAA,EAAAA,CACL;AAGGmB,QAAAA,gDACJ,OAAA;AAAA,IAAKC,WAAWpC,QAAQqC;AAAAA,IAAuBC,UAAA,CAC7CC,2BAAAA,IAACP,iCAAgB;AAAA,MACfI,WAAWpC,QAAQ+B;AAAAA,MACnB7B,IAAIuB;AAAAA,MACJtB;AAAAA,MACAC,OAAOoB;AAAAA,MACPnB,cAAcyB;AAAAA,MACdxB;AAAAA,MACAG;AAAAA,MACAC;AAAAA,MACAE;AAAAA,MACAC,eAAeA,CAACoB,KAAKC,SACnBrB,iBAAiBA,cAAcoB,KAAKC,MAAM,MAAM;AAAA,MAElDpB,qBAAqBA,CAAC0B,OAAOC,QAAQC,UACnC5B,2DAAsB0B,OAAOC,QAAQC,OAAO;AAAA,MAE9C3B;AAAAA,MAAmC,GAC/BC;AAAAA,IAAAA,CACL,GAEDuB,2BAAAA,IAACP,iCAAgB;AAAA,MACfI,WAAWpC,QAAQ+B;AAAAA,MACnB7B,IAAI2B;AAAAA,MACJ1B;AAAAA,MACAC,OAAOoB;AAAAA,MACPnB,cAAcE;AAAAA,MACdD,aAAaE;AAAAA,MACbC;AAAAA,MACAC;AAAAA,MACAE;AAAAA,MACAC,eAAeA,CAACoB,KAAKC,SACnBrB,iBAAiBA,cAAcoB,KAAKC,MAAM,OAAO;AAAA,MAEnDpB,qBAAqBA,CAAC0B,OAAOC,QAAQC,UAAU;AACvBF,mEAAAA,OAAOC,QAAQC,OAAO;AAAA,MAC9C;AAAA,MACAC,aAAW;AAAA,MACX5B;AAAAA,MAAmC,GAC/BC;AAAAA,IAAAA,CACL,CAAC;AAAA,EAAA,CACC;AAGP,yCACE,OAAA;AAAA,IAAKoB,WAAWpC,QAAQ4C;AAAAA,IAAKN,WAC1B3B,gBACAgB,YAAYQ,gBAAgBJ,cAAc;AAAA,EAAA,CACxC;AAET;;;"}

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

@@ -1,66 +1,38 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const _styled = require("@emotion/styled/base");
+const classes = require("../../utils/classes.cjs");
 const uikitStyles = require("@hitachivantara/uikit-styles");
-const calendarClasses = require("./calendarClasses.cjs");
-const jsxRuntime = require("@emotion/react/jsx-runtime");
-const SingleCalendar = require("./SingleCalendar/SingleCalendar.cjs");
-const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
-const _styled__default = /* @__PURE__ */ _interopDefault(_styled);
-function _EMOTION_STRINGIFIED_CSS_ERROR__() {
-  return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop).";
-}
-const StyledRoot = /* @__PURE__ */ _styled__default.default("div", process.env.NODE_ENV === "production" ? {
-  target: "e6gej3i2"
-} : {
-  target: "e6gej3i2",
-  label: "StyledRoot"
-})(process.env.NODE_ENV === "production" ? {
-  name: "zl1inp",
-  styles: "display:flex;justify-content:center"
-} : {
-  name: "zl1inp",
-  styles: "display:flex;justify-content:center",
-  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvQ2FsZW5kYXIvQ2FsZW5kYXIuc3R5bGVzLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFLMEIiLCJmaWxlIjoiL2hvbWUvcnVubmVyL3dvcmsvaHYtdWlraXQtcmVhY3QvaHYtdWlraXQtcmVhY3QvcGFja2FnZXMvY29yZS9zcmMvY29tcG9uZW50cy9DYWxlbmRhci9DYWxlbmRhci5zdHlsZXMudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5pbXBvcnQgeyB0aGVtZSB9IGZyb20gXCJAaGl0YWNoaXZhbnRhcmEvdWlraXQtc3R5bGVzXCI7XG5pbXBvcnQgY2FsZW5kYXJDbGFzc2VzIGZyb20gXCIuL2NhbGVuZGFyQ2xhc3Nlc1wiO1xuaW1wb3J0IHsgSHZTaW5nbGVDYWxlbmRhciwgSHZTaW5nbGVDYWxlbmRhclByb3BzIH0gZnJvbSBcIi4vU2luZ2xlQ2FsZW5kYXJcIjtcblxuZXhwb3J0IGNvbnN0IFN0eWxlZFJvb3QgPSBzdHlsZWQoXCJkaXZcIikoe1xuICBkaXNwbGF5OiBcImZsZXhcIixcbiAganVzdGlmeUNvbnRlbnQ6IFwiY2VudGVyXCIsXG59KTtcblxuZXhwb3J0IGNvbnN0IFN0eWxlZFJhbmdlQ2FsZW5kYXJDb250YWluZXIgPSBzdHlsZWQoXCJkaXZcIikoe1xuICBkaXNwbGF5OiBcImZsZXhcIixcbn0pO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkU2luZ2xlQ2FsZW5kYXIgPSBzdHlsZWQoKHByb3BzOiBIdlNpbmdsZUNhbGVuZGFyUHJvcHMpID0+IChcbiAgPEh2U2luZ2xlQ2FsZW5kYXIgey4uLnByb3BzfSAvPlxuKSkoe1xuICBcIiY6aG92ZXJcIjoge1xuICAgIFtgJiB+IC4ke2NhbGVuZGFyQ2xhc3Nlcy5zaW5nbGVDYWxlbmRhcn1gXToge1xuICAgICAgLy8gdGFyZ2V0IHRoZSBuZXh0IGNhbGVuZGFyIHdoZW4gdGhlIGZvcm1lciBpcyBob3ZlcmVkXG4gICAgICBcIiYgPiBkaXZcIjoge1xuICAgICAgICBcIiYgPiBkaXY6bnRoLWNoaWxkKDMpXCI6IHtcbiAgICAgICAgICBcIiYgPiBkaXZcIjoge1xuICAgICAgICAgICAgXCImID4gZGl2W2RhdGEtY2FsZW5kYXItY2VsbD0nY2FsZW5kYXJDZWxsJ11cIjoge1xuICAgICAgICAgICAgICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmNvbG9ycy5hdG1vMSxcbiAgICAgICAgICAgIH0sXG4gICAgICAgICAgfSxcbiAgICAgICAgfSxcbiAgICAgIH0sXG4gICAgfSxcbiAgfSxcbn0pO1xuIl19 */",
-  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
-});
-const StyledRangeCalendarContainer = /* @__PURE__ */ _styled__default.default("div", process.env.NODE_ENV === "production" ? {
-  target: "e6gej3i1"
-} : {
-  target: "e6gej3i1",
-  label: "StyledRangeCalendarContainer"
-})(process.env.NODE_ENV === "production" ? {
-  name: "zjik7",
-  styles: "display:flex"
-} : {
-  name: "zjik7",
-  styles: "display:flex",
-  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvQ2FsZW5kYXIvQ2FsZW5kYXIuc3R5bGVzLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFVNEMiLCJmaWxlIjoiL2hvbWUvcnVubmVyL3dvcmsvaHYtdWlraXQtcmVhY3QvaHYtdWlraXQtcmVhY3QvcGFja2FnZXMvY29yZS9zcmMvY29tcG9uZW50cy9DYWxlbmRhci9DYWxlbmRhci5zdHlsZXMudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5pbXBvcnQgeyB0aGVtZSB9IGZyb20gXCJAaGl0YWNoaXZhbnRhcmEvdWlraXQtc3R5bGVzXCI7XG5pbXBvcnQgY2FsZW5kYXJDbGFzc2VzIGZyb20gXCIuL2NhbGVuZGFyQ2xhc3Nlc1wiO1xuaW1wb3J0IHsgSHZTaW5nbGVDYWxlbmRhciwgSHZTaW5nbGVDYWxlbmRhclByb3BzIH0gZnJvbSBcIi4vU2luZ2xlQ2FsZW5kYXJcIjtcblxuZXhwb3J0IGNvbnN0IFN0eWxlZFJvb3QgPSBzdHlsZWQoXCJkaXZcIikoe1xuICBkaXNwbGF5OiBcImZsZXhcIixcbiAganVzdGlmeUNvbnRlbnQ6IFwiY2VudGVyXCIsXG59KTtcblxuZXhwb3J0IGNvbnN0IFN0eWxlZFJhbmdlQ2FsZW5kYXJDb250YWluZXIgPSBzdHlsZWQoXCJkaXZcIikoe1xuICBkaXNwbGF5OiBcImZsZXhcIixcbn0pO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkU2luZ2xlQ2FsZW5kYXIgPSBzdHlsZWQoKHByb3BzOiBIdlNpbmdsZUNhbGVuZGFyUHJvcHMpID0+IChcbiAgPEh2U2luZ2xlQ2FsZW5kYXIgey4uLnByb3BzfSAvPlxuKSkoe1xuICBcIiY6aG92ZXJcIjoge1xuICAgIFtgJiB+IC4ke2NhbGVuZGFyQ2xhc3Nlcy5zaW5nbGVDYWxlbmRhcn1gXToge1xuICAgICAgLy8gdGFyZ2V0IHRoZSBuZXh0IGNhbGVuZGFyIHdoZW4gdGhlIGZvcm1lciBpcyBob3ZlcmVkXG4gICAgICBcIiYgPiBkaXZcIjoge1xuICAgICAgICBcIiYgPiBkaXY6bnRoLWNoaWxkKDMpXCI6IHtcbiAgICAgICAgICBcIiYgPiBkaXZcIjoge1xuICAgICAgICAgICAgXCImID4gZGl2W2RhdGEtY2FsZW5kYXItY2VsbD0nY2FsZW5kYXJDZWxsJ11cIjoge1xuICAgICAgICAgICAgICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmNvbG9ycy5hdG1vMSxcbiAgICAgICAgICAgIH0sXG4gICAgICAgICAgfSxcbiAgICAgICAgfSxcbiAgICAgIH0sXG4gICAgfSxcbiAgfSxcbn0pO1xuIl19 */",
-  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
-});
-/* @__PURE__ */ _styled__default.default((props) => /* @__PURE__ */ jsxRuntime.jsx(SingleCalendar.HvSingleCalendar, {
-  ...props
-}), process.env.NODE_ENV === "production" ? {
-  target: "e6gej3i0"
-} : {
-  target: "e6gej3i0",
-  label: "StyledSingleCalendar"
-})({
-  "&:hover": {
-    [`& ~ .${calendarClasses.default.singleCalendar}`]: {
-      // target the next calendar when the former is hovered
-      "& > div": {
-        "& > div:nth-child(3)": {
-          "& > div": {
-            "& > div[data-calendar-cell='calendarCell']": {
-              backgroundColor: uikitStyles.theme.colors.atmo1
+const {
+  staticClasses,
+  useClasses
+} = classes.createClasses("HvCalendar", {
+  root: {
+    display: "flex",
+    justifyContent: "center"
+  },
+  rangeCalendarContainer: {
+    display: "flex"
+  },
+  singleCalendar: {
+    "&:hover": {
+      "& ~ $singleCalendar": {
+        // target the next calendar when the former is hovered
+        "& > div": {
+          "& > div:nth-child(3)": {
+            "& > div": {
+              "& > div[data-calendar-cell='calendarCell']": {
+                backgroundColor: uikitStyles.theme.colors.atmo1
+              }
             }
           }
         }
       }
     }
-  }
-}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvQ2FsZW5kYXIvQ2FsZW5kYXIuc3R5bGVzLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFjb0MiLCJmaWxlIjoiL2hvbWUvcnVubmVyL3dvcmsvaHYtdWlraXQtcmVhY3QvaHYtdWlraXQtcmVhY3QvcGFja2FnZXMvY29yZS9zcmMvY29tcG9uZW50cy9DYWxlbmRhci9DYWxlbmRhci5zdHlsZXMudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5pbXBvcnQgeyB0aGVtZSB9IGZyb20gXCJAaGl0YWNoaXZhbnRhcmEvdWlraXQtc3R5bGVzXCI7XG5pbXBvcnQgY2FsZW5kYXJDbGFzc2VzIGZyb20gXCIuL2NhbGVuZGFyQ2xhc3Nlc1wiO1xuaW1wb3J0IHsgSHZTaW5nbGVDYWxlbmRhciwgSHZTaW5nbGVDYWxlbmRhclByb3BzIH0gZnJvbSBcIi4vU2luZ2xlQ2FsZW5kYXJcIjtcblxuZXhwb3J0IGNvbnN0IFN0eWxlZFJvb3QgPSBzdHlsZWQoXCJkaXZcIikoe1xuICBkaXNwbGF5OiBcImZsZXhcIixcbiAganVzdGlmeUNvbnRlbnQ6IFwiY2VudGVyXCIsXG59KTtcblxuZXhwb3J0IGNvbnN0IFN0eWxlZFJhbmdlQ2FsZW5kYXJDb250YWluZXIgPSBzdHlsZWQoXCJkaXZcIikoe1xuICBkaXNwbGF5OiBcImZsZXhcIixcbn0pO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkU2luZ2xlQ2FsZW5kYXIgPSBzdHlsZWQoKHByb3BzOiBIdlNpbmdsZUNhbGVuZGFyUHJvcHMpID0+IChcbiAgPEh2U2luZ2xlQ2FsZW5kYXIgey4uLnByb3BzfSAvPlxuKSkoe1xuICBcIiY6aG92ZXJcIjoge1xuICAgIFtgJiB+IC4ke2NhbGVuZGFyQ2xhc3Nlcy5zaW5nbGVDYWxlbmRhcn1gXToge1xuICAgICAgLy8gdGFyZ2V0IHRoZSBuZXh0IGNhbGVuZGFyIHdoZW4gdGhlIGZvcm1lciBpcyBob3ZlcmVkXG4gICAgICBcIiYgPiBkaXZcIjoge1xuICAgICAgICBcIiYgPiBkaXY6bnRoLWNoaWxkKDMpXCI6IHtcbiAgICAgICAgICBcIiYgPiBkaXZcIjoge1xuICAgICAgICAgICAgXCImID4gZGl2W2RhdGEtY2FsZW5kYXItY2VsbD0nY2FsZW5kYXJDZWxsJ11cIjoge1xuICAgICAgICAgICAgICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmNvbG9ycy5hdG1vMSxcbiAgICAgICAgICAgIH0sXG4gICAgICAgICAgfSxcbiAgICAgICAgfSxcbiAgICAgIH0sXG4gICAgfSxcbiAgfSxcbn0pO1xuIl19 */");
-exports.StyledRangeCalendarContainer = StyledRangeCalendarContainer;
-exports.StyledRoot = StyledRoot;
+  },
+  focusSelection: {},
+  calendarMonthlyCell: {},
+  calendarMonthlyCellSelected: {}
+});
+exports.staticClasses = staticClasses;
+exports.useClasses = useClasses;
 //# sourceMappingURL=Calendar.styles.cjs.map

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 styled from \"@emotion/styled\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport calendarClasses from \"./calendarClasses\";\nimport { HvSingleCalendar, HvSingleCalendarProps } from \"./SingleCalendar\";\n\nexport const StyledRoot = styled(\"div\")({\n  display: \"flex\",\n  justifyContent: \"center\",\n});\n\nexport const StyledRangeCalendarContainer = styled(\"div\")({\n  display: \"flex\",\n});\n\nexport const StyledSingleCalendar = styled((props: HvSingleCalendarProps) => (\n  <HvSingleCalendar {...props} />\n))({\n  \"&:hover\": {\n    [`& ~ .${calendarClasses.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"],"names":["StyledRoot","_styled","process","env","NODE_ENV","target","label","name","styles","map","toString","_EMOTION_STRINGIFIED_CSS_ERROR__","StyledRangeCalendarContainer","props","HvSingleCalendar","calendarClasses","singleCalendar","backgroundColor","theme","colors","atmo1"],"mappings":";;;;;;;;;;;;AAKO,MAAMA,aAAoBC,iCAAA,QAAA,OAAKC,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAC,OAAA;AAAA,CAAA,EAACJ,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAG,MAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAD,MAAA;AAAA,EAAAC,QAAA;AAAA,EAAAC,KAAA;AAAA,EAAAC,UAAAC;AAAA,CAGtC;AAEM,MAAMC,+BAAsCX,iCAAA,QAAA,OAAKC,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAC,OAAA;AAAA,CAAA,EAACJ,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAG,MAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAD,MAAA;AAAA,EAAAC,QAAA;AAAA,EAAAC,KAAA;AAAA,EAAAC,UAAAC;AAAA,CAExD;AAEmCV,iCAAAA,QAAO,CAACY,yCACzCC,iCAAgB;AAAA,EAAA,GAAKD;AAAK,CAAG,GAC/BX,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAC,OAAA;AAAA,CAAA,EAAE;AAAA,EACD,WAAW;AAAA,IACT,CAAE,QAAOS,wBAAgBC,gBAAgB,GAAG;AAAA;AAAA,MAE1C,WAAW;AAAA,QACT,wBAAwB;AAAA,UACtB,WAAW;AAAA,YACT,8CAA8C;AAAA,cAC5CC,iBAAiBC,YAAAA,MAAMC,OAAOC;AAAAA,YAChC;AAAA,UACF;AAAA,QACF;AAAA,MACF;AAAA,IACF;AAAA,EACF;AACF,GAAClB,QAAAC,IAAAC,aAAC,eAAA,KAAA,ysDAAA;;;"}
+{"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;;;"}

package/dist/cjs/components/Calendar/CalendarHeader/CalendarHeader.cjs

@@ -6,17 +6,16 @@ const dayjs = require("dayjs");
 const localeData = require("dayjs/plugin/localeData");
 const localizedFormat = require("dayjs/plugin/localizedFormat");
 const customParseFormat = require("dayjs/plugin/customParseFormat");
-const clsx = require("clsx");
 const isNil = require("lodash/isNil");
 const keyboardUtils = require("../../../utils/keyboardUtils.cjs");
 const setId = require("../../../utils/setId.cjs");
 const utils = require("../utils.cjs");
-const calendarHeaderClasses = require("./calendarHeaderClasses.cjs");
 const CalendarHeader_styles = require("./CalendarHeader.styles.cjs");
 const jsxRuntime = require("@emotion/react/jsx-runtime");
 const FormElementValueContext = require("../../Forms/FormElement/context/FormElementValueContext.cjs");
 const FormElementContext = require("../../Forms/FormElement/context/FormElementContext.cjs");
 const FormElementDescriptorsContext = require("../../Forms/FormElement/context/FormElementDescriptorsContext.cjs");
+const Typography = require("../../Typography/Typography.cjs");
 const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
 const dayjs__default = /* @__PURE__ */ _interopDefault(dayjs);
 const localeData__default = /* @__PURE__ */ _interopDefault(localeData);
@@ -30,7 +29,7 @@ const HvCalendarHeader = ({
   id,
   value,
   locale = "en-US",
-  classes,
+  classes: classesProp,
   onChange,
   showEndDate,
   showDayOfWeek = false,
@@ -39,6 +38,10 @@ const HvCalendarHeader = ({
   ...others
 }) => {
   var _a;
+  const {
+    classes,
+    cx
+  } = CalendarHeader_styles.useClasses(classesProp);
   const {
     elementId
   } = React.useContext(FormElementContext.HvFormElementContext);
@@ -117,20 +120,22 @@ const HvCalendarHeader = ({
     setEditedValue(event.target.value);
   };
   return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
-    children: [/* @__PURE__ */ jsxRuntime.jsxs(CalendarHeader_styles.StyledRoot, {
+    children: [/* @__PURE__ */ jsxRuntime.jsxs("div", {
       id: localId,
-      className: clsx.clsx(calendarHeaderClasses.default.root, classes == null ? void 0 : classes.root, !isValidValue && inputValue !== "" && clsx.clsx(calendarHeaderClasses.default.invalid, classes == null ? void 0 : classes.invalid)),
-      children: [showDayOfWeek && /* @__PURE__ */ jsxRuntime.jsx(CalendarHeader_styles.StyledHeaderDayOfWeek, {
-        className: clsx.clsx(calendarHeaderClasses.default.headerDayOfWeek, classes == null ? void 0 : classes.headerDayOfWeek),
+      className: cx(classes.root, {
+        [classes.invalid]: !isValidValue && inputValue !== ""
+      }),
+      children: [showDayOfWeek && /* @__PURE__ */ jsxRuntime.jsx(Typography.HvTypography, {
+        className: classes.headerDayOfWeek,
         children: weekdayDisplay || " "
       }), /* @__PURE__ */ jsxRuntime.jsx("div", {
-        className: clsx.clsx(calendarHeaderClasses.default.headerDate, classes == null ? void 0 : classes.headerDate),
-        children: /* @__PURE__ */ jsxRuntime.jsx(CalendarHeader_styles.StyledInput, {
+        className: classes.headerDate,
+        children: /* @__PURE__ */ jsxRuntime.jsx("input", {
           type: "text",
           id: setId.setId(localId, "header-input"),
           placeholder: localeFormat,
           value: inputValue,
-          className: clsx.clsx(calendarHeaderClasses.default.input, classes == null ? void 0 : classes.input),
+          className: classes.input,
           onBlur: onBlurHandler,
           onFocus: onFocusHandler,
           onChange: onChangeHandler,
@@ -139,17 +144,17 @@ const HvCalendarHeader = ({
           ...others
         })
       })]
-    }), !isValidValue && inputValue !== "" && /* @__PURE__ */ jsxRuntime.jsx(CalendarHeader_styles.StyledInputBorderContainer, {
+    }), !isValidValue && inputValue !== "" && /* @__PURE__ */ jsxRuntime.jsx("div", {
       role: "presentation",
-      className: clsx.clsx(calendarHeaderClasses.default.inputBorderContainer, classes == null ? void 0 : classes.inputBorderContainer)
+      className: classes.inputBorderContainer
     }), /* @__PURE__ */ jsxRuntime.jsx("div", {
       style: {
         height: 32
       },
-      children: !isValidValue && inputValue !== "" && /* @__PURE__ */ jsxRuntime.jsxs(CalendarHeader_styles.StyledTypography, {
+      children: !isValidValue && inputValue !== "" && /* @__PURE__ */ jsxRuntime.jsxs(Typography.HvTypography, {
         component: "span",
         variant: "body",
-        className: clsx.clsx(calendarHeaderClasses.default.invalidMessageStyling, classes == null ? void 0 : classes.invalidMessageStyling),
+        className: classes == null ? void 0 : classes.invalidMessageStyling,
         children: [/* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.Info, {
           color: "brand",
           iconSize: "S"
@@ -159,5 +164,6 @@ const HvCalendarHeader = ({
   });
 };
 HvCalendarHeader.formElementType = "HvCalendarHeader";
+exports.calendarHeaderClasses = CalendarHeader_styles.staticClasses;
 exports.HvCalendarHeader = HvCalendarHeader;
 //# sourceMappingURL=CalendarHeader.cjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"CalendarHeader.cjs","sources":["../../../../../src/components/Calendar/CalendarHeader/CalendarHeader.tsx"],"sourcesContent":["import { useState, useEffect, useContext } from \"react\";\n\nimport { Info } from \"@hitachivantara/uikit-react-icons\";\n\nimport dayjs from \"dayjs\";\nimport localeData from \"dayjs/plugin/localeData\";\nimport localizedFormat from \"dayjs/plugin/localizedFormat\";\nimport customParseFormat from \"dayjs/plugin/customParseFormat\";\n\nimport { clsx } from \"clsx\";\n\nimport isNil from \"lodash/isNil\";\n\nimport {\n  HvFormElementContext,\n  HvFormElementValueContext,\n  HvFormElementDescriptorsContext,\n} from \"@core/components/Forms\";\nimport { isKey } from \"@core/utils/keyboardUtils\";\nimport { setId } from \"@core/utils/setId\";\n\nimport { isRange, isSameDay, formatToLocale, isDate } from \"../utils\";\nimport { DateRangeProp } from \"../types\";\nimport calendarHeaderClasses, {\n  HvCalendarHeaderClasses,\n} from \"./calendarHeaderClasses\";\nimport {\n  StyledHeaderDayOfWeek,\n  StyledInput,\n  StyledInputBorderContainer,\n  StyledRoot,\n  StyledTypography,\n} from \"./CalendarHeader.styles\";\n\ndayjs.extend(localeData);\ndayjs.extend(localizedFormat);\ndayjs.extend(customParseFormat);\n\nexport const HvCalendarHeader = ({\n  id,\n  value,\n  locale = \"en-US\",\n  classes,\n  onChange,\n  showEndDate,\n  showDayOfWeek = false,\n  onFocus,\n  invalidDateLabel = \"Invalid Date\",\n  ...others\n}: HvCalendarHeaderProps) => {\n  const { elementId } = useContext(HvFormElementContext);\n  const elementValue = useContext(HvFormElementValueContext);\n  const { label } = useContext(HvFormElementDescriptorsContext);\n\n  let localValue: string | Date | DateRangeProp | undefined =\n    value ?? elementValue ?? \"\";\n  if (isRange(localValue)) {\n    localValue = showEndDate ? localValue.endDate : localValue.startDate;\n  }\n  const [dateValue, setDateValue] = useState<\n    string | Date | DateRangeProp | undefined\n  >(localValue);\n  const [editedValue, setEditedValue] = useState<string | null>(null);\n  const [displayValue, setDisplayValue] = useState(\"\");\n  const [weekdayDisplay, setWeekdayDisplay] = useState(\"\");\n\n  const localId = id ?? setId(elementId, \"calendarHeader\");\n\n  const inputValue = editedValue ?? displayValue;\n  const localeFormat = dayjs().locale(locale).localeData().longDateFormat(\"L\");\n\n  const [isValidValue, setIsValidValue] = useState(\n    inputValue.length === 0 || (!!inputValue && dayjs(localValue).isValid())\n  );\n\n  const validateInput = (incomingValid) =>\n    incomingValid === undefined || dayjs(incomingValid).isValid();\n  useEffect(() => {\n    const valid = validateInput(localValue);\n    setIsValidValue(valid);\n    if (valid) {\n      if (!localValue) {\n        setDisplayValue(\"\");\n        setEditedValue(null);\n        setWeekdayDisplay(\"\");\n        return;\n      }\n      const weekday = new Intl.DateTimeFormat(locale, {\n        weekday: \"short\",\n      }).format(isDate(localValue) ? localValue : 0);\n      setDisplayValue(formatToLocale(localValue, locale));\n      setEditedValue(null);\n      setWeekdayDisplay(weekday);\n    }\n  }, [localValue, locale]);\n\n  const handleNewDate = (event, date) => {\n    // attempt to format in locale data, or fallback to default\n    const localeParsedDate = dayjs(date, localeFormat);\n\n    const isValidInput = localeParsedDate.isValid();\n    const dateParsed = isValidInput\n      ? localeParsedDate.toDate()\n      : dayjs(date).toDate();\n    // prevent extra updates\n    if (!isSameDay(dateParsed, dateValue)) {\n      setDateValue(dateParsed);\n      onChange?.(event, dateParsed);\n    }\n\n    setIsValidValue(isValidInput);\n    if (isValidInput) {\n      setEditedValue(null);\n    }\n  };\n\n  const onBlurHandler = (event) => {\n    if (isNil(editedValue)) return;\n    if (editedValue === \"\") {\n      setIsValidValue(true);\n      setEditedValue(null);\n      return;\n    }\n    handleNewDate(event, editedValue);\n  };\n\n  const keyDownHandler = (event) => {\n    if (!isKey(event, \"Enter\") || isNil(editedValue) || editedValue === \"\")\n      return;\n    event.preventDefault();\n\n    handleNewDate(event, editedValue);\n  };\n\n  const onFocusHandler = (event) => {\n    if (!localValue) return;\n    const formattedDate =\n      isValidValue && isDate(localValue)\n        ? dayjs(localValue).locale(locale).format(\"L\")\n        : editedValue;\n    setEditedValue(formattedDate);\n    onFocus?.(event, formattedDate);\n  };\n\n  const onChangeHandler = (event) => {\n    setEditedValue(event.target.value);\n  };\n  return (\n    <>\n      <StyledRoot\n        id={localId}\n        className={clsx(\n          calendarHeaderClasses.root,\n          classes?.root,\n          !isValidValue &&\n            inputValue !== \"\" &&\n            clsx(calendarHeaderClasses.invalid, classes?.invalid)\n        )}\n      >\n        {showDayOfWeek && (\n          <StyledHeaderDayOfWeek\n            className={clsx(\n              calendarHeaderClasses.headerDayOfWeek,\n              classes?.headerDayOfWeek\n            )}\n          >\n            {weekdayDisplay || \"\\u00A0\"}\n          </StyledHeaderDayOfWeek>\n        )}\n\n        <div\n          className={clsx(\n            calendarHeaderClasses.headerDate,\n            classes?.headerDate\n          )}\n        >\n          <StyledInput\n            type=\"text\"\n            id={setId(localId, \"header-input\")}\n            placeholder={localeFormat}\n            value={inputValue}\n            className={clsx(calendarHeaderClasses.input, classes?.input)}\n            onBlur={onBlurHandler}\n            onFocus={onFocusHandler}\n            onChange={onChangeHandler}\n            onKeyDown={keyDownHandler}\n            aria-labelledby={label?.[0]?.id}\n            {...others}\n          />\n        </div>\n      </StyledRoot>\n      {!isValidValue && inputValue !== \"\" && (\n        <StyledInputBorderContainer\n          role=\"presentation\"\n          className={clsx(\n            calendarHeaderClasses.inputBorderContainer,\n            classes?.inputBorderContainer\n          )}\n        />\n      )}\n      <div style={{ height: 32 }}>\n        {!isValidValue && inputValue !== \"\" && (\n          <StyledTypography\n            component=\"span\"\n            variant=\"body\"\n            className={clsx(\n              calendarHeaderClasses.invalidMessageStyling,\n              classes?.invalidMessageStyling\n            )}\n          >\n            <Info color=\"brand\" iconSize=\"S\" />\n            {invalidDateLabel}\n          </StyledTypography>\n        )}\n      </div>\n    </>\n  );\n};\n\n// TODO: refactor this out\nHvCalendarHeader.formElementType = \"HvCalendarHeader\";\n\nexport interface HvCalendarHeaderProps {\n  /**\n   * A Jss Object used to override or extend the component styles.\n   */\n  classes?: HvCalendarHeaderClasses;\n  /**\n   * Identifier.\n   */\n  id?: string;\n  /**\n   * The text to be shown on the main part of the header.\n   */\n  value?: string | Date | DateRangeProp;\n  /**\n   * Locale to be used by the calendar.\n   */\n  locale?: string;\n  /**\n   * Callback to define the input date.\n   */\n  onChange?: (\n    event:\n      | React.ChangeEvent<HTMLTextAreaElement | HTMLInputElement>\n      | undefined,\n    value: Date | DateRangeProp\n  ) => void;\n  /**\n   * Callback to handle input onFocus.\n   */\n  onFocus?: (\n    event: React.FocusEventHandler<any>,\n    formattedDate: string | null\n  ) => void;\n  /**\n   * Indicates if header should display end date in a date range.\n   */\n  showEndDate?: boolean;\n  /**\n   * Indicates if header should display the day of week.\n   */\n  showDayOfWeek?: boolean;\n  /**\n   * Label shown when date is invalid.\n   */\n  invalidDateLabel?: string;\n}\n"],"names":["dayjs","extend","localeData","localizedFormat","customParseFormat","HvCalendarHeader","id","value","locale","classes","onChange","showEndDate","showDayOfWeek","onFocus","invalidDateLabel","others","elementId","useContext","HvFormElementContext","elementValue","HvFormElementValueContext","label","HvFormElementDescriptorsContext","localValue","isRange","endDate","startDate","dateValue","setDateValue","useState","editedValue","setEditedValue","displayValue","setDisplayValue","weekdayDisplay","setWeekdayDisplay","localId","setId","inputValue","localeFormat","longDateFormat","isValidValue","setIsValidValue","length","isValid","validateInput","incomingValid","undefined","useEffect","valid","weekday","Intl","DateTimeFormat","format","isDate","formatToLocale","handleNewDate","event","date","localeParsedDate","isValidInput","dateParsed","toDate","isSameDay","onBlurHandler","isNil","keyDownHandler","isKey","preventDefault","onFocusHandler","formattedDate","onChangeHandler","target","_Fragment","children","_jsxs","StyledRoot","className","clsx","calendarHeaderClasses","root","invalid","_jsx","StyledHeaderDayOfWeek","headerDayOfWeek","headerDate","StyledInput","type","placeholder","input","onBlur","onKeyDown","StyledInputBorderContainer","role","inputBorderContainer","style","height","StyledTypography","component","variant","invalidMessageStyling","Info","color","iconSize","formElementType"],"mappings":"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"}
+{"version":3,"file":"CalendarHeader.cjs","sources":["../../../../../src/components/Calendar/CalendarHeader/CalendarHeader.tsx"],"sourcesContent":["import { useState, useEffect, useContext } from \"react\";\n\nimport { Info } from \"@hitachivantara/uikit-react-icons\";\n\nimport dayjs from \"dayjs\";\nimport localeData from \"dayjs/plugin/localeData\";\nimport localizedFormat from \"dayjs/plugin/localizedFormat\";\nimport customParseFormat from \"dayjs/plugin/customParseFormat\";\n\nimport isNil from \"lodash/isNil\";\n\nimport {\n  HvFormElementContext,\n  HvFormElementValueContext,\n  HvFormElementDescriptorsContext,\n} from \"@core/components/Forms\";\nimport { isKey } from \"@core/utils/keyboardUtils\";\nimport { setId } from \"@core/utils/setId\";\n\nimport { HvTypography } from \"@core/components/Typography\";\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { isRange, isSameDay, formatToLocale, isDate } from \"../utils\";\nimport { DateRangeProp } from \"../types\";\nimport { staticClasses, useClasses } from \"./CalendarHeader.styles\";\n\nexport { staticClasses as calendarHeaderClasses };\n\nexport type HvCalendarHeaderClasses = ExtractNames<typeof useClasses>;\n\ndayjs.extend(localeData);\ndayjs.extend(localizedFormat);\ndayjs.extend(customParseFormat);\n\nexport const HvCalendarHeader = ({\n  id,\n  value,\n  locale = \"en-US\",\n  classes: classesProp,\n  onChange,\n  showEndDate,\n  showDayOfWeek = false,\n  onFocus,\n  invalidDateLabel = \"Invalid Date\",\n  ...others\n}: HvCalendarHeaderProps) => {\n  const { classes, cx } = useClasses(classesProp);\n\n  const { elementId } = useContext(HvFormElementContext);\n  const elementValue = useContext(HvFormElementValueContext);\n  const { label } = useContext(HvFormElementDescriptorsContext);\n\n  let localValue: string | Date | DateRangeProp | undefined =\n    value ?? elementValue ?? \"\";\n  if (isRange(localValue)) {\n    localValue = showEndDate ? localValue.endDate : localValue.startDate;\n  }\n  const [dateValue, setDateValue] = useState<\n    string | Date | DateRangeProp | undefined\n  >(localValue);\n  const [editedValue, setEditedValue] = useState<string | null>(null);\n  const [displayValue, setDisplayValue] = useState(\"\");\n  const [weekdayDisplay, setWeekdayDisplay] = useState(\"\");\n\n  const localId = id ?? setId(elementId, \"calendarHeader\");\n\n  const inputValue = editedValue ?? displayValue;\n  const localeFormat = dayjs().locale(locale).localeData().longDateFormat(\"L\");\n\n  const [isValidValue, setIsValidValue] = useState(\n    inputValue.length === 0 || (!!inputValue && dayjs(localValue).isValid())\n  );\n\n  const validateInput = (incomingValid) =>\n    incomingValid === undefined || dayjs(incomingValid).isValid();\n  useEffect(() => {\n    const valid = validateInput(localValue);\n    setIsValidValue(valid);\n    if (valid) {\n      if (!localValue) {\n        setDisplayValue(\"\");\n        setEditedValue(null);\n        setWeekdayDisplay(\"\");\n        return;\n      }\n      const weekday = new Intl.DateTimeFormat(locale, {\n        weekday: \"short\",\n      }).format(isDate(localValue) ? localValue : 0);\n      setDisplayValue(formatToLocale(localValue, locale));\n      setEditedValue(null);\n      setWeekdayDisplay(weekday);\n    }\n  }, [localValue, locale]);\n\n  const handleNewDate = (event, date) => {\n    // attempt to format in locale data, or fallback to default\n    const localeParsedDate = dayjs(date, localeFormat);\n\n    const isValidInput = localeParsedDate.isValid();\n    const dateParsed = isValidInput\n      ? localeParsedDate.toDate()\n      : dayjs(date).toDate();\n    // prevent extra updates\n    if (!isSameDay(dateParsed, dateValue)) {\n      setDateValue(dateParsed);\n      onChange?.(event, dateParsed);\n    }\n\n    setIsValidValue(isValidInput);\n    if (isValidInput) {\n      setEditedValue(null);\n    }\n  };\n\n  const onBlurHandler = (event) => {\n    if (isNil(editedValue)) return;\n    if (editedValue === \"\") {\n      setIsValidValue(true);\n      setEditedValue(null);\n      return;\n    }\n    handleNewDate(event, editedValue);\n  };\n\n  const keyDownHandler = (event) => {\n    if (!isKey(event, \"Enter\") || isNil(editedValue) || editedValue === \"\")\n      return;\n    event.preventDefault();\n\n    handleNewDate(event, editedValue);\n  };\n\n  const onFocusHandler = (event) => {\n    if (!localValue) return;\n    const formattedDate =\n      isValidValue && isDate(localValue)\n        ? dayjs(localValue).locale(locale).format(\"L\")\n        : editedValue;\n    setEditedValue(formattedDate);\n    onFocus?.(event, formattedDate);\n  };\n\n  const onChangeHandler = (event) => {\n    setEditedValue(event.target.value);\n  };\n  return (\n    <>\n      <div\n        id={localId}\n        className={cx(classes.root, {\n          [classes.invalid]: !isValidValue && inputValue !== \"\",\n        })}\n      >\n        {showDayOfWeek && (\n          <HvTypography className={classes.headerDayOfWeek}>\n            {weekdayDisplay || \"\\u00A0\"}\n          </HvTypography>\n        )}\n\n        <div className={classes.headerDate}>\n          <input\n            type=\"text\"\n            id={setId(localId, \"header-input\")}\n            placeholder={localeFormat}\n            value={inputValue}\n            className={classes.input}\n            onBlur={onBlurHandler}\n            onFocus={onFocusHandler}\n            onChange={onChangeHandler}\n            onKeyDown={keyDownHandler}\n            aria-labelledby={label?.[0]?.id}\n            {...others}\n          />\n        </div>\n      </div>\n      {!isValidValue && inputValue !== \"\" && (\n        <div role=\"presentation\" className={classes.inputBorderContainer} />\n      )}\n      <div style={{ height: 32 }}>\n        {!isValidValue && inputValue !== \"\" && (\n          <HvTypography\n            component=\"span\"\n            variant=\"body\"\n            className={classes?.invalidMessageStyling}\n          >\n            <Info color=\"brand\" iconSize=\"S\" />\n            {invalidDateLabel}\n          </HvTypography>\n        )}\n      </div>\n    </>\n  );\n};\n\n// TODO: refactor this out\nHvCalendarHeader.formElementType = \"HvCalendarHeader\";\n\nexport interface HvCalendarHeaderProps {\n  /**\n   * A Jss Object used to override or extend the component styles.\n   */\n  classes?: HvCalendarHeaderClasses;\n  /**\n   * Identifier.\n   */\n  id?: string;\n  /**\n   * The text to be shown on the main part of the header.\n   */\n  value?: string | Date | DateRangeProp;\n  /**\n   * Locale to be used by the calendar.\n   */\n  locale?: string;\n  /**\n   * Callback to define the input date.\n   */\n  onChange?: (\n    event:\n      | React.ChangeEvent<HTMLTextAreaElement | HTMLInputElement>\n      | undefined,\n    value: Date | DateRangeProp\n  ) => void;\n  /**\n   * Callback to handle input onFocus.\n   */\n  onFocus?: (\n    event: React.FocusEventHandler<any>,\n    formattedDate: string | null\n  ) => void;\n  /**\n   * Indicates if header should display end date in a date range.\n   */\n  showEndDate?: boolean;\n  /**\n   * Indicates if header should display the day of week.\n   */\n  showDayOfWeek?: boolean;\n  /**\n   * Label shown when date is invalid.\n   */\n  invalidDateLabel?: string;\n}\n"],"names":["dayjs","extend","localeData","localizedFormat","customParseFormat","HvCalendarHeader","id","value","locale","classes","classesProp","onChange","showEndDate","showDayOfWeek","onFocus","invalidDateLabel","others","cx","useClasses","elementId","useContext","HvFormElementContext","elementValue","HvFormElementValueContext","label","HvFormElementDescriptorsContext","localValue","isRange","endDate","startDate","dateValue","setDateValue","useState","editedValue","setEditedValue","displayValue","setDisplayValue","weekdayDisplay","setWeekdayDisplay","localId","setId","inputValue","localeFormat","longDateFormat","isValidValue","setIsValidValue","length","isValid","validateInput","incomingValid","undefined","useEffect","valid","weekday","Intl","DateTimeFormat","format","isDate","formatToLocale","handleNewDate","event","date","localeParsedDate","isValidInput","dateParsed","toDate","isSameDay","onBlurHandler","isNil","keyDownHandler","isKey","preventDefault","onFocusHandler","formattedDate","onChangeHandler","target","_Fragment","children","_jsxs","className","root","invalid","_jsx","HvTypography","headerDayOfWeek","headerDate","type","placeholder","input","onBlur","onKeyDown","role","inputBorderContainer","style","height","component","variant","invalidMessageStyling","Info","color","iconSize","formElementType"],"mappings":"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"}

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

@@ -1,89 +1,62 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const _styled = require("@emotion/styled/base");
-const uikitStyles = require("@hitachivantara/uikit-styles");
+const classes = require("../../../utils/classes.cjs");
 const focusUtils = require("../../../utils/focusUtils.cjs");
-const jsxRuntime = require("@emotion/react/jsx-runtime");
-const Typography = require("../../Typography/Typography.cjs");
-const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
-const _styled__default = /* @__PURE__ */ _interopDefault(_styled);
-const StyledRoot = /* @__PURE__ */ _styled__default.default("div", process.env.NODE_ENV === "production" ? {
-  target: "e1yjj6ap4"
-} : {
-  target: "e1yjj6ap4",
-  label: "StyledRoot"
-})({
-  marginTop: uikitStyles.theme.spacing("xs"),
-  backgroundColor: uikitStyles.theme.colors.atmo1,
-  borderBottom: uikitStyles.theme.calendar.headerInputBorderBottom,
-  borderTop: uikitStyles.theme.calendar.headerInputBorderTop,
-  borderLeft: uikitStyles.theme.calendar.headerInputBorderLeft,
-  borderRight: uikitStyles.theme.calendar.headerInputBorderRight,
-  borderRadius: uikitStyles.theme.calendar.borderRadius,
-  "&:hover, &:focus": {
-    borderBottom: `1px solid ${uikitStyles.theme.colors.secondary}`
-  }
-}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvQ2FsZW5kYXIvQ2FsZW5kYXJIZWFkZXIvQ2FsZW5kYXJIZWFkZXIuc3R5bGVzLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFPMEIiLCJmaWxlIjoiL2hvbWUvcnVubmVyL3dvcmsvaHYtdWlraXQtcmVhY3QvaHYtdWlraXQtcmVhY3QvcGFja2FnZXMvY29yZS9zcmMvY29tcG9uZW50cy9DYWxlbmRhci9DYWxlbmRhckhlYWRlci9DYWxlbmRhckhlYWRlci5zdHlsZXMudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5cbmltcG9ydCB7IHRoZW1lIH0gZnJvbSBcIkBoaXRhY2hpdmFudGFyYS91aWtpdC1zdHlsZXNcIjtcblxuaW1wb3J0IHsgSHZUeXBvZ3JhcGh5IH0gZnJvbSBcIkBjb3JlL2NvbXBvbmVudHMvVHlwb2dyYXBoeVwiO1xuaW1wb3J0IHsgb3V0bGluZVN0eWxlcyB9IGZyb20gXCJAY29yZS91dGlscy9mb2N1c1V0aWxzXCI7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRSb290ID0gc3R5bGVkKFwiZGl2XCIpKHtcbiAgbWFyZ2luVG9wOiB0aGVtZS5zcGFjaW5nKFwieHNcIiksXG4gIGJhY2tncm91bmRDb2xvcjogdGhlbWUuY29sb3JzLmF0bW8xLFxuICBib3JkZXJCb3R0b206IHRoZW1lLmNhbGVuZGFyLmhlYWRlcklucHV0Qm9yZGVyQm90dG9tLFxuICBib3JkZXJUb3A6IHRoZW1lLmNhbGVuZGFyLmhlYWRlcklucHV0Qm9yZGVyVG9wLFxuICBib3JkZXJMZWZ0OiB0aGVtZS5jYWxlbmRhci5oZWFkZXJJbnB1dEJvcmRlckxlZnQsXG4gIGJvcmRlclJpZ2h0OiB0aGVtZS5jYWxlbmRhci5oZWFkZXJJbnB1dEJvcmRlclJpZ2h0LFxuICBib3JkZXJSYWRpdXM6IHRoZW1lLmNhbGVuZGFyLmJvcmRlclJhZGl1cyxcbiAgXCImOmhvdmVyLCAmOmZvY3VzXCI6IHtcbiAgICBib3JkZXJCb3R0b206IGAxcHggc29saWQgJHt0aGVtZS5jb2xvcnMuc2Vjb25kYXJ5fWAsXG4gIH0sXG59KTtcblxuZXhwb3J0IGNvbnN0IFN0eWxlZElucHV0Qm9yZGVyQ29udGFpbmVyID0gc3R5bGVkKFwiZGl2XCIpKHtcbiAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS5jb2xvcnMubmVnYXRpdmUsXG4gIGhlaWdodDogMSxcbiAgbWFyZ2luVG9wOiAtMSxcbn0pO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkSW5wdXQgPSBzdHlsZWQoKHByb3BzKSA9PiA8aW5wdXQgey4uLnByb3BzfSAvPikoe1xuICBib3JkZXI6IFwibm9uZVwiLFxuICBiYWNrZ3JvdW5kQ29sb3I6IFwidHJhbnNwYXJlbnRcIixcbiAgcGFkZGluZzogYDVweCAke3RoZW1lLnNwYWNpbmcoXCJ4c1wiKX1gLFxuICBmb250RmFtaWx5OiB0aGVtZS5mb250RmFtaWx5LmJvZHksXG5cbiAgY29sb3I6IHRoZW1lLmNhbGVuZGFyLmhlYWRlcklucHV0Rm9udENvbG9yLFxuICBmb250U2l6ZTogdGhlbWUuY2FsZW5kYXIuaGVhZGVySW5wdXRGb250U2l6ZSxcbiAgbGV0dGVyU3BhY2luZzogdGhlbWUuY2FsZW5kYXIuaGVhZGVySW5wdXRGb250TGV0dGVyU3BhY2luZyxcbiAgbGluZUhlaWdodDogdGhlbWUuY2FsZW5kYXIuaGVhZGVySW5wdXRGb250TGluZUhlaWdodCxcbiAgZm9udFdlaWdodDogdGhlbWUuY2FsZW5kYXIuaGVhZGVySW5wdXRGb250V2VpZ2h0LFxuICB3aWR0aDogXCIxMDAlXCIsXG4gIFwiJjo6cGxhY2Vob2xkZXJcIjoge1xuICAgIGNvbG9yOiB0aGVtZS5jb2xvcnMuc2Vjb25kYXJ5XzYwLFxuICB9LFxuICBcIiY6Zm9jdXNcIjoge1xuICAgIG91dGxpbmU6IFwibm9uZVwiLFxuICB9LFxuICBcIiY6Zm9jdXMtdmlzaWJsZVwiOiB7XG4gICAgLi4ub3V0bGluZVN0eWxlcyxcbiAgfSxcbn0pO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkSGVhZGVyRGF5T2ZXZWVrID0gc3R5bGVkKEh2VHlwb2dyYXBoeSkoe1xuICBjb2xvcjogdGhlbWUuY2FsZW5kYXIuaGVhZGVySW5wdXRGb250Q29sb3IsXG4gIHBhZGRpbmdMZWZ0OiB0aGVtZS5zcGFjaW5nKFwieHNcIiksXG59KTtcblxuZXhwb3J0IGNvbnN0IFN0eWxlZFR5cG9ncmFwaHkgPSBzdHlsZWQoSHZUeXBvZ3JhcGh5KSh7XG4gIGRpc3BsYXk6IFwiZmxleFwiLFxuICBhbGlnbkl0ZW1zOiBcImNlbnRlclwiLFxuICBjb2xvcjogdGhlbWUuY29sb3JzLm5lZ2F0aXZlLFxufSk7XG4iXX0= */");
-const StyledInputBorderContainer = /* @__PURE__ */ _styled__default.default("div", process.env.NODE_ENV === "production" ? {
-  target: "e1yjj6ap3"
-} : {
-  target: "e1yjj6ap3",
-  label: "StyledInputBorderContainer"
-})({
-  backgroundColor: uikitStyles.theme.colors.negative,
-  height: 1,
-  marginTop: -1
-}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvQ2FsZW5kYXIvQ2FsZW5kYXJIZWFkZXIvQ2FsZW5kYXJIZWFkZXIuc3R5bGVzLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFvQjBDIiwiZmlsZSI6Ii9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvQ2FsZW5kYXIvQ2FsZW5kYXJIZWFkZXIvQ2FsZW5kYXJIZWFkZXIuc3R5bGVzLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuXG5pbXBvcnQgeyB0aGVtZSB9IGZyb20gXCJAaGl0YWNoaXZhbnRhcmEvdWlraXQtc3R5bGVzXCI7XG5cbmltcG9ydCB7IEh2VHlwb2dyYXBoeSB9IGZyb20gXCJAY29yZS9jb21wb25lbnRzL1R5cG9ncmFwaHlcIjtcbmltcG9ydCB7IG91dGxpbmVTdHlsZXMgfSBmcm9tIFwiQGNvcmUvdXRpbHMvZm9jdXNVdGlsc1wiO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkUm9vdCA9IHN0eWxlZChcImRpdlwiKSh7XG4gIG1hcmdpblRvcDogdGhlbWUuc3BhY2luZyhcInhzXCIpLFxuICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmNvbG9ycy5hdG1vMSxcbiAgYm9yZGVyQm90dG9tOiB0aGVtZS5jYWxlbmRhci5oZWFkZXJJbnB1dEJvcmRlckJvdHRvbSxcbiAgYm9yZGVyVG9wOiB0aGVtZS5jYWxlbmRhci5oZWFkZXJJbnB1dEJvcmRlclRvcCxcbiAgYm9yZGVyTGVmdDogdGhlbWUuY2FsZW5kYXIuaGVhZGVySW5wdXRCb3JkZXJMZWZ0LFxuICBib3JkZXJSaWdodDogdGhlbWUuY2FsZW5kYXIuaGVhZGVySW5wdXRCb3JkZXJSaWdodCxcbiAgYm9yZGVyUmFkaXVzOiB0aGVtZS5jYWxlbmRhci5ib3JkZXJSYWRpdXMsXG4gIFwiJjpob3ZlciwgJjpmb2N1c1wiOiB7XG4gICAgYm9yZGVyQm90dG9tOiBgMXB4IHNvbGlkICR7dGhlbWUuY29sb3JzLnNlY29uZGFyeX1gLFxuICB9LFxufSk7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRJbnB1dEJvcmRlckNvbnRhaW5lciA9IHN0eWxlZChcImRpdlwiKSh7XG4gIGJhY2tncm91bmRDb2xvcjogdGhlbWUuY29sb3JzLm5lZ2F0aXZlLFxuICBoZWlnaHQ6IDEsXG4gIG1hcmdpblRvcDogLTEsXG59KTtcblxuZXhwb3J0IGNvbnN0IFN0eWxlZElucHV0ID0gc3R5bGVkKChwcm9wcykgPT4gPGlucHV0IHsuLi5wcm9wc30gLz4pKHtcbiAgYm9yZGVyOiBcIm5vbmVcIixcbiAgYmFja2dyb3VuZENvbG9yOiBcInRyYW5zcGFyZW50XCIsXG4gIHBhZGRpbmc6IGA1cHggJHt0aGVtZS5zcGFjaW5nKFwieHNcIil9YCxcbiAgZm9udEZhbWlseTogdGhlbWUuZm9udEZhbWlseS5ib2R5LFxuXG4gIGNvbG9yOiB0aGVtZS5jYWxlbmRhci5oZWFkZXJJbnB1dEZvbnRDb2xvcixcbiAgZm9udFNpemU6IHRoZW1lLmNhbGVuZGFyLmhlYWRlcklucHV0Rm9udFNpemUsXG4gIGxldHRlclNwYWNpbmc6IHRoZW1lLmNhbGVuZGFyLmhlYWRlcklucHV0Rm9udExldHRlclNwYWNpbmcsXG4gIGxpbmVIZWlnaHQ6IHRoZW1lLmNhbGVuZGFyLmhlYWRlcklucHV0Rm9udExpbmVIZWlnaHQsXG4gIGZvbnRXZWlnaHQ6IHRoZW1lLmNhbGVuZGFyLmhlYWRlcklucHV0Rm9udFdlaWdodCxcbiAgd2lkdGg6IFwiMTAwJVwiLFxuICBcIiY6OnBsYWNlaG9sZGVyXCI6IHtcbiAgICBjb2xvcjogdGhlbWUuY29sb3JzLnNlY29uZGFyeV82MCxcbiAgfSxcbiAgXCImOmZvY3VzXCI6IHtcbiAgICBvdXRsaW5lOiBcIm5vbmVcIixcbiAgfSxcbiAgXCImOmZvY3VzLXZpc2libGVcIjoge1xuICAgIC4uLm91dGxpbmVTdHlsZXMsXG4gIH0sXG59KTtcblxuZXhwb3J0IGNvbnN0IFN0eWxlZEhlYWRlckRheU9mV2VlayA9IHN0eWxlZChIdlR5cG9ncmFwaHkpKHtcbiAgY29sb3I6IHRoZW1lLmNhbGVuZGFyLmhlYWRlcklucHV0Rm9udENvbG9yLFxuICBwYWRkaW5nTGVmdDogdGhlbWUuc3BhY2luZyhcInhzXCIpLFxufSk7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRUeXBvZ3JhcGh5ID0gc3R5bGVkKEh2VHlwb2dyYXBoeSkoe1xuICBkaXNwbGF5OiBcImZsZXhcIixcbiAgYWxpZ25JdGVtczogXCJjZW50ZXJcIixcbiAgY29sb3I6IHRoZW1lLmNvbG9ycy5uZWdhdGl2ZSxcbn0pO1xuIl19 */");
-const StyledInput = /* @__PURE__ */ _styled__default.default((props) => /* @__PURE__ */ jsxRuntime.jsx("input", {
-  ...props
-}), process.env.NODE_ENV === "production" ? {
-  target: "e1yjj6ap2"
-} : {
-  target: "e1yjj6ap2",
-  label: "StyledInput"
-})({
-  border: "none",
-  backgroundColor: "transparent",
-  padding: `5px ${uikitStyles.theme.spacing("xs")}`,
-  fontFamily: uikitStyles.theme.fontFamily.body,
-  color: uikitStyles.theme.calendar.headerInputFontColor,
-  fontSize: uikitStyles.theme.calendar.headerInputFontSize,
-  letterSpacing: uikitStyles.theme.calendar.headerInputFontLetterSpacing,
-  lineHeight: uikitStyles.theme.calendar.headerInputFontLineHeight,
-  fontWeight: uikitStyles.theme.calendar.headerInputFontWeight,
-  width: "100%",
-  "&::placeholder": {
-    color: uikitStyles.theme.colors.secondary_60
+const uikitStyles = require("@hitachivantara/uikit-styles");
+const {
+  staticClasses,
+  useClasses
+} = classes.createClasses("HvCalendarHeader", {
+  root: {
+    marginTop: uikitStyles.theme.spacing("xs"),
+    backgroundColor: uikitStyles.theme.colors.atmo1,
+    borderBottom: uikitStyles.theme.calendar.headerInputBorderBottom,
+    borderTop: uikitStyles.theme.calendar.headerInputBorderTop,
+    borderLeft: uikitStyles.theme.calendar.headerInputBorderLeft,
+    borderRight: uikitStyles.theme.calendar.headerInputBorderRight,
+    borderRadius: uikitStyles.theme.calendar.borderRadius,
+    "&:hover, &:focus": {
+      borderBottom: `1px solid ${uikitStyles.theme.colors.secondary}`
+    }
+  },
+  invalid: {},
+  headerDayOfWeek: {
+    color: uikitStyles.theme.calendar.headerInputFontColor,
+    paddingLeft: uikitStyles.theme.spacing("xs")
+  },
+  headerDate: {},
+  input: {
+    border: "none",
+    backgroundColor: "transparent",
+    padding: `5px ${uikitStyles.theme.spacing("xs")}`,
+    fontFamily: uikitStyles.theme.fontFamily.body,
+    color: uikitStyles.theme.calendar.headerInputFontColor,
+    fontSize: uikitStyles.theme.calendar.headerInputFontSize,
+    letterSpacing: uikitStyles.theme.calendar.headerInputFontLetterSpacing,
+    lineHeight: uikitStyles.theme.calendar.headerInputFontLineHeight,
+    fontWeight: uikitStyles.theme.calendar.headerInputFontWeight,
+    width: "100%",
+    "&::placeholder": {
+      color: uikitStyles.theme.colors.secondary_60
+    },
+    "&:focus": {
+      outline: "none"
+    },
+    "&:focus-visible": {
+      ...focusUtils.outlineStyles
+    }
   },
-  "&:focus": {
-    outline: "none"
+  inputBorderContainer: {
+    backgroundColor: uikitStyles.theme.colors.negative,
+    height: 1,
+    marginTop: -1
   },
-  "&:focus-visible": {
-    ...focusUtils.outlineStyles
+  invalidMessageStyling: {
+    display: "flex",
+    alignItems: "center",
+    color: uikitStyles.theme.colors.negative
   }
-}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvQ2FsZW5kYXIvQ2FsZW5kYXJIZWFkZXIvQ2FsZW5kYXJIZWFkZXIuc3R5bGVzLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUEwQjJCIiwiZmlsZSI6Ii9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvQ2FsZW5kYXIvQ2FsZW5kYXJIZWFkZXIvQ2FsZW5kYXJIZWFkZXIuc3R5bGVzLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuXG5pbXBvcnQgeyB0aGVtZSB9IGZyb20gXCJAaGl0YWNoaXZhbnRhcmEvdWlraXQtc3R5bGVzXCI7XG5cbmltcG9ydCB7IEh2VHlwb2dyYXBoeSB9IGZyb20gXCJAY29yZS9jb21wb25lbnRzL1R5cG9ncmFwaHlcIjtcbmltcG9ydCB7IG91dGxpbmVTdHlsZXMgfSBmcm9tIFwiQGNvcmUvdXRpbHMvZm9jdXNVdGlsc1wiO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkUm9vdCA9IHN0eWxlZChcImRpdlwiKSh7XG4gIG1hcmdpblRvcDogdGhlbWUuc3BhY2luZyhcInhzXCIpLFxuICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmNvbG9ycy5hdG1vMSxcbiAgYm9yZGVyQm90dG9tOiB0aGVtZS5jYWxlbmRhci5oZWFkZXJJbnB1dEJvcmRlckJvdHRvbSxcbiAgYm9yZGVyVG9wOiB0aGVtZS5jYWxlbmRhci5oZWFkZXJJbnB1dEJvcmRlclRvcCxcbiAgYm9yZGVyTGVmdDogdGhlbWUuY2FsZW5kYXIuaGVhZGVySW5wdXRCb3JkZXJMZWZ0LFxuICBib3JkZXJSaWdodDogdGhlbWUuY2FsZW5kYXIuaGVhZGVySW5wdXRCb3JkZXJSaWdodCxcbiAgYm9yZGVyUmFkaXVzOiB0aGVtZS5jYWxlbmRhci5ib3JkZXJSYWRpdXMsXG4gIFwiJjpob3ZlciwgJjpmb2N1c1wiOiB7XG4gICAgYm9yZGVyQm90dG9tOiBgMXB4IHNvbGlkICR7dGhlbWUuY29sb3JzLnNlY29uZGFyeX1gLFxuICB9LFxufSk7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRJbnB1dEJvcmRlckNvbnRhaW5lciA9IHN0eWxlZChcImRpdlwiKSh7XG4gIGJhY2tncm91bmRDb2xvcjogdGhlbWUuY29sb3JzLm5lZ2F0aXZlLFxuICBoZWlnaHQ6IDEsXG4gIG1hcmdpblRvcDogLTEsXG59KTtcblxuZXhwb3J0IGNvbnN0IFN0eWxlZElucHV0ID0gc3R5bGVkKChwcm9wcykgPT4gPGlucHV0IHsuLi5wcm9wc30gLz4pKHtcbiAgYm9yZGVyOiBcIm5vbmVcIixcbiAgYmFja2dyb3VuZENvbG9yOiBcInRyYW5zcGFyZW50XCIsXG4gIHBhZGRpbmc6IGA1cHggJHt0aGVtZS5zcGFjaW5nKFwieHNcIil9YCxcbiAgZm9udEZhbWlseTogdGhlbWUuZm9udEZhbWlseS5ib2R5LFxuXG4gIGNvbG9yOiB0aGVtZS5jYWxlbmRhci5oZWFkZXJJbnB1dEZvbnRDb2xvcixcbiAgZm9udFNpemU6IHRoZW1lLmNhbGVuZGFyLmhlYWRlcklucHV0Rm9udFNpemUsXG4gIGxldHRlclNwYWNpbmc6IHRoZW1lLmNhbGVuZGFyLmhlYWRlcklucHV0Rm9udExldHRlclNwYWNpbmcsXG4gIGxpbmVIZWlnaHQ6IHRoZW1lLmNhbGVuZGFyLmhlYWRlcklucHV0Rm9udExpbmVIZWlnaHQsXG4gIGZvbnRXZWlnaHQ6IHRoZW1lLmNhbGVuZGFyLmhlYWRlcklucHV0Rm9udFdlaWdodCxcbiAgd2lkdGg6IFwiMTAwJVwiLFxuICBcIiY6OnBsYWNlaG9sZGVyXCI6IHtcbiAgICBjb2xvcjogdGhlbWUuY29sb3JzLnNlY29uZGFyeV82MCxcbiAgfSxcbiAgXCImOmZvY3VzXCI6IHtcbiAgICBvdXRsaW5lOiBcIm5vbmVcIixcbiAgfSxcbiAgXCImOmZvY3VzLXZpc2libGVcIjoge1xuICAgIC4uLm91dGxpbmVTdHlsZXMsXG4gIH0sXG59KTtcblxuZXhwb3J0IGNvbnN0IFN0eWxlZEhlYWRlckRheU9mV2VlayA9IHN0eWxlZChIdlR5cG9ncmFwaHkpKHtcbiAgY29sb3I6IHRoZW1lLmNhbGVuZGFyLmhlYWRlcklucHV0Rm9udENvbG9yLFxuICBwYWRkaW5nTGVmdDogdGhlbWUuc3BhY2luZyhcInhzXCIpLFxufSk7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRUeXBvZ3JhcGh5ID0gc3R5bGVkKEh2VHlwb2dyYXBoeSkoe1xuICBkaXNwbGF5OiBcImZsZXhcIixcbiAgYWxpZ25JdGVtczogXCJjZW50ZXJcIixcbiAgY29sb3I6IHRoZW1lLmNvbG9ycy5uZWdhdGl2ZSxcbn0pO1xuIl19 */");
-const StyledHeaderDayOfWeek = /* @__PURE__ */ _styled__default.default(Typography.HvTypography, process.env.NODE_ENV === "production" ? {
-  target: "e1yjj6ap1"
-} : {
-  target: "e1yjj6ap1",
-  label: "StyledHeaderDayOfWeek"
-})({
-  color: uikitStyles.theme.calendar.headerInputFontColor,
-  paddingLeft: uikitStyles.theme.spacing("xs")
-}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvQ2FsZW5kYXIvQ2FsZW5kYXJIZWFkZXIvQ2FsZW5kYXJIZWFkZXIuc3R5bGVzLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFpRHFDIiwiZmlsZSI6Ii9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvQ2FsZW5kYXIvQ2FsZW5kYXJIZWFkZXIvQ2FsZW5kYXJIZWFkZXIuc3R5bGVzLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuXG5pbXBvcnQgeyB0aGVtZSB9IGZyb20gXCJAaGl0YWNoaXZhbnRhcmEvdWlraXQtc3R5bGVzXCI7XG5cbmltcG9ydCB7IEh2VHlwb2dyYXBoeSB9IGZyb20gXCJAY29yZS9jb21wb25lbnRzL1R5cG9ncmFwaHlcIjtcbmltcG9ydCB7IG91dGxpbmVTdHlsZXMgfSBmcm9tIFwiQGNvcmUvdXRpbHMvZm9jdXNVdGlsc1wiO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkUm9vdCA9IHN0eWxlZChcImRpdlwiKSh7XG4gIG1hcmdpblRvcDogdGhlbWUuc3BhY2luZyhcInhzXCIpLFxuICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmNvbG9ycy5hdG1vMSxcbiAgYm9yZGVyQm90dG9tOiB0aGVtZS5jYWxlbmRhci5oZWFkZXJJbnB1dEJvcmRlckJvdHRvbSxcbiAgYm9yZGVyVG9wOiB0aGVtZS5jYWxlbmRhci5oZWFkZXJJbnB1dEJvcmRlclRvcCxcbiAgYm9yZGVyTGVmdDogdGhlbWUuY2FsZW5kYXIuaGVhZGVySW5wdXRCb3JkZXJMZWZ0LFxuICBib3JkZXJSaWdodDogdGhlbWUuY2FsZW5kYXIuaGVhZGVySW5wdXRCb3JkZXJSaWdodCxcbiAgYm9yZGVyUmFkaXVzOiB0aGVtZS5jYWxlbmRhci5ib3JkZXJSYWRpdXMsXG4gIFwiJjpob3ZlciwgJjpmb2N1c1wiOiB7XG4gICAgYm9yZGVyQm90dG9tOiBgMXB4IHNvbGlkICR7dGhlbWUuY29sb3JzLnNlY29uZGFyeX1gLFxuICB9LFxufSk7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRJbnB1dEJvcmRlckNvbnRhaW5lciA9IHN0eWxlZChcImRpdlwiKSh7XG4gIGJhY2tncm91bmRDb2xvcjogdGhlbWUuY29sb3JzLm5lZ2F0aXZlLFxuICBoZWlnaHQ6IDEsXG4gIG1hcmdpblRvcDogLTEsXG59KTtcblxuZXhwb3J0IGNvbnN0IFN0eWxlZElucHV0ID0gc3R5bGVkKChwcm9wcykgPT4gPGlucHV0IHsuLi5wcm9wc30gLz4pKHtcbiAgYm9yZGVyOiBcIm5vbmVcIixcbiAgYmFja2dyb3VuZENvbG9yOiBcInRyYW5zcGFyZW50XCIsXG4gIHBhZGRpbmc6IGA1cHggJHt0aGVtZS5zcGFjaW5nKFwieHNcIil9YCxcbiAgZm9udEZhbWlseTogdGhlbWUuZm9udEZhbWlseS5ib2R5LFxuXG4gIGNvbG9yOiB0aGVtZS5jYWxlbmRhci5oZWFkZXJJbnB1dEZvbnRDb2xvcixcbiAgZm9udFNpemU6IHRoZW1lLmNhbGVuZGFyLmhlYWRlcklucHV0Rm9udFNpemUsXG4gIGxldHRlclNwYWNpbmc6IHRoZW1lLmNhbGVuZGFyLmhlYWRlcklucHV0Rm9udExldHRlclNwYWNpbmcsXG4gIGxpbmVIZWlnaHQ6IHRoZW1lLmNhbGVuZGFyLmhlYWRlcklucHV0Rm9udExpbmVIZWlnaHQsXG4gIGZvbnRXZWlnaHQ6IHRoZW1lLmNhbGVuZGFyLmhlYWRlcklucHV0Rm9udFdlaWdodCxcbiAgd2lkdGg6IFwiMTAwJVwiLFxuICBcIiY6OnBsYWNlaG9sZGVyXCI6IHtcbiAgICBjb2xvcjogdGhlbWUuY29sb3JzLnNlY29uZGFyeV82MCxcbiAgfSxcbiAgXCImOmZvY3VzXCI6IHtcbiAgICBvdXRsaW5lOiBcIm5vbmVcIixcbiAgfSxcbiAgXCImOmZvY3VzLXZpc2libGVcIjoge1xuICAgIC4uLm91dGxpbmVTdHlsZXMsXG4gIH0sXG59KTtcblxuZXhwb3J0IGNvbnN0IFN0eWxlZEhlYWRlckRheU9mV2VlayA9IHN0eWxlZChIdlR5cG9ncmFwaHkpKHtcbiAgY29sb3I6IHRoZW1lLmNhbGVuZGFyLmhlYWRlcklucHV0Rm9udENvbG9yLFxuICBwYWRkaW5nTGVmdDogdGhlbWUuc3BhY2luZyhcInhzXCIpLFxufSk7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRUeXBvZ3JhcGh5ID0gc3R5bGVkKEh2VHlwb2dyYXBoeSkoe1xuICBkaXNwbGF5OiBcImZsZXhcIixcbiAgYWxpZ25JdGVtczogXCJjZW50ZXJcIixcbiAgY29sb3I6IHRoZW1lLmNvbG9ycy5uZWdhdGl2ZSxcbn0pO1xuIl19 */");
-const StyledTypography = /* @__PURE__ */ _styled__default.default(Typography.HvTypography, process.env.NODE_ENV === "production" ? {
-  target: "e1yjj6ap0"
-} : {
-  target: "e1yjj6ap0",
-  label: "StyledTypography"
-})({
-  display: "flex",
-  alignItems: "center",
-  color: uikitStyles.theme.colors.negative
-}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvQ2FsZW5kYXIvQ2FsZW5kYXJIZWFkZXIvQ2FsZW5kYXJIZWFkZXIuc3R5bGVzLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFzRGdDIiwiZmlsZSI6Ii9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvQ2FsZW5kYXIvQ2FsZW5kYXJIZWFkZXIvQ2FsZW5kYXJIZWFkZXIuc3R5bGVzLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuXG5pbXBvcnQgeyB0aGVtZSB9IGZyb20gXCJAaGl0YWNoaXZhbnRhcmEvdWlraXQtc3R5bGVzXCI7XG5cbmltcG9ydCB7IEh2VHlwb2dyYXBoeSB9IGZyb20gXCJAY29yZS9jb21wb25lbnRzL1R5cG9ncmFwaHlcIjtcbmltcG9ydCB7IG91dGxpbmVTdHlsZXMgfSBmcm9tIFwiQGNvcmUvdXRpbHMvZm9jdXNVdGlsc1wiO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkUm9vdCA9IHN0eWxlZChcImRpdlwiKSh7XG4gIG1hcmdpblRvcDogdGhlbWUuc3BhY2luZyhcInhzXCIpLFxuICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmNvbG9ycy5hdG1vMSxcbiAgYm9yZGVyQm90dG9tOiB0aGVtZS5jYWxlbmRhci5oZWFkZXJJbnB1dEJvcmRlckJvdHRvbSxcbiAgYm9yZGVyVG9wOiB0aGVtZS5jYWxlbmRhci5oZWFkZXJJbnB1dEJvcmRlclRvcCxcbiAgYm9yZGVyTGVmdDogdGhlbWUuY2FsZW5kYXIuaGVhZGVySW5wdXRCb3JkZXJMZWZ0LFxuICBib3JkZXJSaWdodDogdGhlbWUuY2FsZW5kYXIuaGVhZGVySW5wdXRCb3JkZXJSaWdodCxcbiAgYm9yZGVyUmFkaXVzOiB0aGVtZS5jYWxlbmRhci5ib3JkZXJSYWRpdXMsXG4gIFwiJjpob3ZlciwgJjpmb2N1c1wiOiB7XG4gICAgYm9yZGVyQm90dG9tOiBgMXB4IHNvbGlkICR7dGhlbWUuY29sb3JzLnNlY29uZGFyeX1gLFxuICB9LFxufSk7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRJbnB1dEJvcmRlckNvbnRhaW5lciA9IHN0eWxlZChcImRpdlwiKSh7XG4gIGJhY2tncm91bmRDb2xvcjogdGhlbWUuY29sb3JzLm5lZ2F0aXZlLFxuICBoZWlnaHQ6IDEsXG4gIG1hcmdpblRvcDogLTEsXG59KTtcblxuZXhwb3J0IGNvbnN0IFN0eWxlZElucHV0ID0gc3R5bGVkKChwcm9wcykgPT4gPGlucHV0IHsuLi5wcm9wc30gLz4pKHtcbiAgYm9yZGVyOiBcIm5vbmVcIixcbiAgYmFja2dyb3VuZENvbG9yOiBcInRyYW5zcGFyZW50XCIsXG4gIHBhZGRpbmc6IGA1cHggJHt0aGVtZS5zcGFjaW5nKFwieHNcIil9YCxcbiAgZm9udEZhbWlseTogdGhlbWUuZm9udEZhbWlseS5ib2R5LFxuXG4gIGNvbG9yOiB0aGVtZS5jYWxlbmRhci5oZWFkZXJJbnB1dEZvbnRDb2xvcixcbiAgZm9udFNpemU6IHRoZW1lLmNhbGVuZGFyLmhlYWRlcklucHV0Rm9udFNpemUsXG4gIGxldHRlclNwYWNpbmc6IHRoZW1lLmNhbGVuZGFyLmhlYWRlcklucHV0Rm9udExldHRlclNwYWNpbmcsXG4gIGxpbmVIZWlnaHQ6IHRoZW1lLmNhbGVuZGFyLmhlYWRlcklucHV0Rm9udExpbmVIZWlnaHQsXG4gIGZvbnRXZWlnaHQ6IHRoZW1lLmNhbGVuZGFyLmhlYWRlcklucHV0Rm9udFdlaWdodCxcbiAgd2lkdGg6IFwiMTAwJVwiLFxuICBcIiY6OnBsYWNlaG9sZGVyXCI6IHtcbiAgICBjb2xvcjogdGhlbWUuY29sb3JzLnNlY29uZGFyeV82MCxcbiAgfSxcbiAgXCImOmZvY3VzXCI6IHtcbiAgICBvdXRsaW5lOiBcIm5vbmVcIixcbiAgfSxcbiAgXCImOmZvY3VzLXZpc2libGVcIjoge1xuICAgIC4uLm91dGxpbmVTdHlsZXMsXG4gIH0sXG59KTtcblxuZXhwb3J0IGNvbnN0IFN0eWxlZEhlYWRlckRheU9mV2VlayA9IHN0eWxlZChIdlR5cG9ncmFwaHkpKHtcbiAgY29sb3I6IHRoZW1lLmNhbGVuZGFyLmhlYWRlcklucHV0Rm9udENvbG9yLFxuICBwYWRkaW5nTGVmdDogdGhlbWUuc3BhY2luZyhcInhzXCIpLFxufSk7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRUeXBvZ3JhcGh5ID0gc3R5bGVkKEh2VHlwb2dyYXBoeSkoe1xuICBkaXNwbGF5OiBcImZsZXhcIixcbiAgYWxpZ25JdGVtczogXCJjZW50ZXJcIixcbiAgY29sb3I6IHRoZW1lLmNvbG9ycy5uZWdhdGl2ZSxcbn0pO1xuIl19 */");
-exports.StyledHeaderDayOfWeek = StyledHeaderDayOfWeek;
-exports.StyledInput = StyledInput;
-exports.StyledInputBorderContainer = StyledInputBorderContainer;
-exports.StyledRoot = StyledRoot;
-exports.StyledTypography = StyledTypography;
+});
+exports.staticClasses = staticClasses;
+exports.useClasses = useClasses;
 //# sourceMappingURL=CalendarHeader.styles.cjs.map