@usetheo/ui 0.13.1 → 0.14.0

package/dist/tokens-v4.css

@@ -1,223 +0,0 @@
-/* Theo UI — Tailwind v4 theme aliases.
- *
- * Companion to `tokens.css`. The base file declares the v3-style runtime
- * variables (`--primary`, `--background`, …) that `<ThemeProvider>` and
- * `[data-theme]` cascades mutate at runtime. This file declares the
- * Tailwind v4 `@theme` namespace (`--color-primary`, `--color-background`,
- * …) by aliasing back to those runtime vars via `hsl(var(--*))`.
- *
- * Why two layers:
- *   - `<ThemeProvider>` (and the 10 built-in themes) sets `--primary`
- *     etc. at runtime — that's the theme switch surface.
- *   - Tailwind v4 resolves color utilities exclusively through
- *     `--color-*` tokens declared in `@theme`. Without these aliases
- *     `bg-primary`, `text-muted-foreground`, `border-border`, etc. emit
- *     a className with no matching CSS rule.
- *
- * The indirection (`--color-primary: var(--primary)`) preserves the
- * runtime theme cascade — browsers resolve `var(--color-primary)` →
- * `var(--primary)` → current `[data-theme]` value at paint time.
- *
- * See RFC 0008 follow-up.
- */
-
-/* `@theme inline` (Tailwind v4 keyword) preserves the var() reference at
- * runtime instead of inlining the value at build time. Without `inline`,
- * `--color-primary: var(--primary)` would resolve to whatever `--primary`
- * was when Tailwind compiled the CSS — breaking the theme cascade.
- * See https://tailwindcss.com/docs/theme#using-your-theme-variables-in-arbitrary-values
- */
-@theme inline {
-  /* Color tokens ------------------------------------------------------ */
-  --color-background: var(--background);
-  --color-foreground: var(--foreground);
-
-  --color-card: var(--card);
-  --color-card-foreground: var(--card-foreground);
-
-  --color-popover: var(--popover);
-  --color-popover-foreground: var(--popover-foreground);
-
-  --color-primary: var(--primary);
-  --color-primary-deep: var(--primary-deep);
-  --color-primary-glow: var(--primary-glow);
-  --color-primary-foreground: var(--primary-foreground);
-
-  --color-secondary: var(--secondary);
-  --color-secondary-foreground: var(--secondary-foreground);
-
-  --color-accent: var(--accent);
-  --color-accent-deep: var(--accent-deep);
-  --color-accent-foreground: var(--accent-foreground);
-
-  --color-muted: var(--muted);
-  --color-muted-foreground: var(--muted-foreground);
-
-  --color-border: var(--border);
-  --color-input: var(--input);
-  --color-ring: var(--ring);
-
-  --color-success: var(--success);
-  --color-success-foreground: var(--success-foreground);
-  --color-warning: var(--warning);
-  --color-warning-foreground: var(--warning-foreground);
-  --color-destructive: var(--destructive);
-  --color-destructive-foreground: var(--destructive-foreground);
-  --color-info: var(--info);
-  --color-info-foreground: var(--info-foreground);
-
-  /* Status group (D4) ------------------------------------------------- */
-  --color-status-online: var(--status-online);
-  --color-status-online-foreground: var(--status-online-foreground);
-  --color-status-offline: var(--status-offline);
-  --color-status-offline-foreground: var(--status-offline-foreground);
-  --color-status-degraded: var(--status-degraded);
-  --color-status-degraded-foreground: var(--status-degraded-foreground);
-  --color-status-info: var(--status-info);
-  --color-status-info-foreground: var(--status-info-foreground);
-
-  /* Fonts ------------------------------------------------------------- */
-  --font-display: var(--font-display);
-  --font-sans: var(--font-body);
-  --font-mono: var(--font-mono);
-
-  /* Violet Forge typescale -------------------------------------------- *
-   * Compound text utilities: each `--text-{name}` declares the size,
-   * with companion `--*--line-height`, `--*--letter-spacing`, and
-   * `--*--font-weight` properties Tailwind v4 picks up automatically.
-   */
-  --text-display-2xl: 64px;
-  --text-display-2xl--line-height: 1;
-  --text-display-2xl--letter-spacing: -0.0464em;
-  --text-display-2xl--font-weight: 600;
-
-  --text-display-xl: 48px;
-  --text-display-xl--line-height: 1.05;
-  --text-display-xl--letter-spacing: -0.05em;
-  --text-display-xl--font-weight: 600;
-
-  --text-display-lg: 40px;
-  --text-display-lg--line-height: 1.1;
-  --text-display-lg--letter-spacing: -0.05em;
-  --text-display-lg--font-weight: 600;
-
-  --text-display-md: 32px;
-  --text-display-md--line-height: 1.2;
-  --text-display-md--letter-spacing: -0.04em;
-  --text-display-md--font-weight: 600;
-
-  --text-headline: 28px;
-  --text-headline--line-height: 1.25;
-  --text-headline--letter-spacing: -0.035em;
-  --text-headline--font-weight: 600;
-
-  --text-title-lg: 24px;
-  --text-title-lg--line-height: 1.33;
-  --text-title-lg--letter-spacing: -0.04em;
-  --text-title-lg--font-weight: 600;
-
-  --text-title-md: 20px;
-  --text-title-md--line-height: 1.4;
-  --text-title-md--letter-spacing: -0.03em;
-  --text-title-md--font-weight: 600;
-
-  --text-body-lg: 18px;
-  --text-body-lg--line-height: 1.56;
-  --text-body-lg--letter-spacing: -0.01em;
-  --text-body-lg--font-weight: 400;
-
-  --text-body-md: 14px;
-  --text-body-md--line-height: 1.43;
-  --text-body-md--letter-spacing: 0;
-  --text-body-md--font-weight: 400;
-
-  --text-body-sm: 13px;
-  --text-body-sm--line-height: 1.46;
-  --text-body-sm--font-weight: 400;
-
-  --text-label: 14px;
-  --text-label--line-height: 1.43;
-  --text-label--font-weight: 500;
-
-  --text-label-caps: 12px;
-  --text-label-caps--line-height: 1.33;
-  --text-label-caps--letter-spacing: 0.04em;
-  --text-label-caps--font-weight: 500;
-
-  --text-code-md: 14px;
-  --text-code-md--line-height: 1.5;
-  --text-code-md--font-weight: 400;
-
-  --text-code-sm: 13px;
-  --text-code-sm--line-height: 1.54;
-  --text-code-sm--font-weight: 500;
-
-  /* Radii — Tailwind v4 reads the value directly (no var indirection). */
-  --radius-none: 0px;
-  --radius-sm: 4px;
-  --radius-md: 6px;
-  --radius-lg: 10px;
-  --radius-xl: 14px;
-  --radius-2xl: 20px;
-  --radius-full: 9999px;
-
-  /* Shadows — alias to tokens.css computed values (which already use
-     * `hsl(var(--foreground) / …)` so theme-switch keeps them in step). */
-  --shadow-sm: var(--shadow-sm);
-  --shadow-md: var(--shadow-md);
-  --shadow-lg: var(--shadow-lg);
-  --shadow-glow: var(--shadow-glow);
-  --shadow-glow-strong: var(--shadow-glow-strong);
-
-  /* Motion ------------------------------------------------------------ */
-  --ease-out-soft: var(--ease-out-soft);
-  --ease-snap: var(--ease-snap);
-
-  /* Container queries (T5.5) — Tailwind v4 native @container support.
-     * Sizes drive `@<size>:<utility>` variants for container-relative responsive
-     * design (components that adapt to their parent's width, not the viewport).
-     * Default sizes mirror Tailwind v4 defaults; declared explicitly so the
-     * preset ships consistent values.
-     */
-  --container-3xs: 16rem;
-  --container-2xs: 18rem;
-  --container-xs: 20rem;
-  --container-sm: 24rem;
-  --container-md: 28rem;
-  --container-lg: 32rem;
-  --container-xl: 36rem;
-  --container-2xl: 42rem;
-  --container-3xl: 48rem;
-  --container-4xl: 56rem;
-  --container-5xl: 64rem;
-  --container-6xl: 72rem;
-  --container-7xl: 80rem;
-
-  /* Animations — declare so `animate-fade-in-up` and `animate-pulse-glow`
-     * resolve. Keyframes are declared below (outside @theme — Tailwind v4
-     * picks them up via the @keyframes namespace).
-     */
-  --animate-fade-in-up: fade-in-up var(--duration-base) var(--ease-out-soft) both;
-  --animate-pulse-glow: pulse-glow 1.5s var(--ease-in-out) infinite;
-}
-
-@keyframes fade-in-up {
-  0% {
-    opacity: 0;
-    transform: translateY(8px);
-  }
-  100% {
-    opacity: 1;
-    transform: translateY(0);
-  }
-}
-
-@keyframes pulse-glow {
-  0%,
-  100% {
-    box-shadow: 0 0 0 0 color-mix(in oklch, var(--primary) 50%, transparent);
-  }
-  50% {
-    box-shadow: 0 0 0 8px transparent;
-  }
-}

