@brycks/core-front 0.1.0

package/dist/design-system/primitives/focus.d.ts

@@ -0,0 +1,67 @@
+/**
+ * Brycks Design System - Focus State Primitives
+ *
+ * Centralized focus ring and state definitions.
+ * Ensures consistent accessibility across all interactive elements.
+ *
+ * RULE: All focusable elements MUST use these focus styles.
+ */
+/**
+ * Focus ring box-shadow values.
+ * Uses CSS variables for theme-aware colors.
+ */
+export declare const focusRing: {
+    /** Default focus ring - primary color */
+    readonly default: "0 0 0 3px var(--brycks-focus-ring-color, rgba(85, 120, 244, 0.35))";
+    /** Error state focus ring */
+    readonly error: "0 0 0 3px var(--brycks-focus-ring-error, rgba(239, 68, 68, 0.35))";
+    /** Success state focus ring */
+    readonly success: "0 0 0 3px var(--brycks-focus-ring-success, rgba(16, 185, 129, 0.35))";
+    /** Subtle focus ring - for nested elements */
+    readonly subtle: "0 0 0 2px var(--brycks-focus-ring-color, rgba(85, 120, 244, 0.25))";
+    /** None - explicitly no focus ring */
+    readonly none: "none";
+};
+/**
+ * Focus ring with offset (for elements with borders).
+ */
+export declare const focusRingOffset: {
+    readonly default: "0 0 0 2px var(--brycks-background-app), 0 0 0 4px var(--brycks-primary-default)";
+    readonly error: "0 0 0 2px var(--brycks-background-app), 0 0 0 4px var(--brycks-error-default)";
+};
+/**
+ * CSS custom properties that should be set by ThemeProvider.
+ * These enable theme-aware focus rings.
+ */
+export declare const focusRingCSSVars: {
+    readonly color: "--brycks-focus-ring-color";
+    readonly error: "--brycks-focus-ring-error";
+    readonly success: "--brycks-focus-ring-success";
+};
+/**
+ * Complete focus styles object for spreading.
+ */
+export declare const focusStyles: {
+    /** Outline-based focus (native) */
+    readonly outline: {
+        readonly outline: "2px solid var(--brycks-border-focus)";
+        readonly outlineOffset: "2px";
+    };
+    /** Box-shadow based focus (custom) */
+    readonly ring: {
+        readonly outline: "none";
+        readonly boxShadow: "0 0 0 3px var(--brycks-focus-ring-color, rgba(85, 120, 244, 0.35))";
+    };
+    /** Error state focus */
+    readonly ringError: {
+        readonly outline: "none";
+        readonly boxShadow: "0 0 0 3px var(--brycks-focus-ring-error, rgba(239, 68, 68, 0.35))";
+    };
+    /** Remove focus styles (use sparingly) */
+    readonly none: {
+        readonly outline: "none";
+        readonly boxShadow: "none";
+    };
+};
+export type FocusRingVariant = keyof typeof focusRing;
+//# sourceMappingURL=focus.d.ts.map

package/dist/design-system/primitives/focus.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"focus.d.ts","sourceRoot":"","sources":["../../../src/design-system/primitives/focus.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH;;;GAGG;AACH,eAAO,MAAM,SAAS;IACpB,yCAAyC;;IAEzC,6BAA6B;;IAE7B,+BAA+B;;IAE/B,8CAA8C;;IAE9C,sCAAsC;;CAE9B,CAAA;AAEV;;GAEG;AACH,eAAO,MAAM,eAAe;;;CAGlB,CAAA;AAEV;;;GAGG;AACH,eAAO,MAAM,gBAAgB;;;;CAInB,CAAA;AAEV;;GAEG;AACH,eAAO,MAAM,WAAW;IACtB,mCAAmC;;;;;IAKnC,sCAAsC;;;;;IAKtC,wBAAwB;;;;;IAKxB,0CAA0C;;;;;CAKlC,CAAA;AAEV,MAAM,MAAM,gBAAgB,GAAG,MAAM,OAAO,SAAS,CAAA"}

package/dist/design-system/primitives/index.d.ts

