@hitachivantara/uikit-react-core 5.39.2 → 5.39.4

package/dist/cjs/Calendar/CalendarNavigation/ComposedNavigation/ComposedNavigation.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ComposedNavigation.cjs","sources":["../../../../../src/Calendar/CalendarNavigation/ComposedNavigation/ComposedNavigation.tsx"],"sourcesContent":["import { setId } from \"../../../utils/setId\";\n\nimport { ExtractNames } from \"../../../utils/classes\";\n\nimport { getMonthNamesList } from \"../../utils\";\nimport { ViewMode } from \"../../enums\";\nimport { Navigation } from \"../Navigation\";\nimport { VisibilitySelectorActions } from \"../../types\";\n\nimport { staticClasses, useClasses } from \"./ComposedNavigation.styles\";\n\nexport { staticClasses as composedNavigationClasses };\n\nexport type HvComposedNavigationClasses = ExtractNames<typeof useClasses>;\n\nexport const HvComposedNavigation = ({\n  classes: classesProp,\n  id,\n  locale,\n  onChange,\n  onViewModeChange,\n  visibleYear,\n  visibleMonth,\n  ...others\n}: HvComposedNavigationProps) => {\n  const { classes } = useClasses(classesProp);\n\n  const listMonthNamesLong = getMonthNamesList(locale, \"long\");\n  const monthName = listMonthNamesLong[visibleMonth - 1];\n\n  return (\n    <div className={classes.navigationContainer} {...others}>\n      <div className={classes.navigationMonth}>\n        <Navigation\n          id={setId(id, \"navigation-month\")}\n          navigationText={monthName}\n          onNavigatePrevious={(event) => {\n            onChange?.(event, \"previous_month\");\n          }}\n          onNavigateNext={(event) => {\n            onChange?.(event, \"next_month\");\n          }}\n          onTextClick={() => {\n            onViewModeChange(\"monthly\");\n          }}\n          className={classes.navigationMonth}\n        />\n      </div>\n\n      <Navigation\n        id={setId(id, \"navigation-year\")}\n        navigationText={visibleYear.toString()}\n        onNavigatePrevious={(event) => {\n          onChange?.(event, \"previous_year\");\n        }}\n        onNavigateNext={(event) => {\n          onChange?.(event, \"next_year\");\n        }}\n      />\n    </div>\n  );\n};\n\nexport interface HvComposedNavigationProps {\n  /**\n   * A Jss Object used to override or extend the component styles.\n   */\n  classes?: HvComposedNavigationClasses;\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?: (event: any, action: VisibilitySelectorActions) => void;\n  /**\n   * Callback to define the view mode.\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}\n"],"names":["useClasses","getMonthNamesList","jsx","Navigation","setId"],"mappings":";;;;;;;AAeO,MAAM,uBAAuB,CAAC;AAAA,EACnC,SAAS;AAAA,EACT;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAiC;AAC/B,QAAM,EAAE,QAAA,IAAYA,0BAAA,WAAW,WAAW;AAEpC,QAAA,qBAAqBC,MAAAA,kBAAkB,QAAQ,MAAM;AACrD,QAAA,YAAY,mBAAmB,eAAe,CAAC;AAErD,yCACG,OAAI,EAAA,WAAW,QAAQ,qBAAsB,GAAG,QAC/C,UAAA;AAAA,IAACC,2BAAA,IAAA,OAAA,EAAI,WAAW,QAAQ,iBACtB,UAAAA,2BAAA;AAAA,MAACC,WAAA;AAAA,MAAA;AAAA,QACC,IAAIC,MAAAA,MAAM,IAAI,kBAAkB;AAAA,QAChC,gBAAgB;AAAA,QAChB,oBAAoB,CAAC,UAAU;AAC7B,qBAAW,OAAO,gBAAgB;AAAA,QACpC;AAAA,QACA,gBAAgB,CAAC,UAAU;AACzB,qBAAW,OAAO,YAAY;AAAA,QAChC;AAAA,QACA,aAAa,MAAM;AACjB,2BAAiB,SAAS;AAAA,QAC5B;AAAA,QACA,WAAW,QAAQ;AAAA,MAAA;AAAA,IAAA,GAEvB;AAAA,IAEAF,2BAAA;AAAA,MAACC,WAAA;AAAA,MAAA;AAAA,QACC,IAAIC,MAAAA,MAAM,IAAI,iBAAiB;AAAA,QAC/B,gBAAgB,YAAY,SAAS;AAAA,QACrC,oBAAoB,CAAC,UAAU;AAC7B,qBAAW,OAAO,eAAe;AAAA,QACnC;AAAA,QACA,gBAAgB,CAAC,UAAU;AACzB,qBAAW,OAAO,WAAW;AAAA,QAC/B;AAAA,MAAA;AAAA,IACF;AAAA,EACF,EAAA,CAAA;AAEJ;;;"}

package/dist/cjs/Calendar/CalendarNavigation/ComposedNavigation/ComposedNavigation.styles.cjs

@@ -0,0 +1,20 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const uikitStyles = require("@hitachivantara/uikit-styles");
+const classes = require("../../../utils/classes.cjs");
+const { staticClasses, useClasses } = classes.createClasses(
+  "HvComposedNavigation",
+  {
+    navigationContainer: {
+      display: "flex",
+      justifyContent: "space-between",
+      padding: uikitStyles.theme.spacing("xs", 0)
+    },
+    navigationMonth: {
+      minWidth: "160px"
+    }
+  }
+);
+exports.staticClasses = staticClasses;
+exports.useClasses = useClasses;
+//# sourceMappingURL=ComposedNavigation.styles.cjs.map

package/dist/cjs/Calendar/CalendarNavigation/ComposedNavigation/ComposedNavigation.styles.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ComposedNavigation.styles.cjs","sources":["../../../../../src/Calendar/CalendarNavigation/ComposedNavigation/ComposedNavigation.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { createClasses } from \"../../../utils/classes\";\n\nexport const { staticClasses, useClasses } = createClasses(\n  \"HvComposedNavigation\",\n  {\n    navigationContainer: {\n      display: \"flex\",\n      justifyContent: \"space-between\",\n      padding: theme.spacing(\"xs\", 0),\n    },\n    navigationMonth: {\n      minWidth: \"160px\",\n    },\n  }\n);\n"],"names":["createClasses","theme"],"mappings":";;;;AAIa,MAAA,EAAE,eAAe,WAAA,IAAeA,QAAA;AAAA,EAC3C;AAAA,EACA;AAAA,IACE,qBAAqB;AAAA,MACnB,SAAS;AAAA,MACT,gBAAgB;AAAA,MAChB,SAASC,YAAA,MAAM,QAAQ,MAAM,CAAC;AAAA,IAChC;AAAA,IACA,iBAAiB;AAAA,MACf,UAAU;AAAA,IACZ;AAAA,EACF;AACF;;;"}

