@timbal-ai/timbal-react 0.8.2 → 1.1.0

package/dist/studio.d.cts

@@ -1,6 +1,6 @@
-export { M as ModeToggle, a as ModeToggleProps, b as ModeToggleTheme, S as STUDIO_NAV_MODE, c as StudioModeSwitch, d as StudioModeSwitchProps, e as StudioNavMode, f as StudioSidebar, g as StudioSidebarProps, h as StudioWelcome, i as StudioWelcomeProps, T as TimbalChatShell, j as TimbalChatShellProps, k as TimbalMark, l as TimbalMarkProps, m as TimbalStudioShell, n as TimbalStudioShellProps } from './welcome-COOb05a5.cjs';
+export { M as ModeToggle, a as ModeToggleProps, b as ModeToggleTheme, S as STUDIO_NAV_MODE, c as StudioModeSwitch, d as StudioModeSwitchProps, e as StudioNavMode, f as StudioSidebar, g as StudioSidebarProps, h as StudioWelcome, i as StudioWelcomeProps, T as TimbalChatShell, j as TimbalChatShellProps, k as TimbalMark, l as TimbalMarkProps, m as TimbalStudioShell, n as TimbalStudioShellProps } from './welcome-CRqOPKMp.cjs';
 import { FC } from 'react';
-import './chat-Bed4FQSl.cjs';
+import './chat-DCms8pJ_.cjs';
 import 'react/jsx-runtime';
 import '@assistant-ui/react';
 import '@timbal-ai/timbal-sdk';

package/dist/studio.d.ts

@@ -1,6 +1,6 @@
-export { M as ModeToggle, a as ModeToggleProps, b as ModeToggleTheme, S as STUDIO_NAV_MODE, c as StudioModeSwitch, d as StudioModeSwitchProps, e as StudioNavMode, f as StudioSidebar, g as StudioSidebarProps, h as StudioWelcome, i as StudioWelcomeProps, T as TimbalChatShell, j as TimbalChatShellProps, k as TimbalMark, l as TimbalMarkProps, m as TimbalStudioShell, n as TimbalStudioShellProps } from './welcome-DE08m9ca.js';
+export { M as ModeToggle, a as ModeToggleProps, b as ModeToggleTheme, S as STUDIO_NAV_MODE, c as StudioModeSwitch, d as StudioModeSwitchProps, e as StudioNavMode, f as StudioSidebar, g as StudioSidebarProps, h as StudioWelcome, i as StudioWelcomeProps, T as TimbalChatShell, j as TimbalChatShellProps, k as TimbalMark, l as TimbalMarkProps, m as TimbalStudioShell, n as TimbalStudioShellProps } from './welcome-DlHUa3OL.js';
 import { FC } from 'react';
-import './chat-Bed4FQSl.js';
+import './chat-DCms8pJ_.js';
 import 'react/jsx-runtime';
 import '@assistant-ui/react';
 import '@timbal-ai/timbal-sdk';

package/dist/studio.esm.js

@@ -8,12 +8,12 @@ import {
   TimbalChatShell,
   TimbalMark,
   TimbalStudioShell
-} from "./chunk-VWHHKAHN.esm.js";
+} from "./chunk-FRZOEYBO.esm.js";
 import "./chunk-QIABF4KB.esm.js";