@@ -0,0 +1,14 @@
+/**
+ * Brycks Design System - Primitive Constants
+ *
+ * This module provides derived constants from base tokens.
+ * Components MUST use these primitives instead of hardcoded values.
+ *
+ * @module primitives
+ */
+export * from './sizing';
+export * from './focus';
+export * from './transitions';
+export * from './typography';
+export * from './opacity';
+//# sourceMappingURL=index.d.ts.map

package/dist/design-system/primitives/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/design-system/primitives/index.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,cAAc,UAAU,CAAA;AACxB,cAAc,SAAS,CAAA;AACvB,cAAc,eAAe,CAAA;AAC7B,cAAc,cAAc,CAAA;AAC5B,cAAc,WAAW,CAAA"}

package/dist/design-system/primitives/opacity.d.ts

@@ -0,0 +1,88 @@
+/**
+ * Brycks Design System - Opacity Primitives
+ *
+ * Standardized opacity values for consistent visual states.
+ *
+ * RULE: Components MUST use these values. Never hardcode opacity.
+ */
+/**
+ * Opacity scale for various visual states.
+ */
+export declare const opacity: {
+    /** 0 - Fully transparent */
+    readonly transparent: 0;
+    /** 0.05 - Barely visible */
+    readonly 5: 0.05;
+    /** 0.1 - Subtle hint */
+    readonly 10: 0.1;
+    /** 0.15 - Light overlay */
+    readonly 15: 0.15;
+    /** 0.2 - Soft background */
+    readonly 20: 0.2;
+    /** 0.25 - Quarter visible */
+    readonly 25: 0.25;
+    /** 0.3 - Light emphasis */
+    readonly 30: 0.3;
+    /** 0.4 - Medium-light */
+    readonly 40: 0.4;
+    /** 0.5 - Half visible (disabled) */
+    readonly 50: 0.5;
+    /** 0.6 - Medium */
+    readonly 60: 0.6;
+    /** 0.7 - Medium-strong */
+    readonly 70: 0.7;
+    /** 0.75 - Three-quarter visible */
+    readonly 75: 0.75;
+    /** 0.8 - Strong */
+    readonly 80: 0.8;
+    /** 0.9 - Almost opaque */
+    readonly 90: 0.9;
+    /** 0.95 - Nearly opaque */
+    readonly 95: 0.95;
+    /** 1 - Fully opaque */
+    readonly opaque: 1;
+};
+/**
+ * Semantic opacity values for common states.
+ */
+export declare const stateOpacity: {
+    /** Disabled elements */
+    readonly disabled: 0.5;
+    /** Placeholder text */
+    readonly placeholder: 0.5;
+    /** Hover overlay */
+    readonly hoverOverlay: 0.05;
+    /** Active/pressed overlay */
+    readonly activeOverlay: 0.1;
+    /** Modal backdrop */
+    readonly backdrop: 0.4;
+    /** Loading state */
+    readonly loading: 0.7;
+    /** Secondary text */
+    readonly muted: 0.6;
+    /** Subtle decorative elements */
+    readonly subtle: 0.3;
+};
+/**
+ * Scale transform values for interactive states.
+ */
+export declare const scale: {
+    /** Pressed state - subtle shrink */
+    readonly pressed: 0.98;
+    /** Strong pressed - more noticeable */
+    readonly pressedStrong: 0.95;
+    /** Checkbox pressed */
+    readonly controlPressed: 0.92;
+    /** Hidden/initial state for animations */
+    readonly hidden: 0.95;
+    /** Normal state */
+    readonly normal: 1;
+    /** Slight grow on hover */
+    readonly hover: 1.02;
+    /** Emphasized grow */
+    readonly emphasized: 1.05;
+};
+export type OpacityValue = keyof typeof opacity;
+export type StateOpacity = keyof typeof stateOpacity;
+export type ScaleValue = keyof typeof scale;
+//# sourceMappingURL=opacity.d.ts.map