package/dist/cjs/Calendar/CalendarNavigation/MonthSelector/MonthSelector.cjs

@@ -0,0 +1,62 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("@emotion/react/jsx-runtime");
+const keyboardUtils = require("../../../utils/keyboardUtils.cjs");
+const utils = require("../../utils.cjs");
+const MonthSelector_styles = require("./MonthSelector.styles.cjs");
+const Typography = require("../../../Typography/Typography.cjs");
+const HvMonthSelector = ({
+  classes: classesProp,
+  id,
+  locale,
+  onChange,
+  onViewModeChange,
+  rangeMode,
+  visibleMonth,
+  ...others
+}) => {
+  const { classes, cx } = MonthSelector_styles.useClasses(classesProp);
+  const listMonthNamesShort = utils.getMonthNamesList(locale, "short");
+  const onKeyDownHandler = (event, index) => {
+    if (keyboardUtils.isKey(event, "Enter")) {
+      onChange?.(event, "month", index + 1);
+      onViewModeChange("calendar");
+    }
+  };
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      className: cx(classes.calendarMonthlyGrid, {
+        [classes.rangeModeWidth]: rangeMode,
+        [classes.normalWidth]: !rangeMode
+      }),
+      children: listMonthNamesShort.map((monthName, index) => /* @__PURE__ */ jsxRuntime.jsx(
+        "div",
+        {
+          className: classes.focusSelection,
+          role: "button",
+          onClick: (event) => {
+            onChange?.(event, "month", index + 1);
+            onViewModeChange("calendar");
+          },
+          onKeyDown: (event) => onKeyDownHandler(event, index),
+          tabIndex: 0,
+          ...others,
+          children: /* @__PURE__ */ jsxRuntime.jsx(
+            Typography.HvTypography,
+            {
+              className: cx(classes.calendarMonthlyCell, {
+                [classes.calendarMonthlyCellSelected]: index + 1 === visibleMonth
+              }),
+              children: monthName
+            }
+          )
+        },
+        monthName
+      ))
+    }
+  );
+};
+exports.monthSelectorClasses = MonthSelector_styles.staticClasses;
+exports.HvMonthSelector = HvMonthSelector;
+//# sourceMappingURL=MonthSelector.cjs.map

package/dist/cjs/Calendar/CalendarNavigation/MonthSelector/MonthSelector.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"MonthSelector.cjs","sources":["../../../../../src/Calendar/CalendarNavigation/MonthSelector/MonthSelector.tsx"],"sourcesContent":["import { isKey } from \"../../../utils/keyboardUtils\";\n\nimport { HvTypography } from \"../../../Typography\";\nimport { ExtractNames } from \"../../../utils/classes\";\n\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: any, index: number) => {\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":["useClasses","getMonthNamesList","isKey","jsx","HvTypography"],"mappings":";;;;;;;AAeO,MAAM,kBAAkB,CAAC;AAAA,EAC9B,SAAS;AAAA,EACT;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAA4B;AAC1B,QAAM,EAAE,SAAS,GAAG,IAAIA,gCAAW,WAAW;AAExC,QAAA,sBAAsBC,MAAAA,kBAAkB,QAAQ,OAAO;AACvD,QAAA,mBAAmB,CAAC,OAAY,UAAkB;AAClD,QAAAC,cAAA,MAAM,OAAO,OAAO,GAAG;AACd,iBAAA,OAAO,SAAS,QAAQ,CAAC;AACpC,uBAAiB,UAAU;AAAA,IAC7B;AAAA,EAAA;AAGA,SAAAC,2BAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW,GAAG,QAAQ,qBAAqB;AAAA,QACzC,CAAC,QAAQ,cAAc,GAAG;AAAA,QAC1B,CAAC,QAAQ,WAAW,GAAG,CAAC;AAAA,MAAA,CACzB;AAAA,MAEA,UAAoB,oBAAA,IAAI,CAAC,WAAW,UACnCA,2BAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAW,QAAQ;AAAA,UAEnB,MAAK;AAAA,UACL,SAAS,CAAC,UAAU;AACP,uBAAA,OAAO,SAAS,QAAQ,CAAC;AACpC,6BAAiB,UAAU;AAAA,UAC7B;AAAA,UACA,WAAW,CAAC,UAAU,iBAAiB,OAAO,KAAK;AAAA,UACnD,UAAU;AAAA,UACT,GAAG;AAAA,UAEJ,UAAAA,2BAAA;AAAA,YAACC,WAAA;AAAA,YAAA;AAAA,cACC,WAAW,GAAG,QAAQ,qBAAqB;AAAA,gBACzC,CAAC,QAAQ,2BAA2B,GAAG,QAAQ,MAAM;AAAA,cAAA,CACtD;AAAA,cAEA,UAAA;AAAA,YAAA;AAAA,UACH;AAAA,QAAA;AAAA,QAhBK;AAAA,MAAA,CAkBR;AAAA,IAAA;AAAA,EAAA;AAGP;;;"}

package/dist/cjs/Calendar/CalendarNavigation/MonthSelector/MonthSelector.styles.cjs

@@ -0,0 +1,59 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const uikitStyles = require("@hitachivantara/uikit-styles");
+const focusUtils = require("../../../utils/focusUtils.cjs");
+const classes = require("../../../utils/classes.cjs");
+const hover = {
+  backgroundColor: uikitStyles.theme.colors.atmo3,
+  cursor: "pointer"
+};
+const { staticClasses, useClasses } = classes.createClasses("HvMonthSelector", {
+  calendarMonthlyGrid: {
+    marginTop: "50px",
+    marginLeft: "-16px",
+    display: "flex",
+    zIndex: "10",
+    padding: "0 20px",
+    position: "absolute",
+    flexFlow: "wrap",
+    alignContent: "center",
+    justifyContent: "space-evenly",
+    backgroundColor: uikitStyles.theme.colors.atmo1
+  },
+  rangeModeWidth: {},
+  normalWidth: {},
+  focusSelection: {
+    "&:hover": {
+      ...hover
+    },
+    "&:focus": {
+      outline: "none"
+    },
+    "&:focus-visible": {
+      ...hover,
+      ...focusUtils.outlineStyles
+    }
+  },
+  calendarMonthlyCell: {
+    display: "flex",
+    justifyContent: "center",
+    flexDirection: "column",
+    textAlign: "center",
+    height: "40px",
+    width: "92px",
+    "&:hover": {
+      ...hover
+    }
+  },
+  calendarMonthlyCellSelected: {
+    backgroundColor: uikitStyles.theme.colors.atmo3,
+    color: uikitStyles.theme.colors.secondary,
+    "&:hover": {
+      backgroundColor: uikitStyles.theme.colors.atmo3,
+      color: uikitStyles.theme.colors.secondary
+    }
+  }
+});
+exports.staticClasses = staticClasses;
+exports.useClasses = useClasses;
+//# sourceMappingURL=MonthSelector.styles.cjs.map

