@okta/odyssey-react-mui 1.13.1 → 1.13.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@okta/odyssey-react-mui",
-  "version": "1.13.1",
+  "version": "1.13.3",
   "description": "React MUI components for Odyssey, Okta's design system",
   "author": "Okta, Inc.",
   "license": "Apache-2.0",
@@ -51,7 +51,7 @@
     "@mui/system": "^5.14.9",
     "@mui/utils": "^5.11.2",
     "@mui/x-date-pickers": "^5.0.15",
-    "@okta/odyssey-design-tokens": "1.13.1",
+    "@okta/odyssey-design-tokens": "1.13.3",
     "date-fns": "^2.30.0",
     "i18next": "^23.5.1",
     "material-react-table": "^2.0.2",
@@ -63,5 +63,5 @@
     "react": ">=17 <19",
     "react-dom": ">=17 <19"
   },
-  "gitHead": "be8728a2fcf8943a503d9d5e7e39a7348a970d79"
+  "gitHead": "e3fba02f71f76a8a2de99931b8febc2fbc15ffb8"
 }

package/src/@types/react-augment.d.ts

@@ -10,12 +10,8 @@
  * See the License for the specific language governing permissions and limitations under the License.
  */
 
-import { FC } from "react";
-export interface ForwardRefWithType extends FC<WithForwardRefProps<Option>> {
-  <T extends Option>(props: WithForwardRefProps<T>): ReturnType<
-    FC<WithForwardRefProps<T>>
-  >;
-}
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+import React from "react";
 
 declare module "react" {
   type DataAttributeKey = `data-${string}`;

package/src/Checkbox.tsx

@@ -21,14 +21,14 @@ import {
 } from "@mui/material";
 
 import { FieldComponentProps } from "./FieldComponentProps";
-import { Typography } from "./Typography";
+import { CheckedFieldProps } from "./FormCheckedProps";
 import type { HtmlProps } from "./HtmlProps";
 import {
   ComponentControlledState,
   FocusHandle,
   getControlState,
 } from "./inputUtils";
-import { CheckedFieldProps } from "./FormCheckedProps";
+import { Typography } from "./Typography";
 
 export const checkboxValidityValues = ["valid", "invalid", "inherit"] as const;
 

package/src/NativeSelect.tsx

@@ -28,7 +28,6 @@ import { Field } from "./Field";
 import { FieldComponentProps } from "./FieldComponentProps";
 import type { HtmlProps } from "./HtmlProps";
 import { FocusHandle, getControlState, useInputValues } from "./inputUtils";
-import { ForwardRefWithType } from "./@types/react-augment";
 
 export type NativeSelectOption = {
   text: string;
@@ -105,7 +104,7 @@ export type NativeSelectProps<
 > &
   HtmlProps;
 
-const NativeSelect: ForwardRefWithType = forwardRef(
+const NativeSelect = forwardRef(
   <
     Value extends NativeSelectValueType<HasMultipleChoices>,
     HasMultipleChoices extends boolean

package/src/index.ts

@@ -52,7 +52,6 @@ export type {
   ThemeOptions,
 } from "@mui/material";
 
-export type { ForwardRefWithType } from "./@types/react-augment";
 export type { FocusHandle } from "./inputUtils";
 
 export { useOdysseyDesignTokens } from "./OdysseyDesignTokensContext";

package/src/theme/components.tsx

@@ -744,6 +744,7 @@ export const components = ({
       styleOverrides: {
         root: ({ theme }) => ({
           width: `${odysseyTokens.TypographyLineHeightUi}em`,
+          minWidth: `${odysseyTokens.TypographyLineHeightUi}em`,
           height: `${odysseyTokens.TypographyLineHeightUi}em`,
           borderRadius: odysseyTokens.BorderRadiusTight,
           borderWidth: odysseyTokens.BorderWidthMain,
@@ -1544,6 +1545,9 @@ export const components = ({
           "&.Mui-disabled": {
             pointerEvents: "none",
           },
+          [`:has(> .${radioClasses.root})`]: {
+            alignItems: "flex-start",
+          },
           [`& .${checkboxClasses.root}`]: {
             marginBlockStart: 0,
           },
@@ -2059,6 +2063,7 @@ export const components = ({
       styleOverrides: {
         root: ({ theme }) => ({
           width: `${odysseyTokens.TypographyLineHeightUi}em`,
+          minWidth: `${odysseyTokens.TypographyLineHeightUi}em`,
           height: `${odysseyTokens.TypographyLineHeightUi}em`,
           borderRadius: `${odysseyTokens.TypographyLineHeightUi}em`,
           borderWidth: odysseyTokens.BorderWidthMain,