cozy-ui 140.5.1 → 140.5.2
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.
- package/CHANGELOG.md +7 -0
- package/package.json +1 -1
- package/react/Avatar/index.jsx +2 -2
- package/react/MuiCozyTheme/helpers.js +3 -0
- package/transpiled/react/Avatar/index.js +3 -2
- package/transpiled/react/MuiCozyTheme/helpers.d.ts +3 -0
- package/transpiled/react/MuiCozyTheme/helpers.js +4 -0
- package/transpiled/react/MuiCozyTheme/overrides/makeDarkOverrides.d.ts +15 -0
- package/transpiled/react/MuiCozyTheme/overrides/makeLightOverrides.d.ts +15 -0
package/CHANGELOG.md
CHANGED
|
@@ -1,3 +1,10 @@
|
|
|
1
|
+
## [140.5.2](https://github.com/cozy/cozy-ui/compare/v140.5.1...v140.5.2) (2026-07-21)
|
|
2
|
+
|
|
3
|
+
|
|
4
|
+
### Bug Fixes
|
|
5
|
+
|
|
6
|
+
* Force white for avatar color ([d840ebe](https://github.com/cozy/cozy-ui/commit/d840ebe))
|
|
7
|
+
|
|
1
8
|
## [140.5.1](https://github.com/cozy/cozy-ui/compare/v140.5.0...v140.5.1) (2026-07-20)
|
|
2
9
|
|
|
3
10
|
|
package/package.json
CHANGED
package/react/Avatar/index.jsx
CHANGED
|
@@ -12,7 +12,7 @@ import {
|
|
|
12
12
|
import { makeStyles } from '../styles'
|
|
13
13
|
import { capitalize } from '../utils/index'
|
|
14
14
|
|
|
15
|
-
const useStyles = makeStyles(
|
|
15
|
+
const useStyles = makeStyles(() => ({
|
|
16
16
|
root: {
|
|
17
17
|
width: ({ size }) => size,
|
|
18
18
|
height: ({ size }) => size,
|
|
@@ -20,7 +20,7 @@ const useStyles = makeStyles(theme => ({
|
|
|
20
20
|
},
|
|
21
21
|
colorDefault: {
|
|
22
22
|
color: ({ color, textColor }) =>
|
|
23
|
-
textColor ? textColor : color ?
|
|
23
|
+
textColor ? textColor : color ? '#fff' : '', // We don't want avatar color to be theme responsive
|
|
24
24
|
background: ({ color }) =>
|
|
25
25
|
supportedColors.includes(color) ? colorMapping[color] : color
|
|
26
26
|
}
|
|
@@ -70,6 +70,9 @@ export const makeChipStyleByColor = (theme, color) => ({
|
|
|
70
70
|
: alpha(theme.palette[color].main, theme.palette.action.hoverOpacity)
|
|
71
71
|
}
|
|
72
72
|
},
|
|
73
|
+
'& $avatar': {
|
|
74
|
+
color: '#fff' // We don't want avatar color to be theme responsive
|
|
75
|
+
},
|
|
73
76
|
'& $icon': {
|
|
74
77
|
color:
|
|
75
78
|
color === 'primary' ? theme.palette.text.icon : theme.palette[color].main,
|
|
@@ -10,7 +10,7 @@ import React from 'react';
|
|
|
10
10
|
import { colorMapping, supportedColors, nameToColor, colorToGradient } from "cozy-ui/transpiled/react/Avatar/helpers";
|
|
11
11
|
import { makeStyles } from "cozy-ui/transpiled/react/styles";
|
|
12
12
|
import { capitalize } from "cozy-ui/transpiled/react/utils/index";
|
|
13
|
-
var useStyles = makeStyles(function (
|
|
13
|
+
var useStyles = makeStyles(function () {
|
|
14
14
|
return {
|
|
15
15
|
root: {
|
|
16
16
|
width: function width(_ref) {
|
|
@@ -30,8 +30,9 @@ var useStyles = makeStyles(function (theme) {
|
|
|
30
30
|
color: function color(_ref4) {
|
|
31
31
|
var _color = _ref4.color,
|
|
32
32
|
textColor = _ref4.textColor;
|
|
33
|
-
return textColor ? textColor : _color ?
|
|
33
|
+
return textColor ? textColor : _color ? '#fff' : '';
|
|
34
34
|
},
|
|
35
|
+
// We don't want avatar color to be theme responsive
|
|
35
36
|
background: function background(_ref5) {
|
|
36
37
|
var color = _ref5.color;
|
|
37
38
|
return supportedColors.includes(color) ? colorMapping[color] : color;
|
|
@@ -62,6 +62,10 @@ export var makeChipStyleByColor = function makeChipStyleByColor(theme, color) {
|
|
|
62
62
|
backgroundColor: color === 'primary' ? theme.palette.action.hover : alpha(theme.palette[color].main, theme.palette.action.hoverOpacity)
|
|
63
63
|
}
|
|
64
64
|
},
|
|
65
|
+
'& $avatar': {
|
|
66
|
+
color: '#fff' // We don't want avatar color to be theme responsive
|
|
67
|
+
|
|
68
|
+
},
|
|
65
69
|
'& $icon': {
|
|
66
70
|
color: color === 'primary' ? theme.palette.text.icon : theme.palette[color].main,
|
|
67
71
|
fill: color === 'primary' ? theme.palette.text.icon : theme.palette[color].main
|
|
@@ -1178,6 +1178,9 @@ export function makeDarkOverrides(theme: any): {
|
|
|
1178
1178
|
backgroundColor: any;
|
|
1179
1179
|
};
|
|
1180
1180
|
};
|
|
1181
|
+
'& $avatar': {
|
|
1182
|
+
color: string;
|
|
1183
|
+
};
|
|
1181
1184
|
'& $icon': {
|
|
1182
1185
|
color: any;
|
|
1183
1186
|
fill: any;
|
|
@@ -1235,6 +1238,9 @@ export function makeDarkOverrides(theme: any): {
|
|
|
1235
1238
|
backgroundColor: any;
|
|
1236
1239
|
};
|
|
1237
1240
|
};
|
|
1241
|
+
'& $avatar': {
|
|
1242
|
+
color: string;
|
|
1243
|
+
};
|
|
1238
1244
|
'& $icon': {
|
|
1239
1245
|
color: any;
|
|
1240
1246
|
fill: any;
|
|
@@ -1292,6 +1298,9 @@ export function makeDarkOverrides(theme: any): {
|
|
|
1292
1298
|
backgroundColor: any;
|
|
1293
1299
|
};
|
|
1294
1300
|
};
|
|
1301
|
+
'& $avatar': {
|
|
1302
|
+
color: string;
|
|
1303
|
+
};
|
|
1295
1304
|
'& $icon': {
|
|
1296
1305
|
color: any;
|
|
1297
1306
|
fill: any;
|
|
@@ -1349,6 +1358,9 @@ export function makeDarkOverrides(theme: any): {
|
|
|
1349
1358
|
backgroundColor: any;
|
|
1350
1359
|
};
|
|
1351
1360
|
};
|
|
1361
|
+
'& $avatar': {
|
|
1362
|
+
color: string;
|
|
1363
|
+
};
|
|
1352
1364
|
'& $icon': {
|
|
1353
1365
|
color: any;
|
|
1354
1366
|
fill: any;
|
|
@@ -1406,6 +1418,9 @@ export function makeDarkOverrides(theme: any): {
|
|
|
1406
1418
|
backgroundColor: any;
|
|
1407
1419
|
};
|
|
1408
1420
|
};
|
|
1421
|
+
'& $avatar': {
|
|
1422
|
+
color: string;
|
|
1423
|
+
};
|
|
1409
1424
|
'& $icon': {
|
|
1410
1425
|
color: any;
|
|
1411
1426
|
fill: any;
|
|
@@ -1178,6 +1178,9 @@ export function makeLightOverrides(theme: any): {
|
|
|
1178
1178
|
backgroundColor: any;
|
|
1179
1179
|
};
|
|
1180
1180
|
};
|
|
1181
|
+
'& $avatar': {
|
|
1182
|
+
color: string;
|
|
1183
|
+
};
|
|
1181
1184
|
'& $icon': {
|
|
1182
1185
|
color: any;
|
|
1183
1186
|
fill: any;
|
|
@@ -1235,6 +1238,9 @@ export function makeLightOverrides(theme: any): {
|
|
|
1235
1238
|
backgroundColor: any;
|
|
1236
1239
|
};
|
|
1237
1240
|
};
|
|
1241
|
+
'& $avatar': {
|
|
1242
|
+
color: string;
|
|
1243
|
+
};
|
|
1238
1244
|
'& $icon': {
|
|
1239
1245
|
color: any;
|
|
1240
1246
|
fill: any;
|
|
@@ -1292,6 +1298,9 @@ export function makeLightOverrides(theme: any): {
|
|
|
1292
1298
|
backgroundColor: any;
|
|
1293
1299
|
};
|
|
1294
1300
|
};
|
|
1301
|
+
'& $avatar': {
|
|
1302
|
+
color: string;
|
|
1303
|
+
};
|
|
1295
1304
|
'& $icon': {
|
|
1296
1305
|
color: any;
|
|
1297
1306
|
fill: any;
|
|
@@ -1349,6 +1358,9 @@ export function makeLightOverrides(theme: any): {
|
|
|
1349
1358
|
backgroundColor: any;
|
|
1350
1359
|
};
|
|
1351
1360
|
};
|
|
1361
|
+
'& $avatar': {
|
|
1362
|
+
color: string;
|
|
1363
|
+
};
|
|
1352
1364
|
'& $icon': {
|
|
1353
1365
|
color: any;
|
|
1354
1366
|
fill: any;
|
|
@@ -1406,6 +1418,9 @@ export function makeLightOverrides(theme: any): {
|
|
|
1406
1418
|
backgroundColor: any;
|
|
1407
1419
|
};
|
|
1408
1420
|
};
|
|
1421
|
+
'& $avatar': {
|
|
1422
|
+
color: string;
|
|
1423
|
+
};
|
|
1409
1424
|
'& $icon': {
|
|
1410
1425
|
color: any;
|
|
1411
1426
|
fill: any;
|