package/dist/cjs/Calendar/CalendarNavigation/MonthSelector/MonthSelector.styles.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"MonthSelector.styles.cjs","sources":["../../../../../src/Calendar/CalendarNavigation/MonthSelector/MonthSelector.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { outlineStyles } from \"../../../utils/focusUtils\";\n\nimport { createClasses } from \"../../../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":["theme","createClasses","outlineStyles"],"mappings":";;;;;AAMA,MAAM,QAAQ;AAAA,EACZ,iBAAiBA,YAAAA,MAAM,OAAO;AAAA,EAC9B,QAAQ;AACV;AAEO,MAAM,EAAE,eAAe,eAAeC,QAAAA,cAAc,mBAAmB;AAAA,EAC5E,qBAAqB;AAAA,IACnB,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,SAAS;AAAA,IACT,QAAQ;AAAA,IACR,SAAS;AAAA,IACT,UAAU;AAAA,IACV,UAAU;AAAA,IACV,cAAc;AAAA,IACd,gBAAgB;AAAA,IAChB,iBAAiBD,YAAAA,MAAM,OAAO;AAAA,EAChC;AAAA,EACA,gBAAgB,CAAC;AAAA,EACjB,aAAa,CAAC;AAAA,EACd,gBAAgB;AAAA,IACd,WAAW;AAAA,MACT,GAAG;AAAA,IACL;AAAA,IACA,WAAW;AAAA,MACT,SAAS;AAAA,IACX;AAAA,IACA,mBAAmB;AAAA,MACjB,GAAG;AAAA,MACH,GAAGE,WAAA;AAAA,IACL;AAAA,EACF;AAAA,EACA,qBAAqB;AAAA,IACnB,SAAS;AAAA,IACT,gBAAgB;AAAA,IAChB,eAAe;AAAA,IACf,WAAW;AAAA,IACX,QAAQ;AAAA,IACR,OAAO;AAAA,IACP,WAAW;AAAA,MACT,GAAG;AAAA,IACL;AAAA,EACF;AAAA,EACA,6BAA6B;AAAA,IAC3B,iBAAiBF,YAAAA,MAAM,OAAO;AAAA,IAC9B,OAAOA,YAAAA,MAAM,OAAO;AAAA,IACpB,WAAW;AAAA,MACT,iBAAiBA,YAAAA,MAAM,OAAO;AAAA,MAC9B,OAAOA,YAAAA,MAAM,OAAO;AAAA,IACtB;AAAA,EACF;AACF,CAAC;;;"}

package/dist/cjs/Calendar/CalendarNavigation/Navigation/Navigation.cjs

@@ -0,0 +1,65 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("@emotion/react/jsx-runtime");
+const uikitReactIcons = require("@hitachivantara/uikit-react-icons");
+const setId = require("../../../utils/setId.cjs");
+const Navigation_styles = require("./Navigation.styles.cjs");
+const Button = require("../../../Button/Button.cjs");
+const Navigation = ({
+  id,
+  classes: classesProp,
+  onNavigatePrevious,
+  onNavigateNext,
+  onTextClick,
+  navigationText = "n/a",
+  isPreviousEnabled = true,
+  isNextEnabled = true
+}) => {
+  const { classes, cx } = Navigation_styles.useClasses(classesProp);
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: classes.root, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      Button.HvButton,
+      {
+        icon: true,
+        disabled: !isPreviousEnabled,
+        "aria-label": "Previous",
+        id: setId.setId(id, "left"),
+        className: cx(classes.icon, {
+          [classes.disabled]: !isPreviousEnabled
+        }),
+        onClick: onNavigatePrevious,
+        children: /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.DropLeftXS, { role: "none" })
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      Button.HvButton,
+      {
+        id,
+        variant: "secondaryGhost",
+        onClick: onTextClick,
+        component: onTextClick ? "button" : "div",
+        className: cx(classes.text, {
+          [classes.textWithoutHover]: !onTextClick
+        }),
+        children: navigationText
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      Button.HvButton,
+      {
+        icon: true,
+        disabled: !isNextEnabled,
+        "aria-label": "Next",
+        id: setId.setId(id, "right"),
+        className: cx(classes.icon, {
+          [classes.disabled]: !isNextEnabled
+        }),
+        onClick: onNavigateNext,
+        children: /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.DropRightXS, { role: "none" })
+      }
+    )
+  ] });
+};
+exports.navigationClasses = Navigation_styles.staticClasses;
+exports.Navigation = Navigation;
+//# sourceMappingURL=Navigation.cjs.map

