cozy-ui-plus 5.3.1 → 6.0.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 (22) hide show
  1. package/CHANGELOG.md +10 -0
  2. package/dist/CollectionField/index.js +2 -2
  3. package/dist/ContactsListModal/ContactsListModal.js +2 -6
  4. package/dist/ContactsListModal/MobileHeader.js +2 -6
  5. package/dist/Field/index.js +8 -5
  6. package/dist/ListItem/ListItemFile/ItemIcon.js +11 -4
  7. package/dist/Qualification/QualificationItem/index.js +10 -14
  8. package/dist/ShortcutTile/index.js +2 -2
  9. package/dist/SquareAppIcon/index.js +22 -21
  10. package/dist/providers/CozyTheme/index.js +0 -3
  11. package/dist/src/providers/CozyTheme/index.d.ts +0 -3
  12. package/package.json +4 -4
  13. package/src/CollectionField/index.jsx +2 -2
  14. package/src/ContactsListModal/ContactsListModal.jsx +1 -4
  15. package/src/ContactsListModal/MobileHeader.jsx +20 -24
  16. package/src/Field/index.jsx +7 -6
  17. package/src/ListItem/ListItemFile/ItemIcon.jsx +15 -7
  18. package/src/Qualification/QualificationItem/index.jsx +11 -16
  19. package/src/ShortcutTile/index.tsx +1 -1
  20. package/src/SquareAppIcon/__snapshots__/SquareAppIcon.spec.js.snap +240 -271
  21. package/src/SquareAppIcon/index.jsx +96 -107
  22. package/src/providers/CozyTheme/index.jsx +0 -2
package/src/SquareAppIcon/__snapshots__/SquareAppIcon.spec.js.snap CHANGED
@@ -2,51 +2,47 @@
2
2
 
3
3
  exports[`SquareAppIcon component should render an app correctly with the app name 1`] = `
4
4
  <div
5
- class="makeStyles-tileWrapper-37"
5
+ class="makeStyles-tileWrapper-11"
6
6
  data-testid="square-app-icon"
7
7
  >
8
- <div
9
- class="TwakeTheme--light-normal u-dc"
8
+ <span
9
+ class="MuiBadge-root"
10
10
  >
11
11
  <span
12
- class="MuiBadge-root-40"
12
+ class="MuiBadge-root styles__SquareAppIcon-wrapper___3aoSx styles__SquareAppIcon-wrapper--light___AqjR- undefined"
13
13
  >
14
- <span
15
- class="MuiBadge-root-40 styles__SquareAppIcon-wrapper___3aoSx styles__SquareAppIcon-wrapper--light___AqjR- undefined"
14
+ <div
15
+ class="styles__SquareAppIcon-icon-container___AZ5_V styles__SquareAppIcon-icon-container-normal___2eLgM"
16
16
  >
17
17
  <div
18
- class="styles__SquareAppIcon-icon-container___AZ5_V styles__SquareAppIcon-icon-container-normal___2eLgM"
18
+ class="styles__onEnd___1mc8z"
19
+ />
20
+ <div
21
+ class="u-w-2 u-h-2"
19
22
  >
20
- <div
21
- class="styles__onEnd___1mc8z"
22
- />
23
- <div
24
- class="u-w-2 u-h-2"
23
+ <svg
24
+ class="styles__c-app-icon___2W1cp styles__c-app-icon-default___1Bus5 styles__icon___23x3R"
25
+ height="100%"
26
+ style="fill: var(--coolGrey);"
27
+ viewBox="0 0 15 16"
28
+ width="100%"
25
29
  >
26
- <svg
27
- class="styles__c-app-icon___2W1cp styles__c-app-icon-default___1Bus5 styles__icon___23x3R"
28
- height="100%"
29
- style="fill: var(--coolGrey);"
30
- viewBox="0 0 15 16"
31
- width="100%"
32
- >
33
- <path
34
- d="M14.4 4L7.2 0 0 4v8l7.2 4 7.2-4V4zM7.2 1.832l4.728 2.624L9.52 5.792a3.213 3.213 0 00-4.64 0L2.472 4.456 7.2 1.832zm-.8 11.896l-4.8-2.664V5.808L4.104 7.2A3.193 3.193 0 006.4 11.096v2.632zM5.6 8c0-.88.72-1.6 1.6-1.6.88 0 1.6.72 1.6 1.6 0 .88-.72 1.6-1.6 1.6-.88 0-1.6-.72-1.6-1.6zM8 13.728v-2.624a3.193 3.193 0 002.4-3.096c0-.28-.032-.552-.104-.808L12.8 5.808v5.256L8 13.728z"
35
- />
36
- </svg>
37
- </div>
30
+ <path
31
+ d="M14.4 4L7.2 0 0 4v8l7.2 4 7.2-4V4zM7.2 1.832l4.728 2.624L9.52 5.792a3.213 3.213 0 00-4.64 0L2.472 4.456 7.2 1.832zm-.8 11.896l-4.8-2.664V5.808L4.104 7.2A3.193 3.193 0 006.4 11.096v2.632zM5.6 8c0-.88.72-1.6 1.6-1.6.88 0 1.6.72 1.6 1.6 0 .88-.72 1.6-1.6 1.6-.88 0-1.6-.72-1.6-1.6zM8 13.728v-2.624a3.193 3.193 0 002.4-3.096c0-.28-.032-.552-.104-.808L12.8 5.808v5.256L8 13.728z"
32
+ />
33
+ </svg>
38
34
  </div>
39
- <span
40
- class="MuiBadge-badge-41 badgeSizeLarge MuiBadge-anchorOriginTopRightRectangular-47"
41
- />
42
- </span>
35
+ </div>
43
36
  <span
44
- class="MuiBadge-badge-41 makeStyles-qualifier-39 MuiBadge-anchorOriginBottomRightRectangular-49 MuiBadge-invisible-62"
37
+ class="MuiBadge-badge badgeSizeLarge MuiBadge-anchorOriginTopRightRectangular"
45
38
  />
46
39
  </span>
47
- </div>
40
+ <span
41
+ class="MuiBadge-badge badgeSizeMedium badgeBorder MuiBadge-anchorOriginBottomRightRectangular MuiBadge-invisible"
42
+ />
43
+ </span>
48
44
  <h6
49
- class="MuiTypography-root makeStyles-name-32 u-spacellipsis MuiTypography-h6 MuiTypography-colorTextPrimary MuiTypography-alignCenter"
45
+ class="MuiTypography-root makeStyles-name-7 u-spacellipsis MuiTypography-h6 MuiTypography-colorTextPrimary MuiTypography-alignCenter"
50
46
  >
51
47
  Test
52
48
  </h6>
@@ -55,49 +51,45 @@ exports[`SquareAppIcon component should render an app correctly with the app nam
55
51
 