package/dist/design-system/primitives/opacity.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"opacity.d.ts","sourceRoot":"","sources":["../../../src/design-system/primitives/opacity.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH;;GAEG;AACH,eAAO,MAAM,OAAO;IAClB,4BAA4B;;IAE5B,4BAA4B;;IAE5B,wBAAwB;;IAExB,2BAA2B;;IAE3B,4BAA4B;;IAE5B,6BAA6B;;IAE7B,2BAA2B;;IAE3B,yBAAyB;;IAEzB,oCAAoC;;IAEpC,mBAAmB;;IAEnB,0BAA0B;;IAE1B,mCAAmC;;IAEnC,mBAAmB;;IAEnB,0BAA0B;;IAE1B,2BAA2B;;IAE3B,uBAAuB;;CAEf,CAAA;AAEV;;GAEG;AACH,eAAO,MAAM,YAAY;IACvB,wBAAwB;;IAExB,uBAAuB;;IAEvB,oBAAoB;;IAEpB,6BAA6B;;IAE7B,qBAAqB;;IAErB,oBAAoB;;IAEpB,qBAAqB;;IAErB,iCAAiC;;CAEzB,CAAA;AAEV;;GAEG;AACH,eAAO,MAAM,KAAK;IAChB,oCAAoC;;IAEpC,uCAAuC;;IAEvC,uBAAuB;;IAEvB,0CAA0C;;IAE1C,mBAAmB;;IAEnB,2BAA2B;;IAE3B,sBAAsB;;CAEd,CAAA;AAEV,MAAM,MAAM,YAAY,GAAG,MAAM,OAAO,OAAO,CAAA;AAC/C,MAAM,MAAM,YAAY,GAAG,MAAM,OAAO,YAAY,CAAA;AACpD,MAAM,MAAM,UAAU,GAAG,MAAM,OAAO,KAAK,CAAA"}

package/dist/design-system/primitives/sizing.d.ts

@@ -0,0 +1,155 @@
+/**
+ * Brycks Design System - Component Sizing Primitives
+ *
+ * Standardized sizing scales for consistent component dimensions.
+ * All values are derived from the spacing token system (4px grid).
+ *
+ * RULE: Components MUST use these scales. Never hardcode dimensions.
+ */
+/**
+ * Standard component heights for interactive elements.
+ * Based on touch-target guidelines (minimum 44px for accessibility).
+ */
+export declare const componentHeights: {
+    /** 24px - Micro elements (tags, small badges) */
+    readonly xs: number;
+    /** 32px - Small inputs, compact buttons */
+    readonly sm: number;
+    /** 40px - Default size for most interactive elements */
+    readonly md: number;
+    /** 48px - Large inputs, prominent buttons */
+    readonly lg: number;
+    /** 56px - Extra large, hero CTAs */
+    readonly xl: number;
+};
+/**
+ * Icon sizes that align with component heights.
+ */
+export declare const iconSizes: {
+    /** 12px */
+    readonly xs: number;
+    /** 16px */
+    readonly sm: number;
+    /** 20px */
+    readonly md: number;
+    /** 24px */
+    readonly lg: number;
+    /** 32px */
+    readonly xl: number;
+};
+/**
+ * Standard padding for interactive components (horizontal).
+ * Follows a progressive scale for visual balance.
+ */
+export declare const componentPaddingX: {
+    /** 8px */
+    readonly xs: number;
+    /** 12px */
+    readonly sm: number;
+    /** 16px */
+    readonly md: number;
+    /** 20px */
+    readonly lg: number;
+    /** 24px */
+    readonly xl: number;
+};
+/**
+ * Standard padding for interactive components (vertical).
+ */
+export declare const componentPaddingY: {
+    /** 4px */
+    readonly xs: 4;
+    /** 6px */
+    readonly sm: number;
+    /** 8px */
+    readonly md: number;
+    /** 10px */
+    readonly lg: number;
+    /** 12px */
+    readonly xl: number;
+};
+/**
+ * Standard gap values for component internals.
+ */
+export declare const componentGap: {
+    /** 4px - Tight spacing between icons and text */
+    readonly xs: 4;
+    /** 6px */
+    readonly sm: number;
+    /** 8px - Default internal spacing */
+    readonly md: number;
+    /** 10px */
+    readonly lg: number;
+    /** 12px - Spacious internal spacing */
+    readonly xl: number;
+};
+/**
+ * Modal/dialog width presets.
+ */
+export declare const modalWidths: {
+    /** 400px - Small dialogs, confirmations */
+    readonly sm: 400;
+    /** 500px - Medium dialogs */
+    readonly md: 500;
+    /** 640px - Large dialogs */
+    readonly lg: 640;
+    /** 800px - Extra large dialogs */
+    readonly xl: 800;
+    /** Full width minus margins */
+    readonly full: "calc(100vw - 48px)";
+};
+/**
+ * Tooltip and popover constraints.
+ */
+export declare const popoverSizing: {
+    /** Default tooltip max width */
+    readonly tooltipMaxWidth: 300;
+    /** Default popover max width */
+    readonly popoverMaxWidth: 400;
+    /** Arrow size for tooltips */
+    readonly arrowSize: number;
+    /** Gap between trigger and popover */
+    readonly offset: number;
+};
+/**
+ * Checkbox and radio sizes.
+ */
+export declare const controlSizes: {
+    readonly sm: {
+        readonly box: 16;
+        readonly icon: 10;
+    };
+    readonly md: {
+        readonly box: 18;
+        readonly icon: 12;
+    };
+    readonly lg: {
+        readonly box: 22;
+        readonly icon: 14;
+    };
+};
+/**
+ * Switch/toggle sizes.
+ */
+export declare const switchSizes: {
+    readonly sm: {
+        readonly width: 36;
+        readonly height: 20;
+        readonly thumb: 16;
+    };
+    readonly md: {
+        readonly width: 44;
+        readonly height: 24;
+        readonly thumb: 20;
+    };
+    readonly lg: {
+        readonly width: 52;
+        readonly height: 28;
+        readonly thumb: 24;
+    };
+};
+export type ComponentSize = keyof typeof componentHeights;
+export type IconSize = keyof typeof iconSizes;
+export type ControlSize = keyof typeof controlSizes;
+export type SwitchSize = keyof typeof switchSizes;
+//# sourceMappingURL=sizing.d.ts.map

