@chellaa/react 0.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/styles/tokens.css","../src/styles/theme.css","../src/styles/reset.css","../src/components/Button/Button.styles.css","../src/components/ButtonGroup/ButtonGroup.styles.css"],"sourcesContent":["/**\n * Chellaa React — Tier 1 Primitive Design Tokens\n * Global, static, context-free mathematical and palette scales.\n */\n@layer cl-tokens {\n :root {\n /* -------------------------------------------------------------------------\n * Color Palettes (Harmonic 10-step ramps)\n * ----------------------------------------------------------------------- */\n /* Slate (Neutral) */\n --cl-palette-slate-50: #f8fafc;\n --cl-palette-slate-100: #f1f5f9;\n --cl-palette-slate-200: #e2e8f0;\n --cl-palette-slate-300: #cbd5e1;\n --cl-palette-slate-400: #94a3b8;\n --cl-palette-slate-500: #64748b;\n --cl-palette-slate-600: #475569;\n --cl-palette-slate-700: #334155;\n --cl-palette-slate-800: #1e293b;\n --cl-palette-slate-900: #0f172a;\n --cl-palette-slate-950: #090d16;\n\n /* Indigo (Primary Default) */\n --cl-palette-indigo-50: #eef2ff;\n --cl-palette-indigo-100: #e0e7ff;\n --cl-palette-indigo-200: #c7d2fe;\n --cl-palette-indigo-300: #a5b4fc;\n --cl-palette-indigo-400: #818cf8;\n --cl-palette-indigo-500: #6366f1;\n --cl-palette-indigo-600: #4f46e5;\n --cl-palette-indigo-700: #4338ca;\n --cl-palette-indigo-800: #3730a3;\n --cl-palette-indigo-900: #312e81;\n --cl-palette-indigo-950: #1e1b4b;\n\n /* Violet (Secondary / Accent) */\n --cl-palette-violet-50: #f5f3ff;\n --cl-palette-violet-100: #ede9fe;\n --cl-palette-violet-200: #ddd6fe;\n --cl-palette-violet-300: #c4b5fd;\n --cl-palette-violet-400: #a78bfa;\n --cl-palette-violet-500: #8b5cf6;\n --cl-palette-violet-600: #7c3aed;\n --cl-palette-violet-700: #6d28d9;\n --cl-palette-violet-800: #5b21b6;\n --cl-palette-violet-900: #4c1d95;\n --cl-palette-violet-950: #2e1065;\n\n /* Emerald (Success) */\n --cl-palette-emerald-50: #ecfdf5;\n --cl-palette-emerald-100: #d1fae5;\n --cl-palette-emerald-200: #a7f3d0;\n --cl-palette-emerald-300: #6ee7b7;\n --cl-palette-emerald-400: #34d399;\n --cl-palette-emerald-500: #10b981;\n --cl-palette-emerald-600: #059669;\n --cl-palette-emerald-700: #047857;\n --cl-palette-emerald-800: #065f46;\n --cl-palette-emerald-900: #064e3b;\n --cl-palette-emerald-950: #022c22;\n\n /* Amber (Warning) */\n --cl-palette-amber-50: #fffbeb;\n --cl-palette-amber-100: #fef3c7;\n --cl-palette-amber-200: #fde68a;\n --cl-palette-amber-300: #fcd34d;\n --cl-palette-amber-400: #fbbf24;\n --cl-palette-amber-500: #f59e0b;\n --cl-palette-amber-600: #d97706;\n --cl-palette-amber-700: #b45309;\n --cl-palette-amber-800: #92400e;\n --cl-palette-amber-900: #78350f;\n --cl-palette-amber-950: #451a03;\n\n /* Rose (Danger / Error) */\n --cl-palette-rose-50: #fff1f2;\n --cl-palette-rose-100: #ffe4e6;\n --cl-palette-rose-200: #fecdd3;\n --cl-palette-rose-300: #fda4af;\n --cl-palette-rose-400: #fb7185;\n --cl-palette-rose-500: #f43f5e;\n --cl-palette-rose-600: #e11d48;\n --cl-palette-rose-700: #be123c;\n --cl-palette-rose-800: #9f1239;\n --cl-palette-rose-900: #881337;\n --cl-palette-rose-950: #4c0519;\n\n /* Sky (Info) */\n --cl-palette-sky-50: #f0f9ff;\n --cl-palette-sky-100: #e0f2fe;\n --cl-palette-sky-200: #bae6fd;\n --cl-palette-sky-300: #7dd3fc;\n --cl-palette-sky-400: #38bdf8;\n --cl-palette-sky-500: #0ea5e9;\n --cl-palette-sky-600: #0284c7;\n --cl-palette-sky-700: #0369a1;\n --cl-palette-sky-800: #075985;\n --cl-palette-sky-900: #0c4a6e;\n --cl-palette-sky-950: #082f49;\n\n /* Common Pure Colors */\n --cl-palette-white: #ffffff;\n --cl-palette-black: #000000;\n\n /* -------------------------------------------------------------------------\n * Spacing Scale (4px/8px Baseline Grid)\n * ----------------------------------------------------------------------- */\n --cl-space-0: 0rem;\n --cl-space-1: 0.25rem; /* 4px */\n --cl-space-2: 0.5rem; /* 8px */\n --cl-space-3: 0.75rem; /* 12px */\n --cl-space-4: 1rem; /* 16px */\n --cl-space-5: 1.25rem; /* 20px */\n --cl-space-6: 1.5rem; /* 24px */\n --cl-space-8: 2rem; /* 32px */\n --cl-space-10: 2.5rem; /* 40px */\n --cl-space-12: 3rem; /* 48px */\n --cl-space-16: 4rem; /* 64px */\n\n /* -------------------------------------------------------------------------\n * Typography Stacks, Sizes & Weights\n * ----------------------------------------------------------------------- */\n --cl-font-sans:\n system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto,\n \"Helvetica Neue\", Arial, sans-serif;\n --cl-font-mono:\n ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\",\n \"Courier New\", monospace;\n\n --cl-font-xs: 0.75rem; /* 12px */\n --cl-line-height-xs: 1rem;\n --cl-letter-spacing-xs: 0.01em;\n\n --cl-font-sm: 0.875rem; /* 14px */\n --cl-line-height-sm: 1.25rem;\n --cl-letter-spacing-sm: 0;\n\n --cl-font-base: 1rem; /* 16px */\n --cl-line-height-base: 1.5rem;\n --cl-letter-spacing-base: 0;\n\n --cl-font-lg: 1.125rem; /* 18px */\n --cl-line-height-lg: 1.75rem;\n --cl-letter-spacing-lg: -0.01em;\n\n --cl-font-xl: 1.25rem; /* 20px */\n --cl-line-height-xl: 1.75rem;\n --cl-letter-spacing-xl: -0.015em;\n\n --cl-font-2xl: 1.5rem; /* 24px */\n --cl-line-height-2xl: 2rem;\n --cl-letter-spacing-2xl: -0.02em;\n\n --cl-font-3xl: 1.875rem; /* 30px */\n --cl-line-height-3xl: 2.25rem;\n --cl-letter-spacing-3xl: -0.025em;\n\n --cl-font-4xl: 2.25rem; /* 36px */\n --cl-line-height-4xl: 2.5rem;\n --cl-letter-spacing-4xl: -0.03em;\n\n --cl-font-5xl: 3rem; /* 48px */\n --cl-line-height-5xl: 1.15;\n --cl-letter-spacing-5xl: -0.035em;\n\n --cl-font-weight-regular: 400;\n --cl-font-weight-medium: 500;\n --cl-font-weight-semibold: 600;\n --cl-font-weight-bold: 700;\n\n /* -------------------------------------------------------------------------\n * Border Radii\n * ----------------------------------------------------------------------- */\n --cl-rad-none: 0px;\n --cl-rad-xs: 2px;\n --cl-rad-sm: 4px;\n --cl-rad-md: 6px;\n --cl-rad-lg: 8px;\n --cl-rad-xl: 12px;\n --cl-rad-2xl: 16px;\n --cl-rad-full: 9999px;\n\n /* -------------------------------------------------------------------------\n * Elevation Shadows (Light baseline)\n * ----------------------------------------------------------------------- */\n --cl-shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);\n --cl-shadow-md:\n 0 4px 6px -1px rgba(0, 0, 0, 0.07), 0 2px 4px -2px rgba(0, 0, 0, 0.05);\n --cl-shadow-lg:\n 0 10px 15px -3px rgba(0, 0, 0, 0.08), 0 4px 6px -4px rgba(0, 0, 0, 0.04);\n --cl-shadow-xl:\n 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.04);\n\n /* -------------------------------------------------------------------------\n * Z-Index Scale\n * ----------------------------------------------------------------------- */\n --cl-z-deep: -1;\n --cl-z-base: 0;\n --cl-z-raised: 10;\n --cl-z-dropdown: 1000;\n --cl-z-sticky: 1100;\n --cl-z-backdrop: 1200;\n --cl-z-modal: 1300;\n --cl-z-popover: 1400;\n --cl-z-toast: 1500;\n --cl-z-tooltip: 1600;\n\n /* -------------------------------------------------------------------------\n * Motion & Transitions\n * ----------------------------------------------------------------------- */\n --cl-duration-fast: 150ms;\n --cl-duration-normal: 250ms;\n --cl-duration-slow: 350ms;\n\n --cl-ease-default: cubic-bezier(0.4, 0, 0.2, 1);\n --cl-ease-out: cubic-bezier(0, 0, 0.2, 1);\n --cl-ease-in: cubic-bezier(0.4, 0, 1, 1);\n --cl-ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);\n\n --cl-transition-colors:\n color var(--cl-duration-fast) var(--cl-ease-default),\n background-color var(--cl-duration-fast) var(--cl-ease-default),\n border-color var(--cl-duration-fast) var(--cl-ease-default);\n --cl-transition-transform: transform var(--cl-duration-fast)\n var(--cl-ease-default);\n --cl-transition-opacity: opacity var(--cl-duration-fast)\n var(--cl-ease-default);\n }\n\n /* Accessibility Exception: Prefers Reduced Motion */\n @media (prefers-reduced-motion: reduce) {\n :root {\n --cl-duration-fast: 0ms !important;\n --cl-duration-normal: 0ms !important;\n --cl-duration-slow: 0ms !important;\n --cl-transition-colors: none !important;\n --cl-transition-transform: none !important;\n --cl-transition-opacity: none !important;\n }\n }\n}\n","/**\n * Chellaa React — Tier 2 Semantic & Tier 3 Component Design Tokens\n * Driven by CSS variables and dynamically swapped via data-theme=\"light|dark\".\n */\n@layer cl-theme {\n /* ---------------------------------------------------------------------------\n * Light Theme (Default)\n * ------------------------------------------------------------------------- */\n :root,\n [data-theme=\"light\"] {\n /* Surfaces */\n --cl-color-bg-canvas: var(--cl-palette-white);\n --cl-color-bg-surface: var(--cl-palette-slate-50);\n --cl-color-bg-elev: var(--cl-palette-white);\n --cl-color-bg-muted: var(--cl-palette-slate-100);\n\n /* Typography / Foregrounds */\n --cl-color-fg-primary: var(--cl-palette-slate-900);\n --cl-color-fg-secondary: var(--cl-palette-slate-700);\n --cl-color-fg-muted: var(--cl-palette-slate-500);\n --cl-color-fg-inverse: var(--cl-palette-white);\n\n /* Borders */\n --cl-color-border-subtle: var(--cl-palette-slate-200);\n --cl-color-border-default: var(--cl-palette-slate-300);\n --cl-color-border-strong: var(--cl-palette-slate-400);\n\n /* Action: Primary (Indigo) */\n --cl-color-primary-base: var(--cl-palette-indigo-600);\n --cl-color-primary-hover: var(--cl-palette-indigo-700);\n --cl-color-primary-active: var(--cl-palette-indigo-800);\n --cl-color-primary-fg: var(--cl-palette-white);\n --cl-color-primary-subtle: var(--cl-palette-indigo-50);\n\n /* Action: Secondary (Violet) */\n --cl-color-secondary-base: var(--cl-palette-violet-600);\n --cl-color-secondary-hover: var(--cl-palette-violet-700);\n --cl-color-secondary-active: var(--cl-palette-violet-800);\n --cl-color-secondary-fg: var(--cl-palette-white);\n --cl-color-secondary-subtle: var(--cl-palette-violet-50);\n\n /* Neutral */\n --cl-color-neutral-base: var(--cl-palette-slate-700);\n --cl-color-neutral-hover: var(--cl-palette-slate-800);\n --cl-color-neutral-active: var(--cl-palette-slate-900);\n --cl-color-neutral-fg: var(--cl-palette-white);\n --cl-color-neutral-subtle: var(--cl-palette-slate-100);\n\n /* Status: Success (Emerald) */\n --cl-color-success-base: var(--cl-palette-emerald-600);\n --cl-color-success-hover: var(--cl-palette-emerald-700);\n --cl-color-success-active: var(--cl-palette-emerald-800);\n --cl-color-success-fg: var(--cl-palette-white);\n --cl-color-success-subtle: var(--cl-palette-emerald-50);\n\n /* Status: Warning (Amber) */\n --cl-color-warning-base: var(--cl-palette-amber-600);\n --cl-color-warning-hover: var(--cl-palette-amber-700);\n --cl-color-warning-active: var(--cl-palette-amber-800);\n --cl-color-warning-fg: var(--cl-palette-white);\n --cl-color-warning-subtle: var(--cl-palette-amber-50);\n\n /* Status: Danger / Error (Rose) */\n --cl-color-danger-base: var(--cl-palette-rose-600);\n --cl-color-danger-hover: var(--cl-palette-rose-700);\n --cl-color-danger-active: var(--cl-palette-rose-800);\n --cl-color-danger-fg: var(--cl-palette-white);\n --cl-color-danger-subtle: var(--cl-palette-rose-50);\n\n /* Status: Info (Sky) */\n --cl-color-info-base: var(--cl-palette-sky-600);\n --cl-color-info-hover: var(--cl-palette-sky-700);\n --cl-color-info-active: var(--cl-palette-sky-800);\n --cl-color-info-fg: var(--cl-palette-white);\n --cl-color-info-subtle: var(--cl-palette-sky-50);\n\n /* Focus Ring */\n --cl-color-focus-ring: rgba(99, 102, 241, 0.45);\n\n /* Overlay Backdrop */\n --cl-color-backdrop: rgba(15, 23, 42, 0.5);\n\n /* -------------------------------------------------------------------------\n * Tier 3 Component Token Mappings (Resolving through Semantic Tokens)\n * ----------------------------------------------------------------------- */\n /* Button */\n --cl-button-primary-bg: var(--cl-color-primary-base);\n --cl-button-primary-fg: var(--cl-color-primary-fg);\n --cl-button-primary-hover-bg: var(--cl-color-primary-hover);\n --cl-button-primary-active-bg: var(--cl-color-primary-active);\n\n --cl-button-neutral-bg: var(--cl-color-neutral-base);\n --cl-button-neutral-fg: var(--cl-color-neutral-fg);\n --cl-button-neutral-hover-bg: var(--cl-color-neutral-hover);\n --cl-button-neutral-active-bg: var(--cl-color-neutral-active);\n\n --cl-button-danger-bg: var(--cl-color-danger-base);\n --cl-button-danger-fg: var(--cl-color-danger-fg);\n --cl-button-danger-hover-bg: var(--cl-color-danger-hover);\n --cl-button-danger-active-bg: var(--cl-color-danger-active);\n\n /* Input */\n --cl-input-bg: var(--cl-color-bg-canvas);\n --cl-input-fg: var(--cl-color-fg-primary);\n --cl-input-border: var(--cl-color-border-default);\n --cl-input-focus-border: var(--cl-color-primary-base);\n --cl-input-invalid-border: var(--cl-color-danger-base);\n --cl-input-placeholder: var(--cl-color-fg-muted);\n\n /* Card */\n --cl-card-bg: var(--cl-color-bg-canvas);\n --cl-card-border: var(--cl-color-border-subtle);\n --cl-card-elevated-bg: var(--cl-color-bg-elev);\n\n /* Dialog */\n --cl-dialog-bg: var(--cl-color-bg-elev);\n --cl-dialog-border: var(--cl-color-border-subtle);\n --cl-dialog-backdrop: var(--cl-color-backdrop);\n\n /* Badge */\n --cl-badge-default-bg: var(--cl-color-primary-subtle);\n --cl-badge-default-fg: var(--cl-color-primary-base);\n\n /* Table */\n --cl-table-border: var(--cl-color-border-subtle);\n --cl-table-header-bg: var(--cl-color-bg-surface);\n --cl-table-row-hover-bg: var(--cl-color-bg-muted);\n }\n\n /* ---------------------------------------------------------------------------\n * Dark Theme\n * ------------------------------------------------------------------------- */\n [data-theme=\"dark\"] {\n /* Surfaces */\n --cl-color-bg-canvas: var(--cl-palette-slate-950);\n --cl-color-bg-surface: #131b2e;\n --cl-color-bg-elev: var(--cl-palette-slate-800);\n --cl-color-bg-muted: var(--cl-palette-slate-800);\n\n /* Typography / Foregrounds */\n --cl-color-fg-primary: var(--cl-palette-slate-50);\n --cl-color-fg-secondary: var(--cl-palette-slate-300);\n --cl-color-fg-muted: var(--cl-palette-slate-400);\n --cl-color-fg-inverse: var(--cl-palette-slate-900);\n\n /* Borders */\n --cl-color-border-subtle: var(--cl-palette-slate-800);\n --cl-color-border-default: var(--cl-palette-slate-700);\n --cl-color-border-strong: var(--cl-palette-slate-600);\n\n /* Action: Primary (Indigo) */\n --cl-color-primary-base: var(--cl-palette-indigo-500);\n --cl-color-primary-hover: var(--cl-palette-indigo-400);\n --cl-color-primary-active: var(--cl-palette-indigo-600);\n --cl-color-primary-fg: var(--cl-palette-white);\n --cl-color-primary-subtle: rgba(99, 102, 241, 0.15);\n\n /* Action: Secondary (Violet) */\n --cl-color-secondary-base: var(--cl-palette-violet-500);\n --cl-color-secondary-hover: var(--cl-palette-violet-400);\n --cl-color-secondary-active: var(--cl-palette-violet-600);\n --cl-color-secondary-fg: var(--cl-palette-white);\n --cl-color-secondary-subtle: rgba(139, 92, 246, 0.15);\n\n /* Neutral */\n --cl-color-neutral-base: var(--cl-palette-slate-600);\n --cl-color-neutral-hover: var(--cl-palette-slate-500);\n --cl-color-neutral-active: var(--cl-palette-slate-400);\n --cl-color-neutral-fg: var(--cl-palette-white);\n --cl-color-neutral-subtle: rgba(255, 255, 255, 0.08);\n\n /* Status: Success (Emerald) */\n --cl-color-success-base: var(--cl-palette-emerald-500);\n --cl-color-success-hover: var(--cl-palette-emerald-400);\n --cl-color-success-active: var(--cl-palette-emerald-600);\n --cl-color-success-fg: var(--cl-palette-white);\n --cl-color-success-subtle: rgba(16, 185, 129, 0.15);\n\n /* Status: Warning (Amber) */\n --cl-color-warning-base: var(--cl-palette-amber-500);\n --cl-color-warning-hover: var(--cl-palette-amber-400);\n --cl-color-warning-active: var(--cl-palette-amber-600);\n --cl-color-warning-fg: var(--cl-palette-white);\n --cl-color-warning-subtle: rgba(245, 158, 11, 0.15);\n\n /* Status: Danger / Error (Rose) */\n --cl-color-danger-base: var(--cl-palette-rose-500);\n --cl-color-danger-hover: var(--cl-palette-rose-400);\n --cl-color-danger-active: var(--cl-palette-rose-600);\n --cl-color-danger-fg: var(--cl-palette-white);\n --cl-color-danger-subtle: rgba(244, 63, 94, 0.15);\n\n /* Status: Info (Sky) */\n --cl-color-info-base: var(--cl-palette-sky-500);\n --cl-color-info-hover: var(--cl-palette-sky-400);\n --cl-color-info-active: var(--cl-palette-sky-600);\n --cl-color-info-fg: var(--cl-palette-white);\n --cl-color-info-subtle: rgba(14, 165, 233, 0.15);\n\n /* Focus Ring */\n --cl-color-focus-ring: rgba(129, 140, 248, 0.55);\n\n /* Overlay Backdrop */\n --cl-color-backdrop: rgba(0, 0, 0, 0.7);\n\n /* Dark Mode Elevation Lighting */\n --cl-shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.3);\n --cl-shadow-md:\n 0 4px 6px -1px rgba(0, 0, 0, 0.4), 0 2px 4px -2px rgba(0, 0, 0, 0.3);\n --cl-shadow-lg:\n 0 10px 15px -3px rgba(0, 0, 0, 0.5), 0 4px 6px -4px rgba(0, 0, 0, 0.4);\n --cl-shadow-xl:\n 0 20px 25px -5px rgba(0, 0, 0, 0.6), 0 8px 10px -6px rgba(0, 0, 0, 0.4);\n\n /* Component Overrides for Dark Mode */\n --cl-input-bg: var(--cl-palette-slate-900);\n --cl-card-bg: var(--cl-palette-slate-900);\n --cl-card-elevated-bg: var(--cl-palette-slate-800);\n --cl-dialog-bg: var(--cl-palette-slate-900);\n --cl-dialog-border: var(--cl-palette-slate-800);\n }\n}\n","/**\n * Chellaa React — Scoped CSS Reset\n * Minimal, non-destructive reset scoped strictly to Chellaa React component elements.\n * Never pollutes consumer application tags or un-scoped DOM.\n */\n@layer cl-reset {\n [class^=\"cl-\"],\n [class*=\" cl-\"],\n [class^=\"cl-\"] *,\n [class*=\" cl-\"] *,\n [class^=\"cl-\"] *::before,\n [class*=\" cl-\"] *::before,\n [class^=\"cl-\"] *::after,\n [class*=\" cl-\"] *::after {\n box-sizing: border-box;\n border-width: 0;\n border-style: solid;\n border-color: currentColor;\n }\n\n [class^=\"cl-\"],\n [class*=\" cl-\"] {\n font-family: var(--cl-font-sans);\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n }\n}\n","/**\n * Chellaa React — Button Styles\n * Layered inside @layer cl-components, consuming Tier 1 & Tier 2 design tokens.\n */\n@layer cl-components {\n /* ---------------------------------------------------------------------------\n * Base Button\n * ------------------------------------------------------------------------- */\n .cl-button {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n position: relative;\n box-sizing: border-box;\n margin: 0;\n user-select: none;\n vertical-align: middle;\n text-decoration: none;\n white-space: nowrap;\n font-family: var(--cl-font-sans);\n font-weight: var(--cl-font-weight-medium);\n border: 1px solid transparent;\n cursor: pointer;\n outline: none;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n transition:\n background-color var(--cl-duration-fast) var(--cl-ease-default),\n border-color var(--cl-duration-fast) var(--cl-ease-default),\n color var(--cl-duration-fast) var(--cl-ease-default),\n box-shadow var(--cl-duration-fast) var(--cl-ease-default),\n transform var(--cl-duration-fast) var(--cl-ease-default),\n opacity var(--cl-duration-fast) var(--cl-ease-default);\n }\n\n /* Keyboard Focus Indicator */\n .cl-button:focus-visible {\n outline: 2px solid var(--cl-color-focus-ring);\n outline-offset: 2px;\n }\n\n /* Full Width Modifier */\n .cl-button--full-width {\n display: flex;\n width: 100%;\n }\n\n /* Disabled State */\n .cl-button--disabled,\n .cl-button:disabled {\n opacity: 0.6;\n cursor: not-allowed;\n pointer-events: none;\n box-shadow: none;\n transform: none !important;\n }\n\n /* Loading State */\n .cl-button--loading {\n cursor: wait;\n pointer-events: none;\n }\n\n /* ---------------------------------------------------------------------------\n * Spatial Sizing Scale\n * ------------------------------------------------------------------------- */\n .cl-button--xs {\n height: 1.75rem; /* 28px */\n padding: 0 var(--cl-space-2);\n font-size: var(--cl-font-xs);\n line-height: var(--cl-line-height-xs);\n gap: var(--cl-space-1);\n border-radius: var(--cl-rad-sm);\n }\n .cl-button--xs .cl-button__icon,\n .cl-button--xs .cl-button__spinner {\n width: 14px;\n height: 14px;\n }\n\n .cl-button--sm {\n height: 2rem; /* 32px */\n padding: 0 var(--cl-space-3);\n font-size: var(--cl-font-sm);\n line-height: var(--cl-line-height-sm);\n gap: 6px;\n border-radius: var(--cl-rad-md);\n }\n .cl-button--sm .cl-button__icon,\n .cl-button--sm .cl-button__spinner {\n width: 16px;\n height: 16px;\n }\n\n .cl-button--md {\n height: 2.5rem; /* 40px */\n padding: 0 var(--cl-space-4);\n font-size: var(--cl-font-sm);\n line-height: var(--cl-line-height-sm);\n gap: var(--cl-space-2);\n border-radius: var(--cl-rad-md);\n }\n .cl-button--md .cl-button__icon,\n .cl-button--md .cl-button__spinner {\n width: 18px;\n height: 18px;\n }\n\n .cl-button--lg {\n height: 3rem; /* 48px */\n padding: 0 var(--cl-space-5);\n font-size: var(--cl-font-base);\n line-height: var(--cl-line-height-base);\n gap: 10px;\n border-radius: var(--cl-rad-lg);\n }\n .cl-button--lg .cl-button__icon,\n .cl-button--lg .cl-button__spinner {\n width: 20px;\n height: 20px;\n }\n\n .cl-button--xl {\n height: 3.5rem; /* 56px */\n padding: 0 var(--cl-space-6);\n font-size: var(--cl-font-lg);\n line-height: var(--cl-line-height-lg);\n gap: var(--cl-space-3);\n border-radius: var(--cl-rad-lg);\n }\n .cl-button--xl .cl-button__icon,\n .cl-button--xl .cl-button__spinner {\n width: 24px;\n height: 24px;\n }\n\n /* ---------------------------------------------------------------------------\n * Color Scheme Token Scopes\n * ------------------------------------------------------------------------- */\n .cl-button--primary {\n --cl-button-bg: var(--cl-color-primary-base);\n --cl-button-fg: var(--cl-color-primary-fg);\n --cl-button-hover-bg: var(--cl-color-primary-hover);\n --cl-button-active-bg: var(--cl-color-primary-active);\n --cl-button-subtle-bg: var(--cl-color-primary-subtle);\n }\n\n .cl-button--secondary {\n --cl-button-bg: var(--cl-color-secondary-base);\n --cl-button-fg: var(--cl-color-secondary-fg);\n --cl-button-hover-bg: var(--cl-color-secondary-hover);\n --cl-button-active-bg: var(--cl-color-secondary-active);\n --cl-button-subtle-bg: var(--cl-color-secondary-subtle);\n }\n\n .cl-button--neutral {\n --cl-button-bg: var(--cl-color-neutral-base);\n --cl-button-fg: var(--cl-color-neutral-fg);\n --cl-button-hover-bg: var(--cl-color-neutral-hover);\n --cl-button-active-bg: var(--cl-color-neutral-active);\n --cl-button-subtle-bg: var(--cl-color-neutral-subtle);\n }\n\n .cl-button--success {\n --cl-button-bg: var(--cl-color-success-base);\n --cl-button-fg: var(--cl-color-success-fg);\n --cl-button-hover-bg: var(--cl-color-success-hover);\n --cl-button-active-bg: var(--cl-color-success-active);\n --cl-button-subtle-bg: var(--cl-color-success-subtle);\n }\n\n .cl-button--warning {\n --cl-button-bg: var(--cl-color-warning-base);\n --cl-button-fg: var(--cl-color-warning-fg);\n --cl-button-hover-bg: var(--cl-color-warning-hover);\n --cl-button-active-bg: var(--cl-color-warning-active);\n --cl-button-subtle-bg: var(--cl-color-warning-subtle);\n }\n\n .cl-button--danger {\n --cl-button-bg: var(--cl-color-danger-base);\n --cl-button-fg: var(--cl-color-danger-fg);\n --cl-button-hover-bg: var(--cl-color-danger-hover);\n --cl-button-active-bg: var(--cl-color-danger-active);\n --cl-button-subtle-bg: var(--cl-color-danger-subtle);\n }\n\n .cl-button--info {\n --cl-button-bg: var(--cl-color-info-base);\n --cl-button-fg: var(--cl-color-info-fg);\n --cl-button-hover-bg: var(--cl-color-info-hover);\n --cl-button-active-bg: var(--cl-color-info-active);\n --cl-button-subtle-bg: var(--cl-color-info-subtle);\n }\n\n /* ---------------------------------------------------------------------------\n * Visual Variants\n * ------------------------------------------------------------------------- */\n /* Solid (Default) */\n .cl-button--solid {\n background-color: var(--cl-button-bg);\n color: var(--cl-button-fg);\n border-color: transparent;\n }\n .cl-button--solid:hover:not(:disabled):not(.cl-button--disabled) {\n background-color: var(--cl-button-hover-bg);\n }\n .cl-button--solid:active:not(:disabled):not(.cl-button--disabled) {\n background-color: var(--cl-button-active-bg);\n transform: scale(0.98);\n }\n\n /* Outline */\n .cl-button--outline {\n background-color: transparent;\n color: var(--cl-button-bg);\n border-color: var(--cl-button-bg);\n }\n .cl-button--outline:hover:not(:disabled):not(.cl-button--disabled) {\n background-color: var(--cl-button-subtle-bg);\n }\n .cl-button--outline:active:not(:disabled):not(.cl-button--disabled) {\n background-color: var(--cl-button-subtle-bg);\n transform: scale(0.98);\n }\n\n /* Ghost */\n .cl-button--ghost {\n background-color: transparent;\n color: var(--cl-button-bg);\n border-color: transparent;\n }\n .cl-button--ghost:hover:not(:disabled):not(.cl-button--disabled) {\n background-color: var(--cl-button-subtle-bg);\n }\n .cl-button--ghost:active:not(:disabled):not(.cl-button--disabled) {\n background-color: var(--cl-button-subtle-bg);\n transform: scale(0.98);\n }\n\n /* Subtle */\n .cl-button--subtle {\n background-color: var(--cl-button-subtle-bg);\n color: var(--cl-button-bg);\n border-color: transparent;\n }\n .cl-button--subtle:hover:not(:disabled):not(.cl-button--disabled) {\n background-color: var(--cl-button-subtle-bg);\n filter: brightness(0.94);\n }\n .cl-button--subtle:active:not(:disabled):not(.cl-button--disabled) {\n transform: scale(0.98);\n }\n\n /* Link */\n .cl-button--link {\n background-color: transparent;\n color: var(--cl-button-bg);\n border-color: transparent;\n padding: 0;\n height: auto;\n min-height: unset;\n border-radius: 0;\n box-shadow: none;\n }\n .cl-button--link:hover:not(:disabled):not(.cl-button--disabled) {\n text-decoration: underline;\n }\n .cl-button--link:active:not(:disabled):not(.cl-button--disabled) {\n transform: none;\n }\n\n /* ---------------------------------------------------------------------------\n * Elements: Icons, Spinner, Label\n * ------------------------------------------------------------------------- */\n .cl-button__icon {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n line-height: 1;\n flex-shrink: 0;\n }\n\n .cl-button__spinner {\n display: inline-block;\n line-height: 1;\n flex-shrink: 0;\n animation: cl-button-spin 0.75s linear infinite;\n }\n\n .cl-button__spinner-wrapper--center {\n position: absolute;\n inset: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n }\n\n .cl-button__content--hidden {\n opacity: 0;\n visibility: hidden;\n }\n\n .cl-button__label {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n line-height: inherit;\n }\n\n /* ---------------------------------------------------------------------------\n * Animations & Motion Exceptions\n * ------------------------------------------------------------------------- */\n @keyframes cl-button-spin {\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n }\n\n @media (prefers-reduced-motion: reduce) {\n .cl-button,\n .cl-button__spinner {\n animation-duration: 0.01ms !important;\n transition-duration: 0.01ms !important;\n }\n }\n}\n","/**\n * Chellaa React — ButtonGroup Styles\n * Layered inside @layer cl-components.\n */\n@layer cl-components {\n .cl-button-group {\n display: inline-flex;\n position: relative;\n box-sizing: border-box;\n }\n\n .cl-button-group--horizontal {\n flex-direction: row;\n align-items: center;\n }\n\n .cl-button-group--vertical {\n flex-direction: column;\n align-items: stretch;\n }\n\n /* Unattached spacing */\n .cl-button-group:not(.cl-button-group--attached) {\n gap: var(--cl-space-2);\n }\n\n /* Attached horizontal group */\n .cl-button-group--attached.cl-button-group--horizontal\n > .cl-button:not(:first-child) {\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n margin-left: -1px;\n }\n\n .cl-button-group--attached.cl-button-group--horizontal\n > .cl-button:not(:last-child) {\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n /* Attached vertical group */\n .cl-button-group--attached.cl-button-group--vertical\n > .cl-button:not(:first-child) {\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n margin-top: -1px;\n }\n\n .cl-button-group--attached.cl-button-group--vertical\n > .cl-button:not(:last-child) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n /* Elevation on hover/focus to prevent overlapping borders from getting hidden */\n .cl-button-group--attached > .cl-button:hover,\n .cl-button-group--attached > .cl-button:focus-visible,\n .cl-button-group--attached > .cl-button:active {\n z-index: 1;\n }\n}\n"],"mappings":"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","names":[]}
@@ -0,0 +1,203 @@
1
+ import * as React from 'react';
2
+
3
+ type ThemeMode = "light" | "dark" | "system" | string;
4
+ interface ThemeContextValue {
5
+ theme: ThemeMode;
6
+ setTheme: (theme: ThemeMode) => void;
7
+ resolvedTheme: "light" | "dark";
8
+ systemTheme: "light" | "dark" | undefined;
9
+ }
10
+ interface ThemeProviderProps {
11
+ children?: React.ReactNode;
12
+ defaultTheme?: ThemeMode;
13
+ storageKey?: string;
14
+ enableSystem?: boolean;
15
+ tokens?: Record<string, string>;
16
+ attribute?: string;
17
+ }
18
+ declare function ThemeProvider({ children, defaultTheme, storageKey, enableSystem, tokens, attribute, }: ThemeProviderProps): React.JSX.Element;
19
+
20
+ /**
21
+ * Accesses the active theme context, allowing components to read and update
22
+ * the current theme mode (`light`, `dark`, `system`), resolved theme, and system preference.
23
+ */
24
+ declare function useTheme(): ThemeContextValue;
25
+
26
+ interface CustomThemeConfig {
27
+ name: string;
28
+ tokens: Record<string, string>;
29
+ }
30
+ interface CustomThemeResult {
31
+ name: string;
32
+ tokens: Record<string, string>;
33
+ cssText: string;
34
+ }
35
+ /**
36
+ * Creates a structured custom theme definition and compiles it to valid CSS custom property text.
37
+ *
38
+ * @example
39
+ * const emeraldTheme = createTheme({
40
+ * name: 'emerald',
41
+ * tokens: {
42
+ * '--cl-color-primary-base': '#059669',
43
+ * '--cl-color-primary-hover': '#047857',
44
+ * }
45
+ * });
46
+ */
47
+ declare function createTheme(config: CustomThemeConfig): CustomThemeResult;
48
+
49
+ interface ThemeScriptProps {
50
+ storageKey?: string;
51
+ defaultTheme?: string;
52
+ attribute?: string;
53
+ nonce?: string;
54
+ }
55
+ /**
56
+ * Inline synchronous script that prevents theme flash (FOUC) during SSR page load.
57
+ * Place inside the `<head>` of your application layout.
58
+ */
59
+ declare function ThemeScript({ storageKey, defaultTheme, attribute, nonce, }: ThemeScriptProps): React.JSX.Element;
60
+
61
+ type ButtonVariant = "solid" | "outline" | "ghost" | "subtle" | "link";
62
+ type ButtonSize = "xs" | "sm" | "md" | "lg" | "xl";
63
+ type ButtonColorScheme = "primary" | "secondary" | "success" | "warning" | "danger" | "info" | "neutral";
64
+ type ButtonLoadingPosition = "start" | "end" | "center";
65
+ interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
66
+ /**
67
+ * Visual aesthetic treatment of the button.
68
+ * @default "solid"
69
+ */
70
+ variant?: ButtonVariant;
71
+ /**
72
+ * Sizing scale mapped to the spatial baseline grid.
73
+ * @default "md"
74
+ */
75
+ size?: ButtonSize;
76
+ /**
77
+ * Semantic color intent.
78
+ * @default "primary"
79
+ */
80
+ colorScheme?: ButtonColorScheme;
81
+ /**
82
+ * If true, displays an animated spinner and suppresses user interaction.
83
+ * Automatically sets `aria-busy="true"`.
84
+ * @default false
85
+ */
86
+ isLoading?: boolean;
87
+ /**
88
+ * Optional accessible text displayed alongside the spinner when `isLoading` is true.
89
+ */
90
+ loadingText?: string;
91
+ /**
92
+ * Position of the loading spinner relative to the label.
93
+ * @default "start"
94
+ */
95
+ loadingPosition?: ButtonLoadingPosition;
96
+ /**
97
+ * If true, the button is disabled and completely non-interactive.
98
+ * Attaches the native `disabled` attribute and sets `aria-disabled="true"`.
99
+ * @default false
100
+ */
101
+ isDisabled?: boolean;
102
+ /**
103
+ * If true, the button expands to fill 100% of its parent container.
104
+ * @default false
105
+ */
106
+ isFullWidth?: boolean;
107
+ /**
108
+ * Leading icon rendered before the button label.
109
+ * Automatically assigned `aria-hidden="true"`.
110
+ */
111
+ startIcon?: React.ReactNode;
112
+ /**
113
+ * Trailing icon rendered after the button label.
114
+ * Automatically assigned `aria-hidden="true"`.
115
+ */
116
+ endIcon?: React.ReactNode;
117
+ /**
118
+ * If true, delegates rendering to the immediate child element using Slot.
119
+ * @default false
120
+ */
121
+ asChild?: boolean;
122
+ /**
123
+ * Button content or label.
124
+ */
125
+ children?: React.ReactNode;
126
+ }
127
+
128
+ /**
129
+ * Chellaa React Button component.
130
+ *
131
+ * Fundamental action primitive supporting 5 variants, 5 sizes, 7 color schemes,
132
+ * loading states, icons, keyboard interaction, and polymorphic slot delegation via `asChild`.
133
+ */
134
+ declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;
135
+
136
+ type ButtonGroupOrientation = "horizontal" | "vertical";
137
+ interface ButtonGroupProps extends React.HTMLAttributes<HTMLDivElement> {
138
+ /**
139
+ * Sizing scale passed down to grouped buttons.
140
+ * @default "md"
141
+ */
142
+ size?: ButtonSize;
143
+ /**
144
+ * Visual aesthetic treatment passed down to grouped buttons.
145
+ * @default "solid"
146
+ */
147
+ variant?: ButtonVariant;
148
+ /**
149
+ * Semantic color intent passed down to grouped buttons.
150
+ * @default "primary"
151
+ */
152
+ colorScheme?: ButtonColorScheme;
153
+ /**
154
+ * If true, all buttons in the group are disabled.
155
+ * @default false
156
+ */
157
+ isDisabled?: boolean;
158
+ /**
159
+ * If true, adjacent buttons snap together with collapsed borders and inner border-radii.
160
+ * @default false
161
+ */
162
+ isAttached?: boolean;
163
+ /**
164
+ * Layout orientation of the button group.
165
+ * @default "horizontal"
166
+ */
167
+ orientation?: ButtonGroupOrientation;
168
+ /**
169
+ * Custom spacing between buttons when not attached.
170
+ */
171
+ spacing?: string | number;
172
+ /**
173
+ * If true, delegates rendering to the immediate child element using Slot.
174
+ * @default false
175
+ */
176
+ asChild?: boolean;
177
+ /**
178
+ * Buttons to be grouped.
179
+ */
180
+ children?: React.ReactNode;
181
+ }
182
+ interface ButtonGroupContextValue {
183
+ size?: ButtonSize | undefined;
184
+ variant?: ButtonVariant | undefined;
185
+ colorScheme?: ButtonColorScheme | undefined;
186
+ isDisabled?: boolean | undefined;
187
+ }
188
+
189
+ /**
190
+ * Chellaa React ButtonGroup component.
191
+ *
192
+ * Container primitive for grouping related buttons with unified sizing,
193
+ * visual variants, color schemes, disabled states, and attached border management.
194
+ */
195
+ declare const ButtonGroup: React.ForwardRefExoticComponent<ButtonGroupProps & React.RefAttributes<HTMLDivElement>>;
196
+
197
+ declare const ButtonGroupContext: React.Context<ButtonGroupContextValue | undefined>;
198
+ /**
199
+ * Hook to access parent ButtonGroup context if present.
200
+ */
201
+ declare function useButtonGroupContext(): ButtonGroupContextValue | undefined;
202
+
203
+ export { Button, type ButtonColorScheme, ButtonGroup, ButtonGroupContext, type ButtonGroupContextValue, type ButtonGroupOrientation, type ButtonGroupProps, type ButtonLoadingPosition, type ButtonProps, type ButtonSize, type ButtonVariant, type CustomThemeConfig, type CustomThemeResult, type ThemeContextValue, type ThemeMode, ThemeProvider, type ThemeProviderProps, ThemeScript, type ThemeScriptProps, createTheme, useButtonGroupContext, useTheme };
@@ -0,0 +1,203 @@
1
+ import * as React from 'react';
2
+
3
+ type ThemeMode = "light" | "dark" | "system" | string;
4
+ interface ThemeContextValue {
5
+ theme: ThemeMode;
6
+ setTheme: (theme: ThemeMode) => void;
7
+ resolvedTheme: "light" | "dark";
8
+ systemTheme: "light" | "dark" | undefined;
9
+ }
10
+ interface ThemeProviderProps {
11
+ children?: React.ReactNode;
12
+ defaultTheme?: ThemeMode;
13
+ storageKey?: string;
14
+ enableSystem?: boolean;
15
+ tokens?: Record<string, string>;
16
+ attribute?: string;
17
+ }
18
+ declare function ThemeProvider({ children, defaultTheme, storageKey, enableSystem, tokens, attribute, }: ThemeProviderProps): React.JSX.Element;
19
+
20
+ /**
21
+ * Accesses the active theme context, allowing components to read and update
22
+ * the current theme mode (`light`, `dark`, `system`), resolved theme, and system preference.
23
+ */
24
+ declare function useTheme(): ThemeContextValue;
25
+
26
+ interface CustomThemeConfig {
27
+ name: string;
28
+ tokens: Record<string, string>;
29
+ }
30
+ interface CustomThemeResult {
31
+ name: string;
32
+ tokens: Record<string, string>;
33
+ cssText: string;
34
+ }
35
+ /**
36
+ * Creates a structured custom theme definition and compiles it to valid CSS custom property text.
37
+ *
38
+ * @example
39
+ * const emeraldTheme = createTheme({
40
+ * name: 'emerald',
41
+ * tokens: {
42
+ * '--cl-color-primary-base': '#059669',
43
+ * '--cl-color-primary-hover': '#047857',
44
+ * }
45
+ * });
46
+ */
47
+ declare function createTheme(config: CustomThemeConfig): CustomThemeResult;
48
+
49
+ interface ThemeScriptProps {
50
+ storageKey?: string;
51
+ defaultTheme?: string;
52
+ attribute?: string;
53
+ nonce?: string;
54
+ }
55
+ /**
56
+ * Inline synchronous script that prevents theme flash (FOUC) during SSR page load.
57
+ * Place inside the `<head>` of your application layout.
58
+ */
59
+ declare function ThemeScript({ storageKey, defaultTheme, attribute, nonce, }: ThemeScriptProps): React.JSX.Element;
60
+
61
+ type ButtonVariant = "solid" | "outline" | "ghost" | "subtle" | "link";
62
+ type ButtonSize = "xs" | "sm" | "md" | "lg" | "xl";
63
+ type ButtonColorScheme = "primary" | "secondary" | "success" | "warning" | "danger" | "info" | "neutral";
64
+ type ButtonLoadingPosition = "start" | "end" | "center";
65
+ interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
66
+ /**
67
+ * Visual aesthetic treatment of the button.
68
+ * @default "solid"
69
+ */
70
+ variant?: ButtonVariant;
71
+ /**
72
+ * Sizing scale mapped to the spatial baseline grid.
73
+ * @default "md"
74
+ */
75
+ size?: ButtonSize;
76
+ /**
77
+ * Semantic color intent.
78
+ * @default "primary"
79
+ */
80
+ colorScheme?: ButtonColorScheme;
81
+ /**
82
+ * If true, displays an animated spinner and suppresses user interaction.
83
+ * Automatically sets `aria-busy="true"`.
84
+ * @default false
85
+ */
86
+ isLoading?: boolean;
87
+ /**
88
+ * Optional accessible text displayed alongside the spinner when `isLoading` is true.
89
+ */
90
+ loadingText?: string;
91
+ /**
92
+ * Position of the loading spinner relative to the label.
93
+ * @default "start"
94
+ */
95
+ loadingPosition?: ButtonLoadingPosition;
96
+ /**
97
+ * If true, the button is disabled and completely non-interactive.
98
+ * Attaches the native `disabled` attribute and sets `aria-disabled="true"`.
99
+ * @default false
100
+ */
101
+ isDisabled?: boolean;
102
+ /**
103
+ * If true, the button expands to fill 100% of its parent container.
104
+ * @default false
105
+ */
106
+ isFullWidth?: boolean;
107
+ /**
108
+ * Leading icon rendered before the button label.
109
+ * Automatically assigned `aria-hidden="true"`.
110
+ */
111
+ startIcon?: React.ReactNode;
112
+ /**
113
+ * Trailing icon rendered after the button label.
114
+ * Automatically assigned `aria-hidden="true"`.
115
+ */
116
+ endIcon?: React.ReactNode;
117
+ /**
118
+ * If true, delegates rendering to the immediate child element using Slot.
119
+ * @default false
120
+ */
121
+ asChild?: boolean;
122
+ /**
123
+ * Button content or label.
124
+ */
125
+ children?: React.ReactNode;
126
+ }
127
+
128
+ /**
129
+ * Chellaa React Button component.
130
+ *
131
+ * Fundamental action primitive supporting 5 variants, 5 sizes, 7 color schemes,
132
+ * loading states, icons, keyboard interaction, and polymorphic slot delegation via `asChild`.
133
+ */
134
+ declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;
135
+
136
+ type ButtonGroupOrientation = "horizontal" | "vertical";
137
+ interface ButtonGroupProps extends React.HTMLAttributes<HTMLDivElement> {
138
+ /**
139
+ * Sizing scale passed down to grouped buttons.
140
+ * @default "md"
141
+ */
142
+ size?: ButtonSize;
143
+ /**
144
+ * Visual aesthetic treatment passed down to grouped buttons.
145
+ * @default "solid"
146
+ */
147
+ variant?: ButtonVariant;
148
+ /**
149
+ * Semantic color intent passed down to grouped buttons.
150
+ * @default "primary"
151
+ */
152
+ colorScheme?: ButtonColorScheme;
153
+ /**
154
+ * If true, all buttons in the group are disabled.
155
+ * @default false
156
+ */
157
+ isDisabled?: boolean;
158
+ /**
159
+ * If true, adjacent buttons snap together with collapsed borders and inner border-radii.
160
+ * @default false
161
+ */
162
+ isAttached?: boolean;
163
+ /**
164
+ * Layout orientation of the button group.
165
+ * @default "horizontal"
166
+ */
167
+ orientation?: ButtonGroupOrientation;
168
+ /**
169
+ * Custom spacing between buttons when not attached.
170
+ */
171
+ spacing?: string | number;
172
+ /**
173
+ * If true, delegates rendering to the immediate child element using Slot.
174
+ * @default false
175
+ */
176
+ asChild?: boolean;
177
+ /**
178
+ * Buttons to be grouped.
179
+ */
180
+ children?: React.ReactNode;
181
+ }
182
+ interface ButtonGroupContextValue {
183
+ size?: ButtonSize | undefined;
184
+ variant?: ButtonVariant | undefined;
185
+ colorScheme?: ButtonColorScheme | undefined;
186
+ isDisabled?: boolean | undefined;
187
+ }
188
+
189
+ /**
190
+ * Chellaa React ButtonGroup component.
191
+ *
192
+ * Container primitive for grouping related buttons with unified sizing,
193
+ * visual variants, color schemes, disabled states, and attached border management.
194
+ */
195
+ declare const ButtonGroup: React.ForwardRefExoticComponent<ButtonGroupProps & React.RefAttributes<HTMLDivElement>>;
196
+
197
+ declare const ButtonGroupContext: React.Context<ButtonGroupContextValue | undefined>;
198
+ /**
199
+ * Hook to access parent ButtonGroup context if present.
200
+ */
201
+ declare function useButtonGroupContext(): ButtonGroupContextValue | undefined;
202
+
203
+ export { Button, type ButtonColorScheme, ButtonGroup, ButtonGroupContext, type ButtonGroupContextValue, type ButtonGroupOrientation, type ButtonGroupProps, type ButtonLoadingPosition, type ButtonProps, type ButtonSize, type ButtonVariant, type CustomThemeConfig, type CustomThemeResult, type ThemeContextValue, type ThemeMode, ThemeProvider, type ThemeProviderProps, ThemeScript, type ThemeScriptProps, createTheme, useButtonGroupContext, useTheme };