56
52
  exports[`SquareAppIcon component should render an app correctly with the given name 1`] = `
57
53
  <div
58
- class="makeStyles-tileWrapper-6"
54
+ class="makeStyles-tileWrapper-5"
59
55
  data-testid="square-app-icon"
60
56
  >
61
- <div
62
- class="TwakeTheme--light-normal u-dc"
57
+ <span
58
+ class="MuiBadge-root"
63
59
  >
64
60
  <span
65
- class="MuiBadge-root-9"
61
+ class="MuiBadge-root styles__SquareAppIcon-wrapper___3aoSx styles__SquareAppIcon-wrapper--light___AqjR- undefined"
66
62
  >
67
- <span
68
- class="MuiBadge-root-9 styles__SquareAppIcon-wrapper___3aoSx styles__SquareAppIcon-wrapper--light___AqjR- undefined"
63
+ <div
64
+ class="styles__SquareAppIcon-icon-container___AZ5_V styles__SquareAppIcon-icon-container-normal___2eLgM"
69
65
  >
70
66
  <div
71
- class="styles__SquareAppIcon-icon-container___AZ5_V styles__SquareAppIcon-icon-container-normal___2eLgM"
67
+ class="styles__onEnd___1mc8z"
68
+ />
69
+ <div
70
+ class="u-w-2 u-h-2"
72
71
  >
73
- <div
74
- class="styles__onEnd___1mc8z"
75
- />
76
- <div
77
- class="u-w-2 u-h-2"
72
+ <svg
73
+ class="styles__c-app-icon___2W1cp styles__c-app-icon-default___1Bus5 styles__icon___23x3R"
74
+ height="100%"
75
+ style="fill: var(--coolGrey);"
76
+ viewBox="0 0 15 16"
77
+ width="100%"
78
78
  >
79
- <svg
80
- class="styles__c-app-icon___2W1cp styles__c-app-icon-default___1Bus5 styles__icon___23x3R"
81
- height="100%"
82
- style="fill: var(--coolGrey);"
83
- viewBox="0 0 15 16"
84
- width="100%"
85
- >
86
- <path
87
- d="M14.4 4L7.2 0 0 4v8l7.2 4 7.2-4V4zM7.2 1.832l4.728 2.624L9.52 5.792a3.213 3.213 0 00-4.64 0L2.472 4.456 7.2 1.832zm-.8 11.896l-4.8-2.664V5.808L4.104 7.2A3.193 3.193 0 006.4 11.096v2.632zM5.6 8c0-.88.72-1.6 1.6-1.6.88 0 1.6.72 1.6 1.6 0 .88-.72 1.6-1.6 1.6-.88 0-1.6-.72-1.6-1.6zM8 13.728v-2.624a3.193 3.193 0 002.4-3.096c0-.28-.032-.552-.104-.808L12.8 5.808v5.256L8 13.728z"
88
- />
89
- </svg>
90
- </div>
79
+ <path
80
+ d="M14.4 4L7.2 0 0 4v8l7.2 4 7.2-4V4zM7.2 1.832l4.728 2.624L9.52 5.792a3.213 3.213 0 00-4.64 0L2.472 4.456 7.2 1.832zm-.8 11.896l-4.8-2.664V5.808L4.104 7.2A3.193 3.193 0 006.4 11.096v2.632zM5.6 8c0-.88.72-1.6 1.6-1.6.88 0 1.6.72 1.6 1.6 0 .88-.72 1.6-1.6 1.6-.88 0-1.6-.72-1.6-1.6zM8 13.728v-2.624a3.193 3.193 0 002.4-3.096c0-.28-.032-.552-.104-.808L12.8 5.808v5.256L8 13.728z"
81
+ />
82
+ </svg>
91
83
  </div>
92
- <span
93
- class="MuiBadge-badge-10 badgeSizeLarge MuiBadge-anchorOriginTopRightRectangular-16"
94
- />
95
- </span>
84
+ </div>
96
85
  <span
97
- class="MuiBadge-badge-10 makeStyles-qualifier-8 MuiBadge-anchorOriginBottomRightRectangular-18 MuiBadge-invisible-31"
86
+ class="MuiBadge-badge badgeSizeLarge MuiBadge-anchorOriginTopRightRectangular"
98
87
  />
99
88
  </span>
100
- </div>
89
+ <span
90
+ class="MuiBadge-badge badgeSizeMedium badgeBorder MuiBadge-anchorOriginBottomRightRectangular MuiBadge-invisible"
91
+ />
92
+ </span>
101
93
  <h6
102
94
  class="MuiTypography-root makeStyles-name-1 u-spacellipsis MuiTypography-h6 MuiTypography-colorTextPrimary MuiTypography-alignCenter"
103
95
  >
@@ -108,51 +100,47 @@ exports[`SquareAppIcon component should render an app correctly with the given n
108
100
 
