@timbal-ai/timbal-react 0.5.4 → 0.6.0

package/dist/chat.d.cts

@@ -0,0 +1,13 @@
+export { c as ChatAttachment, d as ChatMessage, e as Composer, f as ComposerProps, g as ContentPart, S as SendOptions, h as Suggestions, i as SuggestionsComponent, j as SuggestionsSlotProps, k as SuggestionsSource, l as TextContentPart, m as ThinkingContentPart, n as Thread, o as ThreadArtifactsConfig, p as ThreadComponents, q as ThreadProps, r as ThreadSuggestion, s as ThreadSuggestionsProps, T as ThreadVariant, t as ThreadWelcomeConfig, u as ThreadWelcomeProps, a as TimbalChat, b as TimbalChatProps, v as TimbalRuntimeProvider, w as TimbalRuntimeProviderProps, x as TimbalStreamApi, y as ToolCallContentPart, U as UseTimbalStreamOptions, z as useResolvedSuggestions, A as useTimbalRuntime, B as useTimbalStream } from './chat-CWtQWDtJ.cjs';
+export { M as MarkdownText, T as THREAD_DEFAULT_MAX_WIDTH, a as ToolFallback, b as TooltipIconButton, c as TooltipIconButtonProps, W as WorkforceSelector, d as WorkforceSelectorProps, e as assistantMessageContentClass, f as assistantMessageRootClass, t as threadMessageColumnClass, u as useToolRunning, g as userMessageRootClass } from './layout-B9VayJhZ.cjs';
+import { FC } from 'react';
+import 'react/jsx-runtime';
+import '@assistant-ui/react';
+import '@timbal-ai/timbal-sdk';
+import './timbal-v2-button-F4-z7m33.cjs';
+
+declare const UserMessageAttachments: FC;
+declare const ComposerAttachments: FC;
+declare const ComposerAddAttachment: FC;
+
+export { ComposerAddAttachment, ComposerAttachments, UserMessageAttachments };

package/dist/chat.d.ts

@@ -0,0 +1,13 @@
+export { c as ChatAttachment, d as ChatMessage, e as Composer, f as ComposerProps, g as ContentPart, S as SendOptions, h as Suggestions, i as SuggestionsComponent, j as SuggestionsSlotProps, k as SuggestionsSource, l as TextContentPart, m as ThinkingContentPart, n as Thread, o as ThreadArtifactsConfig, p as ThreadComponents, q as ThreadProps, r as ThreadSuggestion, s as ThreadSuggestionsProps, T as ThreadVariant, t as ThreadWelcomeConfig, u as ThreadWelcomeProps, a as TimbalChat, b as TimbalChatProps, v as TimbalRuntimeProvider, w as TimbalRuntimeProviderProps, x as TimbalStreamApi, y as ToolCallContentPart, U as UseTimbalStreamOptions, z as useResolvedSuggestions, A as useTimbalRuntime, B as useTimbalStream } from './chat-CWtQWDtJ.js';
+export { M as MarkdownText, T as THREAD_DEFAULT_MAX_WIDTH, a as ToolFallback, b as TooltipIconButton, c as TooltipIconButtonProps, W as WorkforceSelector, d as WorkforceSelectorProps, e as assistantMessageContentClass, f as assistantMessageRootClass, t as threadMessageColumnClass, u as useToolRunning, g as userMessageRootClass } from './layout-CQWngNQ7.js';
+import { FC } from 'react';
+import 'react/jsx-runtime';
+import '@assistant-ui/react';
+import '@timbal-ai/timbal-sdk';
+import './timbal-v2-button-F4-z7m33.js';
+
+declare const UserMessageAttachments: FC;
+declare const ComposerAttachments: FC;
+declare const ComposerAddAttachment: FC;
+
+export { ComposerAddAttachment, ComposerAttachments, UserMessageAttachments };

package/dist/chat.esm.js

