@kaizen/components 1.27.0 → 1.28.0

package/dist/cjs/utils/useMediaQueries.cjs

@@ -0,0 +1,169 @@
+'use strict';
+
+var tslib = require('tslib');
+var React = require('react');
+var designTokens = require('@kaizen/design-tokens');
+var subtractOnePixel = function (breakpoint) {
+  return "".concat(parseInt(breakpoint, 10) - 1, "px");
+};
+var useMediaQueries = function (propQueries) {
+  if (propQueries === void 0) {
+    propQueries = {};
+  }
+  if (typeof window === "undefined") {
+    return {
+      queries: {
+        isSmall: false,
+        isMedium: false,
+        isLarge: false,
+        isMediumOrSmaller: false,
+        isMediumOrLarger: true
+      },
+      components: {
+        SmallOnly: function () {
+          return React.createElement(React.Fragment, null);
+        },
+        MediumOnly: function () {
+          return React.createElement(React.Fragment, null);
+        },
+        LargeOnly: function () {
+          return React.createElement(React.Fragment, null);
+        },
+        MediumOrSmaller: function () {
+          return React.createElement(React.Fragment, null);
+        },
+        MediumOrLarger: function (props) {
+          return React.createElement(React.Fragment, null, props.children);
+        }
+      }
+    };
+  }
+  var theme = designTokens.useTheme();
+  // The `addEventListener` calls blow up legacy Edge (<= v18/pre chromium),
+  // so we disable the functionality of updating after page load.
+  var isLegacyEdge = navigator.userAgent.match(/Edge/);
+  var isUnsupportedSafari = window.matchMedia("").addEventListener === undefined;
+  // ---------------------------------------
+  // Create Kaizen breakpoint matches for initial state
+  // ---------------------------------------
+  var smallMatchMedia = React.useMemo(function () {
+    return window.matchMedia("(max-width: ".concat(subtractOnePixel(theme.layout.breakpoints.medium), ")"));
+  }, [theme.layout.breakpoints.medium]);
+  var mediumMatchMedia = React.useMemo(function () {
+    return window.matchMedia("(min-width: ".concat(theme.layout.breakpoints.medium, ") and (max-width: ").concat(subtractOnePixel(theme.layout.breakpoints.large), ")"));
+  }, [theme.layout.breakpoints.large]);
+  var largeMatchMedia = React.useMemo(function () {
+    return window.matchMedia("(min-width: ".concat(theme.layout.breakpoints.large, ")"));
+  }, [theme.layout.breakpoints.large]);
+  var isSmall = smallMatchMedia.matches || false;
+  var isMedium = mediumMatchMedia.matches || false;
+  var isLarge = largeMatchMedia.matches || false;
+  var _a = React.useState({
+      isSmall: isSmall,
+      isMedium: isMedium,
+      isLarge: isLarge,
+      isMediumOrSmaller: !isLarge,
+      isMediumOrLarger: !isSmall
+    }),
+    kaizenMatches = _a[0],
+    setKaizenMatches = _a[1];
+  // ---------------------------------------
+  // Create an event listener based on the medium breakpoint and update state whenever it changes
+  // ---------------------------------------
+  React.useEffect(function () {
+    if (isLegacyEdge || isUnsupportedSafari) {
+      return;
+    }
+    var updateMatches = function () {
+      var isSmallAfterUpdate = smallMatchMedia.matches || false;
+      var isMediumAfterUpdate = mediumMatchMedia.matches || false;
+      var isLargeAfterUpdate = largeMatchMedia.matches || false;
+      setKaizenMatches({
+        isSmall: isSmallAfterUpdate,
+        isMedium: isMediumAfterUpdate,
+        isLarge: isLargeAfterUpdate,
+        isMediumOrSmaller: !isLargeAfterUpdate,
+        isMediumOrLarger: !isSmallAfterUpdate
+      });
+    };
+    mediumMatchMedia.addEventListener("change", updateMatches, true);
+    return function () {
+      mediumMatchMedia.removeEventListener("change", updateMatches);
+    };
+  }, []);
+  // ---------------------------------------
+  // Create custom queries matches for initial state
+  // ---------------------------------------
+  var customQueryMatchMedias = new Map();
+  var customQueryMatches = {};
+  new Map(Object.entries(propQueries)).forEach(function (queryString, queryName) {
+    var matchMedia = window.matchMedia(queryString);
+    customQueryMatches[queryName] = matchMedia.matches || false;
+    // Store this matchMedia so that we can loop over it later and add event listeners
+    customQueryMatchMedias.set(queryName, matchMedia);
+  });
+  var _b = React.useState(customQueryMatches),
+    customMatches = _b[0],
+    setCustomMatches = _b[1];
+  // ---------------------------------------
+  // Create an event listener for each custom query
+  // ---------------------------------------
+  React.useEffect(function () {
+    if (isLegacyEdge || isUnsupportedSafari) {
+      return;
+    }
+    var updateCustomMatches = function (matchMedia, queryName) {
+      var _a;
+      return setCustomMatches(tslib.__assign(tslib.__assign({}, customQueryMatches), (_a = {}, _a[queryName] = matchMedia.matches || false, _a)));
+    };
+    var allEventListeners = new Map();
+    customQueryMatchMedias.forEach(function (matchMedia, queryName) {
+      // Store this method so that we can reference it in the cleanup function below
+      var updateCustomMatchesForQuery = function () {
+        updateCustomMatches(matchMedia, queryName);
+      };
+      allEventListeners.set(matchMedia, updateCustomMatchesForQuery);
+      // Add the event listener
+      matchMedia.addEventListener("change", updateCustomMatchesForQuery, true);
+    });
+    return function () {
+      allEventListeners.forEach(function (eventListener, matchMedia) {
+        matchMedia.removeEventListener("change", eventListener);
+      });
+    };
+  }, []);
+  var kaizenComponents = {
+    SmallOnly: function (props) {
+      return React.createElement(React.Fragment, null, kaizenMatches.isSmall && props.children);
+    },
+    MediumOnly: function (props) {
+      return React.createElement(React.Fragment, null, kaizenMatches.isMedium && props.children);
+    },
+    LargeOnly: function (props) {
+      return React.createElement(React.Fragment, null, kaizenMatches.isLarge && props.children);
+    },
+    MediumOrSmaller: function (props) {
+      return React.createElement(React.Fragment, null, kaizenMatches.isMediumOrSmaller && props.children);
+    },
+    MediumOrLarger: function (props) {
+      return React.createElement(React.Fragment, null, kaizenMatches.isMediumOrLarger && props.children);
+    }
+  };
+  // ---------------------------------------
+  // Create custom query helper components
+  // ---------------------------------------
+  var customComponents = {};
+  Object.keys(propQueries).map(function (key) {
+    var componentName = key.charAt(0).toUpperCase() + key.slice(1);
+    customComponents[componentName] = function (props) {
+      return React.createElement(React.Fragment, null, customMatches[key] && props.children);
+    };
+  });
+  return {
+    queries: tslib.__assign(tslib.__assign({}, kaizenMatches), customQueryMatches),
+    components: tslib.__assign(tslib.__assign({}, kaizenComponents), customComponents)
+  };
+};
+exports.subtractOnePixel = subtractOnePixel;
+exports.useMediaQueries = useMediaQueries;
+//# sourceMappingURL=useMediaQueries.cjs.map