109
101
  exports[`SquareAppIcon component should render an app with the app slug if no name prop and app is a string 1`] = `
110
102
  <div
111
- class="makeStyles-tileWrapper-68"
103
+ class="makeStyles-tileWrapper-17"
112
104
  data-testid="square-app-icon"
113
105
  >
114
- <div
115
- class="TwakeTheme--light-normal u-dc"
106
+ <span
107
+ class="MuiBadge-root"
116
108
  >
117
109
  <span
118
- class="MuiBadge-root-71"
110
+ class="MuiBadge-root styles__SquareAppIcon-wrapper___3aoSx styles__SquareAppIcon-wrapper--light___AqjR- undefined"
119
111
  >
120
- <span
121
- class="MuiBadge-root-71 styles__SquareAppIcon-wrapper___3aoSx styles__SquareAppIcon-wrapper--light___AqjR- undefined"
112
+ <div
113
+ class="styles__SquareAppIcon-icon-container___AZ5_V styles__SquareAppIcon-icon-container-normal___2eLgM"
122
114
  >
123
115
  <div
124
- class="styles__SquareAppIcon-icon-container___AZ5_V styles__SquareAppIcon-icon-container-normal___2eLgM"
116
+ class="styles__onEnd___1mc8z"
117
+ />
118
+ <div
119
+ class="u-w-2 u-h-2"
125
120
  >
126
- <div
127
- class="styles__onEnd___1mc8z"
128
- />
129
- <div
130
- class="u-w-2 u-h-2"
121
+ <svg
122
+ class="styles__c-app-icon___2W1cp styles__c-app-icon-default___1Bus5 styles__icon___23x3R"
123
+ height="100%"
124
+ style="fill: var(--coolGrey);"
125
+ viewBox="0 0 15 16"
126
+ width="100%"
131
127
  >
132
- <svg
133
- class="styles__c-app-icon___2W1cp styles__c-app-icon-default___1Bus5 styles__icon___23x3R"
134
- height="100%"
135
- style="fill: var(--coolGrey);"
136
- viewBox="0 0 15 16"
137
- width="100%"
138
- >
139
- <path
140
- d="M14.4 4L7.2 0 0 4v8l7.2 4 7.2-4V4zM7.2 1.832l4.728 2.624L9.52 5.792a3.213 3.213 0 00-4.64 0L2.472 4.456 7.2 1.832zm-.8 11.896l-4.8-2.664V5.808L4.104 7.2A3.193 3.193 0 006.4 11.096v2.632zM5.6 8c0-.88.72-1.6 1.6-1.6.88 0 1.6.72 1.6 1.6 0 .88-.72 1.6-1.6 1.6-.88 0-1.6-.72-1.6-1.6zM8 13.728v-2.624a3.193 3.193 0 002.4-3.096c0-.28-.032-.552-.104-.808L12.8 5.808v5.256L8 13.728z"
141
- />
142
- </svg>
143
- </div>
128
+ <path
129
+ d="M14.4 4L7.2 0 0 4v8l7.2 4 7.2-4V4zM7.2 1.832l4.728 2.624L9.52 5.792a3.213 3.213 0 00-4.64 0L2.472 4.456 7.2 1.832zm-.8 11.896l-4.8-2.664V5.808L4.104 7.2A3.193 3.193 0 006.4 11.096v2.632zM5.6 8c0-.88.72-1.6 1.6-1.6.88 0 1.6.72 1.6 1.6 0 .88-.72 1.6-1.6 1.6-.88 0-1.6-.72-1.6-1.6zM8 13.728v-2.624a3.193 3.193 0 002.4-3.096c0-.28-.032-.552-.104-.808L12.8 5.808v5.256L8 13.728z"
130
+ />
131
+ </svg>
144
132
  </div>
145
- <span
146
- class="MuiBadge-badge-72 badgeSizeLarge MuiBadge-anchorOriginTopRightRectangular-78"
147
- />
148
- </span>
133
+ </div>
149
134
  <span
150
- class="MuiBadge-badge-72 makeStyles-qualifier-70 MuiBadge-anchorOriginBottomRightRectangular-80 MuiBadge-invisible-93"
135
+ class="MuiBadge-badge badgeSizeLarge MuiBadge-anchorOriginTopRightRectangular"
151
136
  />
152
137
  </span>
153
- </div>
138
+ <span
139
+ class="MuiBadge-badge badgeSizeMedium badgeBorder MuiBadge-anchorOriginBottomRightRectangular MuiBadge-invisible"
140
+ />
141
+ </span>
154
142
  <h6
155
- class="MuiTypography-root makeStyles-name-63 u-spacellipsis MuiTypography-h6 MuiTypography-colorTextPrimary MuiTypography-alignCenter"
143
+ class="MuiTypography-root makeStyles-name-13 u-spacellipsis MuiTypography-h6 MuiTypography-colorTextPrimary MuiTypography-alignCenter"
156
144
  >
157
145
  testslug
158
146
  </h6>
@@ -161,109 +149,101 @@ exports[`SquareAppIcon component should render an app with the app slug if no na
161
149
 