package/dist/design-system/primitives/sizing.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sizing.d.ts","sourceRoot":"","sources":["../../../src/design-system/primitives/sizing.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAIH;;;GAGG;AACH,eAAO,MAAM,gBAAgB;IAC3B,iDAAiD;;IAEjD,2CAA2C;;IAE3C,wDAAwD;;IAExD,6CAA6C;;IAE7C,oCAAoC;;CAE5B,CAAA;AAEV;;GAEG;AACH,eAAO,MAAM,SAAS;IACpB,WAAW;;IAEX,WAAW;;IAEX,WAAW;;IAEX,WAAW;;IAEX,WAAW;;CAEH,CAAA;AAEV;;;GAGG;AACH,eAAO,MAAM,iBAAiB;IAC5B,UAAU;;IAEV,WAAW;;IAEX,WAAW;;IAEX,WAAW;;IAEX,WAAW;;CAEH,CAAA;AAEV;;GAEG;AACH,eAAO,MAAM,iBAAiB;IAC5B,UAAU;;IAEV,UAAU;;IAEV,UAAU;;IAEV,WAAW;;IAEX,WAAW;;CAEH,CAAA;AAEV;;GAEG;AACH,eAAO,MAAM,YAAY;IACvB,iDAAiD;;IAEjD,UAAU;;IAEV,qCAAqC;;IAErC,WAAW;;IAEX,uCAAuC;;CAE/B,CAAA;AAEV;;GAEG;AACH,eAAO,MAAM,WAAW;IACtB,2CAA2C;;IAE3C,6BAA6B;;IAE7B,4BAA4B;;IAE5B,kCAAkC;;IAElC,+BAA+B;;CAEvB,CAAA;AAEV;;GAEG;AACH,eAAO,MAAM,aAAa;IACxB,gCAAgC;;IAEhC,gCAAgC;;IAEhC,8BAA8B;;IAE9B,sCAAsC;;CAE9B,CAAA;AAEV;;GAEG;AACH,eAAO,MAAM,YAAY;;;;;;;;;;;;;CAaf,CAAA;AAEV;;GAEG;AACH,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;CAgBd,CAAA;AAEV,MAAM,MAAM,aAAa,GAAG,MAAM,OAAO,gBAAgB,CAAA;AACzD,MAAM,MAAM,QAAQ,GAAG,MAAM,OAAO,SAAS,CAAA;AAC7C,MAAM,MAAM,WAAW,GAAG,MAAM,OAAO,YAAY,CAAA;AACnD,MAAM,MAAM,UAAU,GAAG,MAAM,OAAO,WAAW,CAAA"}

