@hitachivantara/uikit-react-core 5.24.3 → 5.24.4

package/dist/esm/components/Calendar/CalendarNavigation/MonthSelector/MonthSelector.js.map

@@ -1 +1 @@
-{"version":3,"file":"MonthSelector.js","sources":["../../../../../../src/components/Calendar/CalendarNavigation/MonthSelector/MonthSelector.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\n\nimport { isKey } from \"@core/utils/keyboardUtils\";\n\nimport { getMonthNamesList } from \"../../utils\";\nimport { ViewMode } from \"../../enums\";\nimport monthSelectorClasses, {\n  HvMonthSelectorClasses,\n} from \"./monthSelectorClasses\";\nimport {\n  StyledCalendarMonthlyCell,\n  StyledCalendarMonthlyGrid,\n  StyledFocusSelection,\n} from \"./MonthSelector.styles\";\nimport { DateRangeProp, VisibilitySelectorActions } from \"../../types\";\n\nexport const HvMonthSelector = ({\n  classes,\n  id,\n  locale,\n  onChange,\n  onViewModeChange,\n  rangeMode,\n  visibleMonth,\n  ...others\n}: HvMonthSelectorProps) => {\n  const listMonthNamesShort = getMonthNamesList(locale, \"short\");\n  const onKeyDownHandler = (event, index) => {\n    if (isKey(event, \"Enter\")) {\n      onChange?.(event, \"month\", index + 1);\n      onViewModeChange(\"calendar\");\n    }\n  };\n  return (\n    <StyledCalendarMonthlyGrid\n      className={clsx(\n        monthSelectorClasses.calendarMonthlyGrid,\n        classes?.calendarMonthlyGrid,\n        rangeMode\n          ? clsx(monthSelectorClasses.rangeModeWidth, classes?.rangeModeWidth)\n          : clsx(monthSelectorClasses.normalWidth, classes?.normalWidth)\n      )}\n    >\n      {listMonthNamesShort.map((monthName, index) => (\n        <StyledFocusSelection\n          className={clsx(\n            monthSelectorClasses.focusSelection,\n            classes?.focusSelection\n          )}\n          key={monthName}\n          role=\"button\"\n          onClick={(event) => {\n            onChange?.(event, \"month\", index + 1);\n            onViewModeChange(\"calendar\");\n          }}\n          onKeyDown={(event) => onKeyDownHandler(event, index)}\n          tabIndex={0}\n          {...others}\n        >\n          <StyledCalendarMonthlyCell\n            className={clsx(\n              monthSelectorClasses.calendarMonthlyCell,\n              classes?.calendarMonthlyCell,\n              index + 1 === visibleMonth &&\n                clsx(\n                  monthSelectorClasses.calendarMonthlyCellSelected,\n                  classes?.calendarMonthlyCellSelected\n                )\n            )}\n          >\n            {monthName}\n          </StyledCalendarMonthlyCell>\n        </StyledFocusSelection>\n      ))}\n    </StyledCalendarMonthlyGrid>\n  );\n};\n\nexport interface HvMonthSelectorProps {\n  /**\n   * A Jss Object used to override or extend the component styles.\n   */\n  classes?: HvMonthSelectorClasses;\n  /**\n   * Identifier.\n   */\n  id?: string;\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: any,\n    action: VisibilitySelectorActions,\n    value: Date | DateRangeProp | number\n  ) => void;\n  /**\n   * Callback to define the input date.\n   */\n  onViewModeChange: (viewMode: ViewMode) => void;\n  /**\n   * Controls the visible month of the Calendar\n   */\n  visibleMonth: number;\n  /**\n   * Controls the visible month of the Calendar\n   */\n  visibleYear?: number;\n  rangeMode?: boolean;\n}\n"],"names":["HvMonthSelector","classes","id","locale","onChange","onViewModeChange","rangeMode","visibleMonth","others","listMonthNamesShort","getMonthNamesList","onKeyDownHandler","event","index","isKey","StyledCalendarMonthlyGrid","className","clsx","monthSelectorClasses","calendarMonthlyGrid","rangeModeWidth","normalWidth","children","map","monthName","StyledFocusSelection","focusSelection","role","onClick","onKeyDown","tabIndex","StyledCalendarMonthlyCell","calendarMonthlyCell","calendarMonthlyCellSelected"],"mappings":";;;;;;AAgBO,MAAMA,kBAAkBA,CAAC;AAAA,EAC9BC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACA,GAAGC;AACiB,MAAM;AACpBC,QAAAA,sBAAsBC,kBAAkBP,QAAQ,OAAO;AACvDQ,QAAAA,mBAAmBA,CAACC,OAAOC,UAAU;AACrCC,QAAAA,MAAMF,OAAO,OAAO,GAAG;AACdA,2CAAAA,OAAO,SAASC,QAAQ;AACnCR,uBAAiB,UAAU;AAAA,IAC7B;AAAA,EAAA;AAEF,6BACGU,2BAAyB;AAAA,IACxBC,WAAWC,KACTC,qBAAqBC,qBACrBlB,mCAASkB,qBACTb,YACIW,KAAKC,qBAAqBE,gBAAgBnB,mCAASmB,cAAc,IACjEH,KAAKC,qBAAqBG,aAAapB,mCAASoB,WAAW,CACjE;AAAA,IAAEC,UAEDb,oBAAoBc,IAAI,CAACC,WAAWX,8BAClCY,sBAAoB;AAAA,MACnBT,WAAWC,KACTC,qBAAqBQ,gBACrBzB,mCAASyB,cACX;AAAA,MAEAC,MAAK;AAAA,MACLC,SAAUhB,CAAU,UAAA;AACPA,6CAAAA,OAAO,SAASC,QAAQ;AACnCR,yBAAiB,UAAU;AAAA,MAC7B;AAAA,MACAwB,WAAYjB,CAAAA,UAAUD,iBAAiBC,OAAOC,KAAK;AAAA,MACnDiB,UAAU;AAAA,MAAE,GACRtB;AAAAA,MAAMc,8BAETS,2BAAyB;AAAA,QACxBf,WAAWC,KACTC,qBAAqBc,qBACrB/B,mCAAS+B,qBACTnB,QAAQ,MAAMN,gBACZU,KACEC,qBAAqBe,6BACrBhC,mCAASgC,2BACX,CACJ;AAAA,QAAEX,UAEDE;AAAAA,MAAAA,CACwB;AAAA,IAAC,GAtBvBA,SAuBe,CACvB;AAAA,EAAA,CACwB;AAE/B;"}
+{"version":3,"file":"MonthSelector.js","sources":["../../../../../../src/components/Calendar/CalendarNavigation/MonthSelector/MonthSelector.tsx"],"sourcesContent":["import { isKey } from \"@core/utils/keyboardUtils\";\n\nimport { HvTypography } from \"@core/components/Typography\";\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { getMonthNamesList } from \"../../utils\";\nimport { ViewMode } from \"../../enums\";\nimport { DateRangeProp, VisibilitySelectorActions } from \"../../types\";\n\nimport { staticClasses, useClasses } from \"./MonthSelector.styles\";\n\nexport { staticClasses as monthSelectorClasses };\n\nexport type HvMonthSelectorClasses = ExtractNames<typeof useClasses>;\n\nexport const HvMonthSelector = ({\n  classes: classesProp,\n  id,\n  locale,\n  onChange,\n  onViewModeChange,\n  rangeMode,\n  visibleMonth,\n  ...others\n}: HvMonthSelectorProps) => {\n  const { classes, cx } = useClasses(classesProp);\n\n  const listMonthNamesShort = getMonthNamesList(locale, \"short\");\n  const onKeyDownHandler = (event, index) => {\n    if (isKey(event, \"Enter\")) {\n      onChange?.(event, \"month\", index + 1);\n      onViewModeChange(\"calendar\");\n    }\n  };\n  return (\n    <div\n      className={cx(classes.calendarMonthlyGrid, {\n        [classes.rangeModeWidth]: rangeMode,\n        [classes.normalWidth]: !rangeMode,\n      })}\n    >\n      {listMonthNamesShort.map((monthName, index) => (\n        <div\n          className={classes.focusSelection}\n          key={monthName}\n          role=\"button\"\n          onClick={(event) => {\n            onChange?.(event, \"month\", index + 1);\n            onViewModeChange(\"calendar\");\n          }}\n          onKeyDown={(event) => onKeyDownHandler(event, index)}\n          tabIndex={0}\n          {...others}\n        >\n          <HvTypography\n            className={cx(classes.calendarMonthlyCell, {\n              [classes.calendarMonthlyCellSelected]: index + 1 === visibleMonth,\n            })}\n          >\n            {monthName}\n          </HvTypography>\n        </div>\n      ))}\n    </div>\n  );\n};\n\nexport interface HvMonthSelectorProps {\n  /**\n   * A Jss Object used to override or extend the component styles.\n   */\n  classes?: HvMonthSelectorClasses;\n  /**\n   * Identifier.\n   */\n  id?: string;\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: any,\n    action: VisibilitySelectorActions,\n    value: Date | DateRangeProp | number\n  ) => void;\n  /**\n   * Callback to define the input date.\n   */\n  onViewModeChange: (viewMode: ViewMode) => void;\n  /**\n   * Controls the visible month of the Calendar\n   */\n  visibleMonth: number;\n  /**\n   * Controls the visible month of the Calendar\n   */\n  visibleYear?: number;\n  rangeMode?: boolean;\n}\n"],"names":["HvMonthSelector","classes","classesProp","id","locale","onChange","onViewModeChange","rangeMode","visibleMonth","others","cx","useClasses","listMonthNamesShort","getMonthNamesList","onKeyDownHandler","event","index","isKey","className","calendarMonthlyGrid","rangeModeWidth","normalWidth","children","map","monthName","focusSelection","role","onClick","onKeyDown","tabIndex","HvTypography","calendarMonthlyCell","calendarMonthlyCellSelected"],"mappings":";;;;;;AAcO,MAAMA,kBAAkBA,CAAC;AAAA,EAC9BC,SAASC;AAAAA,EACTC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACA,GAAGC;AACiB,MAAM;AACpB,QAAA;AAAA,IAAER;AAAAA,IAASS;AAAAA,EAAAA,IAAOC,WAAWT,WAAW;AAExCU,QAAAA,sBAAsBC,kBAAkBT,QAAQ,OAAO;AACvDU,QAAAA,mBAAmBA,CAACC,OAAOC,UAAU;AACrCC,QAAAA,MAAMF,OAAO,OAAO,GAAG;AACdA,2CAAAA,OAAO,SAASC,QAAQ;AACnCV,uBAAiB,UAAU;AAAA,IAC7B;AAAA,EAAA;AAEF,6BACE,OAAA;AAAA,IACEY,WAAWR,GAAGT,QAAQkB,qBAAqB;AAAA,MACzC,CAAClB,QAAQmB,cAAc,GAAGb;AAAAA,MAC1B,CAACN,QAAQoB,WAAW,GAAG,CAACd;AAAAA,IAAAA,CACzB;AAAA,IAAEe,UAEFV,oBAAoBW,IAAI,CAACC,WAAWR,8BACnC,OAAA;AAAA,MACEE,WAAWjB,QAAQwB;AAAAA,MAEnBC,MAAK;AAAA,MACLC,SAAUZ,CAAU,UAAA;AACPA,6CAAAA,OAAO,SAASC,QAAQ;AACnCV,yBAAiB,UAAU;AAAA,MAC7B;AAAA,MACAsB,WAAYb,CAAAA,UAAUD,iBAAiBC,OAAOC,KAAK;AAAA,MACnDa,UAAU;AAAA,MAAE,GACRpB;AAAAA,MAAMa,8BAETQ,cAAY;AAAA,QACXZ,WAAWR,GAAGT,QAAQ8B,qBAAqB;AAAA,UACzC,CAAC9B,QAAQ+B,2BAA2B,GAAGhB,QAAQ,MAAMR;AAAAA,QAAAA,CACtD;AAAA,QAAEc,UAEFE;AAAAA,MAAAA,CACW;AAAA,IAAC,GAhBVA,SAiBF,CACN;AAAA,EAAA,CACE;AAET;"}

package/dist/esm/components/Calendar/CalendarNavigation/MonthSelector/MonthSelector.styles.js

@@ -1,62 +1,52 @@
-import _styled from "@emotion/styled/base";
 import { theme } from "@hitachivantara/uikit-styles";
 import { outlineStyles } from "../../../../utils/focusUtils.js";
-import monthSelectorClasses from "./monthSelectorClasses.js";
-import { HvTypography } from "../../../Typography/Typography.js";
+import { createClasses } from "../../../../utils/classes.js";
 const hover = {
   backgroundColor: theme.colors.atmo3,
   cursor: "pointer"
 };