@@ -0,0 +1,51 @@
+import {
+  THREAD_DEFAULT_MAX_WIDTH,
+  assistantMessageContentClass,
+  assistantMessageRootClass,
+  threadMessageColumnClass,
+  userMessageRootClass
+} from "./chunk-KC5QLVUG.esm.js";
+import {
+  WorkforceSelector
+} from "./chunk-WLTW56MC.esm.js";
+import {
+  Composer,
+  ComposerAddAttachment,
+  ComposerAttachments,
+  MarkdownText,
+  Suggestions,
+  Thread,
+  TimbalChat,
+  TimbalRuntimeProvider,
+  ToolFallback,
+  TooltipIconButton,
+  UserMessageAttachments,
+  useResolvedSuggestions,
+  useTimbalRuntime,
+  useTimbalStream,
+  useToolRunning
+} from "./chunk-YJQLLFKP.esm.js";
+import "./chunk-4TCJQSIX.esm.js";
+export {
+  Composer,
+  ComposerAddAttachment,
+  ComposerAttachments,
+  MarkdownText,
+  Suggestions,
+  THREAD_DEFAULT_MAX_WIDTH,
+  Thread,
+  TimbalChat,
+  TimbalRuntimeProvider,
+  ToolFallback,
+  TooltipIconButton,
+  UserMessageAttachments,
+  WorkforceSelector,
+  assistantMessageContentClass,
+  assistantMessageRootClass,
+  threadMessageColumnClass,
+  useResolvedSuggestions,
+  useTimbalRuntime,
+  useTimbalStream,
+  useToolRunning,
+  userMessageRootClass
+};

package/dist/chunk-4TCJQSIX.esm.js