package/dist/cjs/utils/useMediaQueries.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useMediaQueries.cjs","sources":["../../../src/utils/useMediaQueries.tsx"],"sourcesContent":["import React, { useEffect, useState, ReactNode, useMemo } from \"react\"\nimport { useTheme } from \"@kaizen/design-tokens\"\n\ntype Props = { [key: string]: string }\ntype GenericChildrenType = { children?: ReactNode }\n\nexport const subtractOnePixel = (breakpoint: string): string =>\n  `${parseInt(breakpoint, 10) - 1}px`\n\nexport const useMediaQueries = (\n  propQueries: Props = {}\n): {\n  queries: {\n    [key: string]: boolean\n    isSmall: boolean\n    isMedium: boolean\n    isLarge: boolean\n    isMediumOrSmaller: boolean\n    isMediumOrLarger: boolean\n  }\n  components: {\n    [key: string]: (props: GenericChildrenType) => JSX.Element\n    SmallOnly: (props: GenericChildrenType) => JSX.Element\n    MediumOnly: (props: GenericChildrenType) => JSX.Element\n    LargeOnly: (props: GenericChildrenType) => JSX.Element\n    MediumOrSmaller: (props: GenericChildrenType) => JSX.Element\n    MediumOrLarger: (props: GenericChildrenType) => JSX.Element\n  }\n} => {\n  if (typeof window === \"undefined\") {\n    return {\n      queries: {\n        isSmall: false,\n        isMedium: false,\n        isLarge: false,\n        isMediumOrSmaller: false,\n        isMediumOrLarger: true,\n      },\n      components: {\n        SmallOnly: () => <></>,\n        MediumOnly: () => <></>,\n        LargeOnly: () => <></>,\n        MediumOrSmaller: () => <></>,\n        MediumOrLarger: (props: HelperComponentProps) => <>{props.children}</>,\n      },\n    }\n  }\n  const theme = useTheme()\n\n  // The `addEventListener` calls blow up legacy Edge (<= v18/pre chromium),\n  // so we disable the functionality of updating after page load.\n  const isLegacyEdge = navigator.userAgent.match(/Edge/)\n  const isUnsupportedSafari =\n    window.matchMedia(\"\").addEventListener === undefined\n\n  // ---------------------------------------\n  // Create Kaizen breakpoint matches for initial state\n  // ---------------------------------------\n  const smallMatchMedia = useMemo(\n    () =>\n      window.matchMedia(\n        `(max-width: ${subtractOnePixel(theme.layout.breakpoints.medium)})`\n      ),\n    [theme.layout.breakpoints.medium]\n  )\n\n  const mediumMatchMedia = useMemo(\n    () =>\n      window.matchMedia(\n        `(min-width: ${\n          theme.layout.breakpoints.medium\n        }) and (max-width: ${subtractOnePixel(theme.layout.breakpoints.large)})`\n      ),\n    [theme.layout.breakpoints.large]\n  )\n  const largeMatchMedia = useMemo(\n    () => window.matchMedia(`(min-width: ${theme.layout.breakpoints.large})`),\n    [theme.layout.breakpoints.large]\n  )\n\n  const isSmall = smallMatchMedia.matches || false\n  const isMedium = mediumMatchMedia.matches || false\n  const isLarge = largeMatchMedia.matches || false\n\n  const [kaizenMatches, setKaizenMatches] = useState<{\n    isSmall: boolean\n    isMedium: boolean\n    isLarge: boolean\n    isMediumOrSmaller: boolean\n    isMediumOrLarger: boolean\n  }>({\n    isSmall,\n    isMedium,\n    isLarge,\n    isMediumOrSmaller: !isLarge,\n    isMediumOrLarger: !isSmall,\n    // Note: ^the last two will need an adjustment in logic if/when we add more breakpoints\n  })\n\n  // ---------------------------------------\n  // Create an event listener based on the medium breakpoint and update state whenever it changes\n  // ---------------------------------------\n  useEffect(() => {\n    if (isLegacyEdge || isUnsupportedSafari) {\n      return\n    }\n\n    const updateMatches = (): void => {\n      const isSmallAfterUpdate = smallMatchMedia.matches || false\n      const isMediumAfterUpdate = mediumMatchMedia.matches || false\n      const isLargeAfterUpdate = largeMatchMedia.matches || false\n\n      setKaizenMatches({\n        isSmall: isSmallAfterUpdate,\n        isMedium: isMediumAfterUpdate,\n        isLarge: isLargeAfterUpdate,\n        isMediumOrSmaller: !isLargeAfterUpdate,\n        isMediumOrLarger: !isSmallAfterUpdate,\n      })\n    }\n\n    mediumMatchMedia.addEventListener(\"change\", updateMatches, true)\n\n    return () => {\n      mediumMatchMedia.removeEventListener(\"change\", updateMatches)\n    }\n  }, [])\n\n  // ---------------------------------------\n  // Create custom queries matches for initial state\n  // ---------------------------------------\n  const customQueryMatchMedias = new Map()\n  const customQueryMatches: Record<string, boolean> = {}\n  new Map(Object.entries(propQueries)).forEach((queryString, queryName) => {\n    const matchMedia = window.matchMedia(queryString)\n    customQueryMatches[queryName] = matchMedia.matches || false\n\n    // Store this matchMedia so that we can loop over it later and add event listeners\n    customQueryMatchMedias.set(queryName, matchMedia)\n  })\n\n  const [customMatches, setCustomMatches] =\n    useState<Record<string, boolean>>(customQueryMatches)\n\n  // ---------------------------------------\n  // Create an event listener for each custom query\n  // ---------------------------------------\n  useEffect(() => {\n    if (isLegacyEdge || isUnsupportedSafari) {\n      return\n    }\n\n    const updateCustomMatches = (\n      matchMedia: MediaQueryList,\n      queryName: string\n    ): void =>\n      setCustomMatches({\n        ...customQueryMatches,\n        [queryName]: matchMedia.matches || false,\n      })\n\n    const allEventListeners = new Map()\n    customQueryMatchMedias.forEach((matchMedia, queryName) => {\n      // Store this method so that we can reference it in the cleanup function below\n      const updateCustomMatchesForQuery = (): void => {\n        updateCustomMatches(matchMedia, queryName)\n      }\n      allEventListeners.set(matchMedia, updateCustomMatchesForQuery)\n\n      // Add the event listener\n      matchMedia.addEventListener(\"change\", updateCustomMatchesForQuery, true)\n    })\n\n    return () => {\n      allEventListeners.forEach((eventListener, matchMedia) => {\n        matchMedia.removeEventListener(\"change\", eventListener)\n      })\n    }\n  }, [])\n\n  // ---------------------------------------\n  // Create Kaizen helper components\n  // ---------------------------------------\n  type HelperComponentProps = {\n    children?: ReactNode\n  }\n\n  const kaizenComponents = {\n    SmallOnly: (props: HelperComponentProps) => (\n      <>{kaizenMatches.isSmall && props.children}</>\n    ),\n    MediumOnly: (props: HelperComponentProps) => (\n      <>{kaizenMatches.isMedium && props.children}</>\n    ),\n    LargeOnly: (props: HelperComponentProps) => (\n      <>{kaizenMatches.isLarge && props.children}</>\n    ),\n    MediumOrSmaller: (props: HelperComponentProps) => (\n      <>{kaizenMatches.isMediumOrSmaller && props.children}</>\n    ),\n    MediumOrLarger: (props: HelperComponentProps) => (\n      <>{kaizenMatches.isMediumOrLarger && props.children}</>\n    ),\n  }\n\n  // ---------------------------------------\n  // Create custom query helper components\n  // ---------------------------------------\n  const customComponents: Record<\n    string,\n    (props: GenericChildrenType) => JSX.Element\n  > = {}\n  Object.keys(propQueries).map(key => {\n    const componentName = key.charAt(0).toUpperCase() + key.slice(1)\n    customComponents[componentName] = (\n      props: HelperComponentProps\n    ): JSX.Element => <>{customMatches[key] && props.children}</>\n  })\n\n  return {\n    queries: { ...kaizenMatches, ...customQueryMatches },\n    components: { ...kaizenComponents, ...customComponents },\n  }\n}\n"],"names":["subtractOnePixel","breakpoint","concat","parseInt","useMediaQueries","propQueries","window","queries","isSmall","isMedium","isLarge","isMediumOrSmaller","isMediumOrLarger","components","SmallOnly","React","createElement","Fragment","MediumOnly","LargeOnly","MediumOrSmaller","MediumOrLarger","props","children","theme","useTheme","isLegacyEdge","navigator","userAgent","match","isUnsupportedSafari","matchMedia","addEventListener","undefined","smallMatchMedia","useMemo","layout","breakpoints","medium","mediumMatchMedia","large","largeMatchMedia","matches","_a","useState","kaizenMatches","setKaizenMatches","useEffect","updateMatches","isSmallAfterUpdate","isMediumAfterUpdate","isLargeAfterUpdate","removeEventListener","customQueryMatchMedias","Map","customQueryMatches","Object","entries","forEach","queryString","queryName","set","_b","customMatches","setCustomMatches","updateCustomMatches","__assign","allEventListeners","updateCustomMatchesForQuery","eventListener","kaizenComponents","customComponents","keys","map","key","componentName","charAt","toUpperCase","slice"],"mappings":";;;;;AAMO,IAAMA,gBAAgB,GAAG,SAAAA,CAACC,UAAkB,EAAA;EACjD,OAAA,EAAA,CAAAC,MAAA,CAAGC,QAAQ,CAACF,UAAU,EAAE,EAAE,CAAC,GAAG,CAAC,EAAI,IAAA,CAAA;AAAnC,CAAmC;AAE9B,IAAMG,eAAe,GAAG,SAAAA,CAC7BC,WAAuB,EAAA;EAAvB,IAAAA,WAAA,KAAA,KAAA,CAAA,EAAA;IAAAA,WAAuB,GAAA,CAAA,CAAA;EAAA;EAmBvB,IAAI,OAAOC,MAAM,KAAK,WAAW,EAAE;IACjC,OAAO;MACLC,OAAO,EAAE;QACPC,OAAO,EAAE,KAAK;QACdC,QAAQ,EAAE,KAAK;QACfC,OAAO,EAAE,KAAK;QACdC,iBAAiB,EAAE,KAAK;QACxBC,gBAAgB,EAAE;MACnB,CAAA;MACDC,UAAU,EAAE;QACVC,SAAS,EAAE,SAAAA,CAAA,EAAA;UAAM,OAAAC,KAAA,CAAAC,aAAA,CAAAD,KAAA,CAAAE,QAAA,EAAA,IAAA,CAAK;QAAA,CAAA;QACtBC,UAAU,EAAE,SAAAA,CAAA,EAAA;UAAM,OAAAH,KAAA,CAAAC,aAAA,CAAAD,KAAA,CAAAE,QAAA,EAAA,IAAA,CAAK;QAAA,CAAA;QACvBE,SAAS,EAAE,SAAAA,CAAA,EAAA;UAAM,OAAAJ,KAAA,CAAAC,aAAA,CAAAD,KAAA,CAAAE,QAAA,EAAA,IAAA,CAAK;QAAA,CAAA;QACtBG,eAAe,EAAE,SAAAA,CAAA,EAAA;UAAM,OAAAL,KAAA,CAAAC,aAAA,CAAAD,KAAA,CAAAE,QAAA,EAAA,IAAA,CAAK;QAAA,CAAA;QAC5BI,cAAc,EAAE,SAAAA,CAACC,KAA2B,EAAK;UAAA,OAAAP,KAAG,CAAAC,aAAA,CAAAD,KAAA,CAAAE,QAAA,EAAA,IAAA,EAAAK,KAAK,CAACC,QAAQ,CAAI;QAAA;MACvE;KACF;EACF;EACD,IAAMC,KAAK,GAAGC,YAAAA,CAAAA,QAAQ,EAAE;;;EAIxB,IAAMC,YAAY,GAAGC,SAAS,CAACC,SAAS,CAACC,KAAK,CAAC,MAAM,CAAC;EACtD,IAAMC,mBAAmB,GACvBxB,MAAM,CAACyB,UAAU,CAAC,EAAE,CAAC,CAACC,gBAAgB,KAAKC,SAAS;;;;EAKtD,IAAMC,eAAe,GAAGC,KAAAA,CAAAA,OAAO,CAC7B,YAAA;IACE,OAAA7B,MAAM,CAACyB,UAAU,CACf,cAAA,CAAA7B,MAAA,CAAeF,gBAAgB,CAACwB,KAAK,CAACY,MAAM,CAACC,WAAW,CAACC,MAAM,CAAC,MAAG,CACpE;EAAA,CAAA,EACH,CAACd,KAAK,CAACY,MAAM,CAACC,WAAW,CAACC,MAAM,CAAC,CAClC;EAED,IAAMC,gBAAgB,GAAGJ,KAAAA,CAAAA,OAAO,CAC9B,YAAA;IACE,OAAA7B,MAAM,CAACyB,UAAU,CACf,cAAA,CAAA7B,MAAA,CACEsB,KAAK,CAACY,MAAM,CAACC,WAAW,CAACC,MAAM,+BACZtC,gBAAgB,CAACwB,KAAK,CAACY,MAAM,CAACC,WAAW,CAACG,KAAK,CAAC,EAAA,GAAA,CAAG,CACzE;EAAA,CAAA,EACH,CAAChB,KAAK,CAACY,MAAM,CAACC,WAAW,CAACG,KAAK,CAAC,CACjC;EACD,IAAMC,eAAe,GAAGN,aAAO,CAC7B;IAAM,OAAA7B,MAAM,CAACyB,UAAU,CAAC,cAAA,CAAA7B,MAAA,CAAesB,KAAK,CAACY,MAAM,CAACC,WAAW,CAACG,KAAK,EAAG,GAAA,CAAA,CAAC;GAAA,EACzE,CAAChB,KAAK,CAACY,MAAM,CAACC,WAAW,CAACG,KAAK,CAAC,CACjC;EAED,IAAMhC,OAAO,GAAG0B,eAAe,CAACQ,OAAO,IAAI,KAAK;EAChD,IAAMjC,QAAQ,GAAG8B,gBAAgB,CAACG,OAAO,IAAI,KAAK;EAClD,IAAMhC,OAAO,GAAG+B,eAAe,CAACC,OAAO,IAAI,KAAK;EAE1C,IAAAC,EAAA,GAAoCC,KAAAA,CAAAA,QAAQ,CAM/C;MACDpC,OAAO,EAAAA,OAAA;MACPC,QAAQ,EAAAA,QAAA;MACRC,OAAO,EAAAA,OAAA;MACPC,iBAAiB,EAAE,CAACD,OAAO;MAC3BE,gBAAgB,EAAE,CAACJ;IAEpB,CAAA,CAAC;IAbKqC,aAAa,GAAAF,EAAA,CAAA,CAAA,CAAA;IAAEG,gBAAgB,QAapC;;;;EAKFC,KAAAA,CAAAA,SAAS,CAAC,YAAA;IACR,IAAIrB,YAAY,IAAII,mBAAmB,EAAE;MACvC;IACD;IAED,IAAMkB,aAAa,GAAG,SAAAA,CAAA,EAAA;MACpB,IAAMC,kBAAkB,GAAGf,eAAe,CAACQ,OAAO,IAAI,KAAK;MAC3D,IAAMQ,mBAAmB,GAAGX,gBAAgB,CAACG,OAAO,IAAI,KAAK;MAC7D,IAAMS,kBAAkB,GAAGV,eAAe,CAACC,OAAO,IAAI,KAAK;MAE3DI,gBAAgB,CAAC;QACftC,OAAO,EAAEyC,kBAAkB;QAC3BxC,QAAQ,EAAEyC,mBAAmB;QAC7BxC,OAAO,EAAEyC,kBAAkB;QAC3BxC,iBAAiB,EAAE,CAACwC,kBAAkB;QACtCvC,gBAAgB,EAAE,CAACqC;MACpB,CAAA,CAAC;IACJ,CAAC;IAEDV,gBAAgB,CAACP,gBAAgB,CAAC,QAAQ,EAAEgB,aAAa,EAAE,IAAI,CAAC;IAEhE,OAAO,YAAA;MACLT,gBAAgB,CAACa,mBAAmB,CAAC,QAAQ,EAAEJ,aAAa,CAAC;IAC/D,CAAC;EACF,CAAA,EAAE,EAAE,CAAC;;;;EAKN,IAAMK,sBAAsB,GAAG,IAAIC,GAAG,EAAE;EACxC,IAAMC,kBAAkB,GAA4B,CAAA,CAAE;EACtD,IAAID,GAAG,CAACE,MAAM,CAACC,OAAO,CAACpD,WAAW,CAAC,CAAC,CAACqD,OAAO,CAAC,UAACC,WAAW,EAAEC,SAAS,EAAA;IAClE,IAAM7B,UAAU,GAAGzB,MAAM,CAACyB,UAAU,CAAC4B,WAAW,CAAC;IACjDJ,kBAAkB,CAACK,SAAS,CAAC,GAAG7B,UAAU,CAACW,OAAO,IAAI,KAAK;;IAG3DW,sBAAsB,CAACQ,GAAG,CAACD,SAAS,EAAE7B,UAAU,CAAC;EACnD,CAAC,CAAC;EAEI,IAAA+B,EAAA,GACJlB,KAAAA,CAAAA,QAAQ,CAA0BW,kBAAkB,CAAC;IADhDQ,aAAa,GAAAD,EAAA,CAAA,CAAA,CAAA;IAAEE,gBAAgB,GAAAF,EAAA,CAAA,CAAA,CACiB;;;;EAKvDf,KAAAA,CAAAA,SAAS,CAAC,YAAA;IACR,IAAIrB,YAAY,IAAII,mBAAmB,EAAE;MACvC;IACD;IAED,IAAMmC,mBAAmB,GAAG,SAAAA,CAC1BlC,UAA0B,EAC1B6B,SAAiB,EAAA;;MAEjB,OAAAI,gBAAgB,CACXE,KAAAA,CAAAA,QAAA,CAAAA,KAAAA,CAAAA,QAAA,CAAA,CAAA,CAAA,EAAAX,kBAAkB,CACpB,GAAAZ,EAAA,GAAA,CAAA,CAAA,EAAAA,EAAA,CAAAiB,SAAS,CAAG,GAAA7B,UAAU,CAACW,OAAO,IAAI,KAAK,EACxCC,EAAA,CAAA,CAAA,CAAA;IAHF,CAGE;IAEJ,IAAMwB,iBAAiB,GAAG,IAAIb,GAAG,EAAE;IACnCD,sBAAsB,CAACK,OAAO,CAAC,UAAC3B,UAAU,EAAE6B,SAAS,EAAA;;MAEnD,IAAMQ,2BAA2B,GAAG,SAAAA,CAAA,EAAA;QAClCH,mBAAmB,CAAClC,UAAU,EAAE6B,SAAS,CAAC;MAC5C,CAAC;MACDO,iBAAiB,CAACN,GAAG,CAAC9B,UAAU,EAAEqC,2BAA2B,CAAC;;MAG9DrC,UAAU,CAACC,gBAAgB,CAAC,QAAQ,EAAEoC,2BAA2B,EAAE,IAAI,CAAC;IAC1E,CAAC,CAAC;IAEF,OAAO,YAAA;MACLD,iBAAiB,CAACT,OAAO,CAAC,UAACW,aAAa,EAAEtC,UAAU,EAAA;QAClDA,UAAU,CAACqB,mBAAmB,CAAC,QAAQ,EAAEiB,aAAa,CAAC;MACzD,CAAC,CAAC;IACJ,CAAC;EACF,CAAA,EAAE,EAAE,CAAC;EASN,IAAMC,gBAAgB,GAAG;IACvBxD,SAAS,EAAE,SAAAA,CAACQ,KAA2B,EAAK;MAAA,OAC1CP,KAAG,CAAAC,aAAA,CAAAD,KAAA,CAAAE,QAAA,EAAA,IAAA,EAAA4B,aAAa,CAACrC,OAAO,IAAIc,KAAK,CAACC,QAAQ,CAAI;IAC/C,CAAA;IACDL,UAAU,EAAE,SAAAA,CAACI,KAA2B,EAAK;MAAA,OAC3CP,KAAG,CAAAC,aAAA,CAAAD,KAAA,CAAAE,QAAA,EAAA,IAAA,EAAA4B,aAAa,CAACpC,QAAQ,IAAIa,KAAK,CAACC,QAAQ,CAAI;IAChD,CAAA;IACDJ,SAAS,EAAE,SAAAA,CAACG,KAA2B,EAAK;MAAA,OAC1CP,KAAG,CAAAC,aAAA,CAAAD,KAAA,CAAAE,QAAA,EAAA,IAAA,EAAA4B,aAAa,CAACnC,OAAO,IAAIY,KAAK,CAACC,QAAQ,CAAI;IAC/C,CAAA;IACDH,eAAe,EAAE,SAAAA,CAACE,KAA2B,EAAK;MAAA,OAChDP,KAAG,CAAAC,aAAA,CAAAD,KAAA,CAAAE,QAAA,EAAA,IAAA,EAAA4B,aAAa,CAAClC,iBAAiB,IAAIW,KAAK,CAACC,QAAQ,CAAI;IACzD,CAAA;IACDF,cAAc,EAAE,SAAAA,CAACC,KAA2B,EAAK;MAAA,OAC/CP,KAAG,CAAAC,aAAA,CAAAD,KAAA,CAAAE,QAAA,EAAA,IAAA,EAAA4B,aAAa,CAACjC,gBAAgB,IAAIU,KAAK,CAACC,QAAQ,CAAI;IACxD;GACF;;;;EAKD,IAAMgD,gBAAgB,GAGlB,CAAA,CAAE;EACNf,MAAM,CAACgB,IAAI,CAACnE,WAAW,CAAC,CAACoE,GAAG,CAAC,UAAAC,GAAG,EAAA;IAC9B,IAAMC,aAAa,GAAGD,GAAG,CAACE,MAAM,CAAC,CAAC,CAAC,CAACC,WAAW,CAAA,CAAE,GAAGH,GAAG,CAACI,KAAK,CAAC,CAAC,CAAC;IAChEP,gBAAgB,CAACI,aAAa,CAAC,GAAG,UAChCrD,KAA2B,EAAA;MACX,OAAAP,KAAG,CAAAC,aAAA,CAAAD,KAAA,CAAAE,QAAA,EAAA,IAAA,EAAA8C,aAAa,CAACW,GAAG,CAAC,IAAIpD,KAAK,CAACC,QAAQ,CAAI;KAAA;EAC/D,CAAC,CAAC;EAEF,OAAO;IACLhB,OAAO,EAAO2D,KAAA,CAAAA,QAAA,CAAAA,KAAA,CAAAA,QAAA,CAAA,CAAA,CAAA,EAAArB,aAAa,CAAK,EAAAU,kBAAkB,CAAE;IACpD1C,UAAU,EAAOqD,KAAA,CAAAA,QAAA,CAAAA,KAAA,CAAAA,QAAA,CAAA,CAAA,CAAA,EAAAI,gBAAgB,CAAK,EAAAC,gBAAgB;GACvD;AACH,CAAA;;"}