package/dist/cjs/Calendar/CalendarNavigation/Navigation/Navigation.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Navigation.cjs","sources":["../../../../../src/Calendar/CalendarNavigation/Navigation/Navigation.tsx"],"sourcesContent":["import {\n  DropLeftXS as DropLeftIcon,\n  DropRightXS as DropRightIcon,\n} from \"@hitachivantara/uikit-react-icons\";\n\nimport { setId } from \"../../../utils/setId\";\nimport { HvButton } from \"../../../Button\";\nimport { HvBaseProps } from \"../../../types/generic\";\n\nimport { ExtractNames } from \"../../../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  return (\n    <div className={classes.root}>\n      <HvButton\n        icon\n        disabled={!isPreviousEnabled}\n        aria-label=\"Previous\"\n        id={setId(id, \"left\")}\n        className={cx(classes.icon, {\n          [classes.disabled]: !isPreviousEnabled,\n        })}\n        onClick={onNavigatePrevious}\n      >\n        <DropLeftIcon role=\"none\" />\n      </HvButton>\n\n      <HvButton\n        id={id}\n        variant=\"secondaryGhost\"\n        onClick={onTextClick}\n        component={onTextClick ? \"button\" : \"div\"}\n        className={cx(classes.text, {\n          [classes.textWithoutHover]: !onTextClick,\n        })}\n      >\n        {navigationText}\n      </HvButton>\n\n      <HvButton\n        icon\n        disabled={!isNextEnabled}\n        aria-label=\"Next\"\n        id={setId(id, \"right\")}\n        className={cx(classes.icon, {\n          [classes.disabled]: !isNextEnabled,\n        })}\n        onClick={onNavigateNext}\n      >\n        <DropRightIcon role=\"none\" />\n      </HvButton>\n    </div>\n  );\n};\n\nexport interface NavigationProps extends HvBaseProps {\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<HTMLElement>) => void;\n  /**\n   * A function to be executed whenever the navigate next action is triggered.\n   */\n  onNavigateNext: (event: React.MouseEvent<HTMLElement>) => 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":["useClasses","jsxs","jsx","HvButton","setId","DropLeftIcon","DropRightIcon"],"mappings":";;;;;;;AAiBO,MAAM,aAAa,CAAC;AAAA,EACzB;AAAA,EACA,SAAS;AAAA,EACT;AAAA,EACA;AAAA,EACA;AAAA,EACA,iBAAiB;AAAA,EACjB,oBAAoB;AAAA,EACpB,gBAAgB;AAClB,MAAuB;AACrB,QAAM,EAAE,SAAS,GAAG,IAAIA,6BAAW,WAAW;AAE9C,SACGC,2BAAAA,KAAA,OAAA,EAAI,WAAW,QAAQ,MACtB,UAAA;AAAA,IAAAC,2BAAA;AAAA,MAACC,OAAA;AAAA,MAAA;AAAA,QACC,MAAI;AAAA,QACJ,UAAU,CAAC;AAAA,QACX,cAAW;AAAA,QACX,IAAIC,MAAAA,MAAM,IAAI,MAAM;AAAA,QACpB,WAAW,GAAG,QAAQ,MAAM;AAAA,UAC1B,CAAC,QAAQ,QAAQ,GAAG,CAAC;AAAA,QAAA,CACtB;AAAA,QACD,SAAS;AAAA,QAET,UAAAF,2BAAAA,IAACG,gBAAAA,YAAa,EAAA,MAAK,OAAO,CAAA;AAAA,MAAA;AAAA,IAC5B;AAAA,IAEAH,2BAAA;AAAA,MAACC,OAAA;AAAA,MAAA;AAAA,QACC;AAAA,QACA,SAAQ;AAAA,QACR,SAAS;AAAA,QACT,WAAW,cAAc,WAAW;AAAA,QACpC,WAAW,GAAG,QAAQ,MAAM;AAAA,UAC1B,CAAC,QAAQ,gBAAgB,GAAG,CAAC;AAAA,QAAA,CAC9B;AAAA,QAEA,UAAA;AAAA,MAAA;AAAA,IACH;AAAA,IAEAD,2BAAA;AAAA,MAACC,OAAA;AAAA,MAAA;AAAA,QACC,MAAI;AAAA,QACJ,UAAU,CAAC;AAAA,QACX,cAAW;AAAA,QACX,IAAIC,MAAAA,MAAM,IAAI,OAAO;AAAA,QACrB,WAAW,GAAG,QAAQ,MAAM;AAAA,UAC1B,CAAC,QAAQ,QAAQ,GAAG,CAAC;AAAA,QAAA,CACtB;AAAA,QACD,SAAS;AAAA,QAET,UAAAF,2BAAAA,IAACI,gBAAAA,aAAc,EAAA,MAAK,OAAO,CAAA;AAAA,MAAA;AAAA,IAC7B;AAAA,EACF,EAAA,CAAA;AAEJ;;;"}

package/dist/cjs/Calendar/CalendarNavigation/Navigation/Navigation.styles.cjs

@@ -0,0 +1,27 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const uikitStyles = require("@hitachivantara/uikit-styles");
+const classes = require("../../../utils/classes.cjs");
+const { staticClasses, useClasses } = classes.createClasses("HvNavigation", {
+  root: {
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "space-between",
+    gap: uikitStyles.theme.space.xs
+  },
+  icon: {},
+  disabled: {},
+  text: {
+    minWidth: "unset",
+    flex: 1,
+    color: uikitStyles.theme.colors.secondary,
+    fontWeight: uikitStyles.theme.typography.body.fontWeight,
+    padding: 0
+  },
+  textWithoutHover: {
+    pointerEvents: "none"
+  }
+});
+exports.staticClasses = staticClasses;
+exports.useClasses = useClasses;
+//# sourceMappingURL=Navigation.styles.cjs.map

package/dist/cjs/Calendar/CalendarNavigation/Navigation/Navigation.styles.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Navigation.styles.cjs","sources":["../../../../../src/Calendar/CalendarNavigation/Navigation/Navigation.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { createClasses } from \"../../../utils/classes\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvNavigation\", {\n  root: {\n    display: \"flex\",\n    alignItems: \"center\",\n    justifyContent: \"space-between\",\n    gap: theme.space.xs,\n  },\n  icon: {},\n  disabled: {},\n  text: {\n    minWidth: \"unset\",\n    flex: 1,\n    color: theme.colors.secondary,\n    fontWeight: theme.typography.body.fontWeight,\n    padding: 0,\n  },\n  textWithoutHover: {\n    pointerEvents: \"none\",\n  },\n});\n"],"names":["createClasses","theme"],"mappings":";;;;AAIO,MAAM,EAAE,eAAe,eAAeA,QAAAA,cAAc,gBAAgB;AAAA,EACzE,MAAM;AAAA,IACJ,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,gBAAgB;AAAA,IAChB,KAAKC,YAAAA,MAAM,MAAM;AAAA,EACnB;AAAA,EACA,MAAM,CAAC;AAAA,EACP,UAAU,CAAC;AAAA,EACX,MAAM;AAAA,IACJ,UAAU;AAAA,IACV,MAAM;AAAA,IACN,OAAOA,YAAAA,MAAM,OAAO;AAAA,IACpB,YAAYA,YAAM,MAAA,WAAW,KAAK;AAAA,IAClC,SAAS;AAAA,EACX;AAAA,EACA,kBAAkB;AAAA,IAChB,eAAe;AAAA,EACjB;AACF,CAAC;;;"}

package/dist/cjs/Calendar/SingleCalendar/CalendarCell.cjs

