[material-ui][Alert] Update TypeScript types to allow color override …

…types to be added to `iconMapping` and `severity` props (#40551) Co-authored-by: ZeeshanTamboli <zeeshan.tamboli@gmail.com>
mui · Jan 17, 2024 · 664e9b7 · 664e9b7
1 parent d3cf1c9
commit 664e9b7
Show file tree

Hide file tree

Showing 3 changed files with 10 additions and 5 deletions.
diff --git a/docs/pages/material-ui/api/alert.json b/docs/pages/material-ui/api/alert.json
@@ -38,8 +38,8 @@
     "role": { "type": { "name": "string" }, "default": "'alert'" },
     "severity": {
       "type": {
-        "name": "enum",
-        "description": "'error'<br>&#124;&nbsp;'info'<br>&#124;&nbsp;'success'<br>&#124;&nbsp;'warning'"
+        "name": "union",
+        "description": "'error'<br>&#124;&nbsp;'info'<br>&#124;&nbsp;'success'<br>&#124;&nbsp;'warning'<br>&#124;&nbsp;string"
       },
       "default": "'success'"
     },

diff --git a/packages/mui-material/src/Alert/Alert.d.ts b/packages/mui-material/src/Alert/Alert.d.ts
@@ -62,7 +62,7 @@ export interface AlertProps extends StandardProps<PaperProps, 'variant'> {
    * The severity of the alert. This defines the color and icon used.
    * @default 'success'
    */
-  severity?: AlertColor;
+  severity?: OverridableStringUnion<AlertColor, AlertPropsColorOverrides>;
   /**
    * Override the icon displayed before the children.
    * Unless provided, the icon is mapped to the value of the `severity` prop.
@@ -80,7 +80,9 @@ export interface AlertProps extends StandardProps<PaperProps, 'variant'> {
    * If you wish to change this mapping, you can provide your own.
    * Alternatively, you can use the `icon` prop to override the icon displayed.
    */
-  iconMapping?: Partial<Record<AlertColor, React.ReactNode>>;
+  iconMapping?: Partial<
+    Record<OverridableStringUnion<AlertColor, AlertPropsColorOverrides>, React.ReactNode>
+  >;
   /**
    * Callback fired when the component requests to be closed.
    * When provided and no `action` prop is set, a close icon button is displayed that triggers the callback when clicked.

diff --git a/packages/mui-material/src/Alert/Alert.js b/packages/mui-material/src/Alert/Alert.js
@@ -308,7 +308,10 @@ Alert.propTypes /* remove-proptypes */ = {
    * The severity of the alert. This defines the color and icon used.
    * @default 'success'
    */
-  severity: PropTypes.oneOf(['error', 'info', 'success', 'warning']),
+  severity: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([
+    PropTypes.oneOf(['error', 'info', 'success', 'warning']),
+    PropTypes.string,
+  ]),
   /**
    * The extra props for the slot components.
    * You can override the existing props or add new ones.