package/dist/esm/BrandMoment/BrandMoment.mjs

@@ -2,12 +2,12 @@ import { __rest, __assign } from 'tslib';
 import React from 'react';
 import classnames from 'classnames';
 import { assetUrl } from '@kaizen/hosted-assets';
-import { useMediaQueries } from '@kaizen/responsive';
 import { Heading, Paragraph } from '@kaizen/typography';
 import { Button } from '../Button/Button/Button.mjs';
 import '../Button/IconButton/IconButton.mjs';
 import '../Button/PaginationLink/PaginationLink.mjs';
 import '../Button/DirectionalLink/DirectionalLink.mjs';
+import { useMediaQueries } from '../utils/useMediaQueries.mjs';
 import styles from './BrandMoment.module.scss.mjs';
 
 /**

package/dist/esm/BrandMoment/BrandMoment.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"BrandMoment.mjs","sources":["../../../src/BrandMoment/BrandMoment.tsx"],"sourcesContent":["import React, { ReactNode, ReactElement, HTMLAttributes } from \"react\"\nimport classnames from \"classnames\"\nimport { SceneProps } from \"@kaizen/draft-illustration\"\nimport { assetUrl } from \"@kaizen/hosted-assets\"\nimport { useMediaQueries } from \"@kaizen/responsive\"\nimport { Heading, Paragraph } from \"@kaizen/typography\"\nimport { Button, ButtonProps } from \"~components/Button\"\nimport { OverrideClassName } from \"~types/OverrideClassName\"\nimport styles from \"./BrandMoment.module.scss\"\n\nexport type BrandMomentProps = {\n  mood: \"informative\" | \"positive\" | \"negative\"\n  illustration: ReactElement<SceneProps>\n  header: ReactNode\n  body?: ReactNode\n  primaryAction?: ButtonProps\n  secondaryAction?: ButtonProps\n  text: {\n    title: ReactNode\n    subtitle?: ReactNode\n    body?: ReactNode\n    footer?: ReactNode\n  }\n} & OverrideClassName<HTMLAttributes<HTMLDivElement>>\n\n/**\n * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3082061589/Brand+Moment Guidance} |\n * {@link https://cultureamp.design/?path=/docs/components-brand-moment--docs Storybook}\n */\nexport const BrandMoment = ({\n  mood,\n  illustration,\n  header,\n  body,\n  primaryAction,\n  secondaryAction,\n  text,\n  classNameOverride,\n  ...restProps\n}: BrandMomentProps): JSX.Element => {\n  const { queries } = useMediaQueries()\n\n  return (\n    <div\n      className={classnames(styles.body, styles[mood], classNameOverride)}\n      {...restProps}\n    >\n      <header className={styles.header}>{header}</header>\n      <main className={styles.main}>\n        <div className={styles.container}>\n          <div className={styles.mainInner}>\n            <div className={styles.left}>\n              <div className={styles.leftInner}>{illustration}</div>\n            </div>\n            <div className={styles.right}>\n              <div className={styles.rightInner}>\n                {text.subtitle && (\n                  <Heading\n                    variant=\"heading-3\"\n                    tag=\"h1\"\n                    classNameOverride={styles.subtitle}\n                  >\n                    {text.subtitle}\n                  </Heading>\n                )}\n                <Heading\n                  variant=\"display-0\"\n                  tag={text.subtitle ? \"h2\" : \"h1\"}\n                  classNameOverride={styles.title}\n                >\n                  {text.title}\n                </Heading>\n                {text.body && (\n                  <Paragraph\n                    variant=\"intro-lede\"\n                    classNameOverride={styles.textBody}\n                  >\n                    {text.body}\n                  </Paragraph>\n                )}\n                {body && <div className={styles.textBody}>{body}</div>}\n                <div className={styles.actions}>\n                  {primaryAction && (\n                    <Button\n                      primary\n                      fullWidth={queries.isSmall}\n                      {...primaryAction}\n                    />\n                  )}\n                  {secondaryAction && (\n                    <div className={styles.secondaryAction}>\n                      <Button\n                        secondary\n                        fullWidth={queries.isSmall}\n                        {...secondaryAction}\n                      />\n                    </div>\n                  )}\n                </div>\n              </div>\n            </div>\n          </div>\n        </div>\n      </main>\n      {text.footer && (\n        <footer className={styles.footer}>\n          <div className={styles.container}>\n            <div className={styles.footerInner}>\n              <div className={styles.poweredByContainer}>\n                <Paragraph variant=\"extra-small\" color=\"dark-reduced-opacity\">\n                  Powered by\n                </Paragraph>\n                <a\n                  href=\"https://www.cultureamp.com\"\n                  className={styles.poweredByLogo}\n                >\n                  <img\n                    src={assetUrl(\"brand/logo-horizontal-default.svg\")}\n                    alt=\"Culture Amp\"\n                  />\n                </a>\n              </div>\n              <div className={styles.footerTextContainer}>\n                <Paragraph variant=\"extra-small\">{text.footer}</Paragraph>\n              </div>\n            </div>\n          </div>\n        </footer>\n      )}\n    </div>\n  )\n}\n\nBrandMoment.displayName = \"BrandMoment\"\n"],"names":["BrandMoment","_a","mood","illustration","header","body","primaryAction","secondaryAction","text","classNameOverride","restProps","__rest","queries","useMediaQueries","React","createElement","__assign","className","classnames","styles","main","container","mainInner","left","leftInner","right","rightInner","subtitle","Heading","variant","tag","title","Paragraph","textBody","actions","Button","primary","fullWidth","isSmall","secondary","footer","footerInner","poweredByContainer","color","href","poweredByLogo","src","assetUrl","alt","footerTextContainer","displayName"],"mappings":"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"}
+{"version":3,"file":"BrandMoment.mjs","sources":["../../../src/BrandMoment/BrandMoment.tsx"],"sourcesContent":["import React, { ReactNode, ReactElement, HTMLAttributes } from \"react\"\nimport classnames from \"classnames\"\nimport { SceneProps } from \"@kaizen/draft-illustration\"\nimport { assetUrl } from \"@kaizen/hosted-assets\"\nimport { Heading, Paragraph } from \"@kaizen/typography\"\nimport { Button, ButtonProps } from \"~components/Button\"\nimport { OverrideClassName } from \"~types/OverrideClassName\"\nimport { useMediaQueries } from \"~utils/useMediaQueries\"\nimport styles from \"./BrandMoment.module.scss\"\n\nexport type BrandMomentProps = {\n  mood: \"informative\" | \"positive\" | \"negative\"\n  illustration: ReactElement<SceneProps>\n  header: ReactNode\n  body?: ReactNode\n  primaryAction?: ButtonProps\n  secondaryAction?: ButtonProps\n  text: {\n    title: ReactNode\n    subtitle?: ReactNode\n    body?: ReactNode\n    footer?: ReactNode\n  }\n} & OverrideClassName<HTMLAttributes<HTMLDivElement>>\n\n/**\n * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3082061589/Brand+Moment Guidance} |\n * {@link https://cultureamp.design/?path=/docs/components-brand-moment--docs Storybook}\n */\nexport const BrandMoment = ({\n  mood,\n  illustration,\n  header,\n  body,\n  primaryAction,\n  secondaryAction,\n  text,\n  classNameOverride,\n  ...restProps\n}: BrandMomentProps): JSX.Element => {\n  const { queries } = useMediaQueries()\n\n  return (\n    <div\n      className={classnames(styles.body, styles[mood], classNameOverride)}\n      {...restProps}\n    >\n      <header className={styles.header}>{header}</header>\n      <main className={styles.main}>\n        <div className={styles.container}>\n          <div className={styles.mainInner}>\n            <div className={styles.left}>\n              <div className={styles.leftInner}>{illustration}</div>\n            </div>\n            <div className={styles.right}>\n              <div className={styles.rightInner}>\n                {text.subtitle && (\n                  <Heading\n                    variant=\"heading-3\"\n                    tag=\"h1\"\n                    classNameOverride={styles.subtitle}\n                  >\n                    {text.subtitle}\n                  </Heading>\n                )}\n                <Heading\n                  variant=\"display-0\"\n                  tag={text.subtitle ? \"h2\" : \"h1\"}\n                  classNameOverride={styles.title}\n                >\n                  {text.title}\n                </Heading>\n                {text.body && (\n                  <Paragraph\n                    variant=\"intro-lede\"\n                    classNameOverride={styles.textBody}\n                  >\n                    {text.body}\n                  </Paragraph>\n                )}\n                {body && <div className={styles.textBody}>{body}</div>}\n                <div className={styles.actions}>\n                  {primaryAction && (\n                    <Button\n                      primary\n                      fullWidth={queries.isSmall}\n                      {...primaryAction}\n                    />\n                  )}\n                  {secondaryAction && (\n                    <div className={styles.secondaryAction}>\n                      <Button\n                        secondary\n                        fullWidth={queries.isSmall}\n                        {...secondaryAction}\n                      />\n                    </div>\n                  )}\n                </div>\n              </div>\n            </div>\n          </div>\n        </div>\n      </main>\n      {text.footer && (\n        <footer className={styles.footer}>\n          <div className={styles.container}>\n            <div className={styles.footerInner}>\n              <div className={styles.poweredByContainer}>\n                <Paragraph variant=\"extra-small\" color=\"dark-reduced-opacity\">\n                  Powered by\n                </Paragraph>\n                <a\n                  href=\"https://www.cultureamp.com\"\n                  className={styles.poweredByLogo}\n                >\n                  <img\n                    src={assetUrl(\"brand/logo-horizontal-default.svg\")}\n                    alt=\"Culture Amp\"\n                  />\n                </a>\n              </div>\n              <div className={styles.footerTextContainer}>\n                <Paragraph variant=\"extra-small\">{text.footer}</Paragraph>\n              </div>\n            </div>\n          </div>\n        </footer>\n      )}\n    </div>\n  )\n}\n\nBrandMoment.displayName = \"BrandMoment\"\n"],"names":["BrandMoment","_a","mood","illustration","header","body","primaryAction","secondaryAction","text","classNameOverride","restProps","__rest","queries","useMediaQueries","React","createElement","__assign","className","classnames","styles","main","container","mainInner","left","leftInner","right","rightInner","subtitle","Heading","variant","tag","title","Paragraph","textBody","actions","Button","primary","fullWidth","isSmall","secondary","footer","footerInner","poweredByContainer","color","href","poweredByLogo","src","assetUrl","alt","footerTextContainer","displayName"],"mappings":"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"}

package/dist/esm/Calendar/CalendarPopover/CalendarPopover.mjs

@@ -0,0 +1,46 @@
+import { __rest, __assign } from 'tslib';
+import React, { useState } from 'react';
+import classnames from 'classnames';
+import { usePopper } from 'react-popper';
+import styles from './CalendarPopover.module.scss.mjs';
+
+/**
+ * Only for use with Calendar components.
+ * @todo: Replace with Popover when we have a reusable one.
+ */
+const CalendarPopover = /*#__PURE__*/function () {
+  const CalendarPopover = function (_a) {
+    var children = _a.children,
+      referenceElement = _a.referenceElement,
+      popperOptions = _a.popperOptions,
+      classNameOverride = _a.classNameOverride,
+      restProps = __rest(_a, ["children", "referenceElement", "popperOptions", "classNameOverride"]);
+    var _b = useState(null),
+      popperElement = _b[0],
+      setPopperElement = _b[1];
+    var _c = usePopper(referenceElement, popperElement, __assign({
+        modifiers: [{
+          name: "offset",
+          options: {
+            offset: [0, 15]
+          }
+        }],
+        placement: "bottom-start",
+        strategy: "fixed"
+      }, popperOptions)),
+      popperStyles = _c.styles,
+      popperAttributes = _c.attributes;
+    return /*#__PURE__*/React.createElement("div", __assign({
+      ref: setPopperElement,
+      style: popperStyles === null || popperStyles === void 0 ? void 0 : popperStyles.popper
+    }, popperAttributes === null || popperAttributes === void 0 ? void 0 : popperAttributes.popper, {
+      className: classnames(styles.calendarPopover, classNameOverride),
+      role: "dialog",
+      "aria-modal": "true"
+    }, restProps), children);
+  };
+  CalendarPopover.displayName = "CalendarPopover";
+  return CalendarPopover;
+}();
+export { CalendarPopover };
+//# sourceMappingURL=CalendarPopover.mjs.map

package/dist/esm/Calendar/CalendarPopover/CalendarPopover.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"CalendarPopover.mjs","sources":["../../../../src/Calendar/CalendarPopover/CalendarPopover.tsx"],"sourcesContent":["import React, { HTMLAttributes, useState } from \"react\"\nimport { Options } from \"@popperjs/core\"\nimport classnames from \"classnames\"\nimport { usePopper } from \"react-popper\"\nimport { OverrideClassName } from \"~types/OverrideClassName\"\nimport styles from \"./CalendarPopover.module.scss\"\n\nexport type CalendarPopoverProps = {\n  children: React.ReactNode\n  referenceElement: HTMLElement | null\n  popperOptions?: Partial<Options>\n} & OverrideClassName<HTMLAttributes<HTMLDivElement>>\n\n/**\n * Only for use with Calendar components.\n * @todo: Replace with Popover when we have a reusable one.\n */\nexport const CalendarPopover = ({\n  children,\n  referenceElement,\n  popperOptions,\n  classNameOverride,\n  ...restProps\n}: CalendarPopoverProps): JSX.Element => {\n  const [popperElement, setPopperElement] = useState<HTMLDivElement | null>(\n    null\n  )\n\n  const { styles: popperStyles, attributes: popperAttributes } = usePopper(\n    referenceElement,\n    popperElement,\n    {\n      modifiers: [\n        {\n          name: \"offset\",\n          options: {\n            offset: [0, 15],\n          },\n        },\n      ],\n      placement: \"bottom-start\",\n      strategy: \"fixed\",\n      ...popperOptions,\n    }\n  )\n\n  return (\n    <div\n      ref={setPopperElement}\n      style={popperStyles?.popper}\n      {...popperAttributes?.popper}\n      className={classnames(styles.calendarPopover, classNameOverride)}\n      role=\"dialog\"\n      aria-modal=\"true\"\n      {...restProps}\n    >\n      {children}\n    </div>\n  )\n}\n\nCalendarPopover.displayName = \"CalendarPopover\"\n"],"names":["CalendarPopover","_a","children","referenceElement","popperOptions","classNameOverride","restProps","__rest","_b","useState","popperElement","setPopperElement","_c","usePopper","__assign","modifiers","name","options","offset","placement","strategy","popperStyles","styles","popperAttributes","React","ref","style","popper","className","classnames","calendarPopover","role","displayName"],"mappings":";;;;;;AAaA;;;AAGG;AAHH,MAIaA,eAAe;EAAA,MAAfA,eAAe,GAAG,SAAAA,CAACC,EAMT,EAAA;IALrB,IAAAC,QAAQ,GAAAD,EAAA,CAAAC,QAAA;MACRC,gBAAgB,sBAAA;MAChBC,aAAa,GAAAH,EAAA,CAAAG,aAAA;MACbC,iBAAiB,GAAAJ,EAAA,CAAAI,iBAAA;MACdC,SAAS,GAAAC,MAAA,CAAAN,EAAA,EALkB,sEAM/B,CADa;IAEN,IAAAO,EAAA,GAAoCC,QAAQ,CAChD,IAAI,CACL;MAFMC,aAAa,GAAAF,EAAA,CAAA,CAAA,CAAA;MAAEG,gBAAgB,GAAAH,EAAA,CAAA,CAAA,CAErC;IAEK,IAAAI,EAAA,GAAyDC,SAAS,CACtEV,gBAAgB,EAChBO,aAAa,EAAAI,QAAA,CAAA;QAEXC,SAAS,EAAE,CACT;UACEC,IAAI,EAAE,QAAQ;UACdC,OAAO,EAAE;YACPC,MAAM,EAAE,CAAC,CAAC,EAAE,EAAE;UACf;QACF,CAAA,CACF;QACDC,SAAS,EAAE,cAAc;QACzBC,QAAQ,EAAE;MAAO,CAAA,EACdhB,aAAa,CAAA,CAEnB;MAhBeiB,YAAY,GAAAT,EAAA,CAAAU,MAAA;MAAcC,gBAAgB,gBAgBzD;IAED,oBACEC;MACEC,GAAG,EAAEd,gBAAgB;MACrBe,KAAK,EAAEL,YAAY,KAAA,IAAA,IAAZA,YAAY,KAAZ,KAAA,CAAA,GAAA,KAAA,CAAA,GAAAA,YAAY,CAAEM;IAAM,CAAA,EACvBJ,gBAAgB,KAAhB,IAAA,IAAAA,gBAAgB,KAAhB,KAAA,CAAA,GAAA,KAAA,CAAA,GAAAA,gBAAgB,CAAEI,MAAM;MAC5BC,SAAS,EAAEC,UAAU,CAACP,MAAM,CAACQ,eAAe,EAAEzB,iBAAiB,CAAC;MAChE0B,IAAI,EAAC,QAAQ;oBACF;IAAM,CAAA,EACbzB,SAAS,CAEZ,EAAAJ,QAAQ,CACL;EAEV,CAAC;EAEDF,eAAe,CAACgC,WAAW,GAAG,iBAAiB;EAAA,OA5ClChC,eAAe;AAAA;"}

package/dist/esm/Calendar/CalendarPopover/CalendarPopover.module.scss.mjs

@@ -0,0 +1,5 @@
+var styles = {
+  "calendarPopover": "CalendarPopover-module_calendarPopover__p2xp9"
+};
+export { styles as default };
+//# sourceMappingURL=CalendarPopover.module.scss.mjs.map

package/dist/esm/Calendar/CalendarPopover/CalendarPopover.module.scss.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"CalendarPopover.module.scss.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;"}