@@ -0,0 +1,94 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const jsxRuntime = require("@emotion/react/jsx-runtime");
+const React = require("react");
+const useDefaultProps = require("../../hooks/useDefaultProps.cjs");
+const utils = require("../utils.cjs");
+const CalendarCell_styles = require("./CalendarCell.styles.cjs");
+const Typography = require("../../Typography/Typography.cjs");
+const HvCalendarCell = (props) => {
+  const {
+    classes: classesProp,
+    onChange,
+    onKeyDown,
+    calendarValue,
+    firstDayOfCurrentMonth,
+    value,
+    isDateSelectionMode,
+    today,
+    locale,
+    minimumDate,
+    maximumDate,
+    rangeMode = false,
+    ...others
+  } = useDefaultProps.useDefaultProps("HvCalendarCell", props);
+  const { classes, cx } = CalendarCell_styles.useClasses(classesProp);
+  const buttonEl = React.useRef(null);
+  const startDate = utils.isDateRangeProp(calendarValue) ? calendarValue.startDate : void 0;
+  const endDate = utils.isDateRangeProp(calendarValue) ? calendarValue.endDate : void 0;
+  const isCellToday = utils.isSameDay(value, today);
+  const isCellSelected = utils.isSameDay(calendarValue, value);
+  const inMonth = utils.isSameMonth(value, firstDayOfCurrentMonth);
+  const isCellAfterStartingDate = rangeMode && value && startDate ? value >= startDate : false;
+  const isCellStartingDate = rangeMode ? utils.isSameDay(value, startDate) : false;
+  const isDateInSelectionRange = calendarValue && rangeMode ? utils.dateInProvidedValueRange(value, calendarValue) : false;
+  const isDateDisabled = utils.checkIfDateIsDisabled(value, minimumDate, maximumDate);
+  const startBookend = utils.isSameDay(startDate, value);
+  const endBookend = utils.isSameDay(endDate, value);
+  const isSelecting = isDateSelectionMode && isCellAfterStartingDate;
+  const handleClick = (event) => {
+    if (value) {
+      onChange?.(event, value);
+      if (buttonEl.current)
+        setTimeout(() => buttonEl?.current?.focus());
+    }
+  };
+  const handleKeyDown = (event) => {
+    onKeyDown?.(event);
+  };
+  const renderDate = () => /* @__PURE__ */ jsxRuntime.jsx(
+    "button",
+    {
+      ref: buttonEl,
+      type: "button",
+      className: cx(classes.cellContainer, {
+        [classes.focusSelection]: inMonth
+      }),
+      onClick: handleClick,
+      onKeyDown: handleKeyDown,
+      disabled: isDateDisabled || !inMonth,
+      "data-in-month": inMonth,
+      ...others,
+      children: /* @__PURE__ */ jsxRuntime.jsx(
+        Typography.HvTypography,
+        {
+          variant: isCellToday ? "label" : "body",
+          className: cx(classes.calendarDate, {
+            [classes.calendarDateSelected]: inMonth && isCellSelected,
+            [classes.calendarDateNotInMonth]: !inMonth,
+            [classes.calendarDateInSelectionRange]: inMonth && rangeMode && isDateInSelectionRange,
+            [classes.calendarDateDisabled]: isDateDisabled,
+            [classes.startBookend]: inMonth && (startBookend && rangeMode || isCellStartingDate && isDateSelectionMode),
+            [classes.endBookend]: inMonth && endBookend && rangeMode
+          }),
+          children: value && value.getDate()
+        }
+      )
+    }
+  );
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      className: cx(classes.dateWrapper, {
+        [classes.cellsInRange]: inMonth && rangeMode && isSelecting,
+        [classes.cellsOutsideRange]: rangeMode && !isSelecting
+      }),
+      "data-calendar-cell": "calendarCell",
+      children: renderDate()
+    }
+  );
+};
+exports.calendarCellClasses = CalendarCell_styles.staticClasses;
+exports.HvCalendarCell = HvCalendarCell;
+exports.default = HvCalendarCell;
+//# sourceMappingURL=CalendarCell.cjs.map