-import "./chunk-CFU3YDTV.esm.js";
-import "./chunk-5ZKLPWVN.esm.js";
-import "./chunk-OISVICYF.esm.js";
-import "./chunk-QVAUCVQA.esm.js";
+import "./chunk-XCM3V6RK.esm.js";
+import "./chunk-YXZ22OJN.esm.js";
+import "./chunk-P3KDAYX6.esm.js";
+import "./chunk-4AKJ6FKE.esm.js";
 export {
   ModeToggle,
   STUDIO_NAV_MODE,

package/dist/styles.css

@@ -106,6 +106,16 @@
   --ghost-fill-hover: oklch(0.965 0.002 260 / 0.7);
   --ghost-fill-active: oklch(0.91 0.004 260 / 0.7);
 
+  /* Chart series palette — shadcn-style categorical tokens. Series 1 leans on
+     the brand primary so single-series charts feel native; 2–6 are distinct.
+     Override any of these in your host app's :root to rebrand every chart. */
+  --chart-1: var(--primary);
+  --chart-2: oklch(0.62 0.13 184);
+  --chart-3: oklch(0.7 0.16 70);
+  --chart-4: oklch(0.62 0.2 300);
+  --chart-5: oklch(0.65 0.21 28);
+  --chart-6: oklch(0.6 0.13 233);
+
   /* Code block surface (markdown). */
   --code-block-bg: oklch(0.98 0 0);
   --code-header-bg: oklch(0.965 0 0);
@@ -235,6 +245,15 @@
   --ghost-fill-hover: oklch(1 0 0 / 0.10);
   --ghost-fill-active: oklch(1 0 0 / 0.15);
 
+  /* Chart series palette (dark) — brighter, higher-chroma so lines/areas read
+     against the dark surface. Series 1 still follows the brand primary. */
+  --chart-1: var(--primary);
+  --chart-2: oklch(0.7 0.14 184);
+  --chart-3: oklch(0.77 0.16 70);
+  --chart-4: oklch(0.7 0.19 300);
+  --chart-5: oklch(0.7 0.2 28);
+  --chart-6: oklch(0.68 0.13 233);
+
   --code-block-bg: oklch(0.19 0 0);
   --code-header-bg: oklch(0.22 0 0 / 0.8);
 
@@ -306,6 +325,13 @@
   --color-bubble-user: var(--bubble-user);
   --color-bubble-user-foreground: var(--bubble-user-foreground);
 
+  --color-chart-1: var(--chart-1);
+  --color-chart-2: var(--chart-2);
+  --color-chart-3: var(--chart-3);
+  --color-chart-4: var(--chart-4);
+  --color-chart-5: var(--chart-5);
+  --color-chart-6: var(--chart-6);
+
   --color-primary-fill-from: var(--primary-fill-from);
   --color-primary-fill-to: var(--primary-fill-to);
   --color-primary-fill-hover-from: var(--primary-fill-hover-from);
@@ -338,6 +364,200 @@
    from `<html>` and every utility flips together with the base tokens. */
 @custom-variant dark (&:is(.dark *));
 
+/* =============================================================== *
+ * Motion engine — enter/exit, fade, zoom, slide, accordion        *
+ * --------------------------------------------------------------- *
+ * Every overlay in the package (Dialog, Sheet, DropdownMenu,      *
+ * Popover, Select, Tooltip, Toast, NavigationMenu) is authored    *
+ * against these `animate-in` / `animate-out` + modifier classes.  *
+ * They are inlined here so the shipped stylesheet animates with    *
+ * zero extra dependencies and zero consumer config. Duration flows *
+ * from any `duration-*` utility on the element (var --tw-duration).*
+ * =============================================================== */
+
+@keyframes tw-enter {
+  from {
+    opacity: var(--tw-enter-opacity, 1);
+    transform: translate3d(
+        var(--tw-enter-translate-x, 0),
+        var(--tw-enter-translate-y, 0),
+        0
+      )
+      scale3d(
+        var(--tw-enter-scale, 1),
+        var(--tw-enter-scale, 1),
+        var(--tw-enter-scale, 1)
+      )
+      rotate(var(--tw-enter-rotate, 0));
+  }
+}
+
+@keyframes tw-exit {
+  to {
+    opacity: var(--tw-exit-opacity, 1);
+    transform: translate3d(
+        var(--tw-exit-translate-x, 0),
+        var(--tw-exit-translate-y, 0),
+        0
+      )
+      scale3d(
+        var(--tw-exit-scale, 1),
+        var(--tw-exit-scale, 1),
+        var(--tw-exit-scale, 1)
+      )
+      rotate(var(--tw-exit-rotate, 0));
+  }
+}
+
+@utility animate-in {
+  animation: tw-enter var(--tw-duration, 150ms) ease-out;
+}
+@utility animate-out {
+  animation: tw-exit var(--tw-duration, 150ms) ease-in;
+}
+
+/* Fade modifiers (number = target opacity ÷ 100). */
+@utility fade-in {
+  --tw-enter-opacity: 0;
+}
+@utility fade-in-0 {
+  --tw-enter-opacity: 0;
+}
+@utility fade-out {
+  --tw-exit-opacity: 0;
+}
+@utility fade-out-0 {
+  --tw-exit-opacity: 0;
+}
+@utility fade-out-80 {
+  --tw-exit-opacity: 0.8;
+}
+
+/* Zoom modifiers (number = scale × 100). */
+@utility zoom-in-95 {
+  --tw-enter-scale: 0.95;
+}
+@utility zoom-out-95 {
+  --tw-exit-scale: 0.95;
+}
+
+/* Slide-in (starting offset). Unitless + `-full` = 100%; `-2` = 0.5rem; `-52` = 13rem. */
+@utility slide-in-from-top {
+  --tw-enter-translate-y: -100%;
+}
+@utility slide-in-from-top-full {
+  --tw-enter-translate-y: -100%;
+}
+@utility slide-in-from-bottom {
+  --tw-enter-translate-y: 100%;
+}
+@utility slide-in-from-bottom-full {
+  --tw-enter-translate-y: 100%;
+}
+@utility slide-in-from-left {
+  --tw-enter-translate-x: -100%;
+}
+@utility slide-in-from-right {
+  --tw-enter-translate-x: 100%;
+}
+@utility slide-in-from-top-2 {
+  --tw-enter-translate-y: -0.5rem;
+}
+@utility slide-in-from-bottom-2 {
+  --tw-enter-translate-y: 0.5rem;
+}
+@utility slide-in-from-left-2 {
+  --tw-enter-translate-x: -0.5rem;
+}
+@utility slide-in-from-right-2 {
+  --tw-enter-translate-x: 0.5rem;
+}
+@utility slide-in-from-bottom-1 {
+  --tw-enter-translate-y: 0.25rem;
+}
+@utility slide-in-from-left-52 {
+  --tw-enter-translate-x: -13rem;
+}
+@utility slide-in-from-right-52 {
+  --tw-enter-translate-x: 13rem;
+}
+
+/* Slide-out (ending offset). */
+@utility slide-out-to-top {
+  --tw-exit-translate-y: -100%;
+}
+@utility slide-out-to-bottom {
+  --tw-exit-translate-y: 100%;
+}
+@utility slide-out-to-left {
+  --tw-exit-translate-x: -100%;
+}
+@utility slide-out-to-right {
+  --tw-exit-translate-x: 100%;
+}
+@utility slide-out-to-right-full {
+  --tw-exit-translate-x: 100%;
+}
+@utility slide-out-to-left-52 {
+  --tw-exit-translate-x: -13rem;
+}
+@utility slide-out-to-right-52 {
+  --tw-exit-translate-x: 13rem;
+}
+
+/* Disclosure height transitions — read Radix's measured content height. */
+@keyframes accordion-down {
+  from {
+    height: 0;
+  }
+  to {
+    height: var(--radix-accordion-content-height);
+  }
+}
+@keyframes accordion-up {
+  from {
+    height: var(--radix-accordion-content-height);
+  }
+  to {
+    height: 0;
+  }
+}
+@keyframes collapsible-down {
+  from {
+    height: 0;
+  }
+  to {
+    height: var(--radix-collapsible-content-height);
+  }
+}
+@keyframes collapsible-up {
+  from {
+    height: var(--radix-collapsible-content-height);
+  }
+  to {
+    height: 0;
+  }
+}
+@keyframes caret-blink {
+  0%,
+  70%,
+  100% {
+    opacity: 1;
+  }
+  20%,
+  50% {
+    opacity: 0;
+  }
+}
+
+@theme {
+  --animate-accordion-down: accordion-down 200ms ease-out;
+  --animate-accordion-up: accordion-up 200ms ease-out;
+  --animate-collapsible-down: collapsible-down 200ms ease-out;
+  --animate-collapsible-up: collapsible-up 200ms ease-out;
+  --animate-caret-blink: caret-blink 1.25s ease-out infinite;
+}
+
 /** Pill segmented track — supports solid or gradient via `--pill-segmented-track`. */
 @utility bg-pill-segmented-track {
   background: var(--pill-segmented-track);