162
150
  exports[`SquareAppIcon component should render correctly an app in add state 1`] = `
163
151
  <div
164
- class="makeStyles-tileWrapper-192"
152
+ class="makeStyles-tileWrapper-41"
165
153
  data-testid="square-app-icon"
166
154
  >
167
- <div
168
- class="TwakeTheme--light-normal u-dc"
155
+ <span
156
+ class="MuiBadge-root"
169
157
  >
170
158
  <span
171
- class="MuiBadge-root-195"
159
+ class="MuiBadge-root styles__SquareAppIcon-wrapper___3aoSx styles__SquareAppIcon-wrapper--light___AqjR- undefined"
172
160
  >
173
- <span
174
- class="MuiBadge-root-195 styles__SquareAppIcon-wrapper___3aoSx styles__SquareAppIcon-wrapper--light___AqjR- undefined"
161
+ <div
162
+ class="styles__SquareAppIcon-icon-container___AZ5_V styles__SquareAppIcon-icon-container-normal___2eLgM"
175
163
  >
176
164
  <div
177
- class="styles__SquareAppIcon-icon-container___AZ5_V styles__SquareAppIcon-icon-container-normal___2eLgM"
165
+ class="styles__onEnd___1mc8z"
166
+ />
167
+ <svg
168
+ class="styles__icon___23x3R"
169
+ height="16"
170
+ style="fill: var(--primaryColor);"
171
+ viewBox="0 0 14 14"
172
+ width="16"
178
173
  >
179
- <div
180
- class="styles__onEnd___1mc8z"
174
+ <path
175
+ d="M6 8H1a.968.968 0 01-.713-.287A.968.968 0 010 7c0-.283.096-.52.287-.713A.968.968 0 011 6h5V1c0-.283.096-.52.287-.713A.968.968 0 017 0c.283 0 .52.096.713.287A.975.975 0 018 1v5h5c.283 0 .52.096.713.287.191.192.287.43.287.713s-.096.52-.287.713A.968.968 0 0113 8H8v5c0 .283-.096.52-.287.713A.967.967 0 017 14a.967.967 0 01-.713-.287A.968.968 0 016 13V8z"
181
176
  />
182
- <svg
183
- class="styles__icon___23x3R"
184
- height="16"
185
- style="fill: var(--primaryColor);"
186
- viewBox="0 0 14 14"
187
- width="16"
188
- >
189
- <path
190
- d="M6 8H1a.968.968 0 01-.713-.287A.968.968 0 010 7c0-.283.096-.52.287-.713A.968.968 0 011 6h5V1c0-.283.096-.52.287-.713A.968.968 0 017 0c.283 0 .52.096.713.287A.975.975 0 018 1v5h5c.283 0 .52.096.713.287.191.192.287.43.287.713s-.096.52-.287.713A.968.968 0 0113 8H8v5c0 .283-.096.52-.287.713A.967.967 0 017 14a.967.967 0 01-.713-.287A.968.968 0 016 13V8z"
191
- />
192
- </svg>
193
- </div>
194
- <span
195
- class="MuiBadge-badge-196 badgeSizeLarge MuiBadge-anchorOriginTopRightRectangular-202"
196
- />
197
- </span>
177
+ </svg>
178
+ </div>
198
179
  <span
199
- class="MuiBadge-badge-196 makeStyles-qualifier-194 MuiBadge-anchorOriginBottomRightRectangular-204 MuiBadge-invisible-217"
180
+ class="MuiBadge-badge badgeSizeLarge MuiBadge-anchorOriginTopRightRectangular"
200
181
  />
201
182
  </span>
202
- </div>
183
+ <span
184
+ class="MuiBadge-badge badgeSizeMedium badgeBorder MuiBadge-anchorOriginBottomRightRectangular MuiBadge-invisible"
185
+ />
186
+ </span>
203
187
  <h6
204
- class="MuiTypography-root makeStyles-name-187 u-spacellipsis MuiTypography-h6 MuiTypography-colorTextPrimary MuiTypography-alignCenter"
188
+ class="MuiTypography-root makeStyles-name-37 u-spacellipsis MuiTypography-h6 MuiTypography-colorTextPrimary MuiTypography-alignCenter"
205
189
  />
206
190
  </div>
207
191
  `;
208
192
 