package/dist/design-system/primitives/transitions.d.ts

@@ -0,0 +1,92 @@
+/**
+ * Brycks Design System - Transition Primitives
+ *
+ * Standardized transition definitions for consistent motion.
+ * All values derived from motion tokens.
+ *
+ * RULE: Components MUST use these transitions. Never hardcode timing.
+ */
+/**
+ * Pre-composed CSS transition strings for common use cases.
+ */
+export declare const transition: {
+    /** No transition */
+    readonly none: "none";
+    /** Ultra-fast - for micro-interactions (50ms) */
+    readonly instant: "all 50ms cubic-bezier(0, 0, 0.2, 1)";
+    /** Fast - for hover states, toggles (100ms) */
+    readonly fast: "all 100ms cubic-bezier(0, 0, 0.2, 1)";
+    /** Quick - standard interactive feedback (150ms) */
+    readonly quick: "all 150ms cubic-bezier(0, 0, 0.2, 1)";
+    /** Default - most state changes (200ms) */
+    readonly default: "all 200ms cubic-bezier(0, 0, 0.2, 1)";
+    /** Smooth - focus states, form elements (300ms) */
+    readonly smooth: "all 300ms cubic-bezier(0.25, 0.1, 0.25, 1)";
+    /** Slow - reveals, modals (400ms) */
+    readonly slow: "all 400ms cubic-bezier(0, 0, 0.2, 1)";
+    /** Spring - bouncy, tactile feel (300ms) */
+    readonly spring: "all 300ms cubic-bezier(0.22, 1, 0.36, 1)";
+    /** Colors only - optimized for color transitions */
+    readonly colors: "color 100ms cubic-bezier(0, 0, 0.2, 1), background-color 100ms cubic-bezier(0, 0, 0.2, 1), border-color 100ms cubic-bezier(0, 0, 0.2, 1)";
+    /** Transform only - for scale, translate */
+    readonly transform: "transform 200ms cubic-bezier(0, 0, 0.2, 1)";
+    /** Opacity only - for fade effects */
+    readonly opacity: "opacity 200ms cubic-bezier(0, 0, 0.2, 1)";
+    /** Shadow only - for elevation changes */
+    readonly shadow: "box-shadow 200ms cubic-bezier(0, 0, 0.2, 1)";
+};
+/**
+ * CSS transition property groups.
+ */
+export declare const transitionProperties: {
+    readonly all: "all";
+    readonly colors: "color, background-color, border-color, fill, stroke";
+    readonly opacity: "opacity";
+    readonly shadow: "box-shadow";
+    readonly transform: "transform";
+    readonly dimensions: "width, height, padding, margin";
+};
+/**
+ * Duration values in milliseconds for use in JS.
+ */
+export declare const duration: {
+    readonly instant: 50;
+    readonly fast: 100;
+    readonly quick: 150;
+    readonly default: 200;
+    readonly smooth: 300;
+    readonly slow: 400;
+    readonly slower: 500;
+};
+/**
+ * Easing functions for use in JS animations.
+ */
+export declare const easing: {
+    readonly linear: "linear";
+    readonly ease: "ease";
+    readonly easeIn: "cubic-bezier(0.4, 0, 1, 1)";
+    readonly easeOut: "cubic-bezier(0, 0, 0.2, 1)";
+    readonly easeInOut: "cubic-bezier(0.4, 0, 0.2, 1)";
+    readonly spring: "cubic-bezier(0.34, 1.56, 0.64, 1)";
+    readonly softSpring: "cubic-bezier(0.22, 1, 0.36, 1)";
+    readonly smooth: "cubic-bezier(0.25, 0.1, 0.25, 1)";
+    readonly snappy: "cubic-bezier(0.2, 0, 0, 1)";
+};
+/**
+ * CSS animation keyframes (as strings for style injection).
+ */
+export declare const keyframes: {
+    readonly fadeIn: "\n    @keyframes brycks-fade-in {\n      from { opacity: 0; }\n      to { opacity: 1; }\n    }\n  ";
+    readonly fadeOut: "\n    @keyframes brycks-fade-out {\n      from { opacity: 1; }\n      to { opacity: 0; }\n    }\n  ";
+    readonly scaleIn: "\n    @keyframes brycks-scale-in {\n      from { opacity: 0; transform: scale(0.95); }\n      to { opacity: 1; transform: scale(1); }\n    }\n  ";
+    readonly scaleOut: "\n    @keyframes brycks-scale-out {\n      from { opacity: 1; transform: scale(1); }\n      to { opacity: 0; transform: scale(0.95); }\n    }\n  ";
+    readonly slideUp: "\n    @keyframes brycks-slide-up {\n      from { opacity: 0; transform: translateY(8px); }\n      to { opacity: 1; transform: translateY(0); }\n    }\n  ";
+    readonly slideDown: "\n    @keyframes brycks-slide-down {\n      from { opacity: 0; transform: translateY(-8px); }\n      to { opacity: 1; transform: translateY(0); }\n    }\n  ";
+    readonly spin: "\n    @keyframes brycks-spin {\n      from { transform: rotate(0deg); }\n      to { transform: rotate(360deg); }\n    }\n  ";
+    readonly pulse: "\n    @keyframes brycks-pulse {\n      0%, 100% { opacity: 1; }\n      50% { opacity: 0.5; }\n    }\n  ";
+    readonly shimmer: "\n    @keyframes brycks-shimmer {\n      0% { transform: translateX(-100%); }\n      100% { transform: translateX(100%); }\n    }\n  ";
+    readonly bounce: "\n    @keyframes brycks-bounce {\n      0%, 80%, 100% { transform: scale(0); opacity: 0.5; }\n      40% { transform: scale(1); opacity: 1; }\n    }\n  ";
+};
+export type TransitionPreset = keyof typeof transition;
+export type KeyframeName = keyof typeof keyframes;
+//# sourceMappingURL=transitions.d.ts.map

