@okta/odyssey-react-mui 1.29.0 → 1.32.0

package/dist/esm/useContrastMode.js

@@ -0,0 +1,87 @@
+/*!
+ * Copyright (c) 2023-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, useContext, useRef, useLayoutEffect, useState, useCallback } from "react";
+import * as Tokens from "@okta/odyssey-design-tokens";
+import { hexToRgb } from "./hexToRgb.js";
+export const ContrastModeContext = createContext({
+  contrastMode: "lowContrast"
+});
+export const defaultContrast = "lowContrast";
+export const useContrastModeContext = () => useContext(ContrastModeContext);
+export const hueNeutral50Rgb = hexToRgb(Tokens.HueNeutral50).asFormattedString;
+export const isTransparentColor = color => color === "rgba(0, 0, 0, 0)" || color === "transparent";
+export const normalizeRgbaToRgb = rgba => rgba.replace(/rgba\((\d+),\s*(\d+),\s*(\d+),\s*[\d.]+\)/, "rgb($1, $2, $3)");
+export const getElementComputedBackgroundColor = element => window.getComputedStyle(element).backgroundColor;
+export const normalizeBackgroundColor = bgColor => {
+  if (/rgba\((\d+),\s*(\d+),\s*(\d+),\s*[\d.]+\)/.test(bgColor)) {
+    const normalizedColor = normalizeRgbaToRgb(bgColor);
+    return normalizedColor === hueNeutral50Rgb ? Tokens.HueNeutral50 : normalizedColor;
+  }
+  return bgColor === hueNeutral50Rgb ? Tokens.HueNeutral50 : bgColor;
+};
+export const defaultParentBackgroundColor = "#ffffff";
+export const getBackgroundColor = element => {
+  while (element) {
+    const bgColor = getElementComputedBackgroundColor(element);
+    if (!isTransparentColor(bgColor)) {
+      return normalizeBackgroundColor(bgColor);
+    }
+    element = element.parentElement;
+  }
+  return defaultParentBackgroundColor;
+};
+export const useContrastMode = ({
+  contrastMode: explicitContrastMode
+}) => {
+  const contrastContainerRef = useRef(null);
+  const {
+    contrastMode: existingContrastMode
+  } = useContrastModeContext();
+  const [parentBackgroundColor, setParentBackgroundColor] = useState(defaultParentBackgroundColor);
+  const [contrastMode, setContrastMode] = useState(() => explicitContrastMode || existingContrastMode);
+  const updateBackgroundColor = useCallback(() => {
+    const newBgColor = getBackgroundColor(contrastContainerRef.current);
+    setParentBackgroundColor(newBgColor);
+    if (!explicitContrastMode) {
+      setContrastMode(newBgColor === Tokens.HueNeutral50 ? "highContrast" : "lowContrast");
+    }
+  }, [explicitContrastMode]);
+  useLayoutEffect(() => {
+    const observer = new MutationObserver(updateBackgroundColor);
+    observer.observe(document.querySelector("html"), {
+      attributes: true,
+      attributeFilter: ["class", "style"]
+    });
+    observer.observe(document.head, {
+      childList: true,
+      subtree: true
+    });
+    const onTransitionEnd = event => {
+      if (event.propertyName === "background-color") {
+        updateBackgroundColor();
+      }
+    };
+    document.addEventListener("transitionend", onTransitionEnd);
+    updateBackgroundColor();
+    return () => {
+      document.removeEventListener("transitionend", onTransitionEnd);
+      observer.disconnect();
+    };
+  }, [updateBackgroundColor]);
+  return {
+    contrastContainerRef,
+    contrastMode,
+    parentBackgroundColor
+  };
+};
+//# sourceMappingURL=useContrastMode.js.map

package/dist/esm/useContrastMode.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useContrastMode.js","names":["createContext","useContext","useRef","useLayoutEffect","useState","useCallback","Tokens","hexToRgb","ContrastModeContext","contrastMode","defaultContrast","useContrastModeContext","hueNeutral50Rgb","HueNeutral50","asFormattedString","isTransparentColor","color","normalizeRgbaToRgb","rgba","replace","getElementComputedBackgroundColor","element","window","getComputedStyle","backgroundColor","normalizeBackgroundColor","bgColor","test","normalizedColor","defaultParentBackgroundColor","getBackgroundColor","parentElement","useContrastMode","explicitContrastMode","contrastContainerRef","existingContrastMode","parentBackgroundColor","setParentBackgroundColor","setContrastMode","updateBackgroundColor","newBgColor","current","observer","MutationObserver","observe","document","querySelector","attributes","attributeFilter","head","childList","subtree","onTransitionEnd","event","propertyName","addEventListener","removeEventListener","disconnect"],"sources":["../../src/useContrastMode.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 {\n  createContext,\n  useContext,\n  useRef,\n  useLayoutEffect,\n  useState,\n  useCallback,\n} from \"react\";\nimport * as Tokens from \"@okta/odyssey-design-tokens\";\n\nimport { hexToRgb } from \"./hexToRgb.js\";\n\nexport type ContrastMode = \"lowContrast\" | \"highContrast\";\nexport type ContrastModeContextType = {\n  contrastMode: ContrastMode;\n};\n\nexport const ContrastModeContext = createContext<ContrastModeContextType>({\n  contrastMode: \"lowContrast\",\n});\n\nexport const defaultContrast = \"lowContrast\";\n\nexport const useContrastModeContext = () => useContext(ContrastModeContext);\n\nexport const hueNeutral50Rgb = hexToRgb(Tokens.HueNeutral50).asFormattedString;\n\nexport const isTransparentColor = (color: string) =>\n  color === \"rgba(0, 0, 0, 0)\" || color === \"transparent\";\n\nexport const normalizeRgbaToRgb = (rgba: string) =>\n  rgba.replace(/rgba\\((\\d+),\\s*(\\d+),\\s*(\\d+),\\s*[\\d.]+\\)/, \"rgb($1, $2, $3)\");\n\nexport const getElementComputedBackgroundColor = (\n  element: HTMLElement,\n): string => window.getComputedStyle(element).backgroundColor;\n\nexport const normalizeBackgroundColor = (bgColor: string): string => {\n  if (/rgba\\((\\d+),\\s*(\\d+),\\s*(\\d+),\\s*[\\d.]+\\)/.test(bgColor)) {\n    const normalizedColor = normalizeRgbaToRgb(bgColor);\n    return normalizedColor === hueNeutral50Rgb\n      ? Tokens.HueNeutral50\n      : normalizedColor;\n  }\n\n  return bgColor === hueNeutral50Rgb ? Tokens.HueNeutral50 : bgColor;\n};\n\nexport const defaultParentBackgroundColor = \"#ffffff\";\n\n/**\n * Determines the effective background color of an element.\n *\n * @param element - The HTML element to check.\n * @returns The effective background color. Returns  defaultParentBackgroundColor if no non-transparent background is found.\n *\n * Note:\n * - Low contrast mode is used for white background (defaultParentBackgroundColor or HueNeutralWhite).\n * - High contrast mode is used for gray background (#f4f4f4 or HueNeutral50).\n */\nexport const getBackgroundColor = (element: HTMLElement | null): string => {\n  while (element) {\n    const bgColor = getElementComputedBackgroundColor(element);\n    if (!isTransparentColor(bgColor)) {\n      return normalizeBackgroundColor(bgColor);\n    }\n    element = element.parentElement;\n  }\n  return defaultParentBackgroundColor; // Default to white/low contrast if no background color is found\n};\n\ntype UseContrastModeProps = {\n  contrastMode?: ContrastMode;\n};\n\nexport const useContrastMode = ({\n  contrastMode: explicitContrastMode,\n}: UseContrastModeProps) => {\n  const contrastContainerRef = useRef<HTMLDivElement>(null);\n  const { contrastMode: existingContrastMode } = useContrastModeContext();\n\n  const [parentBackgroundColor, setParentBackgroundColor] = useState(\n    defaultParentBackgroundColor,\n  );\n  const [contrastMode, setContrastMode] = useState<ContrastMode>(\n    () => explicitContrastMode || existingContrastMode,\n  );\n\n  const updateBackgroundColor = useCallback(() => {\n    const newBgColor = getBackgroundColor(contrastContainerRef.current);\n    setParentBackgroundColor(newBgColor);\n\n    if (!explicitContrastMode) {\n      setContrastMode(\n        newBgColor === Tokens.HueNeutral50 ? \"highContrast\" : \"lowContrast\",\n      );\n    }\n  }, [explicitContrastMode]);\n\n  useLayoutEffect(() => {\n    const observer = new MutationObserver(updateBackgroundColor);\n    observer.observe(document.querySelector(\"html\") as HTMLHtmlElement, {\n      attributes: true,\n      attributeFilter: [\"class\", \"style\"],\n    });\n    observer.observe(document.head, {\n      childList: true,\n      subtree: true,\n    });\n\n    const onTransitionEnd = (event: TransitionEvent) => {\n      if (event.propertyName === \"background-color\") {\n        updateBackgroundColor();\n      }\n    };\n\n    document.addEventListener(\"transitionend\", onTransitionEnd);\n    updateBackgroundColor();\n\n    return () => {\n      document.removeEventListener(\"transitionend\", onTransitionEnd);\n      observer.disconnect();\n    };\n  }, [updateBackgroundColor]);\n\n  return {\n    contrastContainerRef,\n    contrastMode,\n    parentBackgroundColor,\n  };\n};\n"],"mappings":"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","ignoreList":[]}

package/dist/esm/useNormalizedKey.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useNormalizedKey.js","names":["normalizedKey","keyParts","SEPARATOR","join","replace","toLowerCase"],"sources":["../../src/useNormalizedKey.ts"],"sourcesContent":["/*!\n * Copyright (c) 2024-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\nexport const normalizedKey = (...keyParts: string[]): string => {\n  const SEPARATOR = \"-\";\n  // Joins all strings together with SEPARATOR, replaces any non-alphanumeric character with SEPARATOR and casts all to lowercase\n  return keyParts.join(SEPARATOR).replace(/\\W+/g, SEPARATOR).toLowerCase();\n};\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,OAAO,MAAMA,aAAa,GAAGA,CAAC,GAAGC,QAAkB,KAAa;EAC9D,MAAMC,SAAS,GAAG,GAAG;EAErB,OAAOD,QAAQ,CAACE,IAAI,CAACD,SAAS,CAAC,CAACE,OAAO,CAAC,MAAM,EAAEF,SAAS,CAAC,CAACG,WAAW,CAAC,CAAC;AAC1E,CAAC","ignoreList":[]}

package/dist/esm/useUniqueAlphabeticalId.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useUniqueAlphabeticalId.js","names":["useMemo","createUniqueAlphabeticalId","useUniqueAlphabeticalId","id","uniqueAlphabeticalId"],"sources":["../../src/useUniqueAlphabeticalId.ts"],"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 { useMemo } from \"react\";\n\nimport { createUniqueAlphabeticalId } from \"./createUniqueAlphabeticalId.js\";\n\nexport const useUniqueAlphabeticalId = (id?: string) => {\n  const uniqueAlphabeticalId = useMemo(() => createUniqueAlphabeticalId(), []);\n\n  return id ?? uniqueAlphabeticalId;\n};\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SAASA,OAAO,QAAQ,OAAO;AAE/B,SAASC,0BAA0B,QAAQ,iCAAiC;AAE5E,OAAO,MAAMC,uBAAuB,GAAIC,EAAW,IAAK;EACtD,MAAMC,oBAAoB,GAAGJ,OAAO,CAAC,MAAMC,0BAA0B,CAAC,CAAC,EAAE,EAAE,CAAC;EAE5E,OAAOE,EAAE,IAAIC,oBAAoB;AACnC,CAAC","ignoreList":[]}

package/dist/esm/useUniqueId.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useUniqueId.js","names":["useMemo","createUniqueId","useUniqueId","id","uniqueId"],"sources":["../../src/useUniqueId.ts"],"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 { useMemo } from \"react\";\n\nimport { createUniqueId } from \"./createUniqueId.js\";\n\nexport const useUniqueId = (id?: string) => {\n  const uniqueId = useMemo(() => createUniqueId(), []);\n\n  return id ?? uniqueId;\n};\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SAASA,OAAO,QAAQ,OAAO;AAE/B,SAASC,cAAc,QAAQ,qBAAqB;AAEpD,OAAO,MAAMC,WAAW,GAAIC,EAAW,IAAK;EAC1C,MAAMC,QAAQ,GAAGJ,OAAO,CAAC,MAAMC,cAAc,CAAC,CAAC,EAAE,EAAE,CAAC;EAEpD,OAAOE,EAAE,IAAIC,QAAQ;AACvB,CAAC","ignoreList":[]}

package/dist/esm/web-component/createReactRootElements.js

@@ -0,0 +1,25 @@
+/*!
+ * 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.
+ */
+
+export const createReactRootElements = () => {
+  const appRootElement = document.createElement("div");
+  const stylesRootElement = document.createElement("div");
+  appRootElement.style.setProperty("height", "inherit");
+  appRootElement.setAttribute("id", "app-root");
+  stylesRootElement.setAttribute("id", "style-root");
+  stylesRootElement.setAttribute("nonce", window.cspNonce);
+  return {
+    appRootElement,
+    stylesRootElement
+  };
+};
+//# sourceMappingURL=createReactRootElements.js.map

package/dist/esm/web-component/createReactRootElements.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"createReactRootElements.js","names":["createReactRootElements","appRootElement","document","createElement","stylesRootElement","style","setProperty","setAttribute","window","cspNonce"],"sources":["../../../src/web-component/createReactRootElements.ts"],"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\nexport const createReactRootElements = () => {\n  const appRootElement = document.createElement(\"div\");\n  const stylesRootElement = document.createElement(\"div\");\n\n  // This `div` may cause layout issues unless it inherits the parent's height.\n  appRootElement.style.setProperty(\"height\", \"inherit\");\n\n  appRootElement.setAttribute(\"id\", \"app-root\");\n  stylesRootElement.setAttribute(\"id\", \"style-root\");\n  stylesRootElement.setAttribute(\"nonce\", window.cspNonce);\n\n  return {\n    /**\n     * The element your React root component renders into.\n     * React has to render or portal somewhere, and this element can be used for that root element.\n     *\n     * In the case of a web component, there is no defined root element, so you have to define it yourself.\n     */\n    appRootElement,\n    /**\n     * In React apps, your styles typically go in `document.head`, but you may want to render them somewhere else.\n     *\n     * Specifically when rendering in a web component, there is no `<head>`, so you have to create a spot for styles to render.\n     */\n    stylesRootElement,\n  };\n};\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,OAAO,MAAMA,uBAAuB,GAAGA,CAAA,KAAM;EAC3C,MAAMC,cAAc,GAAGC,QAAQ,CAACC,aAAa,CAAC,KAAK,CAAC;EACpD,MAAMC,iBAAiB,GAAGF,QAAQ,CAACC,aAAa,CAAC,KAAK,CAAC;EAGvDF,cAAc,CAACI,KAAK,CAACC,WAAW,CAAC,QAAQ,EAAE,SAAS,CAAC;EAErDL,cAAc,CAACM,YAAY,CAAC,IAAI,EAAE,UAAU,CAAC;EAC7CH,iBAAiB,CAACG,YAAY,CAAC,IAAI,EAAE,YAAY,CAAC;EAClDH,iBAAiB,CAACG,YAAY,CAAC,OAAO,EAAEC,MAAM,CAACC,QAAQ,CAAC;EAExD,OAAO;IAOLR,cAAc;IAMdG;EACF,CAAC;AACH,CAAC","ignoreList":[]}

