@okta/odyssey-react-mui 1.5.0 → 1.6.1

package/dist/src/Select.d.ts

@@ -17,11 +17,16 @@ export type SelectOption = {
     type?: "heading" | "option";
     value?: string;
 };
-export type SelectProps = {
+export type SelectValueType<HasMultipleChoices> = HasMultipleChoices extends true ? string[] : string;
+export type SelectProps<Value extends SelectValueType<HasMultipleChoices>, HasMultipleChoices extends boolean> = {
     /**
      * The error message for the Select
      */
     errorMessage?: string;
+    /**
+     * If `true`, the Select allows multiple selections
+     */
+    hasMultipleChoices?: HasMultipleChoices;
     /**
      * The hint text for the Select
      */
@@ -35,9 +40,10 @@ export type SelectProps = {
      */
     isDisabled?: boolean;
     /**
-     * If `true`, the Select allows multiple selections
+     * @deprecated Use `hasMultipleChoices` instead.
      */
-    isMultiSelect?: boolean;
+    /** **Deprecated:** use `hasMultipleChoices` */
+    isMultiSelect?: HasMultipleChoices;
     /**
      * If `true`, the Select is optional
      */
@@ -53,15 +59,15 @@ export type SelectProps = {
     /**
      * Callback fired when the Select loses focus
      */
-    onBlur?: MuiSelectProps["onBlur"];
+    onBlur?: MuiSelectProps<Value>["onBlur"];
     /**
      * Callback fired when the value of the Select changes
      */
-    onChange?: MuiSelectProps["onChange"];
+    onChange?: MuiSelectProps<Value>["onChange"];
     /**
      * Callback fired when the Select gains focus
      */
-    onFocus?: MuiSelectProps["onFocus"];
+    onFocus?: MuiSelectProps<Value>["onFocus"];
     /**
      * The options for the Select
      */
@@ -69,8 +75,8 @@ export type SelectProps = {
     /**
      * The value or values selected in the Select
      */
-    value?: string | string[];
+    value?: Value;
 } & SeleniumProps;
-declare const MemoizedSelect: import("react").MemoExoticComponent<({ errorMessage, hint, id: idOverride, isDisabled, isMultiSelect, isOptional, label, name: nameOverride, onBlur, onChange: onChangeProp, onFocus, value, testId, options, }: SelectProps) => JSX.Element>;
+declare const MemoizedSelect: import("react").MemoExoticComponent<(<Value extends SelectValueType<HasMultipleChoices>, HasMultipleChoices extends boolean>({ errorMessage, hasMultipleChoices: hasMultipleChoicesProp, hint, id: idOverride, isDisabled, isMultiSelect, isOptional, label, name: nameOverride, onBlur, onChange: onChangeProp, onFocus, options, testId, value, }: SelectProps<Value, HasMultipleChoices>) => JSX.Element)>;
 export { MemoizedSelect as Select };
 //# sourceMappingURL=Select.d.ts.map

package/dist/src/Select.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../src/Select.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;;AAaH,OAAO,EAAE,WAAW,IAAI,cAAc,EAAE,MAAM,eAAe,CAAC;AAE9D,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAGrD,MAAM,MAAM,YAAY,GAAG;IACzB,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC;IAC5B,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,MAAM,MAAM,WAAW,GAAG;IACxB;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ;;OAEG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;OAEG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;OAEG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,MAAM,CAAC,EAAE,cAAc,CAAC,QAAQ,CAAC,CAAC;IAClC;;OAEG;IACH,QAAQ,CAAC,EAAE,cAAc,CAAC,UAAU,CAAC,CAAC;IACtC;;OAEG;IACH,OAAO,CAAC,EAAE,cAAc,CAAC,SAAS,CAAC,CAAC;IACpC;;OAEG;IACH,OAAO,EAAE,CAAC,MAAM,GAAG,YAAY,CAAC,EAAE,CAAC;IACnC;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;CAC3B,GAAG,aAAa,CAAC;AAyLlB,QAAA,MAAM,cAAc,mNAzJjB,WAAW,iBAyJqB,CAAC;AAGpC,OAAO,EAAE,cAAc,IAAI,MAAM,EAAE,CAAC"}
+{"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../src/Select.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;;AAYH,OAAO,EAAE,WAAW,IAAI,cAAc,EAAE,MAAM,eAAe,CAAC;AAE9D,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAGrD,MAAM,MAAM,YAAY,GAAG;IACzB,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC;IAC5B,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,MAAM,MAAM,eAAe,CAAC,kBAAkB,IAC5C,kBAAkB,SAAS,IAAI,GAAG,MAAM,EAAE,GAAG,MAAM,CAAC;AAEtD,MAAM,MAAM,WAAW,CACrB,KAAK,SAAS,eAAe,CAAC,kBAAkB,CAAC,EACjD,kBAAkB,SAAS,OAAO,IAChC;IACF;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;OAEG;IACH,kBAAkB,CAAC,EAAE,kBAAkB,CAAC;IACxC;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ;;OAEG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;OAEG;IACH,+CAA+C;IAC/C,aAAa,CAAC,EAAE,kBAAkB,CAAC;IACnC;;OAEG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,MAAM,CAAC,EAAE,cAAc,CAAC,KAAK,CAAC,CAAC,QAAQ,CAAC,CAAC;IACzC;;OAEG;IACH,QAAQ,CAAC,EAAE,cAAc,CAAC,KAAK,CAAC,CAAC,UAAU,CAAC,CAAC;IAC7C;;OAEG;IACH,OAAO,CAAC,EAAE,cAAc,CAAC,KAAK,CAAC,CAAC,SAAS,CAAC,CAAC;IAC3C;;OAEG;IACH,OAAO,EAAE,CAAC,MAAM,GAAG,YAAY,CAAC,EAAE,CAAC;IACnC;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC;CACf,GAAG,aAAa,CAAC;AAkMlB,QAAA,MAAM,cAAc,+YAAe,CAAC;AAGpC,OAAO,EAAE,cAAc,IAAI,MAAM,EAAE,CAAC"}

package/dist/src/Tooltip.d.ts

@@ -30,5 +30,6 @@ export type TooltipProps = {
      */
     text: string;
 } & SeleniumProps;
-export declare const Tooltip: ({ ariaType, children, placement, testId, text, }: TooltipProps) => JSX.Element;
+declare const MemoizedTooltip: import("react").MemoExoticComponent<({ ariaType, children, placement, testId, text, }: TooltipProps) => JSX.Element>;
+export { MemoizedTooltip as Tooltip };
 //# sourceMappingURL=Tooltip.d.ts.map

package/dist/src/Tooltip.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.d.ts","sourceRoot":"","sources":["../../src/Tooltip.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAGH,OAAO,KAAK,EAAE,YAAY,IAAI,eAAe,EAAE,MAAM,eAAe,CAAC;AAGrE,OAAO,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AACrC,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAEhD,MAAM,MAAM,YAAY,GAAG;IACzB;;OAEG;IACH,QAAQ,EAAE,aAAa,GAAG,OAAO,CAAC;IAClC;;OAEG;IACH,QAAQ,EAAE,YAAY,CAAC;IACvB;;OAEG;IACH,SAAS,CAAC,EAAE,eAAe,CAAC,WAAW,CAAC,CAAC;IACzC;;OAEG;IACH,IAAI,EAAE,MAAM,CAAC;CACd,GAAG,aAAa,CAAC;AAElB,eAAO,MAAM,OAAO,qDAMjB,YAAY,gBASd,CAAC"}
+{"version":3,"file":"Tooltip.d.ts","sourceRoot":"","sources":["../../src/Tooltip.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAGH,OAAO,KAAK,EAAE,YAAY,IAAI,eAAe,EAAE,MAAM,eAAe,CAAC;AAGrE,OAAO,EAAE,YAAY,EAAQ,MAAM,OAAO,CAAC;AAC3C,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAEhD,MAAM,MAAM,YAAY,GAAG;IACzB;;OAEG;IACH,QAAQ,EAAE,aAAa,GAAG,OAAO,CAAC;IAClC;;OAEG;IACH,QAAQ,EAAE,YAAY,CAAC;IACvB;;OAEG;IACH,SAAS,CAAC,EAAE,eAAe,CAAC,WAAW,CAAC,CAAC;IACzC;;OAEG;IACH,IAAI,EAAE,MAAM,CAAC;CACd,GAAG,aAAa,CAAC;AAmBlB,QAAA,MAAM,eAAe,yFAXlB,YAAY,iBAWsB,CAAC;AAGtC,OAAO,EAAE,eAAe,IAAI,OAAO,EAAE,CAAC"}

package/dist/src/{createShadowDom.d.ts → createShadowRootElement.d.ts}

@@ -9,8 +9,5 @@
  *
  * See the License for the specific language governing permissions and limitations under the License.
  */
-export declare const createShadowDom: (containerElement: HTMLElement) => {
-    emotionRootElement: HTMLStyleElement;
-    shadowRootElement: HTMLDivElement;
-};
-//# sourceMappingURL=createShadowDom.d.ts.map
+export declare const createShadowRootElement: (containerElement: HTMLElement) => any;
+//# sourceMappingURL=createShadowRootElement.d.ts.map

package/dist/src/createShadowRootElement.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"createShadowRootElement.d.ts","sourceRoot":"","sources":["../../src/createShadowRootElement.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAEH,eAAO,MAAM,uBAAuB,qBAAsB,WAAW,QAQpE,CAAC"}

package/dist/src/index.d.ts

@@ -45,6 +45,7 @@ export * from "./Callout";
 export * from "./Checkbox";
 export * from "./CheckboxGroup";
 export * from "./CircularProgress";
+export * from "./createShadowRootElement";
 export * from "./createUniqueId";
 export * from "./Dialog";
 export * from "./Fieldset";

package/dist/src/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAEH,OAAO,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,YAAY,CAAC;AAEvD,OAAO,EACL,WAAW;AACX,4FAA4F;AAC5F,WAAW;AACX,4FAA4F;AAC5F,iBAAiB;AACjB,4FAA4F;AAC5F,OAAO;AACP,4FAA4F;AAC5F,cAAc;AACd,4FAA4F;AAC5F,SAAS;AACT,4FAA4F;AAC5F,YAAY;AACZ,4FAA4F;AAC5F,YAAY;AACZ,4FAA4F;AAC5F,aAAa;AACb,4FAA4F;AAC5F,QAAQ;AACR,4FAA4F;AAC5F,KAAK;AACL,4FAA4F;AAC5F,iBAAiB,EACjB,aAAa,GACd,MAAM,eAAe,CAAC;AAEvB,YAAY,EACV,gBAAgB,EAChB,sBAAsB,EACtB,YAAY,EACZ,mBAAmB,EACnB,cAAc,EACd,iBAAiB,EACjB,iBAAiB,EACjB,kBAAkB,EAClB,aAAa,EACb,UAAU,EACV,sBAAsB,EACtB,YAAY,GACb,MAAM,eAAe,CAAC;AAEvB,OAAO,EAAE,sBAAsB,EAAE,MAAM,8BAA8B,CAAC;AAEtE,cAAc,aAAa,CAAC;AAC5B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,UAAU,CAAC;AACzB,cAAc,OAAO,CAAC;AACtB,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,WAAW,CAAC;AAC1B,cAAc,YAAY,CAAC;AAC3B,cAAc,iBAAiB,CAAC;AAChC,cAAc,oBAAoB,CAAC;AACnC,cAAc,kBAAkB,CAAC;AACjC,cAAc,UAAU,CAAC;AACzB,cAAc,YAAY,CAAC;AAC3B,cAAc,QAAQ,CAAC;AACvB,cAAc,QAAQ,CAAC;AACvB,cAAc,cAAc,CAAC;AAC7B,cAAc,YAAY,CAAC;AAC3B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,eAAe,CAAC;AAC9B,cAAc,wBAAwB,CAAC;AACvC,OAAO,EAAE,gBAAgB,EAAE,MAAM,QAAQ,CAAC;AAC1C,cAAc,mBAAmB,CAAC;AAClC,cAAc,wBAAwB,CAAC;AACvC,cAAc,8BAA8B,CAAC;AAC7C,cAAc,iBAAiB,CAAC;AAChC,cAAc,SAAS,CAAC;AACxB,cAAc,cAAc,CAAC;AAC7B,cAAc,oBAAoB,CAAC;AACnC,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC;AACvB,cAAc,OAAO,CAAC;AACtB,cAAc,WAAW,CAAC;AAC1B,cAAc,aAAa,CAAC;AAC5B,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,cAAc,CAAC;AAC7B,cAAc,WAAW,CAAC;AAC1B,cAAc,cAAc,CAAC;AAC7B,cAAc,eAAe,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAEH,OAAO,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,YAAY,CAAC;AAEvD,OAAO,EACL,WAAW;AACX,4FAA4F;AAC5F,WAAW;AACX,4FAA4F;AAC5F,iBAAiB;AACjB,4FAA4F;AAC5F,OAAO;AACP,4FAA4F;AAC5F,cAAc;AACd,4FAA4F;AAC5F,SAAS;AACT,4FAA4F;AAC5F,YAAY;AACZ,4FAA4F;AAC5F,YAAY;AACZ,4FAA4F;AAC5F,aAAa;AACb,4FAA4F;AAC5F,QAAQ;AACR,4FAA4F;AAC5F,KAAK;AACL,4FAA4F;AAC5F,iBAAiB,EACjB,aAAa,GACd,MAAM,eAAe,CAAC;AAEvB,YAAY,EACV,gBAAgB,EAChB,sBAAsB,EACtB,YAAY,EACZ,mBAAmB,EACnB,cAAc,EACd,iBAAiB,EACjB,iBAAiB,EACjB,kBAAkB,EAClB,aAAa,EACb,UAAU,EACV,sBAAsB,EACtB,YAAY,GACb,MAAM,eAAe,CAAC;AAEvB,OAAO,EAAE,sBAAsB,EAAE,MAAM,8BAA8B,CAAC;AAEtE,cAAc,aAAa,CAAC;AAC5B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,UAAU,CAAC;AACzB,cAAc,OAAO,CAAC;AACtB,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,WAAW,CAAC;AAC1B,cAAc,YAAY,CAAC;AAC3B,cAAc,iBAAiB,CAAC;AAChC,cAAc,oBAAoB,CAAC;AACnC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,kBAAkB,CAAC;AACjC,cAAc,UAAU,CAAC;AACzB,cAAc,YAAY,CAAC;AAC3B,cAAc,QAAQ,CAAC;AACvB,cAAc,QAAQ,CAAC;AACvB,cAAc,cAAc,CAAC;AAC7B,cAAc,YAAY,CAAC;AAC3B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,eAAe,CAAC;AAC9B,cAAc,wBAAwB,CAAC;AACvC,OAAO,EAAE,gBAAgB,EAAE,MAAM,QAAQ,CAAC;AAC1C,cAAc,mBAAmB,CAAC;AAClC,cAAc,wBAAwB,CAAC;AACvC,cAAc,8BAA8B,CAAC;AAC7C,cAAc,iBAAiB,CAAC;AAChC,cAAc,SAAS,CAAC;AACxB,cAAc,cAAc,CAAC;AAC7B,cAAc,oBAAoB,CAAC;AACnC,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC;AACvB,cAAc,OAAO,CAAC;AACtB,cAAc,WAAW,CAAC;AAC1B,cAAc,aAAa,CAAC;AAC5B,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,cAAc,CAAC;AAC7B,cAAc,WAAW,CAAC;AAC1B,cAAc,cAAc,CAAC;AAC7B,cAAc,eAAe,CAAC"}

package/dist/src/theme/components.d.ts

@@ -11,8 +11,8 @@
  */
 import { ThemeOptions } from "@mui/material";
 import { DesignTokens } from "./theme";
-export declare const components: ({ odysseyTokens, shadowRootElement, }: {
+export declare const components: ({ odysseyTokens, shadowDomElement, }: {
     odysseyTokens: DesignTokens;
-    shadowRootElement?: HTMLDivElement | undefined;
+    shadowDomElement?: HTMLDivElement | undefined;
 }) => ThemeOptions["components"];
 //# sourceMappingURL=components.d.ts.map

package/dist/src/theme/components.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"components.d.ts","sourceRoot":"","sources":["../../../src/theme/components.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAEH,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAsC7C,OAAO,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAGvC,eAAO,MAAM,UAAU;mBAIN,YAAY;;MAEzB,YAAY,CAAC,YAAY,CAk4E5B,CAAC"}
+{"version":3,"file":"components.d.ts","sourceRoot":"","sources":["../../../src/theme/components.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAEH,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAsC7C,OAAO,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAGvC,eAAO,MAAM,UAAU;mBAIN,YAAY;;MAEzB,YAAY,CAAC,YAAY,CAq4E5B,CAAC"}

package/dist/src/theme/createOdysseyMuiTheme.d.ts

@@ -16,8 +16,8 @@ import "./palette.types";
 import "./typography.types";
 export type DesignTokens = typeof Tokens;
 export type DesignTokensOverride = Partial<typeof Tokens>;
-export declare const createOdysseyMuiTheme: ({ odysseyTokens, shadowRootElement, }: {
+export declare const createOdysseyMuiTheme: ({ odysseyTokens, shadowDomElement, }: {
     odysseyTokens: DesignTokens;
-    shadowRootElement?: HTMLDivElement | undefined;
+    shadowDomElement?: HTMLDivElement | undefined;
 }) => import("@mui/material/styles").Theme;
 //# sourceMappingURL=createOdysseyMuiTheme.d.ts.map

package/dist/theme/components.js

@@ -39,7 +39,7 @@ import { Fragment as _Fragment } from "react/jsx-runtime";
 export const components = _ref => {
   let {
     odysseyTokens,
-    shadowRootElement
+    shadowDomElement
   } = _ref;
   return {
     MuiAccordion: {
@@ -738,7 +738,7 @@ export const components = _ref => {
             [`&.${chipClasses.disabled}`]: {
               opacity: 1,
               pointerEvents: "none",
-              backgroundColor: odysseyTokens.HueNeutral50,
+              backgroundColor: odysseyTokens.HueNeutral200,
               color: odysseyTokens.TypographyColorDisabled
             },
             ...(ownerState.clickable && {
@@ -841,7 +841,11 @@ export const components = _ref => {
           };
         },
         label: {
-          padding: 0
+          padding: 0,
+          [`.${inputBaseClasses.root}.${inputBaseClasses.disabled} &`]: {
+            color: odysseyTokens.TypographyColorDisabled,
+            WebkitTextFillColor: odysseyTokens.TypographyColorDisabled
+          }
         },
         deleteIcon: {
           WebkitTapHighlightColor: "transparent",
@@ -1561,7 +1565,7 @@ export const components = _ref => {
       styleOverrides: {
         root: {
           color: odysseyTokens.TypographyColorAction,
-          textDecoration: "underline",
+          textDecoration: "none",
           cursor: "pointer",
           "&:visited": {
             color: odysseyTokens.TypographyColorAction
@@ -1584,10 +1588,10 @@ export const components = _ref => {
             lineHeight: 1
           },
           ".Link-indicator": {
-            marginInlineStart: odysseyTokens.Spacing2
+            marginInlineStart: odysseyTokens.Spacing1
           },
           ".Link-icon": {
-            marginInlineEnd: odysseyTokens.Spacing2
+            marginInlineEnd: odysseyTokens.Spacing1
           },
           svg: {
             fontSize: "1em",
@@ -1722,7 +1726,7 @@ export const components = _ref => {
     },
     MuiModal: {
       defaultProps: {
-        container: shadowRootElement
+        container: shadowDomElement
       }
     },
     MuiNativeSelect: {
@@ -1757,7 +1761,7 @@ export const components = _ref => {
     },
     MuiPopover: {
       defaultProps: {
-        container: shadowRootElement
+        container: shadowDomElement
       },
       styleOverrides: {
         paper: {
@@ -1770,7 +1774,7 @@ export const components = _ref => {
     },
     MuiPopper: {
       defaultProps: {
-        container: shadowRootElement
+        container: shadowDomElement
       }
     },
     MuiRadio: {
@@ -1935,17 +1939,16 @@ export const components = _ref => {
             maxWidth: `calc(${odysseyTokens.TypographyLineLengthMax} / 2)`,
             minWidth: "unset",
             minHeight: "unset",
-            padding: `${odysseyTokens.Spacing4} 0`,
+            padding: `${odysseyTokens.Spacing4} ${odysseyTokens.Spacing1}`,
+            fontSize: odysseyTokens.TypographySizeHeading6,
             fontFamily: odysseyTokens.TypographyFamilyHeading,
             lineHeight: odysseyTokens.TypographyLineHeightUi,
             overflow: "visible",
-            ...(ownerState.textColor === "inherit" && {
-              color: "inherit",
-              opacity: 1
-            }),
+            color: odysseyTokens.HueNeutral600,
+            opacity: 1,
             ...(ownerState.selected == true && {
               color: odysseyTokens.TypographyColorAction,
-              fontWeight: odysseyTokens.TypographyWeightBodyBold
+              fontWeight: odysseyTokens.TypographyWeightHeading
             }),
             ...(ownerState.disabled && {
               color: odysseyTokens.TypographyColorDisabled