209
193
  exports[`SquareAppIcon component should render correctly an app in error state 1`] = `
210
194
  <div
211
- class="makeStyles-tileWrapper-161"
195
+ class="makeStyles-tileWrapper-35"
212
196
  data-testid="square-app-icon"
213
197
  >
214
- <div
215
- class="TwakeTheme--light-normal u-dc"
198
+ <span
199
+ class="MuiBadge-root"
216
200
  >
217
201
  <span
218
- class="MuiBadge-root-164"
202
+ class="MuiBadge-root styles__SquareAppIcon-wrapper___3aoSx styles__SquareAppIcon-wrapper--light___AqjR- undefined"
219
203
  >
220
- <span
221
- class="MuiBadge-root-164 styles__SquareAppIcon-wrapper___3aoSx styles__SquareAppIcon-wrapper--light___AqjR- undefined"
204
+ <div
205
+ class="styles__SquareAppIcon-icon-container___AZ5_V styles__SquareAppIcon-icon-container-normal___2eLgM"
222
206
  >
223
207
  <div
224
- class="styles__SquareAppIcon-icon-container___AZ5_V styles__SquareAppIcon-icon-container-normal___2eLgM"
225
- >
226
- <div
227
- class="styles__onEnd___1mc8z"
228
- />
229
- <div
230
- class="u-w-2 u-h-2"
231
- >
232
- <svg
233
- class="styles__c-app-icon___2W1cp styles__c-app-icon-default___1Bus5 styles__icon___23x3R"
234
- height="100%"
235
- style="fill: var(--coolGrey);"
236
- viewBox="0 0 15 16"
237
- width="100%"
238
- >
239
- <path
240
- d="M14.4 4L7.2 0 0 4v8l7.2 4 7.2-4V4zM7.2 1.832l4.728 2.624L9.52 5.792a3.213 3.213 0 00-4.64 0L2.472 4.456 7.2 1.832zm-.8 11.896l-4.8-2.664V5.808L4.104 7.2A3.193 3.193 0 006.4 11.096v2.632zM5.6 8c0-.88.72-1.6 1.6-1.6.88 0 1.6.72 1.6 1.6 0 .88-.72 1.6-1.6 1.6-.88 0-1.6-.72-1.6-1.6zM8 13.728v-2.624a3.193 3.193 0 002.4-3.096c0-.28-.032-.552-.104-.808L12.8 5.808v5.256L8 13.728z"
241
- />
242
- </svg>
243
- </div>
244
- </div>
245
- <span
246
- class="MuiBadge-badge-165 badgeSizeLarge MuiBadge-anchorOriginTopRightRectangular-171 MuiBadge-colorError-168"
208
+ class="styles__onEnd___1mc8z"
209
+ />
210
+ <div
211
+ class="u-w-2 u-h-2"
247
212
  >
248
213
  <svg
249
- class="makeStyles-errorIcon-160 styles__icon___23x3R"
250
- height="16"
251
- viewBox="0 0 16 16"
252
- width="16"
214
+ class="styles__c-app-icon___2W1cp styles__c-app-icon-default___1Bus5 styles__icon___23x3R"
215
+ height="100%"
216
+ style="fill: var(--coolGrey);"
217
+ viewBox="0 0 15 16"
218
+ width="100%"
253
219
  >
254
220
  <path
255
- d="M8 0C3.584 0 0 3.584 0 8s3.584 8 8 8 8-3.584 8-8-3.584-8-8-8zm.8 12H7.2v-1.6h1.6V12zm0-3.2H7.2V4h1.6v4.8z"
221
+ d="M14.4 4L7.2 0 0 4v8l7.2 4 7.2-4V4zM7.2 1.832l4.728 2.624L9.52 5.792a3.213 3.213 0 00-4.64 0L2.472 4.456 7.2 1.832zm-.8 11.896l-4.8-2.664V5.808L4.104 7.2A3.193 3.193 0 006.4 11.096v2.632zM5.6 8c0-.88.72-1.6 1.6-1.6.88 0 1.6.72 1.6 1.6 0 .88-.72 1.6-1.6 1.6-.88 0-1.6-.72-1.6-1.6zM8 13.728v-2.624a3.193 3.193 0 002.4-3.096c0-.28-.032-.552-.104-.808L12.8 5.808v5.256L8 13.728z"
256
222
  />
257
223
  </svg>
258
- </span>
259
- </span>
224
+ </div>
225
+ </div>
260
226
  <span
261
- class="MuiBadge-badge-165 makeStyles-qualifier-163 MuiBadge-anchorOriginBottomRightRectangular-173 MuiBadge-invisible-186"
262
- />
227
+ class="MuiBadge-badge badgeSizeLarge MuiBadge-anchorOriginTopRightRectangular MuiBadge-colorError"
228
+ >
229
+ <svg
230
+ class="makeStyles-errorIcon-34 styles__icon___23x3R"
231
+ height="16"
232
+ viewBox="0 0 16 16"
233
+ width="16"
234
+ >
235
+ <path
236
+ d="M8 0C3.584 0 0 3.584 0 8s3.584 8 8 8 8-3.584 8-8-3.584-8-8-8zm.8 12H7.2v-1.6h1.6V12zm0-3.2H7.2V4h1.6v4.8z"
237
+ />
238
+ </svg>
239
+ </span>
263
240
  </span>
264
- </div>
241
+ <span
242
+ class="MuiBadge-badge badgeSizeMedium badgeBorder MuiBadge-anchorOriginBottomRightRectangular MuiBadge-invisible"
243
+ />
244
+ </span>
265
245
  <h6
266
- class="MuiTypography-root makeStyles-name-156 u-spacellipsis MuiTypography-h6 MuiTypography-colorTextPrimary MuiTypography-alignCenter"
246
+ class="MuiTypography-root makeStyles-name-31 u-spacellipsis MuiTypography-h6 MuiTypography-colorTextPrimary MuiTypography-alignCenter"
267
247
  >
268
248
  Test
269
249
  </h6>
@@ -272,51 +252,47 @@ exports[`SquareAppIcon component should render correctly an app in error state 1
272
252
 
273
253
  exports[`SquareAppIcon component should render correctly an app in ghost state 1`] = `
274
254
  <div
275
- class="makeStyles-tileWrapper-130"
255
+ class="makeStyles-tileWrapper-29"
276
256
  data-testid="square-app-icon"
277
257
  >
278
- <div
279
- class="TwakeTheme--light-normal u-dc"
258
+ <span
259
+ class="MuiBadge-root"
280
260
  >
281
261
  <span
282
- class="MuiBadge-root-133"
262
+ class="MuiBadge-root styles__SquareAppIcon-wrapper___3aoSx styles__SquareAppIcon-wrapper-ghost___2kj_s styles__SquareAppIcon-wrapper--light___AqjR- makeStyles-squareAppIconGhost-26"
283
263
  >
284
- <span
285
- class="MuiBadge-root-133 styles__SquareAppIcon-wrapper___3aoSx styles__SquareAppIcon-wrapper-ghost___2kj_s styles__SquareAppIcon-wrapper--light___AqjR- makeStyles-squareAppIconGhost-127"
264
+ <div
265
+ class="styles__SquareAppIcon-icon-container___AZ5_V styles__SquareAppIcon-icon-container-normal___2eLgM"
286
266
  >
287
267
  <div
288
- class="styles__SquareAppIcon-icon-container___AZ5_V styles__SquareAppIcon-icon-container-normal___2eLgM"
268
+ class="styles__onEnd___1mc8z"
269
+ />
270
+ <div
271
+ class="u-w-2 u-h-2"
289
272
  >
290
- <div
291
- class="styles__onEnd___1mc8z"
292
- />
293
- <div
294
- class="u-w-2 u-h-2"
273
+ <svg
274
+ class="styles__c-app-icon___2W1cp styles__c-app-icon-default___1Bus5 styles__icon___23x3R"
275
+ height="100%"
276
+ style="fill: var(--coolGrey);"
277
+ viewBox="0 0 15 16"
278
+ width="100%"
295
279
  >
296
- <svg
297
- class="styles__c-app-icon___2W1cp styles__c-app-icon-default___1Bus5 styles__icon___23x3R"
298
- height="100%"
299
- style="fill: var(--coolGrey);"
300
- viewBox="0 0 15 16"
301
- width="100%"
302
- >
303
- <path
304
- d="M14.4 4L7.2 0 0 4v8l7.2 4 7.2-4V4zM7.2 1.832l4.728 2.624L9.52 5.792a3.213 3.213 0 00-4.64 0L2.472 4.456 7.2 1.832zm-.8 11.896l-4.8-2.664V5.808L4.104 7.2A3.193 3.193 0 006.4 11.096v2.632zM5.6 8c0-.88.72-1.6 1.6-1.6.88 0 1.6.72 1.6 1.6 0 .88-.72 1.6-1.6 1.6-.88 0-1.6-.72-1.6-1.6zM8 13.728v-2.624a3.193 3.193 0 002.4-3.096c0-.28-.032-.552-.104-.808L12.8 5.808v5.256L8 13.728z"
305
- />
306
- </svg>
307
- </div>
280
+ <path
281
+ d="M14.4 4L7.2 0 0 4v8l7.2 4 7.2-4V4zM7.2 1.832l4.728 2.624L9.52 5.792a3.213 3.213 0 00-4.64 0L2.472 4.456 7.2 1.832zm-.8 11.896l-4.8-2.664V5.808L4.104 7.2A3.193 3.193 0 006.4 11.096v2.632zM5.6 8c0-.88.72-1.6 1.6-1.6.88 0 1.6.72 1.6 1.6 0 .88-.72 1.6-1.6 1.6-.88 0-1.6-.72-1.6-1.6zM8 13.728v-2.624a3.193 3.193 0 002.4-3.096c0-.28-.032-.552-.104-.808L12.8 5.808v5.256L8 13.728z"
282
+ />
283
+ </svg>
308
284
  </div>
309
- <span
310
- class="MuiBadge-badge-134 badgeSizeLarge MuiBadge-anchorOriginTopRightRectangular-140"
311
- />
312
- </span>
285
+ </div>
313
286
  <span
314
- class="MuiBadge-badge-134 makeStyles-qualifier-132 MuiBadge-anchorOriginBottomRightRectangular-142 MuiBadge-invisible-155"
287
+ class="MuiBadge-badge badgeSizeLarge MuiBadge-anchorOriginTopRightRectangular"
315
288
  />
316
289
  </span>
317
- </div>
290
+ <span
291
+ class="MuiBadge-badge badgeSizeMedium badgeBorder MuiBadge-anchorOriginBottomRightRectangular MuiBadge-invisible"
292
+ />
293
+ </span>
318
294
  <h6
319
- class="MuiTypography-root makeStyles-name-125 u-spacellipsis MuiTypography-h6 MuiTypography-colorTextPrimary MuiTypography-alignCenter"
295
+ class="MuiTypography-root makeStyles-name-25 u-spacellipsis MuiTypography-h6 MuiTypography-colorTextPrimary MuiTypography-alignCenter"
320
296
  >
321
297
  Test
322
298
  </h6>
@@ -325,51 +301,47 @@ exports[`SquareAppIcon component should render correctly an app in ghost state 1
325
301
 