package/dist/esm/web-component/index.js

@@ -0,0 +1,14 @@
+/*!
+ * 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.
+ */
+
+export * from "./renderReactInWebComponent.js";
+//# sourceMappingURL=index.js.map

package/dist/esm/web-component/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../../src/web-component/index.ts"],"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\nexport * from \"./renderReactInWebComponent.js\";\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,cAAc,gCAAgC","ignoreList":[]}

package/dist/esm/web-component/renderReactInWebComponent.js

@@ -0,0 +1,63 @@
+/*!
+ * Copyright (c) 2024-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 { createReactRootElements } from "./createReactRootElements.js";
+export const reactWebComponentElementName = "odyssey-react-web-component";
+const SsrFriendlyHtmlElementClass = "HTMLElement" in globalThis ? HTMLElement : class {};
+export class ReactInWebComponentElement extends SsrFriendlyHtmlElementClass {
+  constructor(getReactComponent) {
+    super();
+    this.getReactComponent = getReactComponent;
+    this.reactRootElements = createReactRootElements();
+    const styleElement = document.createElement("style");
+    const shadowRoot = this.attachShadow({
+      mode: "open"
+    });
+    styleElement.innerHTML = `
+      :host {
+        all: initial;
+        contain: content;
+      }
+    `;
+    styleElement.setAttribute("nonce", window.cspNonce);
+    this.reactRootElements.stylesRootElement.appendChild(styleElement);
+    shadowRoot.appendChild(this.reactRootElements.stylesRootElement);
+    shadowRoot.appendChild(this.reactRootElements.appRootElement);
+    this.reactRootPromise = import("react-dom/client").then(({
+      createRoot
+    }) => createRoot(this.reactRootElements.appRootElement));
+  }
+  connectedCallback() {
+    this.reactRootPromise.then(reactRoot => reactRoot.render(this.getReactComponent(this.reactRootElements)));
+  }
+  disconnectedCallback() {
+    this.reactRootPromise.then(reactRoot => reactRoot.unmount());
+  }
+}
+if ("customElements" in globalThis && !customElements.get(reactWebComponentElementName)) {
+  customElements.define(reactWebComponentElementName, ReactInWebComponentElement);
+}
+export const renderReactInWebComponent = ({
+  getReactComponent,
+  webComponentChildren,
+  webComponentRootElement
+}) => {
+  const reactElement = new ReactInWebComponentElement(getReactComponent);
+  if (webComponentChildren) {
+    (Array.isArray(webComponentChildren) ? webComponentChildren : [webComponentChildren]).forEach(webComponentChild => {
+      reactElement.appendChild(webComponentChild);
+    });
+  }
+  webComponentRootElement.appendChild(reactElement);
+  return reactElement;
+};
+//# sourceMappingURL=renderReactInWebComponent.js.map

package/dist/esm/web-component/renderReactInWebComponent.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"renderReactInWebComponent.js","names":["createReactRootElements","reactWebComponentElementName","SsrFriendlyHtmlElementClass","globalThis","HTMLElement","ReactInWebComponentElement","constructor","getReactComponent","reactRootElements","styleElement","document","createElement","shadowRoot","attachShadow","mode","innerHTML","setAttribute","window","cspNonce","stylesRootElement","appendChild","appRootElement","reactRootPromise","then","createRoot","connectedCallback","reactRoot","render","disconnectedCallback","unmount","customElements","get","define","renderReactInWebComponent","webComponentChildren","webComponentRootElement","reactElement","Array","isArray","forEach","webComponentChild"],"sources":["../../../src/web-component/renderReactInWebComponent.ts"],"sourcesContent":["/*!\n * Copyright (c) 2024-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 { type ReactNode } from \"react\";\nimport type { Root } from \"react-dom/client\";\n\nimport { createReactRootElements } from \"./createReactRootElements.js\";\n\nexport type ReactRootElements = ReturnType<typeof createReactRootElements>;\n\nexport const reactWebComponentElementName = \"odyssey-react-web-component\";\n\nexport type GetReactComponentInWebComponent = (\n  reactRootElements: ReactRootElements,\n) => ReactNode;\n\nconst SsrFriendlyHtmlElementClass =\n  \"HTMLElement\" in globalThis\n    ? HTMLElement\n    : (class {} as unknown as typeof globalThis.HTMLElement);\n\nexport class ReactInWebComponentElement extends SsrFriendlyHtmlElementClass {\n  getReactComponent: GetReactComponentInWebComponent;\n  reactRootElements: ReactRootElements;\n  reactRootPromise: Promise<Root>;\n\n  constructor(getReactComponent: GetReactComponentInWebComponent) {\n    super();\n\n    this.getReactComponent = getReactComponent;\n    this.reactRootElements = createReactRootElements();\n\n    const styleElement = document.createElement(\"style\");\n    const shadowRoot = this.attachShadow({ mode: \"open\" });\n\n    styleElement.innerHTML = `\n      :host {\n        all: initial;\n        contain: content;\n      }\n    `;\n\n    styleElement.setAttribute(\"nonce\", window.cspNonce);\n\n    this.reactRootElements.stylesRootElement.appendChild(styleElement);\n    shadowRoot.appendChild(this.reactRootElements.stylesRootElement);\n    shadowRoot.appendChild(this.reactRootElements.appRootElement);\n\n    // If we want to support React v17 in the future, we can use a try-catch on the import to grab the old `ReactDOM.render` function if `react-dom/client` errors. --Kevin Ghadyani\n    this.reactRootPromise = import(\"react-dom/client\").then(({ createRoot }) =>\n      createRoot(this.reactRootElements.appRootElement),\n    );\n  }\n\n  connectedCallback() {\n    this.reactRootPromise.then((reactRoot) =>\n      reactRoot.render(this.getReactComponent(this.reactRootElements)),\n    );\n  }\n\n  disconnectedCallback() {\n    this.reactRootPromise.then((reactRoot) => reactRoot.unmount());\n  }\n}\n\nif (\n  \"customElements\" in globalThis &&\n  !customElements.get(reactWebComponentElementName)\n) {\n  customElements.define(\n    reactWebComponentElementName,\n    ReactInWebComponentElement,\n  );\n}\n\nexport type RenderReactInWebComponentProps = {\n  /**\n   * This is a callback function for rendering your React component or app in the Web Component.\n   * It gives you access to the Shadow DOM elements if you need them for Odyssey, Emotion, or MUI.\n   *\n   * You will need to add `<slot>` elements if you want to pass child elements or components or React apps.\n   * You can have multiple slots in your app if you add a `name` attribute to your `<slot>` elements.\n   */\n  getReactComponent: GetReactComponentInWebComponent;\n  /**\n   * One or more HTML elements that are going to render as `children` of the web component.\n   * If your React component doesn't take children, this is unnecessary.\n   *\n   * Typically, a React app root element is passed, but it can include an array of other elements if there are multiple slots for children.\n   *\n   * You will need to have rendered `<slot>` elements in your React component or `children` won't show up.\n   */\n  webComponentChildren?: HTMLElement | HTMLElement[];\n  /**\n   * You React app renders in the web component, but the web component needs to be rendered in the document.\n   *\n   * This is the element the web component is rendered into.\n   */\n  webComponentRootElement: HTMLElement;\n};\n\n/**\n * Lets you render React apps or components in a Web Component.\n *\n * This is useful when global styles are causing conflicts with your React components.\n */\nexport const renderReactInWebComponent = ({\n  getReactComponent,\n  webComponentChildren,\n  webComponentRootElement,\n}: RenderReactInWebComponentProps) => {\n  const reactElement = new ReactInWebComponentElement(getReactComponent);\n\n  if (webComponentChildren) {\n    (Array.isArray(webComponentChildren)\n      ? webComponentChildren\n      : [webComponentChildren]\n    ).forEach((webComponentChild) => {\n      reactElement.appendChild(webComponentChild);\n    });\n  }\n\n  webComponentRootElement.appendChild(reactElement);\n\n  return reactElement;\n};\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAKA,SAASA,uBAAuB,QAAQ,8BAA8B;AAItE,OAAO,MAAMC,4BAA4B,GAAG,6BAA6B;AAMzE,MAAMC,2BAA2B,GAC/B,aAAa,IAAIC,UAAU,GACvBC,WAAW,GACV,MAAM,EAA+C;AAE5D,OAAO,MAAMC,0BAA0B,SAASH,2BAA2B,CAAC;EAK1EI,WAAWA,CAACC,iBAAkD,EAAE;IAC9D,KAAK,CAAC,CAAC;IAEP,IAAI,CAACA,iBAAiB,GAAGA,iBAAiB;IAC1C,IAAI,CAACC,iBAAiB,GAAGR,uBAAuB,CAAC,CAAC;IAElD,MAAMS,YAAY,GAAGC,QAAQ,CAACC,aAAa,CAAC,OAAO,CAAC;IACpD,MAAMC,UAAU,GAAG,IAAI,CAACC,YAAY,CAAC;MAAEC,IAAI,EAAE;IAAO,CAAC,CAAC;IAEtDL,YAAY,CAACM,SAAS,GAAG;AAC7B;AACA;AACA;AACA;AACA,KAAK;IAEDN,YAAY,CAACO,YAAY,CAAC,OAAO,EAAEC,MAAM,CAACC,QAAQ,CAAC;IAEnD,IAAI,CAACV,iBAAiB,CAACW,iBAAiB,CAACC,WAAW,CAACX,YAAY,CAAC;IAClEG,UAAU,CAACQ,WAAW,CAAC,IAAI,CAACZ,iBAAiB,CAACW,iBAAiB,CAAC;IAChEP,UAAU,CAACQ,WAAW,CAAC,IAAI,CAACZ,iBAAiB,CAACa,cAAc,CAAC;IAG7D,IAAI,CAACC,gBAAgB,GAAG,MAAM,CAAC,kBAAkB,CAAC,CAACC,IAAI,CAAC,CAAC;MAAEC;IAAW,CAAC,KACrEA,UAAU,CAAC,IAAI,CAAChB,iBAAiB,CAACa,cAAc,CAClD,CAAC;EACH;EAEAI,iBAAiBA,CAAA,EAAG;IAClB,IAAI,CAACH,gBAAgB,CAACC,IAAI,CAAEG,SAAS,IACnCA,SAAS,CAACC,MAAM,CAAC,IAAI,CAACpB,iBAAiB,CAAC,IAAI,CAACC,iBAAiB,CAAC,CACjE,CAAC;EACH;EAEAoB,oBAAoBA,CAAA,EAAG;IACrB,IAAI,CAACN,gBAAgB,CAACC,IAAI,CAAEG,SAAS,IAAKA,SAAS,CAACG,OAAO,CAAC,CAAC,CAAC;EAChE;AACF;AAEA,IACE,gBAAgB,IAAI1B,UAAU,IAC9B,CAAC2B,cAAc,CAACC,GAAG,CAAC9B,4BAA4B,CAAC,EACjD;EACA6B,cAAc,CAACE,MAAM,CACnB/B,4BAA4B,EAC5BI,0BACF,CAAC;AACH;AAiCA,OAAO,MAAM4B,yBAAyB,GAAGA,CAAC;EACxC1B,iBAAiB;EACjB2B,oBAAoB;EACpBC;AAC8B,CAAC,KAAK;EACpC,MAAMC,YAAY,GAAG,IAAI/B,0BAA0B,CAACE,iBAAiB,CAAC;EAEtE,IAAI2B,oBAAoB,EAAE;IACxB,CAACG,KAAK,CAACC,OAAO,CAACJ,oBAAoB,CAAC,GAChCA,oBAAoB,GACpB,CAACA,oBAAoB,CAAC,EACxBK,OAAO,CAAEC,iBAAiB,IAAK;MAC/BJ,YAAY,CAAChB,WAAW,CAACoB,iBAAiB,CAAC;IAC7C,CAAC,CAAC;EACJ;EAEAL,uBAAuB,CAACf,WAAW,CAACgB,YAAY,CAAC;EAEjD,OAAOA,YAAY;AACrB,CAAC","ignoreList":[]}

