@protonradio/proton-ui 0.8.4 → 0.10.0

package/dist/index.d.ts

@@ -74,7 +74,7 @@ export declare const BadgeVariants: Record<BadgeVariant, BadgeVariant>;
  * @interface BannerProps
  */
 export declare const Banner: {
-    ({ variant, rounded, icon, compact, children, ...props }: BannerProps): JSX_2.Element;
+    ({ variant, rounded, icon, compact, children, "data-testid": dataTestId, }: BannerProps): JSX_2.Element;
     Title: ({ children, ...props }: {
         children: ReactNode;
     }) => JSX_2.Element;
@@ -84,12 +84,6 @@ export declare const Banner: {
     Icon: ({ children, icon, ...props }: BannerIconProps) => JSX_2.Element;
     Action: ({ children, ...props }: ButtonProps) => JSX_2.Element;
     Actions: default_2.FC<BannerActionsProps>;
-    colors: Record<BannerVariant, {
-        background: string;
-        title: string;
-        content: string;
-        icon: string;
-    }>;
     icons: {
         success: JSX_2.Element;
         warning: JSX_2.Element;
@@ -120,7 +114,7 @@ declare interface BannerIconProps {
     children?: ReactNode;
 }
 
-declare interface BannerProps extends BannerIconProps, default_2.HTMLAttributes<HTMLDivElement> {
+declare interface BannerProps extends BannerIconProps {
     /**
      * The banner's visual aesthetic.
      */
@@ -137,6 +131,10 @@ declare interface BannerProps extends BannerIconProps, default_2.HTMLAttributes<
      * The content to display within the banner.
      */
     children: ReactNode;
+    /**
+     * The data-testid to display within the banner.
+     */
+    "data-testid"?: string;
 }
 
 export declare type BannerVariant = "default" | "success" | "warning" | "danger";
@@ -294,9 +292,12 @@ export declare namespace COLORS {
     export {
         BRAND,
         GRAYSCALE,
+        SECONDARY,
         DANGER,
         WARNING,
-        SUCCESS
+        SUCCESS,
+        DARK_GRAYSCALE,
+        DARK_SECONDARY
     }
 }
 
@@ -310,6 +311,28 @@ declare const DANGER: {
     SUPER_LIGHT: string;
 };
 
+declare const DARK_GRAYSCALE: {
+    GRAY_SUPER_DARK: string;
+    GRAY_DARK: string;
+    GRAY_MEDIUM: string;
+    GRAY_MEDIUM_LIGHT: string;
+    GRAY_LIGHT: string;
+    GRAY_LIGHTEST: string;
+    GRAY_SUPER_LIGHT: string;
+    WHITE: string;
+    BORDER: string;
+};
+
+declare const DARK_SECONDARY: {
+    SECONDARY_SUPER_DARK: string;
+    SECONDARY_DARK: string;
+    SECONDARY_MEDIUM: string;
+    SECONDARY_MEDIUM_LIGHT: string;
+    SECONDARY_LIGHT: string;
+    SECONDARY_LIGHTEST: string;
+    SECONDARY_SUPER_LIGHT: string;
+};
+
 /**
  * Intended use in overlay containers such as modals or popovers.
  */
@@ -407,6 +430,25 @@ declare type Palette = {
         SECONDARY_LIGHTEST: string;
         SECONDARY_SUPER_LIGHT: string;
     };
+    SUCCESS: {
+        SUCCESS_DARK: string;
+        SUCCESS_MEDIUM: string;
+        SUCCESS_LIGHT: string;
+        SUCCESS_SUPER_LIGHT: string;
+    };
+    WARNING: {
+        WARNING_DARK: string;
+        WARNING_MEDIUM: string;
+        WARNING_LIGHT: string;
+        WARNING_SUPER_LIGHT: string;
+    };
+    DANGER: {
+        DANGER_SUPER_DARK: string;
+        DANGER_DARK: string;
+        DANGER_MEDIUM: string;
+        DANGER_LIGHT: string;
+        DANGER_SUPER_LIGHT: string;
+    };
 };
 
 /**
@@ -492,13 +534,17 @@ export declare const Row: <T = object>(props: ProtonRowProps<T>) => JSX.Element;
  * Base Overlay component for creating modal-like backgrounds.
  * @interface ScreenOverlayProps
  */
-export declare function ScreenOverlay({ fadeIn, onClose, children, }: ScreenOverlayProps): JSX_2.Element;
+export declare function ScreenOverlay({ fadeIn, fadeOut, onClose, children, }: ScreenOverlayProps): JSX_2.Element;
 
 declare interface ScreenOverlayProps {
     /**
      * Whether to fade in the overlay.
      */
     fadeIn?: boolean;
+    /**
+     * Whether to fade out the overlay. Fade out triggers on click.
+     */
+    fadeOut?: boolean;
     /**
      * Callback function to handle events (click or ESC key).
      */
@@ -527,6 +573,17 @@ declare interface SearchInputProps extends Omit<BaseInputProps, "prefix" | "suff
     value?: string;
 }
 
+declare const SECONDARY: {
+    SUPER_DARK: string;
+    DARK: string;
+    MEDIUM: string;
+    MEDIUM_LIGHT: string;
+    LIGHT: string;
+    LIGHTEST: string;
+    SUPER_LIGHT: string;
+    WHITE: string;
+};
+
 export { Section }
 
 export declare const Select: {