326
302
  exports[`SquareAppIcon component should render correctly an app in maintenance state 1`] = `
327
303
  <div
328
- class="makeStyles-tileWrapper-99"
304
+ class="makeStyles-tileWrapper-23"
329
305
  data-testid="square-app-icon"
330
306
  >
331
- <div
332
- class="TwakeTheme--light-normal u-dc"
307
+ <span
308
+ class="MuiBadge-root"
333
309
  >
334
310
  <span
335
- class="MuiBadge-root-102"
311
+ class="MuiBadge-root styles__SquareAppIcon-wrapper___3aoSx styles__SquareAppIcon-wrapper-maintenance___1svWY styles__SquareAppIcon-wrapper--light___AqjR- undefined"
336
312
  >
337
- <span
338
- class="MuiBadge-root-102 styles__SquareAppIcon-wrapper___3aoSx styles__SquareAppIcon-wrapper-maintenance___1svWY styles__SquareAppIcon-wrapper--light___AqjR- undefined"
313
+ <div
314
+ class="styles__SquareAppIcon-icon-container___AZ5_V styles__SquareAppIcon-icon-container-normal___2eLgM"
339
315
  >
340
316
  <div
341
- class="styles__SquareAppIcon-icon-container___AZ5_V styles__SquareAppIcon-icon-container-normal___2eLgM"
317
+ class="styles__onEnd___1mc8z"
318
+ />
319
+ <div
320
+ class="u-w-2 u-h-2"
342
321
  >
343
- <div
344
- class="styles__onEnd___1mc8z"
345
- />
346
- <div
347
- class="u-w-2 u-h-2"
322
+ <svg
323
+ class="styles__c-app-icon___2W1cp styles__c-app-icon-default___1Bus5 styles__icon___23x3R"
324
+ height="100%"
325
+ style="fill: var(--coolGrey);"
326
+ viewBox="0 0 15 16"
327
+ width="100%"
348
328
  >
349
- <svg
350
- class="styles__c-app-icon___2W1cp styles__c-app-icon-default___1Bus5 styles__icon___23x3R"
351
- height="100%"
352
- style="fill: var(--coolGrey);"
353
- viewBox="0 0 15 16"
354
- width="100%"
355
- >
356
- <path
357
- d="M14.4 4L7.2 0 0 4v8l7.2 4 7.2-4V4zM7.2 1.832l4.728 2.624L9.52 5.792a3.213 3.213 0 00-4.64 0L2.472 4.456 7.2 1.832zm-.8 11.896l-4.8-2.664V5.808L4.104 7.2A3.193 3.193 0 006.4 11.096v2.632zM5.6 8c0-.88.72-1.6 1.6-1.6.88 0 1.6.72 1.6 1.6 0 .88-.72 1.6-1.6 1.6-.88 0-1.6-.72-1.6-1.6zM8 13.728v-2.624a3.193 3.193 0 002.4-3.096c0-.28-.032-.552-.104-.808L12.8 5.808v5.256L8 13.728z"
358
- />
359
- </svg>
360
- </div>
329
+ <path
330
+ d="M14.4 4L7.2 0 0 4v8l7.2 4 7.2-4V4zM7.2 1.832l4.728 2.624L9.52 5.792a3.213 3.213 0 00-4.64 0L2.472 4.456 7.2 1.832zm-.8 11.896l-4.8-2.664V5.808L4.104 7.2A3.193 3.193 0 006.4 11.096v2.632zM5.6 8c0-.88.72-1.6 1.6-1.6.88 0 1.6.72 1.6 1.6 0 .88-.72 1.6-1.6 1.6-.88 0-1.6-.72-1.6-1.6zM8 13.728v-2.624a3.193 3.193 0 002.4-3.096c0-.28-.032-.552-.104-.808L12.8 5.808v5.256L8 13.728z"
331
+ />
332
+ </svg>
361
333
  </div>
362
- <span
363
- class="MuiBadge-badge-103 badgeSizeLarge MuiBadge-anchorOriginTopRightRectangular-109"
364
- />
365
- </span>
334
+ </div>
366
335
  <span
367
- class="MuiBadge-badge-103 makeStyles-qualifier-101 MuiBadge-anchorOriginBottomRightRectangular-111 MuiBadge-invisible-124"
336
+ class="MuiBadge-badge badgeSizeLarge MuiBadge-anchorOriginTopRightRectangular"
368
337
  />
369
338
  </span>
370
- </div>
339
+ <span
340
+ class="MuiBadge-badge badgeSizeMedium badgeBorder MuiBadge-anchorOriginBottomRightRectangular MuiBadge-invisible"
341
+ />
342
+ </span>
371
343
  <h6
372
- class="MuiTypography-root makeStyles-name-94 u-spacellipsis MuiTypography-h6 MuiTypography-colorTextPrimary MuiTypography-alignCenter"
344
+ class="MuiTypography-root makeStyles-name-19 u-spacellipsis MuiTypography-h6 MuiTypography-colorTextPrimary MuiTypography-alignCenter"
373
345
  >
374
346
  Test
375
347
  </h6>
@@ -378,30 +350,31 @@ exports[`SquareAppIcon component should render correctly an app in maintenance s
378
350
 
