cozy-ui 111.2.0 → 111.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (7) hide show
  1. package/CHANGELOG.md +7 -0
  2. package/package.json +5 -9
  3. package/react/Buttons/Readme.md +3 -4
  4. package/react/Buttons/index.jsx +28 -4
  5. package/react/__snapshots__/examples.spec.jsx.snap +108 -0
  6. package/transpiled/react/Buttons/index.js +12 -5
  7. package/transpiled/react/stylesheet.css +1419 -1
package/CHANGELOG.md CHANGED
@@ -1,3 +1,10 @@
1
+ # [111.3.0](https://github.com/cozy/cozy-ui/compare/v111.2.0...v111.3.0) (2024-08-07)
2
+
3
+
4
+ ### Features
5
+
6
+ * **Buttons:** Support now `default, inherit, secondary` color for Text variant ([b9af84a](https://github.com/cozy/cozy-ui/commit/b9af84a))
7
+
1
8
  # [111.2.0](https://github.com/cozy/cozy-ui/compare/v111.1.1...v111.2.0) (2024-07-25)
2
9
 
3
10
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "cozy-ui",
3
- "version": "111.2.0",
3
+ "version": "111.3.0",
4
4
  "description": "Cozy apps UI SDK",
5
5
  "main": "./index.js",
6
6
  "bin": {
@@ -127,7 +127,6 @@
127
127
  "postcss-loader": "2.1.6",
128
128
  "pretty": "2.0.0",
129
129
  "prop-types": "15.7.2",
130
- "puppeteer": "21.6.1",
131
130
  "react": "16.12.0",
132
131
  "react-dom": "16.12.0",
133
132
  "react-hot-loader": "^4.3.11",
@@ -185,15 +184,9 @@
185
184
  "cozy-harvest-lib": "^6.7.3",
186
185
  "cozy-intent": ">=1.3.0",
187
186
  "cozy-sharing": ">=14.1.0",
188
- "puppeteer": "^1.20.0",
189
187
  "react": "^16.8.6",
190
188
  "react-dom": "^16.8.6"
191
189
  },
192
- "peerDependenciesMeta ": {
193
- "puppeteer": {
194
- "optional": true
195
- }
196
- },
197
190
  "eslintConfig": {
198
191
  "extends": [
199
192
  "eslint-config-cozy-app"
@@ -206,5 +199,8 @@
206
199
  },
207
200
  "browserslist": [
208
201
  "extends browserslist-config-cozy"
209
- ]
202
+ ],
203
+ "optionalDependencies": {
204
+ "puppeteer": "21.11.0"
205
+ }
210
206
  }
package/react/Buttons/Readme.md CHANGED
@@ -20,7 +20,6 @@ const variants = ['primary', 'secondary', 'ghost', 'text']
20
20
  const propsArr = [{}, { disabled: true }, { busy: true }]
21
21
 
22
22
  ;
23
-
24
23
  <Grid container>
25
24
  {propsArr.map(props =>
26
25
  <Grid item xs={12} sm={4} className="u-mb-1" key={JSON.stringify(props)}>
@@ -163,7 +162,7 @@ import Grid from 'cozy-ui/transpiled/react/Grid'
163
162
  import Paper from 'cozy-ui/transpiled/react/Paper'
164
163
 
165
164
  const variants = ['primary', 'secondary', 'ghost', 'text']
166
- const colors = ['success', 'error', 'warning', 'info']
165
+ const colors = ['default', 'inherit', 'primary', 'secondary', 'success', 'error', 'warning', 'info']
167
166
 
168
167
  ;
169
168
 
@@ -192,7 +191,7 @@ import Grid from 'cozy-ui/transpiled/react/Grid'
192
191
  import Paper from 'cozy-ui/transpiled/react/Paper'
193
192
 
194
193
  const variants = ['primary', 'secondary', 'ghost', 'text']
195
- const colors = ['success', 'error', 'warning', 'info']
194
+ const colors = ['default', 'inherit', 'primary', 'secondary', 'success', 'error', 'warning', 'info']
196
195
 
197
196
  ;
198
197
 
@@ -221,7 +220,7 @@ import Grid from 'cozy-ui/transpiled/react/Grid'
221
220
  import Paper from 'cozy-ui/transpiled/react/Paper'
222
221
 
223
222
  const variants = ['primary', 'secondary', 'ghost', 'text']
224
- const colors = ['success', 'error', 'warning', 'info']
223
+ const colors = ['default', 'inherit', 'primary', 'secondary', 'success', 'error', 'warning', 'info']
225
224
 
226
225
  ;
227
226
 
package/react/Buttons/index.jsx CHANGED
@@ -7,14 +7,27 @@ import MuiButton from '@material-ui/core/Button'
7
7
  import Icon from '../Icon'
8
8
  import SpinnerIcon from '../Icons/Spinner'
9
9
 
10
+ const CUSTOM_COLORS = ['success', 'error', 'warning', 'info']
11
+
10
12
  const DefaultButton = forwardRef(
11
- ({ className, color, label, busy, disabled, endIcon, ...props }, ref) => {
13
+ (
14
+ { variant, className, color, label, busy, disabled, endIcon, ...props },
15
+ ref
16
+ ) => {
17
+ const customColor = CUSTOM_COLORS.includes(color) ? color : 'primary'
18
+ const _color =
19
+ variant === 'text' && !CUSTOM_COLORS.includes(color) ? color : 'primary'
20
+
12
21
  return (
13
22
  <MuiButton
14
23
  {...props}
24
+ variant={variant}
15
25
  ref={ref}
16
- className={cx({ [`customColor-${color}`]: color }, className)}
17
- color="primary"
26
+ className={cx(
27
+ { [`customColor-${customColor}`]: customColor },
28
+ className
29
+ )}
30
+ color={_color}
18
31
  disabled={disabled || busy}
19
32
  endIcon={
20
33
  busy ? (
@@ -30,6 +43,7 @@ const DefaultButton = forwardRef(
30
43
  )
31
44
  }
32
45
  )
46
+
33
47
  DefaultButton.displayName = 'DefaultButton'
34
48
 
35
49
  DefaultButton.defaultProps = {
@@ -76,11 +90,21 @@ const Buttons = forwardRef(({ variant, className = '', ...props }, ref) => {
76
90
  return <DefaultButton className={className} {...props} ref={ref} />
77
91
  }
78
92
  })
93
+
79
94
  Buttons.displayName = 'Buttons'
80
95
 
81
96
  Buttons.propTypes = {
82
97
  variant: PropTypes.oneOf(['primary', 'secondary', 'ghost', 'text']),
83
- color: PropTypes.oneOf(['success', 'error', 'warning', 'info'])
98
+ color: PropTypes.oneOf([
99
+ 'default',
100
+ 'inherit',
101
+ 'primary',
102
+ 'secondary',
103
+ 'success',
104
+ 'error',
105
+ 'warning',
106
+ 'info'
107
+ ])
84
108
  }
85
109
 
86
110
  Buttons.defaultProps = {
package/react/__snapshots__/examples.spec.jsx.snap CHANGED
@@ -591,6 +591,42 @@ exports[`Buttons should render examples: Buttons 4`] = `
591
591
  exports[`Buttons should render examples: Buttons 5`] = `
592
592
  "<div data-testid=\\"mountNode\\">
593
593
  <div class=\\"MuiGrid-root MuiGrid-container\\">
594
+ <div class=\\"MuiGrid-root u-mb-1 MuiGrid-item MuiGrid-grid-xs-12 MuiGrid-grid-sm-6 MuiGrid-grid-md-3\\">
595
+ <div class=\\"styles__Stack--s___22WMg\\">
596
+ <div>default</div>
597
+ <div><button class=\\"MuiButtonBase-root MuiButton-root MuiButton-contained customColor-primary MuiButton-containedPrimary MuiButton-disableElevation\\" tabindex=\\"0\\" type=\\"button\\"><span class=\\"MuiButton-label\\">primary</span></button></div>
598
+ <div><button class=\\"MuiButtonBase-root MuiButton-root MuiButton-outlined customColor-primary MuiButton-outlinedPrimary MuiButton-disableElevation\\" tabindex=\\"0\\" type=\\"button\\"><span class=\\"MuiButton-label\\">secondary</span></button></div>
599
+ <div><button class=\\"MuiButtonBase-root MuiButton-root MuiButton-outlined customColor-primary ghost MuiButton-outlinedPrimary MuiButton-disableElevation\\" tabindex=\\"0\\" type=\\"button\\"><span class=\\"MuiButton-label\\">ghost</span></button></div>
600
+ <div><button class=\\"MuiButtonBase-root MuiButton-root MuiButton-text customColor-primary MuiButton-disableElevation\\" tabindex=\\"0\\" type=\\"button\\"><span class=\\"MuiButton-label\\">text</span></button></div>
601
+ </div>
602
+ </div>
603
+ <div class=\\"MuiGrid-root u-mb-1 MuiGrid-item MuiGrid-grid-xs-12 MuiGrid-grid-sm-6 MuiGrid-grid-md-3\\">
604
+ <div class=\\"styles__Stack--s___22WMg\\">
605
+ <div>inherit</div>
606
+ <div><button class=\\"MuiButtonBase-root MuiButton-root MuiButton-contained customColor-primary MuiButton-containedPrimary MuiButton-disableElevation\\" tabindex=\\"0\\" type=\\"button\\"><span class=\\"MuiButton-label\\">primary</span></button></div>
607
+ <div><button class=\\"MuiButtonBase-root MuiButton-root MuiButton-outlined customColor-primary MuiButton-outlinedPrimary MuiButton-disableElevation\\" tabindex=\\"0\\" type=\\"button\\"><span class=\\"MuiButton-label\\">secondary</span></button></div>
608
+ <div><button class=\\"MuiButtonBase-root MuiButton-root MuiButton-outlined customColor-primary ghost MuiButton-outlinedPrimary MuiButton-disableElevation\\" tabindex=\\"0\\" type=\\"button\\"><span class=\\"MuiButton-label\\">ghost</span></button></div>
609
+ <div><button class=\\"MuiButtonBase-root MuiButton-root MuiButton-text customColor-primary MuiButton-colorInherit MuiButton-disableElevation\\" tabindex=\\"0\\" type=\\"button\\"><span class=\\"MuiButton-label\\">text</span></button></div>
610
+ </div>
611
+ </div>
612
+ <div class=\\"MuiGrid-root u-mb-1 MuiGrid-item MuiGrid-grid-xs-12 MuiGrid-grid-sm-6 MuiGrid-grid-md-3\\">
613
+ <div class=\\"styles__Stack--s___22WMg\\">
614
+ <div>primary</div>
615
+ <div><button class=\\"MuiButtonBase-root MuiButton-root MuiButton-contained customColor-primary MuiButton-containedPrimary MuiButton-disableElevation\\" tabindex=\\"0\\" type=\\"button\\"><span class=\\"MuiButton-label\\">primary</span></button></div>
616
+ <div><button class=\\"MuiButtonBase-root MuiButton-root MuiButton-outlined customColor-primary MuiButton-outlinedPrimary MuiButton-disableElevation\\" tabindex=\\"0\\" type=\\"button\\"><span class=\\"MuiButton-label\\">secondary</span></button></div>
617
+ <div><button class=\\"MuiButtonBase-root MuiButton-root MuiButton-outlined customColor-primary ghost MuiButton-outlinedPrimary MuiButton-disableElevation\\" tabindex=\\"0\\" type=\\"button\\"><span class=\\"MuiButton-label\\">ghost</span></button></div>
618
+ <div><button class=\\"MuiButtonBase-root MuiButton-root MuiButton-text customColor-primary MuiButton-textPrimary MuiButton-disableElevation\\" tabindex=\\"0\\" type=\\"button\\"><span class=\\"MuiButton-label\\">text</span></button></div>
619
+ </div>
620
+ </div>
621
+ <div class=\\"MuiGrid-root u-mb-1 MuiGrid-item MuiGrid-grid-xs-12 MuiGrid-grid-sm-6 MuiGrid-grid-md-3\\">
622
+ <div class=\\"styles__Stack--s___22WMg\\">
623
+ <div>secondary</div>
624
+ <div><button class=\\"MuiButtonBase-root MuiButton-root MuiButton-contained customColor-primary MuiButton-containedPrimary MuiButton-disableElevation\\" tabindex=\\"0\\" type=\\"button\\"><span class=\\"MuiButton-label\\">primary</span></button></div>
625
+ <div><button class=\\"MuiButtonBase-root MuiButton-root MuiButton-outlined customColor-primary MuiButton-outlinedPrimary MuiButton-disableElevation\\" tabindex=\\"0\\" type=\\"button\\"><span class=\\"MuiButton-label\\">secondary</span></button></div>
626
+ <div><button class=\\"MuiButtonBase-root MuiButton-root MuiButton-outlined customColor-primary ghost MuiButton-outlinedPrimary MuiButton-disableElevation\\" tabindex=\\"0\\" type=\\"button\\"><span class=\\"MuiButton-label\\">ghost</span></button></div>
627
+ <div><button class=\\"MuiButtonBase-root MuiButton-root MuiButton-text customColor-primary MuiButton-textSecondary MuiButton-disableElevation\\" tabindex=\\"0\\" type=\\"button\\"><span class=\\"MuiButton-label\\">text</span></button></div>
628
+ </div>
629
+ </div>
594
630
  <div class=\\"MuiGrid-root u-mb-1 MuiGrid-item MuiGrid-grid-xs-12 MuiGrid-grid-sm-6 MuiGrid-grid-md-3\\">
595
631
  <div class=\\"styles__Stack--s___22WMg\\">
596
632
  <div>success</div>
@@ -634,6 +670,42 @@ exports[`Buttons should render examples: Buttons 5`] = `
634
670
  exports[`Buttons should render examples: Buttons 6`] = `
635
671
  "<div data-testid=\\"mountNode\\">
636
672
  <div class=\\"MuiGrid-root MuiGrid-container\\">
673
+ <div class=\\"MuiGrid-root u-mb-1 MuiGrid-item MuiGrid-grid-xs-12 MuiGrid-grid-sm-6 MuiGrid-grid-md-3\\">
674
+ <div class=\\"styles__Stack--s___22WMg\\">
675
+ <div>default</div>
676
+ <div><button class=\\"MuiButtonBase-root MuiButton-root MuiButton-contained customColor-primary MuiButton-containedPrimary MuiButton-disableElevation Mui-disabled Mui-disabled\\" tabindex=\\"-1\\" type=\\"button\\" disabled=\\"\\"><span class=\\"MuiButton-label\\">primary</span></button></div>
677
+ <div><button class=\\"MuiButtonBase-root MuiButton-root MuiButton-outlined customColor-primary MuiButton-outlinedPrimary MuiButton-disableElevation Mui-disabled Mui-disabled\\" tabindex=\\"-1\\" type=\\"button\\" disabled=\\"\\"><span class=\\"MuiButton-label\\">secondary</span></button></div>
678
+ <div><button class=\\"MuiButtonBase-root MuiButton-root MuiButton-outlined customColor-primary ghost MuiButton-outlinedPrimary MuiButton-disableElevation Mui-disabled Mui-disabled\\" tabindex=\\"-1\\" type=\\"button\\" disabled=\\"\\"><span class=\\"MuiButton-label\\">ghost</span></button></div>
679
+ <div><button class=\\"MuiButtonBase-root MuiButton-root MuiButton-text customColor-primary MuiButton-disableElevation Mui-disabled Mui-disabled\\" tabindex=\\"-1\\" type=\\"button\\" disabled=\\"\\"><span class=\\"MuiButton-label\\">text</span></button></div>
680
+ </div>
681
+ </div>
682
+ <div class=\\"MuiGrid-root u-mb-1 MuiGrid-item MuiGrid-grid-xs-12 MuiGrid-grid-sm-6 MuiGrid-grid-md-3\\">
683
+ <div class=\\"styles__Stack--s___22WMg\\">
684
+ <div>inherit</div>
685
+ <div><button class=\\"MuiButtonBase-root MuiButton-root MuiButton-contained customColor-primary MuiButton-containedPrimary MuiButton-disableElevation Mui-disabled Mui-disabled\\" tabindex=\\"-1\\" type=\\"button\\" disabled=\\"\\"><span class=\\"MuiButton-label\\">primary</span></button></div>
686
+ <div><button class=\\"MuiButtonBase-root MuiButton-root MuiButton-outlined customColor-primary MuiButton-outlinedPrimary MuiButton-disableElevation Mui-disabled Mui-disabled\\" tabindex=\\"-1\\" type=\\"button\\" disabled=\\"\\"><span class=\\"MuiButton-label\\">secondary</span></button></div>
687
+ <div><button class=\\"MuiButtonBase-root MuiButton-root MuiButton-outlined customColor-primary ghost MuiButton-outlinedPrimary MuiButton-disableElevation Mui-disabled Mui-disabled\\" tabindex=\\"-1\\" type=\\"button\\" disabled=\\"\\"><span class=\\"MuiButton-label\\">ghost</span></button></div>
688
+ <div><button class=\\"MuiButtonBase-root MuiButton-root MuiButton-text customColor-primary MuiButton-colorInherit MuiButton-disableElevation Mui-disabled Mui-disabled\\" tabindex=\\"-1\\" type=\\"button\\" disabled=\\"\\"><span class=\\"MuiButton-label\\">text</span></button></div>
689
+ </div>
690
+ </div>
691
+ <div class=\\"MuiGrid-root u-mb-1 MuiGrid-item MuiGrid-grid-xs-12 MuiGrid-grid-sm-6 MuiGrid-grid-md-3\\">
692
+ <div class=\\"styles__Stack--s___22WMg\\">
693
+ <div>primary</div>
694
+ <div><button class=\\"MuiButtonBase-root MuiButton-root MuiButton-contained customColor-primary MuiButton-containedPrimary MuiButton-disableElevation Mui-disabled Mui-disabled\\" tabindex=\\"-1\\" type=\\"button\\" disabled=\\"\\"><span class=\\"MuiButton-label\\">primary</span></button></div>
695
+ <div><button class=\\"MuiButtonBase-root MuiButton-root MuiButton-outlined customColor-primary MuiButton-outlinedPrimary MuiButton-disableElevation Mui-disabled Mui-disabled\\" tabindex=\\"-1\\" type=\\"button\\" disabled=\\"\\"><span class=\\"MuiButton-label\\">secondary</span></button></div>
696
+ <div><button class=\\"MuiButtonBase-root MuiButton-root MuiButton-outlined customColor-primary ghost MuiButton-outlinedPrimary MuiButton-disableElevation Mui-disabled Mui-disabled\\" tabindex=\\"-1\\" type=\\"button\\" disabled=\\"\\"><span class=\\"MuiButton-label\\">ghost</span></button></div>
697
+ <div><button class=\\"MuiButtonBase-root MuiButton-root MuiButton-text customColor-primary MuiButton-textPrimary MuiButton-disableElevation Mui-disabled Mui-disabled\\" tabindex=\\"-1\\" type=\\"button\\" disabled=\\"\\"><span class=\\"MuiButton-label\\">text</span></button></div>
698
+ </div>
699
+ </div>
700
+ <div class=\\"MuiGrid-root u-mb-1 MuiGrid-item MuiGrid-grid-xs-12 MuiGrid-grid-sm-6 MuiGrid-grid-md-3\\">
701
+ <div class=\\"styles__Stack--s___22WMg\\">
702
+ <div>secondary</div>
703
+ <div><button class=\\"MuiButtonBase-root MuiButton-root MuiButton-contained customColor-primary MuiButton-containedPrimary MuiButton-disableElevation Mui-disabled Mui-disabled\\" tabindex=\\"-1\\" type=\\"button\\" disabled=\\"\\"><span class=\\"MuiButton-label\\">primary</span></button></div>
704
+ <div><button class=\\"MuiButtonBase-root MuiButton-root MuiButton-outlined customColor-primary MuiButton-outlinedPrimary MuiButton-disableElevation Mui-disabled Mui-disabled\\" tabindex=\\"-1\\" type=\\"button\\" disabled=\\"\\"><span class=\\"MuiButton-label\\">secondary</span></button></div>
705
+ <div><button class=\\"MuiButtonBase-root MuiButton-root MuiButton-outlined customColor-primary ghost MuiButton-outlinedPrimary MuiButton-disableElevation Mui-disabled Mui-disabled\\" tabindex=\\"-1\\" type=\\"button\\" disabled=\\"\\"><span class=\\"MuiButton-label\\">ghost</span></button></div>
706
+ <div><button class=\\"MuiButtonBase-root MuiButton-root MuiButton-text customColor-primary MuiButton-textSecondary MuiButton-disableElevation Mui-disabled Mui-disabled\\" tabindex=\\"-1\\" type=\\"button\\" disabled=\\"\\"><span class=\\"MuiButton-label\\">text</span></button></div>
707
+ </div>
708
+ </div>
637
709
  <div class=\\"MuiGrid-root u-mb-1 MuiGrid-item MuiGrid-grid-xs-12 MuiGrid-grid-sm-6 MuiGrid-grid-md-3\\">
638
710
  <div class=\\"styles__Stack--s___22WMg\\">
639
711
  <div>success</div>
@@ -677,6 +749,42 @@ exports[`Buttons should render examples: Buttons 6`] = `
677
749
  exports[`Buttons should render examples: Buttons 7`] = `
678
750
  "<div data-testid=\\"mountNode\\">
679
751
  <div class=\\"MuiGrid-root MuiGrid-container\\">
752
+ <div class=\\"MuiGrid-root u-mb-1 MuiGrid-item MuiGrid-grid-xs-12 MuiGrid-grid-sm-6 MuiGrid-grid-md-3\\">
753
+ <div class=\\"styles__Stack--s___22WMg\\">
754
+ <div>default</div>
755
+ <div><button class=\\"MuiButtonBase-root MuiButton-root MuiButton-contained customColor-primary MuiButton-containedPrimary MuiButton-disableElevation Mui-disabled Mui-disabled\\" tabindex=\\"-1\\" type=\\"button\\" disabled=\\"\\"><span class=\\"MuiButton-label\\">primary<span class=\\"MuiButton-endIcon MuiButton-iconSizeMedium\\"><svg viewBox=\\"0 0 32 32\\" class=\\"styles__icon___23x3R styles__icon--spin___ybfC1\\" width=\\"16\\" height=\\"16\\" aria-hidden=\\"true\\" focusable=\\"false\\" role=\\"progressbar\\" aria-busy=\\"true\\"><path opacity=\\"0.25\\" d=\\"M16 0a16 16 0 000 32 16 16 0 000-32m0 4a12 12 0 010 24 12 12 0 010-24\\"></path><path d=\\"M16 0a16 16 0 0116 16h-4A12 12 0 0016 4z\\"></path></svg></span></span></button></div>
756
+ <div><button class=\\"MuiButtonBase-root MuiButton-root MuiButton-outlined customColor-primary MuiButton-outlinedPrimary MuiButton-disableElevation Mui-disabled Mui-disabled\\" tabindex=\\"-1\\" type=\\"button\\" disabled=\\"\\"><span class=\\"MuiButton-label\\">secondary<span class=\\"MuiButton-endIcon MuiButton-iconSizeMedium\\"><svg viewBox=\\"0 0 32 32\\" class=\\"styles__icon___23x3R styles__icon--spin___ybfC1\\" width=\\"16\\" height=\\"16\\" aria-hidden=\\"true\\" focusable=\\"false\\" role=\\"progressbar\\" aria-busy=\\"true\\"><path opacity=\\"0.25\\" d=\\"M16 0a16 16 0 000 32 16 16 0 000-32m0 4a12 12 0 010 24 12 12 0 010-24\\"></path><path d=\\"M16 0a16 16 0 0116 16h-4A12 12 0 0016 4z\\"></path></svg></span></span></button></div>
757
+ <div><button class=\\"MuiButtonBase-root MuiButton-root MuiButton-outlined customColor-primary ghost MuiButton-outlinedPrimary MuiButton-disableElevation Mui-disabled Mui-disabled\\" tabindex=\\"-1\\" type=\\"button\\" disabled=\\"\\"><span class=\\"MuiButton-label\\">ghost<span class=\\"MuiButton-endIcon MuiButton-iconSizeMedium\\"><svg viewBox=\\"0 0 32 32\\" class=\\"styles__icon___23x3R styles__icon--spin___ybfC1\\" width=\\"16\\" height=\\"16\\" aria-hidden=\\"true\\" focusable=\\"false\\" role=\\"progressbar\\" aria-busy=\\"true\\"><path opacity=\\"0.25\\" d=\\"M16 0a16 16 0 000 32 16 16 0 000-32m0 4a12 12 0 010 24 12 12 0 010-24\\"></path><path d=\\"M16 0a16 16 0 0116 16h-4A12 12 0 0016 4z\\"></path></svg></span></span></button></div>
758
+ <div><button class=\\"MuiButtonBase-root MuiButton-root MuiButton-text customColor-primary MuiButton-disableElevation Mui-disabled Mui-disabled\\" tabindex=\\"-1\\" type=\\"button\\" disabled=\\"\\"><span class=\\"MuiButton-label\\">text<span class=\\"MuiButton-endIcon MuiButton-iconSizeMedium\\"><svg viewBox=\\"0 0 32 32\\" class=\\"styles__icon___23x3R styles__icon--spin___ybfC1\\" width=\\"16\\" height=\\"16\\" aria-hidden=\\"true\\" focusable=\\"false\\" role=\\"progressbar\\" aria-busy=\\"true\\"><path opacity=\\"0.25\\" d=\\"M16 0a16 16 0 000 32 16 16 0 000-32m0 4a12 12 0 010 24 12 12 0 010-24\\"></path><path d=\\"M16 0a16 16 0 0116 16h-4A12 12 0 0016 4z\\"></path></svg></span></span></button></div>
759
+ </div>
760
+ </div>
761
+ <div class=\\"MuiGrid-root u-mb-1 MuiGrid-item MuiGrid-grid-xs-12 MuiGrid-grid-sm-6 MuiGrid-grid-md-3\\">
762
+ <div class=\\"styles__Stack--s___22WMg\\">
763
+ <div>inherit</div>
764
+ <div><button class=\\"MuiButtonBase-root MuiButton-root MuiButton-contained customColor-primary MuiButton-containedPrimary MuiButton-disableElevation Mui-disabled Mui-disabled\\" tabindex=\\"-1\\" type=\\"button\\" disabled=\\"\\"><span class=\\"MuiButton-label\\">primary<span class=\\"MuiButton-endIcon MuiButton-iconSizeMedium\\"><svg viewBox=\\"0 0 32 32\\" class=\\"styles__icon___23x3R styles__icon--spin___ybfC1\\" width=\\"16\\" height=\\"16\\" aria-hidden=\\"true\\" focusable=\\"false\\" role=\\"progressbar\\" aria-busy=\\"true\\"><path opacity=\\"0.25\\" d=\\"M16 0a16 16 0 000 32 16 16 0 000-32m0 4a12 12 0 010 24 12 12 0 010-24\\"></path><path d=\\"M16 0a16 16 0 0116 16h-4A12 12 0 0016 4z\\"></path></svg></span></span></button></div>
765
+ <div><button class=\\"MuiButtonBase-root MuiButton-root MuiButton-outlined customColor-primary MuiButton-outlinedPrimary MuiButton-disableElevation Mui-disabled Mui-disabled\\" tabindex=\\"-1\\" type=\\"button\\" disabled=\\"\\"><span class=\\"MuiButton-label\\">secondary<span class=\\"MuiButton-endIcon MuiButton-iconSizeMedium\\"><svg viewBox=\\"0 0 32 32\\" class=\\"styles__icon___23x3R styles__icon--spin___ybfC1\\" width=\\"16\\" height=\\"16\\" aria-hidden=\\"true\\" focusable=\\"false\\" role=\\"progressbar\\" aria-busy=\\"true\\"><path opacity=\\"0.25\\" d=\\"M16 0a16 16 0 000 32 16 16 0 000-32m0 4a12 12 0 010 24 12 12 0 010-24\\"></path><path d=\\"M16 0a16 16 0 0116 16h-4A12 12 0 0016 4z\\"></path></svg></span></span></button></div>
766
+ <div><button class=\\"MuiButtonBase-root MuiButton-root MuiButton-outlined customColor-primary ghost MuiButton-outlinedPrimary MuiButton-disableElevation Mui-disabled Mui-disabled\\" tabindex=\\"-1\\" type=\\"button\\" disabled=\\"\\"><span class=\\"MuiButton-label\\">ghost<span class=\\"MuiButton-endIcon MuiButton-iconSizeMedium\\"><svg viewBox=\\"0 0 32 32\\" class=\\"styles__icon___23x3R styles__icon--spin___ybfC1\\" width=\\"16\\" height=\\"16\\" aria-hidden=\\"true\\" focusable=\\"false\\" role=\\"progressbar\\" aria-busy=\\"true\\"><path opacity=\\"0.25\\" d=\\"M16 0a16 16 0 000 32 16 16 0 000-32m0 4a12 12 0 010 24 12 12 0 010-24\\"></path><path d=\\"M16 0a16 16 0 0116 16h-4A12 12 0 0016 4z\\"></path></svg></span></span></button></div>
767
+ <div><button class=\\"MuiButtonBase-root MuiButton-root MuiButton-text customColor-primary MuiButton-colorInherit MuiButton-disableElevation Mui-disabled Mui-disabled\\" tabindex=\\"-1\\" type=\\"button\\" disabled=\\"\\"><span class=\\"MuiButton-label\\">text<span class=\\"MuiButton-endIcon MuiButton-iconSizeMedium\\"><svg viewBox=\\"0 0 32 32\\" class=\\"styles__icon___23x3R styles__icon--spin___ybfC1\\" width=\\"16\\" height=\\"16\\" aria-hidden=\\"true\\" focusable=\\"false\\" role=\\"progressbar\\" aria-busy=\\"true\\"><path opacity=\\"0.25\\" d=\\"M16 0a16 16 0 000 32 16 16 0 000-32m0 4a12 12 0 010 24 12 12 0 010-24\\"></path><path d=\\"M16 0a16 16 0 0116 16h-4A12 12 0 0016 4z\\"></path></svg></span></span></button></div>
768
+ </div>
769
+ </div>
770
+ <div class=\\"MuiGrid-root u-mb-1 MuiGrid-item MuiGrid-grid-xs-12 MuiGrid-grid-sm-6 MuiGrid-grid-md-3\\">
771
+ <div class=\\"styles__Stack--s___22WMg\\">
772
+ <div>primary</div>
773
+ <div><button class=\\"MuiButtonBase-root MuiButton-root MuiButton-contained customColor-primary MuiButton-containedPrimary MuiButton-disableElevation Mui-disabled Mui-disabled\\" tabindex=\\"-1\\" type=\\"button\\" disabled=\\"\\"><span class=\\"MuiButton-label\\">primary<span class=\\"MuiButton-endIcon MuiButton-iconSizeMedium\\"><svg viewBox=\\"0 0 32 32\\" class=\\"styles__icon___23x3R styles__icon--spin___ybfC1\\" width=\\"16\\" height=\\"16\\" aria-hidden=\\"true\\" focusable=\\"false\\" role=\\"progressbar\\" aria-busy=\\"true\\"><path opacity=\\"0.25\\" d=\\"M16 0a16 16 0 000 32 16 16 0 000-32m0 4a12 12 0 010 24 12 12 0 010-24\\"></path><path d=\\"M16 0a16 16 0 0116 16h-4A12 12 0 0016 4z\\"></path></svg></span></span></button></div>
774
+ <div><button class=\\"MuiButtonBase-root MuiButton-root MuiButton-outlined customColor-primary MuiButton-outlinedPrimary MuiButton-disableElevation Mui-disabled Mui-disabled\\" tabindex=\\"-1\\" type=\\"button\\" disabled=\\"\\"><span class=\\"MuiButton-label\\">secondary<span class=\\"MuiButton-endIcon MuiButton-iconSizeMedium\\"><svg viewBox=\\"0 0 32 32\\" class=\\"styles__icon___23x3R styles__icon--spin___ybfC1\\" width=\\"16\\" height=\\"16\\" aria-hidden=\\"true\\" focusable=\\"false\\" role=\\"progressbar\\" aria-busy=\\"true\\"><path opacity=\\"0.25\\" d=\\"M16 0a16 16 0 000 32 16 16 0 000-32m0 4a12 12 0 010 24 12 12 0 010-24\\"></path><path d=\\"M16 0a16 16 0 0116 16h-4A12 12 0 0016 4z\\"></path></svg></span></span></button></div>
775
+ <div><button class=\\"MuiButtonBase-root MuiButton-root MuiButton-outlined customColor-primary ghost MuiButton-outlinedPrimary MuiButton-disableElevation Mui-disabled Mui-disabled\\" tabindex=\\"-1\\" type=\\"button\\" disabled=\\"\\"><span class=\\"MuiButton-label\\">ghost<span class=\\"MuiButton-endIcon MuiButton-iconSizeMedium\\"><svg viewBox=\\"0 0 32 32\\" class=\\"styles__icon___23x3R styles__icon--spin___ybfC1\\" width=\\"16\\" height=\\"16\\" aria-hidden=\\"true\\" focusable=\\"false\\" role=\\"progressbar\\" aria-busy=\\"true\\"><path opacity=\\"0.25\\" d=\\"M16 0a16 16 0 000 32 16 16 0 000-32m0 4a12 12 0 010 24 12 12 0 010-24\\"></path><path d=\\"M16 0a16 16 0 0116 16h-4A12 12 0 0016 4z\\"></path></svg></span></span></button></div>
776
+ <div><button class=\\"MuiButtonBase-root MuiButton-root MuiButton-text customColor-primary MuiButton-textPrimary MuiButton-disableElevation Mui-disabled Mui-disabled\\" tabindex=\\"-1\\" type=\\"button\\" disabled=\\"\\"><span class=\\"MuiButton-label\\">text<span class=\\"MuiButton-endIcon MuiButton-iconSizeMedium\\"><svg viewBox=\\"0 0 32 32\\" class=\\"styles__icon___23x3R styles__icon--spin___ybfC1\\" width=\\"16\\" height=\\"16\\" aria-hidden=\\"true\\" focusable=\\"false\\" role=\\"progressbar\\" aria-busy=\\"true\\"><path opacity=\\"0.25\\" d=\\"M16 0a16 16 0 000 32 16 16 0 000-32m0 4a12 12 0 010 24 12 12 0 010-24\\"></path><path d=\\"M16 0a16 16 0 0116 16h-4A12 12 0 0016 4z\\"></path></svg></span></span></button></div>
777
+ </div>
778
+ </div>
779
+ <div class=\\"MuiGrid-root u-mb-1 MuiGrid-item MuiGrid-grid-xs-12 MuiGrid-grid-sm-6 MuiGrid-grid-md-3\\">
780
+ <div class=\\"styles__Stack--s___22WMg\\">
781
+ <div>secondary</div>
782
+ <div><button class=\\"MuiButtonBase-root MuiButton-root MuiButton-contained customColor-primary MuiButton-containedPrimary MuiButton-disableElevation Mui-disabled Mui-disabled\\" tabindex=\\"-1\\" type=\\"button\\" disabled=\\"\\"><span class=\\"MuiButton-label\\">primary<span class=\\"MuiButton-endIcon MuiButton-iconSizeMedium\\"><svg viewBox=\\"0 0 32 32\\" class=\\"styles__icon___23x3R styles__icon--spin___ybfC1\\" width=\\"16\\" height=\\"16\\" aria-hidden=\\"true\\" focusable=\\"false\\" role=\\"progressbar\\" aria-busy=\\"true\\"><path opacity=\\"0.25\\" d=\\"M16 0a16 16 0 000 32 16 16 0 000-32m0 4a12 12 0 010 24 12 12 0 010-24\\"></path><path d=\\"M16 0a16 16 0 0116 16h-4A12 12 0 0016 4z\\"></path></svg></span></span></button></div>
783
+ <div><button class=\\"MuiButtonBase-root MuiButton-root MuiButton-outlined customColor-primary MuiButton-outlinedPrimary MuiButton-disableElevation Mui-disabled Mui-disabled\\" tabindex=\\"-1\\" type=\\"button\\" disabled=\\"\\"><span class=\\"MuiButton-label\\">secondary<span class=\\"MuiButton-endIcon MuiButton-iconSizeMedium\\"><svg viewBox=\\"0 0 32 32\\" class=\\"styles__icon___23x3R styles__icon--spin___ybfC1\\" width=\\"16\\" height=\\"16\\" aria-hidden=\\"true\\" focusable=\\"false\\" role=\\"progressbar\\" aria-busy=\\"true\\"><path opacity=\\"0.25\\" d=\\"M16 0a16 16 0 000 32 16 16 0 000-32m0 4a12 12 0 010 24 12 12 0 010-24\\"></path><path d=\\"M16 0a16 16 0 0116 16h-4A12 12 0 0016 4z\\"></path></svg></span></span></button></div>
784
+ <div><button class=\\"MuiButtonBase-root MuiButton-root MuiButton-outlined customColor-primary ghost MuiButton-outlinedPrimary MuiButton-disableElevation Mui-disabled Mui-disabled\\" tabindex=\\"-1\\" type=\\"button\\" disabled=\\"\\"><span class=\\"MuiButton-label\\">ghost<span class=\\"MuiButton-endIcon MuiButton-iconSizeMedium\\"><svg viewBox=\\"0 0 32 32\\" class=\\"styles__icon___23x3R styles__icon--spin___ybfC1\\" width=\\"16\\" height=\\"16\\" aria-hidden=\\"true\\" focusable=\\"false\\" role=\\"progressbar\\" aria-busy=\\"true\\"><path opacity=\\"0.25\\" d=\\"M16 0a16 16 0 000 32 16 16 0 000-32m0 4a12 12 0 010 24 12 12 0 010-24\\"></path><path d=\\"M16 0a16 16 0 0116 16h-4A12 12 0 0016 4z\\"></path></svg></span></span></button></div>
785
+ <div><button class=\\"MuiButtonBase-root MuiButton-root MuiButton-text customColor-primary MuiButton-textSecondary MuiButton-disableElevation Mui-disabled Mui-disabled\\" tabindex=\\"-1\\" type=\\"button\\" disabled=\\"\\"><span class=\\"MuiButton-label\\">text<span class=\\"MuiButton-endIcon MuiButton-iconSizeMedium\\"><svg viewBox=\\"0 0 32 32\\" class=\\"styles__icon___23x3R styles__icon--spin___ybfC1\\" width=\\"16\\" height=\\"16\\" aria-hidden=\\"true\\" focusable=\\"false\\" role=\\"progressbar\\" aria-busy=\\"true\\"><path opacity=\\"0.25\\" d=\\"M16 0a16 16 0 000 32 16 16 0 000-32m0 4a12 12 0 010 24 12 12 0 010-24\\"></path><path d=\\"M16 0a16 16 0 0116 16h-4A12 12 0 0016 4z\\"></path></svg></span></span></button></div>
786
+ </div>
787
+ </div>
680
788
  <div class=\\"MuiGrid-root u-mb-1 MuiGrid-item MuiGrid-grid-xs-12 MuiGrid-grid-sm-6 MuiGrid-grid-md-3\\">
681
789
  <div class=\\"styles__Stack--s___22WMg\\">
682
790
  <div>success</div>
package/transpiled/react/Buttons/index.js CHANGED
@@ -1,7 +1,7 @@
1
1
  import _extends from "@babel/runtime/helpers/extends";
2
2
  import _defineProperty from "@babel/runtime/helpers/defineProperty";
3
3
  import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
4
- var _excluded = ["className", "color", "label", "busy", "disabled", "endIcon"],
4
+ var _excluded = ["variant", "className", "color", "label", "busy", "disabled", "endIcon"],
5
5
  _excluded2 = ["variant", "className"];
6
6
  import React, { forwardRef } from 'react';
7
7
  import PropTypes from 'prop-types';
@@ -9,8 +9,10 @@ import cx from 'classnames';
9
9
  import MuiButton from '@material-ui/core/Button';
10
10
  import Icon from "cozy-ui/transpiled/react/Icon";
11
11
  import SpinnerIcon from "cozy-ui/transpiled/react/Icons/Spinner";
12
+ var CUSTOM_COLORS = ['success', 'error', 'warning', 'info'];
12
13
  var DefaultButton = /*#__PURE__*/forwardRef(function (_ref, ref) {
13
- var className = _ref.className,
14
+ var variant = _ref.variant,
15
+ className = _ref.className,
14
16
  color = _ref.color,
15
17
  label = _ref.label,
16
18
  busy = _ref.busy,
@@ -18,10 +20,15 @@ var DefaultButton = /*#__PURE__*/forwardRef(function (_ref, ref) {
18
20
  endIcon = _ref.endIcon,
19
21
  props = _objectWithoutProperties(_ref, _excluded);
20
22
 
23
+ var customColor = CUSTOM_COLORS.includes(color) ? color : 'primary';
24
+
25
+ var _color = variant === 'text' && !CUSTOM_COLORS.includes(color) ? color : 'primary';
26
+
21
27
  return /*#__PURE__*/React.createElement(MuiButton, _extends({}, props, {
28
+ variant: variant,
22
29
  ref: ref,
23
- className: cx(_defineProperty({}, "customColor-".concat(color), color), className),
24
- color: "primary",
30
+ className: cx(_defineProperty({}, "customColor-".concat(customColor), customColor), className),
31
+ color: _color,
25
32
  disabled: disabled || busy,
26
33
  endIcon: busy ? /*#__PURE__*/React.createElement(Icon, {
27
34
  icon: SpinnerIcon,
@@ -86,7 +93,7 @@ var Buttons = /*#__PURE__*/forwardRef(function (_ref2, ref) {
86
93
  Buttons.displayName = 'Buttons';
87
94
  Buttons.propTypes = {
88
95
  variant: PropTypes.oneOf(['primary', 'secondary', 'ghost', 'text']),
89
- color: PropTypes.oneOf(['success', 'error', 'warning', 'info'])
96
+ color: PropTypes.oneOf(['default', 'inherit', 'primary', 'secondary', 'success', 'error', 'warning', 'info'])
90
97
  };
91
98
  Buttons.defaultProps = {
92
99
  variant: 'primary'