@rarui/styles 2.3.0-rc.1 → 2.3.0-rc.2

package/dist/packages/navigation/pagination/rarui-pagination.css.d.ts

@@ -0,0 +1,49 @@
+import { RuntimeFn } from '../../../node_modules/@vanilla-extract/recipes/dist/vanilla-extract-recipes.cjs.d.js';
+
+declare const paginationStyles: {
+    container: RuntimeFn<{
+        size: {
+            dot: {
+                gap: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            };
+            small: {};
+            large: {};
+        };
+    }>;
+    item: RuntimeFn<{
+        selected: {
+            true: {
+                backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                ":hover": {
+                    backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                    color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+            };
+        };
+        /**
+         * Specifies the size of the Pagination component.
+         * @default medium
+         */
+        size: {
+            dot: {
+                width: "0.75rem";
+                height: "0.75rem";
+                borderRadius: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            };
+            small: {
+                minWidth: "2.5rem";
+                height: "2.5rem";
+                fontSize: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            };
+            large: {
+                minWidth: "2.75rem";
+                height: "2.75rem";
+                fontSize: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            };
+        };
+    }>;
+};
+
+export { paginationStyles };

package/dist/packages/navigation/pagination/rarui-pagination.types.d.ts

@@ -0,0 +1,6 @@
+import { RecipeVariants } from '../../../node_modules/@vanilla-extract/recipes/dist/vanilla-extract-recipes.cjs.d.js';
+import { paginationStyles } from './rarui-pagination.css.js';
+
+type PaginationVariants = Omit<NonNullable<RecipeVariants<typeof paginationStyles.item>>, "selected">;
+
+export type { PaginationVariants };

package/dist/packages/navigation/sideNavigation/index.d.ts

@@ -0,0 +1,75 @@
+import { RuntimeFn } from '../../../node_modules/@vanilla-extract/recipes/dist/vanilla-extract-recipes.cjs.d.js';
+
+declare const sideNavigation: {
+    classnames: {
+        sideNavigation: RuntimeFn<{
+            active: {
+                true: {
+                    color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                    ":after": {
+                        content: "";
+                        position: "absolute";
+                        left: number;
+                        right: number;
+                        top: number;
+                        bottom: number;
+                        backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                    };
+                    ":hover": {
+                        backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                    };
+                    ":active": {
+                        backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                    };
+                    ":disabled": {
+                        backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                        cursor: "not-allowed";
+                    };
+                };
+            };
+        }>;
+        item: RuntimeFn<{
+            level: {
+                0: {
+                    paddingLeft: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+                1: {
+                    paddingLeft: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+                2: {
+                    paddingLeft: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+            };
+        }>;
+        name: RuntimeFn<{
+            active: {
+                true: {
+                    color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+            };
+            disabled: {
+                true: {
+                    color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+            };
+        }>;
+        description: RuntimeFn<{
+            disabled: {
+                true: {
+                    color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+            };
+        }>;
+        content: RuntimeFn<{
+            open: {
+                true: {
+                    overflow: "visible";
+                    maxHeight: "unset";
+                    marginTop: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+            };
+        }>;
+    };
+};
+
+export { sideNavigation };

package/dist/packages/navigation/sideNavigation/rarui-sideNavigation.css.d.ts

@@ -0,0 +1,76 @@
+import { RuntimeFn } from '../../../node_modules/@vanilla-extract/recipes/dist/vanilla-extract-recipes.cjs.d.js';
+
+declare const sideNavigationStyles: {
+    sideNavigation: RuntimeFn<{
+        active: {
+            true: {
+                color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                ":after": {
+                    content: "";
+                    position: "absolute";
+                    left: number;
+                    right: number;
+                    top: number;
+                    bottom: number;
+                    backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+                ":hover": {
+                    backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+                ":active": {
+                    backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+                ":disabled": {
+                    backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                    cursor: "not-allowed";
+                };
+            };
+        };
+    }>;
+    item: RuntimeFn<{
+        /**
+         * Determines the level of nesting for the item.
+         */
+        level: {
+            0: {
+                paddingLeft: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            };
+            1: {
+                paddingLeft: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            };
+            2: {
+                paddingLeft: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            };
+        };
+    }>;
+    name: RuntimeFn<{
+        active: {
+            true: {
+                color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            };
+        };
+        disabled: {
+            true: {
+                color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            };
+        };
+    }>;
+    description: RuntimeFn<{
+        disabled: {
+            true: {
+                color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            };
+        };
+    }>;
+    content: RuntimeFn<{
+        open: {
+            true: {
+                overflow: "visible";
+                maxHeight: "unset";
+                marginTop: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            };
+        };
+    }>;
+};
+
+export { sideNavigationStyles };

package/dist/packages/navigation/sideNavigation/rarui-sideNavigation.types.d.ts

@@ -0,0 +1,6 @@
+import { RecipeVariants } from '../../../node_modules/@vanilla-extract/recipes/dist/vanilla-extract-recipes.cjs.d.js';
+import { sideNavigationStyles } from './rarui-sideNavigation.css.js';
+
+type SideNavigationVariants = NonNullable<RecipeVariants<typeof sideNavigationStyles.sideNavigation> & RecipeVariants<typeof sideNavigationStyles.item>>;
+
+export type { SideNavigationVariants };

package/dist/packages/navigation/tabs/index.d.ts

@@ -0,0 +1,65 @@
+import { RuntimeFn } from '../../../node_modules/@vanilla-extract/recipes/dist/vanilla-extract-recipes.cjs.d.js';
+
+declare const tabs: {
+    classnames: {
+        ul: RuntimeFn<{
+            underlined: {
+                true: {
+                    padding: number;
+                    borderRadius: number;
+                    borderColor: "transparent";
+                    backgroundColor: "transparent";
+                    borderBottomColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+            };
+            position: {
+                left: {
+                    justifyContent: "flex-start";
+                };
+                center: {
+                    justifyContent: "center";
+                };
+                right: {
+                    justifyContent: "flex-end";
+                };
+            };
+        }>;
+        li: RuntimeFn<{
+            full: {
+                true: {
+                    flex: "1";
+                };
+            };
+        }>;
+        button: RuntimeFn<{
+            underlined: {
+                true: {
+                    borderRadius: number;
+                    borderColor: "transparent";
+                    backgroundColor: "transparent";
+                    borderBottomColor: "transparent";
+                    ":hover": {
+                        boxShadow: "none";
+                        borderBottomColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                    };
+                    ":disabled": {
+                        borderBottomColor: "transparent";
+                    };
+                };
+            };
+            selected: {
+                true: {
+                    backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                    color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                    borderColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                    ":disabled": {
+                        backgroundColor: "transparent";
+                        borderColor: "transparent";
+                    };
+                };
+            };
+        }>;
+    };
+};
+
+export { tabs };

package/dist/packages/navigation/tabs/rarui-tabs.css.d.ts

@@ -0,0 +1,79 @@
+import { RuntimeFn } from '../../../node_modules/@vanilla-extract/recipes/dist/vanilla-extract-recipes.cjs.d.js';
+
+declare const tabsStyles: {
+    ul: RuntimeFn<{
+        /**
+         * Determines whether the tabs should have an underline style.
+         */
+        underlined: {
+            true: {
+                padding: number;
+                borderRadius: number;
+                borderColor: "transparent";
+                backgroundColor: "transparent";
+                borderBottomColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            };
+        };
+        /**
+         * Controls where the tab buttons are displayed. This prop accepts one of the following values: "left", "center", or "right".
+         * @default left
+         */
+        position: {
+            left: {
+                justifyContent: "flex-start";
+            };
+            center: {
+                justifyContent: "center";
+            };
+            right: {
+                justifyContent: "flex-end";
+            };
+        };
+    }>;
+    li: RuntimeFn<{
+        /**
+         * Determines whether the tabs should occupy the full width of their container.
+         */
+        full: {
+            true: {
+                flex: "1";
+            };
+        };
+    }>;
+    button: RuntimeFn<{
+        /**
+         * Determines whether the tabs should have an underline style.
+         */
+        underlined: {
+            true: {
+                borderRadius: number;
+                borderColor: "transparent";
+                backgroundColor: "transparent";
+                borderBottomColor: "transparent";
+                ":hover": {
+                    boxShadow: "none";
+                    borderBottomColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+                ":disabled": {
+                    borderBottomColor: "transparent";
+                };
+            };
+        };
+        /**
+         * Indicates whether the button is currently selected. This is used to style the button accordingly.
+         */
+        selected: {
+            true: {
+                backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                borderColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                ":disabled": {
+                    backgroundColor: "transparent";
+                    borderColor: "transparent";
+                };
+            };
+        };
+    }>;
+};
+
+export { tabsStyles };

package/dist/packages/navigation/tabs/rarui-tabs.types.d.ts

@@ -0,0 +1,6 @@
+import { RecipeVariants } from '../../../node_modules/@vanilla-extract/recipes/dist/vanilla-extract-recipes.cjs.d.js';
+import { tabsStyles } from './rarui-tabs.css.js';
+
+type TabsVariants = NonNullable<RecipeVariants<typeof tabsStyles.ul>> & NonNullable<RecipeVariants<typeof tabsStyles.li>> & NonNullable<RecipeVariants<typeof tabsStyles.button>>;
+
+export type { TabsVariants };

package/dist/packages/surface/accordion/index.d.ts

@@ -0,0 +1,47 @@
+import { RuntimeFn } from '../../../node_modules/@vanilla-extract/recipes/dist/vanilla-extract-recipes.cjs.d.js';
+
+declare const accordion: {
+    classnames: {
+        item: RuntimeFn<{
+            selected: {
+                true: {
+                    color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                    borderBottomColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                    ":hover": {
+                        backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                    };
+                    ":active": {
+                        backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                    };
+                    ":disabled": {
+                        borderBottomColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                        backgroundColor: "transparent";
+                    };
+                };
+            };
+            size: {
+                large: {
+                    padding: `var(--${string}) var(--${string})` | `var(--${string}) var(--${string}, ${string})` | `var(--${string}) var(--${string}, ${number})` | `var(--${string}, ${string}) var(--${string})` | `var(--${string}, ${string}) var(--${string}, ${string})` | `var(--${string}, ${string}) var(--${string}, ${number})` | `var(--${string}, ${number}) var(--${string})` | `var(--${string}, ${number}) var(--${string}, ${string})` | `var(--${string}, ${number}) var(--${string}, ${number})`;
+                };
+                medium: {
+                    padding: `var(--${string}) var(--${string})` | `var(--${string}) var(--${string}, ${string})` | `var(--${string}) var(--${string}, ${number})` | `var(--${string}, ${string}) var(--${string})` | `var(--${string}, ${string}) var(--${string}, ${string})` | `var(--${string}, ${string}) var(--${string}, ${number})` | `var(--${string}, ${number}) var(--${string})` | `var(--${string}, ${number}) var(--${string}, ${string})` | `var(--${string}, ${number}) var(--${string}, ${number})`;
+                };
+                small: {
+                    padding: `var(--${string}) var(--${string})` | `var(--${string}) var(--${string}, ${string})` | `var(--${string}) var(--${string}, ${number})` | `var(--${string}, ${string}) var(--${string})` | `var(--${string}, ${string}) var(--${string}, ${string})` | `var(--${string}, ${string}) var(--${string}, ${number})` | `var(--${string}, ${number}) var(--${string})` | `var(--${string}, ${number}) var(--${string}, ${string})` | `var(--${string}, ${number}) var(--${string}, ${number})`;
+                };
+            };
+        }>;
+        body: RuntimeFn<{
+            padding: {
+                base: {
+                    padding: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+                none: {
+                    padding: number;
+                };
+            };
+        }>;
+    };
+};
+
+export { accordion };

package/dist/packages/surface/accordion/rarui-accordion.css.d.ts

@@ -0,0 +1,49 @@
+import { RuntimeFn } from '../../../node_modules/@vanilla-extract/recipes/dist/vanilla-extract-recipes.cjs.d.js';
+
+declare const accordionStyles: {
+    item: RuntimeFn<{
+        selected: {
+            true: {
+                color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                borderBottomColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                ":hover": {
+                    backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+                ":active": {
+                    backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+                ":disabled": {
+                    borderBottomColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                    backgroundColor: "transparent";
+                };
+            };
+        };
+        size: {
+            large: {
+                padding: `var(--${string}) var(--${string})` | `var(--${string}) var(--${string}, ${string})` | `var(--${string}) var(--${string}, ${number})` | `var(--${string}, ${string}) var(--${string})` | `var(--${string}, ${string}) var(--${string}, ${string})` | `var(--${string}, ${string}) var(--${string}, ${number})` | `var(--${string}, ${number}) var(--${string})` | `var(--${string}, ${number}) var(--${string}, ${string})` | `var(--${string}, ${number}) var(--${string}, ${number})`;
+            };
+            medium: {
+                padding: `var(--${string}) var(--${string})` | `var(--${string}) var(--${string}, ${string})` | `var(--${string}) var(--${string}, ${number})` | `var(--${string}, ${string}) var(--${string})` | `var(--${string}, ${string}) var(--${string}, ${string})` | `var(--${string}, ${string}) var(--${string}, ${number})` | `var(--${string}, ${number}) var(--${string})` | `var(--${string}, ${number}) var(--${string}, ${string})` | `var(--${string}, ${number}) var(--${string}, ${number})`;
+            };
+            small: {
+                padding: `var(--${string}) var(--${string})` | `var(--${string}) var(--${string}, ${string})` | `var(--${string}) var(--${string}, ${number})` | `var(--${string}, ${string}) var(--${string})` | `var(--${string}, ${string}) var(--${string}, ${string})` | `var(--${string}, ${string}) var(--${string}, ${number})` | `var(--${string}, ${number}) var(--${string})` | `var(--${string}, ${number}) var(--${string}, ${string})` | `var(--${string}, ${number}) var(--${string}, ${number})`;
+            };
+        };
+    }>;
+    body: RuntimeFn<{
+        /**
+         * Padding properties are used to generate space around the content area of an Accordion.Body..
+         * @default base
+         */
+        padding: {
+            base: {
+                padding: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            };
+            none: {
+                padding: number;
+            };
+        };
+    }>;
+};
+
+export { accordionStyles };

package/dist/packages/surface/accordion/rarui-accordion.types.d.ts

@@ -0,0 +1,6 @@
+import { RecipeVariants } from '../../../node_modules/@vanilla-extract/recipes/dist/vanilla-extract-recipes.cjs.d.js';
+import { accordionStyles } from './rarui-accordion.css.js';
+
+type AccordionVariants = Omit<NonNullable<RecipeVariants<typeof accordionStyles.item>>, "selected"> & NonNullable<RecipeVariants<typeof accordionStyles.body>>;
+
+export type { AccordionVariants };

package/dist/packages/surface/banner/index.d.ts

@@ -0,0 +1,41 @@
+import { RuntimeFn } from '../../../node_modules/@vanilla-extract/recipes/dist/vanilla-extract-recipes.cjs.d.js';
+
+declare const banner: {
+    classnames: {
+        banner: RuntimeFn<{
+            appearance: {
+                brand: {
+                    backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                    color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+                info: {
+                    backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                    color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+                neutral: {
+                    backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                    color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+                inverted: {
+                    backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                    color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+                warning: {
+                    backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                    color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+                error: {
+                    backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                    color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+            };
+            floating: {
+                true: {
+                    borderRadius: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+            };
+        }>;
+    };
+};
+
+export { banner };

package/dist/packages/surface/banner/rarui-banner.css.d.ts

@@ -0,0 +1,47 @@
+import { RuntimeFn } from '../../../node_modules/@vanilla-extract/recipes/dist/vanilla-extract-recipes.cjs.d.js';
+
+declare const bannerStyles: {
+    banner: RuntimeFn<{
+        /**
+         * Specifies the visual appearance of the banner message, influencing its color and style.
+         * @default brand
+         */
+        appearance: {
+            brand: {
+                backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            };
+            info: {
+                backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            };
+            neutral: {
+                backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            };
+            inverted: {
+                backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            };
+            warning: {
+                backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            };
+            error: {
+                backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            };
+        };
+        /**
+         * Determines whether the banner message should float above the content. This can be useful for ensuring the message remains visible even as the user scrolls.
+         * @default false
+         */
+        floating: {
+            true: {
+                borderRadius: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            };
+        };
+    }>;
+};
+
+export { bannerStyles };

package/dist/packages/surface/banner/rarui-banner.types.d.ts

@@ -0,0 +1,6 @@
+import { RecipeVariants } from '../../../node_modules/@vanilla-extract/recipes/dist/vanilla-extract-recipes.cjs.d.js';
+import { bannerStyles } from './rarui-banner.css.js';
+
+type BannerVariants = RecipeVariants<typeof bannerStyles.banner>;
+
+export type { BannerVariants };