package/dist/design-system/primitives/transitions.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"transitions.d.ts","sourceRoot":"","sources":["../../../src/design-system/primitives/transitions.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAIH;;GAEG;AACH,eAAO,MAAM,UAAU;IACrB,oBAAoB;;IAGpB,iDAAiD;;IAGjD,+CAA+C;;IAG/C,oDAAoD;;IAGpD,2CAA2C;;IAG3C,mDAAmD;;IAGnD,qCAAqC;;IAGrC,4CAA4C;;IAG5C,oDAAoD;;IAGpD,4CAA4C;;IAG5C,sCAAsC;;IAGtC,0CAA0C;;CAElC,CAAA;AAEV;;GAEG;AACH,eAAO,MAAM,oBAAoB;;;;;;;CAOvB,CAAA;AAEV;;GAEG;AACH,eAAO,MAAM,QAAQ;;;;;;;;CAQX,CAAA;AAEV;;GAEG;AACH,eAAO,MAAM,MAAM;;;;;;;;;;CAUT,CAAA;AAEV;;GAEG;AACH,eAAO,MAAM,SAAS;;;;;;;;;;;CA6DZ,CAAA;AAEV,MAAM,MAAM,gBAAgB,GAAG,MAAM,OAAO,UAAU,CAAA;AACtD,MAAM,MAAM,YAAY,GAAG,MAAM,OAAO,SAAS,CAAA"}

package/dist/design-system/primitives/typography.d.ts

