@okta/odyssey-react-mui 1.45.0 → 1.47.1

package/dist/esm/FullScreenOverlayContext.js

@@ -0,0 +1,66 @@
+/*!
+ * Copyright (c) 2025-present, Okta, Inc. and/or its affiliates. All rights reserved.
+ * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the "License.")
+ *
+ * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *
+ * See the License for the specific language governing permissions and limitations under the License.
+ */
+
+import { createContext, memo, useContext, useEffect, useMemo } from "react";
+import { createShadowDomElements } from "./web-component/createShadowDomElements.js";
+import { jsx as _jsx } from "react/jsx-runtime";
+export const FullScreenOverlayContext = createContext({});
+export const useFullScreenOverlayContext = () => useContext(FullScreenOverlayContext);
+const FullScreenOverlayProvider = ({
+  children,
+  hasShadowDom,
+  overlayParentElement: overlayParentElementProp
+}) => {
+  const {
+    overlayEmotionRootElement,
+    overlayParentElement,
+    overlayShadowRootElement
+  } = useMemo(() => {
+    const overlayParentElement = overlayParentElementProp || document.createElement("div");
+    if (hasShadowDom) {
+      const {
+        emotionRootElement,
+        shadowRootElement
+      } = createShadowDomElements(overlayParentElement);
+      return {
+        overlayEmotionRootElement: emotionRootElement,
+        overlayParentElement,
+        overlayShadowRootElement: shadowRootElement
+      };
+    }
+    return {
+      overlayEmotionRootElement: undefined,
+      overlayParentElement,
+      overlayShadowRootElement: undefined
+    };
+  }, [hasShadowDom, overlayParentElementProp]);
+  useEffect(() => {
+    if (overlayParentElement) {
+      document.body.append(overlayParentElement);
+    }
+    return () => {
+      overlayParentElement.remove();
+    };
+  }, [overlayParentElement]);
+  const providerValue = useMemo(() => ({
+    overlayEmotionRootElement,
+    overlayShadowRootElement
+  }), [overlayEmotionRootElement, overlayShadowRootElement]);
+  return _jsx(FullScreenOverlayContext.Provider, {
+    value: providerValue,
+    children: children
+  });
+};
+const MemoizedFullScreenOverlayProvider = memo(FullScreenOverlayProvider);
+MemoizedFullScreenOverlayProvider.displayName = "FullScreenOverlayProvider";
+export { MemoizedFullScreenOverlayProvider as FullScreenOverlayProvider };
+//# sourceMappingURL=FullScreenOverlayContext.js.map

package/dist/esm/FullScreenOverlayContext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FullScreenOverlayContext.js","names":["createContext","memo","useContext","useEffect","useMemo","createShadowDomElements","jsx","_jsx","FullScreenOverlayContext","useFullScreenOverlayContext","FullScreenOverlayProvider","children","hasShadowDom","overlayParentElement","overlayParentElementProp","overlayEmotionRootElement","overlayShadowRootElement","document","createElement","emotionRootElement","shadowRootElement","undefined","body","append","remove","providerValue","Provider","value","MemoizedFullScreenOverlayProvider","displayName"],"sources":["../../src/FullScreenOverlayContext.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2025-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport {\n  createContext,\n  memo,\n  type ReactNode,\n  useContext,\n  useEffect,\n  useMemo,\n} from \"react\";\n\nimport { createShadowDomElements } from \"./web-component/createShadowDomElements.js\";\n\nexport type FullScreenOverlayContextType = {\n  overlayEmotionRootElement?: HTMLDivElement | HTMLElement;\n  overlayShadowRootElement?: HTMLDivElement | HTMLElement;\n};\n\nexport const FullScreenOverlayContext =\n  createContext<FullScreenOverlayContextType>({});\n\nexport const useFullScreenOverlayContext = () =>\n  useContext(FullScreenOverlayContext);\n\nexport type FullScreenOverlayProviderProps = {\n  children: ReactNode;\n  hasShadowDom?: boolean;\n  /**\n   * @experimental This is the element overlays will render into. By default, it's set to `document.body`.\n   *\n   * If you specify this value , it will render overlays into this container, such as the `shadowRootElement` over the document body. Most likely, you don't need to change this value, but you might run into strange issues related iframes and other shadow roots. This is here as a safeguard; not meant to be used.\n   */\n  overlayParentElement?: HTMLDivElement | HTMLElement;\n};\n\nconst FullScreenOverlayProvider = ({\n  children,\n  hasShadowDom,\n  overlayParentElement: overlayParentElementProp,\n}: FullScreenOverlayProviderProps) => {\n  const {\n    overlayEmotionRootElement,\n    overlayParentElement,\n    overlayShadowRootElement,\n  } = useMemo(() => {\n    const overlayParentElement =\n      overlayParentElementProp || document.createElement(\"div\");\n\n    if (hasShadowDom) {\n      const { emotionRootElement, shadowRootElement } =\n        createShadowDomElements(overlayParentElement);\n\n      return {\n        overlayEmotionRootElement: emotionRootElement,\n        overlayParentElement,\n        overlayShadowRootElement: shadowRootElement,\n      };\n    }\n\n    return {\n      overlayEmotionRootElement: undefined,\n      overlayParentElement,\n      overlayShadowRootElement: undefined,\n    };\n  }, [hasShadowDom, overlayParentElementProp]);\n\n  useEffect(() => {\n    if (overlayParentElement) {\n      document.body.append(overlayParentElement);\n    }\n\n    return () => {\n      overlayParentElement.remove();\n    };\n  }, [overlayParentElement]);\n\n  const providerValue = useMemo(\n    () => ({\n      overlayEmotionRootElement,\n      overlayShadowRootElement,\n    }),\n    [overlayEmotionRootElement, overlayShadowRootElement],\n  );\n\n  return (\n    <FullScreenOverlayContext.Provider value={providerValue}>\n      {children}\n    </FullScreenOverlayContext.Provider>\n  );\n};\n\nconst MemoizedFullScreenOverlayProvider = memo(FullScreenOverlayProvider);\nMemoizedFullScreenOverlayProvider.displayName = \"FullScreenOverlayProvider\";\n\nexport { MemoizedFullScreenOverlayProvider as FullScreenOverlayProvider };\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SACEA,aAAa,EACbC,IAAI,EAEJC,UAAU,EACVC,SAAS,EACTC,OAAO,QACF,OAAO;AAEd,SAASC,uBAAuB,QAAQ,4CAA4C;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAOrF,OAAO,MAAMC,wBAAwB,GACnCR,aAAa,CAA+B,CAAC,CAAC,CAAC;AAEjD,OAAO,MAAMS,2BAA2B,GAAGA,CAAA,KACzCP,UAAU,CAACM,wBAAwB,CAAC;AAatC,MAAME,yBAAyB,GAAGA,CAAC;EACjCC,QAAQ;EACRC,YAAY;EACZC,oBAAoB,EAAEC;AACQ,CAAC,KAAK;EACpC,MAAM;IACJC,yBAAyB;IACzBF,oBAAoB;IACpBG;EACF,CAAC,GAAGZ,OAAO,CAAC,MAAM;IAChB,MAAMS,oBAAoB,GACxBC,wBAAwB,IAAIG,QAAQ,CAACC,aAAa,CAAC,KAAK,CAAC;IAE3D,IAAIN,YAAY,EAAE;MAChB,MAAM;QAAEO,kBAAkB;QAAEC;MAAkB,CAAC,GAC7Cf,uBAAuB,CAACQ,oBAAoB,CAAC;MAE/C,OAAO;QACLE,yBAAyB,EAAEI,kBAAkB;QAC7CN,oBAAoB;QACpBG,wBAAwB,EAAEI;MAC5B,CAAC;IACH;IAEA,OAAO;MACLL,yBAAyB,EAAEM,SAAS;MACpCR,oBAAoB;MACpBG,wBAAwB,EAAEK;IAC5B,CAAC;EACH,CAAC,EAAE,CAACT,YAAY,EAAEE,wBAAwB,CAAC,CAAC;EAE5CX,SAAS,CAAC,MAAM;IACd,IAAIU,oBAAoB,EAAE;MACxBI,QAAQ,CAACK,IAAI,CAACC,MAAM,CAACV,oBAAoB,CAAC;IAC5C;IAEA,OAAO,MAAM;MACXA,oBAAoB,CAACW,MAAM,CAAC,CAAC;IAC/B,CAAC;EACH,CAAC,EAAE,CAACX,oBAAoB,CAAC,CAAC;EAE1B,MAAMY,aAAa,GAAGrB,OAAO,CAC3B,OAAO;IACLW,yBAAyB;IACzBC;EACF,CAAC,CAAC,EACF,CAACD,yBAAyB,EAAEC,wBAAwB,CACtD,CAAC;EAED,OACET,IAAA,CAACC,wBAAwB,CAACkB,QAAQ;IAACC,KAAK,EAAEF,aAAc;IAAAd,QAAA,EACrDA;EAAQ,CACwB,CAAC;AAExC,CAAC;AAED,MAAMiB,iCAAiC,GAAG3B,IAAI,CAACS,yBAAyB,CAAC;AACzEkB,iCAAiC,CAACC,WAAW,GAAG,2BAA2B;AAE3E,SAASD,iCAAiC,IAAIlB,yBAAyB","ignoreList":[]}

package/dist/esm/OdysseyCacheProvider.js