package/dist/cjs/Calendar/SingleCalendar/CalendarCell.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"CalendarCell.cjs","sources":["../../../../src/Calendar/SingleCalendar/CalendarCell.tsx"],"sourcesContent":["import { SyntheticEvent, useRef } from \"react\";\n\nimport { HvTypography } from \"../../Typography\";\nimport { ExtractNames } from \"../../utils/classes\";\nimport { useDefaultProps } from \"../../hooks/useDefaultProps\";\n\nimport {\n  isSameDay,\n  isSameMonth,\n  dateInProvidedValueRange,\n  checkIfDateIsDisabled,\n  isDateRangeProp,\n} from \"../utils\";\nimport { DateRangeProp } from \"../types\";\nimport CalendarModel from \"../model\";\n\nimport { staticClasses, useClasses } from \"./CalendarCell.styles\";\n\nexport { staticClasses as calendarCellClasses };\n\nexport type HvCalendarCellClasses = ExtractNames<typeof useClasses>;\n\nexport const HvCalendarCell = (props: HvCalendarCellProps) => {\n  const {\n    classes: classesProp,\n    onChange,\n    onKeyDown,\n    calendarValue,\n    firstDayOfCurrentMonth,\n    value,\n    isDateSelectionMode,\n    today,\n    locale,\n    minimumDate,\n    maximumDate,\n    rangeMode = false,\n    ...others\n  } = useDefaultProps(\"HvCalendarCell\", props);\n\n  const { classes, cx } = useClasses(classesProp);\n\n  const buttonEl = useRef<HTMLButtonElement>(null);\n\n  const startDate = isDateRangeProp(calendarValue)\n    ? calendarValue.startDate\n    : undefined;\n  const endDate = isDateRangeProp(calendarValue)\n    ? calendarValue.endDate\n    : undefined;\n  const isCellToday = isSameDay(value, today);\n  const isCellSelected = isSameDay(calendarValue, value);\n  const inMonth = isSameMonth(value, firstDayOfCurrentMonth);\n  const isCellAfterStartingDate =\n    rangeMode && value && startDate ? value >= startDate : false;\n  const isCellStartingDate = rangeMode ? isSameDay(value, startDate) : false;\n  const isDateInSelectionRange =\n    calendarValue && rangeMode\n      ? dateInProvidedValueRange(value, calendarValue)\n      : false;\n  const isDateDisabled = checkIfDateIsDisabled(value, minimumDate, maximumDate);\n  const startBookend = isSameDay(startDate, value);\n  const endBookend = isSameDay(endDate, value);\n  const isSelecting = isDateSelectionMode && isCellAfterStartingDate;\n\n  const handleClick = (event: SyntheticEvent) => {\n    if (value) {\n      onChange?.(event, value);\n      if (buttonEl.current) setTimeout(() => buttonEl?.current?.focus());\n    }\n  };\n\n  const handleKeyDown = (event) => {\n    onKeyDown?.(event);\n  };\n\n  const renderDate = () => (\n    <button\n      ref={buttonEl}\n      type=\"button\"\n      className={cx(classes.cellContainer, {\n        [classes.focusSelection]: inMonth,\n      })}\n      onClick={handleClick}\n      onKeyDown={handleKeyDown}\n      disabled={isDateDisabled || !inMonth}\n      data-in-month={inMonth}\n      {...others}\n    >\n      <HvTypography\n        variant={isCellToday ? \"label\" : \"body\"}\n        className={cx(classes.calendarDate, {\n          [classes.calendarDateSelected]: inMonth && isCellSelected,\n          [classes.calendarDateNotInMonth]: !inMonth,\n          [classes.calendarDateInSelectionRange]:\n            inMonth && rangeMode && isDateInSelectionRange,\n          [classes.calendarDateDisabled]: isDateDisabled,\n          [classes.startBookend]:\n            inMonth &&\n            ((startBookend && rangeMode) ||\n              (isCellStartingDate && isDateSelectionMode)),\n          [classes.endBookend]: inMonth && endBookend && rangeMode,\n        })}\n      >\n        {value && value.getDate()}\n      </HvTypography>\n    </button>\n  );\n\n  return (\n    <div\n      className={cx(classes.dateWrapper, {\n        [classes.cellsInRange]: inMonth && rangeMode && isSelecting,\n        [classes.cellsOutsideRange]: rangeMode && !isSelecting,\n      })}\n      data-calendar-cell=\"calendarCell\"\n    >\n      {renderDate()}\n    </div>\n  );\n};\n\nexport interface HvCalendarCellProps {\n  /**\n   * A Jss Object used to override or extend the component styles.\n   */\n  classes?: HvCalendarCellClasses;\n  /**\n   * Identifier.\n   */\n  id?: string;\n  /**\n   * The text to be shown on the main part of the header.\n   */\n  calendarValue?: string | Date | DateRangeProp;\n  /**\n   * The text to be shown on the main part of the header.\n   */\n  value?: Date;\n  /**\n   * Locale to be used by the calendar.\n   */\n  locale?: string;\n  /**\n   * Callback to define the input date.\n   */\n  onChange?: (event: SyntheticEvent, value: Date | DateRangeProp) => void;\n  /**\n   * Callback to handle input onFocus.\n   */\n  onFocus?: React.FocusEventHandler<any>;\n\n  calendarModel?: CalendarModel;\n  onKeyDown?: (event: KeyboardEvent) => void;\n\n  today?: Date;\n  minimumDate?: Date;\n  maximumDate?: Date;\n  firstDayOfCurrentMonth?: Date;\n  isDateSelectionMode?: boolean;\n  rangeMode?: boolean;\n  tabIndex?: number;\n}\n\nexport default HvCalendarCell;\n"],"names":["useDefaultProps","useClasses","useRef","isDateRangeProp","isSameDay","isSameMonth","dateInProvidedValueRange","checkIfDateIsDisabled","jsx","HvTypography"],"mappings":";;;;;;;;AAsBa,MAAA,iBAAiB,CAAC,UAA+B;AACtD,QAAA;AAAA,IACJ,SAAS;AAAA,IACT;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,YAAY;AAAA,IACZ,GAAG;AAAA,EAAA,IACDA,gBAAgB,gBAAA,kBAAkB,KAAK;AAE3C,QAAM,EAAE,SAAS,GAAG,IAAIC,+BAAW,WAAW;AAExC,QAAA,WAAWC,aAA0B,IAAI;AAE/C,QAAM,YAAYC,MAAAA,gBAAgB,aAAa,IAC3C,cAAc,YACd;AACJ,QAAM,UAAUA,MAAAA,gBAAgB,aAAa,IACzC,cAAc,UACd;AACE,QAAA,cAAcC,MAAAA,UAAU,OAAO,KAAK;AACpC,QAAA,iBAAiBA,MAAAA,UAAU,eAAe,KAAK;AAC/C,QAAA,UAAUC,MAAAA,YAAY,OAAO,sBAAsB;AACzD,QAAM,0BACJ,aAAa,SAAS,YAAY,SAAS,YAAY;AACzD,QAAM,qBAAqB,YAAYD,MAAAA,UAAU,OAAO,SAAS,IAAI;AACrE,QAAM,yBACJ,iBAAiB,YACbE,MAAyB,yBAAA,OAAO,aAAa,IAC7C;AACN,QAAM,iBAAiBC,MAAA,sBAAsB,OAAO,aAAa,WAAW;AACtE,QAAA,eAAeH,MAAAA,UAAU,WAAW,KAAK;AACzC,QAAA,aAAaA,MAAAA,UAAU,SAAS,KAAK;AAC3C,QAAM,cAAc,uBAAuB;AAErC,QAAA,cAAc,CAAC,UAA0B;AAC7C,QAAI,OAAO;AACT,iBAAW,OAAO,KAAK;AACvB,UAAI,SAAS;AAAS,mBAAW,MAAM,UAAU,SAAS,MAAO,CAAA;AAAA,IACnE;AAAA,EAAA;AAGI,QAAA,gBAAgB,CAAC,UAAU;AAC/B,gBAAY,KAAK;AAAA,EAAA;AAGnB,QAAM,aAAa,MACjBI,2BAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAK;AAAA,MACL,MAAK;AAAA,MACL,WAAW,GAAG,QAAQ,eAAe;AAAA,QACnC,CAAC,QAAQ,cAAc,GAAG;AAAA,MAAA,CAC3B;AAAA,MACD,SAAS;AAAA,MACT,WAAW;AAAA,MACX,UAAU,kBAAkB,CAAC;AAAA,MAC7B,iBAAe;AAAA,MACd,GAAG;AAAA,MAEJ,UAAAA,2BAAA;AAAA,QAACC,WAAA;AAAA,QAAA;AAAA,UACC,SAAS,cAAc,UAAU;AAAA,UACjC,WAAW,GAAG,QAAQ,cAAc;AAAA,YAClC,CAAC,QAAQ,oBAAoB,GAAG,WAAW;AAAA,YAC3C,CAAC,QAAQ,sBAAsB,GAAG,CAAC;AAAA,YACnC,CAAC,QAAQ,4BAA4B,GACnC,WAAW,aAAa;AAAA,YAC1B,CAAC,QAAQ,oBAAoB,GAAG;AAAA,YAChC,CAAC,QAAQ,YAAY,GACnB,YACE,gBAAgB,aACf,sBAAsB;AAAA,YAC3B,CAAC,QAAQ,UAAU,GAAG,WAAW,cAAc;AAAA,UAAA,CAChD;AAAA,UAEA,UAAA,SAAS,MAAM,QAAQ;AAAA,QAAA;AAAA,MAC1B;AAAA,IAAA;AAAA,EAAA;AAKF,SAAAD,2BAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW,GAAG,QAAQ,aAAa;AAAA,QACjC,CAAC,QAAQ,YAAY,GAAG,WAAW,aAAa;AAAA,QAChD,CAAC,QAAQ,iBAAiB,GAAG,aAAa,CAAC;AAAA,MAAA,CAC5C;AAAA,MACD,sBAAmB;AAAA,MAElB,UAAW,WAAA;AAAA,IAAA;AAAA,EAAA;AAGlB;;;;"}

package/dist/cjs/Calendar/SingleCalendar/CalendarCell.styles.cjs