@@ -0,0 +1,164 @@
+/**
+ * Brycks Design System - Component Typography Primitives
+ *
+ * Typography scales specifically for component contexts.
+ * Derived from base typography tokens.
+ *
+ * RULE: Components MUST use these scales. Never hardcode font values.
+ */
+/**
+ * Font sizes mapped to component size variants.
+ * Ensures consistent text sizing across all components.
+ */
+export declare const componentFontSize: {
+    /** 11px - Extra small labels, badges */
+    readonly xs: 11;
+    /** 12px - Small text, captions, helper text */
+    readonly sm: 12;
+    /** 14px - Default component text */
+    readonly md: 14;
+    /** 15px - Large component text */
+    readonly lg: 15;
+    /** 16px - Extra large component text */
+    readonly xl: 16;
+};
+/**
+ * Font weights for component states.
+ */
+export declare const componentFontWeight: {
+    /** 400 - Regular body text */
+    readonly regular: 400;
+    /** 500 - Labels, emphasized text */
+    readonly medium: 500;
+    /** 600 - Headings, titles */
+    readonly semibold: 600;
+    /** 700 - Strong emphasis */
+    readonly bold: 700;
+};
+/**
+ * Line heights for component text.
+ */
+export declare const componentLineHeight: {
+    /** 1 - Single line, badges */
+    readonly none: 1;
+    /** 1.25 - Tight, headings */
+    readonly tight: 1.25;
+    /** 1.4 - Slightly relaxed, labels */
+    readonly snug: 1.4;
+    /** 1.5 - Default body text */
+    readonly normal: 1.5;
+    /** 1.6 - Relaxed, helper text */
+    readonly relaxed: 1.6;
+};
+/**
+ * Pre-composed typography styles for common component elements.
+ */
+export declare const componentTypography: {
+    /** Form field labels */
+    readonly label: {
+        readonly fontFamily: "'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif";
+        readonly fontSize: 12;
+        readonly fontWeight: 500;
+        readonly lineHeight: 1.5;
+    };
+    /** Helper/hint text below inputs */
+    readonly helperText: {
+        readonly fontFamily: "'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif";
+        readonly fontSize: 11;
+        readonly fontWeight: 400;
+        readonly lineHeight: 1.6;
+    };
+    /** Error messages */
+    readonly errorText: {
+        readonly fontFamily: "'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif";
+        readonly fontSize: 11;
+        readonly fontWeight: 400;
+        readonly lineHeight: 1.6;
+    };
+    /** Button text - small */
+    readonly buttonSm: {
+        readonly fontFamily: "'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif";
+        readonly fontSize: 12;
+        readonly fontWeight: 500;
+        readonly lineHeight: 1;
+    };
+    /** Button text - medium (default) */
+    readonly buttonMd: {
+        readonly fontFamily: "'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif";
+        readonly fontSize: 14;
+        readonly fontWeight: 500;
+        readonly lineHeight: 1;
+    };
+    /** Button text - large */
+    readonly buttonLg: {
+        readonly fontFamily: "'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif";
+        readonly fontSize: 15;
+        readonly fontWeight: 500;
+        readonly lineHeight: 1;
+    };
+    /** Badge text */
+    readonly badge: {
+        readonly fontFamily: "'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif";
+        readonly fontSize: 11;
+        readonly fontWeight: 500;
+        readonly lineHeight: 1;
+    };
+    /** Tooltip text */
+    readonly tooltip: {
+        readonly fontFamily: "'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif";
+        readonly fontSize: 11;
+        readonly fontWeight: 500;
+        readonly lineHeight: 1.4;
+    };
+    /** Alert title */
+    readonly alertTitle: {
+        readonly fontFamily: "'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif";
+        readonly fontSize: 14;
+        readonly fontWeight: 600;
+        readonly lineHeight: 1.25;
+    };
+    /** Alert description */
+    readonly alertDescription: {
+        readonly fontFamily: "'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif";
+        readonly fontSize: 14;
+        readonly fontWeight: 400;
+        readonly lineHeight: 1.5;
+    };
+    /** Modal title */
+    readonly modalTitle: {
+        readonly fontFamily: "'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif";
+        readonly fontSize: 18;
+        readonly fontWeight: 600;
+        readonly lineHeight: 1.25;
+    };
+    /** Modal description */
+    readonly modalDescription: {
+        readonly fontFamily: "'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif";
+        readonly fontSize: 14;
+        readonly fontWeight: 400;
+        readonly lineHeight: 1.5;
+    };
+    /** Empty state title */
+    readonly emptyStateTitle: {
+        readonly fontFamily: "'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif";
+        readonly fontSize: 18;
+        readonly fontWeight: 600;
+        readonly lineHeight: 1.25;
+    };
+    /** Empty state description */
+    readonly emptyStateDescription: {
+        readonly fontFamily: "'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif";
+        readonly fontSize: 14;
+        readonly fontWeight: 400;
+        readonly lineHeight: 1.5;
+    };
+    /** Divider label */
+    readonly dividerLabel: {
+        readonly fontFamily: "'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif";
+        readonly fontSize: 11;
+        readonly fontWeight: 500;
+        readonly lineHeight: 1.5;
+    };
+};
+export type ComponentTypographyKey = keyof typeof componentTypography;
+//# sourceMappingURL=typography.d.ts.map