package/dist/esm/Calendar/CalendarRange/CalendarRange.mjs

@@ -0,0 +1,72 @@
+import { __rest, __assign } from 'tslib';
+import React, { useRef, useEffect } from 'react';
+import { enAU } from 'date-fns/locale';
+import { DayPicker } from 'react-day-picker';
+import 'uuid';
+import '../../Icon/subcomponents/SVG/SVG.mjs';
+import { ArrowBackwardIcon } from '../../Icon/ArrowBackwardIcon.mjs';
+import { ArrowForwardIcon } from '../../Icon/ArrowForwardIcon.mjs';
+import { baseCalendarClassNames } from '../baseCalendarClassNames.mjs';
+import { DayOfWeek } from '../enums.mjs';
+import 'date-fns';
+import { isInvalidDate } from '../utils/isInvalidDate.mjs';
+import styles from './CalendarRange.module.scss.mjs';
+const CalendarRange = /*#__PURE__*/function () {
+  const CalendarRange = function (_a) {
+    var id = _a.id,
+      onMount = _a.onMount,
+      _b = _a.hasDivider,
+      hasDivider = _b === void 0 ? false : _b,
+      classNameOverride = _a.classNameOverride,
+      selected = _a.selected,
+      defaultMonth = _a.defaultMonth,
+      _c = _a.locale,
+      locale = _c === void 0 ? enAU : _c,
+      restProps = __rest(_a, ["id", "onMount", "hasDivider", "classNameOverride", "selected", "defaultMonth", "locale"]);
+    var calendarRef = useRef(null);
+    useEffect(function () {
+      if (calendarRef.current) onMount && onMount(calendarRef.current);
+    }, [calendarRef]);
+    var monthToShow = (selected === null || selected === void 0 ? void 0 : selected.from) || defaultMonth;
+    var selectedMonth = monthToShow && isInvalidDate(monthToShow) ? undefined : monthToShow;
+    /* eslint-disable camelcase */
+    var classNames = __assign(__assign({}, baseCalendarClassNames), {
+      month: hasDivider ? styles.monthWithDivider : styles.month,
+      caption_end: styles.captionEnd,
+      nav: styles.nav,
+      day_range_start: styles.dayRangeStart,
+      day_range_end: styles.dayRangeEnd,
+      day_range_middle: styles.dayRangeMiddle
+    });
+    /* eslint-enable camelcase */
+    return /*#__PURE__*/React.createElement("div", {
+      ref: calendarRef,
+      id: id,
+      className: classNameOverride
+    }, /*#__PURE__*/React.createElement(DayPicker, __assign({
+      mode: "range",
+      selected: selected,
+      defaultMonth: selectedMonth,
+      weekStartsOn: DayOfWeek.Mon,
+      classNames: classNames,
+      components: {
+        IconRight: function () {
+          return /*#__PURE__*/React.createElement(ArrowForwardIcon, {
+            role: "presentation"
+          });
+        },
+        IconLeft: function () {
+          return /*#__PURE__*/React.createElement(ArrowBackwardIcon, {
+            role: "presentation"
+          });
+        }
+      },
+      numberOfMonths: 2,
+      locale: locale
+    }, restProps)));
+  };
+  CalendarRange.displayName = "CalendarRange";
+  return CalendarRange;
+}();
+export { CalendarRange };
+//# sourceMappingURL=CalendarRange.mjs.map