package/dist/index.cjs

@@ -0,0 +1,231 @@
+/**
+ * Do not edit directly
+ * Generated on Wed, 05 Feb 2025 20:20:12 GMT
+ */
+
+module.exports = {
+  "BorderColorControl": "#8d8d8d",
+  "BorderColorDisplay": "#e1e1e1",
+  "BorderColorDisabled": "#e1e1e1",
+  "BorderColorDangerLight": "#fe8f7a",
+  "BorderColorDangerControl": "#e72500",
+  "BorderColorDangerDark": "#951800",
+  "BorderColorPrimaryControl": "#546be7",
+  "BorderColorPrimaryDark": "#2e40a5",
+  "BorderRadiusTight": "4px",
+  "BorderRadiusMain": "6px",
+  "BorderRadiusOuter": "12px",
+  "BorderRadiusRound": "1.5em",
+  "BorderStyleMain": "solid",
+  "BorderWidthMain": "1px",
+  "BorderWidthHeavy": "1.5px",
+  "DepthLow": "0px 1px 2px 0px rgba(39, 39, 39, 0.07)",
+  "DepthMedium": "0px 1px 4px 0px rgba(39, 39, 39, 0.08), 0px 4px 6px 0px rgba(39, 39, 39, 0.01), 0px 5px 15px 0px rgba(39, 39, 39, 0.05)",
+  "DepthHigh": "0px 1px 4px 0px rgba(39, 39, 39, 0.08), 0px 4px 10px 0px rgba(39, 39, 39, 0.08), 0px 8px 30px 0px rgba(39, 39, 39, 0.10)",
+  "FocusOutlineColorPrimary": "#546be7",
+  "FocusOutlineColorDanger": "#e72500",
+  "FocusOutlineOffsetMain": "2px",
+  "FocusOutlineOffsetTight": "0",
+  "FocusOutlineStyle": "solid",
+  "FocusOutlineWidthMain": "2px",
+  "FocusOutlineWidthTight": "1px",
+  "HueNeutral50": "#f4f4f4",
+  "HueNeutral100": "#ededed",
+  "HueNeutral200": "#e1e1e1",
+  "HueNeutral300": "#cbcbcb",
+  "HueNeutral400": "#aeaeae",
+  "HueNeutral500": "#8d8d8d",
+  "HueNeutral600": "#6e6e6e",
+  "HueNeutral700": "#4b4b4b",
+  "HueNeutral800": "#383838",
+  "HueNeutral900": "#272727",
+  "HueNeutralWhite": "#ffffff",
+  "HueBlue50": "#f2f3fd",
+  "HueBlue100": "#dbe0fa",
+  "HueBlue200": "#c1c9f6",
+  "HueBlue300": "#9daaf1",
+  "HueBlue400": "#7286eb",
+  "HueBlue500": "#546be7",
+  "HueBlue600": "#4C64E1",
+  "HueBlue700": "#2e40a5",
+  "HueBlue800": "#22307c",
+  "HueBlue900": "#182257",
+  "HueGreen50": "#defae7",
+  "HueGreen100": "#94f5b3",
+  "HueGreen200": "#7be09e",
+  "HueGreen300": "#59c282",
+  "HueGreen400": "#31a061",
+  "HueGreen500": "#16884a",
+  "HueGreen600": "#197f48",
+  "HueGreen700": "#0e562f",
+  "HueGreen800": "#0a4023",
+  "HueGreen900": "#072e19",
+  "HueRed50": "#fff0ee",
+  "HueRed100": "#ffd8d1",
+  "HueRed200": "#febbae",
+  "HueRed300": "#fe8f7a",
+  "HueRed400": "#fd4e2d",
+  "HueRed500": "#e72500",
+  "HueRed600": "#d92300",
+  "HueRed700": "#951800",
+  "HueRed800": "#711200",
+  "HueRed900": "#500d00",
+  "HueYellow50": "#fdfad9",
+  "HueYellow100": "#ffe01a",
+  "HueYellow200": "#f9c503",
+  "HueYellow300": "#eb9e05",
+  "HueYellow400": "#bf8004",
+  "HueYellow500": "#a16c03",
+  "HueYellow600": "#966603",
+  "HueYellow700": "#664402",
+  "HueYellow800": "#4c3302",
+  "HueYellow900": "#352401",
+  "HueAccentOne50": "#F5F2FD",
+  "HueAccentOne100": "#E4DFF1",
+  "HueAccentOne200": "#D2C2FF",
+  "HueAccentOne300": "#B89FFE",
+  "HueAccentOne400": "#9777F9",
+  "HueAccentOne500": "#8951FB",
+  "HueAccentOne600": "#6E47C9",
+  "HueAccentOne700": "#5227BE",
+  "HueAccentOne800": "#401895",
+  "HueAccentOne900": "#2B0679",
+  "HueAccentTwo50": "#FCF2E8",
+  "HueAccentTwo100": "#F7DCD6",
+  "HueAccentTwo200": "#F2C299",
+  "HueAccentTwo300": "#ED9B58",
+  "HueAccentTwo400": "#E06C07",
+  "HueAccentTwo500": "#C25608",
+  "HueAccentTwo600": "#964E1E",
+  "HueAccentTwo700": "#964E1E",
+  "HueAccentTwo800": "#50301B",
+  "HueAccentTwo900": "#3E1F09",
+  "HueAccentThree50": "#E1F7F7",
+  "HueAccentThree100": "#BCEBEA",
+  "HueAccentThree200": "#89D9D9",
+  "HueAccentThree300": "#5CBDBD",
+  "HueAccentThree400": "#269C9C",
+  "HueAccentThree500": "#008585",
+  "HueAccentThree600": "#1B6C6C",
+  "HueAccentThree700": "#255157",
+  "HueAccentThree800": "#1C3D3D",
+  "HueAccentThree900": "#12282B",
+  "HueAccentFour50": "#FFF2E6",
+  "HueAccentFour100": "#EBDFCA",
+  "HueAccentFour200": "#D6C9AD",
+  "HueAccentFour300": "#C2AB84",
+  "HueAccentFour400": "#A18A60",
+  "HueAccentFour500": "#87744D",
+  "HueAccentFour600": "#696803",
+  "HueAccentFour700": "#574931",
+  "HueAccentFour800": "#403727",
+  "HueAccentFour900": "#2E2618",
+  "PalettePrimaryLighter": "#f2f3fd",
+  "PalettePrimaryLight": "#9daaf1",
+  "PalettePrimaryMain": "#546be7",
+  "PalettePrimaryDark": "#2e40a5",
+  "PalettePrimaryDarker": "#22307c",
+  "PalettePrimaryText": "#4C64E1",
+  "PalettePrimaryHeading": "#182257",
+  "PalettePrimaryHighlight": "#dbe0fa",
+  "PaletteDangerLighter": "#fff0ee",
+  "PaletteDangerLight": "#fe8f7a",
+  "PaletteDangerMain": "#e72500",
+  "PaletteDangerDark": "#951800",
+  "PaletteDangerDarker": "#711200",
+  "PaletteDangerText": "#d92300",
+  "PaletteDangerHeading": "#500d00",
+  "PaletteDangerHighlight": "#ffd8d1",
+  "PaletteWarningLighter": "#fdfad9",
+  "PaletteWarningLight": "#eb9e05",
+  "PaletteWarningMain": "#a16c03",
+  "PaletteWarningDark": "#664402",
+  "PaletteWarningDarker": "#4c3302",
+  "PaletteWarningText": "#966603",
+  "PaletteWarningHeading": "#352401",
+  "PaletteWarningHighlight": "#ffe01a",
+  "PaletteSuccessLighter": "#defae7",
+  "PaletteSuccessLight": "#59c282",
+  "PaletteSuccessMain": "#16884a",
+  "PaletteSuccessDark": "#0e562f",
+  "PaletteSuccessDarker": "#0a4023",
+  "PaletteSuccessText": "#197f48",
+  "PaletteSuccessHeading": "#072e19",
+  "PaletteSuccessHighlight": "#94f5b3",
+  "PaletteNeutralMain": "#6e6e6e",
+  "PaletteNeutralDark": "#272727",
+  "PaletteAlphaOpaque": "FF",
+  "PaletteAlphaSemi": "BF",
+  "ShadowScale0": "0px 1px 4px rgba(29, 29, 33, 0.08), 0px 4px 6px rgba(29, 29, 33, 0.01), 0px 5px 15px rgba(29, 29, 33, 0.05)",
+  "ShadowScale1": "0px 1px 4px rgba(29, 29, 33, 0.08), 0px 4px 10px rgba(29, 29, 33, 0.08), 0px 8px 30px rgba(29, 29, 33, 0.1)",
+  "Spacing0": "0",
+  "Spacing1": "0.28571429rem",
+  "Spacing2": "0.57142857rem",
+  "Spacing3": "0.85714286rem",
+  "Spacing4": "1.14285714rem",
+  "Spacing5": "1.71428571rem",
+  "Spacing6": "2.28571429rem",
+  "Spacing7": "2.85714286rem",
+  "Spacing8": "3.42857143rem",
+  "Spacing9": "4rem",
+  "TransitionDurationMain": "100ms",
+  "TransitionDurationMainAsNumber": 100,
+  "TransitionTimingMain": "linear",
+  "TypographyColorBody": "#272727",
+  "TypographyColorHeading": "#272727",
+  "TypographyColorInverse": "#ffffff",
+  "TypographyColorSupport": "#4b4b4b",
+  "TypographyColorSubordinate": "#6e6e6e",
+  "TypographyColorDisabled": "#aeaeae",
+  "TypographyColorAction": "#4C64E1",
+  "TypographyColorDanger": "#d92300",
+  "TypographyColorSuccess": "#197f48",
+  "TypographyColorWarning": "#966603",
+  "TypographyFamilySystem": "'-apple-system', 'BlinkMacSystemFont', 'Segoe UI', 'Oxygen-Sans', 'Ubuntu', 'Cantarell'",
+  "TypographyFamilyFallback": "'Helvetica Neue', sans-serif",
+  "TypographyFamilyAeonik": "'Aeonik'",
+  "TypographyFamilyInter": "'Inter'",
+  "TypographyFamilyBody": "'Inter', '-apple-system', 'BlinkMacSystemFont', 'Segoe UI', 'Oxygen-Sans', 'Ubuntu', 'Cantarell', 'Helvetica Neue', sans-serif",
+  "TypographyFamilyHeading": "'Aeonik', 'Inter', '-apple-system', 'BlinkMacSystemFont', 'Segoe UI', 'Oxygen-Sans', 'Ubuntu', 'Cantarell', 'Helvetica Neue', sans-serif",
+  "TypographyFamilyButton": "'Aeonik', 'Inter', '-apple-system', 'BlinkMacSystemFont', 'Segoe UI', 'Oxygen-Sans', 'Ubuntu', 'Cantarell', 'Helvetica Neue', sans-serif",
+  "TypographyFamilyMono": "'Roboto Mono', 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, Courier, monospace",
+  "TypographyScale0": "0.857rem",
+  "TypographyScale1": "1rem",
+  "TypographyScale2": "1.143rem",
+  "TypographyScale3": "1.286rem",
+  "TypographyScale4": "1.429rem",
+  "TypographyScale5": "1.571rem",
+  "TypographyScale6": "1.786rem",
+  "TypographyScale7": "2rem",
+  "TypographyScale8": "2.286rem",
+  "TypographyScale9": "2.571rem",
+  "TypographyScale10": "2.857rem",
+  "TypographyScale11": "3.214rem",
+  "TypographyScale12": "3.643rem",
+  "TypographySizeBase": "87.5%",
+  "TypographySizeOverline": "0.7142857143rem",
+  "TypographySizeSubordinate": "0.857rem",
+  "TypographySizeBody": "1rem",
+  "TypographySizeHeading6": "1.143rem",
+  "TypographySizeHeading5": "1.286rem",
+  "TypographySizeHeading4": "1.571rem",
+  "TypographySizeHeading3": "2rem",
+  "TypographySizeHeading2": "2.286rem",
+  "TypographySizeHeading1": "2.571rem",
+  "TypographyStyleNormal": "normal",
+  "TypographyWeightBody": "400",
+  "TypographyWeightBodyBold": "600",
+  "TypographyWeightHeading": "500",
+  "TypographyWeightHeadingBold": "700",
+  "TypographyLineHeightBody": 1.5,
+  "TypographyLineHeightUi": 1.2,
+  "TypographyLineHeightOverline": 1.3,
+  "TypographyLineHeightHeading6": 1.3,
+  "TypographyLineHeightHeading5": 1.3,
+  "TypographyLineHeightHeading4": 1.25,
+  "TypographyLineHeightHeading3": 1.25,
+  "TypographyLineHeightHeading2": 1.2,
+  "TypographyLineHeightHeading1": 1.2,
+  "TypographyLineLengthMax": "55ch",
+  "TypographyLetterSpacingOverline": ".05em"
+};

