iryx-ui 0.11.0 → 0.13.0

package/dist/theme/accordion.d.ts

@@ -0,0 +1,68 @@
+export declare const accordionTheme: import("tailwind-variants").TVReturnType<{
+    variant: {
+        plain: {};
+        outline: {
+            root: string;
+            item: string;
+            content: string;
+        };
+    };
+}, {
+    root: string;
+    item: string;
+    header: string;
+    trigger: string;
+    icon: string;
+    /**
+     * The animated element carries no spacing of its own — margin is not part
+     * of an animated height, so it survives the close as a gap under a panel
+     * that is supposedly shut. All padding lives on the inner wrapper.
+     */
+    content: string;
+    contentInner: string;
+}, undefined, {
+    variant: {
+        plain: {};
+        outline: {
+            root: string;
+            item: string;
+            content: string;
+        };
+    };
+}, {
+    root: string;
+    item: string;
+    header: string;
+    trigger: string;
+    icon: string;
+    /**
+     * The animated element carries no spacing of its own — margin is not part
+     * of an animated height, so it survives the close as a gap under a panel
+     * that is supposedly shut. All padding lives on the inner wrapper.
+     */
+    content: string;
+    contentInner: string;
+}, import("tailwind-variants").TVReturnType<{
+    variant: {
+        plain: {};
+        outline: {
+            root: string;
+            item: string;
+            content: string;
+        };
+    };
+}, {
+    root: string;
+    item: string;
+    header: string;
+    trigger: string;
+    icon: string;
+    /**
+     * The animated element carries no spacing of its own — margin is not part
+     * of an animated height, so it survives the close as a gap under a panel
+     * that is supposedly shut. All padding lives on the inner wrapper.
+     */
+    content: string;
+    contentInner: string;
+}, undefined, unknown, unknown, undefined>>;
+export type AccordionSlots = keyof ReturnType<typeof accordionTheme>;

package/dist/theme/accordion.js

@@ -0,0 +1,24 @@
+import { tv as e } from "tailwind-variants";
+//#region src/theme/accordion.ts
+var t = e({
+	slots: {
+		root: "w-full",
+		item: "border-b border-border last:border-b-0",
+		header: "flex",
+		trigger: "group/trigger flex flex-1 items-center justify-between gap-4 py-4 text-left text-sm font-medium transition-colors outline-none hover:text-muted-foreground focus-visible:ring-2 focus-visible:ring-primary/50 disabled:pointer-events-none disabled:opacity-50",
+		icon: "size-4 shrink-0 text-muted-foreground transition-[rotate] duration-200 ease-out group-data-[state=open]/trigger:rotate-180",
+		content: "overflow-hidden text-sm text-muted-foreground data-[state=closed]:animate-collapsible-up data-[state=open]:animate-collapsible-down",
+		contentInner: "pb-4"
+	},
+	variants: { variant: {
+		plain: {},
+		outline: {
+			root: "flex flex-col gap-2",
+			item: "rounded-xl border border-border px-4 last:border-b",
+			content: "pb-0"
+		}
+	} },
+	defaultVariants: { variant: "plain" }
+});
+//#endregion
+export { t as accordionTheme };

package/dist/theme/alert.d.ts

