cozy-ui 111.1.1 → 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 (15) hide show
  1. package/CHANGELOG.md +14 -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/react/providers/CozyTheme/CozyThemeWithQuery.jsx +1 -1
  7. package/react/providers/CozyTheme/DumbCozyTheme.jsx +71 -0
  8. package/react/providers/CozyTheme/index.jsx +8 -63
  9. package/transpiled/react/Buttons/index.js +12 -5
  10. package/transpiled/react/providers/CozyTheme/CozyThemeWithQuery.js +1 -1
  11. package/transpiled/react/providers/CozyTheme/DumbCozyTheme.d.ts +18 -0
  12. package/transpiled/react/providers/CozyTheme/DumbCozyTheme.js +53 -0
  13. package/transpiled/react/providers/CozyTheme/index.d.ts +19 -27
  14. package/transpiled/react/providers/CozyTheme/index.js +14 -48
  15. package/transpiled/react/stylesheet.css +1419 -1
package/CHANGELOG.md CHANGED
@@ -1,3 +1,17 @@
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
+
8
+ # [111.2.0](https://github.com/cozy/cozy-ui/compare/v111.1.1...v111.2.0) (2024-07-25)
9
+
10
+
11
+ ### Features
12
+
13
+ * **CozyTheme:** Add `ignoreCozySettings` prop to bypass settings query ([e49a312](https://github.com/cozy/cozy-ui/commit/e49a312))
14
+
1
15
  ## [111.1.1](https://github.com/cozy/cozy-ui/compare/v111.1.0...v111.1.1) (2024-07-18)
2
16
 
3
17
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "cozy-ui",
3
- "version": "111.1.1",
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/react/providers/CozyTheme/CozyThemeWithQuery.jsx CHANGED
@@ -3,7 +3,7 @@ import React from 'react'
3
3
  import { useQuery, isQueryLoading, hasQueryBeenLoaded } from 'cozy-client'
4
4
 
5
5
  import { buildSettingsInstanceQuery } from './queries'
6
- import { DumbCozyTheme } from './index'
6
+ import DumbCozyTheme from './DumbCozyTheme'
7
7
 
8
8
  const CozyThemeWithQuery = props => {
9
9
  const instanceQuery = buildSettingsInstanceQuery()
package/react/providers/CozyTheme/DumbCozyTheme.jsx ADDED
@@ -0,0 +1,71 @@
1
+ import React from 'react'
2
+ import PropTypes from 'prop-types'
3
+ import cx from 'classnames'
4
+
5
+ import flag from 'cozy-flags'
6
+ import useMediaQuery from '../../hooks/useMediaQuery'
7
+ import MuiCozyTheme from '../../MuiCozyTheme'
8
+
9
+ import { CozyThemeContext } from './index'
10
+
11
+ const DumbCozyTheme = ({
12
+ variant,
13
+ className,
14
+ ignoreItself,
15
+ settingsThemeType,
16
+ children
17
+ }) => {
18
+ const uiThemeType = localStorage.getItem('ui-theme-type') // use only for cozy-ui documentation and argos screenshots
19
+ const uiThemeVariant = localStorage.getItem('ui-theme-variant') // use only for cozy-ui documentation and argos screenshots
20
+
21
+ const isOnlyLight = !!flag('ui.darkmode.enabled') // should be remove when dark mode is validated on all apps
22
+ const deviceThemeType = useMediaQuery('(prefers-color-scheme: dark)')
23
+ ? isOnlyLight
24
+ ? 'dark'
25
+ : 'light'
26
+ : 'light'
27
+ const filteredSettingsThemeType = ['light', 'dark'].includes(
28
+ settingsThemeType
29
+ )
30
+ ? settingsThemeType
31
+ : undefined
32
+
33
+ const selfThemeType =
34
+ uiThemeType || filteredSettingsThemeType || deviceThemeType
35
+ const selfThemeVariant = uiThemeVariant || variant
36
+
37
+ return (
38
+ <CozyThemeContext.Provider
39
+ value={{
40
+ type: selfThemeType,
41
+ variant: selfThemeVariant,
42
+ isLight: selfThemeType === 'light'
43
+ }}
44
+ >
45
+ <MuiCozyTheme type={selfThemeType} variant={selfThemeVariant}>
46
+ <div
47
+ className={cx(className, {
48
+ [`CozyTheme--${selfThemeType}-${selfThemeVariant}`]: Boolean(
49
+ selfThemeVariant
50
+ ),
51
+ 'u-dc': ignoreItself
52
+ })}
53
+ >
54
+ {children}
55
+ </div>
56
+ </MuiCozyTheme>
57
+ </CozyThemeContext.Provider>
58
+ )
59
+ }
60
+
61
+ DumbCozyTheme.propTypes = {
62
+ variant: PropTypes.oneOf(['normal', 'inverted']),
63
+ /** Causes this element's children to appear as if they were direct children of the element's parent, ignoring the element itself. */
64
+ ignoreItself: PropTypes.bool,
65
+ className: PropTypes.string,
66
+ /** Theme type from io.cozy.settings.instance */
67
+ settingsThemeType: PropTypes.oneOf(['light', 'dark', 'auto']),
68
+ children: PropTypes.node
69
+ }
70
+
71
+ export default DumbCozyTheme
package/react/providers/CozyTheme/index.jsx CHANGED
@@ -1,14 +1,11 @@
1
1
  import React, { createContext, useContext } from 'react'
2
2
  import PropTypes from 'prop-types'
3
- import cx from 'classnames'
4
3
 
5
- import flag from 'cozy-flags'
6
4
  import log from 'cozy-logger'
7
5
 
8
6
  import { isRsg } from '../../hooks/useSetFlagshipUi/helpers'
9
- import useMediaQuery from '../../hooks/useMediaQuery'
10
- import MuiCozyTheme from '../../MuiCozyTheme'
11
7
  import CozyThemeWithQuery from './CozyThemeWithQuery'
8
+ import DumbCozyTheme from './DumbCozyTheme'
12
9
 
13
10
  export const CozyThemeContext = createContext()
14
11
 
@@ -30,81 +27,29 @@ export const useCozyTheme = () => {
30
27
  return context
31
28
  }
32
29
 
33
- const DumbCozyTheme = ({
34
- variant,
35
- className,
36
- ignoreItself,
37
- settingsThemeType,
38
- children
39
- }) => {
40
- const uiThemeType = localStorage.getItem('ui-theme-type') // use only for cozy-ui documentation and argos screenshots
41
- const uiThemeVariant = localStorage.getItem('ui-theme-variant') // use only for cozy-ui documentation and argos screenshots
42
-
43
- const isOnlyLight = !!flag('ui.darkmode.enabled') // should be remove when dark mode is validated on all apps
44
- const deviceThemeType = useMediaQuery('(prefers-color-scheme: dark)')
45
- ? isOnlyLight
46
- ? 'dark'
47
- : 'light'
48
- : 'light'
49
-
50
- const selfThemeType =
51
- uiThemeType ||
52
- (['light', 'dark'].includes(settingsThemeType)
53
- ? settingsThemeType
54
- : deviceThemeType)
55
- const selfThemeVariant = uiThemeVariant || variant
56
-
57
- return (
58
- <CozyThemeContext.Provider
59
- value={{
60
- type: selfThemeType,
61
- variant: selfThemeVariant,
62
- isLight: selfThemeType === 'light'
63
- }}
64
- >
65
- <MuiCozyTheme type={selfThemeType} variant={selfThemeVariant}>
66
- <div
67
- className={cx(className, {
68
- [`CozyTheme--${selfThemeType}-${selfThemeVariant}`]: Boolean(
69
- selfThemeVariant
70
- ),
71
- 'u-dc': ignoreItself
72
- })}
73
- >
74
- {children}
75
- </div>
76
- </MuiCozyTheme>
77
- </CozyThemeContext.Provider>
78
- )
79
- }
80
- DumbCozyTheme.propTypes = CozyThemeProptypes
81
- DumbCozyTheme.defaultProps = CozyThemeDefaultProps
82
-
83
- const CozyTheme = props => {
30
+ const CozyTheme = ({ ignoreCozySettings, ...props }) => {
84
31
  const Comp =
85
- process.env.NODE_ENV === 'test' || isRsg
32
+ ignoreCozySettings || process.env.NODE_ENV === 'test' || isRsg
86
33
  ? DumbCozyTheme
87
34
  : CozyThemeWithQuery
88
35
 
89
36
  return <Comp {...props} />
90
37
  }
91
38
 
92
- const CozyThemeProptypes = {
39
+ CozyTheme.propTypes = {
93
40
  variant: PropTypes.oneOf(['normal', 'inverted']),
94
41
  /** Causes this element's children to appear as if they were direct children of the element's parent, ignoring the element itself. */
95
42
  ignoreItself: PropTypes.bool,
43
+ /** Bypasses the request that retrieves the app's settings in order to define the theme type */
44
+ ignoreCozySettings: PropTypes.bool,
96
45
  className: PropTypes.string,
97
- settingsThemeType: PropTypes.string,
98
46
  children: PropTypes.node
99
47
  }
100
48
 
101
- const CozyThemeDefaultProps = {
49
+ CozyTheme.defaultProps = {
102
50
  variant: 'normal',
51
+ ignoreCozySettings: false,
103
52
  ignoreItself: true
104
53
  }
105
- CozyTheme.propTypes = CozyThemeProptypes
106
- CozyTheme.defaultProps = CozyThemeDefaultProps
107
54
 
108
- // export this way to help doc generates correct component and props
109
55
  export default CozyTheme
110
- export { DumbCozyTheme }
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'
package/transpiled/react/providers/CozyTheme/CozyThemeWithQuery.js CHANGED
@@ -4,7 +4,7 @@ var _excluded = ["data"];
4
4
  import React from 'react';
5
5
  import { useQuery, isQueryLoading, hasQueryBeenLoaded } from 'cozy-client';
6
6
  import { buildSettingsInstanceQuery } from "cozy-ui/transpiled/react/providers/CozyTheme/queries";
7
- import { DumbCozyTheme } from "cozy-ui/transpiled/react/providers/CozyTheme/index";
7
+ import DumbCozyTheme from "cozy-ui/transpiled/react/providers/CozyTheme/DumbCozyTheme";
8
8
 
9
9
  var CozyThemeWithQuery = function CozyThemeWithQuery(props) {
10
10
  var instanceQuery = buildSettingsInstanceQuery();
package/transpiled/react/providers/CozyTheme/DumbCozyTheme.d.ts ADDED
@@ -0,0 +1,18 @@
1
+ export default DumbCozyTheme;
2
+ declare function DumbCozyTheme({ variant, className, ignoreItself, settingsThemeType, children }: {
3
+ variant: any;
4
+ className: any;
5
+ ignoreItself: any;
6
+ settingsThemeType: any;
7
+ children: any;
8
+ }): JSX.Element;
9
+ declare namespace DumbCozyTheme {
10
+ namespace propTypes {
11
+ const variant: PropTypes.Requireable<string>;
12
+ const ignoreItself: PropTypes.Requireable<boolean>;
13
+ const className: PropTypes.Requireable<string>;
14
+ const settingsThemeType: PropTypes.Requireable<string>;
15
+ const children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
16
+ }
17
+ }
18
+ import PropTypes from "prop-types";
package/transpiled/react/providers/CozyTheme/DumbCozyTheme.js ADDED
@@ -0,0 +1,53 @@
1
+ import _defineProperty from "@babel/runtime/helpers/defineProperty";
2
+ import React from 'react';
3
+ import PropTypes from 'prop-types';
4
+ import cx from 'classnames';
5
+ import flag from 'cozy-flags';
6
+ import useMediaQuery from "cozy-ui/transpiled/react/hooks/useMediaQuery";
7
+ import MuiCozyTheme from "cozy-ui/transpiled/react/MuiCozyTheme";
8
+ import { CozyThemeContext } from "cozy-ui/transpiled/react/providers/CozyTheme/index";
9
+
10
+ var DumbCozyTheme = function DumbCozyTheme(_ref) {
11
+ var _cx;
12
+
13
+ var variant = _ref.variant,
14
+ className = _ref.className,
15
+ ignoreItself = _ref.ignoreItself,
16
+ settingsThemeType = _ref.settingsThemeType,
17
+ children = _ref.children;
18
+ var uiThemeType = localStorage.getItem('ui-theme-type'); // use only for cozy-ui documentation and argos screenshots
19
+
20
+ var uiThemeVariant = localStorage.getItem('ui-theme-variant'); // use only for cozy-ui documentation and argos screenshots
21
+
22
+ var isOnlyLight = !!flag('ui.darkmode.enabled'); // should be remove when dark mode is validated on all apps
23
+
24
+ var deviceThemeType = useMediaQuery('(prefers-color-scheme: dark)') ? isOnlyLight ? 'dark' : 'light' : 'light';
25
+ var filteredSettingsThemeType = ['light', 'dark'].includes(settingsThemeType) ? settingsThemeType : undefined;
26
+ var selfThemeType = uiThemeType || filteredSettingsThemeType || deviceThemeType;
27
+ var selfThemeVariant = uiThemeVariant || variant;
28
+ return /*#__PURE__*/React.createElement(CozyThemeContext.Provider, {
29
+ value: {
30
+ type: selfThemeType,
31
+ variant: selfThemeVariant,
32
+ isLight: selfThemeType === 'light'
33
+ }
34
+ }, /*#__PURE__*/React.createElement(MuiCozyTheme, {
35
+ type: selfThemeType,
36
+ variant: selfThemeVariant
37
+ }, /*#__PURE__*/React.createElement("div", {
38
+ className: cx(className, (_cx = {}, _defineProperty(_cx, "CozyTheme--".concat(selfThemeType, "-").concat(selfThemeVariant), Boolean(selfThemeVariant)), _defineProperty(_cx, 'u-dc', ignoreItself), _cx))
39
+ }, children)));
40
+ };
41
+
42
+ DumbCozyTheme.propTypes = {
43
+ variant: PropTypes.oneOf(['normal', 'inverted']),
44
+
45
+ /** Causes this element's children to appear as if they were direct children of the element's parent, ignoring the element itself. */
46
+ ignoreItself: PropTypes.bool,
47
+ className: PropTypes.string,
48
+
49
+ /** Theme type from io.cozy.settings.instance */
50
+ settingsThemeType: PropTypes.oneOf(['light', 'dark', 'auto']),
51
+ children: PropTypes.node
52
+ };
53
+ export default DumbCozyTheme;