package/dist/esm/Calendar/CalendarRange/CalendarRange.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"CalendarRange.mjs","sources":["../../../../src/Calendar/CalendarRange/CalendarRange.tsx"],"sourcesContent":["import React, { useEffect, useRef } from \"react\"\nimport { enAU } from \"date-fns/locale\"\nimport { DayPicker, DayPickerRangeProps } from \"react-day-picker\"\nimport { ArrowBackwardIcon, ArrowForwardIcon } from \"~components/Icon\"\nimport { OverrideClassName } from \"~types/OverrideClassName\"\nimport { baseCalendarClassNames } from \"../baseCalendarClassNames\"\nimport { DayOfWeek } from \"../enums\"\nimport { isInvalidDate } from \"../utils\"\nimport styles from \"./CalendarRange.module.scss\"\n\nexport type CalendarRangeElement = HTMLDivElement\n\nexport type CalendarRangeProps = {\n  id?: string\n  onMount?: (calendarElement: CalendarRangeElement) => void\n  hasDivider?: boolean\n} & OverrideClassName<Omit<DayPickerRangeProps, \"mode\">>\n\nexport const CalendarRange = ({\n  id,\n  onMount,\n  hasDivider = false,\n  classNameOverride,\n  selected,\n  defaultMonth,\n  locale = enAU,\n  ...restProps\n}: CalendarRangeProps): JSX.Element => {\n  const calendarRef = useRef<CalendarRangeElement>(null)\n\n  useEffect(() => {\n    if (calendarRef.current) onMount && onMount(calendarRef.current)\n  }, [calendarRef])\n\n  const monthToShow = selected?.from || defaultMonth\n  const selectedMonth =\n    monthToShow && isInvalidDate(monthToShow) ? undefined : monthToShow\n\n  /* eslint-disable camelcase */\n  const classNames = {\n    ...baseCalendarClassNames,\n    month: hasDivider ? styles.monthWithDivider : styles.month,\n    caption_end: styles.captionEnd,\n    nav: styles.nav,\n    day_range_start: styles.dayRangeStart,\n    day_range_end: styles.dayRangeEnd,\n    day_range_middle: styles.dayRangeMiddle,\n  } satisfies DayPickerRangeProps[\"classNames\"]\n  /* eslint-enable camelcase */\n\n  return (\n    <div ref={calendarRef} id={id} className={classNameOverride}>\n      <DayPicker\n        mode=\"range\"\n        selected={selected}\n        defaultMonth={selectedMonth}\n        weekStartsOn={DayOfWeek.Mon}\n        classNames={classNames}\n        components={{\n          IconRight: () => <ArrowForwardIcon role=\"presentation\" />,\n          IconLeft: () => <ArrowBackwardIcon role=\"presentation\" />,\n        }}\n        numberOfMonths={2}\n        locale={locale}\n        {...restProps}\n      />\n    </div>\n  )\n}\n\nCalendarRange.displayName = \"CalendarRange\"\n"],"names":["CalendarRange","_a","id","onMount","_b","hasDivider","classNameOverride","selected","defaultMonth","_c","locale","enAU","restProps","__rest","calendarRef","useRef","useEffect","current","monthToShow","from","selectedMonth","isInvalidDate","undefined","classNames","__assign","baseCalendarClassNames","month","styles","monthWithDivider","caption_end","captionEnd","nav","day_range_start","dayRangeStart","day_range_end","dayRangeEnd","day_range_middle","dayRangeMiddle","React","createElement","ref","className","DayPicker","mode","weekStartsOn","DayOfWeek","Mon","components","IconRight","ArrowForwardIcon","role","IconLeft","ArrowBackwardIcon","numberOfMonths","displayName"],"mappings":";;;;;;;;;;;;;MAkBaA,aAAa;EAAA,MAAbA,aAAa,GAAG,SAAAA,CAACC,EAST,EAAA;IARnB,IAAAC,EAAE,GAAAD,EAAA,CAAAC,EAAA;MACFC,OAAO,aAAA;MACPC,EAAA,GAAAH,EAAA,CAAAI,UAAkB;MAAlBA,UAAU,GAAGD,EAAA,KAAA,KAAA,CAAA,GAAA,KAAK,GAAAA,EAAA;MAClBE,iBAAiB,GAAAL,EAAA,CAAAK,iBAAA;MACjBC,QAAQ,GAAAN,EAAA,CAAAM,QAAA;MACRC,YAAY,GAAAP,EAAA,CAAAO,YAAA;MACZC,cAAa;MAAbC,MAAM,GAAGD,EAAA,KAAA,KAAA,CAAA,GAAAE,IAAI,GAAAF,EAAA;MACVG,SAAS,GAAAC,MAAA,CAAAZ,EAAA,EARgB,0FAS7B,CADa;IAEZ,IAAMa,WAAW,GAAGC,MAAM,CAAuB,IAAI,CAAC;IAEtDC,SAAS,CAAC,YAAA;MACR,IAAIF,WAAW,CAACG,OAAO,EAAEd,OAAO,IAAIA,OAAO,CAACW,WAAW,CAACG,OAAO,CAAC;IAClE,CAAC,EAAE,CAACH,WAAW,CAAC,CAAC;IAEjB,IAAMI,WAAW,GAAG,CAAAX,QAAQ,KAAR,IAAA,IAAAA,QAAQ,KAAR,KAAA,CAAA,GAAA,KAAA,CAAA,GAAAA,QAAQ,CAAEY,IAAI,KAAIX,YAAY;IAClD,IAAMY,aAAa,GACjBF,WAAW,IAAIG,aAAa,CAACH,WAAW,CAAC,GAAGI,SAAS,GAAGJ,WAAW;;IAGrE,IAAMK,UAAU,GAAGC,QACd,CAAAA,QAAA,CAAA,CAAA,CAAA,EAAAC,sBAAsB;MACzBC,KAAK,EAAErB,UAAU,GAAGsB,MAAM,CAACC,gBAAgB,GAAGD,MAAM,CAACD,KAAK;MAC1DG,WAAW,EAAEF,MAAM,CAACG,UAAU;MAC9BC,GAAG,EAAEJ,MAAM,CAACI,GAAG;MACfC,eAAe,EAAEL,MAAM,CAACM,aAAa;MACrCC,aAAa,EAAEP,MAAM,CAACQ,WAAW;MACjCC,gBAAgB,EAAET,MAAM,CAACU;IAAc,CAAA,CACI;;IAG7C,oBACEC,KAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;MAAKC,GAAG,EAAE1B,WAAW;MAAEZ,EAAE,EAAEA,EAAE;MAAEuC,SAAS,EAAEnC;IAAiB,CAAA,eACzDgC,KAAC,CAAAC,aAAA,CAAAG,SAAS,EACRlB,QAAA,CAAA;MAAAmB,IAAI,EAAC,OAAO;MACZpC,QAAQ,EAAEA,QAAQ;MAClBC,YAAY,EAAEY,aAAa;MAC3BwB,YAAY,EAAEC,SAAS,CAACC,GAAG;MAC3BvB,UAAU,EAAEA,UAAU;MACtBwB,UAAU,EAAE;QACVC,SAAS,EAAE,SAAAA,CAAA,EAAM;UAAA,oBAAAV,KAAC,CAAAC,aAAA,CAAAU,gBAAgB,EAAC;YAAAC,IAAI,EAAC;UAAiB,CAAA,CAAA;QAAA,CAAA;QACzDC,QAAQ,EAAE,SAAAA,CAAA,EAAM;UAAA,oBAAAb,KAAC,CAAAC,aAAA,CAAAa,iBAAiB,EAAC;YAAAF,IAAI,EAAC;UAAiB,CAAA,CAAA;QAAA;MAC1D,CAAA;MACDG,cAAc,EAAE,CAAC;MACjB3C,MAAM,EAAEA;IAAM,CAAA,EACVE,SAAS,CAAA,CACb,CACE;EAEV,CAAC;EAEDZ,aAAa,CAACsD,WAAW,GAAG,eAAe;EAAA,OApD9BtD,aAAa;AAAA;"}