package/dist/index.d.ts

@@ -11,14 +11,12 @@
  */
 declare function literalTuple<T extends string, U extends [T, ...T[]]>(...args: U): U;
 declare const modern: ["last 1 Chrome version", "last 1 Safari version", "last 1 Edge version", "last 1 Firefox version", "Firefox ESR"];
-declare const ie11: ["IE 11"];
-declare const all: ["last 1 Chrome version", "last 1 Safari version", "last 1 Edge version", "last 1 Firefox version", "Firefox ESR", "IE 11"];
+declare const all: ["last 1 Chrome version", "last 1 Safari version", "last 1 Edge version", "last 1 Firefox version", "Firefox ESR"];
 declare const config: {
-    all: ["last 1 Chrome version", "last 1 Safari version", "last 1 Edge version", "last 1 Firefox version", "Firefox ESR", "IE 11"];
-    ie11: ["IE 11"];
-    modern: ["last 1 Chrome version", "last 1 Safari version", "last 1 Edge version", "last 1 Firefox version", "Firefox ESR"];
-    production: ["last 1 Chrome version", "last 1 Safari version", "last 1 Edge version", "last 1 Firefox version", "Firefox ESR", "IE 11"];
+    all: ["last 1 Chrome version", "last 1 Safari version", "last 1 Edge version", "last 1 Firefox version", "Firefox ESR"];
     development: ["last 1 Chrome version", "last 1 Safari version", "last 1 Edge version", "last 1 Firefox version", "Firefox ESR"];
+    modern: ["last 1 Chrome version", "last 1 Safari version", "last 1 Edge version", "last 1 Firefox version", "Firefox ESR"];
+    production: ["last 1 Chrome version", "last 1 Safari version", "last 1 Edge version", "last 1 Firefox version", "Firefox ESR"];
     test: ["last 1 Chrome version", "last 1 Safari version", "last 1 Edge version", "last 1 Firefox version", "Firefox ESR"];
 };
 //# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAEH,iBAAS,YAAY,CAAC,CAAC,SAAS,MAAM,EAAE,CAAC,SAAS,CAAC,CAAC,EAAE,GAAG,CAAC,EAAE,CAAC,EAAE,GAAG,IAAI,EAAE,CAAC,GAAG,CAAC,CAE5E;AAED,QAAA,MAAM,MAAM,oHAMX,CAAC;AAEF,QAAA,MAAM,IAAI,WAAwB,CAAC;AAEnC,QAAA,MAAM,GAAG,6HAAmC,CAAC;AAE7C,QAAA,MAAM,MAAM;;;;;;;CAOX,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAEH,iBAAS,YAAY,CAAC,CAAC,SAAS,MAAM,EAAE,CAAC,SAAS,CAAC,CAAC,EAAE,GAAG,CAAC,EAAE,CAAC,EAAE,GAAG,IAAI,EAAE,CAAC,GAAG,CAAC,CAE5E;AAED,QAAA,MAAM,MAAM,oHAMX,CAAC;AAEF,QAAA,MAAM,GAAG,oHAA0B,CAAC;AAEpC,QAAA,MAAM,MAAM;;;;;;CAMX,CAAC"}