package/dist/tokens.css

@@ -1,315 +0,0 @@
-/* Theo UI — Design System "Violet Forge" tokens.
- *
- * Tokens normativos. Não edite valores aqui sem revisão do design system.
- * Referência: docs/design-system.md
- *
- * Estratégia:
- *   - CSS custom properties para todas as cores, scales e durations.
- *   - Default é light. Dark é ativado via [data-theme="dark"] ou .dark.
- *   - HSL split (h s l) em vez de hex permite alpha via color-mix() ou hsl(var(--x) / .5).
- *
- * Roxo Theo: #A855F7  →  oklch(0.628 0.225 296)  (electric violet — unified 2026-06-09)
- * Burnt sienna:  #C96442  →  hsl(15 54% 53%)
- */
-
-/* `:root` and `[data-theme="dark"]` declarations are intentionally NOT wrapped
- * in `@layer base` so they apply at the document level regardless of whether
- * the consumer's CSS pipeline runs Tailwind's preflight. The texture utilities
- * below remain in `@layer utilities` because that layer affects ordering only,
- * not the cascade root.
- */
-:root {
-  /* Base palette ------------------------------------------------------- *
-     * Neutrals are 100% desaturated (Vercel-style). Color comes from the
-     * primary (violet) + accent (burnt sienna) tokens below — never from
-     * surface tints.
-     */
-  --background: oklch(1 0 0); /* #FFFFFF */
-  --foreground: oklch(0.146 0 0); /* #0A0A0A */
-
-  --card: oklch(1 0 0); /* #FFFFFF */
-  --card-foreground: oklch(0.146 0 0);
-
-  --popover: oklch(1 0 0);
-  --popover-foreground: oklch(0.146 0 0);
-
-  /* Primary — Theo violet (equity) ------------------------------------- *
-   * Post-T3.1 (ADR-0006): -deep and -glow are derived algorithmically via
-   * OKLCH relative-color syntax. Themes that need a per-token override may
-   * still declare these explicitly — the cascade resolves the override.
-   * `max()`/`min()` clamps protect dark/light themes from L overflow (EC-7).
-   */
-  --primary: oklch(0.628 0.225 296); /* #A855F7 — Theo violet electric (unified 2026-06-09) */
-  --primary-deep: oklch(from var(--primary) max(0.05, calc(l - 0.16)) c h);
-  --primary-glow: oklch(from var(--primary) min(0.95, calc(l + 0.18)) c h);
-  --primary-foreground: oklch(1 0 0);
-
-  /* Secondary — neutral muted ----------------------------------------- */
-  --secondary: oklch(0.97 0 0); /* #F5F5F5 */
-  --secondary-foreground: oklch(0.146 0 0);
-
-  /* Accent — burnt sienna --------------------------------------------- *
-   * T3.1: accent-deep derived. Override path identical to primary.
-   */
-  --accent: oklch(0.621 0.132 39); /* #C96442 */
-  --accent-deep: oklch(from var(--accent) max(0.05, calc(l - 0.13)) c h);
-  --accent-foreground: oklch(1 0 0);
-
-  /* Muted ------------------------------------------------------------- */
-  --muted: oklch(0.97 0 0);
-  --muted-foreground: oklch(0.555 0 0); /* #737373 */
-
-  /* Surfaces, borders, inputs ----------------------------------------- */
-  --border: oklch(0.931 0 0); /* #E8E8E8 — Vercel-style hairline */
-  --input: oklch(0.931 0 0);
-  --ring: oklch(0.628 0.225 296); /* matches primary */
-
-  /* Semantics --------------------------------------------------------- */
-  --success: oklch(0.611 0.161 149.7); /* #16A34A */
-  --success-foreground: oklch(1 0 0);
-  --warning: oklch(0.67 0.154 60.6); /* #D97706 */
-  --warning-foreground: oklch(1 0 0);
-  --destructive: oklch(0.579 0.214 27.2); /* #DC2626 */
-  --destructive-foreground: oklch(1 0 0);
-  --info: oklch(0.626 0.186 259.6); /* #3B82F6 */
-  --info-foreground: oklch(1 0 0);
-
-  /* Status (D4 — operational state group) ----------------------------- *
-   * Separate from semantic group (success/destructive/warning/info, which
-   * are action-result colors). Status describes component liveness:
-   * online (alive), offline (dead), degraded (alive-but-slow), info (flag).
-   * Defaults mirror semantic counterparts; themes override for distinction.
-   */
-  --status-online: oklch(0.611 0.161 149.7);
-  --status-online-foreground: oklch(1 0 0);
-  --status-offline: oklch(0.579 0.214 27.2);
-  --status-offline-foreground: oklch(1 0 0);
-  --status-degraded: oklch(0.67 0.154 60.6);
-  --status-degraded-foreground: oklch(1 0 0);
-  --status-info: oklch(0.626 0.186 259.6);
-  --status-info-foreground: oklch(1 0 0);
-
-  /* Radii ------------------------------------------------------------- */
-  --radius-none: 0px;
-  --radius-sm: 4px;
-  --radius-md: 6px;
-  --radius-lg: 10px;
-  --radius-xl: 14px;
-  --radius-2xl: 20px;
-  --radius-full: 9999px;
-  /* shadcn compat */
-  --radius: 14px;
-
-  /* Spacing scale (4px base) ------------------------------------------ */
-  --space-1: 4px;
-  --space-2: 8px;
-  --space-3: 12px;
-  --space-4: 16px;
-  --space-5: 20px;
-  --space-6: 24px;
-  --space-8: 32px;
-  --space-10: 40px;
-  --space-12: 48px;
-  --space-16: 64px;
-  --space-20: 80px;
-  --space-24: 96px;
-  --space-32: 128px;
-
-  /* Elevation — theme-aware (uses --foreground for shadow ink,
-     * --primary for the signature glow, so swapping themes recolors them).
-     * Post-T2.5: tokens are OKLCH; we compose alpha via color-mix(in oklch, ...)
-     * which is perceptually correct AND works with any color-space variable.
-     */
-  --shadow-sm: 0 1px 2px 0 color-mix(in oklch, var(--foreground) 6%, transparent);
-  --shadow-md: 0 2px 8px -2px color-mix(in oklch, var(--foreground) 8%, transparent), 0 1px 3px
-    color-mix(in oklch, var(--foreground) 6%, transparent);
-  --shadow-lg: 0 12px 32px -8px color-mix(in oklch, var(--foreground) 12%, transparent), 0 4px 12px
-    color-mix(in oklch, var(--foreground) 8%, transparent);
-  --shadow-glow: 0 0 24px color-mix(in oklch, var(--primary) 25%, transparent);
-  --shadow-glow-strong: 0 0 32px color-mix(in oklch, var(--primary) 40%, transparent);
-
-  /* Motion ------------------------------------------------------------ */
-  --ease-out-soft: cubic-bezier(0.22, 1, 0.36, 1);
-  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
-  --ease-snap: cubic-bezier(0.85, 0, 0.15, 1);
-  --duration-fast: 120ms;
-  --duration-base: 200ms;
-  --duration-slow: 360ms;
-  --stagger: 60ms;
-
-  /* Typography (Geist family — Vercel-inspired Violet Forge) ---------- */
-  --font-display: "Geist", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
-  --font-body: "Geist", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
-  --font-mono: "Geist Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
-}
-
-/* Dark mode — dominante --------------------------------------------- *
-   * Vercel-aligned grayscale: pure neutrals (0% saturation) for every
-   * surface and text layer. Color only in primary (violet), accent (burnt
-   * sienna), and semantic tokens (success/warning/destructive/info).
-   *
-   * Activated exclusively via the `.dark` class on `<html>` (set by
-   * `ThemeProvider`, `ThemeScript`, or consumers manually). The previous
-   * `[data-theme="dark"]` companion selector was dead — `data-theme` holds
-   * the theme NAME, never the literal `"dark"`.
-   */
-.dark {
-  --background: oklch(0.146 0 0); /* #0A0A0A */
-  --foreground: oklch(0.97 0 0); /* #F5F5F5 */
-
-  --card: oklch(0.182 0 0); /* #121212 */
-  --card-foreground: oklch(0.97 0 0);
-
-  --popover: oklch(0.204 0 0); /* #171717 */
-  --popover-foreground: oklch(0.97 0 0);
-
-  --primary: oklch(0.628 0.225 296);
-  --primary-deep: oklch(from var(--primary) max(0.05, calc(l - 0.16)) c h);
-  --primary-glow: oklch(from var(--primary) min(0.95, calc(l + 0.18)) c h);
-  --primary-foreground: oklch(1 0 0);
-
-  --secondary: oklch(0.227 0 0); /* #1C1C1C */
-  --secondary-foreground: oklch(0.97 0 0);
-
-  --accent: oklch(0.621 0.132 39);
-  --accent-deep: oklch(from var(--accent) max(0.05, calc(l - 0.13)) c h);
-  --accent-foreground: oklch(1 0 0);
-
-  --muted: oklch(0.227 0 0);
-  --muted-foreground: oklch(0.683 0 0); /* #999 — Vercel gray-500 */
-
-  --border: oklch(0.28 0 0); /* #292929 */
-  --input: oklch(0.227 0 0);
-  --ring: oklch(0.628 0.225 296);
-
-  --success: oklch(0.814 0.192 155.7); /* #22E58C */
-  --success-foreground: oklch(0.146 0 0);
-  --warning: oklch(0.77 0.165 70.6); /* #F59E0B */
-  --warning-foreground: oklch(0.146 0 0);
-  --destructive: oklch(0.677 0.213 15.6); /* #FF4F6D */
-  --destructive-foreground: oklch(0.146 0 0);
-  --info: oklch(0.732 0.142 254.4); /* #5FB3FF */
-  --info-foreground: oklch(0.146 0 0);
-
-  /* Status (D4 — dark mode mirror of light defaults) ------------------ */
-  --status-online: oklch(0.814 0.192 155.7);
-  --status-online-foreground: oklch(0.146 0 0);
-  --status-offline: oklch(0.677 0.213 15.6);
-  --status-offline-foreground: oklch(0.146 0 0);
-  --status-degraded: oklch(0.77 0.165 70.6);
-  --status-degraded-foreground: oklch(0.146 0 0);
-  --status-info: oklch(0.732 0.142 254.4);
-  --status-info-foreground: oklch(0.146 0 0);
-
-  /* In dark mode, shadows are heavier ink (against the dark surface) and
-     * the glow brightens. Both still derive from theme tokens.
-     * Post-T2.5: OKLCH-aware composition via color-mix() — black ink via
-     * the literal oklch(0 0 0) (no theme indirection needed).
-     */
-  --shadow-sm: 0 1px 2px 0 oklch(0 0 0 / 0.4);
-  --shadow-md: 0 2px 8px -2px oklch(0 0 0 / 0.5), 0 1px 3px oklch(0 0 0 / 0.4);
-  --shadow-lg: 0 12px 32px -8px oklch(0 0 0 / 0.6), 0 4px 12px oklch(0 0 0 / 0.4);
-  --shadow-glow: 0 0 24px color-mix(in oklch, var(--primary-glow) 40%, transparent);
-  --shadow-glow-strong: 0 0 36px color-mix(in oklch, var(--primary-glow) 60%, transparent);
-}
-
-/* Forced colors (Windows High Contrast Mode) — D7 / ADR-0008 ----------- *
- * Maps Theo's semantic tokens to system colors so the UI remains usable
- * (and required by WCAG 1.4.1) when the OS forces a high-contrast palette.
- * Decorative textures opt out via `forced-color-adjust: none` (the dotted
- * patterns and hero glow would invert into solid blocks otherwise).
- *
- * Reference: MDN forced-colors media query, WCAG 2.2 SC 1.4.1.
- */
-@media (forced-colors: active) {
-  :root,
-  .dark {
-    --background: Canvas;
-    --foreground: CanvasText;
-    --card: Canvas;
-    --card-foreground: CanvasText;
-    --popover: Canvas;
-    --popover-foreground: CanvasText;
-    --primary: Highlight;
-    --primary-foreground: HighlightText;
-    --secondary: ButtonFace;
-    --secondary-foreground: ButtonText;
-    --accent: Highlight;
-    --accent-foreground: HighlightText;
-    --muted: ButtonFace;
-    --muted-foreground: GrayText;
-    --border: ButtonBorder;
-    --input: ButtonBorder;
-    --ring: Highlight;
-  }
-
-  /* Texture utilities are decorative — keep them out of the system-color map. */
-  .bg-dotted-violet,
-  .bg-dotted-violet-strong,
-  .bg-hero-glow,
-  .bg-paper-grain {
-    forced-color-adjust: none;
-  }
-}
-
-/* Reduced motion — neutralizes durations and transitions for users who
- * request prefers-reduced-motion: reduce. Components that use animation as
- * semantic state (e.g. a spinner on a running step) can opt back in with
- * Tailwind's `motion-safe:` prefix.
- *
- * Reference: WCAG 2.3.3 Animation from Interactions (Level AAA).
- */
-@media (prefers-reduced-motion: reduce) {
-  :root {
-    --duration-fast: 0ms;
-    --duration-base: 0ms;
-    --duration-slow: 0ms;
-    --stagger: 0ms;
-  }
-  *,
-  *::before,
-  *::after {
-    animation-duration: 0.001ms !important;
-    animation-iteration-count: 1 !important;
-    transition-duration: 0.001ms !important;
-    scroll-behavior: auto !important;
-  }
-}
-
-/* Texture utilities (signature) ---------------------------------------- *
- * Post-T2.5: tokens are OKLCH; we compose alpha via color-mix(in oklch, …),
- * which is perceptually correct and works with any color-space variable.
- */
-@layer utilities {
-  .bg-dotted-violet {
-    background-image: radial-gradient(
-      color-mix(in oklch, var(--primary) 8%, transparent) 1px,
-      transparent 1px
-    );
-    background-size: 20px 20px;
-  }
-
-  .bg-dotted-violet-strong {
-    background-image: radial-gradient(
-      color-mix(in oklch, var(--primary) 16%, transparent) 1px,
-      transparent 1px
-    );
-    background-size: 20px 20px;
-  }
-
-  .bg-hero-glow {
-    background-image: radial-gradient(
-      ellipse 60% 50% at 70% 0%,
-      color-mix(in oklch, var(--primary) 18%, transparent) 0%,
-      transparent 60%
-    );
-  }
-
-  .bg-paper-grain {
-    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2'/%3E%3CfeColorMatrix values='0 0 0 0 0.06 0 0 0 0 0.04 0 0 0 0 0.08 0 0 0 0.18 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.5'/%3E%3C/svg%3E");
-  }
-
-  .text-balance {
-    text-wrap: balance;
-  }
-}

package/dist/types/agent.d.ts

@@ -1,19 +0,0 @@
-import type { ReactNode } from "react";
-export type AgentEventType = "command" | "file_read" | "file_write" | "edit" | "lint" | "typecheck" | "build" | "tool";
-export type AgentEventStatus = "pending" | "running" | "success" | "failed";
-export interface AgentEvent {
-    id: string;
-    type: AgentEventType;
-    label: string;
-    /** File path when the event is file-related. */
-    path?: string;
-    /** Diff stats for edit/write events. */
-    diff?: {
-        added: number;
-        removed: number;
-    };
-    status: AgentEventStatus;
-    timestamp?: string;
-    /** Optional expandable detail (e.g. command output, diff snippet). */
-    detail?: ReactNode;
-}