package/dist/esm/Calendar/CalendarRange/CalendarRange.module.scss.mjs

@@ -0,0 +1,11 @@
+var styles = {
+  "month": "CalendarRange-module_month__un61w",
+  "monthWithDivider": "CalendarRange-module_monthWithDivider__JY-56",
+  "nav": "CalendarRange-module_nav__OtaVb",
+  "captionEnd": "CalendarRange-module_captionEnd__GSLQO",
+  "dayRangeStart": "CalendarRange-module_dayRangeStart__TwdDT",
+  "dayRangeEnd": "CalendarRange-module_dayRangeEnd__y6dEB",
+  "dayRangeMiddle": "CalendarRange-module_dayRangeMiddle__SybKY"
+};
+export { styles as default };
+//# sourceMappingURL=CalendarRange.module.scss.mjs.map

package/dist/esm/Calendar/CalendarRange/CalendarRange.module.scss.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"CalendarRange.module.scss.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;"}

package/dist/esm/Calendar/CalendarSingle/CalendarSingle.mjs

@@ -0,0 +1,68 @@
+import { __rest, __assign } from 'tslib';
+import React, { useRef, useEffect } from 'react';
+import { enAU } from 'date-fns/locale';
+import { DayPicker } from 'react-day-picker';
+import 'uuid';
+import '../../Icon/subcomponents/SVG/SVG.mjs';
+import { ArrowBackwardIcon } from '../../Icon/ArrowBackwardIcon.mjs';
+import { ArrowForwardIcon } from '../../Icon/ArrowForwardIcon.mjs';
+import { baseCalendarClassNames } from '../baseCalendarClassNames.mjs';
+import { DayOfWeek } from '../enums.mjs';
+import 'date-fns';
+import { isInvalidDate } from '../utils/isInvalidDate.mjs';
+import { isValidWeekStartsOn } from '../utils/isValidWeekStartsOn.mjs';
+import styles from './CalendarSingle.module.scss.mjs';
+const CalendarSingle = /*#__PURE__*/function () {
+  const CalendarSingle = function (_a) {
+    var id = _a.id,
+      onMount = _a.onMount,
+      classNameOverride = _a.classNameOverride,
+      selected = _a.selected,
+      defaultMonth = _a.defaultMonth,
+      _b = _a.weekStartsOn,
+      weekStartsOn = _b === void 0 ? DayOfWeek.Mon : _b,
+      _c = _a.locale,
+      locale = _c === void 0 ? enAU : _c,
+      restProps = __rest(_a, ["id", "onMount", "classNameOverride", "selected", "defaultMonth", "weekStartsOn", "locale"]);
+    var calendarRef = useRef(null);
+    useEffect(function () {
+      if (calendarRef.current) onMount === null || onMount === void 0 ? void 0 : onMount(calendarRef.current);
+    }, [calendarRef]);
+    var monthToShow = selected || defaultMonth;
+    var selectedMonth = monthToShow && isInvalidDate(monthToShow) ? undefined : monthToShow;
+    /* eslint-disable camelcase */
+    var classNames = __assign(__assign({}, baseCalendarClassNames), {
+      nav: styles.nav,
+      nav_button_next: styles.navButtonNext
+    });
+    /* eslint-enable camelcase */
+    return /*#__PURE__*/React.createElement("div", {
+      ref: calendarRef,
+      id: id,
+      className: classNameOverride
+    }, /*#__PURE__*/React.createElement(DayPicker, __assign({
+      mode: "single",
+      selected: selected && isInvalidDate(selected) ? undefined : selected,
+      defaultMonth: selectedMonth,
+      weekStartsOn: isValidWeekStartsOn(weekStartsOn) ? weekStartsOn : undefined,
+      classNames: classNames,
+      components: {
+        IconRight: function () {
+          return /*#__PURE__*/React.createElement(ArrowForwardIcon, {
+            role: "presentation"
+          });
+        },
+        IconLeft: function () {
+          return /*#__PURE__*/React.createElement(ArrowBackwardIcon, {
+            role: "presentation"
+          });
+        }
+      },
+      locale: locale
+    }, restProps)));
+  };
+  CalendarSingle.displayName = "CalendarSingle";
+  return CalendarSingle;
+}();
+export { CalendarSingle };
+//# sourceMappingURL=CalendarSingle.mjs.map