@@ -0,0 +1,79 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const uikitStyles = require("@hitachivantara/uikit-styles");
+const focusUtils = require("../../utils/focusUtils.cjs");
+const classes = require("../../utils/classes.cjs");
+const hover = {
+  backgroundColor: uikitStyles.theme.colors.containerBackgroundHover,
+  cursor: "pointer"
+};
+const { staticClasses, useClasses } = classes.createClasses("HvCalendarCell", {
+  cellContainer: {
+    cursor: "pointer",
+    border: 0,
+    padding: 0,
+    margin: 0,
+    backgroundColor: "transparent"
+  },
+  focusSelection: {
+    "&:hover": {
+      ...hover
+    },
+    "&:focus": {
+      outline: "none"
+    },
+    "&:focus-visible": {
+      ...hover,
+      ...focusUtils.outlineStyles
+    }
+  },
+  calendarDate: {
+    display: "flex",
+    justifyContent: "center",
+    flexDirection: "column",
+    textAlign: "center",
+    height: "40px",
+    width: "40px"
+  },
+  calendarDateSelected: {
+    backgroundColor: uikitStyles.theme.colors.atmo3,
+    color: uikitStyles.theme.colors.secondary,
+    "&:hover": {
+      ...hover
+    }
+  },
+  calendarDateNotInMonth: {
+    color: uikitStyles.theme.colors.secondary_60,
+    cursor: "not-allowed"
+  },
+  calendarDateInSelectionRange: {
+    backgroundColor: uikitStyles.theme.colors.atmo3
+  },
+  calendarDateDisabled: {
+    color: uikitStyles.theme.colors.secondary_60,
+    cursor: "no-drop"
+  },
+  startBookend: {
+    borderLeft: `1px solid ${uikitStyles.theme.colors.secondary}`
+  },
+  endBookend: {
+    borderRight: `1px solid ${uikitStyles.theme.colors.secondary}`
+  },
+  dateWrapper: {
+    width: "40px",
+    height: "40px"
+  },
+  cellsInRange: {
+    "&:focus": {
+      outside: "none"
+    }
+  },
+  cellsOutsideRange: {
+    "&:focus": {
+      outside: "none"
+    }
+  }
+});
+exports.staticClasses = staticClasses;
+exports.useClasses = useClasses;
+//# sourceMappingURL=CalendarCell.styles.cjs.map

package/dist/cjs/Calendar/SingleCalendar/CalendarCell.styles.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"CalendarCell.styles.cjs","sources":["../../../../src/Calendar/SingleCalendar/CalendarCell.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { outlineStyles } from \"../../utils/focusUtils\";\n\nimport { createClasses } from \"../../utils/classes\";\n\nconst hover = {\n  backgroundColor: theme.colors.containerBackgroundHover,\n  cursor: \"pointer\",\n};\n\nexport const { staticClasses, useClasses } = createClasses(\"HvCalendarCell\", {\n  cellContainer: {\n    cursor: \"pointer\",\n    border: 0,\n    padding: 0,\n    margin: 0,\n    backgroundColor: \"transparent\",\n  },\n  focusSelection: {\n    \"&:hover\": {\n      ...hover,\n    },\n    \"&:focus\": {\n      outline: \"none\",\n    },\n    \"&:focus-visible\": {\n      ...hover,\n      ...outlineStyles,\n    },\n  },\n  calendarDate: {\n    display: \"flex\",\n    justifyContent: \"center\",\n    flexDirection: \"column\",\n    textAlign: \"center\",\n    height: \"40px\",\n    width: \"40px\",\n  },\n  calendarDateSelected: {\n    backgroundColor: theme.colors.atmo3,\n    color: theme.colors.secondary,\n    \"&:hover\": {\n      ...hover,\n    },\n  },\n  calendarDateNotInMonth: {\n    color: theme.colors.secondary_60,\n    cursor: \"not-allowed\",\n  },\n  calendarDateInSelectionRange: {\n    backgroundColor: theme.colors.atmo3,\n  },\n  calendarDateDisabled: {\n    color: theme.colors.secondary_60,\n    cursor: \"no-drop\",\n  },\n  startBookend: {\n    borderLeft: `1px solid ${theme.colors.secondary}`,\n  },\n  endBookend: {\n    borderRight: `1px solid ${theme.colors.secondary}`,\n  },\n  dateWrapper: {\n    width: \"40px\",\n    height: \"40px\",\n  },\n  cellsInRange: {\n    \"&:focus\": {\n      outside: \"none\",\n    },\n  },\n  cellsOutsideRange: {\n    \"&:focus\": {\n      outside: \"none\",\n    },\n  },\n});\n"],"names":["theme","createClasses","outlineStyles"],"mappings":";;;;;AAMA,MAAM,QAAQ;AAAA,EACZ,iBAAiBA,YAAAA,MAAM,OAAO;AAAA,EAC9B,QAAQ;AACV;AAEO,MAAM,EAAE,eAAe,eAAeC,QAAAA,cAAc,kBAAkB;AAAA,EAC3E,eAAe;AAAA,IACb,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,SAAS;AAAA,IACT,QAAQ;AAAA,IACR,iBAAiB;AAAA,EACnB;AAAA,EACA,gBAAgB;AAAA,IACd,WAAW;AAAA,MACT,GAAG;AAAA,IACL;AAAA,IACA,WAAW;AAAA,MACT,SAAS;AAAA,IACX;AAAA,IACA,mBAAmB;AAAA,MACjB,GAAG;AAAA,MACH,GAAGC,WAAA;AAAA,IACL;AAAA,EACF;AAAA,EACA,cAAc;AAAA,IACZ,SAAS;AAAA,IACT,gBAAgB;AAAA,IAChB,eAAe;AAAA,IACf,WAAW;AAAA,IACX,QAAQ;AAAA,IACR,OAAO;AAAA,EACT;AAAA,EACA,sBAAsB;AAAA,IACpB,iBAAiBF,YAAAA,MAAM,OAAO;AAAA,IAC9B,OAAOA,YAAAA,MAAM,OAAO;AAAA,IACpB,WAAW;AAAA,MACT,GAAG;AAAA,IACL;AAAA,EACF;AAAA,EACA,wBAAwB;AAAA,IACtB,OAAOA,YAAAA,MAAM,OAAO;AAAA,IACpB,QAAQ;AAAA,EACV;AAAA,EACA,8BAA8B;AAAA,IAC5B,iBAAiBA,YAAAA,MAAM,OAAO;AAAA,EAChC;AAAA,EACA,sBAAsB;AAAA,IACpB,OAAOA,YAAAA,MAAM,OAAO;AAAA,IACpB,QAAQ;AAAA,EACV;AAAA,EACA,cAAc;AAAA,IACZ,YAAY,aAAaA,YAAM,MAAA,OAAO,SAAS;AAAA,EACjD;AAAA,EACA,YAAY;AAAA,IACV,aAAa,aAAaA,YAAM,MAAA,OAAO,SAAS;AAAA,EAClD;AAAA,EACA,aAAa;AAAA,IACX,OAAO;AAAA,IACP,QAAQ;AAAA,EACV;AAAA,EACA,cAAc;AAAA,IACZ,WAAW;AAAA,MACT,SAAS;AAAA,IACX;AAAA,EACF;AAAA,EACA,mBAAmB;AAAA,IACjB,WAAW;AAAA,MACT,SAAS;AAAA,IACX;AAAA,EACF;AACF,CAAC;;;"}