package/dist/index.js

@@ -1,5 +1,6 @@
+"use strict";
 /*!
- * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.
+ * Copyright (c) 2021-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.
@@ -9,62 +10,16 @@
  *
  * See the License for the specific language governing permissions and limitations under the License.
  */
-
-export { deepmerge, visuallyHidden } from "@mui/utils";
-export { createTheme, DialogContentText, Divider, InputAdornment, InputBase, ListItemIcon, ListItemText, ListSubheader, MenuList, Paper, ScopedCssBaseline, ThemeProvider } from "@mui/material";
-export { odysseyTranslate } from "./i18n.js";
-export { useOdysseyDesignTokens } from "./OdysseyDesignTokensContext.js";
-export * from "./Accordion.js";
-export * from "./Autocomplete.js";
-export { badgeContentMaxValues } from "./Badge.js";
-export * from "./Banner.js";
-export * from "./Box.js";
-export * from "./Breadcrumbs.js";
-export * from "./Buttons/index.js";
-export * from "./Callout.js";
-export * from "./Card.js";
-export * from "./Checkbox.js";
-export * from "./CheckboxGroup.js";
-export * from "./CircularProgress.js";
-export * from "./createUniqueId.js";
-export * from "./CssBaseline.js";
-export * from "./DataTable/index.js";
-export * from "./Dialog.js";
-export * from "./Drawer.js";
-export * from "./EmptyState.js";
-export * from "./FieldComponentProps.js";
-export * from "./Fieldset.js";
-export { FileUploader, fileUploadTypes, fileUploadVariants } from "./FileUploader/index.js";
-export * from "./Form.js";
-export * from "./HintLink.js";
-export * from "./IconWithTooltip.js";
-export * from "./Link.js";
-export * from "./NativeSelect.js";
-export * from "./NullElement.js";
-export * from "./OdysseyCacheProvider.js";
-export * from "./OdysseyProvider.js";
-export * from "./OdysseyThemeProvider.js";
-export * from "./OdysseyTranslationProvider.js";
-export * from "./Pagination/index.js";
-export * from "./PasswordField.js";
-export * from "./Radio.js";
-export * from "./RadioGroup.js";
-export * from "./ScreenReaderText.js";
-export * from "./SearchField.js";
-export * from "./Select.js";
-export * from "./Stack.js";
-export * from "./Status.js";
-export * from "./Surface.js";
-export * from "./Switch.js";
-export * from "./Tabs.js";
-export * from "./Tag.js";
-export * from "./TagList.js";
-export * from "./TextField.js";
-export * from "./theme/index.js";
-export * from "./Toast.js";
-export * from "./ToastStack.js";
-export * from "./Tooltip.js";
-export * from "./Typography.js";
-export * from "./useUniqueId.js";
-export * from "./web-component/index.js";
-//# sourceMappingURL=index.js.map
+function literalTuple(...args) {
+    return args;
+}
+const modern = literalTuple("last 1 Chrome version", "last 1 Safari version", "last 1 Edge version", "last 1 Firefox version", "Firefox ESR");
+const all = literalTuple(...modern);
+const config = {
+    all,
+    development: modern,
+    modern,
+    production: all,
+    test: modern,
+};
+module.exports = config;