379
351
  exports[`SquareAppIcon component should render correctly an app in shortcut state 1`] = `
380
352
  <div
381
- class="makeStyles-tileWrapper-223"
353
+ class="makeStyles-tileWrapper-47"
382
354
  data-testid="square-app-icon"
383
355
  >
384
- <div
385
- class="TwakeTheme--light-normal u-dc"
356
+ <span
357
+ class="MuiBadge-root"
386
358
  >
387
359
  <span
388
- class="MuiBadge-root-226"
360
+ class="MuiBadge-root styles__SquareAppIcon-wrapper___3aoSx styles__SquareAppIcon-wrapper--light___AqjR- undefined"
361
+ style="background: palegreen;"
389
362
  >
390
- <span
391
- class="MuiBadge-root-226 styles__SquareAppIcon-wrapper___3aoSx styles__SquareAppIcon-wrapper--light___AqjR- undefined"
392
- style="background: linear-gradient(135deg, #E2FA17 0%, #75D8CB 100%);"
363
+ <h2
364
+ class="MuiTypography-root makeStyles-letter-45 MuiTypography-h2 MuiTypography-colorTextPrimary MuiTypography-alignCenter"
393
365
  >
394
- <h2
395
- class="MuiTypography-root-249 makeStyles-letter-221 MuiTypography-h2-255 MuiTypography-colorTextPrimary-274 MuiTypography-alignCenter-265"
396
- >
397
- S
398
- </h2>
399
- <span
400
- class="MuiBadge-badge-227 badgeSizeLarge MuiBadge-anchorOriginTopRightRectangular-233"
401
- />
402
- </span>
366
+ S
367
+ </h2>
403
368
  <span
404
- class="MuiBadge-badge-227 makeStyles-qualifier-225 MuiBadge-anchorOriginBottomRightRectangular-235"
369
+ class="MuiBadge-badge badgeSizeLarge MuiBadge-anchorOriginTopRightRectangular"
370
+ />
371
+ </span>
372
+ <span
373
+ class="MuiBadge-badge badgeSizeMedium badgeBorder MuiBadge-anchorOriginBottomRightRectangular"
374
+ >
375
+ <div
376
+ class="u-h-1-half u-miw-1-half u-bdrs-circle u-flex u-flex-items-center u-flex-justify-center"
377
+ style="background-color: var(--paperBackgroundColor); color: var(--iconTextColor); box-shadow: var(--shadow3);"
405
378
  >
406
379
  <svg
407
380
  class="styles__icon___23x3R"
@@ -413,11 +386,11 @@ exports[`SquareAppIcon component should render correctly an app in shortcut stat
413
386
  d="M14.222 14.222H1.778V1.778H8V0H1.778C.79 0 0 .8 0 1.778v12.444C0 15.2.791 16 1.778 16h12.444C15.2 16 16 15.2 16 14.222V8h-1.778v6.222zM9.778 0v1.778h3.19l-8.737 8.738 1.253 1.253 8.738-8.738v3.191H16V0H9.778z"
414
387
  />
415
388
  </svg>
416
- </span>
389
+ </div>
417
390
  </span>
418
- </div>
391
+ </span>
419
392
  <h6
420
- class="MuiTypography-root makeStyles-name-218 u-spacellipsis MuiTypography-h6 MuiTypography-colorTextPrimary MuiTypography-alignCenter"
393
+ class="MuiTypography-root makeStyles-name-43 u-spacellipsis MuiTypography-h6 MuiTypography-colorTextPrimary MuiTypography-alignCenter"
421
394
  >
422
395
  shortcut
423
396
  </h6>
