iryx-ui 0.16.0 → 0.17.0

package/dist/theme/sidebar.d.ts

@@ -25,32 +25,14 @@ export declare const sidebarTheme: import("tailwind-variants").TVReturnType<{
 }, {
     root: string;
     header: string;
-    /** The only scrolling region; header and footer stay pinned. */
     nav: string;
     footer: string;
     section: string;
     sectionLabel: string;
-    /**
-     * `group` drives the collapsed treatment of the label and chevron, so the
-     * link needs no separate collapsed class.
-     */
     link: string;
     linkLabel: string;
-    /** Count or status at the trailing edge. Hidden when collapsed. */
     linkBadge: string;
-    /**
-     * Rotates when its group is open. The state lives on the trigger, not on
-     * the icon, so this reads it through the trigger's `group/link` — a plain
-     * `data-[state=open]:` here matches nothing and silently never rotates.
-     *
-     * Tailwind v4's `rotate-*` sets the independent `rotate` property rather
-     * than `transform`, so `transition-transform` would not tween it either.
-     */
     groupIcon: string;
-    /**
-     * The animated height box. Deliberately bare — see the keyframe comment in
-     * `theme.css` for why margin and padding cannot live here.
-     */
     groupContent: string;
     groupInner: string;
 }, undefined, {
@@ -80,32 +62,14 @@ export declare const sidebarTheme: import("tailwind-variants").TVReturnType<{
 }, {
     root: string;
     header: string;
-    /** The only scrolling region; header and footer stay pinned. */
     nav: string;
     footer: string;
     section: string;
     sectionLabel: string;
-    /**
-     * `group` drives the collapsed treatment of the label and chevron, so the
-     * link needs no separate collapsed class.
-     */
     link: string;
     linkLabel: string;
-    /** Count or status at the trailing edge. Hidden when collapsed. */
     linkBadge: string;
-    /**
-     * Rotates when its group is open. The state lives on the trigger, not on
-     * the icon, so this reads it through the trigger's `group/link` — a plain
-     * `data-[state=open]:` here matches nothing and silently never rotates.
-     *
-     * Tailwind v4's `rotate-*` sets the independent `rotate` property rather
-     * than `transform`, so `transition-transform` would not tween it either.
-     */
     groupIcon: string;
-    /**
-     * The animated height box. Deliberately bare — see the keyframe comment in
-     * `theme.css` for why margin and padding cannot live here.
-     */
     groupContent: string;
     groupInner: string;
 }, import("tailwind-variants").TVReturnType<{
@@ -135,32 +99,14 @@ export declare const sidebarTheme: import("tailwind-variants").TVReturnType<{
 }, {
     root: string;
     header: string;
-    /** The only scrolling region; header and footer stay pinned. */
     nav: string;
     footer: string;
     section: string;
     sectionLabel: string;
-    /**
-     * `group` drives the collapsed treatment of the label and chevron, so the
-     * link needs no separate collapsed class.
-     */
     link: string;
     linkLabel: string;
-    /** Count or status at the trailing edge. Hidden when collapsed. */
     linkBadge: string;
-    /**
-     * Rotates when its group is open. The state lives on the trigger, not on
-     * the icon, so this reads it through the trigger's `group/link` — a plain
-     * `data-[state=open]:` here matches nothing and silently never rotates.
-     *
-     * Tailwind v4's `rotate-*` sets the independent `rotate` property rather
-     * than `transform`, so `transition-transform` would not tween it either.
-     */
     groupIcon: string;
-    /**
-     * The animated height box. Deliberately bare — see the keyframe comment in
-     * `theme.css` for why margin and padding cannot live here.
-     */
     groupContent: string;
     groupInner: string;
 }, undefined, unknown, unknown, undefined>>;

package/dist/theme/skeleton.d.ts

@@ -1,19 +1,16 @@
 export declare const skeletonTheme: import("tailwind-variants").TVReturnType<{
-    /** `text` sizes itself to the current line height so it sits in copy. */
     variant: {
         text: string;
         rect: string;
         circle: string;
     };
 }, undefined, "animate-pulse bg-muted", {
-    /** `text` sizes itself to the current line height so it sits in copy. */
     variant: {
         text: string;
         rect: string;
         circle: string;
     };
 }, undefined, import("tailwind-variants").TVReturnType<{
-    /** `text` sizes itself to the current line height so it sits in copy. */
     variant: {
         text: string;
         rect: string;

package/dist/theme/skeleton.js

@@ -3,7 +3,7 @@ import { tv as e } from "tailwind-variants";
 var t = e({
 	base: "animate-pulse bg-muted",
 	variants: { variant: {
-		text: "h-[1em] w-full rounded",
+		text: "h-lh w-full rounded",
 		rect: "rounded-xl",
 		circle: "aspect-square rounded-full"
 	} },

package/dist/theme/slider.d.ts

@@ -23,7 +23,6 @@ export declare const sliderTheme: import("tailwind-variants").TVReturnType<{
             thumb: string;
         };
     };
-    /** Without a grab hand the track reads as a progress bar, not a control. */
     disabled: {
         false: {
             thumb: string;
@@ -31,7 +30,6 @@ export declare const sliderTheme: import("tailwind-variants").TVReturnType<{
     };
 }, {
     root: string;
-    /** Only rendered when a label or value text is shown. */
     header: string;
     label: string;
     value: string;
@@ -65,7 +63,6 @@ export declare const sliderTheme: import("tailwind-variants").TVReturnType<{
             thumb: string;
         };
     };
-    /** Without a grab hand the track reads as a progress bar, not a control. */
     disabled: {
         false: {
             thumb: string;
@@ -73,7 +70,6 @@ export declare const sliderTheme: import("tailwind-variants").TVReturnType<{
     };
 }, {
     root: string;
-    /** Only rendered when a label or value text is shown. */
     header: string;
     label: string;
     value: string;
@@ -107,7 +103,6 @@ export declare const sliderTheme: import("tailwind-variants").TVReturnType<{
             thumb: string;
         };
     };
-    /** Without a grab hand the track reads as a progress bar, not a control. */
     disabled: {
         false: {
             thumb: string;
@@ -115,7 +110,6 @@ export declare const sliderTheme: import("tailwind-variants").TVReturnType<{
     };
 }, {
     root: string;
-    /** Only rendered when a label or value text is shown. */
     header: string;
     label: string;
     value: string;

package/dist/theme/sparkline.d.ts

@@ -1,8 +1,3 @@
-/**
- * Colour comes from `currentColor`, so a sparkline recolours with a text
- * utility and follows the theme and appearance without any JS. That is the
- * whole reason these are SVG rather than canvas.
- */
 export declare const sparklineTheme: import("tailwind-variants").TVReturnType<{
     muted: {
         true: {
@@ -10,13 +5,11 @@ export declare const sparklineTheme: import("tailwind-variants").TVReturnType<{
         };
     };
 }, {
-    /** Carries the inset that keeps every mark inside the component's box. */
     root: string;
     plot: string;
     line: string;
     area: string;
     dot: string;
-    /** Keeps the end dot legible where it sits on top of the line. */
     ring: string;
 }, undefined, {
     muted: {
@@ -25,13 +18,11 @@ export declare const sparklineTheme: import("tailwind-variants").TVReturnType<{
         };
     };
 }, {
-    /** Carries the inset that keeps every mark inside the component's box. */
     root: string;
     plot: string;
     line: string;
     area: string;
     dot: string;
-    /** Keeps the end dot legible where it sits on top of the line. */
     ring: string;
 }, import("tailwind-variants").TVReturnType<{
     muted: {
@@ -40,13 +31,11 @@ export declare const sparklineTheme: import("tailwind-variants").TVReturnType<{
         };
     };
 }, {
-    /** Carries the inset that keeps every mark inside the component's box. */
     root: string;
     plot: string;
     line: string;
     area: string;
     dot: string;
-    /** Keeps the end dot legible where it sits on top of the line. */
     ring: string;
 }, undefined, unknown, unknown, undefined>>;
 export type SparklineSlots = keyof ReturnType<typeof sparklineTheme>;

package/dist/theme/splitter.d.ts

@@ -15,7 +15,6 @@ export declare const splitterTheme: import("tailwind-variants").TVReturnType<{
     root: string;
     panel: string;
     handle: string;
-    /** The visible rule inside the handle's hit area. */
     rule: string;
 }, undefined, {
     direction: {
@@ -34,7 +33,6 @@ export declare const splitterTheme: import("tailwind-variants").TVReturnType<{
     root: string;
     panel: string;
     handle: string;
-    /** The visible rule inside the handle's hit area. */
     rule: string;
 }, import("tailwind-variants").TVReturnType<{
     direction: {
@@ -53,7 +51,6 @@ export declare const splitterTheme: import("tailwind-variants").TVReturnType<{
     root: string;
     panel: string;
     handle: string;
-    /** The visible rule inside the handle's hit area. */
     rule: string;
 }, undefined, unknown, unknown, undefined>>;
 export type SplitterSlots = keyof ReturnType<typeof splitterTheme>;

package/dist/theme/stat.d.ts

@@ -10,10 +10,6 @@ export declare const statTheme: import("tailwind-variants").TVReturnType<{
             value: string;
         };
     };
-    /**
-     * Direction of change. `neutral` is used when the delta is zero, so a flat
-     * result does not read as either good or bad.
-     */
     trend: {
         up: {
             delta: string;
@@ -44,10 +40,6 @@ export declare const statTheme: import("tailwind-variants").TVReturnType<{
             value: string;
         };
     };
-    /**
-     * Direction of change. `neutral` is used when the delta is zero, so a flat
-     * result does not read as either good or bad.
-     */
     trend: {
         up: {
             delta: string;
@@ -78,10 +70,6 @@ export declare const statTheme: import("tailwind-variants").TVReturnType<{
             value: string;
         };
     };
-    /**
-     * Direction of change. `neutral` is used when the delta is zero, so a flat
-     * result does not read as either good or bad.
-     */
     trend: {
         up: {
             delta: string;

package/dist/theme/stat.js

@@ -5,9 +5,9 @@ var t = e({
 		root: "flex flex-col gap-2",
 		label: "text-xs font-medium tracking-wide text-muted-foreground uppercase",
 		value: "font-semibold tracking-tight text-foreground tabular-nums",
-		delta: "inline-flex items-center gap-0.5 text-xs font-medium tabular-nums [&_svg]:size-3.5",
+		delta: "inline-flex shrink-0 items-center gap-0.5 text-xs font-medium tabular-nums [&_svg]:size-3.5",
 		hint: "text-xs text-muted-foreground",
-		row: "flex flex-col items-start gap-1.5"
+		row: "flex flex-wrap items-baseline gap-x-2 gap-y-1"
 	},
 	variants: {
 		size: {

package/dist/theme/switch.d.ts

@@ -13,12 +13,10 @@ export declare const switchTheme: import("tailwind-variants").TVReturnType<{
             thumb: string;
         };
     };
-    /** Nudges the track down so it centres against the label's first line. */
     withText: {
         true: {};
     };
 }, {
-    /** Only rendered when a `label` or `description` is provided. */
     wrapper: string;
     root: string;
     thumb: string;
@@ -40,12 +38,10 @@ export declare const switchTheme: import("tailwind-variants").TVReturnType<{
             thumb: string;
         };
     };
-    /** Nudges the track down so it centres against the label's first line. */
     withText: {
         true: {};
     };
 }, {
-    /** Only rendered when a `label` or `description` is provided. */
     wrapper: string;
     root: string;
     thumb: string;
@@ -67,12 +63,10 @@ export declare const switchTheme: import("tailwind-variants").TVReturnType<{
             thumb: string;
         };
     };
-    /** Nudges the track down so it centres against the label's first line. */
     withText: {
         true: {};
     };
 }, {
-    /** Only rendered when a `label` or `description` is provided. */
     wrapper: string;
     root: string;
     thumb: string;

package/dist/theme/table.d.ts

@@ -24,14 +24,6 @@ export declare const tableTheme: import("tailwind-variants").TVReturnType<{
             tr: string;
         };
     };
-    /**
-     * Refreshing: an indeterminate bar riding the rule between the header and
-     * the first row, which is where a table conventionally shows progress.
-     *
-     * Plain class rather than utilities, like the drawer's drag plumbing — it
-     * is a keyframed `background-position` on a pseudo-element, and there is
-     * no class name for Tailwind to generate. Defined in `theme.css`.
-     */
     loading: {
         true: {
             thead: string;
@@ -67,17 +59,12 @@ export declare const tableTheme: import("tailwind-variants").TVReturnType<{
         };
     };
 }, {
-    /** Scroll container — the table itself never shrinks below its content. */
     root: string;
     table: string;
     thead: string;
     tbody: string;
     tr: string;
     th: string;
-    /**
-     * Header sort control. A real button so it is tabbable and announced as
-     * one; the `<th>` carries `aria-sort` for the state.
-     */
     sortButton: string;
     sortIcon: string;
     td: string;
@@ -116,14 +103,6 @@ export declare const tableTheme: import("tailwind-variants").TVReturnType<{
             tr: string;
         };
     };
-    /**
-     * Refreshing: an indeterminate bar riding the rule between the header and
-     * the first row, which is where a table conventionally shows progress.
-     *
-     * Plain class rather than utilities, like the drawer's drag plumbing — it
-     * is a keyframed `background-position` on a pseudo-element, and there is
-     * no class name for Tailwind to generate. Defined in `theme.css`.
-     */
     loading: {
         true: {
             thead: string;
@@ -159,17 +138,12 @@ export declare const tableTheme: import("tailwind-variants").TVReturnType<{
         };
     };
 }, {
-    /** Scroll container — the table itself never shrinks below its content. */
     root: string;
     table: string;
     thead: string;
     tbody: string;
     tr: string;
     th: string;
-    /**
-     * Header sort control. A real button so it is tabbable and announced as
-     * one; the `<th>` carries `aria-sort` for the state.
-     */
     sortButton: string;
     sortIcon: string;
     td: string;
@@ -208,14 +182,6 @@ export declare const tableTheme: import("tailwind-variants").TVReturnType<{
             tr: string;
         };
     };
-    /**
-     * Refreshing: an indeterminate bar riding the rule between the header and
-     * the first row, which is where a table conventionally shows progress.
-     *
-     * Plain class rather than utilities, like the drawer's drag plumbing — it
-     * is a keyframed `background-position` on a pseudo-element, and there is
-     * no class name for Tailwind to generate. Defined in `theme.css`.
-     */
     loading: {
         true: {
             thead: string;
@@ -251,17 +217,12 @@ export declare const tableTheme: import("tailwind-variants").TVReturnType<{
         };
     };
 }, {
-    /** Scroll container — the table itself never shrinks below its content. */
     root: string;
     table: string;
     thead: string;
     tbody: string;
     tr: string;
     th: string;
-    /**
-     * Header sort control. A real button so it is tabbable and announced as
-     * one; the `<th>` carries `aria-sort` for the state.
-     */
     sortButton: string;
     sortIcon: string;
     td: string;

package/dist/theme/tabs.d.ts

@@ -5,10 +5,6 @@ export declare const tabsTheme: import("tailwind-variants").TVReturnType<{
             indicator: string;
             trigger: string;
         };
-        /**
-         * Underline for page-level navigation. The trigger is square: a rounded
-         * corner would bend the bar that sits under it.
-         */
         line: {
             list: string;
             indicator: string;
@@ -38,10 +34,6 @@ export declare const tabsTheme: import("tailwind-variants").TVReturnType<{
             indicator: string;
             trigger: string;
         };
-        /**
-         * Underline for page-level navigation. The trigger is square: a rounded
-         * corner would bend the bar that sits under it.
-         */
         line: {
             list: string;
             indicator: string;
@@ -71,10 +63,6 @@ export declare const tabsTheme: import("tailwind-variants").TVReturnType<{
             indicator: string;
             trigger: string;
         };
-        /**
-         * Underline for page-level navigation. The trigger is square: a rounded
-         * corner would bend the bar that sits under it.
-         */
         line: {
             list: string;
             indicator: string;

package/dist/theme/time-field.d.ts

@@ -18,7 +18,6 @@ export declare const timeFieldTheme: import("tailwind-variants").TVReturnType<{
 }, {
     root: string;
     segment: string;
-    /** The `:` between segments — punctuation, not something to focus. */
     literal: string;
 }, undefined, {
     size: {
@@ -40,7 +39,6 @@ export declare const timeFieldTheme: import("tailwind-variants").TVReturnType<{
 }, {
     root: string;
     segment: string;
-    /** The `:` between segments — punctuation, not something to focus. */
     literal: string;
 }, import("tailwind-variants").TVReturnType<{
     size: {
@@ -62,7 +60,6 @@ export declare const timeFieldTheme: import("tailwind-variants").TVReturnType<{
 }, {
     root: string;
     segment: string;
-    /** The `:` between segments — punctuation, not something to focus. */
     literal: string;
 }, undefined, unknown, unknown, undefined>>;
 export type TimeFieldSlots = keyof ReturnType<typeof timeFieldTheme>;

package/dist/theme/timeline.d.ts

@@ -31,16 +31,11 @@ export declare const timelineTheme: import("tailwind-variants").TVReturnType<{
             marker: string;
         };
     };
-    /**
-     * An icon needs a real box to sit in, so the marker grows from a dot to a
-     * ringed circle and the fill moves to a tint.
-     */
     withIcon: {
         true: {
             marker: string;
         };
     };
-    /** The last item has nothing to connect to, so its spine is dropped. */
     last: {
         true: {
             content: string;
@@ -55,7 +50,6 @@ export declare const timelineTheme: import("tailwind-variants").TVReturnType<{
     content: string;
     header: string;
     title: string;
-    /** Timestamps are numeric, so they line up when they are tabular. */
     time: string;
     description: string;
 }, undefined, {
@@ -91,16 +85,11 @@ export declare const timelineTheme: import("tailwind-variants").TVReturnType<{
             marker: string;
         };
     };
-    /**
-     * An icon needs a real box to sit in, so the marker grows from a dot to a
-     * ringed circle and the fill moves to a tint.
-     */
     withIcon: {
         true: {
             marker: string;
         };
     };
-    /** The last item has nothing to connect to, so its spine is dropped. */
     last: {
         true: {
             content: string;
@@ -115,7 +104,6 @@ export declare const timelineTheme: import("tailwind-variants").TVReturnType<{
     content: string;
     header: string;
     title: string;
-    /** Timestamps are numeric, so they line up when they are tabular. */
     time: string;
     description: string;
 }, import("tailwind-variants").TVReturnType<{
@@ -151,16 +139,11 @@ export declare const timelineTheme: import("tailwind-variants").TVReturnType<{
             marker: string;
         };
     };
-    /**
-     * An icon needs a real box to sit in, so the marker grows from a dot to a
-     * ringed circle and the fill moves to a tint.
-     */
     withIcon: {
         true: {
             marker: string;
         };
     };
-    /** The last item has nothing to connect to, so its spine is dropped. */
     last: {
         true: {
             content: string;
@@ -175,7 +158,6 @@ export declare const timelineTheme: import("tailwind-variants").TVReturnType<{
     content: string;
     header: string;
     title: string;
-    /** Timestamps are numeric, so they line up when they are tabular. */
     time: string;
     description: string;
 }, undefined, unknown, unknown, undefined>>;

package/dist/theme/toast.d.ts

@@ -36,7 +36,6 @@ export declare const toastTheme: import("tailwind-variants").TVReturnType<{
             viewport: string;
         };
     };
-    /** Tightens the title/description gap when both are present. */
     withTitle: {
         true: {
             description: string;
@@ -89,7 +88,6 @@ export declare const toastTheme: import("tailwind-variants").TVReturnType<{
             viewport: string;
         };
     };
-    /** Tightens the title/description gap when both are present. */
     withTitle: {
         true: {
             description: string;
@@ -142,7 +140,6 @@ export declare const toastTheme: import("tailwind-variants").TVReturnType<{
             viewport: string;
         };
     };
-    /** Tightens the title/description gap when both are present. */
     withTitle: {
         true: {
             description: string;

package/dist/theme/toggle.d.ts

@@ -45,19 +45,8 @@ export declare const toggleTheme: import("tailwind-variants").TVReturnType<{
     };
 }, undefined, "inline-flex shrink-0 items-center justify-center gap-2 rounded-xl border border-border bg-input font-medium whitespace-nowrap text-foreground transition-[color,background-color,border-color,box-shadow,opacity] outline-none hover:bg-accent hover:text-accent-foreground focus-visible:ring-2 focus-visible:ring-primary/50 disabled:pointer-events-none disabled:opacity-50 data-[state=on]:bg-accent data-[state=on]:text-accent-foreground [&_svg]:pointer-events-none [&_svg]:shrink-0", unknown, unknown, undefined>>;
 export type ToggleVariants = Parameters<typeof toggleTheme>[0];
-/**
- * The group is the container; each item is a {@link toggleTheme} button. With
- * a single toggle look, the group's variant only decides how the items are
- * spaced — whether they touch or stand apart.
- */
 export declare const toggleGroupTheme: import("tailwind-variants").TVReturnType<{
     variant: {
-        /**
-         * Squared off where they meet and pulled together by a pixel, so
-         * adjacent borders collapse into one — the same trick `IButtonGroup`
-         * uses. The raised z-index keeps a focus ring from being clipped by
-         * the neighbour that overlaps it.
-         */
         joined: {
             item: string;
         };
@@ -82,12 +71,6 @@ export declare const toggleGroupTheme: import("tailwind-variants").TVReturnType<
     item: string;
 }, undefined, {
     variant: {
-        /**
-         * Squared off where they meet and pulled together by a pixel, so
-         * adjacent borders collapse into one — the same trick `IButtonGroup`
-         * uses. The raised z-index keeps a focus ring from being clipped by
-         * the neighbour that overlaps it.
-         */
         joined: {
             item: string;
         };
@@ -112,12 +95,6 @@ export declare const toggleGroupTheme: import("tailwind-variants").TVReturnType<
     item: string;
 }, import("tailwind-variants").TVReturnType<{
     variant: {
-        /**
-         * Squared off where they meet and pulled together by a pixel, so
-         * adjacent borders collapse into one — the same trick `IButtonGroup`
-         * uses. The raised z-index keeps a focus ring from being clipped by
-         * the neighbour that overlaps it.
-         */
         joined: {
             item: string;
         };

package/dist/theme/tree.d.ts

@@ -15,7 +15,6 @@ export declare const treeTheme: import("tailwind-variants").TVReturnType<{
     root: string;
     item: string;
     expander: string;
-    /** Keeps a leaf's label aligned with its siblings that do have a chevron. */
     spacer: string;
     icon: string;
     label: string;
@@ -37,7 +36,6 @@ export declare const treeTheme: import("tailwind-variants").TVReturnType<{
     root: string;
     item: string;
     expander: string;
-    /** Keeps a leaf's label aligned with its siblings that do have a chevron. */
     spacer: string;
     icon: string;
     label: string;
@@ -59,7 +57,6 @@ export declare const treeTheme: import("tailwind-variants").TVReturnType<{
     root: string;
     item: string;
     expander: string;
-    /** Keeps a leaf's label aligned with its siblings that do have a chevron. */
     spacer: string;
     icon: string;
     label: string;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "iryx-ui",
   "type": "module",
-  "version": "0.16.0",
+  "version": "0.17.0",
   "description": "A Vue 3 component library built on Reka UI and Tailwind CSS v4.",
   "author": "therok1",
   "license": "MIT",