package/dist/design-system/primitives/typography.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"typography.d.ts","sourceRoot":"","sources":["../../../src/design-system/primitives/typography.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAIH;;;GAGG;AACH,eAAO,MAAM,iBAAiB;IAC5B,wCAAwC;;IAExC,+CAA+C;;IAE/C,oCAAoC;;IAEpC,kCAAkC;;IAElC,wCAAwC;;CAEhC,CAAA;AAEV;;GAEG;AACH,eAAO,MAAM,mBAAmB;IAC9B,8BAA8B;;IAE9B,oCAAoC;;IAEpC,6BAA6B;;IAE7B,4BAA4B;;CAEpB,CAAA;AAEV;;GAEG;AACH,eAAO,MAAM,mBAAmB;IAC9B,8BAA8B;;IAE9B,6BAA6B;;IAE7B,qCAAqC;;IAErC,8BAA8B;;IAE9B,iCAAiC;;CAEzB,CAAA;AAEV;;GAEG;AACH,eAAO,MAAM,mBAAmB;IAC9B,wBAAwB;;;;;;;IAOxB,oCAAoC;;;;;;;IAOpC,qBAAqB;;;;;;;IAOrB,0BAA0B;;;;;;;IAO1B,qCAAqC;;;;;;;IAOrC,0BAA0B;;;;;;;IAO1B,iBAAiB;;;;;;;IAOjB,mBAAmB;;;;;;;IAOnB,kBAAkB;;;;;;;IAOlB,wBAAwB;;;;;;;IAOxB,kBAAkB;;;;;;;IAOlB,wBAAwB;;;;;;;IAOxB,wBAAwB;;;;;;;IAOxB,8BAA8B;;;;;;;IAO9B,oBAAoB;;;;;;;CAOZ,CAAA;AAEV,MAAM,MAAM,sBAAsB,GAAG,MAAM,OAAO,mBAAmB,CAAA"}

package/dist/design-system/themes/ThemeProvider.d.ts

@@ -0,0 +1,18 @@
+import { ReactNode } from 'react';
+import { ThemeContextValue, ThemeConfig, ThemeColors } from './types';
+declare const ThemeContext: import('react').Context<ThemeContextValue | null>;
+interface ThemeProviderProps {
+    /** Child components */
+    children: ReactNode;
+    /** Theme configuration for customization */
+    config?: ThemeConfig;
+    /** Skip injecting CSS variables (for SSR or custom handling) */
+    skipCSSVariables?: boolean;
+}
+export declare function ThemeProvider({ children, config, skipCSSVariables, }: ThemeProviderProps): import("react/jsx-runtime").JSX.Element;
+/** Hook to access theme context */
+export declare function useTheme(): ThemeContextValue;
+/** Hook to get current theme colors */
+export declare function useThemeColors(): ThemeColors;
+export { ThemeContext };
+//# sourceMappingURL=ThemeProvider.d.ts.map

package/dist/design-system/themes/ThemeProvider.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ThemeProvider.d.ts","sourceRoot":"","sources":["../../../src/design-system/themes/ThemeProvider.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAOL,KAAK,SAAS,EACf,MAAM,OAAO,CAAA;AAGd,OAAO,KAAK,EAAS,iBAAiB,EAAa,WAAW,EAAE,WAAW,EAAE,MAAM,SAAS,CAAA;AAE5F,QAAA,MAAM,YAAY,mDAAgD,CAAA;AAyBlE,UAAU,kBAAkB;IAC1B,uBAAuB;IACvB,QAAQ,EAAE,SAAS,CAAA;IACnB,4CAA4C;IAC5C,MAAM,CAAC,EAAE,WAAW,CAAA;IACpB,gEAAgE;IAChE,gBAAgB,CAAC,EAAE,OAAO,CAAA;CAC3B;AAED,wBAAgB,aAAa,CAAC,EAC5B,QAAQ,EACR,MAAM,EACN,gBAAwB,GACzB,EAAE,kBAAkB,2CAsGpB;AAED,mCAAmC;AACnC,wBAAgB,QAAQ,IAAI,iBAAiB,CAQ5C;AAED,uCAAuC;AACvC,wBAAgB,cAAc,gBAG7B;AAED,OAAO,EAAE,YAAY,EAAE,CAAA"}