@@ -426,48 +399,44 @@ exports[`SquareAppIcon component should render correctly an app in shortcut stat
426
399
 
427
400
  exports[`SquareAppIcon component should render correctly an app with custom content 1`] = `
428
401
  <div
429
- class="makeStyles-tileWrapper-315"
402
+ class="makeStyles-tileWrapper-59"
430
403
  data-testid="square-app-icon"
431
404
  >
432
- <div
433
- class="TwakeTheme--light-normal u-dc"
405
+ <span
406
+ class="MuiBadge-root"
434
407
  >
435
408
  <span
436
- class="MuiBadge-root-318"
409
+ class="MuiBadge-root styles__SquareAppIcon-wrapper___3aoSx styles__SquareAppIcon-wrapper--light___AqjR- undefined"
437
410
  >
438
- <span
439
- class="MuiBadge-root-318 styles__SquareAppIcon-wrapper___3aoSx styles__SquareAppIcon-wrapper--light___AqjR- undefined"
411
+ <div
412
+ class="styles__SquareAppIcon-icon-container___AZ5_V styles__SquareAppIcon-icon-container-normal___2eLgM"
440
413
  >
441
414
  <div
442
- class="styles__SquareAppIcon-icon-container___AZ5_V styles__SquareAppIcon-icon-container-normal___2eLgM"
415
+ class="styles__onEnd___1mc8z"
416
+ />
417
+ <svg
418
+ class="styles__icon___23x3R"
419
+ height="16"
420
+ viewBox="0 0 52 52"
421
+ width="16"
443
422
  >
444
- <div
445
- class="styles__onEnd___1mc8z"
423
+ <path
424
+ d="M38.231 44H13.769C6.175 44 0 37.756 0 30.08c0-3.66 1.394-7.117 3.927-9.733 2.219-2.29 5.093-3.715 8.203-4.086a13.887 13.887 0 014.042-8.292A13.608 13.608 0 0125.801 4c3.62 0 7.04 1.407 9.629 3.968a13.897 13.897 0 014.038 8.25C46.482 16.853 52 22.828 52 30.082 52 37.756 45.82 44 38.23 44h.001zm-.163-3.001h.104c5.97 0 10.828-4.91 10.828-10.947 0-6.035-4.857-10.946-10.828-10.946h-.11c-.779 0-1.417-.627-1.435-1.417C36.492 11.794 31.637 7 25.803 7c-5.835 0-10.692 4.796-10.826 10.69a1.445 1.445 0 01-1.403 1.42C7.744 19.244 3 24.153 3 30.052 3 36.09 7.857 41 13.828 41h.088l.035-.002c.03 0 .062 0 .093.002h24.021l.003-.001zm-4.302-11.776c-.875-.585-.918-1.659-.92-1.706A.52.52 0 0032.32 27a.523.523 0 00-.506.536c.002.039.016.543.251 1.137a7.99 7.99 0 01-11.138.019 3.554 3.554 0 00.257-1.155.523.523 0 00-.503-.536.526.526 0 00-.528.515c0 .043-.042 1.121-.92 1.706a.536.536 0 00-.15.731.51.51 0 00.714.154c.225-.15.414-.322.572-.505a9.006 9.006 0 0012.251-.01c.16.184.35.36.582.515a.503.503 0 00.281.085.516.516 0 00.432-.24.537.537 0 00-.15-.731v.002z"
425
+ fill="#297EF2"
426
+ fill-rule="evenodd"
446
427
  />
447
- <svg
448
- class="styles__icon___23x3R"
449
- height="16"
450
- viewBox="0 0 52 52"
451
- width="16"
452
- >
453
- <path
454
- d="M38.231 44H13.769C6.175 44 0 37.756 0 30.08c0-3.66 1.394-7.117 3.927-9.733 2.219-2.29 5.093-3.715 8.203-4.086a13.887 13.887 0 014.042-8.292A13.608 13.608 0 0125.801 4c3.62 0 7.04 1.407 9.629 3.968a13.897 13.897 0 014.038 8.25C46.482 16.853 52 22.828 52 30.082 52 37.756 45.82 44 38.23 44h.001zm-.163-3.001h.104c5.97 0 10.828-4.91 10.828-10.947 0-6.035-4.857-10.946-10.828-10.946h-.11c-.779 0-1.417-.627-1.435-1.417C36.492 11.794 31.637 7 25.803 7c-5.835 0-10.692 4.796-10.826 10.69a1.445 1.445 0 01-1.403 1.42C7.744 19.244 3 24.153 3 30.052 3 36.09 7.857 41 13.828 41h.088l.035-.002c.03 0 .062 0 .093.002h24.021l.003-.001zm-4.302-11.776c-.875-.585-.918-1.659-.92-1.706A.52.52 0 0032.32 27a.523.523 0 00-.506.536c.002.039.016.543.251 1.137a7.99 7.99 0 01-11.138.019 3.554 3.554 0 00.257-1.155.523.523 0 00-.503-.536.526.526 0 00-.528.515c0 .043-.042 1.121-.92 1.706a.536.536 0 00-.15.731.51.51 0 00.714.154c.225-.15.414-.322.572-.505a9.006 9.006 0 0012.251-.01c.16.184.35.36.582.515a.503.503 0 00.281.085.516.516 0 00.432-.24.537.537 0 00-.15-.731v.002z"
455
- fill="#297EF2"
456
- fill-rule="evenodd"
457
- />
458
- </svg>
459
- </div>
460
- <span
461
- class="MuiBadge-badge-319 badgeSizeLarge MuiBadge-anchorOriginTopRightRectangular-325"
462
- />
463
- </span>
428
+ </svg>
429
+ </div>
464
430
  <span
465
- class="MuiBadge-badge-319 makeStyles-qualifier-317 MuiBadge-anchorOriginBottomRightRectangular-327 MuiBadge-invisible-340"
431
+ class="MuiBadge-badge badgeSizeLarge MuiBadge-anchorOriginTopRightRectangular"
466
432
  />
467
433
  </span>
468
- </div>
434
+ <span
435
+ class="MuiBadge-badge badgeSizeMedium badgeBorder MuiBadge-anchorOriginBottomRightRectangular MuiBadge-invisible"
436
+ />
437
+ </span>
469
438
  <h6
470
- class="MuiTypography-root makeStyles-name-310 u-spacellipsis MuiTypography-h6 MuiTypography-colorTextPrimary MuiTypography-alignCenter"
439
+ class="MuiTypography-root makeStyles-name-55 u-spacellipsis MuiTypography-h6 MuiTypography-colorTextPrimary MuiTypography-alignCenter"
471
440
  >
472
441
  custom icon
473
442
  </h6>