package/dist/esm/Calendar/CalendarSingle/CalendarSingle.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"CalendarSingle.mjs","sources":["../../../../src/Calendar/CalendarSingle/CalendarSingle.tsx"],"sourcesContent":["import React, { useEffect, useRef } from \"react\"\nimport { enAU } from \"date-fns/locale\"\nimport { DayPicker, DayPickerSingleProps } from \"react-day-picker\"\nimport { ArrowBackwardIcon, ArrowForwardIcon } from \"~components/Icon\"\nimport { OverrideClassName } from \"~types/OverrideClassName\"\nimport { baseCalendarClassNames } from \"../baseCalendarClassNames\"\nimport { DayOfWeek } from \"../enums\"\nimport { isInvalidDate, isValidWeekStartsOn } from \"../utils\"\nimport styles from \"./CalendarSingle.module.scss\"\n\nexport type CalendarSingleElement = HTMLDivElement\n\nexport type CalendarSingleProps = {\n  id?: string\n  onMount?: (calendarElement: CalendarSingleElement) => void\n} & OverrideClassName<Omit<DayPickerSingleProps, \"mode\">>\n\nexport const CalendarSingle = ({\n  id,\n  onMount,\n  classNameOverride,\n  selected,\n  defaultMonth,\n  weekStartsOn = DayOfWeek.Mon,\n  locale = enAU,\n  ...restProps\n}: CalendarSingleProps): JSX.Element => {\n  const calendarRef = useRef<CalendarSingleElement>(null)\n\n  useEffect(() => {\n    if (calendarRef.current) onMount?.(calendarRef.current)\n  }, [calendarRef])\n\n  const monthToShow = selected || defaultMonth\n  const selectedMonth =\n    monthToShow && isInvalidDate(monthToShow) ? undefined : monthToShow\n\n  /* eslint-disable camelcase */\n  const classNames = {\n    ...baseCalendarClassNames,\n    nav: styles.nav,\n    nav_button_next: styles.navButtonNext,\n  } satisfies DayPickerSingleProps[\"classNames\"]\n  /* eslint-enable camelcase */\n\n  return (\n    <div ref={calendarRef} id={id} className={classNameOverride}>\n      <DayPicker\n        mode=\"single\"\n        selected={selected && isInvalidDate(selected) ? undefined : selected}\n        defaultMonth={selectedMonth}\n        weekStartsOn={\n          isValidWeekStartsOn(weekStartsOn) ? weekStartsOn : undefined\n        }\n        classNames={classNames}\n        components={{\n          IconRight: () => <ArrowForwardIcon role=\"presentation\" />,\n          IconLeft: () => <ArrowBackwardIcon role=\"presentation\" />,\n        }}\n        locale={locale}\n        {...restProps}\n      />\n    </div>\n  )\n}\n\nCalendarSingle.displayName = \"CalendarSingle\"\n"],"names":["CalendarSingle","_a","id","onMount","classNameOverride","selected","defaultMonth","_b","weekStartsOn","DayOfWeek","Mon","_c","locale","enAU","restProps","__rest","calendarRef","useRef","useEffect","current","monthToShow","selectedMonth","isInvalidDate","undefined","classNames","__assign","baseCalendarClassNames","nav","styles","nav_button_next","navButtonNext","React","createElement","ref","className","DayPicker","mode","isValidWeekStartsOn","components","IconRight","ArrowForwardIcon","role","IconLeft","ArrowBackwardIcon","displayName"],"mappings":";;;;;;;;;;;;;;MAiBaA,cAAc;EAAA,MAAdA,cAAc,GAAG,SAAAA,CAACC,EAST,EAAA;IARpB,IAAAC,EAAE,GAAAD,EAAA,CAAAC,EAAA;MACFC,OAAO,aAAA;MACPC,iBAAiB,GAAAH,EAAA,CAAAG,iBAAA;MACjBC,QAAQ,GAAAJ,EAAA,CAAAI,QAAA;MACRC,YAAY,GAAAL,EAAA,CAAAK,YAAA;MACZC,EAA4B,GAAAN,EAAA,CAAAO,YAAA;MAA5BA,YAAY,GAAAD,EAAA,KAAA,KAAA,CAAA,GAAGE,SAAS,CAACC,GAAG,GAAAH,EAAA;MAC5BI,EAAa,GAAAV,EAAA,CAAAW,MAAA;MAAbA,MAAM,GAAAD,EAAA,KAAA,KAAA,CAAA,GAAGE,IAAI,GAAAF,EAAA;MACVG,SAAS,GAAAC,MAAA,CAAAd,EAAA,EARiB,4FAS9B,CADa;IAEZ,IAAMe,WAAW,GAAGC,MAAM,CAAwB,IAAI,CAAC;IAEvDC,SAAS,CAAC,YAAA;MACR,IAAIF,WAAW,CAACG,OAAO,EAAEhB,OAAO,KAAA,IAAA,IAAPA,OAAO,KAAP,KAAA,CAAA,GAAA,KAAA,CAAA,GAAAA,OAAO,CAAGa,WAAW,CAACG,OAAO,CAAC;IACzD,CAAC,EAAE,CAACH,WAAW,CAAC,CAAC;IAEjB,IAAMI,WAAW,GAAGf,QAAQ,IAAIC,YAAY;IAC5C,IAAMe,aAAa,GACjBD,WAAW,IAAIE,aAAa,CAACF,WAAW,CAAC,GAAGG,SAAS,GAAGH,WAAW;;IAGrE,IAAMI,UAAU,GAAGC,QAAA,CAAAA,QAAA,CAAA,CAAA,CAAA,EACdC,sBAAsB,CAAA,EAAA;MACzBC,GAAG,EAAEC,MAAM,CAACD,GAAG;MACfE,eAAe,EAAED,MAAM,CAACE;MACoB;;IAG9C,oBACEC,KAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;MAAKC,GAAG,EAAEjB,WAAW;MAAEd,EAAE,EAAEA,EAAE;MAAEgC,SAAS,EAAE9B;IAAiB,CAAA,eACzD2B,KAAC,CAAAC,aAAA,CAAAG,SAAS;MACRC,IAAI,EAAC,QAAQ;MACb/B,QAAQ,EAAEA,QAAQ,IAAIiB,aAAa,CAACjB,QAAQ,CAAC,GAAGkB,SAAS,GAAGlB,QAAQ;MACpEC,YAAY,EAAEe,aAAa;MAC3Bb,YAAY,EACV6B,mBAAmB,CAAC7B,YAAY,CAAC,GAAGA,YAAY,GAAGe,SAAS;MAE9DC,UAAU,EAAEA,UAAU;MACtBc,UAAU,EAAE;QACVC,SAAS,EAAE,SAAAA,CAAA,EAAM;UAAA,oBAAAR,KAAC,CAAAC,aAAA,CAAAQ,gBAAgB,EAAC;YAAAC,IAAI,EAAC;UAAiB,CAAA,CAAA;QAAA,CAAA;QACzDC,QAAQ,EAAE,SAAAA,CAAA,EAAM;UAAA,oBAAAX,KAAC,CAAAC,aAAA,CAAAW,iBAAiB,EAAC;YAAAF,IAAI,EAAC;UAAiB,CAAA,CAAA;QAAA;MAC1D,CAAA;MACD7B,MAAM,EAAEA;IAAM,CAAA,EACVE,SAAS,CACb,CAAA,CACE;EAEV,CAAC;EAEDd,cAAc,CAAC4C,WAAW,GAAG,gBAAgB;EAAA,OAjDhC5C,cAAc;AAAA;"}

package/dist/esm/Calendar/CalendarSingle/CalendarSingle.module.scss.mjs

@@ -0,0 +1,6 @@
+var styles = {
+  "nav": "CalendarSingle-module_nav__wSVua",
+  "navButtonNext": "CalendarSingle-module_navButtonNext__-GrZx"
+};
+export { styles as default };
+//# sourceMappingURL=CalendarSingle.module.scss.mjs.map

package/dist/esm/Calendar/CalendarSingle/CalendarSingle.module.scss.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"CalendarSingle.module.scss.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/dist/esm/Calendar/LegacyCalendarRange/LegacyCalendarRange.mjs

