@okta/odyssey-react-mui 1.12.7 → 1.12.8

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@okta/odyssey-react-mui",
-  "version": "1.12.7",
+  "version": "1.12.8",
   "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.12.7",
+    "@okta/odyssey-design-tokens": "1.12.8",
     "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": "d5957fea940e6021fa1959ed1ce34687f63e2778"
+  "gitHead": "032e8684c712c715728e8f406eb88054cfdbe55d"
 }

package/src/MenuButton.tsx

@@ -10,6 +10,14 @@
  * See the License for the specific language governing permissions and limitations under the License.
  */
 
+import { memo, type ReactElement, useCallback, useMemo, useState } from "react";
+import {
+  Divider,
+  ListSubheader,
+  Menu as MuiMenu,
+  PopoverOrigin,
+} from "@mui/material";
+
 import {
   Button,
   buttonSizeValues,
@@ -17,15 +25,8 @@ import {
   MenuItem,
   useUniqueId,
 } from "./";
-import {
-  Divider,
-  ListSubheader,
-  Menu as MuiMenu,
-  PopoverOrigin,
-} from "@mui/material";
 import { ChevronDownIcon, MoreIcon } from "./icons.generated";
-import { memo, type ReactElement, useCallback, useMemo, useState } from "react";
-
+import { FieldComponentProps } from "./FieldComponentProps";
 import { MenuContext, MenuContextType } from "./MenuContext";
 import { NullElement } from "./NullElement";
 import type { AllowedProps } from "./AllowedProps";
@@ -109,6 +110,7 @@ export type MenuButtonProps = {
       buttonLabel?: undefined | "";
     }
 ) &
+  Pick<FieldComponentProps, "isDisabled"> &
   AllowedProps;
 
 const MenuButton = ({
@@ -121,6 +123,7 @@ const MenuButton = ({
   shouldCloseOnSelect = true,
   endIcon: endIconProp,
   id: idOverride,
+  isDisabled,
   isOverflow,
   menuAlignment = "left",
   size,
@@ -194,6 +197,7 @@ const MenuButton = ({
         data-se={testId}
         endIcon={endIcon}
         id={`${uniqueId}-button`}
+        isDisabled={isDisabled}
         label={buttonLabel}
         onClick={openMenu}
         size={size}

package/src/theme/components.tsx

@@ -1935,6 +1935,10 @@ export const components = ({
 
           [`&.${menuItemClasses.root}-destructive`]: {
             color: odysseyTokens.TypographyColorDanger,
+
+            [`.${typographyClasses.root}`]: {
+              color: "inherit",
+            },
           },
 
           [`&.${menuItemClasses.selected}`]: {
@@ -1961,6 +1965,10 @@ export const components = ({
           [`&.${menuItemClasses.disabled}`]: {
             opacity: 1,
             color: odysseyTokens.TypographyColorDisabled,
+
+            [`.${typographyClasses.root}`]: {
+              color: "inherit",
+            },
           },
 
           [`& + .${dividerClasses.root}`]: {