@gouvfr-lasuite/ui-kit 0.16.2 → 0.17.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 (9) hide show
  1. package/dist/cunningham.ts +320 -245
  2. package/dist/index.cjs +29 -29
  3. package/dist/index.cjs.map +1 -1
  4. package/dist/index.d.ts +287 -203
  5. package/dist/index.js +6304 -6011
  6. package/dist/index.js.map +1 -1
  7. package/dist/storybook/logo-fichiers.svg +3 -3
  8. package/dist/style.css +1 -1
  9. package/package.json +2 -2
package/dist/index.d.ts CHANGED
@@ -54,10 +54,13 @@ export declare type AddShareUserListProps<UserType> = {
54
54
  onSelectRole: (role: string) => void;
55
55
  };
56
56
 
57
+ export declare const AVATAR_COLORS: string[];
58
+
57
59
  export declare type AvatarProps = {
58
60
  fullName: string;
59
61
  size?: "xsmall" | "small" | "medium" | "large";
60
62
  forceColor?: string;
63
+ backgroundColor?: (typeof AVATAR_COLORS)[number];
61
64
  };
62
65
 
63
66
  export declare const Badge: ({ children, uppercased, type, className, ...props }: PropsWithChildren<BadgeProps>) => JSX.Element;
@@ -89,99 +92,296 @@ export declare const containerSizeMap: Record<IconSize, number>;
89
92
  export declare const cunninghamConfig: {
90
93
  themes: {
91
94
  default: {
92
- theme: {
95
+ globals: {
93
96
  colors: {
94
- "primary-text": string;
95
- "primary-050": string;
96
- "primary-100": string;
97
- "primary-150": string;
98
- "primary-200": string;
99
- "primary-300": string;
100
- "primary-400": string;
101
- "primary-500": string;
102
- "primary-600": string;
103
- "primary-700": string;
104
- "primary-800": string;
105
- "primary-900": string;
106
- "secondary-text": string;
107
- "secondary-100": string;
108
- "secondary-200": string;
109
- "secondary-300": string;
110
- "secondary-400": string;
111
- "secondary-500": string;
112
- "secondary-600": string;
113
- "secondary-700": string;
114
- "secondary-800": string;
115
- "secondary-900": string;
116
- "greyscale-text": string;
117
- "greyscale-000": string;
118
- "greyscale-050": string;
119
- "greyscale-100": string;
120
- "greyscale-200": string;
121
- "greyscale-250": string;
122
- "greyscale-300": string;
123
- "greyscale-350": string;
124
- "greyscale-400": string;
125
- "greyscale-500": string;
126
- "greyscale-600": string;
127
- "greyscale-700": string;
128
- "greyscale-750": string;
129
- "greyscale-800": string;
130
- "greyscale-900": string;
131
- "greyscale-950": string;
132
- "greyscale-1000": string;
133
- "success-text": string;
134
- "success-100": string;
135
- "success-200": string;
136
- "success-300": string;
137
- "success-400": string;
138
- "success-500": string;
139
- "success-600": string;
140
- "success-700": string;
141
- "success-800": string;
142
- "success-900": string;
143
- "info-text": string;
97
+ "brand-050": string;
98
+ "brand-100": string;
99
+ "brand-150": string;
100
+ "brand-200": string;
101
+ "brand-250": string;
102
+ "brand-300": string;
103
+ "brand-350": string;
104
+ "brand-400": string;
105
+ "brand-450": string;
106
+ "brand-500": string;
107
+ "brand-550": string;
108
+ "brand-600": string;
109
+ "brand-650": string;
110
+ "brand-700": string;
111
+ "brand-750": string;
112
+ "brand-800": string;
113
+ "brand-850": string;
114
+ "brand-900": string;
115
+ "brand-950": string;
116
+ "gray-000": string;
117
+ "gray-025": string;
118
+ "gray-050": string;
119
+ "gray-100": string;
120
+ "gray-150": string;
121
+ "gray-200": string;
122
+ "gray-250": string;
123
+ "gray-300": string;
124
+ "gray-350": string;
125
+ "gray-400": string;
126
+ "gray-450": string;
127
+ "gray-500": string;
128
+ "gray-550": string;
129
+ "gray-600": string;
130
+ "gray-650": string;
131
+ "gray-700": string;
132
+ "gray-750": string;
133
+ "gray-800": string;
134
+ "gray-850": string;
135
+ "gray-900": string;
136
+ "gray-950": string;
137
+ "gray-1000": string;
138
+ "info-050": string;
144
139
  "info-100": string;
140
+ "info-150": string;
145
141
  "info-200": string;
142
+ "info-250": string;
146
143
  "info-300": string;
144
+ "info-350": string;
147
145
  "info-400": string;
146
+ "info-450": string;
148
147
  "info-500": string;
148
+ "info-550": string;
149
149
  "info-600": string;
150
+ "info-650": string;
150
151
  "info-700": string;
152
+ "info-750": string;
151
153
  "info-800": string;
154
+ "info-850": string;
152
155
  "info-900": string;
153
- "warning-text": string;
156
+ "info-950": string;
157
+ "success-050": string;
158
+ "success-100": string;
159
+ "success-150": string;
160
+ "success-200": string;
161
+ "success-250": string;
162
+ "success-300": string;
163
+ "success-350": string;
164
+ "success-400": string;
165
+ "success-450": string;
166
+ "success-500": string;
167
+ "success-550": string;
168
+ "success-600": string;
169
+ "success-650": string;
170
+ "success-700": string;
171
+ "success-750": string;
172
+ "success-800": string;
173
+ "success-850": string;
174
+ "success-900": string;
175
+ "success-950": string;
176
+ "warning-050": string;
154
177
  "warning-100": string;
178
+ "warning-150": string;
155
179
  "warning-200": string;
180
+ "warning-250": string;
156
181
  "warning-300": string;
182
+ "warning-350": string;
157
183
  "warning-400": string;
184
+ "warning-450": string;
158
185
  "warning-500": string;
186
+ "warning-550": string;
159
187
  "warning-600": string;
188
+ "warning-650": string;
160
189
  "warning-700": string;
190
+ "warning-750": string;
161
191
  "warning-800": string;
192
+ "warning-850": string;
162
193
  "warning-900": string;
163
- "danger-text": string;
164
- "danger-050": string;
165
- "danger-100": string;
166
- "danger-200": string;
167
- "danger-300": string;
168
- "danger-400": string;
169
- "danger-500": string;
170
- "danger-600": string;
171
- "danger-700": string;
172
- "danger-800": string;
173
- "danger-900": string;
174
- "blue-500": string;
194
+ "warning-950": string;
195
+ "error-050": string;
196
+ "error-100": string;
197
+ "error-150": string;
198
+ "error-200": string;
199
+ "error-250": string;
200
+ "error-300": string;
201
+ "error-350": string;
202
+ "error-400": string;
203
+ "error-450": string;
204
+ "error-500": string;
205
+ "error-550": string;
206
+ "error-600": string;
207
+ "error-650": string;
208
+ "error-700": string;
209
+ "error-750": string;
210
+ "error-800": string;
211
+ "error-850": string;
212
+ "error-900": string;
213
+ "error-950": string;
214
+ "red-050": string;
215
+ "red-100": string;
216
+ "red-150": string;
217
+ "red-200": string;
218
+ "red-250": string;
219
+ "red-300": string;
220
+ "red-350": string;
221
+ "red-400": string;
222
+ "red-450": string;
223
+ "red-500": string;
224
+ "red-550": string;
225
+ "red-600": string;
226
+ "red-650": string;
227
+ "red-700": string;
228
+ "red-750": string;
229
+ "red-800": string;
230
+ "red-850": string;
231
+ "red-900": string;
232
+ "red-950": string;
233
+ "orange-050": string;
234
+ "orange-100": string;
235
+ "orange-150": string;
236
+ "orange-200": string;
237
+ "orange-250": string;
238
+ "orange-300": string;
239
+ "orange-350": string;
240
+ "orange-400": string;
241
+ "orange-450": string;
242
+ "orange-500": string;
243
+ "orange-550": string;
244
+ "orange-600": string;
245
+ "orange-650": string;
246
+ "orange-700": string;
247
+ "orange-750": string;
248
+ "orange-800": string;
249
+ "orange-850": string;
250
+ "orange-900": string;
251
+ "orange-950": string;
252
+ "brown-050": string;
253
+ "brown-100": string;
254
+ "brown-150": string;
255
+ "brown-200": string;
256
+ "brown-250": string;
257
+ "brown-300": string;
258
+ "brown-350": string;
259
+ "brown-400": string;
260
+ "brown-450": string;
175
261
  "brown-500": string;
176
- "cyan-500": string;
177
- "gold-500": string;
262
+ "brown-550": string;
263
+ "brown-600": string;
264
+ "brown-650": string;
265
+ "brown-700": string;
266
+ "brown-750": string;
267
+ "brown-800": string;
268
+ "brown-850": string;
269
+ "brown-900": string;
270
+ "brown-950": string;
271
+ "yellow-050": string;
272
+ "yellow-100": string;
273
+ "yellow-150": string;
274
+ "yellow-200": string;
275
+ "yellow-250": string;
276
+ "yellow-300": string;
277
+ "yellow-350": string;
278
+ "yellow-400": string;
279
+ "yellow-450": string;
280
+ "yellow-500": string;
281
+ "yellow-550": string;
282
+ "yellow-600": string;
283
+ "yellow-650": string;
284
+ "yellow-700": string;
285
+ "yellow-750": string;
286
+ "yellow-800": string;
287
+ "yellow-850": string;
288
+ "yellow-900": string;
289
+ "yellow-950": string;
290
+ "green-050": string;
291
+ "green-100": string;
292
+ "green-150": string;
293
+ "green-200": string;
294
+ "green-250": string;
295
+ "green-300": string;
296
+ "green-350": string;
297
+ "green-400": string;
298
+ "green-450": string;
178
299
  "green-500": string;
179
- "olive-500": string;
180
- "orange-500": string;
300
+ "green-550": string;
301
+ "green-600": string;
302
+ "green-650": string;
303
+ "green-700": string;
304
+ "green-750": string;
305
+ "green-800": string;
306
+ "green-850": string;
307
+ "green-900": string;
308
+ "green-950": string;
309
+ "blue1-050": string;
310
+ "blue1-100": string;
311
+ "blue1-150": string;
312
+ "blue1-200": string;
313
+ "blue1-250": string;
314
+ "blue1-300": string;
315
+ "blue1-350": string;
316
+ "blue1-400": string;
317
+ "blue1-450": string;
318
+ "blue1-500": string;
319
+ "blue1-550": string;
320
+ "blue1-600": string;
321
+ "blue1-650": string;
322
+ "blue1-700": string;
323
+ "blue1-750": string;
324
+ "blue1-800": string;
325
+ "blue1-850": string;
326
+ "blue1-900": string;
327
+ "blue1-950": string;
328
+ "blue2-050": string;
329
+ "blue2-100": string;
330
+ "blue2-150": string;
331
+ "blue2-200": string;
332
+ "blue2-250": string;
333
+ "blue2-300": string;
334
+ "blue2-350": string;
335
+ "blue2-400": string;
336
+ "blue2-450": string;
337
+ "blue2-500": string;
338
+ "blue2-550": string;
339
+ "blue2-600": string;
340
+ "blue2-650": string;
341
+ "blue2-700": string;
342
+ "blue2-750": string;
343
+ "blue2-800": string;
344
+ "blue2-850": string;
345
+ "blue2-900": string;
346
+ "blue2-950": string;
347
+ "purple-050": string;
348
+ "purple-100": string;
349
+ "purple-150": string;
350
+ "purple-200": string;
351
+ "purple-250": string;
352
+ "purple-300": string;
353
+ "purple-350": string;
354
+ "purple-400": string;
355
+ "purple-450": string;
181
356
  "purple-500": string;
182
- "red-500": string;
183
- "yellow-500": string;
184
- "rose-500": string;
357
+ "purple-550": string;
358
+ "purple-600": string;
359
+ "purple-650": string;
360
+ "purple-700": string;
361
+ "purple-750": string;
362
+ "purple-800": string;
363
+ "purple-850": string;
364
+ "purple-900": string;
365
+ "purple-950": string;
366
+ "pink-050": string;
367
+ "pink-100": string;
368
+ "pink-150": string;
369
+ "pink-200": string;
370
+ "pink-250": string;
371
+ "pink-300": string;
372
+ "pink-350": string;
373
+ "pink-400": string;
374
+ "pink-450": string;
375
+ "pink-500": string;
376
+ "pink-550": string;
377
+ "pink-600": string;
378
+ "pink-650": string;
379
+ "pink-700": string;
380
+ "pink-750": string;
381
+ "pink-800": string;
382
+ "pink-850": string;
383
+ "pink-900": string;
384
+ "pink-950": string;
185
385
  };
186
386
  font: {
187
387
  sizes: {
@@ -256,62 +456,8 @@ export declare const cunninghamConfig: {
256
456
  "medium-height": string;
257
457
  "medium-text-height": string;
258
458
  "border-radius": string;
259
- "small-height": string;
260
- primary: {
261
- "background--color": string;
262
- "background--color-hover": string;
263
- "background--color-active": string;
264
- "background--color-disabled": string;
265
- color: string;
266
- "color-hover": string;
267
- "color-active": string;
268
- "color-focus-visible": string;
269
- disabled: string;
270
- };
271
- "primary-text": {
272
- "background--color": string;
273
- "background--color-hover": string;
274
- "background--color-active": string;
275
- "background--color-focus-visible": string;
276
- "background--color-disabled": string;
277
- color: string;
278
- "color-hover": string;
279
- disabled: string;
280
- };
281
- secondary: {
282
- "background--color-hover": string;
283
- "background--color-active": string;
284
- "background--color-focus-visible": string;
285
- "background--disabled": string;
286
- color: string;
287
- "border--color": string;
288
- "border--color-hover": string;
289
- "border--color-disabled": string;
290
- disabled: string;
291
- };
292
- tertiary: {
293
- "background--color": string;
294
- "background--color-focus-visible": string;
295
- "background--color-hover": string;
296
- "background--color-active": string;
297
- "background--disabled": string;
298
- color: string;
299
- disabled: string;
300
- };
301
- "tertiary-text": {
302
- "background--color-hover": string;
303
- "color-hover": string;
304
- color: string;
305
- disabled: string;
306
- };
307
- danger: {
308
- "color-hover": string;
309
- "background--color": string;
310
- "background--color-hover": string;
311
- "background--color-focus-visible": string;
312
- "background--color-disabled": string;
313
- "color-disabled": string;
314
- };
459
+ "border-radius--active": string;
460
+ "border-radius--focus": string;
315
461
  };
316
462
  datagrid: {
317
463
  "header--color": string;
@@ -320,73 +466,6 @@ export declare const cunninghamConfig: {
320
466
  "body--background-color-hover": string;
321
467
  };
322
468
  "forms-checkbox": {
323
- "border-radius": string;
324
- "border-color": string;
325
- "background-color--hover": string;
326
- "border--color-disabled": string;
327
- "border--color": string;
328
- "background--disabled": string;
329
- "background--enable": string;
330
- "check--disabled": string;
331
- "check--enable": string;
332
- color: string;
333
- "label--color": string;
334
- "label--size": string;
335
- "label--weight": string;
336
- "text--color": string;
337
- "text--size": string;
338
- "text--weight": string;
339
- "text--color-disabled": string;
340
- };
341
- "forms-labelledbox": {
342
- "label-color--small": string;
343
- "label-color--small--disabled": string;
344
- "label-color--big": string;
345
- "label-color--big--disabled": string;
346
- };
347
- "forms-radio": {
348
- "border-color": string;
349
- "background-color": string;
350
- "accent-color": string;
351
- "accent-color-disabled": string;
352
- };
353
- "forms-switch": {
354
- "border--color-disabled": string;
355
- "border--color": string;
356
- "handle-background-color": string;
357
- "handle-background-color--disabled": string;
358
- "rail-background-color--disabled": string;
359
- "accent-color": string;
360
- };
361
- "forms-textarea": {
362
- "label-color--focus": string;
363
- "border-radius": string;
364
- "border-color": string;
365
- "box-shadow--color--hover": string;
366
- "box-shadow--color--focus": string;
367
- "value-color": string;
368
- "value-color--disabled": string;
369
- "font-size": string;
370
- };
371
- "forms-input": {
372
- "label-color--focus": string;
373
- "border-radius": string;
374
- "border-color": string;
375
- "box-shadow--color--hover": string;
376
- "box-shadow--color--focus": string;
377
- "value-color": string;
378
- "value-color--disabled": string;
379
- "font-size": string;
380
- };
381
- "forms-select": {
382
- "label-color--focus": string;
383
- "item-font-size": string;
384
- "border-radius": string;
385
- "border-radius-hover": string;
386
- "border-color": string;
387
- "box-shadow--color--hover": string;
388
- "box-shadow--color--focus": string;
389
- "value-color": string;
390
469
  "font-size": string;
391
470
  };
392
471
  badge: {
@@ -608,20 +687,22 @@ export declare const LaGaufre: () => JSX.Element;
608
687
  * - `size`: The size of the CTA.
609
688
  * - `color`: The color of the CTA.
610
689
  */
611
- export declare const LanguagePicker: ({ languages, onChange, size, color, fullWidth }: LanguagePickerProps) => JSX.Element;
690
+ export declare const LanguagePicker: ({ languages, onChange, size, color, variant, fullWidth, }: LanguagePickerProps) => JSX.Element;
612
691
 
613
692
  export declare type LanguagePickerProps = {
614
693
  languages: DropdownMenuOption[];
615
694
  onChange?: (language: string) => void;
616
695
  color?: ButtonProps["color"];
696
+ variant?: ButtonProps["variant"];
617
697
  size?: ButtonProps["size"];
618
698
  fullWidth?: ButtonProps["fullWidth"];
619
699
  };
620
700
 
621
- export declare const LeftPanel: ({ children, isOpen, }: PropsWithChildren<LeftPanelProps>) => JSX.Element;
701
+ export declare const LeftPanel: ({ children, isOpen, hasHeader, }: PropsWithChildren<LeftPanelProps>) => JSX.Element;
622
702
 
623
703
  export declare type LeftPanelProps = {
624
704
  isOpen?: boolean;
705
+ hasHeader?: boolean;
625
706
  };
626
707
 
627
708
  declare type Link = {
@@ -1028,13 +1109,19 @@ export declare type QuickSearchProps = {
1028
1109
  children?: ReactNode;
1029
1110
  };
1030
1111
 
1112
+ declare type ResponsiveStates = {
1113
+ isMobile: boolean;
1114
+ isTablet: boolean;
1115
+ isDesktop: boolean;
1116
+ };
1117
+
1031
1118
  export declare const SearchUserItem: <UserType>({ user, }: SearchUserItemProps<UserType>) => JSX.Element;
1032
1119
 
1033
1120
  declare type SearchUserItemProps<UserType> = {
1034
1121
  user: UserData<UserType>;
1035
1122
  };
1036
1123
 
1037
- export declare const ShareInvitationItem: <UserType, InvitationType>({ invitation, roles, updateRole, deleteInvitation, canUpdate, roleTopMessage, }: ShareInvitationItemProps<UserType, InvitationType>) => JSX.Element;
1124
+ export declare const ShareInvitationItem: <UserType, InvitationType>({ invitation, roles, updateRole, deleteInvitation, canUpdate, showMoreActionsButton, roleTopMessage, }: ShareInvitationItemProps<UserType, InvitationType>) => JSX.Element;
1038
1125
 
1039
1126
  export declare type ShareInvitationItemProps<UserType, InvitationType> = {
1040
1127
  invitation: InvitationData<UserType, InvitationType>;
@@ -1043,6 +1130,7 @@ export declare type ShareInvitationItemProps<UserType, InvitationType> = {
1043
1130
  deleteInvitation?: (invitation: InvitationData<UserType, InvitationType>) => void;
1044
1131
  canUpdate?: boolean;
1045
1132
  roleTopMessage?: string;
1133
+ showMoreActionsButton?: boolean;
1046
1134
  };
1047
1135
 
1048
1136
  export declare const ShareMemberItem: <UserType, AccessType>({ accessData, roles, updateRole, deleteAccess, canUpdate, roleTopMessage, }: ShareMemberItemProps<UserType, AccessType>) => JSX.Element;
@@ -1326,7 +1414,7 @@ export declare const useDropdownMenu: () => {
1326
1414
  setIsOpen: Dispatch<SetStateAction<boolean>>;
1327
1415
  };
1328
1416
 
1329
- export declare const UserAvatar: ({ fullName, size, forceColor, }: AvatarProps) => JSX.Element;
1417
+ export declare const UserAvatar: ({ fullName, size, forceColor, backgroundColor: color, }: AvatarProps) => JSX.Element;
1330
1418
 
1331
1419
  export declare type UserData<T> = T & {
1332
1420
  id: string;
@@ -1334,11 +1422,7 @@ export declare type UserData<T> = T & {
1334
1422
  email: string;
1335
1423
  };
1336
1424
 
1337
- export declare const useResponsive: () => {
1338
- isMobile: boolean;
1339
- isTablet: boolean;
1340
- isDesktop: boolean;
1341
- };
1425
+ export declare const useResponsive: () => ResponsiveStates;
1342
1426
 
1343
1427
  /**
1344
1428
  * User menu component.