[framer] Update with latest sources

.circleci/config.yml

@@ -136,6 +136,12 @@ jobs:
       - run:
           name: '`yarn docs:api` changes committed?'
           command: git diff --exit-code
+      - run:
+          name: Generate the framer components
+          command: yarn workspace framer build
+      - run:
+          name: '`yarn workspace framer build` changes committed?'
+          command: git diff --exit-code
       - run:
           name: Lint
           command: yarn lint:ci

framer/Material-UI.framerfx/code/Button.tsx

@@ -6,36 +6,36 @@ import MuiButton from '@material-ui/core/Button';
 import { Icon } from './Icon';
 
 interface Props {
-  color?: 'default' | 'inherit' | 'primary' | 'secondary';
+  color?: 'inherit' | 'primary' | 'secondary';
   disabled?: boolean;
   disableElevation?: boolean;
   endIcon?: string;
   fullWidth?: boolean;
   href?: string;
-  size?: 'small' | 'medium' | 'large';
+  size?: 'large' | 'medium' | 'small';
   startIcon?: string;
-  variant?: 'text' | 'outlined' | 'contained';
   startIconTheme?: 'Filled' | 'Outlined' | 'Rounded' | 'TwoTone' | 'Sharp';
   endIconTheme?: 'Filled' | 'Outlined' | 'Rounded' | 'TwoTone' | 'Sharp';
   label?: string;
   width?: number;
   height?: number;
+  variant?: 'contained' | 'outlined' | 'text';
 }
 
 const defaultProps: Props = {
-  color: 'default',
+  color: 'primary',
   disabled: false,
   disableElevation: false,
   endIcon: undefined,
   fullWidth: false,
   size: 'medium',
   startIcon: undefined,
-  variant: 'text',
   startIconTheme: 'Filled',
   endIconTheme: 'Filled',
   label: 'Button',
   width: 100,
   height: 38,
+  variant: 'text',
 };
 
 export const Button: React.SFC<Props> = (props: Props) => {
@@ -69,7 +69,7 @@ addPropertyControls(Button, {
   color: {
     type: ControlType.Enum,
     title: 'Color',
-    options: ['default', 'inherit', 'primary', 'secondary'],
+    options: ['inherit', 'primary', 'secondary'],
   },
   disabled: {
     type: ControlType.Boolean,
@@ -94,17 +94,12 @@ addPropertyControls(Button, {
   size: {
     type: ControlType.Enum,
     title: 'Size',
-    options: ['small', 'medium', 'large'],
+    options: ['large', 'medium', 'small'],
   },
   startIcon: {
     type: ControlType.String,
     title: 'Start icon',
   },
-  variant: {
-    type: ControlType.Enum,
-    title: 'Variant',
-    options: ['text', 'outlined', 'contained'],
-  },
   startIconTheme: {
     type: ControlType.Enum,
     title: 'Start icon theme',
@@ -119,4 +114,9 @@ addPropertyControls(Button, {
     type: ControlType.String,
     title: 'Label',
   },
+  variant: {
+    type: ControlType.Enum,
+    title: 'Variant',
+    options: ['contained', 'outlined', 'text'],
+  },
 });

framer/Material-UI.framerfx/code/Checkbox.tsx

@@ -50,7 +50,7 @@ addPropertyControls(Checkbox, {
   color: {
     type: ControlType.Enum,
     title: 'Color',
-    options: ['primary', 'secondary', 'default'],
+    options: ['default', 'primary', 'secondary'],
   },
   disabled: {
     type: ControlType.Boolean,
@@ -59,7 +59,7 @@ addPropertyControls(Checkbox, {
   size: {
     type: ControlType.Enum,
     title: 'Size',
-    options: ['small', 'medium'],
+    options: ['medium', 'small'],
   },
   label: {
     type: ControlType.String,

framer/Material-UI.framerfx/code/Chip.tsx

@@ -13,7 +13,7 @@ interface Props {
   disabled?: boolean;
   icon?: string;
   label?: string;
-  size?: 'small' | 'medium';
+  size?: 'medium' | 'small';
   variant?: 'default' | 'outlined';
   avatarImageFile?: string;
   avatarImageUrl?: string;
@@ -99,7 +99,7 @@ addPropertyControls(Chip, {
   size: {
     type: ControlType.Enum,
     title: 'Size',
-    options: ['small', 'medium'],
+    options: ['medium', 'small'],
   },
   variant: {
     type: ControlType.Enum,

framer/Material-UI.framerfx/code/CircularProgress.tsx

@@ -5,7 +5,7 @@ import { addPropertyControls, ControlType } from 'framer';
 import MuiCircularProgress from '@material-ui/core/CircularProgress';
 
 interface Props {
-  color?: 'primary' | 'secondary' | 'inherit';
+  color?: 'inherit' | 'primary' | 'secondary';
   thickness?: number;
   value?: number;
   variant?: 'determinate' | 'indeterminate' | 'static';
@@ -38,7 +38,7 @@ addPropertyControls(CircularProgress, {
   color: {
     type: ControlType.Enum,
     title: 'Color',
-    options: ['primary', 'secondary', 'inherit'],
+    options: ['inherit', 'primary', 'secondary'],
   },
   thickness: {
     type: ControlType.Number,

framer/Material-UI.framerfx/code/Fab.tsx

@@ -9,8 +9,8 @@ interface Props {
   color?: 'default' | 'inherit' | 'primary' | 'secondary';
   disabled?: boolean;
   href?: string;
-  size?: 'small' | 'medium' | 'large';
-  variant?: 'round' | 'extended';
+  size?: 'large' | 'medium' | 'small';
+  variant?: 'extended' | 'round';
   icon?: string;
   iconTheme?: 'Filled' | 'Outlined' | 'Rounded' | 'TwoTone' | 'Sharp';
   label?: string;
@@ -65,12 +65,12 @@ addPropertyControls(Fab, {
   size: {
     type: ControlType.Enum,
     title: 'Size',
-    options: ['small', 'medium', 'large'],
+    options: ['large', 'medium', 'small'],
   },
   variant: {
     type: ControlType.Enum,
     title: 'Variant',
-    options: ['round', 'extended'],
+    options: ['extended', 'round'],
   },
   icon: {
     type: ControlType.String,

framer/Material-UI.framerfx/code/Icon.tsx

@@ -6,7 +6,7 @@ import { addPropertyControls, ControlType } from 'framer';
 import * as Icons from '@material-ui/icons';
 
 interface Props {
-  color?: 'inherit' | 'primary' | 'secondary' | 'action' | 'error' | 'disabled';
+  color?: 'action' | 'disabled' | 'error' | 'inherit' | 'primary' | 'secondary';
   icon?: string;
   theme?: 'Filled' | 'Outlined' | 'Rounded' | 'TwoTone' | 'Sharp';
   width?: number;
@@ -37,7 +37,7 @@ addPropertyControls(Icon, {
   color: {
     type: ControlType.Enum,
     title: 'Color',
-    options: ['inherit', 'primary', 'secondary', 'action', 'error', 'disabled'],
+    options: ['action', 'disabled', 'error', 'inherit', 'primary', 'secondary'],
   },
   icon: {
     type: ControlType.String,

framer/Material-UI.framerfx/code/IconButton.tsx

@@ -11,7 +11,7 @@ import { Icon } from './Icon';
 interface Props {
   color?: 'default' | 'inherit' | 'primary' | 'secondary';
   disabled?: boolean;
-  size?: 'small' | 'medium';
+  size?: 'medium' | 'small';
   icon?: string;
   iconTheme?: 'Filled' | 'Outlined' | 'Rounded' | 'TwoTone' | 'Sharp';
   badgeContent?: string;
@@ -61,7 +61,7 @@ addPropertyControls(IconButton, {
   size: {
     type: ControlType.Enum,
     title: 'Size',
-    options: ['small', 'medium'],
+    options: ['medium', 'small'],
   },
   icon: {
     type: ControlType.String,

framer/Material-UI.framerfx/code/LinearProgress.tsx

@@ -8,7 +8,7 @@ interface Props {
   color?: 'primary' | 'secondary';
   value?: number;
   valueBuffer?: number;
-  variant?: 'determinate' | 'indeterminate' | 'buffer' | 'query';
+  variant?: 'buffer' | 'determinate' | 'indeterminate' | 'query';
   width?: number;
   height?: number;
 }
@@ -54,6 +54,6 @@ addPropertyControls(LinearProgress, {
   variant: {
     type: ControlType.Enum,
     title: 'Variant',
-    options: ['determinate', 'indeterminate', 'buffer', 'query'],
+    options: ['buffer', 'determinate', 'indeterminate', 'query'],
   },
 });

framer/Material-UI.framerfx/code/ListItem.tsx

@@ -26,7 +26,7 @@ import { Icon } from './Icon';
 import { IconButton } from './IconButton';
 
 interface Props {
-  alignItems?: 'flex-start' | 'center';
+  alignItems?: 'center' | 'flex-start';
   autoFocus?: boolean;
   button?: boolean;
   dense?: boolean;
@@ -145,7 +145,7 @@ addPropertyControls(ListItem, {
   alignItems: {
     type: ControlType.Enum,
     title: 'Align items',
-    options: ['flex-start', 'center'],
+    options: ['center', 'flex-start'],
   },
   autoFocus: {
     type: ControlType.Boolean,

framer/Material-UI.framerfx/code/Radio.tsx

@@ -8,9 +8,9 @@ import FormControlLabel from '@material-ui/core/FormControlLabel';
 import MuiRadio from '@material-ui/core/Radio';
 
 interface Props {
-  color?: 'primary' | 'secondary' | 'default';
+  color?: 'default' | 'primary' | 'secondary';
   disabled?: boolean;
-  size?: 'small' | 'medium';
+  size?: 'medium' | 'small';
   label?: string;
   width?: number;
   height?: number;
@@ -35,7 +35,7 @@ addPropertyControls(Radio, {
   color: {
     type: ControlType.Enum,
     title: 'Color',
-    options: ['primary', 'secondary', 'default'],
+    options: ['default', 'primary', 'secondary'],
   },
   disabled: {
     type: ControlType.Boolean,
@@ -44,7 +44,7 @@ addPropertyControls(Radio, {
   size: {
     type: ControlType.Enum,
     title: 'Size',
-    options: ['small', 'medium'],
+    options: ['medium', 'small'],
   },
   label: {
     type: ControlType.String,

framer/Material-UI.framerfx/code/Slider.tsx

@@ -11,8 +11,8 @@ interface Props {
   min?: number;
   orientation?: 'horizontal' | 'vertical';
   step?: number;
-  track?: 'normal' | false | 'inverted';
-  valueLabelDisplay?: 'on' | 'auto' | 'off';
+  track?: 'inverted' | 'normal' | false;
+  valueLabelDisplay?: 'auto' | 'off' | 'on';
   width?: number;
   height?: number;
 }
@@ -67,11 +67,11 @@ addPropertyControls(Slider, {
   track: {
     type: ControlType.Enum,
     title: 'Track',
-    options: ['normal', false, 'inverted'],
+    options: ['inverted', 'normal', false],
   },
   valueLabelDisplay: {
     type: ControlType.Enum,
     title: 'Value label display',
-    options: ['on', 'auto', 'off'],
+    options: ['auto', 'off', 'on'],
   },
 });

framer/Material-UI.framerfx/code/Switch.tsx

@@ -50,7 +50,7 @@ addPropertyControls(Switch, {
   color: {
     type: ControlType.Enum,
     title: 'Color',
-    options: ['primary', 'secondary', 'default'],
+    options: ['default', 'primary', 'secondary'],
   },
   disabled: {
     type: ControlType.Boolean,
@@ -59,7 +59,7 @@ addPropertyControls(Switch, {
   size: {
     type: ControlType.Enum,
     title: 'Size',
-    options: ['small', 'medium'],
+    options: ['medium', 'small'],
   },
   label: {
     type: ControlType.String,

framer/Material-UI.framerfx/code/Tabs.tsx

@@ -13,10 +13,11 @@ import { Icon } from './Icon';
 
 interface Props {
   centered?: boolean;
-  indicatorColor?: 'secondary' | 'primary';
-  scrollButtons?: 'auto' | 'desktop' | 'on' | 'off';
-  textColor?: 'secondary' | 'primary' | 'inherit';
-  variant?: 'standard' | 'scrollable' | 'fullWidth';
+  indicatorColor?: 'primary' | 'secondary';
+  scrollButtons?: 'auto' | 'desktop' | 'off' | 'on';
+  selectionFollowsFocus?: boolean;
+  textColor?: 'inherit' | 'primary' | 'secondary';
+  variant?: 'fullWidth' | 'scrollable' | 'standard';
   appBarColor?: 'default' | 'primary' | 'secondary' | 'inherit';
   icons?: string[];
   labels?: string[];
@@ -80,22 +81,26 @@ addPropertyControls(Tabs, {
   indicatorColor: {
     type: ControlType.Enum,
     title: 'Indicator color',
-    options: ['secondary', 'primary'],
+    options: ['primary', 'secondary'],
   },
   scrollButtons: {
     type: ControlType.Enum,
     title: 'Scroll buttons',
-    options: ['auto', 'desktop', 'on', 'off'],
+    options: ['auto', 'desktop', 'off', 'on'],
+  },
+  selectionFollowsFocus: {
+    type: ControlType.Boolean,
+    title: 'Selection follows focus',
   },
   textColor: {
     type: ControlType.Enum,
     title: 'Text color',
-    options: ['secondary', 'primary', 'inherit'],
+    options: ['inherit', 'primary', 'secondary'],
   },
   variant: {
     type: ControlType.Enum,
     title: 'Variant',
-    options: ['standard', 'scrollable', 'fullWidth'],
+    options: ['fullWidth', 'scrollable', 'standard'],
   },
   appBarColor: {
     type: ControlType.Enum,

framer/Material-UI.framerfx/code/TextField.tsx

@@ -15,8 +15,8 @@ interface Props {
   multiline?: boolean;
   placeholder?: string;
   required?: boolean;
-  size?: 'small' | 'medium';
-  variant?: 'standard' | 'outlined' | 'filled';
+  size?: 'medium' | 'small';
+  variant?: 'filled' | 'outlined' | 'standard';
   width?: number;
   height?: number;
 }
@@ -90,11 +90,11 @@ addPropertyControls(TextField, {
   size: {
     type: ControlType.Enum,
     title: 'Size',
-    options: ['small', 'medium'],
+    options: ['medium', 'small'],
   },
   variant: {
     type: ControlType.Enum,
     title: 'Variant',
-    options: ['standard', 'outlined', 'filled'],
+    options: ['filled', 'outlined', 'standard'],
   },
 });