@@ -25,7 +25,6 @@ export declare const alertTheme: import("tailwind-variants").TVReturnType<{
     content: string;
     title: string;
     description: string;
-    /** Buttons or links under the body — "Retry", "Undo", "View invoice". */
     actions: string;
     close: string;
 }, undefined, {
@@ -55,7 +54,6 @@ export declare const alertTheme: import("tailwind-variants").TVReturnType<{
     content: string;
     title: string;
     description: string;
-    /** Buttons or links under the body — "Retry", "Undo", "View invoice". */
     actions: string;
     close: string;
 }, import("tailwind-variants").TVReturnType<{
@@ -85,7 +83,6 @@ export declare const alertTheme: import("tailwind-variants").TVReturnType<{
     content: string;
     title: string;
     description: string;
-    /** Buttons or links under the body — "Retry", "Undo", "View invoice". */
     actions: string;
     close: string;
 }, undefined, unknown, unknown, undefined>>;

package/dist/theme/app-shell.d.ts

@@ -0,0 +1,77 @@
+export declare const appShellTheme: import("tailwind-variants").TVReturnType<{
+    scroll: {
+        main: {
+            root: string;
+            main: string;
+        };
+        page: {
+            root: string;
+            header: string;
+            sidebar: string;
+        };
+    };
+    sidebarPosition: {
+        left: {};
+        right: {
+            body: string;
+        };
+    };
+}, {
+    root: string;
+    header: string;
+    body: string;
+    sidebar: string;
+    main: string;
+    footer: string;
+}, undefined, {
+    scroll: {
+        main: {
+            root: string;
+            main: string;
+        };
+        page: {
+            root: string;
+            header: string;
+            sidebar: string;
+        };
+    };
+    sidebarPosition: {
+        left: {};
+        right: {
+            body: string;
+        };
+    };
+}, {
+    root: string;
+    header: string;
+    body: string;
+    sidebar: string;
+    main: string;
+    footer: string;
+}, import("tailwind-variants").TVReturnType<{
+    scroll: {
+        main: {
+            root: string;
+            main: string;
+        };
+        page: {
+            root: string;
+            header: string;
+            sidebar: string;
+        };
+    };
+    sidebarPosition: {
+        left: {};
+        right: {
+            body: string;
+        };
+    };
+}, {
+    root: string;
+    header: string;
+    body: string;
+    sidebar: string;
+    main: string;
+    footer: string;
+}, undefined, unknown, unknown, undefined>>;
+export type AppShellSlots = keyof ReturnType<typeof appShellTheme>;

package/dist/theme/app-shell.js

@@ -0,0 +1,35 @@
+import { tv as e } from "tailwind-variants";
+//#region src/theme/app-shell.ts
+var t = e({
+	slots: {
+		root: "flex w-full flex-col bg-background text-foreground",
+		header: "z-30 shrink-0",
+		body: "flex min-h-0 w-full flex-1",
+		sidebar: "shrink-0",
+		main: "flex min-w-0 flex-1 flex-col",
+		footer: "shrink-0"
+	},
+	variants: {
+		scroll: {
+			main: {
+				root: "h-svh overflow-hidden",
+				main: "overflow-y-auto"
+			},
+			page: {
+				root: "min-h-svh",
+				header: "sticky top-0",
+				sidebar: "sticky top-[var(--iryx-shell-header-height,0px)] max-h-[calc(100svh-var(--iryx-shell-header-height,0px))] self-start overflow-y-auto"
+			}
+		},
+		sidebarPosition: {
+			left: {},
+			right: { body: "flex-row-reverse" }
+		}
+	},
+	defaultVariants: {
+		scroll: "main",
+		sidebarPosition: "left"
+	}
+});
+//#endregion
+export { t as appShellTheme };

package/dist/theme/avatar.d.ts

@@ -0,0 +1,253 @@
+export declare const avatarTheme: import("tailwind-variants").TVReturnType<{
+    size: {
+        xs: {
+            root: string;
+            fallback: string;
+            status: string;
+        };
+        sm: {
+            root: string;
+            fallback: string;
+            status: string;
+        };
+        md: {
+            root: string;
+            fallback: string;
+            status: string;
+        };
+        lg: {
+            root: string;
+            fallback: string;
+            status: string;
+        };
+        xl: {
+            root: string;
+            fallback: string;
+            status: string;
+        };
+    };
+    shape: {
+        circle: {
+            root: string;
+        };
+        square: {
+            root: string;
+        };
+    };
+    status: {
+        online: {
+            status: string;
+        };
+        busy: {
+            status: string;
+        };
+        away: {
+            status: string;
+        };
+        offline: {
+            status: string;
+        };
+    };
+}, {
+    root: string;
+    image: string;
+    fallback: string;
+    status: string;
+}, undefined, {
+    size: {
+        xs: {
+            root: string;
+            fallback: string;
+            status: string;
+        };
+        sm: {
+            root: string;
+            fallback: string;
+            status: string;
+        };
+        md: {
+            root: string;
+            fallback: string;
+            status: string;
+        };
+        lg: {
+            root: string;
+            fallback: string;
+            status: string;
+        };
+        xl: {
+            root: string;
+            fallback: string;
+            status: string;
+        };
+    };
+    shape: {
+        circle: {
+            root: string;
+        };
+        square: {
+            root: string;
+        };
+    };
+    status: {
+        online: {
+            status: string;
+        };
+        busy: {
+            status: string;
+        };
+        away: {
+            status: string;
+        };
+        offline: {
+            status: string;
+        };
+    };
+}, {
+    root: string;
+    image: string;
+    fallback: string;
+    status: string;
+}, import("tailwind-variants").TVReturnType<{
+    size: {
+        xs: {
+            root: string;
+            fallback: string;
+            status: string;
+        };
+        sm: {
+            root: string;
+            fallback: string;
+            status: string;
+        };
+        md: {
+            root: string;
+            fallback: string;
+            status: string;
+        };
+        lg: {
+            root: string;
+            fallback: string;
+            status: string;
+        };
+        xl: {
+            root: string;
+            fallback: string;
+            status: string;
+        };
+    };
+    shape: {
+        circle: {
+            root: string;
+        };
+        square: {
+            root: string;
+        };
+    };
+    status: {
+        online: {
+            status: string;
+        };
+        busy: {
+            status: string;
+        };
+        away: {
+            status: string;
+        };
+        offline: {
+            status: string;
+        };
+    };
+}, {
+    root: string;
+    image: string;
+    fallback: string;
+    status: string;
+}, undefined, unknown, unknown, undefined>>;
+export type AvatarSlots = keyof ReturnType<typeof avatarTheme>;
+export declare const avatarGroupTheme: import("tailwind-variants").TVReturnType<{
+    size: {
+        xs: {
+            root: string;
+            overflow: string;
+        };
+        sm: {
+            root: string;
+            overflow: string;
+        };
+        md: {
+            root: string;
+            overflow: string;
+        };
+        lg: {
+            root: string;
+            overflow: string;
+        };
+        xl: {
+            root: string;
+            overflow: string;
+        };
+    };
+}, {
+    root: string;
+    item: string;
+    /** The "+3" chip closing the stack. */
+    overflow: string;
+}, undefined, {
+    size: {
+        xs: {
+            root: string;
+            overflow: string;
+        };
+        sm: {
+            root: string;
+            overflow: string;
+        };
+        md: {
+            root: string;
+            overflow: string;
+        };
+        lg: {
+            root: string;
+            overflow: string;
+        };
+        xl: {
+            root: string;
+            overflow: string;
+        };
+    };
+}, {
+    root: string;
+    item: string;
+    /** The "+3" chip closing the stack. */
+    overflow: string;
+}, import("tailwind-variants").TVReturnType<{
+    size: {
+        xs: {
+            root: string;
+            overflow: string;
+        };
+        sm: {
+            root: string;
+            overflow: string;
+        };
+        md: {
+            root: string;
+            overflow: string;
+        };
+        lg: {
+            root: string;
+            overflow: string;
+        };
+        xl: {
+            root: string;
+            overflow: string;
+        };
+    };
+}, {
+    root: string;
+    item: string;
+    /** The "+3" chip closing the stack. */
+    overflow: string;
+}, undefined, unknown, unknown, undefined>>;
+export type AvatarGroupSlots = keyof ReturnType<typeof avatarGroupTheme>;

package/dist/theme/avatar.js

@@ -0,0 +1,84 @@
+import { tv as e } from "tailwind-variants";
+//#region src/theme/avatar.ts
+var t = e({
+	slots: {
+		root: "relative inline-flex shrink-0 items-center justify-center bg-muted align-middle select-none",
+		image: "size-full rounded-[inherit] object-cover",
+		fallback: "flex size-full items-center justify-center overflow-hidden rounded-[inherit] font-medium text-muted-foreground uppercase",
+		status: "absolute right-0 bottom-0 rounded-full ring-2 ring-background"
+	},
+	variants: {
+		size: {
+			xs: {
+				root: "size-6",
+				fallback: "text-[0.625rem]",
+				status: "size-1.5"
+			},
+			sm: {
+				root: "size-8",
+				fallback: "text-xs",
+				status: "size-2"
+			},
+			md: {
+				root: "size-10",
+				fallback: "text-sm",
+				status: "size-2.5"
+			},
+			lg: {
+				root: "size-12",
+				fallback: "text-base",
+				status: "size-3"
+			},
+			xl: {
+				root: "size-16",
+				fallback: "text-xl",
+				status: "size-4"
+			}
+		},
+		shape: {
+			circle: { root: "rounded-full" },
+			square: { root: "rounded-xl" }
+		},
+		status: {
+			online: { status: "bg-success" },
+			busy: { status: "bg-danger" },
+			away: { status: "bg-warning" },
+			offline: { status: "bg-muted-foreground" }
+		}
+	},
+	defaultVariants: {
+		size: "md",
+		shape: "circle"
+	}
+}), n = e({
+	slots: {
+		root: "flex flex-row-reverse items-center justify-end",
+		item: "ring-2 ring-background",
+		overflow: "flex shrink-0 items-center justify-center rounded-full bg-muted font-medium text-muted-foreground ring-2 ring-background"
+	},
+	variants: { size: {
+		xs: {
+			root: "-space-x-1.5 space-x-reverse",
+			overflow: "size-6 text-[0.625rem]"
+		},
+		sm: {
+			root: "-space-x-2 space-x-reverse",
+			overflow: "size-8 text-xs"
+		},
+		md: {
+			root: "-space-x-2.5 space-x-reverse",
+			overflow: "size-10 text-sm"
+		},
+		lg: {
+			root: "-space-x-3 space-x-reverse",
+			overflow: "size-12 text-base"
+		},
+		xl: {
+			root: "-space-x-4 space-x-reverse",
+			overflow: "size-16 text-xl"
+		}
+	} },
+	defaultVariants: { size: "md" }
+});
+//#endregion
+export { n as avatarGroupTheme, t as avatarTheme };

package/dist/theme/banner.d.ts

@@ -20,7 +20,6 @@ export declare const bannerTheme: import("tailwind-variants").TVReturnType<{
             root: string;
             icon: string;
         };
-        /** Brand-coloured, for announcements rather than status. */
         primary: {
             root: string;
             icon: string;
@@ -28,7 +27,6 @@ export declare const bannerTheme: import("tailwind-variants").TVReturnType<{
     };
     position: {
         static: {};
-        /** Sticks under the top of the scroll container. */
         top: {
             root: string;
         };
@@ -52,7 +50,6 @@ export declare const bannerTheme: import("tailwind-variants").TVReturnType<{
     };
 }, {
     root: string;
-    /** Keeps the text off the viewport edge without constraining the fill. */
     container: string;
     icon: string;
     content: string;
@@ -81,7 +78,6 @@ export declare const bannerTheme: import("tailwind-variants").TVReturnType<{
             root: string;
             icon: string;
         };
-        /** Brand-coloured, for announcements rather than status. */
         primary: {
             root: string;
             icon: string;
@@ -89,7 +85,6 @@ export declare const bannerTheme: import("tailwind-variants").TVReturnType<{
     };
     position: {
         static: {};
-        /** Sticks under the top of the scroll container. */
         top: {
             root: string;
         };
@@ -113,7 +108,6 @@ export declare const bannerTheme: import("tailwind-variants").TVReturnType<{
     };
 }, {
     root: string;
-    /** Keeps the text off the viewport edge without constraining the fill. */
     container: string;
     icon: string;
     content: string;
@@ -142,7 +136,6 @@ export declare const bannerTheme: import("tailwind-variants").TVReturnType<{
             root: string;
             icon: string;
         };
-        /** Brand-coloured, for announcements rather than status. */
         primary: {
             root: string;
             icon: string;
@@ -150,7 +143,6 @@ export declare const bannerTheme: import("tailwind-variants").TVReturnType<{
     };
     position: {
         static: {};
-        /** Sticks under the top of the scroll container. */
         top: {
             root: string;
         };
@@ -174,7 +166,6 @@ export declare const bannerTheme: import("tailwind-variants").TVReturnType<{
     };
 }, {
     root: string;
-    /** Keeps the text off the viewport edge without constraining the fill. */
     container: string;
     icon: string;
     content: string;

package/dist/theme/bar-chart.d.ts

@@ -1,7 +1,3 @@
-/**
- * Everything recessive except the bars. Grid and axis text sit one step off
- * the surface; the data is the only thing allowed to be loud.
- */
 export declare const barChartTheme: import("tailwind-variants").TVReturnType<{
     [key: string]: {
         [key: string]: import("tailwind-variants").ClassValue | {
@@ -47,20 +43,16 @@ export declare const barChartTheme: import("tailwind-variants").TVReturnType<{
      */
     plot: string;
     svg: string;
-    /** Hairline and solid — a dashed grid competes with the marks. */
     grid: string;
-    /** Text never wears the series colour; identity comes from the mark. */
     tick: string;
     category: string;
     bar: string;
     /** Hit target, deliberately wider than the mark it selects. */
     hit: string;
-    /** Dims the rest of the series so the hovered bar reads as selected. */
     faded: string;
     tooltip: string;
     tooltipLabel: string;
     tooltipValue: string;
-    /** Reachable by screen readers and by nobody's eyes. */
     table: string;
 }, undefined, {
     [key: string]: {
@@ -89,20 +81,16 @@ export declare const barChartTheme: import("tailwind-variants").TVReturnType<{
      */
     plot: string;
     svg: string;
-    /** Hairline and solid — a dashed grid competes with the marks. */
     grid: string;
-    /** Text never wears the series colour; identity comes from the mark. */
     tick: string;
     category: string;
     bar: string;
     /** Hit target, deliberately wider than the mark it selects. */
     hit: string;
-    /** Dims the rest of the series so the hovered bar reads as selected. */
     faded: string;
     tooltip: string;
     tooltipLabel: string;
     tooltipValue: string;
-    /** Reachable by screen readers and by nobody's eyes. */
     table: string;
 }, import("tailwind-variants").TVReturnType<unknown, {
     root: string;
@@ -113,20 +101,16 @@ export declare const barChartTheme: import("tailwind-variants").TVReturnType<{
      */
     plot: string;
     svg: string;
-    /** Hairline and solid — a dashed grid competes with the marks. */
     grid: string;
-    /** Text never wears the series colour; identity comes from the mark. */
     tick: string;
     category: string;
     bar: string;
     /** Hit target, deliberately wider than the mark it selects. */
     hit: string;
-    /** Dims the rest of the series so the hovered bar reads as selected. */
     faded: string;
     tooltip: string;
     tooltipLabel: string;
     tooltipValue: string;
-    /** Reachable by screen readers and by nobody's eyes. */
     table: string;
 }, undefined, unknown, unknown, undefined>>;
 export type BarChartSlots = keyof ReturnType<typeof barChartTheme>;