@hyddenlabs/hydn-ui 0.3.0-alpha.99 → 0.3.1

package/dist/theme/size-tokens.d.ts

@@ -0,0 +1,686 @@
+/**
+ * Unified Size System for hydn-ui
+ *
+ * All sizes use Tailwind classes and are responsive (mobile-first).
+ * Mobile sizes are larger for touch targets, desktop sizes are smaller.
+ *
+ * SIZE SCALE: xs → sm → md → lg → xl → 2xl → 3xl
+ */
+/**
+ * Icon/Spinner/Visual element sizes
+ * Uses Tailwind classes with responsive adjustments
+ */
+export declare const visualSizes: {
+    readonly xs: {
+        readonly classes: "w-3.5 h-3.5 sm:w-3 sm:h-3";
+        readonly pixels: {
+            readonly mobile: 20;
+            readonly desktop: 16;
+        };
+    };
+    readonly sm: {
+        readonly classes: "w-5 h-5 sm:w-4 sm:h-4";
+        readonly pixels: {
+            readonly mobile: 24;
+            readonly desktop: 20;
+        };
+    };
+    readonly md: {
+        readonly classes: "w-6 h-6 sm:w-5 sm:h-5";
+        readonly pixels: {
+            readonly mobile: 28;
+            readonly desktop: 24;
+        };
+    };
+    readonly lg: {
+        readonly classes: "w-7 h-7 sm:w-6 sm:h-6";
+        readonly pixels: {
+            readonly mobile: 32;
+            readonly desktop: 28;
+        };
+    };
+    readonly xl: {
+        readonly classes: "w-8 h-8 sm:w-7 sm:h-7";
+        readonly pixels: {
+            readonly mobile: 36;
+            readonly desktop: 32;
+        };
+    };
+    readonly '2xl': {
+        readonly classes: "w-9 h-9 sm:w-8 sm:h-8";
+        readonly pixels: {
+            readonly mobile: 40;
+            readonly desktop: 36;
+        };
+    };
+    readonly '3xl': {
+        readonly classes: "w-12 h-12 sm:w-10 sm:h-10";
+        readonly pixels: {
+            readonly mobile: 52;
+            readonly desktop: 44;
+        };
+    };
+};
+/** Core size type - derived from visualSizes */
+export type Size = keyof typeof visualSizes;
+type SpinnerSizeDefinition = (typeof visualSizes)[Size] & {
+    border: string;
+};
+export declare const spinnerSizes: Record<Size, SpinnerSizeDefinition>;
+/**
+ * Avatar sizes - larger scale for displaying faces/initials
+ * Responsive: comfortable touch targets on mobile
+ */
+export declare const avatarSizes: {
+    readonly xs: {
+        readonly classes: "w-8 h-8 sm:w-6 sm:h-6";
+        readonly text: "text-sm sm:text-xs";
+    };
+    readonly sm: {
+        readonly classes: "w-10 h-10 sm:w-8 sm:h-8";
+        readonly text: "text-base sm:text-sm";
+    };
+    readonly md: {
+        readonly classes: "w-12 h-12 sm:w-10 sm:h-10";
+        readonly text: "text-lg sm:text-base";
+    };
+    readonly lg: {
+        readonly classes: "w-14 h-14 sm:w-12 sm:h-12";
+        readonly text: "text-xl sm:text-lg";
+    };
+    readonly xl: {
+        readonly classes: "w-20 h-20 sm:w-16 sm:h-16";
+        readonly text: "text-2xl sm:text-xl";
+    };
+    readonly '2xl': {
+        readonly classes: "w-24 h-24 sm:w-20 sm:h-20";
+        readonly text: "text-3xl sm:text-2xl";
+    };
+    readonly '3xl': {
+        readonly classes: "w-28 h-28 sm:w-24 sm:h-24";
+        readonly text: "text-4xl sm:text-3xl";
+    };
+};
+/**
+ * Logo sizes - brand element sizing
+ */
+export declare const logoSizes: {
+    readonly xs: {
+        readonly classes: "h-5 w-5 sm:h-4 sm:w-4";
+    };
+    readonly sm: {
+        readonly classes: "h-7 w-7 sm:h-6 sm:w-6";
+    };
+    readonly md: {
+        readonly classes: "h-9 w-9 sm:h-8 sm:w-8";
+    };
+    readonly lg: {
+        readonly classes: "h-12 w-12 sm:h-10 sm:w-10";
+    };
+    readonly xl: {
+        readonly classes: "h-14 w-14 sm:h-12 sm:w-12";
+    };
+    readonly '2xl': {
+        readonly classes: "h-20 w-20 sm:h-16 sm:w-16";
+    };
+    readonly '3xl': {
+        readonly classes: "h-24 w-24 sm:h-20 sm:w-20";
+    };
+};
+export declare const interactiveSizes: {
+    readonly xs: {
+        readonly height: "h-8 sm:h-6 min-h-8 sm:min-h-6";
+        readonly padding: "px-3 sm:px-2";
+        readonly text: "text-sm sm:text-xs";
+        readonly icon: {
+            readonly classes: "w-3.5 h-3.5 sm:w-3 sm:h-3";
+            readonly pixels: {
+                readonly mobile: 20;
+                readonly desktop: 16;
+            };
+        };
+    };
+    readonly sm: {
+        readonly height: "h-10 sm:h-8 min-h-10 sm:min-h-8";
+        readonly padding: "px-4 sm:px-3";
+        readonly text: "text-base sm:text-sm";
+        readonly icon: {
+            readonly classes: "w-5 h-5 sm:w-4 sm:h-4";
+            readonly pixels: {
+                readonly mobile: 24;
+                readonly desktop: 20;
+            };
+        };
+    };
+    readonly md: {
+        readonly height: "h-12 sm:h-10 min-h-12 sm:min-h-10";
+        readonly padding: "px-5 sm:px-4";
+        readonly text: "text-base sm:text-sm";
+        readonly icon: {
+            readonly classes: "w-6 h-6 sm:w-5 sm:h-5";
+            readonly pixels: {
+                readonly mobile: 28;
+                readonly desktop: 24;
+            };
+        };
+    };
+    readonly lg: {
+        readonly height: "h-14 sm:h-12 min-h-14 sm:min-h-12";
+        readonly padding: "px-7 sm:px-6";
+        readonly text: "text-lg sm:text-base";
+        readonly icon: {
+            readonly classes: "w-7 h-7 sm:w-6 sm:h-6";
+            readonly pixels: {
+                readonly mobile: 32;
+                readonly desktop: 28;
+            };
+        };
+    };
+    readonly xl: {
+        readonly height: "h-16 sm:h-14 min-h-16 sm:min-h-14";
+        readonly padding: "px-9 sm:px-8";
+        readonly text: "text-xl sm:text-lg";
+        readonly icon: {
+            readonly classes: "w-8 h-8 sm:w-7 sm:h-7";
+            readonly pixels: {
+                readonly mobile: 36;
+                readonly desktop: 32;
+            };
+        };
+    };
+};
+export type InteractiveSize = keyof typeof interactiveSizes;
+export declare const inputWidthSizes: {
+    readonly xs: "w-14 sm:w-16";
+    readonly sm: "w-20 sm:w-24";
+    readonly md: "w-40 sm:w-48";
+    readonly lg: "w-56 sm:w-64";
+    readonly xl: "w-72 sm:w-80";
+    readonly '2xl': "w-80 sm:w-96";
+    readonly '1/4': "w-1/4";
+    readonly '1/2': "w-1/2";
+    readonly '3/4': "w-3/4";
+    readonly full: "w-full";
+    readonly fit: "w-fit";
+    readonly auto: "w-auto";
+};
+export type InputWidth = keyof typeof inputWidthSizes;
+export declare const badgeSizes: {
+    readonly sm: {
+        readonly classes: "px-2.5 sm:px-2 py-1 sm:py-0.5 text-sm sm:text-xs";
+        readonly icon: {
+            readonly classes: "w-3.5 h-3.5 sm:w-3 sm:h-3";
+            readonly pixels: {
+                readonly mobile: 20;
+                readonly desktop: 16;
+            };
+        };
+    };
+    readonly md: {
+        readonly classes: "px-3 sm:px-2.5 py-1 sm:py-0.5 text-sm sm:text-xs font-semibold";
+        readonly icon: {
+            readonly classes: "w-5 h-5 sm:w-4 sm:h-4";
+            readonly pixels: {
+                readonly mobile: 24;
+                readonly desktop: 20;
+            };
+        };
+    };
+    readonly lg: {
+        readonly classes: "px-4 sm:px-3 py-1.5 sm:py-1 text-base sm:text-sm font-semibold";
+        readonly icon: {
+            readonly classes: "w-6 h-6 sm:w-5 sm:h-5";
+            readonly pixels: {
+                readonly mobile: 28;
+                readonly desktop: 24;
+            };
+        };
+    };
+};
+export declare const chipSizes: {
+    readonly xs: {
+        readonly classes: "px-2 sm:px-1.5 py-1 sm:py-0.5 text-sm sm:text-xs gap-1 sm:gap-0.5";
+        readonly icon: {
+            readonly classes: "w-3.5 h-3.5 sm:w-3 sm:h-3";
+            readonly pixels: {
+                readonly mobile: 20;
+                readonly desktop: 16;
+            };
+        };
+    };
+    readonly sm: {
+        readonly classes: "px-2.5 sm:px-2 py-1.5 sm:py-1 text-sm sm:text-xs gap-1.5 sm:gap-1";
+        readonly icon: {
+            readonly classes: "w-5 h-5 sm:w-4 sm:h-4";
+            readonly pixels: {
+                readonly mobile: 24;
+                readonly desktop: 20;
+            };
+        };
+    };
+    readonly md: {
+        readonly classes: "px-3.5 sm:px-3 py-2 sm:py-1.5 text-base sm:text-sm gap-2 sm:gap-1.5";
+        readonly icon: {
+            readonly classes: "w-6 h-6 sm:w-5 sm:h-5";
+            readonly pixels: {
+                readonly mobile: 28;
+                readonly desktop: 24;
+            };
+        };
+    };
+    readonly lg: {
+        readonly classes: "px-5 sm:px-4 py-2.5 sm:py-2 text-lg sm:text-base gap-2.5 sm:gap-2";
+        readonly icon: {
+            readonly classes: "w-7 h-7 sm:w-6 sm:h-6";
+            readonly pixels: {
+                readonly mobile: 32;
+                readonly desktop: 28;
+            };
+        };
+    };
+    readonly xl: {
+        readonly classes: "px-6 sm:px-5 py-3 sm:py-2.5 text-xl sm:text-lg gap-3 sm:gap-2.5";
+        readonly icon: {
+            readonly classes: "w-8 h-8 sm:w-7 sm:h-7";
+            readonly pixels: {
+                readonly mobile: 36;
+                readonly desktop: 32;
+            };
+        };
+    };
+    readonly '2xl': {
+        readonly classes: "px-7 sm:px-6 py-3.5 sm:py-3 text-2xl sm:text-xl gap-3.5 sm:gap-3";
+        readonly icon: {
+            readonly classes: "w-9 h-9 sm:w-8 sm:h-8";
+            readonly pixels: {
+                readonly mobile: 40;
+                readonly desktop: 36;
+            };
+        };
+    };
+    readonly '3xl': {
+        readonly classes: "px-8 sm:px-7 py-4 sm:py-3.5 text-3xl sm:text-2xl gap-4 sm:gap-3.5";
+        readonly icon: {
+            readonly classes: "w-12 h-12 sm:w-10 sm:h-10";
+            readonly pixels: {
+                readonly mobile: 52;
+                readonly desktop: 44;
+            };
+        };
+    };
+};
+/**
+ * Inline code sizes - for code snippets
+ */
+export declare const codeSizes: {
+    readonly sm: "text-xs px-1 py-0.5";
+    readonly md: "text-sm px-1.5 py-0.5";
+    readonly lg: "text-base px-2 py-1";
+};
+export type CodeSize = keyof typeof codeSizes;
+/**
+ * Status label sizes - for status indicators with dots
+ */
+export declare const statusLabelSizes: {
+    readonly sm: {
+        readonly container: "px-2 py-0.5 text-xs gap-1.5";
+        readonly dot: "w-1.5 h-1.5";
+    };
+    readonly md: {
+        readonly container: "px-2.5 py-0.5 text-sm gap-2";
+        readonly dot: "w-2 h-2";
+    };
+    readonly lg: {
+        readonly container: "px-3 py-1 text-base gap-2";
+        readonly dot: "w-2.5 h-2.5";
+    };
+};
+export type StatusLabelSize = keyof typeof statusLabelSizes;
+export declare const textSizes: {
+    readonly xs: "text-sm sm:text-xs";
+    readonly sm: "text-base sm:text-sm";
+    readonly base: "text-base";
+    readonly lg: "text-lg";
+    readonly xl: "text-xl sm:text-lg";
+    readonly '2xl': "text-2xl";
+    readonly '3xl': "text-3xl";
+    readonly '4xl': "text-4xl";
+    readonly '5xl': "text-5xl";
+};
+export type TextSize = keyof typeof textSizes;
+/**
+ * Heading/title sizes - for headings with font weight
+ */
+export declare const headingSizes: {
+    readonly sm: "text-base font-semibold";
+    readonly md: "text-lg font-bold";
+    readonly lg: "text-xl font-bold";
+    readonly xl: "text-2xl font-bold";
+    readonly '2xl': "text-3xl font-bold sm:text-2xl";
+    readonly '3xl': "text-4xl font-bold sm:text-3xl";
+    readonly '4xl': "text-5xl font-bold sm:text-4xl";
+};
+export type HeadingSize = keyof typeof headingSizes;
+/**
+ * Card sizes - max-width for cards
+ */
+export declare const cardSizes: {
+    readonly xs: "w-full sm:max-w-36";
+    readonly sm: "w-full sm:max-w-64";
+    readonly md: "w-full sm:max-w-96";
+    readonly lg: "w-full sm:max-w-[28rem]";
+    readonly xl: "w-full sm:max-w-[32rem]";
+    readonly '2xl': "w-full sm:max-w-[36rem]";
+    readonly full: "w-full";
+};
+export type CardSize = keyof typeof cardSizes;
+export declare const gapSizes: {
+    readonly none: "gap-0";
+    readonly xs: "gap-2 sm:gap-1";
+    readonly sm: "gap-3 sm:gap-2";
+    readonly md: "gap-5 sm:gap-4";
+    readonly lg: "gap-7 sm:gap-6";
+    readonly xl: "gap-10 sm:gap-8";
+    readonly '2xl': "gap-14 sm:gap-12";
+    readonly '3xl': "gap-20 sm:gap-16";
+};
+export type GapSize = keyof typeof gapSizes;
+export declare const containerWidth: {
+    readonly sm: "max-w-screen-sm";
+    readonly md: "max-w-screen-md";
+    readonly lg: "max-w-screen-lg";
+    readonly xl: "max-w-screen-xl";
+    readonly '2xl': "max-w-screen-2xl";
+    readonly '3xl': "max-w-[1920px]";
+    readonly full: "max-w-full";
+    readonly screen: "max-w-[100vw]";
+    readonly none: "";
+};
+export type ContainerWidthSize = keyof typeof containerWidth;
+export declare const containerHeight: {
+    readonly xs: "h-[10rem]";
+    readonly sm: "h-[15rem]";
+    readonly md: "h-[20rem]";
+    readonly lg: "h-[25rem]";
+    readonly xl: "h-[30rem]";
+    readonly '2xl': "h-[35rem]";
+    readonly '3xl': "h-[40rem]";
+    readonly full: "h-full";
+    readonly screen: "h-screen";
+    readonly none: "";
+};
+export type ContainerHeightSize = keyof typeof containerHeight;
+/**
+ * Container min-width options
+ */
+export declare const containerMinWidths: {
+    readonly xs: "min-w-[20rem]";
+    readonly sm: "min-w-[24rem]";
+    readonly md: "min-w-[28rem]";
+    readonly lg: "min-w-[32rem]";
+    readonly xl: "min-w-[36rem]";
+    readonly '2xl': "min-w-[42rem]";
+    readonly '3xl': "min-w-[48rem]";
+    readonly full: "min-w-full";
+    readonly screen: "min-w-screen";
+    readonly none: "";
+};
+export type ContainerMinWidthSize = keyof typeof containerMinWidths;
+export declare const containerMaxWidths: {
+    readonly xs: "max-w-[20rem]";
+    readonly sm: "max-w-[24rem]";
+    readonly md: "max-w-[28rem]";
+    readonly lg: "max-w-[32rem]";
+    readonly xl: "max-w-[36rem]";
+    readonly '2xl': "max-w-[42rem]";
+    readonly '3xl': "max-w-[48rem]";
+    readonly full: "max-w-full";
+    readonly screen: "max-w-screen";
+    readonly none: "";
+};
+export type ContainerMaxWidthSize = keyof typeof containerMaxWidths;
+/**
+ * Container min-height options
+ */
+export declare const containerMinHeights: {
+    readonly xs: "min-h-[10rem]";
+    readonly sm: "min-h-[15rem]";
+    readonly md: "min-h-[20rem]";
+    readonly lg: "min-h-[25rem]";
+    readonly xl: "min-h-[30rem]";
+    readonly '2xl': "min-h-[35rem]";
+    readonly '3xl': "min-h-[40rem]";
+    readonly full: "min-h-full";
+    readonly screen: "min-h-screen";
+    readonly none: "";
+};
+export type ContainerMinHeightSize = keyof typeof containerMinHeights;
+export declare const containerMaxHeights: {
+    readonly xs: "max-h-[10rem]";
+    readonly sm: "max-h-[15rem]";
+    readonly md: "max-h-[20rem]";
+    readonly lg: "max-h-[25rem]";
+    readonly xl: "max-h-[30rem]";
+    readonly '2xl': "max-h-[35rem]";
+    readonly '3xl': "max-h-[40rem]";
+    readonly full: "max-h-full";
+    readonly screen: "max-h-screen";
+    readonly none: "";
+};
+export type ContainerMaxHeightSize = keyof typeof containerMaxHeights;
+export declare const stackWidths: {
+    readonly sm: "w-screen-sm";
+    readonly md: "w-screen-md";
+    readonly lg: "w-screen-lg";
+    readonly xl: "w-screen-xl";
+    readonly '2xl': "w-screen-2xl";
+    readonly '3xl': "w-[1920px]";
+    readonly '1/4': "w-1/4";
+    readonly '1/2': "w-1/2";
+    readonly '3/4': "w-3/4";
+    readonly full: "w-full";
+    readonly screen: "w-[100vw]";
+    readonly auto: "w-auto";
+    readonly none: "";
+};
+export type StackWidthSize = keyof typeof stackWidths;
+export declare const stackHeights: {
+    readonly xs: "h-[10rem]";
+    readonly sm: "h-[15rem]";
+    readonly md: "h-[20rem]";
+    readonly lg: "h-[25rem]";
+    readonly xl: "h-[30rem]";
+    readonly '2xl': "h-[35rem]";
+    readonly '3xl': "h-[40rem]";
+    readonly '1/4': "h-1/4";
+    readonly '1/2': "h-1/2";
+    readonly '3/4': "h-3/4";
+    readonly full: "h-full";
+    readonly screen: "h-screen";
+    readonly auto: "h-auto";
+    readonly none: "";
+};
+export type StackHeightSize = keyof typeof stackHeights;
+export declare const stackMinWidths: {
+    readonly xs: "min-w-[20rem]";
+    readonly sm: "min-w-[24rem]";
+    readonly md: "min-w-[28rem]";
+    readonly lg: "min-w-[32rem]";
+    readonly xl: "min-w-[36rem]";
+    readonly '2xl': "min-w-[42rem]";
+    readonly '3xl': "min-w-[48rem]";
+    readonly '1/4': "min-w-1/4";
+    readonly '1/2': "min-w-1/2";
+    readonly '3/4': "min-w-3/4";
+    readonly full: "min-w-full";
+    readonly screen: "min-w-screen";
+    readonly none: "";
+};
+export type StackMinWidthSize = keyof typeof stackMinWidths;
+export declare const stackMaxWidths: {
+    readonly xs: "max-w-[20rem]";
+    readonly sm: "max-w-[24rem]";
+    readonly md: "max-w-[28rem]";
+    readonly lg: "max-w-[32rem]";
+    readonly xl: "max-w-[36rem]";
+    readonly '2xl': "max-w-[42rem]";
+    readonly '3xl': "max-w-[48rem]";
+    readonly '1/4': "max-w-1/4";
+    readonly '1/2': "max-w-1/2";
+    readonly '3/4': "max-w-3/4";
+    readonly full: "max-w-full";
+    readonly screen: "max-w-screen";
+    readonly none: "";
+};
+export type StackMaxWidthSize = keyof typeof stackMaxWidths;
+export declare const stackMinHeights: {
+    readonly xs: "min-h-[10rem]";
+    readonly sm: "min-h-[15rem]";
+    readonly md: "min-h-[20rem]";
+    readonly lg: "min-h-[25rem]";
+    readonly xl: "min-h-[30rem]";
+    readonly '2xl': "min-h-[35rem]";
+    readonly '3xl': "min-h-[40rem]";
+    readonly '1/4': "min-h-1/4";
+    readonly '1/2': "min-h-1/2";
+    readonly '3/4': "min-h-3/4";
+    readonly full: "min-h-full";
+    readonly screen: "min-h-screen";
+    readonly none: "";
+};
+export type StackMinHeightSize = keyof typeof stackMinHeights;
+export declare const stackMaxHeights: {
+    readonly xs: "max-h-[10rem]";
+    readonly sm: "max-h-[15rem]";
+    readonly md: "max-h-[20rem]";
+    readonly lg: "max-h-[25rem]";
+    readonly xl: "max-h-[30rem]";
+    readonly '2xl': "max-h-[35rem]";
+    readonly '3xl': "max-h-[40rem]";
+    readonly '1/4': "max-h-1/4";
+    readonly '1/2': "max-h-1/2";
+    readonly '3/4': "max-h-3/4";
+    readonly full: "max-h-full";
+    readonly screen: "max-h-screen";
+    readonly none: "";
+};
+export declare const sectionPadding: {
+    readonly none: "py-0";
+    readonly xs: "py-6 sm:py-4";
+    readonly sm: "py-10 sm:py-8";
+    readonly md: "py-16 sm:py-12";
+    readonly lg: "py-20 sm:py-16";
+    readonly xl: "py-28 sm:py-24";
+    readonly '2xl': "py-36 sm:py-32";
+};
+export type SectionPaddingSize = keyof typeof sectionPadding;
+export declare const cardPadding: {
+    readonly none: "p-0";
+    readonly xs: "p-3 sm:p-2";
+    readonly sm: "p-5 sm:p-4";
+    readonly md: "p-7 sm:p-6";
+    readonly lg: "p-9 sm:p-8";
+    readonly xl: "p-12 sm:p-10";
+    readonly '2xl': "p-14 sm:p-12";
+};
+export type CardPaddingSize = keyof typeof cardPadding;
+export declare const cardMargin: {
+    readonly none: "m-0";
+    readonly xs: "m-3 sm:m-2";
+    readonly sm: "m-5 sm:m-4";
+    readonly md: "m-7 sm:m-6";
+    readonly lg: "m-9 sm:m-8";
+    readonly xl: "m-12 sm:m-10";
+    readonly '2xl': "m-14 sm:m-12";
+};
+export type CardMarginSize = keyof typeof cardMargin;
+export declare const marginX: {
+    readonly none: "";
+    readonly auto: "mx-auto";
+    readonly xs: "mx-3 sm:mx-2";
+    readonly sm: "mx-5 sm:mx-4";
+    readonly md: "mx-7 sm:mx-6";
+    readonly lg: "mx-9 sm:mx-8";
+    readonly xl: "mx-12 sm:mx-10";
+    readonly '2xl': "mx-14 sm:mx-12";
+};
+export type MarginXSize = keyof typeof marginX;
+export declare const marginY: {
+    readonly none: "";
+    readonly auto: "my-auto";
+    readonly xs: "my-3 sm:my-2";
+    readonly sm: "my-5 sm:my-4";
+    readonly md: "my-7 sm:my-6";
+    readonly lg: "my-9 sm:my-8";
+    readonly xl: "my-12 sm:my-10";
+    readonly '2xl': "my-14 sm:my-12";
+};
+export type MarginYSize = keyof typeof marginY;
+export declare const overlaySizes: {
+    readonly xs: "w-full sm:w-64";
+    readonly sm: "w-full sm:w-80";
+    readonly md: "w-full sm:w-96";
+    readonly lg: "w-full sm:w-[28rem]";
+    readonly xl: "w-full sm:w-[32rem]";
+    readonly '2xl': "w-full sm:w-[40rem]";
+    readonly '3xl': "w-full sm:w-[48rem]";
+    readonly full: "w-full max-w-2xl";
+};
+export type OverlaySize = keyof typeof overlaySizes;
+export declare const borderRadius: {
+    readonly none: "rounded-none";
+    readonly sm: "rounded-sm";
+    readonly md: "rounded-md";
+    readonly lg: "rounded-lg";
+    readonly xl: "rounded-xl";
+    readonly '2xl': "rounded-2xl";
+    readonly '3xl': "rounded-3xl";
+    readonly full: "rounded-full";
+};
+export type BorderRadiusSize = keyof typeof borderRadius;
+/** Validation states for form inputs */
+export type ValidationState = 'neutral' | 'error' | 'success' | 'warning';
+/** Border classes for each validation state */
+export declare const validationBorderClasses: Record<ValidationState, string>;
+/** Ring/focus classes for each validation state */
+export declare const validationRingClasses: Record<ValidationState, string>;
+/** Text color classes for validation messages */
+export declare const validationTextClasses: Record<ValidationState, string>;
+/** Base input classes shared by Input, Select, Textarea */
+export declare const inputBaseClasses = "flex rounded-lg border bg-background shadow-sm transition-all duration-200 placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-offset-0 disabled:cursor-not-allowed disabled:opacity-50 disabled:bg-muted/50";
+/** Get complete input classes for a given size and validation state */
+export declare function getInputClasses(size: InteractiveSize, validationState: ValidationState): string;
+/** Form spacing options */
+export declare const formSpacing: {
+    readonly none: "gap-0";
+    readonly xs: "gap-1";
+    readonly sm: "gap-2";
+    readonly md: "gap-4";
+    readonly lg: "gap-6";
+    readonly xl: "gap-8";
+};
+export type FormSpacing = keyof typeof formSpacing;
+/**
+ * Get icon size in pixels for SVG components (like Tabler icons)
+ * Returns desktop size by default, or you can specify 'mobile'
+ */
+export declare function getIconPixels(size: Size | number, variant?: 'mobile' | 'desktop'): number;
+/**
+ * Get Tailwind classes for a visual element size
+ */
+export declare function getVisualClasses(size: Size): string;
+export {};
+/**
+ * Visual Size Reference (mobile / desktop):
+ *
+ * | Size | Visual  | Avatar   | Interactive Height | Text          |
+ * |------|---------|----------|-------------------|---------------|
+ * | xs   | 14/12px | 32/24px  | 32/24px           | text-sm/xs    |
+ * | sm   | 20/16px | 40/32px  | 40/32px           | text-base/sm  |
+ * | md   | 24/20px | 48/40px  | 48/40px           | text-base/sm  |
+ * | lg   | 28/24px | 56/48px  | 56/48px           | text-lg/base  |
+ * | xl   | 32/28px | 80/64px  | 64/56px           | text-xl/lg    |
+ * | 2xl  | 36/32px | 96/80px  | -                 | text-2xl/xl   |
+ * | 3xl  | 48/40px | 112/96px | -                 | text-3xl/2xl  |
+ */
+//# sourceMappingURL=size-tokens.d.ts.map

package/dist/theme/size-tokens.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"size-tokens.d.ts","sourceRoot":"","sources":["../../src/theme/size-tokens.ts"],"names":[],"mappings":"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"}