-const StyledFocusSelection = /* @__PURE__ */ _styled("div", process.env.NODE_ENV === "production" ? {
-  target: "e1qytey12"
-} : {
-  target: "e1qytey12",
-  label: "StyledFocusSelection"
-})({
-  "&:hover": {
-    ...hover
+const {
+  staticClasses,
+  useClasses
+} = createClasses("HvMonthSelector", {
+  calendarMonthlyGrid: {
+    marginTop: "50px",
+    marginLeft: "-16px",
+    display: "flex",
+    zIndex: "10",
+    padding: "0 20px",
+    position: "absolute",
+    flexFlow: "wrap",
+    alignContent: "center",
+    justifyContent: "space-evenly",
+    backgroundColor: theme.colors.atmo1
   },
-  "&:focus": {
-    outline: "none"
+  rangeModeWidth: {},
+  normalWidth: {},
+  focusSelection: {
+    "&:hover": {
+      ...hover
+    },
+    "&:focus": {
+      outline: "none"
+    },
+    "&:focus-visible": {
+      ...hover,
+      ...outlineStyles
+    }
   },
-  "&:focus-visible": {
-    ...hover,
-    ...outlineStyles
-  }
-}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvQ2FsZW5kYXIvQ2FsZW5kYXJOYXZpZ2F0aW9uL01vbnRoU2VsZWN0b3IvTW9udGhTZWxlY3Rvci5zdHlsZXMudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQWNvQyIsImZpbGUiOiIvaG9tZS9ydW5uZXIvd29yay9odi11aWtpdC1yZWFjdC9odi11aWtpdC1yZWFjdC9wYWNrYWdlcy9jb3JlL3NyYy9jb21wb25lbnRzL0NhbGVuZGFyL0NhbGVuZGFyTmF2aWdhdGlvbi9Nb250aFNlbGVjdG9yL01vbnRoU2VsZWN0b3Iuc3R5bGVzLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuXG5pbXBvcnQgeyB0aGVtZSB9IGZyb20gXCJAaGl0YWNoaXZhbnRhcmEvdWlraXQtc3R5bGVzXCI7XG5cbmltcG9ydCB7IEh2VHlwb2dyYXBoeSB9IGZyb20gXCJAY29yZS9jb21wb25lbnRzL1R5cG9ncmFwaHlcIjtcbmltcG9ydCB7IG91dGxpbmVTdHlsZXMgfSBmcm9tIFwiQGNvcmUvdXRpbHMvZm9jdXNVdGlsc1wiO1xuXG5pbXBvcnQgbW9udGhTZWxlY3RvckNsYXNzZXMgZnJvbSBcIi4vbW9udGhTZWxlY3RvckNsYXNzZXNcIjtcblxuY29uc3QgaG92ZXIgPSB7XG4gIGJhY2tncm91bmRDb2xvcjogdGhlbWUuY29sb3JzLmF0bW8zLFxuICBjdXJzb3I6IFwicG9pbnRlclwiLFxufTtcblxuZXhwb3J0IGNvbnN0IFN0eWxlZEZvY3VzU2VsZWN0aW9uID0gc3R5bGVkKFwiZGl2XCIpKHtcbiAgXCImOmhvdmVyXCI6IHtcbiAgICAuLi5ob3ZlcixcbiAgfSxcbiAgXCImOmZvY3VzXCI6IHtcbiAgICBvdXRsaW5lOiBcIm5vbmVcIixcbiAgfSxcbiAgXCImOmZvY3VzLXZpc2libGVcIjoge1xuICAgIC4uLmhvdmVyLFxuICAgIC4uLm91dGxpbmVTdHlsZXMsXG4gIH0sXG59KTtcblxuZXhwb3J0IGNvbnN0IFN0eWxlZENhbGVuZGFyTW9udGhseUdyaWQgPSBzdHlsZWQoXCJkaXZcIikoe1xuICBtYXJnaW5Ub3A6IFwiNTBweFwiLFxuICBtYXJnaW5MZWZ0OiBcIi0xNnB4XCIsXG4gIGRpc3BsYXk6IFwiZmxleFwiLFxuICB6SW5kZXg6IFwiMTBcIixcbiAgcGFkZGluZzogXCIwIDIwcHhcIixcbiAgcG9zaXRpb246IFwiYWJzb2x1dGVcIixcbiAgZmxleEZsb3c6IFwid3JhcFwiLFxuICBhbGlnbkNvbnRlbnQ6IFwiY2VudGVyXCIsXG4gIGp1c3RpZnlDb250ZW50OiBcInNwYWNlLWV2ZW5seVwiLFxuICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmNvbG9ycy5hdG1vMSxcbn0pO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkQ2FsZW5kYXJNb250aGx5Q2VsbCA9IHN0eWxlZChIdlR5cG9ncmFwaHkpKHtcbiAgZGlzcGxheTogXCJmbGV4XCIsXG4gIGp1c3RpZnlDb250ZW50OiBcImNlbnRlclwiLFxuICBmbGV4RGlyZWN0aW9uOiBcImNvbHVtblwiLFxuICB0ZXh0QWxpZ246IFwiY2VudGVyXCIsXG4gIGhlaWdodDogXCI0MHB4XCIsXG4gIHdpZHRoOiBcIjkycHhcIixcbiAgXCImOmhvdmVyXCI6IHtcbiAgICAuLi5ob3ZlcixcbiAgfSxcbiAgW2AmLiR7bW9udGhTZWxlY3RvckNsYXNzZXMuY2FsZW5kYXJNb250aGx5Q2VsbFNlbGVjdGVkfWBdOiB7XG4gICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS5jb2xvcnMuYXRtbzMsXG4gICAgY29sb3I6IHRoZW1lLmNvbG9ycy5zZWNvbmRhcnksXG4gICAgXCImOmhvdmVyXCI6IHtcbiAgICAgIGJhY2tncm91bmRDb2xvcjogdGhlbWUuY29sb3JzLmF0bW8zLFxuICAgICAgY29sb3I6IHRoZW1lLmNvbG9ycy5zZWNvbmRhcnksXG4gICAgfSxcbiAgfSxcbn0pO1xuIl19 */");
-const StyledCalendarMonthlyGrid = /* @__PURE__ */ _styled("div", process.env.NODE_ENV === "production" ? {
-  target: "e1qytey11"
-} : {
-  target: "e1qytey11",
-  label: "StyledCalendarMonthlyGrid"
-})({
-  marginTop: "50px",
-  marginLeft: "-16px",
-  display: "flex",
-  zIndex: "10",
-  padding: "0 20px",
-  position: "absolute",
-  flexFlow: "wrap",
-  alignContent: "center",
-  justifyContent: "space-evenly",
-  backgroundColor: theme.colors.atmo1
-}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvQ2FsZW5kYXIvQ2FsZW5kYXJOYXZpZ2F0aW9uL01vbnRoU2VsZWN0b3IvTW9udGhTZWxlY3Rvci5zdHlsZXMudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQTJCeUMiLCJmaWxlIjoiL2hvbWUvcnVubmVyL3dvcmsvaHYtdWlraXQtcmVhY3QvaHYtdWlraXQtcmVhY3QvcGFja2FnZXMvY29yZS9zcmMvY29tcG9uZW50cy9DYWxlbmRhci9DYWxlbmRhck5hdmlnYXRpb24vTW9udGhTZWxlY3Rvci9Nb250aFNlbGVjdG9yLnN0eWxlcy50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgc3R5bGVkIGZyb20gXCJAZW1vdGlvbi9zdHlsZWRcIjtcblxuaW1wb3J0IHsgdGhlbWUgfSBmcm9tIFwiQGhpdGFjaGl2YW50YXJhL3Vpa2l0LXN0eWxlc1wiO1xuXG5pbXBvcnQgeyBIdlR5cG9ncmFwaHkgfSBmcm9tIFwiQGNvcmUvY29tcG9uZW50cy9UeXBvZ3JhcGh5XCI7XG5pbXBvcnQgeyBvdXRsaW5lU3R5bGVzIH0gZnJvbSBcIkBjb3JlL3V0aWxzL2ZvY3VzVXRpbHNcIjtcblxuaW1wb3J0IG1vbnRoU2VsZWN0b3JDbGFzc2VzIGZyb20gXCIuL21vbnRoU2VsZWN0b3JDbGFzc2VzXCI7XG5cbmNvbnN0IGhvdmVyID0ge1xuICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmNvbG9ycy5hdG1vMyxcbiAgY3Vyc29yOiBcInBvaW50ZXJcIixcbn07XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRGb2N1c1NlbGVjdGlvbiA9IHN0eWxlZChcImRpdlwiKSh7XG4gIFwiJjpob3ZlclwiOiB7XG4gICAgLi4uaG92ZXIsXG4gIH0sXG4gIFwiJjpmb2N1c1wiOiB7XG4gICAgb3V0bGluZTogXCJub25lXCIsXG4gIH0sXG4gIFwiJjpmb2N1cy12aXNpYmxlXCI6IHtcbiAgICAuLi5ob3ZlcixcbiAgICAuLi5vdXRsaW5lU3R5bGVzLFxuICB9LFxufSk7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRDYWxlbmRhck1vbnRobHlHcmlkID0gc3R5bGVkKFwiZGl2XCIpKHtcbiAgbWFyZ2luVG9wOiBcIjUwcHhcIixcbiAgbWFyZ2luTGVmdDogXCItMTZweFwiLFxuICBkaXNwbGF5OiBcImZsZXhcIixcbiAgekluZGV4OiBcIjEwXCIsXG4gIHBhZGRpbmc6IFwiMCAyMHB4XCIsXG4gIHBvc2l0aW9uOiBcImFic29sdXRlXCIsXG4gIGZsZXhGbG93OiBcIndyYXBcIixcbiAgYWxpZ25Db250ZW50OiBcImNlbnRlclwiLFxuICBqdXN0aWZ5Q29udGVudDogXCJzcGFjZS1ldmVubHlcIixcbiAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS5jb2xvcnMuYXRtbzEsXG59KTtcblxuZXhwb3J0IGNvbnN0IFN0eWxlZENhbGVuZGFyTW9udGhseUNlbGwgPSBzdHlsZWQoSHZUeXBvZ3JhcGh5KSh7XG4gIGRpc3BsYXk6IFwiZmxleFwiLFxuICBqdXN0aWZ5Q29udGVudDogXCJjZW50ZXJcIixcbiAgZmxleERpcmVjdGlvbjogXCJjb2x1bW5cIixcbiAgdGV4dEFsaWduOiBcImNlbnRlclwiLFxuICBoZWlnaHQ6IFwiNDBweFwiLFxuICB3aWR0aDogXCI5MnB4XCIsXG4gIFwiJjpob3ZlclwiOiB7XG4gICAgLi4uaG92ZXIsXG4gIH0sXG4gIFtgJi4ke21vbnRoU2VsZWN0b3JDbGFzc2VzLmNhbGVuZGFyTW9udGhseUNlbGxTZWxlY3RlZH1gXToge1xuICAgIGJhY2tncm91bmRDb2xvcjogdGhlbWUuY29sb3JzLmF0bW8zLFxuICAgIGNvbG9yOiB0aGVtZS5jb2xvcnMuc2Vjb25kYXJ5LFxuICAgIFwiJjpob3ZlclwiOiB7XG4gICAgICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmNvbG9ycy5hdG1vMyxcbiAgICAgIGNvbG9yOiB0aGVtZS5jb2xvcnMuc2Vjb25kYXJ5LFxuICAgIH0sXG4gIH0sXG59KTtcbiJdfQ== */");
-const StyledCalendarMonthlyCell = /* @__PURE__ */ _styled(HvTypography, process.env.NODE_ENV === "production" ? {
-  target: "e1qytey10"
-} : {
-  target: "e1qytey10",
-  label: "StyledCalendarMonthlyCell"
-})({
-  display: "flex",
-  justifyContent: "center",
-  flexDirection: "column",
-  textAlign: "center",
-  height: "40px",
-  width: "92px",
-  "&:hover": {
-    ...hover
+  calendarMonthlyCell: {
+    display: "flex",
+    justifyContent: "center",
+    flexDirection: "column",
+    textAlign: "center",
+    height: "40px",
+    width: "92px",
+    "&:hover": {
+      ...hover
+    }
   },
-  [`&.${monthSelectorClasses.calendarMonthlyCellSelected}`]: {
+  calendarMonthlyCellSelected: {
     backgroundColor: theme.colors.atmo3,
     color: theme.colors.secondary,
     "&:hover": {
@@ -64,10 +54,9 @@ const StyledCalendarMonthlyCell = /* @__PURE__ */ _styled(HvTypography, process.
       color: theme.colors.secondary
     }
   }
-}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvQ2FsZW5kYXIvQ2FsZW5kYXJOYXZpZ2F0aW9uL01vbnRoU2VsZWN0b3IvTW9udGhTZWxlY3Rvci5zdHlsZXMudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQXdDeUMiLCJmaWxlIjoiL2hvbWUvcnVubmVyL3dvcmsvaHYtdWlraXQtcmVhY3QvaHYtdWlraXQtcmVhY3QvcGFja2FnZXMvY29yZS9zcmMvY29tcG9uZW50cy9DYWxlbmRhci9DYWxlbmRhck5hdmlnYXRpb24vTW9udGhTZWxlY3Rvci9Nb250aFNlbGVjdG9yLnN0eWxlcy50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgc3R5bGVkIGZyb20gXCJAZW1vdGlvbi9zdHlsZWRcIjtcblxuaW1wb3J0IHsgdGhlbWUgfSBmcm9tIFwiQGhpdGFjaGl2YW50YXJhL3Vpa2l0LXN0eWxlc1wiO1xuXG5pbXBvcnQgeyBIdlR5cG9ncmFwaHkgfSBmcm9tIFwiQGNvcmUvY29tcG9uZW50cy9UeXBvZ3JhcGh5XCI7XG5pbXBvcnQgeyBvdXRsaW5lU3R5bGVzIH0gZnJvbSBcIkBjb3JlL3V0aWxzL2ZvY3VzVXRpbHNcIjtcblxuaW1wb3J0IG1vbnRoU2VsZWN0b3JDbGFzc2VzIGZyb20gXCIuL21vbnRoU2VsZWN0b3JDbGFzc2VzXCI7XG5cbmNvbnN0IGhvdmVyID0ge1xuICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmNvbG9ycy5hdG1vMyxcbiAgY3Vyc29yOiBcInBvaW50ZXJcIixcbn07XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRGb2N1c1NlbGVjdGlvbiA9IHN0eWxlZChcImRpdlwiKSh7XG4gIFwiJjpob3ZlclwiOiB7XG4gICAgLi4uaG92ZXIsXG4gIH0sXG4gIFwiJjpmb2N1c1wiOiB7XG4gICAgb3V0bGluZTogXCJub25lXCIsXG4gIH0sXG4gIFwiJjpmb2N1cy12aXNpYmxlXCI6IHtcbiAgICAuLi5ob3ZlcixcbiAgICAuLi5vdXRsaW5lU3R5bGVzLFxuICB9LFxufSk7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRDYWxlbmRhck1vbnRobHlHcmlkID0gc3R5bGVkKFwiZGl2XCIpKHtcbiAgbWFyZ2luVG9wOiBcIjUwcHhcIixcbiAgbWFyZ2luTGVmdDogXCItMTZweFwiLFxuICBkaXNwbGF5OiBcImZsZXhcIixcbiAgekluZGV4OiBcIjEwXCIsXG4gIHBhZGRpbmc6IFwiMCAyMHB4XCIsXG4gIHBvc2l0aW9uOiBcImFic29sdXRlXCIsXG4gIGZsZXhGbG93OiBcIndyYXBcIixcbiAgYWxpZ25Db250ZW50OiBcImNlbnRlclwiLFxuICBqdXN0aWZ5Q29udGVudDogXCJzcGFjZS1ldmVubHlcIixcbiAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS5jb2xvcnMuYXRtbzEsXG59KTtcblxuZXhwb3J0IGNvbnN0IFN0eWxlZENhbGVuZGFyTW9udGhseUNlbGwgPSBzdHlsZWQoSHZUeXBvZ3JhcGh5KSh7XG4gIGRpc3BsYXk6IFwiZmxleFwiLFxuICBqdXN0aWZ5Q29udGVudDogXCJjZW50ZXJcIixcbiAgZmxleERpcmVjdGlvbjogXCJjb2x1bW5cIixcbiAgdGV4dEFsaWduOiBcImNlbnRlclwiLFxuICBoZWlnaHQ6IFwiNDBweFwiLFxuICB3aWR0aDogXCI5MnB4XCIsXG4gIFwiJjpob3ZlclwiOiB7XG4gICAgLi4uaG92ZXIsXG4gIH0sXG4gIFtgJi4ke21vbnRoU2VsZWN0b3JDbGFzc2VzLmNhbGVuZGFyTW9udGhseUNlbGxTZWxlY3RlZH1gXToge1xuICAgIGJhY2tncm91bmRDb2xvcjogdGhlbWUuY29sb3JzLmF0bW8zLFxuICAgIGNvbG9yOiB0aGVtZS5jb2xvcnMuc2Vjb25kYXJ5LFxuICAgIFwiJjpob3ZlclwiOiB7XG4gICAgICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmNvbG9ycy5hdG1vMyxcbiAgICAgIGNvbG9yOiB0aGVtZS5jb2xvcnMuc2Vjb25kYXJ5LFxuICAgIH0sXG4gIH0sXG59KTtcbiJdfQ== */");
+});
 export {
-  StyledCalendarMonthlyCell,
-  StyledCalendarMonthlyGrid,
-  StyledFocusSelection
+  staticClasses,
+  useClasses
 };
 //# sourceMappingURL=MonthSelector.styles.js.map

package/dist/esm/components/Calendar/CalendarNavigation/MonthSelector/MonthSelector.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"MonthSelector.styles.js","sources":["../../../../../../src/components/Calendar/CalendarNavigation/MonthSelector/MonthSelector.styles.tsx"],"sourcesContent":["import styled from \"@emotion/styled\";\n\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { HvTypography } from \"@core/components/Typography\";\nimport { outlineStyles } from \"@core/utils/focusUtils\";\n\nimport monthSelectorClasses from \"./monthSelectorClasses\";\n\nconst hover = {\n  backgroundColor: theme.colors.atmo3,\n  cursor: \"pointer\",\n};\n\nexport const StyledFocusSelection = styled(\"div\")({\n  \"&:hover\": {\n    ...hover,\n  },\n  \"&:focus\": {\n    outline: \"none\",\n  },\n  \"&:focus-visible\": {\n    ...hover,\n    ...outlineStyles,\n  },\n});\n\nexport const StyledCalendarMonthlyGrid = styled(\"div\")({\n  marginTop: \"50px\",\n  marginLeft: \"-16px\",\n  display: \"flex\",\n  zIndex: \"10\",\n  padding: \"0 20px\",\n  position: \"absolute\",\n  flexFlow: \"wrap\",\n  alignContent: \"center\",\n  justifyContent: \"space-evenly\",\n  backgroundColor: theme.colors.atmo1,\n});\n\nexport const StyledCalendarMonthlyCell = styled(HvTypography)({\n  display: \"flex\",\n  justifyContent: \"center\",\n  flexDirection: \"column\",\n  textAlign: \"center\",\n  height: \"40px\",\n  width: \"92px\",\n  \"&:hover\": {\n    ...hover,\n  },\n  [`&.${monthSelectorClasses.calendarMonthlyCellSelected}`]: {\n    backgroundColor: theme.colors.atmo3,\n    color: theme.colors.secondary,\n    \"&:hover\": {\n      backgroundColor: theme.colors.atmo3,\n      color: theme.colors.secondary,\n    },\n  },\n});\n"],"names":["hover","backgroundColor","theme","colors","atmo3","cursor","StyledFocusSelection","process","env","NODE_ENV","target","label","outline","outlineStyles","StyledCalendarMonthlyGrid","marginTop","marginLeft","display","zIndex","padding","position","flexFlow","alignContent","justifyContent","atmo1","StyledCalendarMonthlyCell","HvTypography","flexDirection","textAlign","height","width","monthSelectorClasses","calendarMonthlyCellSelected","color","secondary"],"mappings":";;;;;AASA,MAAMA,QAAQ;AAAA,EACZC,iBAAiBC,MAAMC,OAAOC;AAAAA,EAC9BC,QAAQ;AACV;AAEO,MAAMC,uBAA8B,wBAAA,OAAKC,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAC,OAAA;AAAA,CAAA,EAAE;AAAA,EAChD,WAAW;AAAA,IACT,GAAGX;AAAAA,EACL;AAAA,EACA,WAAW;AAAA,IACTY,SAAS;AAAA,EACX;AAAA,EACA,mBAAmB;AAAA,IACjB,GAAGZ;AAAAA,IACH,GAAGa;AAAAA,EACL;AACF,GAACN,QAAAC,IAAAC,aAAC,eAAA,KAAA,y8EAAA;AAEK,MAAMK,4BAAmC,wBAAA,OAAKP,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAC,OAAA;AAAA,CAAA,EAAE;AAAA,EACrDI,WAAW;AAAA,EACXC,YAAY;AAAA,EACZC,SAAS;AAAA,EACTC,QAAQ;AAAA,EACRC,SAAS;AAAA,EACTC,UAAU;AAAA,EACVC,UAAU;AAAA,EACVC,cAAc;AAAA,EACdC,gBAAgB;AAAA,EAChBtB,iBAAiBC,MAAMC,OAAOqB;AAChC,GAACjB,QAAAC,IAAAC,aAAC,eAAA,KAAA,68EAAA;AAEK,MAAMgB,4BAAmCC,wBAAAA,cAAYnB,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAC,OAAA;AAAA,CAAA,EAAE;AAAA,EAC5DM,SAAS;AAAA,EACTM,gBAAgB;AAAA,EAChBI,eAAe;AAAA,EACfC,WAAW;AAAA,EACXC,QAAQ;AAAA,EACRC,OAAO;AAAA,EACP,WAAW;AAAA,IACT,GAAG9B;AAAAA,EACL;AAAA,EACA,CAAE,KAAI+B,qBAAqBC,6BAA6B,GAAG;AAAA,IACzD/B,iBAAiBC,MAAMC,OAAOC;AAAAA,IAC9B6B,OAAO/B,MAAMC,OAAO+B;AAAAA,IACpB,WAAW;AAAA,MACTjC,iBAAiBC,MAAMC,OAAOC;AAAAA,MAC9B6B,OAAO/B,MAAMC,OAAO+B;AAAAA,IACtB;AAAA,EACF;AACF,GAAC3B,QAAAC,IAAAC,aAAC,eAAA,KAAA,68EAAA;"}
+{"version":3,"file":"MonthSelector.styles.js","sources":["../../../../../../src/components/Calendar/CalendarNavigation/MonthSelector/MonthSelector.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { outlineStyles } from \"@core/utils/focusUtils\";\n\nimport { createClasses } from \"@core/utils/classes\";\n\nconst hover = {\n  backgroundColor: theme.colors.atmo3,\n  cursor: \"pointer\",\n};\n\nexport const { staticClasses, useClasses } = createClasses(\"HvMonthSelector\", {\n  calendarMonthlyGrid: {\n    marginTop: \"50px\",\n    marginLeft: \"-16px\",\n    display: \"flex\",\n    zIndex: \"10\",\n    padding: \"0 20px\",\n    position: \"absolute\",\n    flexFlow: \"wrap\",\n    alignContent: \"center\",\n    justifyContent: \"space-evenly\",\n    backgroundColor: theme.colors.atmo1,\n  },\n  rangeModeWidth: {},\n  normalWidth: {},\n  focusSelection: {\n    \"&:hover\": {\n      ...hover,\n    },\n    \"&:focus\": {\n      outline: \"none\",\n    },\n    \"&:focus-visible\": {\n      ...hover,\n      ...outlineStyles,\n    },\n  },\n  calendarMonthlyCell: {\n    display: \"flex\",\n    justifyContent: \"center\",\n    flexDirection: \"column\",\n    textAlign: \"center\",\n    height: \"40px\",\n    width: \"92px\",\n    \"&:hover\": {\n      ...hover,\n    },\n  },\n  calendarMonthlyCellSelected: {\n    backgroundColor: theme.colors.atmo3,\n    color: theme.colors.secondary,\n    \"&:hover\": {\n      backgroundColor: theme.colors.atmo3,\n      color: theme.colors.secondary,\n    },\n  },\n});\n"],"names":["hover","backgroundColor","theme","colors","atmo3","cursor","staticClasses","useClasses","createClasses","calendarMonthlyGrid","marginTop","marginLeft","display","zIndex","padding","position","flexFlow","alignContent","justifyContent","atmo1","rangeModeWidth","normalWidth","focusSelection","outline","outlineStyles","calendarMonthlyCell","flexDirection","textAlign","height","width","calendarMonthlyCellSelected","color","secondary"],"mappings":";;;AAMA,MAAMA,QAAQ;AAAA,EACZC,iBAAiBC,MAAMC,OAAOC;AAAAA,EAC9BC,QAAQ;AACV;AAEa,MAAA;AAAA,EAAEC;AAAAA,EAAeC;AAAW,IAAIC,cAAc,mBAAmB;AAAA,EAC5EC,qBAAqB;AAAA,IACnBC,WAAW;AAAA,IACXC,YAAY;AAAA,IACZC,SAAS;AAAA,IACTC,QAAQ;AAAA,IACRC,SAAS;AAAA,IACTC,UAAU;AAAA,IACVC,UAAU;AAAA,IACVC,cAAc;AAAA,IACdC,gBAAgB;AAAA,IAChBjB,iBAAiBC,MAAMC,OAAOgB;AAAAA,EAChC;AAAA,EACAC,gBAAgB,CAAC;AAAA,EACjBC,aAAa,CAAC;AAAA,EACdC,gBAAgB;AAAA,IACd,WAAW;AAAA,MACT,GAAGtB;AAAAA,IACL;AAAA,IACA,WAAW;AAAA,MACTuB,SAAS;AAAA,IACX;AAAA,IACA,mBAAmB;AAAA,MACjB,GAAGvB;AAAAA,MACH,GAAGwB;AAAAA,IACL;AAAA,EACF;AAAA,EACAC,qBAAqB;AAAA,IACnBb,SAAS;AAAA,IACTM,gBAAgB;AAAA,IAChBQ,eAAe;AAAA,IACfC,WAAW;AAAA,IACXC,QAAQ;AAAA,IACRC,OAAO;AAAA,IACP,WAAW;AAAA,MACT,GAAG7B;AAAAA,IACL;AAAA,EACF;AAAA,EACA8B,6BAA6B;AAAA,IAC3B7B,iBAAiBC,MAAMC,OAAOC;AAAAA,IAC9B2B,OAAO7B,MAAMC,OAAO6B;AAAAA,IACpB,WAAW;AAAA,MACT/B,iBAAiBC,MAAMC,OAAOC;AAAAA,MAC9B2B,OAAO7B,MAAMC,OAAO6B;AAAAA,IACtB;AAAA,EACF;AACF,CAAC;"}

package/dist/esm/components/Calendar/CalendarNavigation/Navigation/Navigation.js

@@ -1,13 +1,13 @@
-import { clsx } from "clsx";
+import { DropLeftXS, DropRightXS } from "@hitachivantara/uikit-react-icons";
 import { isKey } from "../../../../utils/keyboardUtils.js";
 import { setId } from "../../../../utils/setId.js";
-import { StyledRoot, StyledDropLeftIcon, StyledText, StyledDropRightIcon } from "./Navigation.styles.js";
-import navigationClasses from "./navigationClasses.js";
+import { useClasses } from "./Navigation.styles.js";
+import { staticClasses } from "./Navigation.styles.js";
 import { jsxs, jsx } from "@emotion/react/jsx-runtime";
 import { HvTypography } from "../../../Typography/Typography.js";
 const Navigation = ({
   id,
-  classes,
+  classes: classesProp,
   onNavigatePrevious,
   onNavigateNext,
   onTextClick,
@@ -15,6 +15,10 @@ const Navigation = ({
   isPreviousEnabled = true,
   isNextEnabled = true
 }) => {
+  const {
+    classes,
+    cx
+  } = useClasses(classesProp);
   const onkeyDownHandler = (event, funcAction) => {
     if (isKey(event, "Enter") || isKey(event, "Space")) {
       event.preventDefault();
@@ -22,17 +26,22 @@ const Navigation = ({
     }
   };
   const onTextClickIsFunction = typeof onTextClick === "function";
-  return /* @__PURE__ */ jsxs(StyledRoot, {
-    className: clsx(navigationClasses.root, classes == null ? void 0 : classes.root),
-    children: [/* @__PURE__ */ jsx(StyledDropLeftIcon, {
+  return /* @__PURE__ */ jsxs("div", {
+    className: classes.root,
+    children: [/* @__PURE__ */ jsx(DropLeftXS, {
       id: setId(id, "left"),
-      className: clsx(navigationClasses.icon, classes == null ? void 0 : classes.icon, !isPreviousEnabled && clsx(navigationClasses.disabled, classes == null ? void 0 : classes.disabled)),
+      className: cx(classes.icon, {
+        [classes.disabled]: !isPreviousEnabled
+      }),
       onClick: isPreviousEnabled ? (event) => onNavigatePrevious(event) : void 0,
       onKeyDown: (event) => isNextEnabled ? onkeyDownHandler(event, onNavigatePrevious) : void 0,
       tabIndex: 0
-    }), /* @__PURE__ */ jsx(StyledText, {
+    }), /* @__PURE__ */ jsx("div", {
       id,
-      className: clsx(onTextClickIsFunction && clsx(navigationClasses.text, classes == null ? void 0 : classes.text), !onTextClickIsFunction && clsx(navigationClasses.textWithoutHover, classes == null ? void 0 : classes.textWithoutHover)),
+      className: cx({
+        [classes.text]: onTextClickIsFunction,
+        [classes.textWithoutHover]: !onTextClickIsFunction
+      }),
       role: "presentation",
       onClick: onTextClick,
       onKeyDown: onTextClick && ((event) => onkeyDownHandler(event, onTextClick)),
@@ -41,9 +50,11 @@ const Navigation = ({
         variant: "body",
         children: navigationText
       })
-    }), /* @__PURE__ */ jsx(StyledDropRightIcon, {
+    }), /* @__PURE__ */ jsx(DropRightXS, {
       id: setId(id, "right"),
-      className: `${clsx(navigationClasses.icon, classes == null ? void 0 : classes.icon)} ${isNextEnabled ? "" : clsx(navigationClasses.disabled, classes == null ? void 0 : classes.disabled)}`,
+      className: cx(classes.icon, {
+        [classes.disabled]: !isNextEnabled
+      }),
       onClick: isNextEnabled ? (event) => onNavigateNext(event) : void 0,
       onKeyDown: (event) => isNextEnabled ? onkeyDownHandler(event, onNavigateNext) : void 0,
       tabIndex: 0
@@ -51,6 +62,7 @@ const Navigation = ({
   });
 };
 export {
-  Navigation
+  Navigation,
+  staticClasses as navigationClasses
 };
 //# sourceMappingURL=Navigation.js.map

package/dist/esm/components/Calendar/CalendarNavigation/Navigation/Navigation.js.map

@@ -1 +1 @@
-{"version":3,"file":"Navigation.js","sources":["../../../../../../src/components/Calendar/CalendarNavigation/Navigation/Navigation.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\n\nimport { isKey } from \"@core/utils/keyboardUtils\";\nimport { setId } from \"@core/utils/setId\";\nimport { HvTypography } from \"@core/components/Typography\";\nimport { HvBaseProps } from \"@core/types/generic\";\n\nimport {\n  StyledDropLeftIcon,\n  StyledDropRightIcon,\n  StyledRoot,\n  StyledText,\n} from \"./Navigation.styles\";\nimport navigationClasses, { HvNavigationClasses } from \"./navigationClasses\";\n\nexport const Navigation = ({\n  id,\n  classes,\n  onNavigatePrevious,\n  onNavigateNext,\n  onTextClick,\n  navigationText = \"n/a\",\n  isPreviousEnabled = true,\n  isNextEnabled = true,\n}: NavigationProps) => {\n  const onkeyDownHandler = (event, funcAction) => {\n    if (isKey(event, \"Enter\") || isKey(event, \"Space\")) {\n      event.preventDefault();\n      funcAction(event);\n    }\n  };\n\n  const onTextClickIsFunction = typeof onTextClick === \"function\";\n\n  return (\n    <StyledRoot className={clsx(navigationClasses.root, classes?.root)}>\n      <StyledDropLeftIcon\n        id={setId(id, \"left\")}\n        className={clsx(\n          navigationClasses.icon,\n          classes?.icon,\n          !isPreviousEnabled &&\n            clsx(navigationClasses.disabled, classes?.disabled)\n        )}\n        onClick={\n          isPreviousEnabled ? (event) => onNavigatePrevious(event) : undefined\n        }\n        onKeyDown={(event) =>\n          isNextEnabled\n            ? onkeyDownHandler(event, onNavigatePrevious)\n            : undefined\n        }\n        tabIndex={0}\n      />\n\n      <StyledText\n        id={id}\n        className={clsx(\n          onTextClickIsFunction && clsx(navigationClasses.text, classes?.text),\n          !onTextClickIsFunction &&\n            clsx(navigationClasses.textWithoutHover, classes?.textWithoutHover)\n        )}\n        role=\"presentation\"\n        onClick={onTextClick}\n        onKeyDown={\n          onTextClick && ((event) => onkeyDownHandler(event, onTextClick))\n        }\n        tabIndex={onTextClick ? 0 : -1}\n      >\n        <HvTypography variant=\"body\">{navigationText}</HvTypography>\n      </StyledText>\n\n      <StyledDropRightIcon\n        id={setId(id, \"right\")}\n        className={`${clsx(navigationClasses.icon, classes?.icon)} ${\n          isNextEnabled\n            ? \"\"\n            : clsx(navigationClasses.disabled, classes?.disabled)\n        }`}\n        onClick={isNextEnabled ? (event) => onNavigateNext(event) : undefined}\n        onKeyDown={(event) =>\n          isNextEnabled ? onkeyDownHandler(event, onNavigateNext) : undefined\n        }\n        tabIndex={0}\n      />\n    </StyledRoot>\n  );\n};\n\nexport interface NavigationProps extends HvBaseProps {\n  /**\n   * Identifier.\n   */\n  id?: string;\n  /**\n   * A Jss Object used to override or extend the component styles.\n   */\n  classes?: HvNavigationClasses;\n  /**\n   * A function to be executed whenever the navigate previous action is triggered.\n   */\n  onNavigatePrevious: (event: React.MouseEvent<HTMLDivElement>) => void;\n  /**\n   * A function to be executed whenever the navigate next action is triggered.\n   */\n  onNavigateNext: (event: React.MouseEvent<HTMLDivElement>) => void;\n  /**\n   * A function to be executed whenever the text is clicked.\n   */\n  onTextClick?: () => void;\n  /**\n   * The text that will be shown between the navigation buttons.\n   */\n  navigationText?: string;\n  /**\n   * Flag stating if the previous button should be enabled or disabled.\n   */\n  isPreviousEnabled?: boolean;\n  /**\n   * Flag stating if the next button should be enabled or disabled.\n   */\n  isNextEnabled?: boolean;\n}\n"],"names":["Navigation","id","classes","onNavigatePrevious","onNavigateNext","onTextClick","navigationText","isPreviousEnabled","isNextEnabled","onkeyDownHandler","event","funcAction","isKey","preventDefault","onTextClickIsFunction","StyledRoot","className","clsx","navigationClasses","root","children","_jsx","StyledDropLeftIcon","setId","icon","disabled","onClick","undefined","onKeyDown","tabIndex","StyledText","text","textWithoutHover","role","HvTypography","variant","StyledDropRightIcon"],"mappings":";;;;;;;AAeO,MAAMA,aAAaA,CAAC;AAAA,EACzBC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC,iBAAiB;AAAA,EACjBC,oBAAoB;AAAA,EACpBC,gBAAgB;AACD,MAAM;AACfC,QAAAA,mBAAmBA,CAACC,OAAOC,eAAe;AAC9C,QAAIC,MAAMF,OAAO,OAAO,KAAKE,MAAMF,OAAO,OAAO,GAAG;AAClDA,YAAMG,eAAe;AACrBF,iBAAWD,KAAK;AAAA,IAClB;AAAA,EAAA;AAGII,QAAAA,wBAAwB,OAAOT,gBAAgB;AAErD,8BACGU,YAAU;AAAA,IAACC,WAAWC,KAAKC,kBAAkBC,MAAMjB,mCAASiB,IAAI;AAAA,IAAEC,UAAA,CACjEC,oBAACC,oBAAkB;AAAA,MACjBrB,IAAIsB,MAAMtB,IAAI,MAAM;AAAA,MACpBe,WAAWC,KACTC,kBAAkBM,MAClBtB,mCAASsB,MACT,CAACjB,qBACCU,KAAKC,kBAAkBO,UAAUvB,mCAASuB,QAAQ,CACtD;AAAA,MACAC,SACEnB,oBAAqBG,CAAUP,UAAAA,mBAAmBO,KAAK,IAAIiB;AAAAA,MAE7DC,WAAYlB,CACVF,UAAAA,gBACIC,iBAAiBC,OAAOP,kBAAkB,IAC1CwB;AAAAA,MAENE,UAAU;AAAA,IAAA,CACX,GAEDR,oBAACS,YAAU;AAAA,MACT7B;AAAAA,MACAe,WAAWC,KACTH,yBAAyBG,KAAKC,kBAAkBa,MAAM7B,mCAAS6B,IAAI,GACnE,CAACjB,yBACCG,KAAKC,kBAAkBc,kBAAkB9B,mCAAS8B,gBAAgB,CACtE;AAAA,MACAC,MAAK;AAAA,MACLP,SAASrB;AAAAA,MACTuB,WACEvB,gBAAiBK,CAAUD,UAAAA,iBAAiBC,OAAOL,WAAW;AAAA,MAEhEwB,UAAUxB,cAAc,IAAI;AAAA,MAAGe,8BAE9Bc,cAAY;AAAA,QAACC,SAAQ;AAAA,QAAMf,UAAEd;AAAAA,MAAAA,CAA6B;AAAA,IAAA,CACjD,GAEZe,oBAACe,qBAAmB;AAAA,MAClBnC,IAAIsB,MAAMtB,IAAI,OAAO;AAAA,MACrBe,WAAY,GAAEC,KAAKC,kBAAkBM,MAAMtB,mCAASsB,IAAI,KACtDhB,gBACI,KACAS,KAAKC,kBAAkBO,UAAUvB,mCAASuB,QAAQ;AAAA,MAExDC,SAASlB,gBAAiBE,CAAUN,UAAAA,eAAeM,KAAK,IAAIiB;AAAAA,MAC5DC,WAAYlB,CACVF,UAAAA,gBAAgBC,iBAAiBC,OAAON,cAAc,IAAIuB;AAAAA,MAE5DE,UAAU;AAAA,IAAA,CACX,CAAC;AAAA,EAAA,CACQ;AAEhB;"}
+{"version":3,"file":"Navigation.js","sources":["../../../../../../src/components/Calendar/CalendarNavigation/Navigation/Navigation.tsx"],"sourcesContent":["import {\n  DropLeftXS as DropLeftIcon,\n  DropRightXS as DropRightIcon,\n} from \"@hitachivantara/uikit-react-icons\";\n\nimport { isKey } from \"@core/utils/keyboardUtils\";\nimport { setId } from \"@core/utils/setId\";\nimport { HvTypography } from \"@core/components/Typography\";\nimport { HvBaseProps } from \"@core/types/generic\";\n\nimport { ExtractNames } from \"@core/utils/classes\";\n\nimport { staticClasses, useClasses } from \"./Navigation.styles\";\n\nexport { staticClasses as navigationClasses };\n\nexport type HvNavigationClasses = ExtractNames<typeof useClasses>;\n\nexport const Navigation = ({\n  id,\n  classes: classesProp,\n  onNavigatePrevious,\n  onNavigateNext,\n  onTextClick,\n  navigationText = \"n/a\",\n  isPreviousEnabled = true,\n  isNextEnabled = true,\n}: NavigationProps) => {\n  const { classes, cx } = useClasses(classesProp);\n\n  const onkeyDownHandler = (event, funcAction) => {\n    if (isKey(event, \"Enter\") || isKey(event, \"Space\")) {\n      event.preventDefault();\n      funcAction(event);\n    }\n  };\n\n  const onTextClickIsFunction = typeof onTextClick === \"function\";\n\n  return (\n    <div className={classes.root}>\n      <DropLeftIcon\n        id={setId(id, \"left\")}\n        className={cx(classes.icon, {\n          [classes.disabled]: !isPreviousEnabled,\n        })}\n        onClick={\n          isPreviousEnabled ? (event) => onNavigatePrevious(event) : undefined\n        }\n        onKeyDown={(event) =>\n          isNextEnabled\n            ? onkeyDownHandler(event, onNavigatePrevious)\n            : undefined\n        }\n        tabIndex={0}\n      />\n\n      <div\n        id={id}\n        className={cx({\n          [classes.text]: onTextClickIsFunction,\n          [classes.textWithoutHover]: !onTextClickIsFunction,\n        })}\n        role=\"presentation\"\n        onClick={onTextClick}\n        onKeyDown={\n          onTextClick && ((event) => onkeyDownHandler(event, onTextClick))\n        }\n        // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex\n        tabIndex={onTextClick ? 0 : -1}\n      >\n        <HvTypography variant=\"body\">{navigationText}</HvTypography>\n      </div>\n\n      <DropRightIcon\n        id={setId(id, \"right\")}\n        className={cx(classes.icon, {\n          [classes.disabled]: !isNextEnabled,\n        })}\n        onClick={isNextEnabled ? (event) => onNavigateNext(event) : undefined}\n        onKeyDown={(event) =>\n          isNextEnabled ? onkeyDownHandler(event, onNavigateNext) : undefined\n        }\n        tabIndex={0}\n      />\n    </div>\n  );\n};\n\nexport interface NavigationProps extends HvBaseProps {\n  /**\n   * Identifier.\n   */\n  id?: string;\n  /**\n   * A Jss Object used to override or extend the component styles.\n   */\n  classes?: HvNavigationClasses;\n  /**\n   * A function to be executed whenever the navigate previous action is triggered.\n   */\n  onNavigatePrevious: (event: React.MouseEvent<HTMLDivElement>) => void;\n  /**\n   * A function to be executed whenever the navigate next action is triggered.\n   */\n  onNavigateNext: (event: React.MouseEvent<HTMLDivElement>) => void;\n  /**\n   * A function to be executed whenever the text is clicked.\n   */\n  onTextClick?: () => void;\n  /**\n   * The text that will be shown between the navigation buttons.\n   */\n  navigationText?: string;\n  /**\n   * Flag stating if the previous button should be enabled or disabled.\n   */\n  isPreviousEnabled?: boolean;\n  /**\n   * Flag stating if the next button should be enabled or disabled.\n   */\n  isNextEnabled?: boolean;\n}\n"],"names":["Navigation","id","classes","classesProp","onNavigatePrevious","onNavigateNext","onTextClick","navigationText","isPreviousEnabled","isNextEnabled","cx","useClasses","onkeyDownHandler","event","funcAction","isKey","preventDefault","onTextClickIsFunction","className","root","children","_jsx","DropLeftIcon","setId","icon","disabled","onClick","undefined","onKeyDown","tabIndex","text","textWithoutHover","role","HvTypography","variant","DropRightIcon"],"mappings":";;;;;;;AAkBO,MAAMA,aAAaA,CAAC;AAAA,EACzBC;AAAAA,EACAC,SAASC;AAAAA,EACTC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC,iBAAiB;AAAA,EACjBC,oBAAoB;AAAA,EACpBC,gBAAgB;AACD,MAAM;AACf,QAAA;AAAA,IAAEP;AAAAA,IAASQ;AAAAA,EAAAA,IAAOC,WAAWR,WAAW;AAExCS,QAAAA,mBAAmBA,CAACC,OAAOC,eAAe;AAC9C,QAAIC,MAAMF,OAAO,OAAO,KAAKE,MAAMF,OAAO,OAAO,GAAG;AAClDA,YAAMG,eAAe;AACrBF,iBAAWD,KAAK;AAAA,IAClB;AAAA,EAAA;AAGII,QAAAA,wBAAwB,OAAOX,gBAAgB;AAErD,8BACE,OAAA;AAAA,IAAKY,WAAWhB,QAAQiB;AAAAA,IAAKC,UAAA,CAC3BC,oBAACC,YAAY;AAAA,MACXrB,IAAIsB,MAAMtB,IAAI,MAAM;AAAA,MACpBiB,WAAWR,GAAGR,QAAQsB,MAAM;AAAA,QAC1B,CAACtB,QAAQuB,QAAQ,GAAG,CAACjB;AAAAA,MAAAA,CACtB;AAAA,MACDkB,SACElB,oBAAqBK,CAAUT,UAAAA,mBAAmBS,KAAK,IAAIc;AAAAA,MAE7DC,WAAYf,CACVJ,UAAAA,gBACIG,iBAAiBC,OAAOT,kBAAkB,IAC1CuB;AAAAA,MAENE,UAAU;AAAA,IAAA,CACX,GAEDR,oBAAA,OAAA;AAAA,MACEpB;AAAAA,MACAiB,WAAWR,GAAG;AAAA,QACZ,CAACR,QAAQ4B,IAAI,GAAGb;AAAAA,QAChB,CAACf,QAAQ6B,gBAAgB,GAAG,CAACd;AAAAA,MAAAA,CAC9B;AAAA,MACDe,MAAK;AAAA,MACLN,SAASpB;AAAAA,MACTsB,WACEtB,gBAAiBO,CAAUD,UAAAA,iBAAiBC,OAAOP,WAAW;AAAA,MAGhEuB,UAAUvB,cAAc,IAAI;AAAA,MAAGc,8BAE9Ba,cAAY;AAAA,QAACC,SAAQ;AAAA,QAAMd,UAAEb;AAAAA,MAAAA,CAA6B;AAAA,IAAA,CACxD,GAELc,oBAACc,aAAa;AAAA,MACZlC,IAAIsB,MAAMtB,IAAI,OAAO;AAAA,MACrBiB,WAAWR,GAAGR,QAAQsB,MAAM;AAAA,QAC1B,CAACtB,QAAQuB,QAAQ,GAAG,CAAChB;AAAAA,MAAAA,CACtB;AAAA,MACDiB,SAASjB,gBAAiBI,CAAUR,UAAAA,eAAeQ,KAAK,IAAIc;AAAAA,MAC5DC,WAAYf,CACVJ,UAAAA,gBAAgBG,iBAAiBC,OAAOR,cAAc,IAAIsB;AAAAA,MAE5DE,UAAU;AAAA,IAAA,CACX,CAAC;AAAA,EAAA,CACC;AAET;"}

package/dist/esm/components/Calendar/CalendarNavigation/Navigation/Navigation.styles.js

@@ -1,76 +1,34 @@
-import _styled from "@emotion/styled/base";
-import { DropLeftXS, DropRightXS } from "@hitachivantara/uikit-react-icons";
 import { theme } from "@hitachivantara/uikit-styles";
 import { outlineStyles } from "../../../../utils/focusUtils.js";
-import navigationClasses from "./navigationClasses.js";
-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("div", process.env.NODE_ENV === "production" ? {
-  target: "e1ozyvih3"
-} : {
-  target: "e1ozyvih3",
-  label: "StyledRoot"
-})(process.env.NODE_ENV === "production" ? {
-  name: "bcffy2",
-  styles: "display:flex;align-items:center;justify-content:space-between"
-} : {
-  name: "bcffy2",
-  styles: "display:flex;align-items:center;justify-content:space-between",
-  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvQ2FsZW5kYXIvQ2FsZW5kYXJOYXZpZ2F0aW9uL05hdmlnYXRpb24vTmF2aWdhdGlvbi5zdHlsZXMudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQVkwQiIsImZpbGUiOiIvaG9tZS9ydW5uZXIvd29yay9odi11aWtpdC1yZWFjdC9odi11aWtpdC1yZWFjdC9wYWNrYWdlcy9jb3JlL3NyYy9jb21wb25lbnRzL0NhbGVuZGFyL0NhbGVuZGFyTmF2aWdhdGlvbi9OYXZpZ2F0aW9uL05hdmlnYXRpb24uc3R5bGVzLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuXG5pbXBvcnQge1xuICBEcm9wTGVmdFhTIGFzIERyb3BMZWZ0SWNvbixcbiAgRHJvcFJpZ2h0WFMgYXMgRHJvcFJpZ2h0SWNvbixcbn0gZnJvbSBcIkBoaXRhY2hpdmFudGFyYS91aWtpdC1yZWFjdC1pY29uc1wiO1xuaW1wb3J0IHsgdGhlbWUgfSBmcm9tIFwiQGhpdGFjaGl2YW50YXJhL3Vpa2l0LXN0eWxlc1wiO1xuXG5pbXBvcnQgeyBvdXRsaW5lU3R5bGVzIH0gZnJvbSBcIkBjb3JlL3V0aWxzL2ZvY3VzVXRpbHNcIjtcblxuaW1wb3J0IG5hdmlnYXRpb25DbGFzc2VzIGZyb20gXCIuL25hdmlnYXRpb25DbGFzc2VzXCI7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRSb290ID0gc3R5bGVkKFwiZGl2XCIpKHtcbiAgZGlzcGxheTogXCJmbGV4XCIsXG4gIGFsaWduSXRlbXM6IFwiY2VudGVyXCIsXG4gIGp1c3RpZnlDb250ZW50OiBcInNwYWNlLWJldHdlZW5cIixcbn0pO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkRHJvcExlZnRJY29uID0gc3R5bGVkKERyb3BMZWZ0SWNvbikoe1xuICB1c2VyU2VsZWN0OiBcIm5vbmVcIixcbiAgd2lkdGg6IFwiMzJweFwiLFxuICBoZWlnaHQ6IFwiMzJweFwiLFxuICBcIiY6aG92ZXJcIjoge1xuICAgIGJhY2tncm91bmRDb2xvcjogdGhlbWUuY29sb3JzLmF0bW8zLFxuICAgIGN1cnNvcjogXCJwb2ludGVyXCIsXG4gIH0sXG4gIFwiJjpmb2N1c1wiOiB7XG4gICAgb3V0bGluZTogXCJub25lXCIsXG4gIH0sXG4gIFwiJjpmb2N1cy12aXNpYmxlXCI6IHtcbiAgICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmNvbG9ycy5hdG1vMyxcbiAgICBjdXJzb3I6IFwicG9pbnRlclwiLFxuICAgIC4uLm91dGxpbmVTdHlsZXMsXG4gIH0sXG59KTtcblxuZXhwb3J0IGNvbnN0IFN0eWxlZERyb3BSaWdodEljb24gPSBzdHlsZWQoRHJvcFJpZ2h0SWNvbikoe1xuICB1c2VyU2VsZWN0OiBcIm5vbmVcIixcbiAgd2lkdGg6IFwiMzJweFwiLFxuICBoZWlnaHQ6IFwiMzJweFwiLFxuICBcIiY6aG92ZXJcIjoge1xuICAgIGJhY2tncm91bmRDb2xvcjogdGhlbWUuY29sb3JzLmF0bW8zLFxuICAgIGN1cnNvcjogXCJwb2ludGVyXCIsXG4gIH0sXG4gIFwiJjpmb2N1c1wiOiB7XG4gICAgb3V0bGluZTogXCJub25lXCIsXG4gIH0sXG4gIFwiJjpmb2N1cy12aXNpYmxlXCI6IHtcbiAgICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmNvbG9ycy5hdG1vMyxcbiAgICBjdXJzb3I6IFwicG9pbnRlclwiLFxuICAgIC4uLm91dGxpbmVTdHlsZXMsXG4gIH0sXG59KTtcblxuZXhwb3J0IGNvbnN0IFN0eWxlZFRleHQgPSBzdHlsZWQoXCJkaXZcIikoe1xuICBbYCYuJHtuYXZpZ2F0aW9uQ2xhc3Nlcy50ZXh0fWBdOiB7XG4gICAgd2lkdGg6IFwiY2FsYygxMDAlIC0gNjRweClcIixcbiAgICB0ZXh0QWxpZ246IFwiY2VudGVyXCIsXG4gICAgaGVpZ2h0OiBcIjMycHhcIixcbiAgICBwYWRkaW5nOiBcIjhweCAwXCIsXG4gICAgXCImOmhvdmVyXCI6IHtcbiAgICAgIGJhY2tncm91bmRDb2xvcjogdGhlbWUuY29sb3JzLmF0bW8zLFxuICAgICAgY3Vyc29yOiBcInBvaW50ZXJcIixcbiAgICB9LFxuICAgIFwiJjpmb2N1c1wiOiB7XG4gICAgICBvdXRsaW5lOiBcIm5vbmVcIixcbiAgICB9LFxuICAgIFwiJjpmb2N1cy12aXNpYmxlXCI6IHtcbiAgICAgIGJhY2tncm91bmRDb2xvcjogdGhlbWUuY29sb3JzLmF0bW8zLFxuICAgICAgY3Vyc29yOiBcInBvaW50ZXJcIixcbiAgICAgIC4uLm91dGxpbmVTdHlsZXMsXG4gICAgfSxcbiAgfSxcbiAgW2AmLiR7bmF2aWdhdGlvbkNsYXNzZXMudGV4dFdpdGhvdXRIb3Zlcn1gXToge1xuICAgIHdpZHRoOiBcImNhbGMoMTAwJSAtIDY0cHgpXCIsXG4gICAgdGV4dEFsaWduOiBcImNlbnRlclwiLFxuICAgIHBhZGRpbmc6IFwiMCA1cHhcIixcbiAgICBvdXRsaW5lOiBcIm5vbmVcIixcbiAgfSxcbn0pO1xuIl19 */",
-  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
-});
-const StyledDropLeftIcon = /* @__PURE__ */ _styled(DropLeftXS, process.env.NODE_ENV === "production" ? {
-  target: "e1ozyvih2"
-} : {
-  target: "e1ozyvih2",
-  label: "StyledDropLeftIcon"
-})({
-  userSelect: "none",
-  width: "32px",
-  height: "32px",
-  "&:hover": {
-    backgroundColor: theme.colors.atmo3,
-    cursor: "pointer"
-  },
-  "&:focus": {
-    outline: "none"
+import { createClasses } from "../../../../utils/classes.js";
+const {
+  staticClasses,
+  useClasses
+} = createClasses("HvNavigation", {
+  root: {
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "space-between"
   },
-  "&:focus-visible": {
-    backgroundColor: theme.colors.atmo3,
-    cursor: "pointer",
-    ...outlineStyles
-  }
-}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvQ2FsZW5kYXIvQ2FsZW5kYXJOYXZpZ2F0aW9uL05hdmlnYXRpb24vTmF2aWdhdGlvbi5zdHlsZXMudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQWtCa0MiLCJmaWxlIjoiL2hvbWUvcnVubmVyL3dvcmsvaHYtdWlraXQtcmVhY3QvaHYtdWlraXQtcmVhY3QvcGFja2FnZXMvY29yZS9zcmMvY29tcG9uZW50cy9DYWxlbmRhci9DYWxlbmRhck5hdmlnYXRpb24vTmF2aWdhdGlvbi9OYXZpZ2F0aW9uLnN0eWxlcy50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgc3R5bGVkIGZyb20gXCJAZW1vdGlvbi9zdHlsZWRcIjtcblxuaW1wb3J0IHtcbiAgRHJvcExlZnRYUyBhcyBEcm9wTGVmdEljb24sXG4gIERyb3BSaWdodFhTIGFzIERyb3BSaWdodEljb24sXG59IGZyb20gXCJAaGl0YWNoaXZhbnRhcmEvdWlraXQtcmVhY3QtaWNvbnNcIjtcbmltcG9ydCB7IHRoZW1lIH0gZnJvbSBcIkBoaXRhY2hpdmFudGFyYS91aWtpdC1zdHlsZXNcIjtcblxuaW1wb3J0IHsgb3V0bGluZVN0eWxlcyB9IGZyb20gXCJAY29yZS91dGlscy9mb2N1c1V0aWxzXCI7XG5cbmltcG9ydCBuYXZpZ2F0aW9uQ2xhc3NlcyBmcm9tIFwiLi9uYXZpZ2F0aW9uQ2xhc3Nlc1wiO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkUm9vdCA9IHN0eWxlZChcImRpdlwiKSh7XG4gIGRpc3BsYXk6IFwiZmxleFwiLFxuICBhbGlnbkl0ZW1zOiBcImNlbnRlclwiLFxuICBqdXN0aWZ5Q29udGVudDogXCJzcGFjZS1iZXR3ZWVuXCIsXG59KTtcblxuZXhwb3J0IGNvbnN0IFN0eWxlZERyb3BMZWZ0SWNvbiA9IHN0eWxlZChEcm9wTGVmdEljb24pKHtcbiAgdXNlclNlbGVjdDogXCJub25lXCIsXG4gIHdpZHRoOiBcIjMycHhcIixcbiAgaGVpZ2h0OiBcIjMycHhcIixcbiAgXCImOmhvdmVyXCI6IHtcbiAgICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmNvbG9ycy5hdG1vMyxcbiAgICBjdXJzb3I6IFwicG9pbnRlclwiLFxuICB9LFxuICBcIiY6Zm9jdXNcIjoge1xuICAgIG91dGxpbmU6IFwibm9uZVwiLFxuICB9LFxuICBcIiY6Zm9jdXMtdmlzaWJsZVwiOiB7XG4gICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS5jb2xvcnMuYXRtbzMsXG4gICAgY3Vyc29yOiBcInBvaW50ZXJcIixcbiAgICAuLi5vdXRsaW5lU3R5bGVzLFxuICB9LFxufSk7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWREcm9wUmlnaHRJY29uID0gc3R5bGVkKERyb3BSaWdodEljb24pKHtcbiAgdXNlclNlbGVjdDogXCJub25lXCIsXG4gIHdpZHRoOiBcIjMycHhcIixcbiAgaGVpZ2h0OiBcIjMycHhcIixcbiAgXCImOmhvdmVyXCI6IHtcbiAgICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmNvbG9ycy5hdG1vMyxcbiAgICBjdXJzb3I6IFwicG9pbnRlclwiLFxuICB9LFxuICBcIiY6Zm9jdXNcIjoge1xuICAgIG91dGxpbmU6IFwibm9uZVwiLFxuICB9LFxuICBcIiY6Zm9jdXMtdmlzaWJsZVwiOiB7XG4gICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS5jb2xvcnMuYXRtbzMsXG4gICAgY3Vyc29yOiBcInBvaW50ZXJcIixcbiAgICAuLi5vdXRsaW5lU3R5bGVzLFxuICB9LFxufSk7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRUZXh0ID0gc3R5bGVkKFwiZGl2XCIpKHtcbiAgW2AmLiR7bmF2aWdhdGlvbkNsYXNzZXMudGV4dH1gXToge1xuICAgIHdpZHRoOiBcImNhbGMoMTAwJSAtIDY0cHgpXCIsXG4gICAgdGV4dEFsaWduOiBcImNlbnRlclwiLFxuICAgIGhlaWdodDogXCIzMnB4XCIsXG4gICAgcGFkZGluZzogXCI4cHggMFwiLFxuICAgIFwiJjpob3ZlclwiOiB7XG4gICAgICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmNvbG9ycy5hdG1vMyxcbiAgICAgIGN1cnNvcjogXCJwb2ludGVyXCIsXG4gICAgfSxcbiAgICBcIiY6Zm9jdXNcIjoge1xuICAgICAgb3V0bGluZTogXCJub25lXCIsXG4gICAgfSxcbiAgICBcIiY6Zm9jdXMtdmlzaWJsZVwiOiB7XG4gICAgICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmNvbG9ycy5hdG1vMyxcbiAgICAgIGN1cnNvcjogXCJwb2ludGVyXCIsXG4gICAgICAuLi5vdXRsaW5lU3R5bGVzLFxuICAgIH0sXG4gIH0sXG4gIFtgJi4ke25hdmlnYXRpb25DbGFzc2VzLnRleHRXaXRob3V0SG92ZXJ9YF06IHtcbiAgICB3aWR0aDogXCJjYWxjKDEwMCUgLSA2NHB4KVwiLFxuICAgIHRleHRBbGlnbjogXCJjZW50ZXJcIixcbiAgICBwYWRkaW5nOiBcIjAgNXB4XCIsXG4gICAgb3V0bGluZTogXCJub25lXCIsXG4gIH0sXG59KTtcbiJdfQ== */");
-const StyledDropRightIcon = /* @__PURE__ */ _styled(DropRightXS, process.env.NODE_ENV === "production" ? {
-  target: "e1ozyvih1"
-} : {
-  target: "e1ozyvih1",
-  label: "StyledDropRightIcon"
-})({
-  userSelect: "none",
-  width: "32px",
-  height: "32px",
-  "&:hover": {
-    backgroundColor: theme.colors.atmo3,
-    cursor: "pointer"
-  },
-  "&:focus": {
-    outline: "none"
+  icon: {
+    userSelect: "none",
+    width: "32px",
+    height: "32px",
+    "&:hover": {
+      backgroundColor: theme.colors.atmo3,
+      cursor: "pointer"
+    },
+    "&:focus": {
+      outline: "none"
+    },
+    "&:focus-visible": {
+      backgroundColor: theme.colors.atmo3,
+      cursor: "pointer",
+      ...outlineStyles
+    }
   },
-  "&:focus-visible": {
-    backgroundColor: theme.colors.atmo3,
-    cursor: "pointer",
-    ...outlineStyles
-  }
-}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvQ2FsZW5kYXIvQ2FsZW5kYXJOYXZpZ2F0aW9uL05hdmlnYXRpb24vTmF2aWdhdGlvbi5zdHlsZXMudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQW9DbUMiLCJmaWxlIjoiL2hvbWUvcnVubmVyL3dvcmsvaHYtdWlraXQtcmVhY3QvaHYtdWlraXQtcmVhY3QvcGFja2FnZXMvY29yZS9zcmMvY29tcG9uZW50cy9DYWxlbmRhci9DYWxlbmRhck5hdmlnYXRpb24vTmF2aWdhdGlvbi9OYXZpZ2F0aW9uLnN0eWxlcy50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgc3R5bGVkIGZyb20gXCJAZW1vdGlvbi9zdHlsZWRcIjtcblxuaW1wb3J0IHtcbiAgRHJvcExlZnRYUyBhcyBEcm9wTGVmdEljb24sXG4gIERyb3BSaWdodFhTIGFzIERyb3BSaWdodEljb24sXG59IGZyb20gXCJAaGl0YWNoaXZhbnRhcmEvdWlraXQtcmVhY3QtaWNvbnNcIjtcbmltcG9ydCB7IHRoZW1lIH0gZnJvbSBcIkBoaXRhY2hpdmFudGFyYS91aWtpdC1zdHlsZXNcIjtcblxuaW1wb3J0IHsgb3V0bGluZVN0eWxlcyB9IGZyb20gXCJAY29yZS91dGlscy9mb2N1c1V0aWxzXCI7XG5cbmltcG9ydCBuYXZpZ2F0aW9uQ2xhc3NlcyBmcm9tIFwiLi9uYXZpZ2F0aW9uQ2xhc3Nlc1wiO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkUm9vdCA9IHN0eWxlZChcImRpdlwiKSh7XG4gIGRpc3BsYXk6IFwiZmxleFwiLFxuICBhbGlnbkl0ZW1zOiBcImNlbnRlclwiLFxuICBqdXN0aWZ5Q29udGVudDogXCJzcGFjZS1iZXR3ZWVuXCIsXG59KTtcblxuZXhwb3J0IGNvbnN0IFN0eWxlZERyb3BMZWZ0SWNvbiA9IHN0eWxlZChEcm9wTGVmdEljb24pKHtcbiAgdXNlclNlbGVjdDogXCJub25lXCIsXG4gIHdpZHRoOiBcIjMycHhcIixcbiAgaGVpZ2h0OiBcIjMycHhcIixcbiAgXCImOmhvdmVyXCI6IHtcbiAgICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmNvbG9ycy5hdG1vMyxcbiAgICBjdXJzb3I6IFwicG9pbnRlclwiLFxuICB9LFxuICBcIiY6Zm9jdXNcIjoge1xuICAgIG91dGxpbmU6IFwibm9uZVwiLFxuICB9LFxuICBcIiY6Zm9jdXMtdmlzaWJsZVwiOiB7XG4gICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS5jb2xvcnMuYXRtbzMsXG4gICAgY3Vyc29yOiBcInBvaW50ZXJcIixcbiAgICAuLi5vdXRsaW5lU3R5bGVzLFxuICB9LFxufSk7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWREcm9wUmlnaHRJY29uID0gc3R5bGVkKERyb3BSaWdodEljb24pKHtcbiAgdXNlclNlbGVjdDogXCJub25lXCIsXG4gIHdpZHRoOiBcIjMycHhcIixcbiAgaGVpZ2h0OiBcIjMycHhcIixcbiAgXCImOmhvdmVyXCI6IHtcbiAgICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmNvbG9ycy5hdG1vMyxcbiAgICBjdXJzb3I6IFwicG9pbnRlclwiLFxuICB9LFxuICBcIiY6Zm9jdXNcIjoge1xuICAgIG91dGxpbmU6IFwibm9uZVwiLFxuICB9LFxuICBcIiY6Zm9jdXMtdmlzaWJsZVwiOiB7XG4gICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS5jb2xvcnMuYXRtbzMsXG4gICAgY3Vyc29yOiBcInBvaW50ZXJcIixcbiAgICAuLi5vdXRsaW5lU3R5bGVzLFxuICB9LFxufSk7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRUZXh0ID0gc3R5bGVkKFwiZGl2XCIpKHtcbiAgW2AmLiR7bmF2aWdhdGlvbkNsYXNzZXMudGV4dH1gXToge1xuICAgIHdpZHRoOiBcImNhbGMoMTAwJSAtIDY0cHgpXCIsXG4gICAgdGV4dEFsaWduOiBcImNlbnRlclwiLFxuICAgIGhlaWdodDogXCIzMnB4XCIsXG4gICAgcGFkZGluZzogXCI4cHggMFwiLFxuICAgIFwiJjpob3ZlclwiOiB7XG4gICAgICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmNvbG9ycy5hdG1vMyxcbiAgICAgIGN1cnNvcjogXCJwb2ludGVyXCIsXG4gICAgfSxcbiAgICBcIiY6Zm9jdXNcIjoge1xuICAgICAgb3V0bGluZTogXCJub25lXCIsXG4gICAgfSxcbiAgICBcIiY6Zm9jdXMtdmlzaWJsZVwiOiB7XG4gICAgICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmNvbG9ycy5hdG1vMyxcbiAgICAgIGN1cnNvcjogXCJwb2ludGVyXCIsXG4gICAgICAuLi5vdXRsaW5lU3R5bGVzLFxuICAgIH0sXG4gIH0sXG4gIFtgJi4ke25hdmlnYXRpb25DbGFzc2VzLnRleHRXaXRob3V0SG92ZXJ9YF06IHtcbiAgICB3aWR0aDogXCJjYWxjKDEwMCUgLSA2NHB4KVwiLFxuICAgIHRleHRBbGlnbjogXCJjZW50ZXJcIixcbiAgICBwYWRkaW5nOiBcIjAgNXB4XCIsXG4gICAgb3V0bGluZTogXCJub25lXCIsXG4gIH0sXG59KTtcbiJdfQ== */");
-const StyledText = /* @__PURE__ */ _styled("div", process.env.NODE_ENV === "production" ? {
-  target: "e1ozyvih0"
-} : {
-  target: "e1ozyvih0",
-  label: "StyledText"
-})({
-  [`&.${navigationClasses.text}`]: {
+  disabled: {},
+  text: {
     width: "calc(100% - 64px)",
     textAlign: "center",
     height: "32px",
@@ -88,17 +46,15 @@ const StyledText = /* @__PURE__ */ _styled("div", process.env.NODE_ENV === "prod
       ...outlineStyles
     }
   },
-  [`&.${navigationClasses.textWithoutHover}`]: {
+  textWithoutHover: {
     width: "calc(100% - 64px)",
     textAlign: "center",
     padding: "0 5px",
     outline: "none"
   }
-}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvQ2FsZW5kYXIvQ2FsZW5kYXJOYXZpZ2F0aW9uL05hdmlnYXRpb24vTmF2aWdhdGlvbi5zdHlsZXMudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQXNEMEIiLCJmaWxlIjoiL2hvbWUvcnVubmVyL3dvcmsvaHYtdWlraXQtcmVhY3QvaHYtdWlraXQtcmVhY3QvcGFja2FnZXMvY29yZS9zcmMvY29tcG9uZW50cy9DYWxlbmRhci9DYWxlbmRhck5hdmlnYXRpb24vTmF2aWdhdGlvbi9OYXZpZ2F0aW9uLnN0eWxlcy50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgc3R5bGVkIGZyb20gXCJAZW1vdGlvbi9zdHlsZWRcIjtcblxuaW1wb3J0IHtcbiAgRHJvcExlZnRYUyBhcyBEcm9wTGVmdEljb24sXG4gIERyb3BSaWdodFhTIGFzIERyb3BSaWdodEljb24sXG59IGZyb20gXCJAaGl0YWNoaXZhbnRhcmEvdWlraXQtcmVhY3QtaWNvbnNcIjtcbmltcG9ydCB7IHRoZW1lIH0gZnJvbSBcIkBoaXRhY2hpdmFudGFyYS91aWtpdC1zdHlsZXNcIjtcblxuaW1wb3J0IHsgb3V0bGluZVN0eWxlcyB9IGZyb20gXCJAY29yZS91dGlscy9mb2N1c1V0aWxzXCI7XG5cbmltcG9ydCBuYXZpZ2F0aW9uQ2xhc3NlcyBmcm9tIFwiLi9uYXZpZ2F0aW9uQ2xhc3Nlc1wiO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkUm9vdCA9IHN0eWxlZChcImRpdlwiKSh7XG4gIGRpc3BsYXk6IFwiZmxleFwiLFxuICBhbGlnbkl0ZW1zOiBcImNlbnRlclwiLFxuICBqdXN0aWZ5Q29udGVudDogXCJzcGFjZS1iZXR3ZWVuXCIsXG59KTtcblxuZXhwb3J0IGNvbnN0IFN0eWxlZERyb3BMZWZ0SWNvbiA9IHN0eWxlZChEcm9wTGVmdEljb24pKHtcbiAgdXNlclNlbGVjdDogXCJub25lXCIsXG4gIHdpZHRoOiBcIjMycHhcIixcbiAgaGVpZ2h0OiBcIjMycHhcIixcbiAgXCImOmhvdmVyXCI6IHtcbiAgICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmNvbG9ycy5hdG1vMyxcbiAgICBjdXJzb3I6IFwicG9pbnRlclwiLFxuICB9LFxuICBcIiY6Zm9jdXNcIjoge1xuICAgIG91dGxpbmU6IFwibm9uZVwiLFxuICB9LFxuICBcIiY6Zm9jdXMtdmlzaWJsZVwiOiB7XG4gICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS5jb2xvcnMuYXRtbzMsXG4gICAgY3Vyc29yOiBcInBvaW50ZXJcIixcbiAgICAuLi5vdXRsaW5lU3R5bGVzLFxuICB9LFxufSk7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWREcm9wUmlnaHRJY29uID0gc3R5bGVkKERyb3BSaWdodEljb24pKHtcbiAgdXNlclNlbGVjdDogXCJub25lXCIsXG4gIHdpZHRoOiBcIjMycHhcIixcbiAgaGVpZ2h0OiBcIjMycHhcIixcbiAgXCImOmhvdmVyXCI6IHtcbiAgICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmNvbG9ycy5hdG1vMyxcbiAgICBjdXJzb3I6IFwicG9pbnRlclwiLFxuICB9LFxuICBcIiY6Zm9jdXNcIjoge1xuICAgIG91dGxpbmU6IFwibm9uZVwiLFxuICB9LFxuICBcIiY6Zm9jdXMtdmlzaWJsZVwiOiB7XG4gICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS5jb2xvcnMuYXRtbzMsXG4gICAgY3Vyc29yOiBcInBvaW50ZXJcIixcbiAgICAuLi5vdXRsaW5lU3R5bGVzLFxuICB9LFxufSk7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRUZXh0ID0gc3R5bGVkKFwiZGl2XCIpKHtcbiAgW2AmLiR7bmF2aWdhdGlvbkNsYXNzZXMudGV4dH1gXToge1xuICAgIHdpZHRoOiBcImNhbGMoMTAwJSAtIDY0cHgpXCIsXG4gICAgdGV4dEFsaWduOiBcImNlbnRlclwiLFxuICAgIGhlaWdodDogXCIzMnB4XCIsXG4gICAgcGFkZGluZzogXCI4cHggMFwiLFxuICAgIFwiJjpob3ZlclwiOiB7XG4gICAgICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmNvbG9ycy5hdG1vMyxcbiAgICAgIGN1cnNvcjogXCJwb2ludGVyXCIsXG4gICAgfSxcbiAgICBcIiY6Zm9jdXNcIjoge1xuICAgICAgb3V0bGluZTogXCJub25lXCIsXG4gICAgfSxcbiAgICBcIiY6Zm9jdXMtdmlzaWJsZVwiOiB7XG4gICAgICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmNvbG9ycy5hdG1vMyxcbiAgICAgIGN1cnNvcjogXCJwb2ludGVyXCIsXG4gICAgICAuLi5vdXRsaW5lU3R5bGVzLFxuICAgIH0sXG4gIH0sXG4gIFtgJi4ke25hdmlnYXRpb25DbGFzc2VzLnRleHRXaXRob3V0SG92ZXJ9YF06IHtcbiAgICB3aWR0aDogXCJjYWxjKDEwMCUgLSA2NHB4KVwiLFxuICAgIHRleHRBbGlnbjogXCJjZW50ZXJcIixcbiAgICBwYWRkaW5nOiBcIjAgNXB4XCIsXG4gICAgb3V0bGluZTogXCJub25lXCIsXG4gIH0sXG59KTtcbiJdfQ== */");
+});
 export {
-  StyledDropLeftIcon,
-  StyledDropRightIcon,
-  StyledRoot,
-  StyledText
+  staticClasses,
+  useClasses
 };
 //# sourceMappingURL=Navigation.styles.js.map

package/dist/esm/components/Calendar/CalendarNavigation/Navigation/Navigation.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Navigation.styles.js","sources":["../../../../../../src/components/Calendar/CalendarNavigation/Navigation/Navigation.styles.tsx"],"sourcesContent":["import styled from \"@emotion/styled\";\n\nimport {\n  DropLeftXS as DropLeftIcon,\n  DropRightXS as DropRightIcon,\n} from \"@hitachivantara/uikit-react-icons\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { outlineStyles } from \"@core/utils/focusUtils\";\n\nimport navigationClasses from \"./navigationClasses\";\n\nexport const StyledRoot = styled(\"div\")({\n  display: \"flex\",\n  alignItems: \"center\",\n  justifyContent: \"space-between\",\n});\n\nexport const StyledDropLeftIcon = styled(DropLeftIcon)({\n  userSelect: \"none\",\n  width: \"32px\",\n  height: \"32px\",\n  \"&:hover\": {\n    backgroundColor: theme.colors.atmo3,\n    cursor: \"pointer\",\n  },\n  \"&:focus\": {\n    outline: \"none\",\n  },\n  \"&:focus-visible\": {\n    backgroundColor: theme.colors.atmo3,\n    cursor: \"pointer\",\n    ...outlineStyles,\n  },\n});\n\nexport const StyledDropRightIcon = styled(DropRightIcon)({\n  userSelect: \"none\",\n  width: \"32px\",\n  height: \"32px\",\n  \"&:hover\": {\n    backgroundColor: theme.colors.atmo3,\n    cursor: \"pointer\",\n  },\n  \"&:focus\": {\n    outline: \"none\",\n  },\n  \"&:focus-visible\": {\n    backgroundColor: theme.colors.atmo3,\n    cursor: \"pointer\",\n    ...outlineStyles,\n  },\n});\n\nexport const StyledText = styled(\"div\")({\n  [`&.${navigationClasses.text}`]: {\n    width: \"calc(100% - 64px)\",\n    textAlign: \"center\",\n    height: \"32px\",\n    padding: \"8px 0\",\n    \"&:hover\": {\n      backgroundColor: theme.colors.atmo3,\n      cursor: \"pointer\",\n    },\n    \"&:focus\": {\n      outline: \"none\",\n    },\n    \"&:focus-visible\": {\n      backgroundColor: theme.colors.atmo3,\n      cursor: \"pointer\",\n      ...outlineStyles,\n    },\n  },\n  [`&.${navigationClasses.textWithoutHover}`]: {\n    width: \"calc(100% - 64px)\",\n    textAlign: \"center\",\n    padding: \"0 5px\",\n    outline: \"none\",\n  },\n});\n"],"names":["StyledRoot","process","env","NODE_ENV","target","label","name","styles","map","toString","_EMOTION_STRINGIFIED_CSS_ERROR__","StyledDropLeftIcon","DropLeftIcon","userSelect","width","height","backgroundColor","theme","colors","atmo3","cursor","outline","outlineStyles","StyledDropRightIcon","DropRightIcon","StyledText","navigationClasses","text","textAlign","padding","textWithoutHover"],"mappings":";;;;;;;;AAYO,MAAMA,aAAoB,wBAAA,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,CAItC;AAEM,MAAMC,qBAA4BC,wBAAAA,YAAYX,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAC,OAAA;AAAA,CAAA,EAAE;AAAA,EACrDQ,YAAY;AAAA,EACZC,OAAO;AAAA,EACPC,QAAQ;AAAA,EACR,WAAW;AAAA,IACTC,iBAAiBC,MAAMC,OAAOC;AAAAA,IAC9BC,QAAQ;AAAA,EACV;AAAA,EACA,WAAW;AAAA,IACTC,SAAS;AAAA,EACX;AAAA,EACA,mBAAmB;AAAA,IACjBL,iBAAiBC,MAAMC,OAAOC;AAAAA,IAC9BC,QAAQ;AAAA,IACR,GAAGE;AAAAA,EACL;AACF,GAACrB,QAAAC,IAAAC,aAAC,eAAA,KAAA,6jGAAA;AAEK,MAAMoB,sBAA6BC,wBAAAA,aAAavB,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAC,OAAA;AAAA,CAAA,EAAE;AAAA,EACvDQ,YAAY;AAAA,EACZC,OAAO;AAAA,EACPC,QAAQ;AAAA,EACR,WAAW;AAAA,IACTC,iBAAiBC,MAAMC,OAAOC;AAAAA,IAC9BC,QAAQ;AAAA,EACV;AAAA,EACA,WAAW;AAAA,IACTC,SAAS;AAAA,EACX;AAAA,EACA,mBAAmB;AAAA,IACjBL,iBAAiBC,MAAMC,OAAOC;AAAAA,IAC9BC,QAAQ;AAAA,IACR,GAAGE;AAAAA,EACL;AACF,GAACrB,QAAAC,IAAAC,aAAC,eAAA,KAAA,6jGAAA;AAEK,MAAMsB,aAAoB,wBAAA,OAAKxB,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAC,OAAA;AAAA,CAAA,EAAE;AAAA,EACtC,CAAE,KAAIqB,kBAAkBC,MAAM,GAAG;AAAA,IAC/Bb,OAAO;AAAA,IACPc,WAAW;AAAA,IACXb,QAAQ;AAAA,IACRc,SAAS;AAAA,IACT,WAAW;AAAA,MACTb,iBAAiBC,MAAMC,OAAOC;AAAAA,MAC9BC,QAAQ;AAAA,IACV;AAAA,IACA,WAAW;AAAA,MACTC,SAAS;AAAA,IACX;AAAA,IACA,mBAAmB;AAAA,MACjBL,iBAAiBC,MAAMC,OAAOC;AAAAA,MAC9BC,QAAQ;AAAA,MACR,GAAGE;AAAAA,IACL;AAAA,EACF;AAAA,EACA,CAAE,KAAII,kBAAkBI,kBAAkB,GAAG;AAAA,IAC3ChB,OAAO;AAAA,IACPc,WAAW;AAAA,IACXC,SAAS;AAAA,IACTR,SAAS;AAAA,EACX;AACF,GAACpB,QAAAC,IAAAC,aAAC,eAAA,KAAA,6jGAAA;"}
+{"version":3,"file":"Navigation.styles.js","sources":["../../../../../../src/components/Calendar/CalendarNavigation/Navigation/Navigation.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { outlineStyles } from \"@core/utils/focusUtils\";\n\nimport { createClasses } from \"@core/utils/classes\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvNavigation\", {\n  root: {\n    display: \"flex\",\n    alignItems: \"center\",\n    justifyContent: \"space-between\",\n  },\n  icon: {\n    userSelect: \"none\",\n    width: \"32px\",\n    height: \"32px\",\n    \"&:hover\": {\n      backgroundColor: theme.colors.atmo3,\n      cursor: \"pointer\",\n    },\n    \"&:focus\": {\n      outline: \"none\",\n    },\n    \"&:focus-visible\": {\n      backgroundColor: theme.colors.atmo3,\n      cursor: \"pointer\",\n      ...outlineStyles,\n    },\n  },\n  disabled: {},\n  text: {\n    width: \"calc(100% - 64px)\",\n    textAlign: \"center\",\n    height: \"32px\",\n    padding: \"8px 0\",\n    \"&:hover\": {\n      backgroundColor: theme.colors.atmo3,\n      cursor: \"pointer\",\n    },\n    \"&:focus\": {\n      outline: \"none\",\n    },\n    \"&:focus-visible\": {\n      backgroundColor: theme.colors.atmo3,\n      cursor: \"pointer\",\n      ...outlineStyles,\n    },\n  },\n  textWithoutHover: {\n    width: \"calc(100% - 64px)\",\n    textAlign: \"center\",\n    padding: \"0 5px\",\n    outline: \"none\",\n  },\n});\n"],"names":["staticClasses","useClasses","createClasses","root","display","alignItems","justifyContent","icon","userSelect","width","height","backgroundColor","theme","colors","atmo3","cursor","outline","outlineStyles","disabled","text","textAlign","padding","textWithoutHover"],"mappings":";;;AAMa,MAAA;AAAA,EAAEA;AAAAA,EAAeC;AAAW,IAAIC,cAAc,gBAAgB;AAAA,EACzEC,MAAM;AAAA,IACJC,SAAS;AAAA,IACTC,YAAY;AAAA,IACZC,gBAAgB;AAAA,EAClB;AAAA,EACAC,MAAM;AAAA,IACJC,YAAY;AAAA,IACZC,OAAO;AAAA,IACPC,QAAQ;AAAA,IACR,WAAW;AAAA,MACTC,iBAAiBC,MAAMC,OAAOC;AAAAA,MAC9BC,QAAQ;AAAA,IACV;AAAA,IACA,WAAW;AAAA,MACTC,SAAS;AAAA,IACX;AAAA,IACA,mBAAmB;AAAA,MACjBL,iBAAiBC,MAAMC,OAAOC;AAAAA,MAC9BC,QAAQ;AAAA,MACR,GAAGE;AAAAA,IACL;AAAA,EACF;AAAA,EACAC,UAAU,CAAC;AAAA,EACXC,MAAM;AAAA,IACJV,OAAO;AAAA,IACPW,WAAW;AAAA,IACXV,QAAQ;AAAA,IACRW,SAAS;AAAA,IACT,WAAW;AAAA,MACTV,iBAAiBC,MAAMC,OAAOC;AAAAA,MAC9BC,QAAQ;AAAA,IACV;AAAA,IACA,WAAW;AAAA,MACTC,SAAS;AAAA,IACX;AAAA,IACA,mBAAmB;AAAA,MACjBL,iBAAiBC,MAAMC,OAAOC;AAAAA,MAC9BC,QAAQ;AAAA,MACR,GAAGE;AAAAA,IACL;AAAA,EACF;AAAA,EACAK,kBAAkB;AAAA,IAChBb,OAAO;AAAA,IACPW,WAAW;AAAA,IACXC,SAAS;AAAA,IACTL,SAAS;AAAA,EACX;AACF,CAAC;"}

package/dist/esm/components/Calendar/CalendarWeekLabels/CalendarWeekLabels.js

@@ -1,23 +1,27 @@
-import { clsx } from "clsx";
-import { StyledCalendarDay } from "./CalendarWeekLabels.styles.js";
-import calendarWeekLabelsClasses from "./calendarWeekLabelsClasses.js";
+import { useClasses } from "./CalendarWeekLabels.styles.js";
+import { staticClasses } from "./CalendarWeekLabels.styles.js";
 import { jsxs, Fragment, jsx } from "@emotion/react/jsx-runtime";
+import { HvTypography } from "../../Typography/Typography.js";
 const HvCalendarWeekLabel = ({
-  classes,
+  classes: classesProp,
   labels = []
 }) => {
+  const {
+    classes
+  } = useClasses(classesProp);
   return /* @__PURE__ */ jsxs(Fragment, {
     children: [" ", labels.map((dayName, index) => {
       const key = `${dayName}-${index}`;
-      return /* @__PURE__ */ jsx(StyledCalendarDay, {
+      return /* @__PURE__ */ jsx(HvTypography, {
         variant: "label",
-        className: clsx(calendarWeekLabelsClasses.calendarDay, classes == null ? void 0 : classes.calendarDay),
+        className: classes.calendarDay,
         children: dayName
       }, key);
     }), " "]
   });
 };
 export {
-  HvCalendarWeekLabel
+  HvCalendarWeekLabel,
+  staticClasses as calendarWeekLabelsClasses
 };
 //# sourceMappingURL=CalendarWeekLabels.js.map

package/dist/esm/components/Calendar/CalendarWeekLabels/CalendarWeekLabels.js.map

@@ -1 +1 @@
-{"version":3,"file":"CalendarWeekLabels.js","sources":["../../../../../src/components/Calendar/CalendarWeekLabels/CalendarWeekLabels.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { StyledCalendarDay } from \"./CalendarWeekLabels.styles\";\nimport calendarWeekLabelsClasses, {\n  HvCalendarWeekLabelsClasses,\n} from \"./calendarWeekLabelsClasses\";\n\nexport const HvCalendarWeekLabel = ({\n  classes,\n  labels = [],\n}: HvCalendarWeekLabelProps) => {\n  return (\n    <>\n      {\" \"}\n      {labels.map((dayName, index) => {\n        const key = `${dayName}-${index}`;\n        return (\n          <StyledCalendarDay\n            variant=\"label\"\n            className={clsx(\n              calendarWeekLabelsClasses.calendarDay,\n              classes?.calendarDay\n            )}\n            key={key}\n          >\n            {dayName}\n          </StyledCalendarDay>\n        );\n      })}{\" \"}\n    </>\n  );\n};\n\nexport type HvCalendarWeekLabelProps = {\n  /**\n   * A Jss Object used to override or extend the component styles.\n   */\n  classes?: HvCalendarWeekLabelsClasses;\n  /**\n   * Localized day of week labels.\n   */\n  labels?: string[];\n};\n"],"names":["HvCalendarWeekLabel","classes","labels","_Fragment","children","map","dayName","index","key","StyledCalendarDay","variant","className","clsx","calendarWeekLabelsClasses","calendarDay"],"mappings":";;;;AAMO,MAAMA,sBAAsBA,CAAC;AAAA,EAClCC;AAAAA,EACAC,SAAS,CAAA;AACe,MAAM;AAC9B,8BACEC,UAAA;AAAA,IAAAC,UAAA,CACG,KACAF,OAAOG,IAAI,CAACC,SAASC,UAAU;AACxBC,YAAAA,MAAO,GAAEF,WAAWC;AAC1B,iCACGE,mBAAiB;AAAA,QAChBC,SAAQ;AAAA,QACRC,WAAWC,KACTC,0BAA0BC,aAC1Bb,mCAASa,WACX;AAAA,QAAEV,UAGDE;AAAAA,SAFIE,GAGY;AAAA,IAEtB,CAAA,GAAG,GAAG;AAAA,EAAA,CACP;AAEN;"}
+{"version":3,"file":"CalendarWeekLabels.js","sources":["../../../../../src/components/Calendar/CalendarWeekLabels/CalendarWeekLabels.tsx"],"sourcesContent":["import { HvTypography } from \"@core/components/Typography\";\nimport { ExtractNames } from \"@core/utils/classes\";\n\nimport { staticClasses, useClasses } from \"./CalendarWeekLabels.styles\";\n\nexport { staticClasses as calendarWeekLabelsClasses };\n\nexport type HvCalendarWeekLabelsClasses = ExtractNames<typeof useClasses>;\n\nexport const HvCalendarWeekLabel = ({\n  classes: classesProp,\n  labels = [],\n}: HvCalendarWeekLabelProps) => {\n  const { classes } = useClasses(classesProp);\n\n  return (\n    <>\n      {\" \"}\n      {labels.map((dayName, index) => {\n        const key = `${dayName}-${index}`;\n        return (\n          <HvTypography\n            variant=\"label\"\n            className={classes.calendarDay}\n            key={key}\n          >\n            {dayName}\n          </HvTypography>\n        );\n      })}{\" \"}\n    </>\n  );\n};\n\nexport type HvCalendarWeekLabelProps = {\n  /**\n   * A Jss Object used to override or extend the component styles.\n   */\n  classes?: HvCalendarWeekLabelsClasses;\n  /**\n   * Localized day of week labels.\n   */\n  labels?: string[];\n};\n"],"names":["HvCalendarWeekLabel","classes","classesProp","labels","useClasses","_Fragment","children","map","dayName","index","key","HvTypography","variant","className","calendarDay"],"mappings":";;;;AASO,MAAMA,sBAAsBA,CAAC;AAAA,EAClCC,SAASC;AAAAA,EACTC,SAAS,CAAA;AACe,MAAM;AACxB,QAAA;AAAA,IAAEF;AAAAA,EAAAA,IAAYG,WAAWF,WAAW;AAE1C,8BACEG,UAAA;AAAA,IAAAC,UAAA,CACG,KACAH,OAAOI,IAAI,CAACC,SAASC,UAAU;AACxBC,YAAAA,MAAO,GAAEF,WAAWC;AAC1B,iCACGE,cAAY;AAAA,QACXC,SAAQ;AAAA,QACRC,WAAWZ,QAAQa;AAAAA,QAAYR,UAG9BE;AAAAA,SAFIE,GAGO;AAAA,IAEjB,CAAA,GAAG,GAAG;AAAA,EAAA,CACP;AAEN;"}

package/dist/esm/components/Calendar/CalendarWeekLabels/CalendarWeekLabels.styles.js

@@ -1,23 +1,19 @@
-import _styled from "@emotion/styled/base";
-import { HvTypography } from "../../Typography/Typography.js";
-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 StyledCalendarDay = /* @__PURE__ */ _styled(HvTypography, process.env.NODE_ENV === "production" ? {
-  target: "exstlpd0"
-} : {
-  target: "exstlpd0",
-  label: "StyledCalendarDay"
-})(process.env.NODE_ENV === "production" ? {
-  name: "rklzbe",
-  styles: "display:flex;justify-content:center;flex-direction:column;text-align:center;height:40px;width:40px"
-} : {
-  name: "rklzbe",
-  styles: "display:flex;justify-content:center;flex-direction:column;text-align:center;height:40px;width:40px",
-  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvQ2FsZW5kYXIvQ2FsZW5kYXJXZWVrTGFiZWxzL0NhbGVuZGFyV2Vla0xhYmVscy5zdHlsZXMudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUlpQyIsImZpbGUiOiIvaG9tZS9ydW5uZXIvd29yay9odi11aWtpdC1yZWFjdC9odi11aWtpdC1yZWFjdC9wYWNrYWdlcy9jb3JlL3NyYy9jb21wb25lbnRzL0NhbGVuZGFyL0NhbGVuZGFyV2Vla0xhYmVscy9DYWxlbmRhcldlZWtMYWJlbHMuc3R5bGVzLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuXG5pbXBvcnQgeyBIdlR5cG9ncmFwaHkgfSBmcm9tIFwiQGNvcmUvY29tcG9uZW50cy9UeXBvZ3JhcGh5XCI7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRDYWxlbmRhckRheSA9IHN0eWxlZChIdlR5cG9ncmFwaHkpKHtcbiAgZGlzcGxheTogXCJmbGV4XCIsXG4gIGp1c3RpZnlDb250ZW50OiBcImNlbnRlclwiLFxuICBmbGV4RGlyZWN0aW9uOiBcImNvbHVtblwiLFxuICB0ZXh0QWxpZ246IFwiY2VudGVyXCIsXG4gIGhlaWdodDogXCI0MHB4XCIsXG4gIHdpZHRoOiBcIjQwcHhcIixcbn0pO1xuIl19 */",
-  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+import { createClasses } from "../../../utils/classes.js";
+const {
+  staticClasses,
+  useClasses
+} = createClasses("HvCalendarWeekLabels", {
+  calendarDay: {
+    display: "flex",
+    justifyContent: "center",
+    flexDirection: "column",
+    textAlign: "center",
+    height: "40px",
+    width: "40px"
+  }
 });
 export {
-  StyledCalendarDay
+  staticClasses,
+  useClasses
 };
 //# sourceMappingURL=CalendarWeekLabels.styles.js.map

package/dist/esm/components/Calendar/CalendarWeekLabels/CalendarWeekLabels.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"CalendarWeekLabels.styles.js","sources":["../../../../../src/components/Calendar/CalendarWeekLabels/CalendarWeekLabels.styles.tsx"],"sourcesContent":["import styled from \"@emotion/styled\";\n\nimport { HvTypography } from \"@core/components/Typography\";\n\nexport const StyledCalendarDay = styled(HvTypography)({\n  display: \"flex\",\n  justifyContent: \"center\",\n  flexDirection: \"column\",\n  textAlign: \"center\",\n  height: \"40px\",\n  width: \"40px\",\n});\n"],"names":["StyledCalendarDay","HvTypography","process","env","NODE_ENV","target","label","name","styles","map","toString","_EMOTION_STRINGIFIED_CSS_ERROR__"],"mappings":";;;;;AAIO,MAAMA,oBAA2BC,wBAAAA,cAAYC,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,CAOpD;"}
+{"version":3,"file":"CalendarWeekLabels.styles.js","sources":["../../../../../src/components/Calendar/CalendarWeekLabels/CalendarWeekLabels.styles.tsx"],"sourcesContent":["import { createClasses } from \"@core/utils/classes\";\n\nexport const { staticClasses, useClasses } = createClasses(\n  \"HvCalendarWeekLabels\",\n  {\n    calendarDay: {\n      display: \"flex\",\n      justifyContent: \"center\",\n      flexDirection: \"column\",\n      textAlign: \"center\",\n      height: \"40px\",\n      width: \"40px\",\n    },\n  }\n);\n"],"names":["staticClasses","useClasses","createClasses","calendarDay","display","justifyContent","flexDirection","textAlign","height","width"],"mappings":";AAEa,MAAA;AAAA,EAAEA;AAAAA,EAAeC;AAAW,IAAIC,cAC3C,wBACA;AAAA,EACEC,aAAa;AAAA,IACXC,SAAS;AAAA,IACTC,gBAAgB;AAAA,IAChBC,eAAe;AAAA,IACfC,WAAW;AAAA,IACXC,QAAQ;AAAA,IACRC,OAAO;AAAA,EACT;AACF,CACF;"}