@okta/odyssey-react-mui 1.36.0 → 1.37.0

package/dist/types/web-component/renderReactInWebComponent.d.ts

@@ -12,21 +12,43 @@
 import { type ReactNode } from "react";
 import type { Root } from "react-dom/client";
 import { type ReactRootElements } from "./createReactRootElements.js";
-export declare const reactWebComponentElementName = "odyssey-react-web-component";
-export type GetReactComponentInWebComponent = (reactRootElements: ReactRootElements) => ReactNode;
+interface GetReactWebComponentOptions {
+    webComponentName?: string;
+    getReactComponent: (reactRootElements: ReactRootElements) => ReactNode;
+}
+export declare const webComponentDataAttributeName = "data-odyssey-react-web-component";
+export declare const versionedWebComponentName: string;
 declare const SsrFriendlyHtmlElementClass: {
     new (): HTMLElement;
     prototype: HTMLElement;
 };
-export declare class ReactInWebComponentElement extends SsrFriendlyHtmlElementClass {
-    getReactComponent: GetReactComponentInWebComponent;
-    reactRootElements: ReactRootElements;
+export declare class WebComponentClass extends SsrFriendlyHtmlElementClass {
+    #private;
+    readonly elementName: string;
     reactRootPromise: Promise<Root | null>;
-    constructor(getReactComponent: GetReactComponentInWebComponent);
+    constructor();
+    /**
+     * Provides the function used to initialize react content that is specific to this instance
+     * of the web component, which is used later in the connectedCallback.
+     *
+     * Always set immediately after creation via document.createElement
+     */
+    setGetReactComponent(getReactComponent: GetReactComponentInWebComponent): void;
     connectedCallback(): void;
     disconnectedCallback(): void;
 }
+/**
+ * Returns a constructed web component which manages it's own shadow dom and react dom roots
+ * A custom name can be specified, otherwise a default is provided
+ */
+export declare const getReactWebComponent: ({ webComponentName, getReactComponent, }: GetReactWebComponentOptions) => WebComponentClass;
+export type GetReactComponentInWebComponent = (reactRootElements: ReactRootElements) => ReactNode;
 export type RenderReactInWebComponentProps = {
+    /**
+     * Optional name given to this web component.
+     * Defaults to a 'odyssey-react-wc-' plus the current odyssey version
+     */
+    webComponentName?: string;
     /**
      * This is a callback function for rendering your React component or app in the Web Component.
      * It gives you access to the Shadow DOM elements if you need them for Odyssey, Emotion, or MUI.
@@ -64,6 +86,6 @@ export type RenderReactInWebComponentProps = {
  *
  * This is useful when global styles are causing conflicts with your React components.
  */
-export declare const renderReactInWebComponent: ({ getReactComponent, webComponentChildren, webComponentParentElement, webComponentRootElement, }: RenderReactInWebComponentProps) => ReactInWebComponentElement;
+export declare const renderReactInWebComponent: ({ webComponentName, getReactComponent, webComponentChildren, webComponentParentElement, webComponentRootElement, }: RenderReactInWebComponentProps) => WebComponentClass;
 export {};
 //# sourceMappingURL=renderReactInWebComponent.d.ts.map

package/dist/types/web-component/renderReactInWebComponent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"renderReactInWebComponent.d.ts","sourceRoot":"","sources":["../../../src/web-component/renderReactInWebComponent.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAEH,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AAE7C,OAAO,EAEL,KAAK,iBAAiB,EACvB,MAAM,8BAA8B,CAAC;AAEtC,eAAO,MAAM,4BAA4B,gCAAgC,CAAC;AAE1E,MAAM,MAAM,+BAA+B,GAAG,CAC5C,iBAAiB,EAAE,iBAAiB,KACjC,SAAS,CAAC;AAEf,QAAA,MAAM,2BAA2B;;;CAG2B,CAAC;AAE7D,qBAAa,0BAA2B,SAAQ,2BAA2B;IACzE,iBAAiB,EAAE,+BAA+B,CAAC;IACnD,iBAAiB,EAAE,iBAAiB,CAAC;IACrC,gBAAgB,EAAE,OAAO,CAAC,IAAI,GAAG,IAAI,CAAC,CAAyB;gBAEnD,iBAAiB,EAAE,+BAA+B;IAuB9D,iBAAiB;IAsBjB,oBAAoB;CAcrB;AAYD,MAAM,MAAM,8BAA8B,GAAG;IAC3C;;;;;;OAMG;IACH,iBAAiB,EAAE,+BAA+B,CAAC;IACnD;;;;;;;OAOG;IACH,oBAAoB,CAAC,EAAE,WAAW,GAAG,WAAW,EAAE,CAAC;CACpD,GAAG,CACA;IACE;;;;OAIG;IACH,yBAAyB,EAAE,WAAW,CAAC;IACvC,uBAAuB,CAAC,EAAE,KAAK,CAAC;CACjC,GACD;IACE,yBAAyB,CAAC,EAAE,WAAW,CAAC;IACxC;;OAEG;IACH,uBAAuB,EAAE,WAAW,CAAC;CACtC,CACJ,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,yBAAyB,qGAKnC,8BAA8B,+BAqBhC,CAAC"}
+{"version":3,"file":"renderReactInWebComponent.d.ts","sourceRoot":"","sources":["../../../src/web-component/renderReactInWebComponent.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAEH,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AAG7C,OAAO,EAEL,KAAK,iBAAiB,EACvB,MAAM,8BAA8B,CAAC;AAEtC,UAAU,2BAA2B;IACnC,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,iBAAiB,EAAE,CAAC,iBAAiB,EAAE,iBAAiB,KAAK,SAAS,CAAC;CACxE;AAGD,eAAO,MAAM,6BAA6B,qCAAqC,CAAC;AAGhF,eAAO,MAAM,yBAAyB,QACkB,CAAC;AAEzD,QAAA,MAAM,2BAA2B;;;CAG2B,CAAC;AAE7D,qBAAa,iBAAkB,SAAQ,2BAA2B;;IAGhE,SAAgB,WAAW,EAAE,MAAM,CAAkB;IAE9C,gBAAgB,EAAE,OAAO,CAAC,IAAI,GAAG,IAAI,CAAC,CAAyB;;IAuBtE;;;;;OAKG;IACH,oBAAoB,CAAC,iBAAiB,EAAE,+BAA+B;IAcvE,iBAAiB;IA0BjB,oBAAoB;CAcrB;AAED;;;GAGG;AACH,eAAO,MAAM,oBAAoB,6CAG9B,2BAA2B,sBAc7B,CAAC;AAEF,MAAM,MAAM,+BAA+B,GAAG,CAC5C,iBAAiB,EAAE,iBAAiB,KACjC,SAAS,CAAC;AAEf,MAAM,MAAM,8BAA8B,GAAG;IAC3C;;;OAGG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B;;;;;;OAMG;IACH,iBAAiB,EAAE,+BAA+B,CAAC;IACnD;;;;;;;OAOG;IACH,oBAAoB,CAAC,EAAE,WAAW,GAAG,WAAW,EAAE,CAAC;CACpD,GAAG,CACA;IACE;;;;OAIG;IACH,yBAAyB,EAAE,WAAW,CAAC;IACvC,uBAAuB,CAAC,EAAE,KAAK,CAAC;CACjC,GACD;IACE,yBAAyB,CAAC,EAAE,WAAW,CAAC;IACxC;;OAEG;IACH,uBAAuB,EAAE,WAAW,CAAC;CACtC,CACJ,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,yBAAyB,uHAMnC,8BAA8B,sBAwBhC,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@okta/odyssey-react-mui",
-  "version": "1.36.0",
+  "version": "1.37.0",
   "description": "React MUI components for Odyssey, Okta's design system",
   "author": "Okta, Inc.",
   "license": "Apache-2.0",
@@ -97,6 +97,7 @@
     "generate:icons:components": "svgr ../odyssey-icons/dist/icons --out-dir ./src/icons.generated",
     "generate:icons:index": "tsx scripts/generateIconsIndex.ts",
     "generate:icons": "yarn generate:icons:clean && yarn generate:icons:components && yarn generate:icons:index",
+    "generate:webComponentVersion": "tsx scripts/updateWebComponentVersion.ts",
     "playwright-install": "NODE_TLS_REJECT_UNAUTHORIZED=0 yarn playwright install --with-deps chromium",
     "test": "NODE_ENV=test vitest run --reporter=default",
     "typecheck": "tsc --noEmit --rootDir ./"
@@ -119,7 +120,7 @@
     "@mui/system": "^5.17.1",
     "@mui/utils": "^5.17.1",
     "@mui/x-date-pickers": "^7.2.0",
-    "@okta/odyssey-design-tokens": "1.36.0",
+    "@okta/odyssey-design-tokens": "1.37.0",
     "@types/luxon": "^3.4.2",
     "date-fns": "^2.30.0",
     "dom-accessibility-api": "^0.7.0",
@@ -137,7 +138,7 @@
     "@babel/preset-env": "^7.26.0",
     "@babel/preset-react": "^7.26.3",
     "@babel/preset-typescript": "^7.26.0",
-    "@okta/browserslist-config-odyssey": "1.36.0",
+    "@okta/browserslist-config-odyssey": "1.37.0",
     "@okta/odyssey-icons": "workspace:*",
     "@okta/odyssey-typescript": "workspace:*",
     "@svgr/cli": "^7.0.0",
@@ -176,5 +177,5 @@
     "react": "^18.3.1",
     "react-dom": "^18.3.1"
   },
-  "gitHead": "ceb2a0db9c0844dd17d10895a86c63424665e2a2"
+  "gitHead": "1eebd550985a66242900f580e1743af68278ae7f"
 }