[core] Fix propTypes in components where OverridableStringUnion is us…

…ed (mui#30682)
wladimirguerra · Feb 2, 2022 · b1ca57a · b1ca57a
1 parent 353aafd
commit b1ca57a
Show file tree

Hide file tree

Showing 10 changed files with 41 additions and 20 deletions.
diff --git a/docs/pages/api-docs/image-list.json b/docs/pages/api-docs/image-list.json
@@ -17,8 +17,8 @@
     },
     "variant": {
       "type": {
-        "name": "enum",
-        "description": "'masonry'<br>&#124;&nbsp;'quilted'<br>&#124;&nbsp;'standard'<br>&#124;&nbsp;'woven'"
+        "name": "union",
+        "description": "'masonry'<br>&#124;&nbsp;'quilted'<br>&#124;&nbsp;'standard'<br>&#124;&nbsp;'woven'<br>&#124;&nbsp;string"
       },
       "default": "'standard'"
     }

diff --git a/docs/pages/api-docs/loading-button.json b/docs/pages/api-docs/loading-button.json
@@ -23,8 +23,8 @@
     },
     "variant": {
       "type": {
-        "name": "enum",
-        "description": "'contained'<br>&#124;&nbsp;'outlined'<br>&#124;&nbsp;'text'"
+        "name": "union",
+        "description": "'contained'<br>&#124;&nbsp;'outlined'<br>&#124;&nbsp;'text'<br>&#124;&nbsp;string"
       },
       "default": "'text'"
     }

diff --git a/docs/pages/api-docs/slider.json b/docs/pages/api-docs/slider.json
@@ -51,7 +51,10 @@
     },
     "scale": { "type": { "name": "func" }, "default": "(x) => x" },
     "size": {
-      "type": { "name": "enum", "description": "'small'<br>&#124;&nbsp;'medium'" },
+      "type": {
+        "name": "union",
+        "description": "'small'<br>&#124;&nbsp;'medium'<br>&#124;&nbsp;string"
+      },
       "default": "'medium'"
     },
     "step": { "type": { "name": "number" }, "default": "1" },

diff --git a/framer/Material-UI.framerfx/code/Slider.tsx b/framer/Material-UI.framerfx/code/Slider.tsx
@@ -8,7 +8,6 @@ interface Props {
   max?: number;
   min?: number;
   orientation?: 'horizontal' | 'vertical';
-  size: 'small' | 'medium';
   step?: number;
   tabIndex?: number;
   track?: 'inverted' | 'normal' | false;
@@ -23,7 +22,6 @@ export function Slider(props: Props): JSX.Element {
 }
 
 Slider.defaultProps = {
-  size: 'medium' as 'medium',
   width: 160,
   height: 24,
 };
@@ -50,11 +48,6 @@ addPropertyControls(Slider, {
     title: 'Orientation',
     options: ['horizontal', 'vertical'],
   },
-  size: {
-    type: ControlType.Enum,
-    title: 'Size',
-    options: ['small', 'medium'],
-  },
   step: {
     type: ControlType.Number,
     title: 'Step',

diff --git a/framer/scripts/framerConfig.js b/framer/scripts/framerConfig.js
@@ -311,6 +311,7 @@ export const componentSettings = {
       'sx',
       // FIXME: `Union`
       'color',
+      'size',
     ],
     propValues: {
       width: 160,

diff --git a/packages/mui-joy/src/Button/Button.tsx b/packages/mui-joy/src/Button/Button.tsx
@@ -219,7 +219,10 @@ Button.propTypes /* remove-proptypes */ = {
    * The color of the component. It supports those theme colors that make sense for this component.
    * @default 'primary'
    */
-  color: PropTypes.oneOf(['context', 'danger', 'info', 'neutral', 'primary', 'success', 'warning']),
+  color: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([
+    PropTypes.oneOf(['context', 'danger', 'info', 'neutral', 'primary', 'success', 'warning']),
+    PropTypes.string,
+  ]),
   /**
    * The component used for the root node.
    * Either a string to use a HTML element or a component.
@@ -237,7 +240,10 @@ Button.propTypes /* remove-proptypes */ = {
   /**
    * The size of the component.
    */
-  size: PropTypes.oneOf(['sm', 'md', 'lg']),
+  size: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([
+    PropTypes.oneOf(['sm', 'md', 'lg']),
+    PropTypes.string,
+  ]),
   /**
    * Element placed before the children.
    */
@@ -246,7 +252,10 @@ Button.propTypes /* remove-proptypes */ = {
    * The variant to use.
    * @default 'contained'
    */
-  variant: PropTypes.oneOf(['contained', 'light', 'outlined', 'text']),
+  variant: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([
+    PropTypes.oneOf(['contained', 'light', 'outlined', 'text']),
+    PropTypes.string,
+  ]),
 } as any;
 
 export default Button;
diff --git a/packages/mui-joy/src/Switch/Switch.tsx b/packages/mui-joy/src/Switch/Switch.tsx
@@ -219,7 +219,10 @@ Switch.propTypes /* remove-proptypes */ = {
    * The color of the component. It supports those theme colors that make sense for this component.
    * @default 'primary'
    */
-  color: PropTypes.oneOf(['danger', 'info', 'primary', 'success', 'warning']),
+  color: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([
+    PropTypes.oneOf(['danger', 'info', 'primary', 'success', 'warning']),
+    PropTypes.string,
+  ]),
   /**
    * The component used for the Root slot.
    * Either a string to use a HTML element or a component.
@@ -278,7 +281,10 @@ Switch.propTypes /* remove-proptypes */ = {
    * The size of the component.
    * @default 'md'
    */
-  size: PropTypes.oneOf(['sm', 'md', 'lg']),
+  size: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([
+    PropTypes.oneOf(['sm', 'md', 'lg']),
+    PropTypes.string,
+  ]),
 } as any;
 
 export default Switch;
diff --git a/packages/mui-lab/src/LoadingButton/LoadingButton.js b/packages/mui-lab/src/LoadingButton/LoadingButton.js
@@ -266,7 +266,10 @@ LoadingButton.propTypes /* remove-proptypes */ = {
    * The variant to use.
    * @default 'text'
    */
-  variant: PropTypes.oneOf(['contained', 'outlined', 'text']),
+  variant: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([
+    PropTypes.oneOf(['contained', 'outlined', 'text']),
+    PropTypes.string,
+  ]),
 };
 
 export default LoadingButton;
diff --git a/packages/mui-material/src/ImageList/ImageList.js b/packages/mui-material/src/ImageList/ImageList.js
@@ -153,7 +153,10 @@ ImageList.propTypes /* remove-proptypes */ = {
    * The variant to use.
    * @default 'standard'
    */
-  variant: PropTypes.oneOf(['masonry', 'quilted', 'standard', 'woven']),
+  variant: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([
+    PropTypes.oneOf(['masonry', 'quilted', 'standard', 'woven']),
+    PropTypes.string,
+  ]),
 };
 
 export default ImageList;
diff --git a/packages/mui-material/src/Slider/Slider.js b/packages/mui-material/src/Slider/Slider.js
@@ -716,7 +716,10 @@ Slider.propTypes /* remove-proptypes */ = {
    * The size of the slider.
    * @default 'medium'
    */
-  size: PropTypes.oneOf(['small', 'medium']),
+  size: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([
+    PropTypes.oneOf(['small', 'medium']),
+    PropTypes.string,
+  ]),
   /**
    * The granularity with which the slider can step through values. (A "discrete" slider.)
    * The `min` prop serves as the origin for the valid values.