package/dist/cjs/Calendar/SingleCalendar/SingleCalendar.cjs

@@ -0,0 +1,156 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("@emotion/react/jsx-runtime");
+const React = require("react");
+const keyboardUtils = require("../../utils/keyboardUtils.cjs");
+const setId = require("../../utils/setId.cjs");
+const utils = require("../utils.cjs");
+const model = require("../model.cjs");
+const CalendarCell = require("./CalendarCell.cjs");
+const CalendarHeader = require("../CalendarHeader/CalendarHeader.cjs");
+const SingleCalendar_styles = require("./SingleCalendar.styles.cjs");
+const ComposedNavigation = require("../CalendarNavigation/ComposedNavigation/ComposedNavigation.cjs");
+const MonthSelector = require("../CalendarNavigation/MonthSelector/MonthSelector.cjs");
+const Typography = require("../../Typography/Typography.cjs");
+const HvSingleCalendar = ({
+  classes: classesProp,
+  className,
+  id,
+  locale = "en-US",
+  value,
+  visibleMonth,
+  visibleYear,
+  minimumDate,
+  maximumDate,
+  onChange,
+  onInputChange,
+  onVisibleDateChange,
+  showEndDate,
+  showDayOfWeek,
+  invalidDateLabel,
+  children,
+  ...others
+}) => {
+  const { classes, cx } = SingleCalendar_styles.useClasses(classesProp);
+  const today = /* @__PURE__ */ new Date();
+  const localValue = value ?? today;
+  const [calViewMode, setCalViewMode] = React.useState("calendar");
+  const rangeMode = utils.isRange(localValue);
+  const isDateSelectionMode = rangeMode && !utils.isDate(localValue.endDate);
+  const calModel = rangeMode ? model.generateCalendarModel(localValue.startDate, visibleMonth, visibleYear) : model.generateCalendarModel(localValue, visibleMonth, visibleYear);
+  const firstDayOfCurrentMonth = new Date(calModel.year, calModel.month - 1, 1);
+  const firstDayOfCurrentMonthTime = firstDayOfCurrentMonth.getTime();
+  const listWeekdayNames = React.useMemo(() => utils.getWeekdayNamesList(locale), [locale]);
+  const handleChange = (event, date) => {
+    event?.preventDefault();
+    onChange?.(event, date);
+  };
+  const handleInputChange = (event, date) => {
+    event?.preventDefault();
+    onInputChange?.(event, date);
+  };
+  const getNavChild = (event, siblings, i) => {
+    if (keyboardUtils.isKey(event, "ArrowLeft"))
+      return siblings[i - 1];
+    if (keyboardUtils.isKey(event, "ArrowRight"))
+      return siblings[i + 1];
+    if (keyboardUtils.isKey(event, "ArrowUp"))
+      return siblings[i - 7];
+    if (keyboardUtils.isKey(event, "ArrowDown"))
+      return siblings[i + 7];
+    return void 0;
+  };
+  const handleKeyDown = (event) => {
+    const el = document?.activeElement;
+    const parent = el?.parentElement?.parentElement;
+    const siblings = parent != null ? Array.from(
+      parent.getElementsByClassName(classes.cellContainer)
+    ) : [];
+    const elIndex = el ? siblings.indexOf(el) : 0;
+    if (keyboardUtils.isKey(event, "Enter")) {
+      el.focus();
+      return;
+    }
+    const child = getNavChild(event, siblings, elIndex);
+    if (child) {
+      const inMonth = child.getAttribute("data-in-month");
+      if (inMonth === "true") {
+        event?.preventDefault();
+        child?.focus();
+      }
+    }
+  };
+  const renderWeekLabel = (dayName, index) => /* @__PURE__ */ jsxRuntime.jsx(Typography.HvTypography, { variant: "label", className: classes.calendarDay, children: dayName }, index);
+  const renderCalendarDate = (currentDate) => {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      CalendarCell.HvCalendarCell,
+      {
+        classes,
+        tabIndex: currentDate.getTime() === firstDayOfCurrentMonthTime ? 0 : -1,
+        onChange: handleChange,
+        onKeyDown: handleKeyDown,
+        value: currentDate,
+        today,
+        calendarValue: localValue,
+        rangeMode,
+        isDateSelectionMode,
+        locale,
+        firstDayOfCurrentMonth,
+        maximumDate,
+        minimumDate
+      },
+      currentDate.toString()
+    );
+  };
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx(classes.calendarContainer, className), ...others, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { id, className: classes.calendarWrapper, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      CalendarHeader.HvCalendarHeader,
+      {
+        id: setId.setId(id, "header"),
+        locale,
+        onChange: handleInputChange,
+        showEndDate: showEndDate && !isDateSelectionMode,
+        showDayOfWeek,
+        invalidDateLabel
+      }
+    ),
+    calViewMode === "calendar" && /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        ComposedNavigation.HvComposedNavigation,
+        {
+          id,
+          locale,
+          onChange: onVisibleDateChange,
+          onViewModeChange: setCalViewMode,
+          visibleYear: visibleYear || today.getFullYear(),
+          visibleMonth: visibleMonth || today.getMonth() + 1
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsxs(
+        "div",
+        {
+          className: classes.calendarGrid,
+          "aria-controls": CalendarHeader.HvCalendarHeader?.[0]?.id,
+          children: [
+            listWeekdayNames.map(renderWeekLabel),
+            calModel.dates.map(renderCalendarDate)
+          ]
+        }
+      )
+    ] }),
+    calViewMode === "monthly" && /* @__PURE__ */ jsxRuntime.jsx(
+      MonthSelector.HvMonthSelector,
+      {
+        id,
+        locale,
+        onChange: onVisibleDateChange,
+        onViewModeChange: setCalViewMode,
+        visibleMonth: visibleMonth || today.getMonth() + 1,
+        rangeMode
+      }
+    )
+  ] }) });
+};
+exports.singleCalendarClasses = SingleCalendar_styles.staticClasses;
+exports.HvSingleCalendar = HvSingleCalendar;
+//# sourceMappingURL=SingleCalendar.cjs.map