@@ -0,0 +1,64 @@
+import { __assign } from 'tslib';
+import React from 'react';
+import { DayPicker } from 'react-day-picker';
+import 'uuid';
+import '../../Icon/subcomponents/SVG/SVG.mjs';
+import { ArrowBackwardIcon } from '../../Icon/ArrowBackwardIcon.mjs';
+import { ArrowForwardIcon } from '../../Icon/ArrowForwardIcon.mjs';
+import { baseCalendarClassNames } from '../baseCalendarClassNames.mjs';
+import { DayOfWeek } from '../enums.mjs';
+import 'date-fns';
+import { isInvalidDate } from '../utils/isInvalidDate.mjs';
+import { isValidWeekStartsOn } from '../utils/isValidWeekStartsOn.mjs';
+import styles from './LegacyCalendarRange.module.scss.mjs';
+const LegacyCalendarRange = /*#__PURE__*/function () {
+  const LegacyCalendarRange = function (_a) {
+    var classNameOverride = _a.classNameOverride,
+      defaultMonth = _a.defaultMonth,
+      _b = _a.weekStartsOn,
+      weekStartsOn = _b === void 0 ? DayOfWeek.Mon : _b,
+      disabledDays = _a.disabledDays,
+      selectedRange = _a.selectedRange,
+      locale = _a.locale,
+      onDayChange = _a.onDayChange;
+    var monthToShow = (selectedRange === null || selectedRange === void 0 ? void 0 : selectedRange.from) || defaultMonth;
+    var selectedMonth = monthToShow && isInvalidDate(monthToShow) ? undefined : monthToShow;
+    /* eslint-disable camelcase */
+    var classNames = __assign(__assign({}, baseCalendarClassNames), {
+      nav: styles.nav,
+      nav_button_next: styles.navButtonNext,
+      day_range_start: styles.dayRangeStart,
+      day_range_end: styles.dayRangeEnd,
+      day_range_middle: styles.dayRangeMiddle
+    });
+    /* eslint-enable camelcase */
+    return /*#__PURE__*/React.createElement("div", {
+      className: classNameOverride
+    }, /*#__PURE__*/React.createElement(DayPicker, {
+      mode: "range",
+      selected: selectedRange,
+      defaultMonth: selectedMonth,
+      weekStartsOn: isValidWeekStartsOn(weekStartsOn) ? weekStartsOn : undefined,
+      disabled: disabledDays,
+      onDayClick: onDayChange,
+      classNames: classNames,
+      components: {
+        IconRight: function () {
+          return /*#__PURE__*/React.createElement(ArrowForwardIcon, {
+            role: "presentation"
+          });
+        },
+        IconLeft: function () {
+          return /*#__PURE__*/React.createElement(ArrowBackwardIcon, {
+            role: "presentation"
+          });
+        }
+      },
+      locale: locale
+    }));
+  };
+  LegacyCalendarRange.displayName = "LegacyCalendarRange";
+  return LegacyCalendarRange;
+}();
+export { LegacyCalendarRange };
+//# sourceMappingURL=LegacyCalendarRange.mjs.map

package/dist/esm/Calendar/LegacyCalendarRange/LegacyCalendarRange.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"LegacyCalendarRange.mjs","sources":["../../../../src/Calendar/LegacyCalendarRange/LegacyCalendarRange.tsx"],"sourcesContent":["import React from \"react\"\nimport {\n  DayPicker,\n  DateRange,\n  DayClickEventHandler,\n  Matcher,\n  DayPickerRangeProps,\n} from \"react-day-picker\"\nimport { ArrowBackwardIcon, ArrowForwardIcon } from \"~components/Icon\"\nimport { baseCalendarClassNames } from \"../baseCalendarClassNames\"\nimport { DayOfWeek } from \"../enums\"\nimport { isInvalidDate, isValidWeekStartsOn } from \"../utils\"\nimport styles from \"./LegacyCalendarRange.module.scss\"\n\nexport type LegacyCalendarRangeElement = HTMLDivElement\n\nexport type LegacyCalendarRangeProps = {\n  classNameOverride?: string\n  defaultMonth?: Date\n  weekStartsOn?: DayOfWeek\n  disabledDays?: Matcher[]\n  selectedRange?: DateRange\n  locale: Locale\n  onDayChange: DayClickEventHandler\n}\n\nexport const LegacyCalendarRange = ({\n  classNameOverride,\n  defaultMonth,\n  weekStartsOn = DayOfWeek.Mon,\n  disabledDays,\n  selectedRange,\n  locale,\n  onDayChange,\n}: LegacyCalendarRangeProps): JSX.Element => {\n  const monthToShow = selectedRange?.from || defaultMonth\n  const selectedMonth =\n    monthToShow && isInvalidDate(monthToShow) ? undefined : monthToShow\n\n  /* eslint-disable camelcase */\n  const classNames = {\n    ...baseCalendarClassNames,\n    nav: styles.nav,\n    nav_button_next: styles.navButtonNext,\n    day_range_start: styles.dayRangeStart,\n    day_range_end: styles.dayRangeEnd,\n    day_range_middle: styles.dayRangeMiddle,\n  } satisfies DayPickerRangeProps[\"classNames\"]\n  /* eslint-enable camelcase */\n\n  return (\n    <div className={classNameOverride}>\n      <DayPicker\n        mode=\"range\"\n        selected={selectedRange}\n        defaultMonth={selectedMonth}\n        weekStartsOn={\n          isValidWeekStartsOn(weekStartsOn) ? weekStartsOn : undefined\n        }\n        disabled={disabledDays}\n        onDayClick={onDayChange}\n        classNames={classNames}\n        components={{\n          IconRight: () => <ArrowForwardIcon role=\"presentation\" />,\n          IconLeft: () => <ArrowBackwardIcon role=\"presentation\" />,\n        }}\n        locale={locale}\n      />\n    </div>\n  )\n}\n\nLegacyCalendarRange.displayName = \"LegacyCalendarRange\"\n"],"names":["LegacyCalendarRange","_a","classNameOverride","defaultMonth","_b","weekStartsOn","DayOfWeek","Mon","disabledDays","selectedRange","locale","onDayChange","monthToShow","from","selectedMonth","isInvalidDate","undefined","classNames","__assign","baseCalendarClassNames","nav","styles","nav_button_next","navButtonNext","day_range_start","dayRangeStart","day_range_end","dayRangeEnd","day_range_middle","dayRangeMiddle","React","createElement","className","DayPicker","mode","selected","isValidWeekStartsOn","disabled","onDayClick","components","IconRight","ArrowForwardIcon","role","IconLeft","ArrowBackwardIcon","displayName"],"mappings":";;;;;;;;;;;;;MA0BaA,mBAAmB;EAAA,MAAnBA,mBAAmB,GAAG,SAAAA,CAACC,EAQT,EAAA;QAPzBC,iBAAiB,GAAAD,EAAA,CAAAC,iBAAA;MACjBC,YAAY,GAAAF,EAAA,CAAAE,YAAA;MACZC,oBAA4B;MAA5BC,YAAY,GAAGD,EAAA,KAAA,KAAA,CAAA,GAAAE,SAAS,CAACC,GAAG,KAAA;MAC5BC,YAAY,GAAAP,EAAA,CAAAO,YAAA;MACZC,aAAa,GAAAR,EAAA,CAAAQ,aAAA;MACbC,MAAM,GAAAT,EAAA,CAAAS,MAAA;MACNC,WAAW,GAAAV,EAAA,CAAAU,WAAA;IAEX,IAAMC,WAAW,GAAG,CAAAH,aAAa,KAAb,IAAA,IAAAA,aAAa,KAAb,KAAA,CAAA,GAAA,KAAA,CAAA,GAAAA,aAAa,CAAEI,IAAI,KAAIV,YAAY;IACvD,IAAMW,aAAa,GACjBF,WAAW,IAAIG,aAAa,CAACH,WAAW,CAAC,GAAGI,SAAS,GAAGJ,WAAW;;IAGrE,IAAMK,UAAU,GAAGC,QACd,CAAAA,QAAA,CAAA,EAAA,EAAAC,sBAAsB;MACzBC,GAAG,EAAEC,MAAM,CAACD,GAAG;MACfE,eAAe,EAAED,MAAM,CAACE,aAAa;MACrCC,eAAe,EAAEH,MAAM,CAACI,aAAa;MACrCC,aAAa,EAAEL,MAAM,CAACM,WAAW;MACjCC,gBAAgB,EAAEP,MAAM,CAACQ;IAAc,EACI;;IAG7C,oBACEC,KAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;MAAKC,SAAS,EAAE9B;IAAiB,CAAA,eAC/B4B,KAAA,CAAAC,aAAA,CAACE,SAAS,EACR;MAAAC,IAAI,EAAC,OAAO;MACZC,QAAQ,EAAE1B,aAAa;MACvBN,YAAY,EAAEW,aAAa;MAC3BT,YAAY,EACV+B,mBAAmB,CAAC/B,YAAY,CAAC,GAAGA,YAAY,GAAGW,SAAS;MAE9DqB,QAAQ,EAAE7B,YAAY;MACtB8B,UAAU,EAAE3B,WAAW;MACvBM,UAAU,EAAEA,UAAU;MACtBsB,UAAU,EAAE;QACVC,SAAS,EAAE,SAAAA,CAAA,EAAM;UAAA,oBAAAV,KAAC,CAAAC,aAAA,CAAAU,gBAAgB,EAAC;YAAAC,IAAI,EAAC;UAAiB,CAAA,CAAA;QAAA,CAAA;QACzDC,QAAQ,EAAE,SAAAA,CAAA,EAAM;UAAA,oBAAAb,KAAC,CAAAC,aAAA,CAAAa,iBAAiB,EAAC;YAAAF,IAAI,EAAC;UAAiB,CAAA,CAAA;QAAA;MAC1D,CAAA;MACDhC,MAAM,EAAEA;IACR,CAAA,CAAA,CACE;EAEV,CAAC;EAEDV,mBAAmB,CAAC6C,WAAW,GAAG,qBAAqB;EAAA,OA9C1C7C,mBAAmB;AAAA;"}

package/dist/esm/Calendar/LegacyCalendarRange/LegacyCalendarRange.module.scss.mjs

@@ -0,0 +1,9 @@
+var styles = {
+  "nav": "LegacyCalendarRange-module_nav__DsZpy",
+  "navButtonNext": "LegacyCalendarRange-module_navButtonNext__hwYN9",
+  "dayRangeStart": "LegacyCalendarRange-module_dayRangeStart__vRr5P",
+  "dayRangeEnd": "LegacyCalendarRange-module_dayRangeEnd__PfuWy",
+  "dayRangeMiddle": "LegacyCalendarRange-module_dayRangeMiddle__M27gR"
+};
+export { styles as default };
+//# sourceMappingURL=LegacyCalendarRange.module.scss.mjs.map

package/dist/esm/Calendar/LegacyCalendarRange/LegacyCalendarRange.module.scss.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"LegacyCalendarRange.module.scss.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;"}