@protonradio/proton-ui 0.9.0 → 0.10.1
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/README.md +73 -73
- package/dist/colors-HcG3PvX2.mjs +80 -0
- package/dist/colors-HcG3PvX2.mjs.map +1 -0
- package/dist/colors-PHtI-zlV.js +2 -0
- package/dist/colors-PHtI-zlV.js.map +1 -0
- package/dist/constants.cjs.js +1 -1
- package/dist/constants.cjs.js.map +1 -1
- package/dist/constants.d.ts +37 -1
- package/dist/constants.es.js +1 -1
- package/dist/constants.es.js.map +1 -1
- package/dist/icons.svg +10 -10
- package/dist/index.cjs.js +13 -13
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.d.ts +67 -4
- package/dist/index.es.js +3079 -2989
- package/dist/index.es.js.map +1 -1
- package/dist/style.css +1 -1
- package/dist/utils-ChGuBC9-.js +2 -0
- package/dist/utils-ChGuBC9-.js.map +1 -0
- package/dist/{utils-pGAnEEqC.mjs → utils-DV74IbLn.mjs} +173 -182
- package/dist/utils-DV74IbLn.mjs.map +1 -0
- package/dist/utils.cjs.js +1 -1
- package/dist/utils.d.ts +20 -5
- package/dist/utils.es.js +10 -12
- package/package.json +91 -91
- package/dist/colors-Bz89s5kE.mjs +0 -44
- package/dist/colors-Bz89s5kE.mjs.map +0 -1
- package/dist/colors-CxxmewYB.js +0 -2
- package/dist/colors-CxxmewYB.js.map +0 -1
- package/dist/utils-BK7HmyM8.js +0 -2
- package/dist/utils-BK7HmyM8.js.map +0 -1
- package/dist/utils-pGAnEEqC.mjs.map +0 -1
package/dist/index.d.ts
CHANGED
|
@@ -74,7 +74,7 @@ export declare const BadgeVariants: Record<BadgeVariant, BadgeVariant>;
|
|
|
74
74
|
* @interface BannerProps
|
|
75
75
|
*/
|
|
76
76
|
export declare const Banner: {
|
|
77
|
-
({ variant, rounded, icon, compact, children,
|
|
77
|
+
({ variant, rounded, icon, compact, children, "data-testid": dataTestId, }: BannerProps): JSX_2.Element;
|
|
78
78
|
Title: ({ children, ...props }: {
|
|
79
79
|
children: ReactNode;
|
|
80
80
|
}) => JSX_2.Element;
|
|
@@ -114,7 +114,7 @@ declare interface BannerIconProps {
|
|
|
114
114
|
children?: ReactNode;
|
|
115
115
|
}
|
|
116
116
|
|
|
117
|
-
declare interface BannerProps extends BannerIconProps
|
|
117
|
+
declare interface BannerProps extends BannerIconProps {
|
|
118
118
|
/**
|
|
119
119
|
* The banner's visual aesthetic.
|
|
120
120
|
*/
|
|
@@ -131,6 +131,10 @@ declare interface BannerProps extends BannerIconProps, default_2.HTMLAttributes<
|
|
|
131
131
|
* The content to display within the banner.
|
|
132
132
|
*/
|
|
133
133
|
children: ReactNode;
|
|
134
|
+
/**
|
|
135
|
+
* The data-testid to display within the banner.
|
|
136
|
+
*/
|
|
137
|
+
"data-testid"?: string;
|
|
134
138
|
}
|
|
135
139
|
|
|
136
140
|
export declare type BannerVariant = "default" | "success" | "warning" | "danger";
|
|
@@ -288,9 +292,12 @@ export declare namespace COLORS {
|
|
|
288
292
|
export {
|
|
289
293
|
BRAND,
|
|
290
294
|
GRAYSCALE,
|
|
295
|
+
SECONDARY,
|
|
291
296
|
DANGER,
|
|
292
297
|
WARNING,
|
|
293
|
-
SUCCESS
|
|
298
|
+
SUCCESS,
|
|
299
|
+
DARK_GRAYSCALE,
|
|
300
|
+
DARK_SECONDARY
|
|
294
301
|
}
|
|
295
302
|
}
|
|
296
303
|
|
|
@@ -304,6 +311,28 @@ declare const DANGER: {
|
|
|
304
311
|
SUPER_LIGHT: string;
|
|
305
312
|
};
|
|
306
313
|
|
|
314
|
+
declare const DARK_GRAYSCALE: {
|
|
315
|
+
GRAY_SUPER_DARK: string;
|
|
316
|
+
GRAY_DARK: string;
|
|
317
|
+
GRAY_MEDIUM: string;
|
|
318
|
+
GRAY_MEDIUM_LIGHT: string;
|
|
319
|
+
GRAY_LIGHT: string;
|
|
320
|
+
GRAY_LIGHTEST: string;
|
|
321
|
+
GRAY_SUPER_LIGHT: string;
|
|
322
|
+
WHITE: string;
|
|
323
|
+
BORDER: string;
|
|
324
|
+
};
|
|
325
|
+
|
|
326
|
+
declare const DARK_SECONDARY: {
|
|
327
|
+
SECONDARY_SUPER_DARK: string;
|
|
328
|
+
SECONDARY_DARK: string;
|
|
329
|
+
SECONDARY_MEDIUM: string;
|
|
330
|
+
SECONDARY_MEDIUM_LIGHT: string;
|
|
331
|
+
SECONDARY_LIGHT: string;
|
|
332
|
+
SECONDARY_LIGHTEST: string;
|
|
333
|
+
SECONDARY_SUPER_LIGHT: string;
|
|
334
|
+
};
|
|
335
|
+
|
|
307
336
|
/**
|
|
308
337
|
* Intended use in overlay containers such as modals or popovers.
|
|
309
338
|
*/
|
|
@@ -401,6 +430,25 @@ declare type Palette = {
|
|
|
401
430
|
SECONDARY_LIGHTEST: string;
|
|
402
431
|
SECONDARY_SUPER_LIGHT: string;
|
|
403
432
|
};
|
|
433
|
+
SUCCESS: {
|
|
434
|
+
SUCCESS_DARK: string;
|
|
435
|
+
SUCCESS_MEDIUM: string;
|
|
436
|
+
SUCCESS_LIGHT: string;
|
|
437
|
+
SUCCESS_SUPER_LIGHT: string;
|
|
438
|
+
};
|
|
439
|
+
WARNING: {
|
|
440
|
+
WARNING_DARK: string;
|
|
441
|
+
WARNING_MEDIUM: string;
|
|
442
|
+
WARNING_LIGHT: string;
|
|
443
|
+
WARNING_SUPER_LIGHT: string;
|
|
444
|
+
};
|
|
445
|
+
DANGER: {
|
|
446
|
+
DANGER_SUPER_DARK: string;
|
|
447
|
+
DANGER_DARK: string;
|
|
448
|
+
DANGER_MEDIUM: string;
|
|
449
|
+
DANGER_LIGHT: string;
|
|
450
|
+
DANGER_SUPER_LIGHT: string;
|
|
451
|
+
};
|
|
404
452
|
};
|
|
405
453
|
|
|
406
454
|
/**
|
|
@@ -486,13 +534,17 @@ export declare const Row: <T = object>(props: ProtonRowProps<T>) => JSX.Element;
|
|
|
486
534
|
* Base Overlay component for creating modal-like backgrounds.
|
|
487
535
|
* @interface ScreenOverlayProps
|
|
488
536
|
*/
|
|
489
|
-
export declare function ScreenOverlay({ fadeIn, onClose, children, }: ScreenOverlayProps): JSX_2.Element;
|
|
537
|
+
export declare function ScreenOverlay({ fadeIn, fadeOut, onClose, children, }: ScreenOverlayProps): JSX_2.Element;
|
|
490
538
|
|
|
491
539
|
declare interface ScreenOverlayProps {
|
|
492
540
|
/**
|
|
493
541
|
* Whether to fade in the overlay.
|
|
494
542
|
*/
|
|
495
543
|
fadeIn?: boolean;
|
|
544
|
+
/**
|
|
545
|
+
* Whether to fade out the overlay. Fade out triggers on click.
|
|
546
|
+
*/
|
|
547
|
+
fadeOut?: boolean;
|
|
496
548
|
/**
|
|
497
549
|
* Callback function to handle events (click or ESC key).
|
|
498
550
|
*/
|
|
@@ -521,6 +573,17 @@ declare interface SearchInputProps extends Omit<BaseInputProps, "prefix" | "suff
|
|
|
521
573
|
value?: string;
|
|
522
574
|
}
|
|
523
575
|
|
|
576
|
+
declare const SECONDARY: {
|
|
577
|
+
SUPER_DARK: string;
|
|
578
|
+
DARK: string;
|
|
579
|
+
MEDIUM: string;
|
|
580
|
+
MEDIUM_LIGHT: string;
|
|
581
|
+
LIGHT: string;
|
|
582
|
+
LIGHTEST: string;
|
|
583
|
+
SUPER_LIGHT: string;
|
|
584
|
+
WHITE: string;
|
|
585
|
+
};
|
|
586
|
+
|
|
524
587
|
export { Section }
|
|
525
588
|
|
|
526
589
|
export declare const Select: {
|