@@ -19,27 +19,22 @@ const OdysseyCacheProvider = ({
   children,
   emotionRoot,
   emotionRootElement,
-  hasShadowDom: hasShadowDomProp,
   nonce,
-  shadowDomElement,
   stylisPlugins
 }) => {
   const uniqueAlphabeticalId = useUniqueAlphabeticalId();
-  const hasShadowDom = hasShadowDomProp || shadowDomElement;
-  const emotionCache = useMemo(() => {
-    return createCache({
-      ...((emotionRootElement || emotionRoot) && {
-        container: emotionRootElement || emotionRoot
-      }),
-      key: uniqueAlphabeticalId,
-      nonce: nonce ?? globalThis.cspNonce,
-      prepend: true,
-      speedy: hasShadowDom ? false : true,
-      ...(stylisPlugins && {
-        stylisPlugins
-      })
-    });
-  }, [emotionRoot, emotionRootElement, hasShadowDom, nonce, stylisPlugins, uniqueAlphabeticalId]);
+  const emotionCache = useMemo(() => createCache({
+    ...((emotionRootElement || emotionRoot) && {
+      container: emotionRootElement || emotionRoot
+    }),
+    key: uniqueAlphabeticalId,
+    nonce: nonce ?? globalThis.cspNonce,
+    prepend: true,
+    speedy: true,
+    ...(stylisPlugins && {
+      stylisPlugins
+    })
+  }), [emotionRoot, emotionRootElement, nonce, stylisPlugins, uniqueAlphabeticalId]);
   return _jsx(CacheProvider, {
     value: emotionCache,
     children: children

package/dist/esm/OdysseyCacheProvider.js.map

@@ -1 +1 @@
-{"version":3,"file":"OdysseyCacheProvider.js","names":["createCache","CacheProvider","memo","useMemo","useUniqueAlphabeticalId","jsx","_jsx","OdysseyCacheProvider","children","emotionRoot","emotionRootElement","hasShadowDom","hasShadowDomProp","nonce","shadowDomElement","stylisPlugins","uniqueAlphabeticalId","emotionCache","container","key","globalThis","cspNonce","prepend","speedy","value","MemoizedOdysseyCacheProvider","displayName"],"sources":["../../src/OdysseyCacheProvider.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\ndeclare global {\n  var cspNonce: string; // Adding types to `globalThis` requires we use `var`.\n}\n\nimport createCache, { StylisPlugin } from \"@emotion/cache\";\nimport { CacheProvider } from \"@emotion/react\";\nimport { memo, ReactNode, useMemo } from \"react\";\n\nimport { useUniqueAlphabeticalId } from \"./useUniqueAlphabeticalId.js\";\n\nexport type OdysseyCacheProviderProps = {\n  children: ReactNode;\n  /**\n   * Emotion caches styles into the style element.\n   * When enabling this prop, Emotion caches the styles at this element, rather than in <head>.\n   * @deprecated Use `EmotionRootElement` instead. This was incorrectly configured as an `HTMLStyleElement`, but then we're rendering `<style>` inside `<style>`. We need this to be a `<div>` instead.\n   */\n  emotionRoot?: HTMLStyleElement;\n  /**\n   * Emotion adds `<style>` elements into this DOM node. Normally, Emotion puts these in `document.head`.\n   * This is useful if you want to render into a Shadow DOM or iframe.\n   */\n  emotionRootElement?: HTMLElement;\n  hasShadowDom?: boolean;\n  nonce?: string;\n  /**\n   * Emotion renders into this HTML element.\n   * When enabling this prop, Emotion renders at the top of this component rather than the bottom like it does in the HTML `<head>`.\n   * @deprecated Will be removed in a future Odyssey version. Use `hasShadowDomElement` instead.\n   */\n  shadowDomElement?: HTMLDivElement | HTMLElement;\n  stylisPlugins?: StylisPlugin[];\n};\n\nconst OdysseyCacheProvider = ({\n  children,\n  emotionRoot,\n  emotionRootElement,\n  hasShadowDom: hasShadowDomProp,\n  nonce,\n  shadowDomElement,\n  stylisPlugins,\n}: OdysseyCacheProviderProps) => {\n  const uniqueAlphabeticalId = useUniqueAlphabeticalId();\n\n  const hasShadowDom = hasShadowDomProp || shadowDomElement;\n\n  const emotionCache = useMemo(() => {\n    return createCache({\n      ...((emotionRootElement || emotionRoot) && {\n        container: emotionRootElement || emotionRoot,\n      }),\n      key: uniqueAlphabeticalId,\n      nonce: nonce ?? globalThis.cspNonce,\n      prepend: true,\n      speedy: hasShadowDom ? false : true, // <-- Needs to be set to false when shadow-dom is used! https://github.com/emotion-js/emotion/issues/2053#issuecomment-713429122\n      ...(stylisPlugins && { stylisPlugins }),\n    });\n  }, [\n    emotionRoot,\n    emotionRootElement,\n    hasShadowDom,\n    nonce,\n    stylisPlugins,\n    uniqueAlphabeticalId,\n  ]);\n\n  return <CacheProvider value={emotionCache}>{children}</CacheProvider>;\n};\n\nconst MemoizedOdysseyCacheProvider = memo(OdysseyCacheProvider);\nMemoizedOdysseyCacheProvider.displayName = \"OdysseyCacheProvider\";\n\nexport { MemoizedOdysseyCacheProvider as OdysseyCacheProvider };\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAMA,OAAOA,WAAW,MAAwB,gBAAgB;AAC1D,SAASC,aAAa,QAAQ,gBAAgB;AAC9C,SAASC,IAAI,EAAaC,OAAO,QAAQ,OAAO;AAEhD,SAASC,uBAAuB,QAAQ,8BAA8B;AAAC,SAAAC,GAAA,IAAAC,IAAA;AA0BvE,MAAMC,oBAAoB,GAAGA,CAAC;EAC5BC,QAAQ;EACRC,WAAW;EACXC,kBAAkB;EAClBC,YAAY,EAAEC,gBAAgB;EAC9BC,KAAK;EACLC,gBAAgB;EAChBC;AACyB,CAAC,KAAK;EAC/B,MAAMC,oBAAoB,GAAGZ,uBAAuB,CAAC,CAAC;EAEtD,MAAMO,YAAY,GAAGC,gBAAgB,IAAIE,gBAAgB;EAEzD,MAAMG,YAAY,GAAGd,OAAO,CAAC,MAAM;IACjC,OAAOH,WAAW,CAAC;MACjB,IAAI,CAACU,kBAAkB,IAAID,WAAW,KAAK;QACzCS,SAAS,EAAER,kBAAkB,IAAID;MACnC,CAAC,CAAC;MACFU,GAAG,EAAEH,oBAAoB;MACzBH,KAAK,EAAEA,KAAK,IAAIO,UAAU,CAACC,QAAQ;MACnCC,OAAO,EAAE,IAAI;MACbC,MAAM,EAAEZ,YAAY,GAAG,KAAK,GAAG,IAAI;MACnC,IAAII,aAAa,IAAI;QAAEA;MAAc,CAAC;IACxC,CAAC,CAAC;EACJ,CAAC,EAAE,CACDN,WAAW,EACXC,kBAAkB,EAClBC,YAAY,EACZE,KAAK,EACLE,aAAa,EACbC,oBAAoB,CACrB,CAAC;EAEF,OAAOV,IAAA,CAACL,aAAa;IAACuB,KAAK,EAAEP,YAAa;IAAAT,QAAA,EAAEA;EAAQ,CAAgB,CAAC;AACvE,CAAC;AAED,MAAMiB,4BAA4B,GAAGvB,IAAI,CAACK,oBAAoB,CAAC;AAC/DkB,4BAA4B,CAACC,WAAW,GAAG,sBAAsB;AAEjE,SAASD,4BAA4B,IAAIlB,oBAAoB","ignoreList":[]}
+{"version":3,"file":"OdysseyCacheProvider.js","names":["createCache","CacheProvider","memo","useMemo","useUniqueAlphabeticalId","jsx","_jsx","OdysseyCacheProvider","children","emotionRoot","emotionRootElement","nonce","stylisPlugins","uniqueAlphabeticalId","emotionCache","container","key","globalThis","cspNonce","prepend","speedy","value","MemoizedOdysseyCacheProvider","displayName"],"sources":["../../src/OdysseyCacheProvider.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\ndeclare global {\n  var cspNonce: string; // Adding types to `globalThis` requires we use `var`.\n}\n\nimport createCache, { StylisPlugin } from \"@emotion/cache\";\nimport { CacheProvider } from \"@emotion/react\";\nimport { memo, ReactNode, useMemo } from \"react\";\n\nimport { useUniqueAlphabeticalId } from \"./useUniqueAlphabeticalId.js\";\n\nexport type OdysseyCacheProviderProps = {\n  children: ReactNode;\n  /**\n   * @deprecated Use `EmotionRootElement` instead. This was incorrectly configured as an `HTMLStyleElement`, but then we're rendering `<style>` inside `<style>`. We need this to be a `<div>` instead.\n   *\n   * Emotion caches styles into the style element.\n   * When enabling this prop, Emotion caches the styles at this element, rather than in <head>.\n   */\n  emotionRoot?: HTMLStyleElement;\n  /**\n   * Emotion adds `<style>` elements into this DOM node. Normally, Emotion puts these in `document.head`.\n   * This is useful if you want to render into a Shadow DOM or iframe.\n   */\n  emotionRootElement?: HTMLElement;\n  /**\n   * @deprecated No longer necessary.\n   *\n   * Required to know if a Shadow DOM is in use. This tells Emotion to change its cache configuration.\n   */\n  hasShadowDom?: boolean;\n  nonce?: string;\n  /**\n   * @deprecated No longer necessary.\n   *\n   * Emotion renders into this HTML element.\n   * When enabling this prop, Emotion renders at the top of this component rather than the bottom like it does in the HTML `<head>`.\n   */\n  shadowDomElement?: HTMLDivElement | HTMLElement;\n  stylisPlugins?: StylisPlugin[];\n};\n\nconst OdysseyCacheProvider = ({\n  children,\n  emotionRoot,\n  emotionRootElement,\n  nonce,\n  stylisPlugins,\n}: OdysseyCacheProviderProps) => {\n  const uniqueAlphabeticalId = useUniqueAlphabeticalId();\n\n  const emotionCache = useMemo(\n    () =>\n      createCache({\n        ...((emotionRootElement || emotionRoot) && {\n          container: emotionRootElement || emotionRoot,\n        }),\n        key: uniqueAlphabeticalId,\n        nonce: nonce ?? globalThis.cspNonce,\n        prepend: true,\n        speedy: true,\n        ...(stylisPlugins && { stylisPlugins }),\n      }),\n    [\n      emotionRoot,\n      emotionRootElement,\n      nonce,\n      stylisPlugins,\n      uniqueAlphabeticalId,\n    ],\n  );\n\n  return <CacheProvider value={emotionCache}>{children}</CacheProvider>;\n};\n\nconst MemoizedOdysseyCacheProvider = memo(OdysseyCacheProvider);\nMemoizedOdysseyCacheProvider.displayName = \"OdysseyCacheProvider\";\n\nexport { MemoizedOdysseyCacheProvider as OdysseyCacheProvider };\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAMA,OAAOA,WAAW,MAAwB,gBAAgB;AAC1D,SAASC,aAAa,QAAQ,gBAAgB;AAC9C,SAASC,IAAI,EAAaC,OAAO,QAAQ,OAAO;AAEhD,SAASC,uBAAuB,QAAQ,8BAA8B;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAiCvE,MAAMC,oBAAoB,GAAGA,CAAC;EAC5BC,QAAQ;EACRC,WAAW;EACXC,kBAAkB;EAClBC,KAAK;EACLC;AACyB,CAAC,KAAK;EAC/B,MAAMC,oBAAoB,GAAGT,uBAAuB,CAAC,CAAC;EAEtD,MAAMU,YAAY,GAAGX,OAAO,CAC1B,MACEH,WAAW,CAAC;IACV,IAAI,CAACU,kBAAkB,IAAID,WAAW,KAAK;MACzCM,SAAS,EAAEL,kBAAkB,IAAID;IACnC,CAAC,CAAC;IACFO,GAAG,EAAEH,oBAAoB;IACzBF,KAAK,EAAEA,KAAK,IAAIM,UAAU,CAACC,QAAQ;IACnCC,OAAO,EAAE,IAAI;IACbC,MAAM,EAAE,IAAI;IACZ,IAAIR,aAAa,IAAI;MAAEA;IAAc,CAAC;EACxC,CAAC,CAAC,EACJ,CACEH,WAAW,EACXC,kBAAkB,EAClBC,KAAK,EACLC,aAAa,EACbC,oBAAoB,CAExB,CAAC;EAED,OAAOP,IAAA,CAACL,aAAa;IAACoB,KAAK,EAAEP,YAAa;IAAAN,QAAA,EAAEA;EAAQ,CAAgB,CAAC;AACvE,CAAC;AAED,MAAMc,4BAA4B,GAAGpB,IAAI,CAACK,oBAAoB,CAAC;AAC/De,4BAA4B,CAACC,WAAW,GAAG,sBAAsB;AAEjE,SAASD,4BAA4B,IAAIf,oBAAoB","ignoreList":[]}

package/dist/esm/OdysseyProvider.js

@@ -11,10 +11,12 @@ import _ScopedCssBaseline from "@mui/material/ScopedCssBaseline";
  * See the License for the specific language governing permissions and limitations under the License.
  */
 import { memo } from "react";
+import { CssBaseline } from "./CssBaseline.js";
+import { FullScreenOverlayProvider } from "./FullScreenOverlayContext.js";
+import { TranslationProvider as OdysseyTranslationProvider } from "./i18n.generated/i18n.js";
 import { OdysseyCacheProvider } from "./OdysseyCacheProvider.js";
 import { OdysseyThemeProvider } from "./OdysseyThemeProvider.js";
-import { OdysseyTranslationProvider } from "./OdysseyTranslationProvider.js";
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const scopedCssBaselineStyles = {
   height: "inherit"
 };
@@ -24,9 +26,12 @@ const OdysseyProvider = ({
   designTokensOverride,
   emotionRoot,
   emotionRootElement,
+  hasCssBaseline: hasGlobalCss,
   hasScopedCssBaseline = true,
+  hasWrapperElement,
   languageCode,
   nonce,
+  overlayParentElement,
   shadowDomElement,
   shadowRootElement,
   stylisPlugins,
@@ -34,26 +39,29 @@ const OdysseyProvider = ({
   translationOverrides
 }) => _jsx(OdysseyCacheProvider, {
   emotionRootElement: emotionRootElement || emotionRoot,
-  hasShadowDom: Boolean(shadowRootElement || shadowDomElement),
   nonce: nonce,
   stylisPlugins: stylisPlugins,
   children: _jsx(OdysseyThemeProvider, {
     contrastMode: contrastMode,
     designTokensOverride: designTokensOverride,
-    shadowDomElement: shadowDomElement,
-    shadowRootElement: shadowRootElement,
+    hasWrapperElement: hasWrapperElement,
+    shadowRootElement: shadowRootElement ?? shadowDomElement,
     themeOverride: themeOverride,
     children: _jsx(OdysseyTranslationProvider, {
       languageCode: languageCode,
       translationOverrides: translationOverrides,
-      children: hasScopedCssBaseline ? _jsx(_ScopedCssBaseline, {
-        sx: scopedCssBaselineStyles,
-        children: children
-      }) : children
+      children: _jsxs(FullScreenOverlayProvider, {
+        hasShadowDom: Boolean(shadowRootElement || shadowDomElement),
+        overlayParentElement: overlayParentElement,
+        children: [hasGlobalCss && _jsx(CssBaseline, {}), hasScopedCssBaseline ? _jsx(_ScopedCssBaseline, {
+          sx: scopedCssBaselineStyles,
+          children: children
+        }) : children]
+      })
     })
   })
 });
-OdysseyProvider.displayName = "OdysseyProvider";
 const MemoizedOdysseyProvider = memo(OdysseyProvider);
+MemoizedOdysseyProvider.displayName = "OdysseyProvider";
 export { MemoizedOdysseyProvider as OdysseyProvider };
 //# sourceMappingURL=OdysseyProvider.js.map

package/dist/esm/OdysseyProvider.js.map

@@ -1 +1 @@
-{"version":3,"file":"OdysseyProvider.js","names":["memo","OdysseyCacheProvider","OdysseyThemeProvider","OdysseyTranslationProvider","jsx","_jsx","scopedCssBaselineStyles","height","OdysseyProvider","children","contrastMode","designTokensOverride","emotionRoot","emotionRootElement","hasScopedCssBaseline","languageCode","nonce","shadowDomElement","shadowRootElement","stylisPlugins","themeOverride","translationOverrides","hasShadowDom","Boolean","_ScopedCssBaseline","sx","displayName","MemoizedOdysseyProvider"],"sources":["../../src/OdysseyProvider.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport { ScopedCssBaseline } from \"@mui/material\";\nimport { memo, ReactNode } from \"react\";\n\nimport {\n  OdysseyCacheProvider,\n  OdysseyCacheProviderProps,\n} from \"./OdysseyCacheProvider.js\";\nimport {\n  OdysseyThemeProvider,\n  OdysseyThemeProviderProps,\n} from \"./OdysseyThemeProvider.js\";\nimport {\n  OdysseyTranslationProvider,\n  OdysseyTranslationProviderProps,\n} from \"./OdysseyTranslationProvider.js\";\nimport { DefaultSupportedLanguages } from \"./OdysseyTranslationProvider.types.js\";\n\nconst scopedCssBaselineStyles = {\n  height: \"inherit\",\n};\n\nexport type OdysseyProviderProps<\n  SupportedLanguages extends string = DefaultSupportedLanguages,\n> = OdysseyCacheProviderProps &\n  OdysseyThemeProviderProps &\n  OdysseyTranslationProviderProps<SupportedLanguages> & {\n    children: ReactNode;\n    /**\n     * Whether to emit the ScopedCssBaseline. Defaults to true.\n     */\n    hasScopedCssBaseline?: boolean;\n  };\n\nconst OdysseyProvider = <SupportedLanguages extends string>({\n  children,\n  contrastMode,\n  designTokensOverride,\n  emotionRoot,\n  emotionRootElement,\n  hasScopedCssBaseline = true,\n  languageCode,\n  nonce,\n  shadowDomElement,\n  shadowRootElement,\n  stylisPlugins,\n  themeOverride,\n  translationOverrides,\n}: OdysseyProviderProps<SupportedLanguages>) => (\n  <OdysseyCacheProvider\n    emotionRootElement={emotionRootElement || emotionRoot}\n    hasShadowDom={Boolean(shadowRootElement || shadowDomElement)}\n    nonce={nonce}\n    stylisPlugins={stylisPlugins}\n  >\n    <OdysseyThemeProvider\n      contrastMode={contrastMode}\n      designTokensOverride={designTokensOverride}\n      shadowDomElement={shadowDomElement}\n      shadowRootElement={shadowRootElement}\n      themeOverride={themeOverride}\n    >\n      <OdysseyTranslationProvider<SupportedLanguages>\n        languageCode={languageCode}\n        translationOverrides={translationOverrides}\n      >\n        {hasScopedCssBaseline ? (\n          <ScopedCssBaseline sx={scopedCssBaselineStyles}>\n            {children}\n          </ScopedCssBaseline>\n        ) : (\n          children\n        )}\n      </OdysseyTranslationProvider>\n    </OdysseyThemeProvider>\n  </OdysseyCacheProvider>\n);\nOdysseyProvider.displayName = \"OdysseyProvider\";\n\nconst MemoizedOdysseyProvider = memo(OdysseyProvider) as typeof OdysseyProvider;\n\nexport { MemoizedOdysseyProvider as OdysseyProvider };\n"],"mappings":";AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA,SAASA,IAAI,QAAmB,OAAO;AAEvC,SACEC,oBAAoB,QAEf,2BAA2B;AAClC,SACEC,oBAAoB,QAEf,2BAA2B;AAClC,SACEC,0BAA0B,QAErB,iCAAiC;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAGzC,MAAMC,uBAAuB,GAAG;EAC9BC,MAAM,EAAE;AACV,CAAC;AAcD,MAAMC,eAAe,GAAGA,CAAoC;EAC1DC,QAAQ;EACRC,YAAY;EACZC,oBAAoB;EACpBC,WAAW;EACXC,kBAAkB;EAClBC,oBAAoB,GAAG,IAAI;EAC3BC,YAAY;EACZC,KAAK;EACLC,gBAAgB;EAChBC,iBAAiB;EACjBC,aAAa;EACbC,aAAa;EACbC;AACwC,CAAC,KACzChB,IAAA,CAACJ,oBAAoB;EACnBY,kBAAkB,EAAEA,kBAAkB,IAAID,WAAY;EACtDU,YAAY,EAAEC,OAAO,CAACL,iBAAiB,IAAID,gBAAgB,CAAE;EAC7DD,KAAK,EAAEA,KAAM;EACbG,aAAa,EAAEA,aAAc;EAAAV,QAAA,EAE7BJ,IAAA,CAACH,oBAAoB;IACnBQ,YAAY,EAAEA,YAAa;IAC3BC,oBAAoB,EAAEA,oBAAqB;IAC3CM,gBAAgB,EAAEA,gBAAiB;IACnCC,iBAAiB,EAAEA,iBAAkB;IACrCE,aAAa,EAAEA,aAAc;IAAAX,QAAA,EAE7BJ,IAAA,CAACF,0BAA0B;MACzBY,YAAY,EAAEA,YAAa;MAC3BM,oBAAoB,EAAEA,oBAAqB;MAAAZ,QAAA,EAE1CK,oBAAoB,GACnBT,IAAA,CAAAmB,kBAAA;QAAmBC,EAAE,EAAEnB,uBAAwB;QAAAG,QAAA,EAC5CA;MAAQ,CACQ,CAAC,GAEpBA;IACD,CACyB;EAAC,CACT;AAAC,CACH,CACvB;AACDD,eAAe,CAACkB,WAAW,GAAG,iBAAiB;AAE/C,MAAMC,uBAAuB,GAAG3B,IAAI,CAACQ,eAAe,CAA2B;AAE/E,SAASmB,uBAAuB,IAAInB,eAAe","ignoreList":[]}
+{"version":3,"file":"OdysseyProvider.js","names":["memo","CssBaseline","FullScreenOverlayProvider","TranslationProvider","OdysseyTranslationProvider","OdysseyCacheProvider","OdysseyThemeProvider","jsx","_jsx","jsxs","_jsxs","scopedCssBaselineStyles","height","OdysseyProvider","children","contrastMode","designTokensOverride","emotionRoot","emotionRootElement","hasCssBaseline","hasGlobalCss","hasScopedCssBaseline","hasWrapperElement","languageCode","nonce","overlayParentElement","shadowDomElement","shadowRootElement","stylisPlugins","themeOverride","translationOverrides","hasShadowDom","Boolean","_ScopedCssBaseline","sx","MemoizedOdysseyProvider","displayName"],"sources":["../../src/OdysseyProvider.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport { ScopedCssBaseline } from \"@mui/material\";\nimport { memo, ReactNode } from \"react\";\n\nimport { CssBaseline } from \"./CssBaseline.js\";\nimport {\n  FullScreenOverlayProvider,\n  FullScreenOverlayProviderProps,\n} from \"./FullScreenOverlayContext.js\";\nimport {\n  type DefaultSupportedLanguages,\n  TranslationProvider as OdysseyTranslationProvider,\n  type TranslationProviderProps as OdysseyTranslationProviderProps,\n} from \"./i18n.generated/i18n.js\";\nimport {\n  OdysseyCacheProvider,\n  OdysseyCacheProviderProps,\n} from \"./OdysseyCacheProvider.js\";\nimport {\n  OdysseyThemeProvider,\n  OdysseyThemeProviderProps,\n} from \"./OdysseyThemeProvider.js\";\n\nconst scopedCssBaselineStyles = {\n  height: \"inherit\",\n};\n\nexport type OdysseyProviderProps<\n  SupportedLanguages extends string = DefaultSupportedLanguages,\n> = Omit<OdysseyCacheProviderProps, \"hasShadowDom\"> &\n  FullScreenOverlayProviderProps &\n  OdysseyThemeProviderProps &\n  OdysseyTranslationProviderProps<SupportedLanguages> & {\n    children: ReactNode;\n    /**\n     * Whether to emit the ScopedCssBaseline. Defaults to true.\n     */\n    hasCssBaseline?: boolean;\n    /**\n     * Adds the `ScopedCssBaseline` wrapper. This also adds a `div`, so it might not be what you want.\n     */\n    hasScopedCssBaseline?: boolean;\n  };\n\nconst OdysseyProvider = <SupportedLanguages extends string>({\n  children,\n  contrastMode,\n  designTokensOverride,\n  emotionRoot,\n  emotionRootElement,\n  hasCssBaseline: hasGlobalCss,\n  hasScopedCssBaseline = true,\n  hasWrapperElement,\n  languageCode,\n  nonce,\n  overlayParentElement,\n  shadowDomElement,\n  shadowRootElement,\n  stylisPlugins,\n  themeOverride,\n  translationOverrides,\n}: OdysseyProviderProps<SupportedLanguages>) => (\n  <OdysseyCacheProvider\n    emotionRootElement={emotionRootElement || emotionRoot}\n    nonce={nonce}\n    stylisPlugins={stylisPlugins}\n  >\n    <OdysseyThemeProvider\n      contrastMode={contrastMode}\n      designTokensOverride={designTokensOverride}\n      hasWrapperElement={hasWrapperElement}\n      shadowRootElement={shadowRootElement ?? shadowDomElement}\n      themeOverride={themeOverride}\n    >\n      <OdysseyTranslationProvider<SupportedLanguages>\n        languageCode={languageCode}\n        translationOverrides={translationOverrides}\n      >\n        <FullScreenOverlayProvider\n          hasShadowDom={Boolean(shadowRootElement || shadowDomElement)}\n          overlayParentElement={overlayParentElement}\n        >\n          {hasGlobalCss && <CssBaseline />}\n\n          {hasScopedCssBaseline ? (\n            <ScopedCssBaseline sx={scopedCssBaselineStyles}>\n              {children}\n            </ScopedCssBaseline>\n          ) : (\n            children\n          )}\n        </FullScreenOverlayProvider>\n      </OdysseyTranslationProvider>\n    </OdysseyThemeProvider>\n  </OdysseyCacheProvider>\n);\n\nconst MemoizedOdysseyProvider = memo(OdysseyProvider);\nMemoizedOdysseyProvider.displayName = \"OdysseyProvider\";\n\nexport { MemoizedOdysseyProvider as OdysseyProvider };\n"],"mappings":";AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA,SAASA,IAAI,QAAmB,OAAO;AAEvC,SAASC,WAAW,QAAQ,kBAAkB;AAC9C,SACEC,yBAAyB,QAEpB,+BAA+B;AACtC,SAEEC,mBAAmB,IAAIC,0BAA0B,QAE5C,0BAA0B;AACjC,SACEC,oBAAoB,QAEf,2BAA2B;AAClC,SACEC,oBAAoB,QAEf,2BAA2B;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAEnC,MAAMC,uBAAuB,GAAG;EAC9BC,MAAM,EAAE;AACV,CAAC;AAmBD,MAAMC,eAAe,GAAGA,CAAoC;EAC1DC,QAAQ;EACRC,YAAY;EACZC,oBAAoB;EACpBC,WAAW;EACXC,kBAAkB;EAClBC,cAAc,EAAEC,YAAY;EAC5BC,oBAAoB,GAAG,IAAI;EAC3BC,iBAAiB;EACjBC,YAAY;EACZC,KAAK;EACLC,oBAAoB;EACpBC,gBAAgB;EAChBC,iBAAiB;EACjBC,aAAa;EACbC,aAAa;EACbC;AACwC,CAAC,KACzCtB,IAAA,CAACH,oBAAoB;EACnBa,kBAAkB,EAAEA,kBAAkB,IAAID,WAAY;EACtDO,KAAK,EAAEA,KAAM;EACbI,aAAa,EAAEA,aAAc;EAAAd,QAAA,EAE7BN,IAAA,CAACF,oBAAoB;IACnBS,YAAY,EAAEA,YAAa;IAC3BC,oBAAoB,EAAEA,oBAAqB;IAC3CM,iBAAiB,EAAEA,iBAAkB;IACrCK,iBAAiB,EAAEA,iBAAiB,IAAID,gBAAiB;IACzDG,aAAa,EAAEA,aAAc;IAAAf,QAAA,EAE7BN,IAAA,CAACJ,0BAA0B;MACzBmB,YAAY,EAAEA,YAAa;MAC3BO,oBAAoB,EAAEA,oBAAqB;MAAAhB,QAAA,EAE3CJ,KAAA,CAACR,yBAAyB;QACxB6B,YAAY,EAAEC,OAAO,CAACL,iBAAiB,IAAID,gBAAgB,CAAE;QAC7DD,oBAAoB,EAAEA,oBAAqB;QAAAX,QAAA,GAE1CM,YAAY,IAAIZ,IAAA,CAACP,WAAW,IAAE,CAAC,EAE/BoB,oBAAoB,GACnBb,IAAA,CAAAyB,kBAAA;UAAmBC,EAAE,EAAEvB,uBAAwB;UAAAG,QAAA,EAC5CA;QAAQ,CACQ,CAAC,GAEpBA,QACD;MAAA,CACwB;IAAC,CACF;EAAC,CACT;AAAC,CACH,CACvB;AAED,MAAMqB,uBAAuB,GAAGnC,IAAI,CAACa,eAAe,CAAC;AACrDsB,uBAAuB,CAACC,WAAW,GAAG,iBAAiB;AAEvD,SAASD,uBAAuB,IAAItB,eAAe","ignoreList":[]}

package/dist/esm/OdysseyThemeProvider.js

@@ -16,6 +16,7 @@ import { deepmerge } from "@mui/utils";
 import * as Tokens from "@okta/odyssey-design-tokens";
 import { memo, useMemo } from "react";
 import { OdysseyDesignTokensContext } from "./OdysseyDesignTokensContext.js";
+import { OdysseyThemeProviderPropsProvider, useOdysseyThemeProviderPropsContext } from "./OdysseyThemeProviderPropsContext.js";
 import { createOdysseyMuiTheme } from "./theme/index.js";
 import { ContrastModeContext, useContrastMode } from "./useContrastMode.js";
 import { jsx as _jsx } from "react/jsx-runtime";
@@ -24,47 +25,57 @@ const StyledContrastContainerStyles = styled("div")({
 });
 const OdysseyThemeProvider = ({
   children,
-  contrastMode: explicitContrastMode,
-  designTokensOverride,
+  contrastMode: contrastModeProp,
+  designTokensOverride: designTokensOverrideProp,
+  hasWrapperElement = true,
   shadowDomElement,
-  shadowRootElement,
-  themeOverride
+  shadowRootElement: shadowRootElementProp,
+  themeOverride: themeOverrideProp
 }) => {
+  const odysseyThemeProviderPropsContext = useOdysseyThemeProviderPropsContext();
+  const designTokensOverride = designTokensOverrideProp ?? odysseyThemeProviderPropsContext.designTokensOverride;
+  const shadowRootElement = shadowRootElementProp ?? shadowDomElement ?? odysseyThemeProviderPropsContext.shadowRootElement;
+  const themeOverride = themeOverrideProp ?? odysseyThemeProviderPropsContext.themeOverride;
   const {
     contrastMode,
     contrastContainerRef
   } = useContrastMode({
-    contrastMode: explicitContrastMode
+    contrastMode: contrastModeProp
   });
   const odysseyTokens = useMemo(() => ({
     ...Tokens,
     ...designTokensOverride
   }), [designTokensOverride]);
-  const effectiveShadowRootElement = shadowRootElement || shadowDomElement;
   const odysseyTheme = useMemo(() => createOdysseyMuiTheme({
     contrastMode,
     odysseyTokens,
-    shadowRootElement: effectiveShadowRootElement
-  }), [contrastMode, odysseyTokens, effectiveShadowRootElement]);
+    shadowRootElement
+  }), [contrastMode, odysseyTokens, shadowRootElement]);
   const customOdysseyTheme = useMemo(() => createTheme(deepmerge(odysseyTheme, themeOverride || {})), [odysseyTheme, themeOverride]);
   const contrastModeProviderValue = useMemo(() => ({
     contrastMode
   }), [contrastMode]);
-  return _jsx(StyledContrastContainerStyles, {
-    ref: contrastContainerRef,
-    children: _jsx(ContrastModeContext.Provider, {
-      value: contrastModeProviderValue,
-      children: _jsx(MuiThemeProvider, {
-        theme: customOdysseyTheme,
+  const providerComponents = useMemo(() => _jsx(ContrastModeContext.Provider, {
+    value: contrastModeProviderValue,
+    children: _jsx(MuiThemeProvider, {
+      theme: customOdysseyTheme,
+      children: _jsx(OdysseyThemeProviderPropsProvider, {
+        designTokensOverride: designTokensOverride,
+        shadowRootElement: shadowRootElement,
+        themeOverride: themeOverride,
         children: _jsx(OdysseyDesignTokensContext.Provider, {
           value: odysseyTokens,
           children: children
         })
       })
     })
-  });
+  }), [children, contrastModeProviderValue, customOdysseyTheme, designTokensOverride, odysseyTokens, shadowRootElement, themeOverride]);
+  return hasWrapperElement ? _jsx(StyledContrastContainerStyles, {
+    ref: contrastContainerRef,
+    children: providerComponents
+  }) : providerComponents;
 };
-OdysseyThemeProvider.displayName = "OdysseyThemeProvider";
 const MemoizedOdysseyThemeProvider = memo(OdysseyThemeProvider);
+MemoizedOdysseyThemeProvider.displayName = "OdysseyThemeProvider";
 export { MemoizedOdysseyThemeProvider as OdysseyThemeProvider };
 //# sourceMappingURL=OdysseyThemeProvider.js.map

package/dist/esm/OdysseyThemeProvider.js.map

@@ -1 +1 @@
-{"version":3,"file":"OdysseyThemeProvider.js","names":["styled","createTheme","ThemeProvider","MuiThemeProvider","deepmerge","Tokens","memo","useMemo","OdysseyDesignTokensContext","createOdysseyMuiTheme","ContrastModeContext","useContrastMode","jsx","_jsx","StyledContrastContainerStyles","height","OdysseyThemeProvider","children","contrastMode","explicitContrastMode","designTokensOverride","shadowDomElement","shadowRootElement","themeOverride","contrastContainerRef","odysseyTokens","effectiveShadowRootElement","odysseyTheme","customOdysseyTheme","contrastModeProviderValue","ref","Provider","value","theme","displayName","MemoizedOdysseyThemeProvider"],"sources":["../../src/OdysseyThemeProvider.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport styled from \"@emotion/styled\";\nimport { ThemeOptions } from \"@mui/material\";\nimport {\n  createTheme,\n  ThemeProvider as MuiThemeProvider,\n} from \"@mui/material/styles\";\nimport { deepmerge } from \"@mui/utils\";\nimport * as Tokens from \"@okta/odyssey-design-tokens\";\nimport { memo, ReactNode, useMemo } from \"react\";\n\nimport { OdysseyDesignTokensContext } from \"./OdysseyDesignTokensContext.js\";\nimport { createOdysseyMuiTheme, DesignTokensOverride } from \"./theme/index.js\";\nimport {\n  ContrastMode,\n  ContrastModeContext,\n  useContrastMode,\n} from \"./useContrastMode.js\";\n\nconst StyledContrastContainerStyles = styled(\"div\")({\n  height: \"inherit\",\n});\n\nexport type OdysseyThemeProviderProps = {\n  children: ReactNode;\n  contrastMode?: ContrastMode;\n  designTokensOverride?: DesignTokensOverride;\n  /** @deprecated Use shadowRootElement instead */\n  shadowDomElement?: HTMLDivElement | HTMLElement;\n  shadowRootElement?: HTMLDivElement | HTMLElement;\n  themeOverride?: ThemeOptions;\n};\n\n/**\n * This function doesn't include the Emotion Cache or Translations. You should probably be using `OdysseyProvider`.\n *\n * Some teams have a need to wrap separately (SIW), but most teams will never need to use this explicitly.\n */\nconst OdysseyThemeProvider = ({\n  children,\n  contrastMode: explicitContrastMode,\n  designTokensOverride,\n  shadowDomElement,\n  shadowRootElement,\n  themeOverride,\n}: OdysseyThemeProviderProps) => {\n  const { contrastMode, contrastContainerRef } = useContrastMode({\n    contrastMode: explicitContrastMode,\n  });\n\n  const odysseyTokens = useMemo(\n    () => ({ ...Tokens, ...designTokensOverride }),\n    [designTokensOverride],\n  );\n\n  const effectiveShadowRootElement = shadowRootElement || shadowDomElement;\n\n  const odysseyTheme = useMemo(\n    () =>\n      createOdysseyMuiTheme({\n        contrastMode,\n        odysseyTokens,\n        shadowRootElement: effectiveShadowRootElement,\n      }),\n    [contrastMode, odysseyTokens, effectiveShadowRootElement],\n  );\n\n  const customOdysseyTheme = useMemo(\n    () => createTheme(deepmerge(odysseyTheme, themeOverride || {})),\n    [odysseyTheme, themeOverride],\n  );\n\n  const contrastModeProviderValue = useMemo(\n    () => ({\n      contrastMode,\n    }),\n    [contrastMode],\n  );\n\n  return (\n    <StyledContrastContainerStyles ref={contrastContainerRef}>\n      <ContrastModeContext.Provider value={contrastModeProviderValue}>\n        <MuiThemeProvider theme={customOdysseyTheme}>\n          <OdysseyDesignTokensContext.Provider value={odysseyTokens}>\n            {children}\n          </OdysseyDesignTokensContext.Provider>\n        </MuiThemeProvider>\n      </ContrastModeContext.Provider>\n    </StyledContrastContainerStyles>\n  );\n};\nOdysseyThemeProvider.displayName = \"OdysseyThemeProvider\";\n\nconst MemoizedOdysseyThemeProvider = memo(\n  OdysseyThemeProvider,\n) as typeof OdysseyThemeProvider;\n\nexport { MemoizedOdysseyThemeProvider as OdysseyThemeProvider };\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,OAAOA,MAAM,MAAM,iBAAiB;AAEpC,SACEC,WAAW,EACXC,aAAa,IAAIC,gBAAgB,QAC5B,sBAAsB;AAC7B,SAASC,SAAS,QAAQ,YAAY;AACtC,OAAO,KAAKC,MAAM,MAAM,6BAA6B;AACrD,SAASC,IAAI,EAAaC,OAAO,QAAQ,OAAO;AAEhD,SAASC,0BAA0B,QAAQ,iCAAiC;AAC5E,SAASC,qBAAqB,QAA8B,kBAAkB;AAC9E,SAEEC,mBAAmB,EACnBC,eAAe,QACV,sBAAsB;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAE9B,MAAMC,6BAA6B,GAAGd,MAAM,CAAC,KAAK,CAAC,CAAC;EAClDe,MAAM,EAAE;AACV,CAAC,CAAC;AAiBF,MAAMC,oBAAoB,GAAGA,CAAC;EAC5BC,QAAQ;EACRC,YAAY,EAAEC,oBAAoB;EAClCC,oBAAoB;EACpBC,gBAAgB;EAChBC,iBAAiB;EACjBC;AACyB,CAAC,KAAK;EAC/B,MAAM;IAAEL,YAAY;IAAEM;EAAqB,CAAC,GAAGb,eAAe,CAAC;IAC7DO,YAAY,EAAEC;EAChB,CAAC,CAAC;EAEF,MAAMM,aAAa,GAAGlB,OAAO,CAC3B,OAAO;IAAE,GAAGF,MAAM;IAAE,GAAGe;EAAqB,CAAC,CAAC,EAC9C,CAACA,oBAAoB,CACvB,CAAC;EAED,MAAMM,0BAA0B,GAAGJ,iBAAiB,IAAID,gBAAgB;EAExE,MAAMM,YAAY,GAAGpB,OAAO,CAC1B,MACEE,qBAAqB,CAAC;IACpBS,YAAY;IACZO,aAAa;IACbH,iBAAiB,EAAEI;EACrB,CAAC,CAAC,EACJ,CAACR,YAAY,EAAEO,aAAa,EAAEC,0BAA0B,CAC1D,CAAC;EAED,MAAME,kBAAkB,GAAGrB,OAAO,CAChC,MAAMN,WAAW,CAACG,SAAS,CAACuB,YAAY,EAAEJ,aAAa,IAAI,CAAC,CAAC,CAAC,CAAC,EAC/D,CAACI,YAAY,EAAEJ,aAAa,CAC9B,CAAC;EAED,MAAMM,yBAAyB,GAAGtB,OAAO,CACvC,OAAO;IACLW;EACF,CAAC,CAAC,EACF,CAACA,YAAY,CACf,CAAC;EAED,OACEL,IAAA,CAACC,6BAA6B;IAACgB,GAAG,EAAEN,oBAAqB;IAAAP,QAAA,EACvDJ,IAAA,CAACH,mBAAmB,CAACqB,QAAQ;MAACC,KAAK,EAAEH,yBAA0B;MAAAZ,QAAA,EAC7DJ,IAAA,CAACV,gBAAgB;QAAC8B,KAAK,EAAEL,kBAAmB;QAAAX,QAAA,EAC1CJ,IAAA,CAACL,0BAA0B,CAACuB,QAAQ;UAACC,KAAK,EAAEP,aAAc;UAAAR,QAAA,EACvDA;QAAQ,CAC0B;MAAC,CACtB;IAAC,CACS;EAAC,CACF,CAAC;AAEpC,CAAC;AACDD,oBAAoB,CAACkB,WAAW,GAAG,sBAAsB;AAEzD,MAAMC,4BAA4B,GAAG7B,IAAI,CACvCU,oBACF,CAAgC;AAEhC,SAASmB,4BAA4B,IAAInB,oBAAoB","ignoreList":[]}
+{"version":3,"file":"OdysseyThemeProvider.js","names":["styled","createTheme","ThemeProvider","MuiThemeProvider","deepmerge","Tokens","memo","useMemo","OdysseyDesignTokensContext","OdysseyThemeProviderPropsProvider","useOdysseyThemeProviderPropsContext","createOdysseyMuiTheme","ContrastModeContext","useContrastMode","jsx","_jsx","StyledContrastContainerStyles","height","OdysseyThemeProvider","children","contrastMode","contrastModeProp","designTokensOverride","designTokensOverrideProp","hasWrapperElement","shadowDomElement","shadowRootElement","shadowRootElementProp","themeOverride","themeOverrideProp","odysseyThemeProviderPropsContext","contrastContainerRef","odysseyTokens","odysseyTheme","customOdysseyTheme","contrastModeProviderValue","providerComponents","Provider","value","theme","ref","MemoizedOdysseyThemeProvider","displayName"],"sources":["../../src/OdysseyThemeProvider.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport styled from \"@emotion/styled\";\nimport {\n  createTheme,\n  ThemeProvider as MuiThemeProvider,\n} from \"@mui/material/styles\";\nimport { deepmerge } from \"@mui/utils\";\nimport * as Tokens from \"@okta/odyssey-design-tokens\";\nimport { memo, ReactNode, useMemo } from \"react\";\n\nimport { OdysseyDesignTokensContext } from \"./OdysseyDesignTokensContext.js\";\nimport {\n  type OdysseyThemeProviderContextProps,\n  OdysseyThemeProviderPropsProvider,\n  useOdysseyThemeProviderPropsContext,\n} from \"./OdysseyThemeProviderPropsContext.js\";\nimport { createOdysseyMuiTheme } from \"./theme/index.js\";\nimport {\n  ContrastMode,\n  ContrastModeContext,\n  useContrastMode,\n} from \"./useContrastMode.js\";\n\nconst StyledContrastContainerStyles = styled(\"div\")({\n  height: \"inherit\",\n});\n\nexport type OdysseyThemeProviderProps = OdysseyThemeProviderContextProps & {\n  children: ReactNode;\n  contrastMode?: ContrastMode;\n  /**\n   * Odyssey adds a wrapper `div` for contrast changes and height calculations. This is not necessary if you're not changing the background color or rendering into full-height element.\n   */\n  hasWrapperElement?: boolean;\n  /** @deprecated Use shadowRootElement instead */\n  shadowDomElement?: HTMLDivElement | HTMLElement;\n};\n\n/**\n * This function doesn't include the Emotion Cache or Translations. You should probably be using `OdysseyProvider`.\n *\n * Some teams have a need to wrap separately (SIW), but most teams will never need to use this explicitly.\n */\nconst OdysseyThemeProvider = ({\n  children,\n  contrastMode: contrastModeProp,\n  designTokensOverride: designTokensOverrideProp,\n  hasWrapperElement = true,\n  shadowDomElement,\n  shadowRootElement: shadowRootElementProp,\n  themeOverride: themeOverrideProp,\n}: OdysseyThemeProviderProps) => {\n  const odysseyThemeProviderPropsContext =\n    useOdysseyThemeProviderPropsContext();\n\n  const designTokensOverride =\n    designTokensOverrideProp ??\n    odysseyThemeProviderPropsContext.designTokensOverride;\n\n  const shadowRootElement =\n    shadowRootElementProp ??\n    shadowDomElement ??\n    odysseyThemeProviderPropsContext.shadowRootElement; // Adding `odysseyThemeProviderPropsContext.shadowRootElement` fixes popovers not being styled in `Surface`.\n\n  const themeOverride =\n    themeOverrideProp ?? odysseyThemeProviderPropsContext.themeOverride;\n\n  const { contrastMode, contrastContainerRef } = useContrastMode({\n    contrastMode: contrastModeProp,\n  });\n\n  const odysseyTokens = useMemo(\n    () => ({ ...Tokens, ...designTokensOverride }),\n    [designTokensOverride],\n  );\n\n  const odysseyTheme = useMemo(\n    () =>\n      createOdysseyMuiTheme({\n        contrastMode,\n        odysseyTokens,\n        shadowRootElement,\n      }),\n    [contrastMode, odysseyTokens, shadowRootElement],\n  );\n\n  const customOdysseyTheme = useMemo(\n    () => createTheme(deepmerge(odysseyTheme, themeOverride || {})),\n    [odysseyTheme, themeOverride],\n  );\n\n  const contrastModeProviderValue = useMemo(\n    () => ({\n      contrastMode,\n    }),\n    [contrastMode],\n  );\n\n  const providerComponents = useMemo(\n    () => (\n      <ContrastModeContext.Provider value={contrastModeProviderValue}>\n        <MuiThemeProvider theme={customOdysseyTheme}>\n          <OdysseyThemeProviderPropsProvider\n            designTokensOverride={designTokensOverride}\n            shadowRootElement={shadowRootElement}\n            themeOverride={themeOverride}\n          >\n            <OdysseyDesignTokensContext.Provider value={odysseyTokens}>\n              {children}\n            </OdysseyDesignTokensContext.Provider>\n          </OdysseyThemeProviderPropsProvider>\n        </MuiThemeProvider>\n      </ContrastModeContext.Provider>\n    ),\n    [\n      children,\n      contrastModeProviderValue,\n      customOdysseyTheme,\n      designTokensOverride,\n      odysseyTokens,\n      shadowRootElement,\n      themeOverride,\n    ],\n  );\n\n  return hasWrapperElement ? (\n    <StyledContrastContainerStyles ref={contrastContainerRef}>\n      {providerComponents}\n    </StyledContrastContainerStyles>\n  ) : (\n    providerComponents\n  );\n};\n\nconst MemoizedOdysseyThemeProvider = memo(OdysseyThemeProvider);\nMemoizedOdysseyThemeProvider.displayName = \"OdysseyThemeProvider\";\n\nexport { MemoizedOdysseyThemeProvider as OdysseyThemeProvider };\n"],"mappings":"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","ignoreList":[]}

package/dist/esm/OdysseyThemeProviderPropsContext.js

@@ -0,0 +1,38 @@
+/*!
+ * Copyright (c) 2025-present, Okta, Inc. and/or its affiliates. All rights reserved.
+ * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the "License.")
+ *
+ * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *
+ * See the License for the specific language governing permissions and limitations under the License.
+ */
+
+import { createContext, memo, useContext, useMemo } from "react";
+import { jsx as _jsx } from "react/jsx-runtime";
+export const OdysseyThemeProviderPropsContext = createContext({});
+export const useOdysseyThemeProviderPropsContext = () => useContext(OdysseyThemeProviderPropsContext);
+const OdysseyThemeProviderPropsProvider = ({
+  children,
+  designTokensOverride,
+  shadowRootElement,
+  themeOverride
+}) => {
+  const odysseyThemeProviderPropsContext = useOdysseyThemeProviderPropsContext();
+  const providerValue = useMemo(() => ({
+    ...odysseyThemeProviderPropsContext,
+    designTokensOverride,
+    shadowRootElement,
+    themeOverride
+  }), [designTokensOverride, odysseyThemeProviderPropsContext, shadowRootElement, themeOverride]);
+  return _jsx(OdysseyThemeProviderPropsContext.Provider, {
+    value: providerValue,
+    children: children
+  });
+};
+const MemoizedOdysseyThemeProviderPropsProvider = memo(OdysseyThemeProviderPropsProvider);
+MemoizedOdysseyThemeProviderPropsProvider.displayName = "OdysseyThemeProviderPropsProvider";
+export { MemoizedOdysseyThemeProviderPropsProvider as OdysseyThemeProviderPropsProvider };
+//# sourceMappingURL=OdysseyThemeProviderPropsContext.js.map

package/dist/esm/OdysseyThemeProviderPropsContext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"OdysseyThemeProviderPropsContext.js","names":["createContext","memo","useContext","useMemo","jsx","_jsx","OdysseyThemeProviderPropsContext","useOdysseyThemeProviderPropsContext","OdysseyThemeProviderPropsProvider","children","designTokensOverride","shadowRootElement","themeOverride","odysseyThemeProviderPropsContext","providerValue","Provider","value","MemoizedOdysseyThemeProviderPropsProvider","displayName"],"sources":["../../src/OdysseyThemeProviderPropsContext.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2025-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport { ThemeOptions } from \"@mui/material\";\nimport {\n  createContext,\n  memo,\n  type ReactNode,\n  useContext,\n  useMemo,\n} from \"react\";\n\nimport { DesignTokensOverride } from \"./theme/index.js\";\n\nexport type OdysseyThemeProviderContextProps = {\n  designTokensOverride?: DesignTokensOverride;\n  shadowRootElement?: HTMLDivElement | HTMLElement;\n  themeOverride?: ThemeOptions;\n};\n\nexport const OdysseyThemeProviderPropsContext =\n  createContext<OdysseyThemeProviderContextProps>({});\n\nexport const useOdysseyThemeProviderPropsContext = () =>\n  useContext(OdysseyThemeProviderPropsContext);\n\nexport type OdysseyThemeProviderPropsProviderProps =\n  OdysseyThemeProviderContextProps & {\n    children: ReactNode;\n  };\n\nconst OdysseyThemeProviderPropsProvider = ({\n  children,\n  designTokensOverride,\n  shadowRootElement,\n  themeOverride,\n}: OdysseyThemeProviderPropsProviderProps) => {\n  const odysseyThemeProviderPropsContext =\n    useOdysseyThemeProviderPropsContext();\n\n  const providerValue = useMemo(\n    () => ({\n      ...odysseyThemeProviderPropsContext,\n      designTokensOverride,\n      shadowRootElement,\n      themeOverride,\n    }),\n    [\n      designTokensOverride,\n      odysseyThemeProviderPropsContext,\n      shadowRootElement,\n      themeOverride,\n    ],\n  );\n\n  return (\n    <OdysseyThemeProviderPropsContext.Provider value={providerValue}>\n      {children}\n    </OdysseyThemeProviderPropsContext.Provider>\n  );\n};\n\nconst MemoizedOdysseyThemeProviderPropsProvider = memo(\n  OdysseyThemeProviderPropsProvider,\n);\nMemoizedOdysseyThemeProviderPropsProvider.displayName =\n  \"OdysseyThemeProviderPropsProvider\";\n\nexport { MemoizedOdysseyThemeProviderPropsProvider as OdysseyThemeProviderPropsProvider };\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAGA,SACEA,aAAa,EACbC,IAAI,EAEJC,UAAU,EACVC,OAAO,QACF,OAAO;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAUf,OAAO,MAAMC,gCAAgC,GAC3CN,aAAa,CAAmC,CAAC,CAAC,CAAC;AAErD,OAAO,MAAMO,mCAAmC,GAAGA,CAAA,KACjDL,UAAU,CAACI,gCAAgC,CAAC;AAO9C,MAAME,iCAAiC,GAAGA,CAAC;EACzCC,QAAQ;EACRC,oBAAoB;EACpBC,iBAAiB;EACjBC;AACsC,CAAC,KAAK;EAC5C,MAAMC,gCAAgC,GACpCN,mCAAmC,CAAC,CAAC;EAEvC,MAAMO,aAAa,GAAGX,OAAO,CAC3B,OAAO;IACL,GAAGU,gCAAgC;IACnCH,oBAAoB;IACpBC,iBAAiB;IACjBC;EACF,CAAC,CAAC,EACF,CACEF,oBAAoB,EACpBG,gCAAgC,EAChCF,iBAAiB,EACjBC,aAAa,CAEjB,CAAC;EAED,OACEP,IAAA,CAACC,gCAAgC,CAACS,QAAQ;IAACC,KAAK,EAAEF,aAAc;IAAAL,QAAA,EAC7DA;EAAQ,CACgC,CAAC;AAEhD,CAAC;AAED,MAAMQ,yCAAyC,GAAGhB,IAAI,CACpDO,iCACF,CAAC;AACDS,yCAAyC,CAACC,WAAW,GACnD,mCAAmC;AAErC,SAASD,yCAAyC,IAAIT,iCAAiC","ignoreList":[]}

package/dist/esm/Pagination/Pagination.js

@@ -13,14 +13,13 @@ import _InputBase from "@mui/material/InputBase";
 
 import styled from "@emotion/styled";
 import { memo, useCallback, useEffect, useMemo, useRef, useState } from "react";
-import { useTranslation } from "react-i18next";
 import { Box } from "../Box.js";
 import { Button } from "../Buttons/index.js";
+import { useTranslation } from "../i18n.generated/i18n.js";
 import { ArrowLeftIcon, ArrowRightIcon } from "../icons.generated/index.js";
 import { useOdysseyDesignTokens } from "../OdysseyDesignTokensContext.js";
 import { Paragraph } from "../Typography.js";
 import { usePagination } from "./usePagination.js";
-import "../i18n.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const PaginationContainer = styled("nav")({
   display: "flex",

package/dist/esm/Pagination/Pagination.js.map

@@ -1 +1 @@
-{"version":3,"file":"Pagination.js","names":["styled","memo","useCallback","useEffect","useMemo","useRef","useState","useTranslation","Box","Button","ArrowLeftIcon","ArrowRightIcon","useOdysseyDesignTokens","Paragraph","usePagination","jsx","_jsx","jsxs","_jsxs","PaginationContainer","display","justifyContent","PaginationSegment","shouldForwardProp","prop","odysseyDesignTokens","alignItems","gap","Spacing4","Spacing2","PaginationInput","_InputBase","borderColor","HueNeutral200","borderRadius","BorderRadiusTight","height","Spacing6","width","HueNeutral400","PalettePrimaryMain","PaginationButtonContainer","marginInlineStart","Pagination","currentPageLabel","currentPageLabelProp","currentRowsCount","hasPageInput","hasRowCountInput","hasRowCountLabel","isDisabled","isMoreDisabled","lastRow","loadMoreLabel","loadMoreLabelProp","maxPageIndex","maxPageSize","nextLabel","nextLabelProp","onPaginationChange","onPaginationChangeProp","pageIndex","pageSize","previousLabel","previousLabelProp","rowsPerPageLabel","rowsPerPageLabelProp","totalRows","variant","t","page","setPage","rowsPerPage","setRowsPerPage","initialRowsPerPage","totalRowsLabel","handlePaginationChange","updatedPage","updatedRowsPerPage","Math","ceil","handlePageSubmit","event","key","Number","currentTarget","value","handleRowsPerPageSubmit","setPageFromEvent","min","target","max","setRowsPerPageFromEvent","handleLoadMore","current","handleNextButton","handlePreviousButton","loadMoreIsDisabled","nextButtonDisabled","previousButtonDisabled","rowsPerPageInputProps","currentPageInputProps","children","color","component","disabled","inputProps","onBlur","onChange","onKeyDown","type","ariaLabel","onClick","size","startIcon","endIcon","label","MemoizedPagination","displayName"],"sources":["../../../src/Pagination/Pagination.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2023-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport styled from \"@emotion/styled\";\nimport { InputBase } from \"@mui/material\";\nimport { memo, useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport { useTranslation } from \"react-i18next\";\n\nimport { Box } from \"../Box.js\";\nimport { Button } from \"../Buttons/index.js\";\nimport { ArrowLeftIcon, ArrowRightIcon } from \"../icons.generated/index.js\";\nimport {\n  DesignTokens,\n  useOdysseyDesignTokens,\n} from \"../OdysseyDesignTokensContext.js\";\nimport { Paragraph } from \"../Typography.js\";\nimport { paginationTypeValues } from \"./constants.js\";\nimport { usePagination } from \"./usePagination.js\";\nimport \"../i18n.js\";\n\nconst PaginationContainer = styled(\"nav\")({\n  display: \"flex\",\n  justifyContent: \"space-between\",\n});\n\nconst PaginationSegment = styled(\"div\", {\n  shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{ odysseyDesignTokens: DesignTokens }>(({ odysseyDesignTokens }) => ({\n  display: \"flex\",\n  alignItems: \"center\",\n  gap: odysseyDesignTokens.Spacing4,\n  \"& > div\": {\n    display: \"flex\",\n    alignItems: \"center\",\n    gap: odysseyDesignTokens.Spacing2,\n  },\n}));\n\nconst PaginationInput = styled(InputBase, {\n  shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{ odysseyDesignTokens: DesignTokens }>(({ odysseyDesignTokens }) => ({\n  borderColor: odysseyDesignTokens.HueNeutral200,\n  borderRadius: odysseyDesignTokens.BorderRadiusTight,\n  height: odysseyDesignTokens.Spacing6,\n  width: \"4.5714285714rem\", // This is a hardcoded value, keep as string\n  \"&:hover\": {\n    borderColor: odysseyDesignTokens.HueNeutral400,\n  },\n  \"&.Mui-focused:hover\": {\n    borderColor: odysseyDesignTokens.PalettePrimaryMain,\n  },\n}));\n\nconst PaginationButtonContainer = styled(\"div\")({\n  \"& > *\": {\n    marginInlineStart: `0 !important`,\n  },\n});\n\nexport type PaginationProps = {\n  /**\n   * The labeled rendered for the current page index\n   */\n  currentPageLabel?: string;\n  /**\n   * The number of items currently visible on the page\n   */\n  currentRowsCount?: number;\n  /**\n   * If true, the page input will be visible and the user can directly manipulate which page\n   * is visible.\n   */\n  hasPageInput?: boolean;\n  /**\n   * If true, the row count input will be visible and the user can directly manipulate how many rows\n   * are visible.\n   */\n  hasRowCountInput?: boolean;\n  /**\n   * If true, the \"X - X of total X\" label will be visible\n   */\n  hasRowCountLabel?: boolean;\n  /**\n   * If true, the pagination controls will be disabled\n   */\n  isDisabled?: boolean;\n  /**\n   * If true, the next or Show More button will be disabled\n   */\n  isMoreDisabled?: boolean;\n  /**\n   * The current page last row index\n   */\n  lastRow?: number;\n  /**\n   * If the pagination is of \"loadMore\" variant, then this is the the load more label\n   */\n  loadMoreLabel?: string;\n  /**\n   * The max page\n   */\n  maxPageIndex?: number;\n  /**\n   * The max rows per page\n   */\n  maxPageSize?: number;\n  /**\n   * The label for the next control\n   */\n  nextLabel?: string;\n  /**\n   * Page index and page size setter\n   */\n  onPaginationChange: ({\n    pageIndex,\n    pageSize,\n  }: {\n    pageIndex: number;\n    pageSize: number;\n  }) => void;\n  /**\n   * The current page index\n   */\n  pageIndex: number;\n  /**\n   * The current page size\n   */\n  pageSize: number;\n  /**\n   * The label for the previous control\n   */\n  previousLabel?: string;\n  /**\n   * The label that shows how many results are rendered per page\n   */\n  rowsPerPageLabel?: string;\n  /**\n   * Total rows count\n   */\n  totalRows?: number;\n  /**\n   * The type of pagination controls shown. Defaults to next/prev buttons, but can be\n   * set to a simple \"Load more\" button by setting to \"loadMore\".\n   */\n  variant?: (typeof paginationTypeValues)[number];\n};\n\nconst Pagination = ({\n  currentPageLabel: currentPageLabelProp,\n  currentRowsCount,\n  hasPageInput = true,\n  hasRowCountInput = true,\n  hasRowCountLabel = true,\n  isDisabled,\n  isMoreDisabled,\n  lastRow,\n  loadMoreLabel: loadMoreLabelProp,\n  maxPageIndex,\n  maxPageSize,\n  nextLabel: nextLabelProp,\n  onPaginationChange: onPaginationChangeProp,\n  pageIndex,\n  pageSize,\n  previousLabel: previousLabelProp,\n  rowsPerPageLabel: rowsPerPageLabelProp,\n  totalRows,\n  variant,\n}: PaginationProps) => {\n  const odysseyDesignTokens = useOdysseyDesignTokens();\n  const { t } = useTranslation();\n\n  const [page, setPage] = useState<number>(pageIndex);\n  const [rowsPerPage, setRowsPerPage] = useState<number>(pageSize);\n  const initialRowsPerPage = useRef<number>(pageSize);\n\n  const currentPageLabel = currentPageLabelProp ?? t(\"pagination.page\");\n  const loadMoreLabel = loadMoreLabelProp ?? t(\"pagination.loadmore\");\n  const nextLabel = nextLabelProp ?? t(\"pagination.next\");\n  const previousLabel = previousLabelProp ?? t(\"pagination.previous\");\n  const rowsPerPageLabel = rowsPerPageLabelProp ?? t(\"pagination.rowsperpage\");\n\n  useEffect(() => {\n    setPage(pageIndex);\n    setRowsPerPage(pageSize);\n  }, [pageIndex, pageSize]);\n\n  const onPaginationChange = useCallback(\n    ({ pageIndex, pageSize }: { pageIndex: number; pageSize: number }) => {\n      onPaginationChangeProp({ pageIndex, pageSize });\n    },\n    [onPaginationChangeProp],\n  );\n\n  const { totalRowsLabel } = usePagination({\n    pageIndex,\n    pageSize,\n    currentRowsCount: currentRowsCount || 0,\n    totalRows,\n  });\n\n  const handlePaginationChange = useCallback(() => {\n    let updatedPage = page;\n    let updatedRowsPerPage = rowsPerPage;\n\n    if (totalRows) {\n      const maxPageIndex = Math.ceil(totalRows / updatedRowsPerPage);\n\n      // Ensure rowsPerPage does not exceed totalRows\n      if (updatedRowsPerPage > totalRows) {\n        updatedRowsPerPage = totalRows;\n      }\n\n      // Ensure page is within valid range\n      if (updatedPage > maxPageIndex) {\n        updatedPage = maxPageIndex;\n      } else if (updatedPage < 1) {\n        updatedPage = 1;\n      }\n    }\n\n    onPaginationChange({\n      pageIndex: updatedPage,\n      pageSize: updatedRowsPerPage,\n    });\n  }, [page, rowsPerPage, onPaginationChange, totalRows]);\n\n  // The following handlers use React.KeyboardEvent (rather than just KeyboardEvent) because React.KeyboardEvent\n  // is generic, while plain KeyboardEvent is not. We need this generic so we can specify the HTMLInputElement,\n  // which allows us to use currentTarget.value\n  const handlePageSubmit = useCallback(\n    (event: React.KeyboardEvent<HTMLInputElement | HTMLTextAreaElement>) => {\n      if (event.key === \"Enter\") {\n        onPaginationChange({\n          pageIndex: Number(event.currentTarget.value),\n          pageSize: rowsPerPage,\n        });\n      }\n    },\n    [rowsPerPage, onPaginationChange],\n  );\n\n  const handleRowsPerPageSubmit = useCallback(\n    (event: React.KeyboardEvent<HTMLInputElement | HTMLTextAreaElement>) => {\n      if (event.key === \"Enter\") {\n        onPaginationChange({\n          pageIndex: page,\n          pageSize: Number(event.currentTarget.value),\n        });\n      }\n    },\n    [page, onPaginationChange],\n  );\n\n  const setPageFromEvent = useCallback(\n    (event: React.ChangeEvent<HTMLInputElement>) => {\n      const value = maxPageIndex\n        ? Math.min(Number(event.target.value), maxPageIndex)\n        : Number(event.target.value);\n\n      // Ensure the value can't be less than 1\n      setPage(Math.max(1, value));\n    },\n    [setPage, maxPageIndex],\n  );\n\n  const setRowsPerPageFromEvent = useCallback(\n    (event: React.ChangeEvent<HTMLInputElement>) => {\n      const value = maxPageSize\n        ? Math.min(Number(event.target.value), maxPageSize)\n        : Number(event.target.value);\n\n      // Ensure the value can't be less than 1\n      setRowsPerPage(Math.max(1, value));\n    },\n    [setRowsPerPage, maxPageSize],\n  );\n\n  const handleLoadMore = useCallback(() => {\n    onPaginationChange({\n      pageIndex: 1,\n      pageSize: rowsPerPage + initialRowsPerPage.current,\n    });\n  }, [rowsPerPage, onPaginationChange]);\n\n  const handleNextButton = useCallback(() => {\n    onPaginationChange({ pageIndex: page + 1, pageSize: rowsPerPage });\n  }, [onPaginationChange, page, rowsPerPage]);\n\n  const handlePreviousButton = useCallback(() => {\n    onPaginationChange({ pageIndex: page - 1, pageSize: rowsPerPage });\n  }, [onPaginationChange, page, rowsPerPage]);\n\n  const loadMoreIsDisabled = useMemo(() => {\n    return isMoreDisabled || (totalRows ? rowsPerPage >= totalRows : false);\n  }, [isMoreDisabled, rowsPerPage, totalRows]);\n\n  const nextButtonDisabled = useMemo(\n    () =>\n      isMoreDisabled ||\n      (lastRow && (totalRows ? lastRow >= totalRows : false)) ||\n      isDisabled,\n    [isMoreDisabled, totalRows, lastRow, isDisabled],\n  );\n\n  const previousButtonDisabled = useMemo(\n    () => pageIndex <= 1 || isDisabled,\n    [pageIndex, isDisabled],\n  );\n\n  const rowsPerPageInputProps = useMemo(\n    () => ({\n      \"aria-label\": rowsPerPageLabel,\n      max: maxPageSize || totalRows,\n    }),\n    [maxPageSize, rowsPerPageLabel, totalRows],\n  );\n\n  const currentPageInputProps = useMemo(\n    () => ({\n      \"aria-label\": currentPageLabel,\n      max: maxPageIndex,\n    }),\n    [currentPageLabel, maxPageIndex],\n  );\n\n  return variant === \"paged\" ? (\n    <PaginationContainer aria-label={t(\"pagination.label\")}>\n      <PaginationSegment odysseyDesignTokens={odysseyDesignTokens}>\n        {hasRowCountInput && (\n          <Box>\n            <Paragraph color=\"textSecondary\" component=\"span\">\n              {rowsPerPageLabel}\n            </Paragraph>\n            <PaginationInput\n              disabled={isDisabled}\n              inputProps={rowsPerPageInputProps}\n              odysseyDesignTokens={odysseyDesignTokens}\n              onBlur={handlePaginationChange}\n              onChange={setRowsPerPageFromEvent}\n              onKeyDown={handleRowsPerPageSubmit}\n              type=\"number\"\n              value={rowsPerPage}\n            />\n          </Box>\n        )}\n        {hasRowCountLabel && (\n          <Paragraph color=\"textSecondary\" component=\"span\">\n            {totalRowsLabel}\n          </Paragraph>\n        )}\n      </PaginationSegment>\n\n      <PaginationSegment odysseyDesignTokens={odysseyDesignTokens}>\n        {totalRows && hasPageInput && (\n          <Box>\n            <Paragraph color=\"textSecondary\" component=\"span\">\n              {currentPageLabel}\n            </Paragraph>\n            <PaginationInput\n              disabled={isDisabled}\n              inputProps={currentPageInputProps}\n              odysseyDesignTokens={odysseyDesignTokens}\n              onBlur={handlePaginationChange}\n              onChange={setPageFromEvent}\n              onKeyDown={handlePageSubmit}\n              type=\"number\"\n              value={page}\n            />\n          </Box>\n        )}\n        <PaginationButtonContainer>\n          <Button\n            ariaLabel={previousLabel}\n            isDisabled={previousButtonDisabled}\n            onClick={handlePreviousButton}\n            size=\"small\"\n            startIcon={<ArrowLeftIcon />}\n            variant=\"floating\"\n          />\n          <Button\n            ariaLabel={nextLabel}\n            endIcon={<ArrowRightIcon />}\n            isDisabled={nextButtonDisabled}\n            onClick={handleNextButton}\n            size=\"small\"\n            variant=\"floating\"\n          />\n        </PaginationButtonContainer>\n      </PaginationSegment>\n    </PaginationContainer>\n  ) : (\n    <Button\n      isDisabled={loadMoreIsDisabled}\n      label={loadMoreLabel}\n      onClick={handleLoadMore}\n      variant=\"secondary\"\n    />\n  );\n};\n\nconst MemoizedPagination = memo(Pagination);\nMemoizedPagination.displayName = \"Pagination\";\n\nexport { MemoizedPagination as Pagination };\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"Pagination.js","names":["styled","memo","useCallback","useEffect","useMemo","useRef","useState","Box","Button","useTranslation","ArrowLeftIcon","ArrowRightIcon","useOdysseyDesignTokens","Paragraph","usePagination","jsx","_jsx","jsxs","_jsxs","PaginationContainer","display","justifyContent","PaginationSegment","shouldForwardProp","prop","odysseyDesignTokens","alignItems","gap","Spacing4","Spacing2","PaginationInput","_InputBase","borderColor","HueNeutral200","borderRadius","BorderRadiusTight","height","Spacing6","width","HueNeutral400","PalettePrimaryMain","PaginationButtonContainer","marginInlineStart","Pagination","currentPageLabel","currentPageLabelProp","currentRowsCount","hasPageInput","hasRowCountInput","hasRowCountLabel","isDisabled","isMoreDisabled","lastRow","loadMoreLabel","loadMoreLabelProp","maxPageIndex","maxPageSize","nextLabel","nextLabelProp","onPaginationChange","onPaginationChangeProp","pageIndex","pageSize","previousLabel","previousLabelProp","rowsPerPageLabel","rowsPerPageLabelProp","totalRows","variant","t","page","setPage","rowsPerPage","setRowsPerPage","initialRowsPerPage","totalRowsLabel","handlePaginationChange","updatedPage","updatedRowsPerPage","Math","ceil","handlePageSubmit","event","key","Number","currentTarget","value","handleRowsPerPageSubmit","setPageFromEvent","min","target","max","setRowsPerPageFromEvent","handleLoadMore","current","handleNextButton","handlePreviousButton","loadMoreIsDisabled","nextButtonDisabled","previousButtonDisabled","rowsPerPageInputProps","currentPageInputProps","children","color","component","disabled","inputProps","onBlur","onChange","onKeyDown","type","ariaLabel","onClick","size","startIcon","endIcon","label","MemoizedPagination","displayName"],"sources":["../../../src/Pagination/Pagination.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2023-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport styled from \"@emotion/styled\";\nimport { InputBase } from \"@mui/material\";\nimport { memo, useCallback, useEffect, useMemo, useRef, useState } from \"react\";\n\nimport { Box } from \"../Box.js\";\nimport { Button } from \"../Buttons/index.js\";\nimport { useTranslation } from \"../i18n.generated/i18n.js\";\nimport { ArrowLeftIcon, ArrowRightIcon } from \"../icons.generated/index.js\";\nimport {\n  DesignTokens,\n  useOdysseyDesignTokens,\n} from \"../OdysseyDesignTokensContext.js\";\nimport { Paragraph } from \"../Typography.js\";\nimport { paginationTypeValues } from \"./constants.js\";\nimport { usePagination } from \"./usePagination.js\";\n\nconst PaginationContainer = styled(\"nav\")({\n  display: \"flex\",\n  justifyContent: \"space-between\",\n});\n\nconst PaginationSegment = styled(\"div\", {\n  shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{ odysseyDesignTokens: DesignTokens }>(({ odysseyDesignTokens }) => ({\n  display: \"flex\",\n  alignItems: \"center\",\n  gap: odysseyDesignTokens.Spacing4,\n  \"& > div\": {\n    display: \"flex\",\n    alignItems: \"center\",\n    gap: odysseyDesignTokens.Spacing2,\n  },\n}));\n\nconst PaginationInput = styled(InputBase, {\n  shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{ odysseyDesignTokens: DesignTokens }>(({ odysseyDesignTokens }) => ({\n  borderColor: odysseyDesignTokens.HueNeutral200,\n  borderRadius: odysseyDesignTokens.BorderRadiusTight,\n  height: odysseyDesignTokens.Spacing6,\n  width: \"4.5714285714rem\", // This is a hardcoded value, keep as string\n  \"&:hover\": {\n    borderColor: odysseyDesignTokens.HueNeutral400,\n  },\n  \"&.Mui-focused:hover\": {\n    borderColor: odysseyDesignTokens.PalettePrimaryMain,\n  },\n}));\n\nconst PaginationButtonContainer = styled(\"div\")({\n  \"& > *\": {\n    marginInlineStart: `0 !important`,\n  },\n});\n\nexport type PaginationProps = {\n  /**\n   * The labeled rendered for the current page index\n   */\n  currentPageLabel?: string;\n  /**\n   * The number of items currently visible on the page\n   */\n  currentRowsCount?: number;\n  /**\n   * If true, the page input will be visible and the user can directly manipulate which page\n   * is visible.\n   */\n  hasPageInput?: boolean;\n  /**\n   * If true, the row count input will be visible and the user can directly manipulate how many rows\n   * are visible.\n   */\n  hasRowCountInput?: boolean;\n  /**\n   * If true, the \"X - X of total X\" label will be visible\n   */\n  hasRowCountLabel?: boolean;\n  /**\n   * If true, the pagination controls will be disabled\n   */\n  isDisabled?: boolean;\n  /**\n   * If true, the next or Show More button will be disabled\n   */\n  isMoreDisabled?: boolean;\n  /**\n   * The current page last row index\n   */\n  lastRow?: number;\n  /**\n   * If the pagination is of \"loadMore\" variant, then this is the the load more label\n   */\n  loadMoreLabel?: string;\n  /**\n   * The max page\n   */\n  maxPageIndex?: number;\n  /**\n   * The max rows per page\n   */\n  maxPageSize?: number;\n  /**\n   * The label for the next control\n   */\n  nextLabel?: string;\n  /**\n   * Page index and page size setter\n   */\n  onPaginationChange: ({\n    pageIndex,\n    pageSize,\n  }: {\n    pageIndex: number;\n    pageSize: number;\n  }) => void;\n  /**\n   * The current page index\n   */\n  pageIndex: number;\n  /**\n   * The current page size\n   */\n  pageSize: number;\n  /**\n   * The label for the previous control\n   */\n  previousLabel?: string;\n  /**\n   * The label that shows how many results are rendered per page\n   */\n  rowsPerPageLabel?: string;\n  /**\n   * Total rows count\n   */\n  totalRows?: number;\n  /**\n   * The type of pagination controls shown. Defaults to next/prev buttons, but can be\n   * set to a simple \"Load more\" button by setting to \"loadMore\".\n   */\n  variant?: (typeof paginationTypeValues)[number];\n};\n\nconst Pagination = ({\n  currentPageLabel: currentPageLabelProp,\n  currentRowsCount,\n  hasPageInput = true,\n  hasRowCountInput = true,\n  hasRowCountLabel = true,\n  isDisabled,\n  isMoreDisabled,\n  lastRow,\n  loadMoreLabel: loadMoreLabelProp,\n  maxPageIndex,\n  maxPageSize,\n  nextLabel: nextLabelProp,\n  onPaginationChange: onPaginationChangeProp,\n  pageIndex,\n  pageSize,\n  previousLabel: previousLabelProp,\n  rowsPerPageLabel: rowsPerPageLabelProp,\n  totalRows,\n  variant,\n}: PaginationProps) => {\n  const odysseyDesignTokens = useOdysseyDesignTokens();\n  const { t } = useTranslation();\n\n  const [page, setPage] = useState<number>(pageIndex);\n  const [rowsPerPage, setRowsPerPage] = useState<number>(pageSize);\n  const initialRowsPerPage = useRef<number>(pageSize);\n\n  const currentPageLabel = currentPageLabelProp ?? t(\"pagination.page\");\n  const loadMoreLabel = loadMoreLabelProp ?? t(\"pagination.loadmore\");\n  const nextLabel = nextLabelProp ?? t(\"pagination.next\");\n  const previousLabel = previousLabelProp ?? t(\"pagination.previous\");\n  const rowsPerPageLabel = rowsPerPageLabelProp ?? t(\"pagination.rowsperpage\");\n\n  useEffect(() => {\n    setPage(pageIndex);\n    setRowsPerPage(pageSize);\n  }, [pageIndex, pageSize]);\n\n  const onPaginationChange = useCallback(\n    ({ pageIndex, pageSize }: { pageIndex: number; pageSize: number }) => {\n      onPaginationChangeProp({ pageIndex, pageSize });\n    },\n    [onPaginationChangeProp],\n  );\n\n  const { totalRowsLabel } = usePagination({\n    pageIndex,\n    pageSize,\n    currentRowsCount: currentRowsCount || 0,\n    totalRows,\n  });\n\n  const handlePaginationChange = useCallback(() => {\n    let updatedPage = page;\n    let updatedRowsPerPage = rowsPerPage;\n\n    if (totalRows) {\n      const maxPageIndex = Math.ceil(totalRows / updatedRowsPerPage);\n\n      // Ensure rowsPerPage does not exceed totalRows\n      if (updatedRowsPerPage > totalRows) {\n        updatedRowsPerPage = totalRows;\n      }\n\n      // Ensure page is within valid range\n      if (updatedPage > maxPageIndex) {\n        updatedPage = maxPageIndex;\n      } else if (updatedPage < 1) {\n        updatedPage = 1;\n      }\n    }\n\n    onPaginationChange({\n      pageIndex: updatedPage,\n      pageSize: updatedRowsPerPage,\n    });\n  }, [page, rowsPerPage, onPaginationChange, totalRows]);\n\n  // The following handlers use React.KeyboardEvent (rather than just KeyboardEvent) because React.KeyboardEvent\n  // is generic, while plain KeyboardEvent is not. We need this generic so we can specify the HTMLInputElement,\n  // which allows us to use currentTarget.value\n  const handlePageSubmit = useCallback(\n    (event: React.KeyboardEvent<HTMLInputElement | HTMLTextAreaElement>) => {\n      if (event.key === \"Enter\") {\n        onPaginationChange({\n          pageIndex: Number(event.currentTarget.value),\n          pageSize: rowsPerPage,\n        });\n      }\n    },\n    [rowsPerPage, onPaginationChange],\n  );\n\n  const handleRowsPerPageSubmit = useCallback(\n    (event: React.KeyboardEvent<HTMLInputElement | HTMLTextAreaElement>) => {\n      if (event.key === \"Enter\") {\n        onPaginationChange({\n          pageIndex: page,\n          pageSize: Number(event.currentTarget.value),\n        });\n      }\n    },\n    [page, onPaginationChange],\n  );\n\n  const setPageFromEvent = useCallback(\n    (event: React.ChangeEvent<HTMLInputElement>) => {\n      const value = maxPageIndex\n        ? Math.min(Number(event.target.value), maxPageIndex)\n        : Number(event.target.value);\n\n      // Ensure the value can't be less than 1\n      setPage(Math.max(1, value));\n    },\n    [setPage, maxPageIndex],\n  );\n\n  const setRowsPerPageFromEvent = useCallback(\n    (event: React.ChangeEvent<HTMLInputElement>) => {\n      const value = maxPageSize\n        ? Math.min(Number(event.target.value), maxPageSize)\n        : Number(event.target.value);\n\n      // Ensure the value can't be less than 1\n      setRowsPerPage(Math.max(1, value));\n    },\n    [setRowsPerPage, maxPageSize],\n  );\n\n  const handleLoadMore = useCallback(() => {\n    onPaginationChange({\n      pageIndex: 1,\n      pageSize: rowsPerPage + initialRowsPerPage.current,\n    });\n  }, [rowsPerPage, onPaginationChange]);\n\n  const handleNextButton = useCallback(() => {\n    onPaginationChange({ pageIndex: page + 1, pageSize: rowsPerPage });\n  }, [onPaginationChange, page, rowsPerPage]);\n\n  const handlePreviousButton = useCallback(() => {\n    onPaginationChange({ pageIndex: page - 1, pageSize: rowsPerPage });\n  }, [onPaginationChange, page, rowsPerPage]);\n\n  const loadMoreIsDisabled = useMemo(() => {\n    return isMoreDisabled || (totalRows ? rowsPerPage >= totalRows : false);\n  }, [isMoreDisabled, rowsPerPage, totalRows]);\n\n  const nextButtonDisabled = useMemo(\n    () =>\n      isMoreDisabled ||\n      (lastRow && (totalRows ? lastRow >= totalRows : false)) ||\n      isDisabled,\n    [isMoreDisabled, totalRows, lastRow, isDisabled],\n  );\n\n  const previousButtonDisabled = useMemo(\n    () => pageIndex <= 1 || isDisabled,\n    [pageIndex, isDisabled],\n  );\n\n  const rowsPerPageInputProps = useMemo(\n    () => ({\n      \"aria-label\": rowsPerPageLabel,\n      max: maxPageSize || totalRows,\n    }),\n    [maxPageSize, rowsPerPageLabel, totalRows],\n  );\n\n  const currentPageInputProps = useMemo(\n    () => ({\n      \"aria-label\": currentPageLabel,\n      max: maxPageIndex,\n    }),\n    [currentPageLabel, maxPageIndex],\n  );\n\n  return variant === \"paged\" ? (\n    <PaginationContainer aria-label={t(\"pagination.label\")}>\n      <PaginationSegment odysseyDesignTokens={odysseyDesignTokens}>\n        {hasRowCountInput && (\n          <Box>\n            <Paragraph color=\"textSecondary\" component=\"span\">\n              {rowsPerPageLabel}\n            </Paragraph>\n            <PaginationInput\n              disabled={isDisabled}\n              inputProps={rowsPerPageInputProps}\n              odysseyDesignTokens={odysseyDesignTokens}\n              onBlur={handlePaginationChange}\n              onChange={setRowsPerPageFromEvent}\n              onKeyDown={handleRowsPerPageSubmit}\n              type=\"number\"\n              value={rowsPerPage}\n            />\n          </Box>\n        )}\n        {hasRowCountLabel && (\n          <Paragraph color=\"textSecondary\" component=\"span\">\n            {totalRowsLabel}\n          </Paragraph>\n        )}\n      </PaginationSegment>\n\n      <PaginationSegment odysseyDesignTokens={odysseyDesignTokens}>\n        {totalRows && hasPageInput && (\n          <Box>\n            <Paragraph color=\"textSecondary\" component=\"span\">\n              {currentPageLabel}\n            </Paragraph>\n            <PaginationInput\n              disabled={isDisabled}\n              inputProps={currentPageInputProps}\n              odysseyDesignTokens={odysseyDesignTokens}\n              onBlur={handlePaginationChange}\n              onChange={setPageFromEvent}\n              onKeyDown={handlePageSubmit}\n              type=\"number\"\n              value={page}\n            />\n          </Box>\n        )}\n        <PaginationButtonContainer>\n          <Button\n            ariaLabel={previousLabel}\n            isDisabled={previousButtonDisabled}\n            onClick={handlePreviousButton}\n            size=\"small\"\n            startIcon={<ArrowLeftIcon />}\n            variant=\"floating\"\n          />\n          <Button\n            ariaLabel={nextLabel}\n            endIcon={<ArrowRightIcon />}\n            isDisabled={nextButtonDisabled}\n            onClick={handleNextButton}\n            size=\"small\"\n            variant=\"floating\"\n          />\n        </PaginationButtonContainer>\n      </PaginationSegment>\n    </PaginationContainer>\n  ) : (\n    <Button\n      isDisabled={loadMoreIsDisabled}\n      label={loadMoreLabel}\n      onClick={handleLoadMore}\n      variant=\"secondary\"\n    />\n  );\n};\n\nconst MemoizedPagination = memo(Pagination);\nMemoizedPagination.displayName = \"Pagination\";\n\nexport { MemoizedPagination as Pagination };\n"],"mappings":";AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,OAAOA,MAAM,MAAM,iBAAiB;AAEpC,SAASC,IAAI,EAAEC,WAAW,EAAEC,SAAS,EAAEC,OAAO,EAAEC,MAAM,EAAEC,QAAQ,QAAQ,OAAO;AAE/E,SAASC,GAAG,QAAQ,WAAW;AAC/B,SAASC,MAAM,QAAQ,qBAAqB;AAC5C,SAASC,cAAc,QAAQ,2BAA2B;AAC1D,SAASC,aAAa,EAAEC,cAAc,QAAQ,6BAA6B;AAC3E,SAEEC,sBAAsB,QACjB,kCAAkC;AACzC,SAASC,SAAS,QAAQ,kBAAkB;AAE5C,SAASC,aAAa,QAAQ,oBAAoB;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAEnD,MAAMC,mBAAmB,GAAGnB,MAAM,CAAC,KAAK,CAAC,CAAC;EACxCoB,OAAO,EAAE,MAAM;EACfC,cAAc,EAAE;AAClB,CAAC,CAAC;AAEF,MAAMC,iBAAiB,GAAGtB,MAAM,CAAC,KAAK,EAAE;EACtCuB,iBAAiB,EAAGC,IAAI,IAAKA,IAAI,KAAK;AACxC,CAAC,CAAC,CAAwC,CAAC;EAAEC;AAAoB,CAAC,MAAM;EACtEL,OAAO,EAAE,MAAM;EACfM,UAAU,EAAE,QAAQ;EACpBC,GAAG,EAAEF,mBAAmB,CAACG,QAAQ;EACjC,SAAS,EAAE;IACTR,OAAO,EAAE,MAAM;IACfM,UAAU,EAAE,QAAQ;IACpBC,GAAG,EAAEF,mBAAmB,CAACI;EAC3B;AACF,CAAC,CAAC,CAAC;AAEH,MAAMC,eAAe,GAAG9B,MAAM,CAAA+B,UAAA,EAAY;EACxCR,iBAAiB,EAAGC,IAAI,IAAKA,IAAI,KAAK;AACxC,CAAC,CAAC,CAAwC,CAAC;EAAEC;AAAoB,CAAC,MAAM;EACtEO,WAAW,EAAEP,mBAAmB,CAACQ,aAAa;EAC9CC,YAAY,EAAET,mBAAmB,CAACU,iBAAiB;EACnDC,MAAM,EAAEX,mBAAmB,CAACY,QAAQ;EACpCC,KAAK,EAAE,iBAAiB;EACxB,SAAS,EAAE;IACTN,WAAW,EAAEP,mBAAmB,CAACc;EACnC,CAAC;EACD,qBAAqB,EAAE;IACrBP,WAAW,EAAEP,mBAAmB,CAACe;EACnC;AACF,CAAC,CAAC,CAAC;AAEH,MAAMC,yBAAyB,GAAGzC,MAAM,CAAC,KAAK,CAAC,CAAC;EAC9C,OAAO,EAAE;IACP0C,iBAAiB,EAAE;EACrB;AACF,CAAC,CAAC;AA0FF,MAAMC,UAAU,GAAGA,CAAC;EAClBC,gBAAgB,EAAEC,oBAAoB;EACtCC,gBAAgB;EAChBC,YAAY,GAAG,IAAI;EACnBC,gBAAgB,GAAG,IAAI;EACvBC,gBAAgB,GAAG,IAAI;EACvBC,UAAU;EACVC,cAAc;EACdC,OAAO;EACPC,aAAa,EAAEC,iBAAiB;EAChCC,YAAY;EACZC,WAAW;EACXC,SAAS,EAAEC,aAAa;EACxBC,kBAAkB,EAAEC,sBAAsB;EAC1CC,SAAS;EACTC,QAAQ;EACRC,aAAa,EAAEC,iBAAiB;EAChCC,gBAAgB,EAAEC,oBAAoB;EACtCC,SAAS;EACTC;AACe,CAAC,KAAK;EACrB,MAAM3C,mBAAmB,GAAGb,sBAAsB,CAAC,CAAC;EACpD,MAAM;IAAEyD;EAAE,CAAC,GAAG5D,cAAc,CAAC,CAAC;EAE9B,MAAM,CAAC6D,IAAI,EAAEC,OAAO,CAAC,GAAGjE,QAAQ,CAASuD,SAAS,CAAC;EACnD,MAAM,CAACW,WAAW,EAAEC,cAAc,CAAC,GAAGnE,QAAQ,CAASwD,QAAQ,CAAC;EAChE,MAAMY,kBAAkB,GAAGrE,MAAM,CAASyD,QAAQ,CAAC;EAEnD,MAAMlB,gBAAgB,GAAGC,oBAAoB,IAAIwB,CAAC,CAAC,iBAAiB,CAAC;EACrE,MAAMhB,aAAa,GAAGC,iBAAiB,IAAIe,CAAC,CAAC,qBAAqB,CAAC;EACnE,MAAMZ,SAAS,GAAGC,aAAa,IAAIW,CAAC,CAAC,iBAAiB,CAAC;EACvD,MAAMN,aAAa,GAAGC,iBAAiB,IAAIK,CAAC,CAAC,qBAAqB,CAAC;EACnE,MAAMJ,gBAAgB,GAAGC,oBAAoB,IAAIG,CAAC,CAAC,wBAAwB,CAAC;EAE5ElE,SAAS,CAAC,MAAM;IACdoE,OAAO,CAACV,SAAS,CAAC;IAClBY,cAAc,CAACX,QAAQ,CAAC;EAC1B,CAAC,EAAE,CAACD,SAAS,EAAEC,QAAQ,CAAC,CAAC;EAEzB,MAAMH,kBAAkB,GAAGzD,WAAW,CACpC,CAAC;IAAE2D,SAAS;IAAEC;EAAkD,CAAC,KAAK;IACpEF,sBAAsB,CAAC;MAAEC,SAAS;MAAEC;IAAS,CAAC,CAAC;EACjD,CAAC,EACD,CAACF,sBAAsB,CACzB,CAAC;EAED,MAAM;IAAEe;EAAe,CAAC,GAAG7D,aAAa,CAAC;IACvC+C,SAAS;IACTC,QAAQ;IACRhB,gBAAgB,EAAEA,gBAAgB,IAAI,CAAC;IACvCqB;EACF,CAAC,CAAC;EAEF,MAAMS,sBAAsB,GAAG1E,WAAW,CAAC,MAAM;IAC/C,IAAI2E,WAAW,GAAGP,IAAI;IACtB,IAAIQ,kBAAkB,GAAGN,WAAW;IAEpC,IAAIL,SAAS,EAAE;MACb,MAAMZ,YAAY,GAAGwB,IAAI,CAACC,IAAI,CAACb,SAAS,GAAGW,kBAAkB,CAAC;MAG9D,IAAIA,kBAAkB,GAAGX,SAAS,EAAE;QAClCW,kBAAkB,GAAGX,SAAS;MAChC;MAGA,IAAIU,WAAW,GAAGtB,YAAY,EAAE;QAC9BsB,WAAW,GAAGtB,YAAY;MAC5B,CAAC,MAAM,IAAIsB,WAAW,GAAG,CAAC,EAAE;QAC1BA,WAAW,GAAG,CAAC;MACjB;IACF;IAEAlB,kBAAkB,CAAC;MACjBE,SAAS,EAAEgB,WAAW;MACtBf,QAAQ,EAAEgB;IACZ,CAAC,CAAC;EACJ,CAAC,EAAE,CAACR,IAAI,EAAEE,WAAW,EAAEb,kBAAkB,EAAEQ,SAAS,CAAC,CAAC;EAKtD,MAAMc,gBAAgB,GAAG/E,WAAW,CACjCgF,KAAkE,IAAK;IACtE,IAAIA,KAAK,CAACC,GAAG,KAAK,OAAO,EAAE;MACzBxB,kBAAkB,CAAC;QACjBE,SAAS,EAAEuB,MAAM,CAACF,KAAK,CAACG,aAAa,CAACC,KAAK,CAAC;QAC5CxB,QAAQ,EAAEU;MACZ,CAAC,CAAC;IACJ;EACF,CAAC,EACD,CAACA,WAAW,EAAEb,kBAAkB,CAClC,CAAC;EAED,MAAM4B,uBAAuB,GAAGrF,WAAW,CACxCgF,KAAkE,IAAK;IACtE,IAAIA,KAAK,CAACC,GAAG,KAAK,OAAO,EAAE;MACzBxB,kBAAkB,CAAC;QACjBE,SAAS,EAAES,IAAI;QACfR,QAAQ,EAAEsB,MAAM,CAACF,KAAK,CAACG,aAAa,CAACC,KAAK;MAC5C,CAAC,CAAC;IACJ;EACF,CAAC,EACD,CAAChB,IAAI,EAAEX,kBAAkB,CAC3B,CAAC;EAED,MAAM6B,gBAAgB,GAAGtF,WAAW,CACjCgF,KAA0C,IAAK;IAC9C,MAAMI,KAAK,GAAG/B,YAAY,GACtBwB,IAAI,CAACU,GAAG,CAACL,MAAM,CAACF,KAAK,CAACQ,MAAM,CAACJ,KAAK,CAAC,EAAE/B,YAAY,CAAC,GAClD6B,MAAM,CAACF,KAAK,CAACQ,MAAM,CAACJ,KAAK,CAAC;IAG9Bf,OAAO,CAACQ,IAAI,CAACY,GAAG,CAAC,CAAC,EAAEL,KAAK,CAAC,CAAC;EAC7B,CAAC,EACD,CAACf,OAAO,EAAEhB,YAAY,CACxB,CAAC;EAED,MAAMqC,uBAAuB,GAAG1F,WAAW,CACxCgF,KAA0C,IAAK;IAC9C,MAAMI,KAAK,GAAG9B,WAAW,GACrBuB,IAAI,CAACU,GAAG,CAACL,MAAM,CAACF,KAAK,CAACQ,MAAM,CAACJ,KAAK,CAAC,EAAE9B,WAAW,CAAC,GACjD4B,MAAM,CAACF,KAAK,CAACQ,MAAM,CAACJ,KAAK,CAAC;IAG9Bb,cAAc,CAACM,IAAI,CAACY,GAAG,CAAC,CAAC,EAAEL,KAAK,CAAC,CAAC;EACpC,CAAC,EACD,CAACb,cAAc,EAAEjB,WAAW,CAC9B,CAAC;EAED,MAAMqC,cAAc,GAAG3F,WAAW,CAAC,MAAM;IACvCyD,kBAAkB,CAAC;MACjBE,SAAS,EAAE,CAAC;MACZC,QAAQ,EAAEU,WAAW,GAAGE,kBAAkB,CAACoB;IAC7C,CAAC,CAAC;EACJ,CAAC,EAAE,CAACtB,WAAW,EAAEb,kBAAkB,CAAC,CAAC;EAErC,MAAMoC,gBAAgB,GAAG7F,WAAW,CAAC,MAAM;IACzCyD,kBAAkB,CAAC;MAAEE,SAAS,EAAES,IAAI,GAAG,CAAC;MAAER,QAAQ,EAAEU;IAAY,CAAC,CAAC;EACpE,CAAC,EAAE,CAACb,kBAAkB,EAAEW,IAAI,EAAEE,WAAW,CAAC,CAAC;EAE3C,MAAMwB,oBAAoB,GAAG9F,WAAW,CAAC,MAAM;IAC7CyD,kBAAkB,CAAC;MAAEE,SAAS,EAAES,IAAI,GAAG,CAAC;MAAER,QAAQ,EAAEU;IAAY,CAAC,CAAC;EACpE,CAAC,EAAE,CAACb,kBAAkB,EAAEW,IAAI,EAAEE,WAAW,CAAC,CAAC;EAE3C,MAAMyB,kBAAkB,GAAG7F,OAAO,CAAC,MAAM;IACvC,OAAO+C,cAAc,KAAKgB,SAAS,GAAGK,WAAW,IAAIL,SAAS,GAAG,KAAK,CAAC;EACzE,CAAC,EAAE,CAAChB,cAAc,EAAEqB,WAAW,EAAEL,SAAS,CAAC,CAAC;EAE5C,MAAM+B,kBAAkB,GAAG9F,OAAO,CAChC,MACE+C,cAAc,IACbC,OAAO,KAAKe,SAAS,GAAGf,OAAO,IAAIe,SAAS,GAAG,KAAK,CAAE,IACvDjB,UAAU,EACZ,CAACC,cAAc,EAAEgB,SAAS,EAAEf,OAAO,EAAEF,UAAU,CACjD,CAAC;EAED,MAAMiD,sBAAsB,GAAG/F,OAAO,CACpC,MAAMyD,SAAS,IAAI,CAAC,IAAIX,UAAU,EAClC,CAACW,SAAS,EAAEX,UAAU,CACxB,CAAC;EAED,MAAMkD,qBAAqB,GAAGhG,OAAO,CACnC,OAAO;IACL,YAAY,EAAE6D,gBAAgB;IAC9B0B,GAAG,EAAEnC,WAAW,IAAIW;EACtB,CAAC,CAAC,EACF,CAACX,WAAW,EAAES,gBAAgB,EAAEE,SAAS,CAC3C,CAAC;EAED,MAAMkC,qBAAqB,GAAGjG,OAAO,CACnC,OAAO;IACL,YAAY,EAAEwC,gBAAgB;IAC9B+C,GAAG,EAAEpC;EACP,CAAC,CAAC,EACF,CAACX,gBAAgB,EAAEW,YAAY,CACjC,CAAC;EAED,OAAOa,OAAO,KAAK,OAAO,GACxBlD,KAAA,CAACC,mBAAmB;IAAC,cAAYkD,CAAC,CAAC,kBAAkB,CAAE;IAAAiC,QAAA,GACrDpF,KAAA,CAACI,iBAAiB;MAACG,mBAAmB,EAAEA,mBAAoB;MAAA6E,QAAA,GACzDtD,gBAAgB,IACf9B,KAAA,CAACX,GAAG;QAAA+F,QAAA,GACFtF,IAAA,CAACH,SAAS;UAAC0F,KAAK,EAAC,eAAe;UAACC,SAAS,EAAC,MAAM;UAAAF,QAAA,EAC9CrC;QAAgB,CACR,CAAC,EACZjD,IAAA,CAACc,eAAe;UACd2E,QAAQ,EAAEvD,UAAW;UACrBwD,UAAU,EAAEN,qBAAsB;UAClC3E,mBAAmB,EAAEA,mBAAoB;UACzCkF,MAAM,EAAE/B,sBAAuB;UAC/BgC,QAAQ,EAAEhB,uBAAwB;UAClCiB,SAAS,EAAEtB,uBAAwB;UACnCuB,IAAI,EAAC,QAAQ;UACbxB,KAAK,EAAEd;QAAY,CACpB,CAAC;MAAA,CACC,CACN,EACAvB,gBAAgB,IACfjC,IAAA,CAACH,SAAS;QAAC0F,KAAK,EAAC,eAAe;QAACC,SAAS,EAAC,MAAM;QAAAF,QAAA,EAC9C3B;MAAc,CACN,CACZ;IAAA,CACgB,CAAC,EAEpBzD,KAAA,CAACI,iBAAiB;MAACG,mBAAmB,EAAEA,mBAAoB;MAAA6E,QAAA,GACzDnC,SAAS,IAAIpB,YAAY,IACxB7B,KAAA,CAACX,GAAG;QAAA+F,QAAA,GACFtF,IAAA,CAACH,SAAS;UAAC0F,KAAK,EAAC,eAAe;UAACC,SAAS,EAAC,MAAM;UAAAF,QAAA,EAC9C1D;QAAgB,CACR,CAAC,EACZ5B,IAAA,CAACc,eAAe;UACd2E,QAAQ,EAAEvD,UAAW;UACrBwD,UAAU,EAAEL,qBAAsB;UAClC5E,mBAAmB,EAAEA,mBAAoB;UACzCkF,MAAM,EAAE/B,sBAAuB;UAC/BgC,QAAQ,EAAEpB,gBAAiB;UAC3BqB,SAAS,EAAE5B,gBAAiB;UAC5B6B,IAAI,EAAC,QAAQ;UACbxB,KAAK,EAAEhB;QAAK,CACb,CAAC;MAAA,CACC,CACN,EACDpD,KAAA,CAACuB,yBAAyB;QAAA6D,QAAA,GACxBtF,IAAA,CAACR,MAAM;UACLuG,SAAS,EAAEhD,aAAc;UACzBb,UAAU,EAAEiD,sBAAuB;UACnCa,OAAO,EAAEhB,oBAAqB;UAC9BiB,IAAI,EAAC,OAAO;UACZC,SAAS,EAAElG,IAAA,CAACN,aAAa,IAAE,CAAE;UAC7B0D,OAAO,EAAC;QAAU,CACnB,CAAC,EACFpD,IAAA,CAACR,MAAM;UACLuG,SAAS,EAAEtD,SAAU;UACrB0D,OAAO,EAAEnG,IAAA,CAACL,cAAc,IAAE,CAAE;UAC5BuC,UAAU,EAAEgD,kBAAmB;UAC/Bc,OAAO,EAAEjB,gBAAiB;UAC1BkB,IAAI,EAAC,OAAO;UACZ7C,OAAO,EAAC;QAAU,CACnB,CAAC;MAAA,CACuB,CAAC;IAAA,CACX,CAAC;EAAA,CACD,CAAC,GAEtBpD,IAAA,CAACR,MAAM;IACL0C,UAAU,EAAE+C,kBAAmB;IAC/BmB,KAAK,EAAE/D,aAAc;IACrB2D,OAAO,EAAEnB,cAAe;IACxBzB,OAAO,EAAC;EAAW,CACpB,CACF;AACH,CAAC;AAED,MAAMiD,kBAAkB,GAAGpH,IAAI,CAAC0C,UAAU,CAAC;AAC3C0E,kBAAkB,CAACC,WAAW,GAAG,YAAY;AAE7C,SAASD,kBAAkB,IAAI1E,UAAU","ignoreList":[]}

package/dist/esm/Pagination/usePagination.js

@@ -11,7 +11,7 @@
  */
 
 import { useMemo } from "react";
-import { useTranslation } from "react-i18next";
+import { useTranslation } from "../i18n.generated/i18n.js";
 export const usePagination = ({
   currentRowsCount,
   pageIndex,

package/dist/esm/Pagination/usePagination.js.map

@@ -1 +1 @@
-{"version":3,"file":"usePagination.js","names":["useMemo","useTranslation","usePagination","currentRowsCount","pageIndex","pageSize","totalRows","t","firstRow","lastRow","totalRowsLabel"],"sources":["../../../src/Pagination/usePagination.ts"],"sourcesContent":["/*!\n * Copyright (c) 2023-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport { useMemo } from \"react\";\nimport { useTranslation } from \"react-i18next\";\n\ntype UsePaginationType = {\n  currentRowsCount: number;\n  pageIndex: number;\n  pageSize: number;\n  totalRows?: number;\n};\n\nexport const usePagination = ({\n  currentRowsCount,\n  pageIndex,\n  pageSize,\n  totalRows,\n}: UsePaginationType) => {\n  const { t } = useTranslation();\n\n  return useMemo(() => {\n    const firstRow = pageSize * (pageIndex - 1) + 1;\n    const lastRow = firstRow + (currentRowsCount - 1);\n\n    const totalRowsLabel =\n      currentRowsCount === 0\n        ? t(\"pagination.totalrows\", { totalRows: 0 })\n        : totalRows\n          ? t(\"pagination.rowswithtotal\", { firstRow, lastRow, totalRows })\n          : t(\"pagination.rowswithouttotal\", { firstRow, lastRow });\n\n    return {\n      firstRow,\n      lastRow,\n      totalRowsLabel,\n    };\n  }, [currentRowsCount, pageIndex, pageSize, totalRows, t]);\n};\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SAASA,OAAO,QAAQ,OAAO;AAC/B,SAASC,cAAc,QAAQ,eAAe;AAS9C,OAAO,MAAMC,aAAa,GAAGA,CAAC;EAC5BC,gBAAgB;EAChBC,SAAS;EACTC,QAAQ;EACRC;AACiB,CAAC,KAAK;EACvB,MAAM;IAAEC;EAAE,CAAC,GAAGN,cAAc,CAAC,CAAC;EAE9B,OAAOD,OAAO,CAAC,MAAM;IACnB,MAAMQ,QAAQ,GAAGH,QAAQ,IAAID,SAAS,GAAG,CAAC,CAAC,GAAG,CAAC;IAC/C,MAAMK,OAAO,GAAGD,QAAQ,IAAIL,gBAAgB,GAAG,CAAC,CAAC;IAEjD,MAAMO,cAAc,GAClBP,gBAAgB,KAAK,CAAC,GAClBI,CAAC,CAAC,sBAAsB,EAAE;MAAED,SAAS,EAAE;IAAE,CAAC,CAAC,GAC3CA,SAAS,GACPC,CAAC,CAAC,0BAA0B,EAAE;MAAEC,QAAQ;MAAEC,OAAO;MAAEH;IAAU,CAAC,CAAC,GAC/DC,CAAC,CAAC,6BAA6B,EAAE;MAAEC,QAAQ;MAAEC;IAAQ,CAAC,CAAC;IAE/D,OAAO;MACLD,QAAQ;MACRC,OAAO;MACPC;IACF,CAAC;EACH,CAAC,EAAE,CAACP,gBAAgB,EAAEC,SAAS,EAAEC,QAAQ,EAAEC,SAAS,EAAEC,CAAC,CAAC,CAAC;AAC3D,CAAC","ignoreList":[]}
+{"version":3,"file":"usePagination.js","names":["useMemo","useTranslation","usePagination","currentRowsCount","pageIndex","pageSize","totalRows","t","firstRow","lastRow","totalRowsLabel"],"sources":["../../../src/Pagination/usePagination.ts"],"sourcesContent":["/*!\n * Copyright (c) 2023-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport { useMemo } from \"react\";\n\nimport { useTranslation } from \"../i18n.generated/i18n.js\";\n\ntype UsePaginationType = {\n  currentRowsCount: number;\n  pageIndex: number;\n  pageSize: number;\n  totalRows?: number;\n};\n\nexport const usePagination = ({\n  currentRowsCount,\n  pageIndex,\n  pageSize,\n  totalRows,\n}: UsePaginationType) => {\n  const { t } = useTranslation();\n\n  return useMemo(() => {\n    const firstRow = pageSize * (pageIndex - 1) + 1;\n    const lastRow = firstRow + (currentRowsCount - 1);\n\n    const totalRowsLabel =\n      currentRowsCount === 0\n        ? t(\"pagination.totalrows\", { totalRows: 0 })\n        : totalRows\n          ? t(\"pagination.rowswithtotal\", { firstRow, lastRow, totalRows })\n          : t(\"pagination.rowswithouttotal\", { firstRow, lastRow });\n\n    return {\n      firstRow,\n      lastRow,\n      totalRowsLabel,\n    };\n  }, [currentRowsCount, pageIndex, pageSize, totalRows, t]);\n};\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SAASA,OAAO,QAAQ,OAAO;AAE/B,SAASC,cAAc,QAAQ,2BAA2B;AAS1D,OAAO,MAAMC,aAAa,GAAGA,CAAC;EAC5BC,gBAAgB;EAChBC,SAAS;EACTC,QAAQ;EACRC;AACiB,CAAC,KAAK;EACvB,MAAM;IAAEC;EAAE,CAAC,GAAGN,cAAc,CAAC,CAAC;EAE9B,OAAOD,OAAO,CAAC,MAAM;IACnB,MAAMQ,QAAQ,GAAGH,QAAQ,IAAID,SAAS,GAAG,CAAC,CAAC,GAAG,CAAC;IAC/C,MAAMK,OAAO,GAAGD,QAAQ,IAAIL,gBAAgB,GAAG,CAAC,CAAC;IAEjD,MAAMO,cAAc,GAClBP,gBAAgB,KAAK,CAAC,GAClBI,CAAC,CAAC,sBAAsB,EAAE;MAAED,SAAS,EAAE;IAAE,CAAC,CAAC,GAC3CA,SAAS,GACPC,CAAC,CAAC,0BAA0B,EAAE;MAAEC,QAAQ;MAAEC,OAAO;MAAEH;IAAU,CAAC,CAAC,GAC/DC,CAAC,CAAC,6BAA6B,EAAE;MAAEC,QAAQ;MAAEC;IAAQ,CAAC,CAAC;IAE/D,OAAO;MACLD,QAAQ;MACRC,OAAO;MACPC;IACF,CAAC;EACH,CAAC,EAAE,CAACP,gBAAgB,EAAEC,SAAS,EAAEC,QAAQ,EAAEC,SAAS,EAAEC,CAAC,CAAC,CAAC;AAC3D,CAAC","ignoreList":[]}

package/dist/esm/PasswordField.js

@@ -13,8 +13,8 @@ import _IconButton from "@mui/material/IconButton";
  * See the License for the specific language governing permissions and limitations under the License.
  */
 import { forwardRef, memo, useCallback, useImperativeHandle, useRef, useState } from "react";
-import { useTranslation } from "react-i18next";
 import { Field } from "./Field.js";
+import { useTranslation } from "./i18n.generated/i18n.js";
 import { HideIcon, ShowIcon } from "./icons.generated/index.js";
 import { getControlState, useInputValues } from "./inputUtils.js";
 import { jsx as _jsx } from "react/jsx-runtime";