@@ -0,0 +1,565 @@
+// src/utils.ts
+import { clsx } from "clsx";
+import { twMerge } from "tailwind-merge";
+function cn(...inputs) {
+  return twMerge(clsx(inputs));
+}
+
+// src/ui/timbal-v2-button.tsx
+import * as React from "react";
+import { Slot } from "radix-ui";
+
+// src/design/button-tokens.ts
+var TIMBAL_V2_ELEVATED_GRADIENT = "bg-gradient-to-b from-elevated-from to-elevated-to";
+var TIMBAL_V2_MODAL_SURFACE = cn(
+  "bg-gradient-to-b from-modal-from to-modal-to",
+  "border border-border shadow-card-elevated"
+);
+var TIMBAL_V2_PRIMARY_GRADIENT = "bg-gradient-to-b from-primary-fill-from to-primary-fill-to";
+var TIMBAL_V2_FROM_LEGACY_BUTTON = {
+  default: "primary",
+  destructive: "destructive",
+  outline: "secondary",
+  secondary: "secondary",
+  ghost: "ghost",
+  link: "link"
+};
+var TIMBAL_V2_SIZE_HEIGHT = {
+  xs: "min-h-8 h-8",
+  sm: "min-h-9 h-9",
+  md: "min-h-10 h-10",
+  lg: "min-h-11 h-11"
+};
+var TIMBAL_V2_SIZE_ICON = {
+  xs: "min-h-8 min-w-8 size-8",
+  sm: "min-h-8 min-w-8 size-8",
+  md: "min-h-10 min-w-10 size-10",
+  lg: "min-h-11 min-w-11 size-11"
+};
+var TIMBAL_V2_SIZE_LABEL_PX = {
+  xs: "px-3",
+  sm: "px-4",
+  md: "px-5",
+  lg: "px-6"
+};
+var TIMBAL_V2_FILL = {
+  primary: [
+    "bg-gradient-to-b from-primary-fill-from to-primary-fill-to",
+    "group-hover/tbv2:from-primary-fill-hover-from group-hover/tbv2:to-primary-fill-hover-to",
+    "group-active/tbv2:from-primary-fill-active-from group-active/tbv2:to-primary-fill-active-to"
+  ].join(" "),
+  informative: [
+    TIMBAL_V2_PRIMARY_GRADIENT,
+    "group-hover/tbv2:from-primary-fill-hover-from group-hover/tbv2:to-primary-fill-hover-to",
+    "group-active/tbv2:from-primary-fill-active-from group-active/tbv2:to-primary-fill-active-to",
+    "group-active/tbv2:[background-image:linear-gradient(to_top,rgba(0,0,0,0.08),transparent_55%)]"
+  ].join(" "),
+  destructive: [
+    TIMBAL_V2_ELEVATED_GRADIENT,
+    "group-hover/tbv2:from-destructive-fill-hover-from group-hover/tbv2:to-destructive-fill-hover-to",
+    "group-active/tbv2:from-destructive-fill-active-from group-active/tbv2:to-destructive-fill-active-to"
+  ].join(" "),
+  secondary: [
+    TIMBAL_V2_ELEVATED_GRADIENT,
+    "group-hover/tbv2:from-secondary-fill-hover-from group-hover/tbv2:to-secondary-fill-hover-to",
+    "group-active/tbv2:from-secondary-fill-active-from group-active/tbv2:to-secondary-fill-active-to"
+  ].join(" "),
+  ghost: [
+    "bg-transparent",
+    "group-hover/tbv2:bg-ghost-fill-hover",
+    "group-active/tbv2:bg-ghost-fill-active"
+  ].join(" "),
+  link: "bg-transparent"
+};
+var TIMBAL_V2_LABEL = {
+  primary: "text-primary-foreground",
+  informative: "text-primary-foreground",
+  destructive: "text-destructive",
+  secondary: "text-foreground",
+  ghost: "text-foreground",
+  link: "text-foreground underline decoration-foreground/25 underline-offset-2 group-hover/tbv2:decoration-foreground/45"
+};
+var TIMBAL_V2_BORDER = {
+  primary: "",
+  informative: "border border-foreground/15",
+  destructive: "border border-destructive/45",
+  secondary: "border border-border",
+  ghost: "",
+  link: ""
+};
+var TIMBAL_V2_SHADOW = {
+  primary: "shadow-card",
+  informative: "shadow-card",
+  destructive: "shadow-card",
+  secondary: "shadow-card",
+  ghost: "",
+  link: ""
+};
+var TIMBAL_V2_SWITCH_TRACK_OFF = cn(
+  TIMBAL_V2_ELEVATED_GRADIENT,
+  "border border-border shadow-card"
+);
+var TIMBAL_V2_SWITCH_THUMB = cn(
+  TIMBAL_V2_ELEVATED_GRADIENT,
+  "border border-border/80 shadow-sm"
+);
+var TIMBAL_V2_SECONDARY_CHROME = [
+  TIMBAL_V2_ELEVATED_GRADIENT,
+  "border border-border shadow-card",
+  "transition-[background-color,box-shadow,border-color] duration-200 ease-in-out",
+  "hover:from-secondary-fill-hover-from hover:to-secondary-fill-hover-to",
+  "active:from-secondary-fill-active-from active:to-secondary-fill-active-to"
+].join(" ");
+
+// src/ui/timbal-v2-button.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+var TIMBAL_V2_FILL_AS_CHILD = {
+  primary: [
+    "bg-gradient-to-b from-primary-fill-from to-primary-fill-to",
+    "hover:from-primary-fill-hover-from hover:to-primary-fill-hover-to",
+    "active:from-primary-fill-active-from active:to-primary-fill-active-to"
+  ].join(" "),
+  informative: [
+    TIMBAL_V2_PRIMARY_GRADIENT,
+    "hover:from-primary-fill-hover-from hover:to-primary-fill-hover-to",
+    "active:from-primary-fill-active-from active:to-primary-fill-active-to",
+    "active:[background-image:linear-gradient(to_top,rgba(0,0,0,0.08),transparent_55%)]"
+  ].join(" "),
+  destructive: [
+    TIMBAL_V2_ELEVATED_GRADIENT,
+    "hover:from-destructive-fill-hover-from hover:to-destructive-fill-hover-to",
+    "active:from-destructive-fill-active-from active:to-destructive-fill-active-to"
+  ].join(" "),
+  secondary: [
+    TIMBAL_V2_ELEVATED_GRADIENT,
+    "hover:from-secondary-fill-hover-from hover:to-secondary-fill-hover-to",
+    "active:from-secondary-fill-active-from active:to-secondary-fill-active-to"
+  ].join(" "),
+  ghost: [
+    "bg-transparent",
+    "hover:bg-ghost-fill-hover",
+    "active:bg-ghost-fill-active"
+  ].join(" "),
+  link: "bg-transparent"
+};
+var TIMBAL_V2_LABEL_AS_CHILD = {
+  ...TIMBAL_V2_LABEL,
+  link: "text-foreground underline decoration-foreground/25 underline-offset-2 hover:decoration-foreground/45"
+};
+var TimbalV2Button = React.forwardRef(function TimbalV2Button2({
+  variant = "secondary",
+  size = "sm",
+  isIconOnly = false,
+  isLoading = false,
+  fullWidth = false,
+  shape = "pill",
+  asChild = false,
+  className,
+  disabled,
+  type = "button",
+  children,
+  ...props
+}, ref) {
+  const isDisabled = disabled || isLoading;
+  const sizeClass = isIconOnly ? TIMBAL_V2_SIZE_ICON[size] : TIMBAL_V2_SIZE_HEIGHT[size];
+  const radiusClass = variant === "link" || variant === "ghost" ? "rounded-md" : shape === "rect" ? "rounded-md" : "rounded-full";
+  const sharedRootClass = cn(
+    "relative box-border inline-flex items-center justify-center gap-2 whitespace-nowrap border-0 text-sm font-normal shadow-none transition duration-200 ease-in-out",
+    "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring/60 focus-visible:ring-offset-1 focus-visible:ring-offset-background",
+    sizeClass,
+    radiusClass,
+    TIMBAL_V2_BORDER[variant],
+    TIMBAL_V2_SHADOW[variant],
+    fullWidth && "w-full",
+    isDisabled && "pointer-events-none opacity-50",
+    className
+  );
+  if (asChild) {
+    return /* @__PURE__ */ jsx(
+      Slot.Root,
+      {
+        ref,
+        "aria-disabled": isDisabled ? true : void 0,
+        "data-slot": "timbal-v2-button",
+        "data-variant": variant,
+        className: cn(
+          sharedRootClass,
+          TIMBAL_V2_FILL_AS_CHILD[variant],
+          !isIconOnly && TIMBAL_V2_SIZE_LABEL_PX[size],
+          TIMBAL_V2_LABEL_AS_CHILD[variant]
+        ),
+        ...props,
+        children: isLoading ? /* @__PURE__ */ jsx("span", { className: "size-4 animate-spin rounded-full border-2 border-current border-t-transparent" }) : children
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxs(
+    "button",
+    {
+      ref,
+      type,
+      disabled: isDisabled,
+      "data-slot": "timbal-v2-button",
+      "data-variant": variant,
+      className: cn(
+        "group/tbv2 flex-col items-stretch overflow-hidden bg-transparent p-0",
+        sharedRootClass
+      ),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx(
+          "span",
+          {
+            "aria-hidden": true,
+            className: cn(
+              "pointer-events-none absolute inset-0 transition duration-200 ease-in-out",
+              TIMBAL_V2_FILL[variant]
+            )
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "span",
+          {
+            className: cn(
+              "relative z-10 flex min-h-0 flex-1 items-center justify-center gap-1 leading-tight",
+              !isIconOnly && TIMBAL_V2_SIZE_LABEL_PX[size],
+              TIMBAL_V2_LABEL[variant]
+            ),
+            children: isLoading ? /* @__PURE__ */ jsx("span", { className: "size-4 animate-spin rounded-full border-2 border-current border-t-transparent" }) : children
+          }
+        )
+      ]
+    }
+  );
+});
+
+// src/ui/tooltip.tsx
+import { Tooltip as TooltipPrimitive } from "radix-ui";
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+function TooltipProvider({
+  delayDuration = 0,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx2(
+    TooltipPrimitive.Provider,
+    {
+      "data-slot": "tooltip-provider",
+      delayDuration,
+      ...props
+    }
+  );
+}
+function Tooltip({
+  ...props
+}) {
+  return /* @__PURE__ */ jsx2(TooltipPrimitive.Root, { "data-slot": "tooltip", ...props });
+}
+function TooltipTrigger({
+  ...props
+}) {
+  return /* @__PURE__ */ jsx2(TooltipPrimitive.Trigger, { "data-slot": "tooltip-trigger", ...props });
+}
+function TooltipContent({
+  className,
+  sideOffset = 0,
+  children,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx2(TooltipPrimitive.Portal, { children: /* @__PURE__ */ jsxs2(
+    TooltipPrimitive.Content,
+    {
+      "data-slot": "tooltip-content",
+      sideOffset,
+      className: cn(
+        "bg-foreground text-background animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-fit origin-(--radix-tooltip-content-transform-origin) rounded-md px-3 py-1.5 text-xs text-balance",
+        className
+      ),
+      ...props,
+      children: [
+        children,
+        /* @__PURE__ */ jsx2(TooltipPrimitive.Arrow, { className: "bg-foreground fill-foreground z-50 size-2.5 translate-y-[calc(-50%_-_2px)] rotate-45 rounded-[2px]" })
+      ]
+    }
+  ) });
+}
+
+// src/ui/dialog.tsx
+import { XIcon } from "lucide-react";
+import { Dialog as DialogPrimitive } from "radix-ui";
+import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
+function Dialog({
+  ...props
+}) {
+  return /* @__PURE__ */ jsx3(DialogPrimitive.Root, { "data-slot": "dialog", ...props });
+}
+function DialogTrigger({
+  ...props
+}) {
+  return /* @__PURE__ */ jsx3(DialogPrimitive.Trigger, { "data-slot": "dialog-trigger", ...props });
+}
+function DialogPortal({
+  ...props
+}) {
+  return /* @__PURE__ */ jsx3(DialogPrimitive.Portal, { "data-slot": "dialog-portal", ...props });
+}
+function DialogClose({
+  ...props
+}) {
+  return /* @__PURE__ */ jsx3(DialogPrimitive.Close, { "data-slot": "dialog-close", ...props });
+}
+function DialogOverlay({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx3(
+    DialogPrimitive.Overlay,
+    {
+      "data-slot": "dialog-overlay",
+      className: cn(
+        "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-[70] bg-black/50",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function DialogContent({
+  className,
+  children,
+  showCloseButton = true,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxs3(DialogPortal, { "data-slot": "dialog-portal", children: [
+    /* @__PURE__ */ jsx3(DialogOverlay, {}),
+    /* @__PURE__ */ jsxs3(
+      DialogPrimitive.Content,
+      {
+        "data-slot": "dialog-content",
+        className: cn(
+          TIMBAL_V2_MODAL_SURFACE,
+          "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 fixed top-[50%] left-[50%] z-[70] grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] gap-4 rounded-xl p-6 duration-200 outline-none sm:max-w-lg",
+          className
+        ),
+        ...props,
+        children: [
+          children,
+          showCloseButton && /* @__PURE__ */ jsxs3(
+            DialogPrimitive.Close,
+            {
+              "data-slot": "dialog-close",
+              className: "ring-offset-background focus:ring-ring data-[state=open]:text-muted-foreground absolute top-4 right-4 rounded-xs opacity-70 transition-[opacity,background-color] hover:bg-ghost-fill-hover hover:opacity-100 focus:ring-2 focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+              children: [
+                /* @__PURE__ */ jsx3(XIcon, {}),
+                /* @__PURE__ */ jsx3("span", { className: "sr-only", children: "Close" })
+              ]
+            }
+          )
+        ]
+      }
+    )
+  ] });
+}
+function DialogTitle({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx3(
+    DialogPrimitive.Title,
+    {
+      "data-slot": "dialog-title",
+      className: cn("text-lg leading-none font-semibold", className),
+      ...props
+    }
+  );
+}
+
+// src/ui/avatar.tsx
+import { Avatar as AvatarPrimitive } from "radix-ui";
+import { jsx as jsx4 } from "react/jsx-runtime";
+function Avatar({
+  className,
+  size = "default",
+  ...props
+}) {
+  return /* @__PURE__ */ jsx4(
+    AvatarPrimitive.Root,
+    {
+      "data-slot": "avatar",
+      "data-size": size,
+      className: cn(
+        "group/avatar relative flex size-8 shrink-0 overflow-hidden rounded-full select-none data-[size=lg]:size-10 data-[size=sm]:size-6",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function AvatarImage({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx4(
+    AvatarPrimitive.Image,
+    {
+      "data-slot": "avatar-image",
+      className: cn("aspect-square size-full", className),
+      ...props
+    }
+  );
+}
+function AvatarFallback({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx4(
+    AvatarPrimitive.Fallback,
+    {
+      "data-slot": "avatar-fallback",
+      className: cn(
+        "bg-muted text-muted-foreground flex size-full items-center justify-center rounded-full text-sm group-data-[size=sm]/avatar:text-xs",
+        className
+      ),
+      ...props
+    }
+  );
+}
+
+// src/ui/button.tsx
+import { cva } from "class-variance-authority";
+import { jsx as jsx5 } from "react/jsx-runtime";
+var LEGACY_SIZE_TO_V2 = {
+  default: "md",
+  xs: "xs",
+  sm: "sm",
+  lg: "lg",
+  icon: "sm",
+  "icon-xs": "xs",
+  "icon-sm": "sm",
+  "icon-lg": "lg"
+};
+var buttonVariants = cva(
+  "inline-flex items-center justify-center gap-2 whitespace-nowrap text-sm font-medium disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0",
+  {
+    variants: {
+      variant: {
+        default: "",
+        destructive: "",
+        outline: "",
+        secondary: "",
+        ghost: "",
+        link: ""
+      },
+      size: {
+        default: "",
+        xs: "",
+        sm: "",
+        lg: "",
+        icon: "",
+        "icon-xs": "",
+        "icon-sm": "",
+        "icon-lg": ""
+      }
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default"
+    }
+  }
+);
+function Button({
+  className,
+  variant = "default",
+  size = "default",
+  asChild = false,
+  ...props
+}) {
+  const v2Variant = TIMBAL_V2_FROM_LEGACY_BUTTON[variant ?? "default"];
+  const v2Size = LEGACY_SIZE_TO_V2[size ?? "default"];
+  const isIconOnly = typeof size === "string" && size.startsWith("icon");
+  return /* @__PURE__ */ jsx5(
+    TimbalV2Button,
+    {
+      "data-slot": "button",
+      "data-variant": variant,
+      "data-size": size,
+      variant: v2Variant,
+      size: v2Size,
+      shape: "rect",
+      isIconOnly,
+      asChild,
+      className: cn(buttonVariants({ variant, size, className })),
+      ...props
+    }
+  );
+}
+
+// src/ui/shimmer.tsx
+import { motion } from "motion/react";
+import {
+  memo,
+  useMemo
+} from "react";
+import { jsx as jsx6 } from "react/jsx-runtime";
+var ShimmerComponent = ({
+  children,
+  as: Component = "p",
+  className,
+  duration = 2,
+  spread = 2
+}) => {
+  const MotionComponent = motion.create(
+    Component
+  );
+  const dynamicSpread = useMemo(
+    () => (children?.length ?? 0) * spread,
+    [children, spread]
+  );
+  return /* @__PURE__ */ jsx6(
+    MotionComponent,
+    {
+      animate: { backgroundPosition: "0% center" },
+      className: cn(
+        "relative inline-block bg-[length:250%_100%,auto] bg-clip-text text-transparent",
+        "[--bg:linear-gradient(90deg,#0000_calc(50%-var(--spread)),var(--color-background),#0000_calc(50%+var(--spread)))] [background-repeat:no-repeat,padding-box]",
+        className
+      ),
+      initial: { backgroundPosition: "100% center" },
+      style: {
+        "--spread": `${dynamicSpread}px`,
+        backgroundImage: "var(--bg), linear-gradient(var(--color-muted-foreground), var(--color-muted-foreground))"
+      },
+      transition: {
+        repeat: Number.POSITIVE_INFINITY,
+        duration,
+        ease: "linear"
+      },
+      children
+    }
+  );
+};
+var Shimmer = memo(ShimmerComponent);
+
+export {
+  cn,
+  TIMBAL_V2_ELEVATED_GRADIENT,
+  TIMBAL_V2_SWITCH_TRACK_OFF,
+  TIMBAL_V2_SWITCH_THUMB,
+  TIMBAL_V2_SECONDARY_CHROME,
+  TimbalV2Button,
+  TooltipProvider,
+  Tooltip,
+  TooltipTrigger,
+  TooltipContent,
+  Dialog,
+  DialogTrigger,
+  DialogPortal,
+  DialogClose,
+  DialogOverlay,
+  DialogContent,
+  DialogTitle,
+  Avatar,
+  AvatarImage,
+  AvatarFallback,
+  Button,
+  Shimmer
+};