@signalflare-ai/ui 1.2.0 → 1.4.0

package/dist/{ai-response-CvjV3WhV.js.map → ai-response-hbVCZJmo.js.map}

@@ -1 +1 @@
-{"version":3,"file":"ai-response-CvjV3WhV.js","names":[],"sources":["../src/components/ai-response/ai-response.tsx"],"sourcesContent":["\"use client\";\n\nimport { code } from \"@streamdown/code\";\nimport { memo } from \"react\";\nimport { Streamdown, type StreamdownProps } from \"streamdown\";\n\nimport { cn } from \"../../utils/cn\";\n\n// ─── Variants ────────────────────────────────────────────────────────────────\n\nexport const SF_AI_RESPONSE_VARIANTS = {} as const;\nexport const SF_AI_RESPONSE_DEFAULT_VARIANTS = {} as const;\n\n// ─── Component ───────────────────────────────────────────────────────────────\n\nconst plugins = { code };\n\nexport type AiResponseProps = StreamdownProps & {\n  /** Additional CSS classes. */\n  className?: string;\n  /**\n   * For streaming: reserve height based on the full (target) text to prevent\n   * layout shift as content streams in. Pass the complete expected text here\n   * while streaming; the actual displayed children can be the partial stream.\n   */\n  reserveHeightFor?: string;\n};\n\n/**\n * Renders AI-generated markdown using Streamdown.\n * Supports streaming animation, syntax-highlighted code, tables, and more.\n *\n * Pass `isAnimating={true}` while streaming and `false` once complete to get\n * character-by-character reveal animation.\n *\n * @example\n * ```tsx\n * // Static\n * <AiResponse>{\"# Hello\\n\\nThis is **bold** and _italic_.\"}</AiResponse>\n *\n * // Streaming\n * <AiResponse isAnimating={isStreaming}>{streamedText}</AiResponse>\n *\n * // Streaming with height reserve (prevents layout shift)\n * <AiResponse isAnimating={isStreaming} reserveHeightFor={fullTargetText}>\n *   {streamedText}\n * </AiResponse>\n * ```\n */\nexport const AiResponse = memo(\n  ({ className, children, reserveHeightFor: _reserveHeightFor, ...props }: AiResponseProps) => {\n    return (\n      <Streamdown\n        className={cn(\n          \"w-full text-sf-default text-sm\",\n          \"[&>*:first-child]:mt-0 [&>*:last-child]:mb-0\",\n          // Bridge shadcn tokens used by @streamdown/code to sf tokens so\n          // code blocks render with visible borders/backgrounds/text.\n          \"[--border:var(--color-sf-line)] [--sidebar:var(--color-sf-elevated)]\",\n          \"[--background:var(--color-sf-recessed)] [--foreground:var(--text-color-sf-default)]\",\n          \"[--muted-foreground:var(--text-color-sf-subtle)]\",\n          className\n        )}\n        plugins={plugins}\n        {...props}\n      >\n        {children}\n      </Streamdown>\n    );\n  },\n  (prev, next) =>\n    prev.children === next.children &&\n    prev.isAnimating === next.isAnimating &&\n    prev.reserveHeightFor === next.reserveHeightFor\n);\n\nAiResponse.displayName = \"AiResponse\";\n"],"mappings":";;;;;;;AAUA,IAAa,0BAA0B,EAAE;AACzC,IAAa,kCAAkC,EAAE;AAIjD,IAAM,UAAU,EAAE,MAAM;;;;;;;;;;;;;;;;;;;;;;AAkCxB,IAAa,aAAa,MACvB,EAAE,WAAW,UAAU,kBAAkB,mBAAmB,GAAG,YAA6B;AAC3F,QACE,oBAAC,YAAD;EACE,WAAW,GACT,kCACA,gDAGA,wEACA,uFACA,oDACA,UACD;EACQ;EACT,GAAI;EAEH;EACU,CAAA;IAGhB,MAAM,SACL,KAAK,aAAa,KAAK,YACvB,KAAK,gBAAgB,KAAK,eAC1B,KAAK,qBAAqB,KAAK,iBAClC;AAED,WAAW,cAAc"}
+{"version":3,"file":"ai-response-hbVCZJmo.js","names":[],"sources":["../src/components/ai-response/ai-response.tsx"],"sourcesContent":["\"use client\";\n\nimport { code } from \"@streamdown/code\";\nimport { memo } from \"react\";\nimport { Streamdown, type StreamdownProps } from \"streamdown\";\n\nimport { cn } from \"../../utils/cn\";\n\n// ─── Variants ────────────────────────────────────────────────────────────────\n\nexport const SF_AI_RESPONSE_VARIANTS = {} as const;\nexport const SF_AI_RESPONSE_DEFAULT_VARIANTS = {} as const;\n\n// ─── Component ───────────────────────────────────────────────────────────────\n\nconst plugins = { code };\n\nexport type AiResponseProps = StreamdownProps & {\n  /** Additional CSS classes. */\n  className?: string;\n  /**\n   * For streaming: reserve height based on the full (target) text to prevent\n   * layout shift as content streams in. Pass the complete expected text here\n   * while streaming; the actual displayed children can be the partial stream.\n   */\n  reserveHeightFor?: string;\n};\n\n/**\n * Renders AI-generated markdown using Streamdown.\n * Supports streaming animation, syntax-highlighted code, tables, and more.\n *\n * Pass `isAnimating={true}` while streaming and `false` once complete to get\n * character-by-character reveal animation.\n *\n * @example\n * ```tsx\n * // Static\n * <AiResponse>{\"# Hello\\n\\nThis is **bold** and _italic_.\"}</AiResponse>\n *\n * // Streaming\n * <AiResponse isAnimating={isStreaming}>{streamedText}</AiResponse>\n *\n * // Streaming with height reserve (prevents layout shift)\n * <AiResponse isAnimating={isStreaming} reserveHeightFor={fullTargetText}>\n *   {streamedText}\n * </AiResponse>\n * ```\n */\nexport const AiResponse = memo(\n  ({\n    className,\n    children,\n    reserveHeightFor: _reserveHeightFor,\n    ...props\n  }: AiResponseProps) => {\n    return (\n      <Streamdown\n        className={cn(\n          \"w-full text-sf-default text-sm\",\n          \"[&>*:first-child]:mt-0 [&>*:last-child]:mb-0\",\n          // Bridge shadcn tokens used by @streamdown/code to sf tokens so\n          // code blocks render with visible borders/backgrounds/text.\n          \"[--border:var(--color-sf-line)] [--sidebar:var(--color-sf-elevated)]\",\n          \"[--background:var(--color-sf-recessed)] [--foreground:var(--text-color-sf-default)]\",\n          \"[--muted-foreground:var(--text-color-sf-subtle)]\",\n          className\n        )}\n        plugins={plugins}\n        {...props}\n      >\n        {children}\n      </Streamdown>\n    );\n  },\n  (prev, next) =>\n    prev.children === next.children &&\n    prev.isAnimating === next.isAnimating &&\n    prev.reserveHeightFor === next.reserveHeightFor\n);\n\nAiResponse.displayName = \"AiResponse\";\n"],"mappings":";;;;;;;AAUA,IAAa,0BAA0B,CAAC;AACxC,IAAa,kCAAkC,CAAC;AAIhD,IAAM,UAAU,EAAE,KAAK;;;;;;;;;;;;;;;;;;;;;;AAkCvB,IAAa,aAAa,MACvB,EACC,WACA,UACA,kBAAkB,mBAClB,GAAG,YACkB;CACrB,OACE,oBAAC,YAAD;EACE,WAAW,GACT,kCACA,gDAGA,wEACA,uFACA,oDACA,SACF;EACS;EACT,GAAI;EAEH;CACS,CAAA;AAEhB,IACC,MAAM,SACL,KAAK,aAAa,KAAK,YACvB,KAAK,gBAAgB,KAAK,eAC1B,KAAK,qBAAqB,KAAK,gBACnC;AAEA,WAAW,cAAc"}

package/dist/{ai-shimmer-j6lKIrjj.js → ai-shimmer-BamNMNK3.js}

@@ -1,5 +1,5 @@
 "use client";
-import { t as cn } from "./cn-YROP2_ox.js";
+import { t as cn } from "./cn-CmAOpn49.js";
 import { memo, useMemo } from "react";
 import { jsx } from "react/jsx-runtime";
 import { motion } from "motion/react";
@@ -40,4 +40,4 @@ AiShimmer.displayName = "AiShimmer";
 //#endregion
 export { SF_AI_SHIMMER_DEFAULT_VARIANTS as n, SF_AI_SHIMMER_VARIANTS as r, AiShimmer as t };
 
-//# sourceMappingURL=ai-shimmer-j6lKIrjj.js.map
+//# sourceMappingURL=ai-shimmer-BamNMNK3.js.map

package/dist/{ai-shimmer-j6lKIrjj.js.map → ai-shimmer-BamNMNK3.js.map}

@@ -1 +1 @@
-{"version":3,"file":"ai-shimmer-j6lKIrjj.js","names":[],"sources":["../src/components/ai-shimmer/ai-shimmer.tsx"],"sourcesContent":["\"use client\";\n\nimport { motion } from \"motion/react\";\nimport {\n  type CSSProperties,\n  type ElementType,\n  type JSX,\n  memo,\n  useMemo,\n} from \"react\";\n\nimport { cn } from \"../../utils/cn\";\n\n// ─── Variants ────────────────────────────────────────────────────────────────\n\nexport const SF_AI_SHIMMER_VARIANTS = {} as const;\nexport const SF_AI_SHIMMER_DEFAULT_VARIANTS = {} as const;\n\n// ─── Component ───────────────────────────────────────────────────────────────\n\nexport interface AiShimmerProps {\n  /** Text content to animate. */\n  children: string;\n  /** HTML element or component to render as. @default \"p\" */\n  as?: ElementType;\n  /** Additional CSS classes merged via `cn()`. */\n  className?: string;\n  /** Animation duration in seconds. @default 2 */\n  duration?: number;\n  /** Shimmer width multiplier relative to text length. @default 2 */\n  spread?: number;\n}\n\n/**\n * Animated text shimmer effect for AI streaming states.\n * Renders a sweep of light across the text to indicate activity.\n *\n * @example\n * ```tsx\n * <AiShimmer>Thinking...</AiShimmer>\n * <AiShimmer as=\"span\" duration={1.5}>Generating response</AiShimmer>\n * ```\n */\nfunction AiShimmerBase({\n  children,\n  as: Component = \"p\",\n  className,\n  duration = 2,\n  spread = 2,\n}: AiShimmerProps) {\n  const MotionComponent = motion.create(\n    Component as keyof JSX.IntrinsicElements\n  );\n  const dynamicSpread = useMemo(\n    () => (children?.length ?? 0) * spread,\n    [children, spread]\n  );\n\n  return (\n    <MotionComponent\n      animate={{ backgroundPosition: \"0% center\" }}\n      className={cn(\n        \"relative inline-block bg-[length:250%_100%,auto] bg-clip-text text-transparent\",\n        \"[--bg:linear-gradient(90deg,#0000_calc(50%-var(--spread)),var(--color-sf-base),#0000_calc(50%+var(--spread)))] [background-repeat:no-repeat,padding-box]\",\n        className\n      )}\n      initial={{ backgroundPosition: \"100% center\" }}\n      style={\n        {\n          \"--spread\": `${dynamicSpread}px`,\n          backgroundImage:\n            \"var(--bg), linear-gradient(var(--color-sf-subtle), var(--color-sf-subtle))\",\n        } as CSSProperties\n      }\n      transition={{\n        repeat: Number.POSITIVE_INFINITY,\n        duration,\n        ease: \"linear\",\n      }}\n    >\n      {children}\n    </MotionComponent>\n  );\n}\n\nexport const AiShimmer = memo(AiShimmerBase);\nAiShimmer.displayName = \"AiShimmer\";\n"],"mappings":";;;;;;AAeA,IAAa,yBAAyB,EAAE;AACxC,IAAa,iCAAiC,EAAE;;;;;;;;;;;AA2BhD,SAAS,cAAc,EACrB,UACA,IAAI,YAAY,KAChB,WACA,WAAW,GACX,SAAS,KACQ;CACjB,MAAM,kBAAkB,OAAO,OAC7B,UACD;CACD,MAAM,gBAAgB,eACb,UAAU,UAAU,KAAK,QAChC,CAAC,UAAU,OAAO,CACnB;AAED,QACE,oBAAC,iBAAD;EACE,SAAS,EAAE,oBAAoB,aAAa;EAC5C,WAAW,GACT,kFACA,4JACA,UACD;EACD,SAAS,EAAE,oBAAoB,eAAe;EAC9C,OACE;GACE,YAAY,GAAG,cAAc;GAC7B,iBACE;GACH;EAEH,YAAY;GACV,QAAQ,OAAO;GACf;GACA,MAAM;GACP;EAEA;EACe,CAAA;;AAItB,IAAa,YAAY,KAAK,cAAc;AAC5C,UAAU,cAAc"}
+{"version":3,"file":"ai-shimmer-BamNMNK3.js","names":[],"sources":["../src/components/ai-shimmer/ai-shimmer.tsx"],"sourcesContent":["\"use client\";\n\nimport { motion } from \"motion/react\";\nimport {\n  type CSSProperties,\n  type ElementType,\n  type JSX,\n  memo,\n  useMemo,\n} from \"react\";\n\nimport { cn } from \"../../utils/cn\";\n\n// ─── Variants ────────────────────────────────────────────────────────────────\n\nexport const SF_AI_SHIMMER_VARIANTS = {} as const;\nexport const SF_AI_SHIMMER_DEFAULT_VARIANTS = {} as const;\n\n// ─── Component ───────────────────────────────────────────────────────────────\n\nexport interface AiShimmerProps {\n  /** Text content to animate. */\n  children: string;\n  /** HTML element or component to render as. @default \"p\" */\n  as?: ElementType;\n  /** Additional CSS classes merged via `cn()`. */\n  className?: string;\n  /** Animation duration in seconds. @default 2 */\n  duration?: number;\n  /** Shimmer width multiplier relative to text length. @default 2 */\n  spread?: number;\n}\n\n/**\n * Animated text shimmer effect for AI streaming states.\n * Renders a sweep of light across the text to indicate activity.\n *\n * @example\n * ```tsx\n * <AiShimmer>Thinking...</AiShimmer>\n * <AiShimmer as=\"span\" duration={1.5}>Generating response</AiShimmer>\n * ```\n */\nfunction AiShimmerBase({\n  children,\n  as: Component = \"p\",\n  className,\n  duration = 2,\n  spread = 2,\n}: AiShimmerProps) {\n  const MotionComponent = motion.create(\n    Component as keyof JSX.IntrinsicElements\n  );\n  const dynamicSpread = useMemo(\n    () => (children?.length ?? 0) * spread,\n    [children, spread]\n  );\n\n  return (\n    <MotionComponent\n      animate={{ backgroundPosition: \"0% center\" }}\n      className={cn(\n        \"relative inline-block bg-[length:250%_100%,auto] bg-clip-text text-transparent\",\n        \"[--bg:linear-gradient(90deg,#0000_calc(50%-var(--spread)),var(--color-sf-base),#0000_calc(50%+var(--spread)))] [background-repeat:no-repeat,padding-box]\",\n        className\n      )}\n      initial={{ backgroundPosition: \"100% center\" }}\n      style={\n        {\n          \"--spread\": `${dynamicSpread}px`,\n          backgroundImage:\n            \"var(--bg), linear-gradient(var(--color-sf-subtle), var(--color-sf-subtle))\",\n        } as CSSProperties\n      }\n      transition={{\n        repeat: Number.POSITIVE_INFINITY,\n        duration,\n        ease: \"linear\",\n      }}\n    >\n      {children}\n    </MotionComponent>\n  );\n}\n\nexport const AiShimmer = memo(AiShimmerBase);\nAiShimmer.displayName = \"AiShimmer\";\n"],"mappings":";;;;;;AAeA,IAAa,yBAAyB,CAAC;AACvC,IAAa,iCAAiC,CAAC;;;;;;;;;;;AA2B/C,SAAS,cAAc,EACrB,UACA,IAAI,YAAY,KAChB,WACA,WAAW,GACX,SAAS,KACQ;CACjB,MAAM,kBAAkB,OAAO,OAC7B,SACF;CACA,MAAM,gBAAgB,eACb,UAAU,UAAU,KAAK,QAChC,CAAC,UAAU,MAAM,CACnB;CAEA,OACE,oBAAC,iBAAD;EACE,SAAS,EAAE,oBAAoB,YAAY;EAC3C,WAAW,GACT,kFACA,4JACA,SACF;EACA,SAAS,EAAE,oBAAoB,cAAc;EAC7C,OACE;GACE,YAAY,GAAG,cAAc;GAC7B,iBACE;EACJ;EAEF,YAAY;GACV,QAAQ,OAAO;GACf;GACA,MAAM;EACR;EAEC;CACc,CAAA;AAErB;AAEA,IAAa,YAAY,KAAK,aAAa;AAC3C,UAAU,cAAc"}

package/dist/{ai-status-badge-CSU_QOdz.js → ai-status-badge-BZLczdkI.js}

@@ -1,5 +1,5 @@
 "use client";
-import { t as cn } from "./cn-YROP2_ox.js";
+import { t as cn } from "./cn-CmAOpn49.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { CheckIcon, SpinnerGapIcon, XIcon } from "@phosphor-icons/react";
 //#region src/components/ai-status-badge/ai-status-badge.tsx
@@ -60,4 +60,4 @@ function AiStatusBadge({ icon: Icon, label, status = "idle", info, className, ..
 //#endregion
 export { SF_AI_STATUS_BADGE_DEFAULT_VARIANTS as n, SF_AI_STATUS_BADGE_VARIANTS as r, AiStatusBadge as t };
 
-//# sourceMappingURL=ai-status-badge-CSU_QOdz.js.map
+//# sourceMappingURL=ai-status-badge-BZLczdkI.js.map

package/dist/{ai-status-badge-CSU_QOdz.js.map → ai-status-badge-BZLczdkI.js.map}

@@ -1 +1 @@
-{"version":3,"file":"ai-status-badge-CSU_QOdz.js","names":[],"sources":["../src/components/ai-status-badge/ai-status-badge.tsx"],"sourcesContent":["\"use client\";\n\nimport { CheckIcon, SpinnerGapIcon, XIcon } from \"@phosphor-icons/react\";\nimport type { ComponentProps, ElementType } from \"react\";\n\nimport { cn } from \"../../utils/cn\";\n\n// ─── Variants ────────────────────────────────────────────────────────────────\n\nexport const SF_AI_STATUS_BADGE_VARIANTS = {\n  status: {\n    idle: {\n      classes: \"\",\n      description: \"Default idle state — no status icon shown\",\n    },\n    running: {\n      classes: \"\",\n      description: \"Actively running — spinner icon shown\",\n    },\n    success: {\n      classes: \"\",\n      description: \"Completed successfully — check icon shown\",\n    },\n    error: {\n      classes: \"\",\n      description: \"Failed with an error — X icon shown\",\n    },\n  },\n} as const;\n\nexport const SF_AI_STATUS_BADGE_DEFAULT_VARIANTS = {\n  status: \"idle\",\n} as const;\n\n// ─── Types ───────────────────────────────────────────────────────────────────\n\nexport type AiStatusBadgeStatus =\n  keyof typeof SF_AI_STATUS_BADGE_VARIANTS.status;\n\nexport type AiStatusBadgeProps = ComponentProps<\"div\"> & {\n  /** Icon component rendered on the left. */\n  icon?: ElementType;\n  /** Label text displayed in the badge. */\n  label: string;\n  /** Current status — determines the status icon on the right. @default \"idle\" */\n  status?: AiStatusBadgeStatus;\n  /** Additional info text (e.g. \"2/3\") shown after the label. */\n  info?: string;\n};\n\n// ─── Helpers ─────────────────────────────────────────────────────────────────\n\nfunction StatusIcon({ status }: { status: AiStatusBadgeStatus }) {\n  switch (status) {\n    case \"running\":\n      return <SpinnerGapIcon className=\"size-3 animate-spin text-sf-brand\" />;\n    case \"success\":\n      return <CheckIcon className=\"size-3 text-sf-success\" />;\n    case \"error\":\n      return <XIcon className=\"size-3 text-sf-danger\" />;\n    default:\n      return null;\n  }\n}\n\n// ─── AiStatusBadge ───────────────────────────────────────────────────────────\n\n/**\n * Compact pill-shaped badge showing an icon, label, and a status indicator.\n * Used by minimal variants of AiToolCall and AiReasoning.\n *\n * @example\n * ```tsx\n * <AiStatusBadge icon={MagnifyingGlassIcon} label=\"web_search\" status=\"running\" />\n * ```\n */\nexport function AiStatusBadge({\n  icon: Icon,\n  label,\n  status = \"idle\",\n  info,\n  className,\n  ...props\n}: AiStatusBadgeProps) {\n  return (\n    <div\n      className={cn(\n        \"mx-2 inline-flex cursor-default items-center gap-1.5 rounded-full bg-sf-tint/50 px-2 py-0.5 text-xs\",\n        \"animate-in fade-in-0 slide-in-from-bottom-1 duration-200\",\n        className\n      )}\n      {...props}\n    >\n      {Icon ? <Icon className=\"size-3 text-sf-subtle\" /> : null}\n      <span className=\"text-sf-subtle\">{label}</span>\n      {info ? <span className=\"text-sf-subtle/60\">{info}</span> : null}\n      <StatusIcon status={status} />\n    </div>\n  );\n}\n"],"mappings":";;;;;AASA,IAAa,8BAA8B,EACzC,QAAQ;CACN,MAAM;EACJ,SAAS;EACT,aAAa;EACd;CACD,SAAS;EACP,SAAS;EACT,aAAa;EACd;CACD,SAAS;EACP,SAAS;EACT,aAAa;EACd;CACD,OAAO;EACL,SAAS;EACT,aAAa;EACd;CACF,EACF;AAED,IAAa,sCAAsC,EACjD,QAAQ,QACT;AAoBD,SAAS,WAAW,EAAE,UAA2C;AAC/D,SAAQ,QAAR;EACE,KAAK,UACH,QAAO,oBAAC,gBAAD,EAAgB,WAAU,qCAAsC,CAAA;EACzE,KAAK,UACH,QAAO,oBAAC,WAAD,EAAW,WAAU,0BAA2B,CAAA;EACzD,KAAK,QACH,QAAO,oBAAC,OAAD,EAAO,WAAU,yBAA0B,CAAA;EACpD,QACE,QAAO;;;;;;;;;;;;AAeb,SAAgB,cAAc,EAC5B,MAAM,MACN,OACA,SAAS,QACT,MACA,WACA,GAAG,SACkB;AACrB,QACE,qBAAC,OAAD;EACE,WAAW,GACT,uGACA,4DACA,UACD;EACD,GAAI;YANN;GAQG,OAAO,oBAAC,MAAD,EAAM,WAAU,yBAA0B,CAAA,GAAG;GACrD,oBAAC,QAAD;IAAM,WAAU;cAAkB;IAAa,CAAA;GAC9C,OAAO,oBAAC,QAAD;IAAM,WAAU;cAAqB;IAAY,CAAA,GAAG;GAC5D,oBAAC,YAAD,EAAoB,QAAU,CAAA;GAC1B"}
+{"version":3,"file":"ai-status-badge-BZLczdkI.js","names":[],"sources":["../src/components/ai-status-badge/ai-status-badge.tsx"],"sourcesContent":["\"use client\";\n\nimport { CheckIcon, SpinnerGapIcon, XIcon } from \"@phosphor-icons/react\";\nimport type { ComponentProps, ElementType } from \"react\";\n\nimport { cn } from \"../../utils/cn\";\n\n// ─── Variants ────────────────────────────────────────────────────────────────\n\nexport const SF_AI_STATUS_BADGE_VARIANTS = {\n  status: {\n    idle: {\n      classes: \"\",\n      description: \"Default idle state — no status icon shown\",\n    },\n    running: {\n      classes: \"\",\n      description: \"Actively running — spinner icon shown\",\n    },\n    success: {\n      classes: \"\",\n      description: \"Completed successfully — check icon shown\",\n    },\n    error: {\n      classes: \"\",\n      description: \"Failed with an error — X icon shown\",\n    },\n  },\n} as const;\n\nexport const SF_AI_STATUS_BADGE_DEFAULT_VARIANTS = {\n  status: \"idle\",\n} as const;\n\n// ─── Types ───────────────────────────────────────────────────────────────────\n\nexport type AiStatusBadgeStatus =\n  keyof typeof SF_AI_STATUS_BADGE_VARIANTS.status;\n\nexport type AiStatusBadgeProps = ComponentProps<\"div\"> & {\n  /** Icon component rendered on the left. */\n  icon?: ElementType;\n  /** Label text displayed in the badge. */\n  label: string;\n  /** Current status — determines the status icon on the right. @default \"idle\" */\n  status?: AiStatusBadgeStatus;\n  /** Additional info text (e.g. \"2/3\") shown after the label. */\n  info?: string;\n};\n\n// ─── Helpers ─────────────────────────────────────────────────────────────────\n\nfunction StatusIcon({ status }: { status: AiStatusBadgeStatus }) {\n  switch (status) {\n    case \"running\":\n      return <SpinnerGapIcon className=\"size-3 animate-spin text-sf-brand\" />;\n    case \"success\":\n      return <CheckIcon className=\"size-3 text-sf-success\" />;\n    case \"error\":\n      return <XIcon className=\"size-3 text-sf-danger\" />;\n    default:\n      return null;\n  }\n}\n\n// ─── AiStatusBadge ───────────────────────────────────────────────────────────\n\n/**\n * Compact pill-shaped badge showing an icon, label, and a status indicator.\n * Used by minimal variants of AiToolCall and AiReasoning.\n *\n * @example\n * ```tsx\n * <AiStatusBadge icon={MagnifyingGlassIcon} label=\"web_search\" status=\"running\" />\n * ```\n */\nexport function AiStatusBadge({\n  icon: Icon,\n  label,\n  status = \"idle\",\n  info,\n  className,\n  ...props\n}: AiStatusBadgeProps) {\n  return (\n    <div\n      className={cn(\n        \"mx-2 inline-flex cursor-default items-center gap-1.5 rounded-full bg-sf-tint/50 px-2 py-0.5 text-xs\",\n        \"animate-in fade-in-0 slide-in-from-bottom-1 duration-200\",\n        className\n      )}\n      {...props}\n    >\n      {Icon ? <Icon className=\"size-3 text-sf-subtle\" /> : null}\n      <span className=\"text-sf-subtle\">{label}</span>\n      {info ? <span className=\"text-sf-subtle/60\">{info}</span> : null}\n      <StatusIcon status={status} />\n    </div>\n  );\n}\n"],"mappings":";;;;;AASA,IAAa,8BAA8B,EACzC,QAAQ;CACN,MAAM;EACJ,SAAS;EACT,aAAa;CACf;CACA,SAAS;EACP,SAAS;EACT,aAAa;CACf;CACA,SAAS;EACP,SAAS;EACT,aAAa;CACf;CACA,OAAO;EACL,SAAS;EACT,aAAa;CACf;AACF,EACF;AAEA,IAAa,sCAAsC,EACjD,QAAQ,OACV;AAoBA,SAAS,WAAW,EAAE,UAA2C;CAC/D,QAAQ,QAAR;EACE,KAAK,WACH,OAAO,oBAAC,gBAAD,EAAgB,WAAU,oCAAqC,CAAA;EACxE,KAAK,WACH,OAAO,oBAAC,WAAD,EAAW,WAAU,yBAA0B,CAAA;EACxD,KAAK,SACH,OAAO,oBAAC,OAAD,EAAO,WAAU,wBAAyB,CAAA;EACnD,SACE,OAAO;CACX;AACF;;;;;;;;;;AAaA,SAAgB,cAAc,EAC5B,MAAM,MACN,OACA,SAAS,QACT,MACA,WACA,GAAG,SACkB;CACrB,OACE,qBAAC,OAAD;EACE,WAAW,GACT,uGACA,4DACA,SACF;EACA,GAAI;YANN;GAQG,OAAO,oBAAC,MAAD,EAAM,WAAU,wBAAyB,CAAA,IAAI;GACrD,oBAAC,QAAD;IAAM,WAAU;cAAkB;GAAY,CAAA;GAC7C,OAAO,oBAAC,QAAD;IAAM,WAAU;cAAqB;GAAW,CAAA,IAAI;GAC5D,oBAAC,YAAD,EAAoB,OAAS,CAAA;EAC1B;;AAET"}

package/dist/{ai-streaming-text-IWW1BhvZ.js → ai-streaming-text-DgYu64UH.js}

@@ -106,4 +106,4 @@ function useAiStreamingTextWithMeta(text, options = {}) {
 //#endregion
 export { useAiStreamingTextWithMeta as i, SF_AI_STREAMING_TEXT_VARIANTS as n, useAiStreamingText as r, SF_AI_STREAMING_TEXT_DEFAULT_VARIANTS as t };
 
-//# sourceMappingURL=ai-streaming-text-IWW1BhvZ.js.map
+//# sourceMappingURL=ai-streaming-text-DgYu64UH.js.map

package/dist/{ai-streaming-text-IWW1BhvZ.js.map → ai-streaming-text-DgYu64UH.js.map}

@@ -1 +1 @@
-{"version":3,"file":"ai-streaming-text-IWW1BhvZ.js","names":[],"sources":["../src/components/ai-streaming-text/ai-streaming-text.tsx"],"sourcesContent":["\"use client\";\n\nimport { useEffect, useRef, useState } from \"react\";\n\n// ─── Variants ────────────────────────────────────────────────────────────────\n\nexport const SF_AI_STREAMING_TEXT_VARIANTS = {} as const;\nexport const SF_AI_STREAMING_TEXT_DEFAULT_VARIANTS = {} as const;\n\n// ─── Types ────────────────────────────────────────────────────────────────────\n\nexport interface UseAiStreamingTextOptions {\n  /** Whether content is actively streaming. @default false */\n  isStreaming?: boolean;\n  /** Characters to release per animation frame tick. @default 10 */\n  charsPerTick?: number;\n  /** Milliseconds between releases (~16ms = 60fps). @default 16 */\n  tickInterval?: number;\n  /** Immediately flush all text when streaming stops. @default true */\n  flushOnStop?: boolean;\n}\n\nexport interface UseAiStreamingTextMeta {\n  /** The display-ready substring for character-by-character reveal. */\n  displayText: string;\n  /** The full target text (useful for reserve height calculations). */\n  targetText: string;\n  /** Whether streaming is currently active. */\n  isStreaming: boolean;\n}\n\n// ─── Internal core hook ──────────────────────────────────────────────────────\n\nfunction useStreamingTextCore(\n  text: string,\n  options: UseAiStreamingTextOptions\n): string {\n  const {\n    isStreaming = false,\n    charsPerTick = 10,\n    tickInterval = 16,\n    flushOnStop = true,\n  } = options;\n\n  const [displayText, setDisplayText] = useState(text);\n  const targetRef = useRef(text);\n  const posRef = useRef(text.length);\n  const rafRef = useRef<number | null>(null);\n  const lastTickRef = useRef(0);\n\n  useEffect(() => {\n    targetRef.current = text;\n  }, [text]);\n\n  useEffect(() => {\n    if (!isStreaming) {\n      if (flushOnStop) {\n        setDisplayText(text);\n        posRef.current = text.length;\n      }\n      return;\n    }\n\n    const animate = (timestamp: number) => {\n      const target = targetRef.current;\n      const pos = posRef.current;\n\n      if (pos >= target.length) {\n        rafRef.current = requestAnimationFrame(animate);\n        return;\n      }\n\n      if (timestamp - lastTickRef.current < tickInterval) {\n        rafRef.current = requestAnimationFrame(animate);\n        return;\n      }\n      lastTickRef.current = timestamp;\n\n      const newPos = Math.min(pos + charsPerTick, target.length);\n      posRef.current = newPos;\n      setDisplayText(target.slice(0, newPos));\n      rafRef.current = requestAnimationFrame(animate);\n    };\n\n    rafRef.current = requestAnimationFrame(animate);\n    return () => {\n      if (rafRef.current) cancelAnimationFrame(rafRef.current);\n    };\n  }, [isStreaming, charsPerTick, tickInterval, flushOnStop, text]);\n\n  useEffect(() => {\n    if (!isStreaming && flushOnStop && displayText !== text) {\n      setDisplayText(text);\n      posRef.current = text.length;\n    }\n  }, [isStreaming, flushOnStop, text, displayText]);\n\n  return displayText;\n}\n\n// ─── Hooks ───────────────────────────────────────────────────────────────────\n\n/**\n * Buffers incoming text and releases it character-by-character for a smooth\n * typing effect. Pass the full (possibly incomplete) text and whether streaming\n * is active — get back the display-ready substring.\n *\n * @example\n * ```tsx\n * function StreamingMessage({ text, isStreaming }) {\n *   const displayText = useAiStreamingText(text, { isStreaming });\n *   return <AiResponse>{displayText}</AiResponse>;\n * }\n * ```\n */\nexport function useAiStreamingText(\n  text: string,\n  options: UseAiStreamingTextOptions = {}\n): string {\n  return useStreamingTextCore(text, options);\n}\n\n/**\n * Same as `useAiStreamingText` but returns an object with both the display\n * substring and the full target text. Useful for reserve-height layout where\n * you want surrounding UI to allocate space for the full target while content\n * streams in.\n *\n * @example\n * ```tsx\n * function StreamingMessage({ text, isStreaming }) {\n *   const { displayText, targetText } = useAiStreamingTextWithMeta(text, { isStreaming });\n *   return (\n *     <AiResponse reserveHeightFor={targetText}>\n *       {displayText}\n *     </AiResponse>\n *   );\n * }\n * ```\n */\nexport function useAiStreamingTextWithMeta(\n  text: string,\n  options: UseAiStreamingTextOptions = {}\n): UseAiStreamingTextMeta {\n  const displayText = useStreamingTextCore(text, options);\n  return {\n    displayText,\n    targetText: text,\n    isStreaming: options.isStreaming ?? false,\n  };\n}\n"],"mappings":";;;AAMA,IAAa,gCAAgC,EAAE;AAC/C,IAAa,wCAAwC,EAAE;AA0BvD,SAAS,qBACP,MACA,SACQ;CACR,MAAM,EACJ,cAAc,OACd,eAAe,IACf,eAAe,IACf,cAAc,SACZ;CAEJ,MAAM,CAAC,aAAa,kBAAkB,SAAS,KAAK;CACpD,MAAM,YAAY,OAAO,KAAK;CAC9B,MAAM,SAAS,OAAO,KAAK,OAAO;CAClC,MAAM,SAAS,OAAsB,KAAK;CAC1C,MAAM,cAAc,OAAO,EAAE;AAE7B,iBAAgB;AACd,YAAU,UAAU;IACnB,CAAC,KAAK,CAAC;AAEV,iBAAgB;AACd,MAAI,CAAC,aAAa;AAChB,OAAI,aAAa;AACf,mBAAe,KAAK;AACpB,WAAO,UAAU,KAAK;;AAExB;;EAGF,MAAM,WAAW,cAAsB;GACrC,MAAM,SAAS,UAAU;GACzB,MAAM,MAAM,OAAO;AAEnB,OAAI,OAAO,OAAO,QAAQ;AACxB,WAAO,UAAU,sBAAsB,QAAQ;AAC/C;;AAGF,OAAI,YAAY,YAAY,UAAU,cAAc;AAClD,WAAO,UAAU,sBAAsB,QAAQ;AAC/C;;AAEF,eAAY,UAAU;GAEtB,MAAM,SAAS,KAAK,IAAI,MAAM,cAAc,OAAO,OAAO;AAC1D,UAAO,UAAU;AACjB,kBAAe,OAAO,MAAM,GAAG,OAAO,CAAC;AACvC,UAAO,UAAU,sBAAsB,QAAQ;;AAGjD,SAAO,UAAU,sBAAsB,QAAQ;AAC/C,eAAa;AACX,OAAI,OAAO,QAAS,sBAAqB,OAAO,QAAQ;;IAEzD;EAAC;EAAa;EAAc;EAAc;EAAa;EAAK,CAAC;AAEhE,iBAAgB;AACd,MAAI,CAAC,eAAe,eAAe,gBAAgB,MAAM;AACvD,kBAAe,KAAK;AACpB,UAAO,UAAU,KAAK;;IAEvB;EAAC;EAAa;EAAa;EAAM;EAAY,CAAC;AAEjD,QAAO;;;;;;;;;;;;;;;AAkBT,SAAgB,mBACd,MACA,UAAqC,EAAE,EAC/B;AACR,QAAO,qBAAqB,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;AAqB5C,SAAgB,2BACd,MACA,UAAqC,EAAE,EACf;AAExB,QAAO;EACL,aAFkB,qBAAqB,MAAM,QAAQ;EAGrD,YAAY;EACZ,aAAa,QAAQ,eAAe;EACrC"}
+{"version":3,"file":"ai-streaming-text-DgYu64UH.js","names":[],"sources":["../src/components/ai-streaming-text/ai-streaming-text.tsx"],"sourcesContent":["\"use client\";\n\nimport { useEffect, useRef, useState } from \"react\";\n\n// ─── Variants ────────────────────────────────────────────────────────────────\n\nexport const SF_AI_STREAMING_TEXT_VARIANTS = {} as const;\nexport const SF_AI_STREAMING_TEXT_DEFAULT_VARIANTS = {} as const;\n\n// ─── Types ────────────────────────────────────────────────────────────────────\n\nexport interface UseAiStreamingTextOptions {\n  /** Whether content is actively streaming. @default false */\n  isStreaming?: boolean;\n  /** Characters to release per animation frame tick. @default 10 */\n  charsPerTick?: number;\n  /** Milliseconds between releases (~16ms = 60fps). @default 16 */\n  tickInterval?: number;\n  /** Immediately flush all text when streaming stops. @default true */\n  flushOnStop?: boolean;\n}\n\nexport interface UseAiStreamingTextMeta {\n  /** The display-ready substring for character-by-character reveal. */\n  displayText: string;\n  /** The full target text (useful for reserve height calculations). */\n  targetText: string;\n  /** Whether streaming is currently active. */\n  isStreaming: boolean;\n}\n\n// ─── Internal core hook ──────────────────────────────────────────────────────\n\nfunction useStreamingTextCore(\n  text: string,\n  options: UseAiStreamingTextOptions\n): string {\n  const {\n    isStreaming = false,\n    charsPerTick = 10,\n    tickInterval = 16,\n    flushOnStop = true,\n  } = options;\n\n  const [displayText, setDisplayText] = useState(text);\n  const targetRef = useRef(text);\n  const posRef = useRef(text.length);\n  const rafRef = useRef<number | null>(null);\n  const lastTickRef = useRef(0);\n\n  useEffect(() => {\n    targetRef.current = text;\n  }, [text]);\n\n  useEffect(() => {\n    if (!isStreaming) {\n      if (flushOnStop) {\n        setDisplayText(text);\n        posRef.current = text.length;\n      }\n      return;\n    }\n\n    const animate = (timestamp: number) => {\n      const target = targetRef.current;\n      const pos = posRef.current;\n\n      if (pos >= target.length) {\n        rafRef.current = requestAnimationFrame(animate);\n        return;\n      }\n\n      if (timestamp - lastTickRef.current < tickInterval) {\n        rafRef.current = requestAnimationFrame(animate);\n        return;\n      }\n      lastTickRef.current = timestamp;\n\n      const newPos = Math.min(pos + charsPerTick, target.length);\n      posRef.current = newPos;\n      setDisplayText(target.slice(0, newPos));\n      rafRef.current = requestAnimationFrame(animate);\n    };\n\n    rafRef.current = requestAnimationFrame(animate);\n    return () => {\n      if (rafRef.current) cancelAnimationFrame(rafRef.current);\n    };\n  }, [isStreaming, charsPerTick, tickInterval, flushOnStop, text]);\n\n  useEffect(() => {\n    if (!isStreaming && flushOnStop && displayText !== text) {\n      setDisplayText(text);\n      posRef.current = text.length;\n    }\n  }, [isStreaming, flushOnStop, text, displayText]);\n\n  return displayText;\n}\n\n// ─── Hooks ───────────────────────────────────────────────────────────────────\n\n/**\n * Buffers incoming text and releases it character-by-character for a smooth\n * typing effect. Pass the full (possibly incomplete) text and whether streaming\n * is active — get back the display-ready substring.\n *\n * @example\n * ```tsx\n * function StreamingMessage({ text, isStreaming }) {\n *   const displayText = useAiStreamingText(text, { isStreaming });\n *   return <AiResponse>{displayText}</AiResponse>;\n * }\n * ```\n */\nexport function useAiStreamingText(\n  text: string,\n  options: UseAiStreamingTextOptions = {}\n): string {\n  return useStreamingTextCore(text, options);\n}\n\n/**\n * Same as `useAiStreamingText` but returns an object with both the display\n * substring and the full target text. Useful for reserve-height layout where\n * you want surrounding UI to allocate space for the full target while content\n * streams in.\n *\n * @example\n * ```tsx\n * function StreamingMessage({ text, isStreaming }) {\n *   const { displayText, targetText } = useAiStreamingTextWithMeta(text, { isStreaming });\n *   return (\n *     <AiResponse reserveHeightFor={targetText}>\n *       {displayText}\n *     </AiResponse>\n *   );\n * }\n * ```\n */\nexport function useAiStreamingTextWithMeta(\n  text: string,\n  options: UseAiStreamingTextOptions = {}\n): UseAiStreamingTextMeta {\n  const displayText = useStreamingTextCore(text, options);\n  return {\n    displayText,\n    targetText: text,\n    isStreaming: options.isStreaming ?? false,\n  };\n}\n"],"mappings":";;;AAMA,IAAa,gCAAgC,CAAC;AAC9C,IAAa,wCAAwC,CAAC;AA0BtD,SAAS,qBACP,MACA,SACQ;CACR,MAAM,EACJ,cAAc,OACd,eAAe,IACf,eAAe,IACf,cAAc,SACZ;CAEJ,MAAM,CAAC,aAAa,kBAAkB,SAAS,IAAI;CACnD,MAAM,YAAY,OAAO,IAAI;CAC7B,MAAM,SAAS,OAAO,KAAK,MAAM;CACjC,MAAM,SAAS,OAAsB,IAAI;CACzC,MAAM,cAAc,OAAO,CAAC;CAE5B,gBAAgB;EACd,UAAU,UAAU;CACtB,GAAG,CAAC,IAAI,CAAC;CAET,gBAAgB;EACd,IAAI,CAAC,aAAa;GAChB,IAAI,aAAa;IACf,eAAe,IAAI;IACnB,OAAO,UAAU,KAAK;GACxB;GACA;EACF;EAEA,MAAM,WAAW,cAAsB;GACrC,MAAM,SAAS,UAAU;GACzB,MAAM,MAAM,OAAO;GAEnB,IAAI,OAAO,OAAO,QAAQ;IACxB,OAAO,UAAU,sBAAsB,OAAO;IAC9C;GACF;GAEA,IAAI,YAAY,YAAY,UAAU,cAAc;IAClD,OAAO,UAAU,sBAAsB,OAAO;IAC9C;GACF;GACA,YAAY,UAAU;GAEtB,MAAM,SAAS,KAAK,IAAI,MAAM,cAAc,OAAO,MAAM;GACzD,OAAO,UAAU;GACjB,eAAe,OAAO,MAAM,GAAG,MAAM,CAAC;GACtC,OAAO,UAAU,sBAAsB,OAAO;EAChD;EAEA,OAAO,UAAU,sBAAsB,OAAO;EAC9C,aAAa;GACX,IAAI,OAAO,SAAS,qBAAqB,OAAO,OAAO;EACzD;CACF,GAAG;EAAC;EAAa;EAAc;EAAc;EAAa;CAAI,CAAC;CAE/D,gBAAgB;EACd,IAAI,CAAC,eAAe,eAAe,gBAAgB,MAAM;GACvD,eAAe,IAAI;GACnB,OAAO,UAAU,KAAK;EACxB;CACF,GAAG;EAAC;EAAa;EAAa;EAAM;CAAW,CAAC;CAEhD,OAAO;AACT;;;;;;;;;;;;;;AAiBA,SAAgB,mBACd,MACA,UAAqC,CAAC,GAC9B;CACR,OAAO,qBAAqB,MAAM,OAAO;AAC3C;;;;;;;;;;;;;;;;;;;AAoBA,SAAgB,2BACd,MACA,UAAqC,CAAC,GACd;CAExB,OAAO;EACL,aAFkB,qBAAqB,MAAM,OAE7C;EACA,YAAY;EACZ,aAAa,QAAQ,eAAe;CACtC;AACF"}

package/dist/{ai-subagent-JA4iIMW3.js → ai-subagent-p97AI1h9.js}

@@ -1,6 +1,6 @@
 "use client";
-import { t as cn } from "./cn-YROP2_ox.js";
-import { t as Text } from "./text-Cqryz7rk.js";
+import { t as cn } from "./cn-CmAOpn49.js";
+import { t as Text } from "./text-iQ0YUFNg.js";
 import { useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { CaretDownIcon, CheckCircleIcon, RobotIcon, SpinnerGapIcon, XCircleIcon } from "@phosphor-icons/react";
@@ -138,4 +138,4 @@ AiSubagent.displayName = "AiSubagent";
 //#endregion
 export { SF_AI_SUBAGENT_DEFAULT_VARIANTS as n, SF_AI_SUBAGENT_VARIANTS as r, AiSubagent as t };
 
-//# sourceMappingURL=ai-subagent-JA4iIMW3.js.map
+//# sourceMappingURL=ai-subagent-p97AI1h9.js.map

package/dist/{ai-subagent-JA4iIMW3.js.map → ai-subagent-p97AI1h9.js.map}

@@ -1 +1 @@
-{"version":3,"file":"ai-subagent-JA4iIMW3.js","names":[],"sources":["../src/components/ai-subagent/ai-subagent.tsx"],"sourcesContent":["\"use client\";\n\nimport { Collapsible as BaseCollapsible } from \"@base-ui/react/collapsible\";\nimport {\n  RobotIcon,\n  CaretDownIcon,\n  SpinnerGapIcon,\n  CheckCircleIcon,\n  XCircleIcon,\n} from \"@phosphor-icons/react\";\nimport type { ElementType, HTMLAttributes, ReactNode } from \"react\";\nimport { useState } from \"react\";\n\nimport { cn } from \"../../utils/cn\";\nimport { Text } from \"../text\";\n\n// ─── Variants ────────────────────────────────────────────────────────────────\n\nexport const SF_AI_SUBAGENT_VARIANTS = {\n  status: {\n    running: { classes: \"\", description: \"Subagent is actively processing\" },\n    completed: { classes: \"\", description: \"Subagent finished successfully\" },\n    error: { classes: \"\", description: \"Subagent encountered an error\" },\n  },\n} as const;\n\nexport const SF_AI_SUBAGENT_DEFAULT_VARIANTS = {\n  status: \"running\",\n} as const;\n\nexport type SFAiSubagentStatus = keyof typeof SF_AI_SUBAGENT_VARIANTS.status;\n\n// ─── Types ────────────────────────────────────────────────────────────────────\n\nexport type AiSubagentProps = HTMLAttributes<HTMLDivElement> & {\n  /** Subagent type ID (e.g. `\"explore\"`, `\"execute\"`). */\n  agentType?: string;\n  /** Human-readable name for this subagent. */\n  name?: string;\n  /** Current status. */\n  status?: SFAiSubagentStatus;\n  /** Current model ID being used (e.g. `\"claude-haiku-3.5\"`). */\n  modelId?: string;\n  /** Duration in milliseconds. */\n  duration?: number;\n  /** Custom icon. Defaults to `RobotIcon`. */\n  icon?: ElementType;\n  /** Whether the subagent content is expanded by default. */\n  defaultExpanded?: boolean;\n  /** Controlled open state. */\n  open?: boolean;\n  /** Called when open state changes. */\n  onOpenChange?: (open: boolean) => void;\n  /**\n   * Content rendered inside the collapsible body — typically streaming text,\n   * tool calls, and other nested agent output.\n   */\n  children?: ReactNode;\n};\n\n// ─── Status config ────────────────────────────────────────────────────────────\n\nconst STATUS_CONFIG: Record<\n  SFAiSubagentStatus,\n  {\n    icon: ElementType;\n    className: string;\n    label: string;\n  }\n> = {\n  running: {\n    icon: SpinnerGapIcon,\n    className: \"text-sf-brand animate-spin\",\n    label: \"Running\",\n  },\n  completed: {\n    icon: CheckCircleIcon,\n    className: \"text-sf-success\",\n    label: \"Completed\",\n  },\n  error: {\n    icon: XCircleIcon,\n    className: \"text-sf-danger\",\n    label: \"Error\",\n  },\n};\n\n// ─── Helpers ──────────────────────────────────────────────────────────────────\n\nfunction formatDuration(ms: number): string {\n  if (ms < 1000) return `${ms}ms`;\n  const s = Math.floor(ms / 1000);\n  if (s < 60) return `${s}s`;\n  const m = Math.floor(s / 60);\n  const remaining = s % 60;\n  return remaining > 0 ? `${m}m ${remaining}s` : `${m}m`;\n}\n\n// ─── Component ────────────────────────────────────────────────────────────────\n\n/**\n * Collapsible wrapper for nested subagent activity. Shows the subagent name,\n * status, model, and duration in a header, with all subagent output (text,\n * tool calls, etc.) in a collapsible body.\n *\n * Maps to harness events: `subagent_start`, `subagent_text_delta`,\n * `subagent_tool_start`, `subagent_tool_end`, `subagent_end`,\n * `subagent_model_changed`.\n *\n * @example\n * ```tsx\n * <AiSubagent\n *   name=\"Explore\"\n *   agentType=\"explore\"\n *   status=\"running\"\n *   modelId=\"claude-haiku-3.5\"\n *   defaultExpanded\n * >\n *   <AiResponse isAnimating>{streamingText}</AiResponse>\n *   <AiToolCallGroup tools={toolCalls} />\n * </AiSubagent>\n * ```\n */\nexport function AiSubagent({\n  agentType,\n  name,\n  status = \"running\",\n  modelId,\n  duration,\n  icon,\n  defaultExpanded = true,\n  open: controlledOpen,\n  onOpenChange,\n  children,\n  className,\n  ...props\n}: AiSubagentProps) {\n  const [internalOpen, setInternalOpen] = useState(defaultExpanded);\n  const isControlled = controlledOpen !== undefined;\n  const isOpen = isControlled ? controlledOpen : internalOpen;\n\n  const handleOpenChange = (nextOpen: boolean) => {\n    if (!isControlled) setInternalOpen(nextOpen);\n    onOpenChange?.(nextOpen);\n  };\n\n  const IconComponent = icon ?? RobotIcon;\n  const statusConfig = STATUS_CONFIG[status];\n  const StatusIcon = statusConfig.icon;\n  const displayName = name ?? agentType ?? \"Subagent\";\n\n  return (\n    <BaseCollapsible.Root\n      defaultOpen={defaultExpanded}\n      onOpenChange={handleOpenChange}\n      open={isOpen}\n    >\n      <div\n        className={cn(\"flex flex-col overflow-hidden rounded-lg\", className)}\n        {...props}\n      >\n        {/* Header / trigger */}\n        <BaseCollapsible.Trigger className=\"flex w-fit items-center gap-2 rounded-md px-2 py-1.5 text-left transition-colors hover:bg-sf-tint\">\n          {/* Agent icon */}\n          <div className=\"flex size-5 shrink-0 items-center justify-center rounded bg-sf-tint text-sf-subtle\">\n            <IconComponent className=\"size-3.5\" />\n          </div>\n\n          {/* Name + model */}\n          <div className=\"flex min-w-0 grow items-center gap-2\">\n            <Text size=\"sm\" wrap=\"shrink\" as=\"span\" DANGEROUS_className=\"font-medium\">\n              {displayName}\n            </Text>\n            {modelId && (\n              <Text\n                size=\"xs\"\n                variant=\"secondary\"\n                as=\"span\"\n                wrap=\"shrink\"\n                DANGEROUS_className=\"truncate rounded bg-sf-tint px-1.5 py-0.5 font-mono\"\n              >\n                {modelId}\n              </Text>\n            )}\n          </div>\n\n          {/* Status + duration + caret */}\n          <div className=\"flex shrink-0 items-center gap-2\">\n            {duration !== undefined && (\n              <span className=\"text-xs tabular-nums text-sf-subtle\">\n                {formatDuration(duration)}\n              </span>\n            )}\n            <StatusIcon className={cn(\"size-3.5\", statusConfig.className)} />\n            <CaretDownIcon\n              className={cn(\n                \"size-3 text-sf-subtle transition-transform duration-200\",\n                isOpen && \"rotate-180\"\n              )}\n            />\n          </div>\n        </BaseCollapsible.Trigger>\n\n        {/* Collapsible content */}\n        <BaseCollapsible.Panel className=\"overflow-hidden [&[data-ending-style]]:h-0 [&[data-starting-style]]:h-0\">\n          <div className=\"flex flex-col gap-2 bg-sf-tint/50 px-3 py-2.5\">\n            {children}\n          </div>\n        </BaseCollapsible.Panel>\n      </div>\n    </BaseCollapsible.Root>\n  );\n}\n\nAiSubagent.displayName = \"AiSubagent\";\n"],"mappings":";;;;;;;;AAkBA,IAAa,0BAA0B,EACrC,QAAQ;CACN,SAAS;EAAE,SAAS;EAAI,aAAa;EAAmC;CACxE,WAAW;EAAE,SAAS;EAAI,aAAa;EAAkC;CACzE,OAAO;EAAE,SAAS;EAAI,aAAa;EAAiC;CACrE,EACF;AAED,IAAa,kCAAkC,EAC7C,QAAQ,WACT;AAkCD,IAAM,gBAOF;CACF,SAAS;EACP,MAAM;EACN,WAAW;EACX,OAAO;EACR;CACD,WAAW;EACT,MAAM;EACN,WAAW;EACX,OAAO;EACR;CACD,OAAO;EACL,MAAM;EACN,WAAW;EACX,OAAO;EACR;CACF;AAID,SAAS,eAAe,IAAoB;AAC1C,KAAI,KAAK,IAAM,QAAO,GAAG,GAAG;CAC5B,MAAM,IAAI,KAAK,MAAM,KAAK,IAAK;AAC/B,KAAI,IAAI,GAAI,QAAO,GAAG,EAAE;CACxB,MAAM,IAAI,KAAK,MAAM,IAAI,GAAG;CAC5B,MAAM,YAAY,IAAI;AACtB,QAAO,YAAY,IAAI,GAAG,EAAE,IAAI,UAAU,KAAK,GAAG,EAAE;;;;;;;;;;;;;;;;;;;;;;;;;AA4BtD,SAAgB,WAAW,EACzB,WACA,MACA,SAAS,WACT,SACA,UACA,MACA,kBAAkB,MAClB,MAAM,gBACN,cACA,UACA,WACA,GAAG,SACe;CAClB,MAAM,CAAC,cAAc,mBAAmB,SAAS,gBAAgB;CACjE,MAAM,eAAe,mBAAmB,KAAA;CACxC,MAAM,SAAS,eAAe,iBAAiB;CAE/C,MAAM,oBAAoB,aAAsB;AAC9C,MAAI,CAAC,aAAc,iBAAgB,SAAS;AAC5C,iBAAe,SAAS;;CAG1B,MAAM,gBAAgB,QAAQ;CAC9B,MAAM,eAAe,cAAc;CACnC,MAAM,aAAa,aAAa;CAChC,MAAM,cAAc,QAAQ,aAAa;AAEzC,QACE,oBAAC,YAAgB,MAAjB;EACE,aAAa;EACb,cAAc;EACd,MAAM;YAEN,qBAAC,OAAD;GACE,WAAW,GAAG,4CAA4C,UAAU;GACpE,GAAI;aAFN,CAKE,qBAAC,YAAgB,SAAjB;IAAyB,WAAU;cAAnC;KAEE,oBAAC,OAAD;MAAK,WAAU;gBACb,oBAAC,eAAD,EAAe,WAAU,YAAa,CAAA;MAClC,CAAA;KAGN,qBAAC,OAAD;MAAK,WAAU;gBAAf,CACE,oBAAC,MAAD;OAAM,MAAK;OAAK,MAAK;OAAS,IAAG;OAAO,qBAAoB;iBACzD;OACI,CAAA,EACN,WACC,oBAAC,MAAD;OACE,MAAK;OACL,SAAQ;OACR,IAAG;OACH,MAAK;OACL,qBAAoB;iBAEnB;OACI,CAAA,CAEL;;KAGN,qBAAC,OAAD;MAAK,WAAU;gBAAf;OACG,aAAa,KAAA,KACZ,oBAAC,QAAD;QAAM,WAAU;kBACb,eAAe,SAAS;QACpB,CAAA;OAET,oBAAC,YAAD,EAAY,WAAW,GAAG,YAAY,aAAa,UAAU,EAAI,CAAA;OACjE,oBAAC,eAAD,EACE,WAAW,GACT,2DACA,UAAU,aACX,EACD,CAAA;OACE;;KACkB;OAG1B,oBAAC,YAAgB,OAAjB;IAAuB,WAAU;cAC/B,oBAAC,OAAD;KAAK,WAAU;KACZ;KACG,CAAA;IACgB,CAAA,CACpB;;EACe,CAAA;;AAI3B,WAAW,cAAc"}
+{"version":3,"file":"ai-subagent-p97AI1h9.js","names":[],"sources":["../src/components/ai-subagent/ai-subagent.tsx"],"sourcesContent":["\"use client\";\n\nimport { Collapsible as BaseCollapsible } from \"@base-ui/react/collapsible\";\nimport {\n  RobotIcon,\n  CaretDownIcon,\n  SpinnerGapIcon,\n  CheckCircleIcon,\n  XCircleIcon,\n} from \"@phosphor-icons/react\";\nimport type { ElementType, HTMLAttributes, ReactNode } from \"react\";\nimport { useState } from \"react\";\n\nimport { cn } from \"../../utils/cn\";\nimport { Text } from \"../text\";\n\n// ─── Variants ────────────────────────────────────────────────────────────────\n\nexport const SF_AI_SUBAGENT_VARIANTS = {\n  status: {\n    running: { classes: \"\", description: \"Subagent is actively processing\" },\n    completed: { classes: \"\", description: \"Subagent finished successfully\" },\n    error: { classes: \"\", description: \"Subagent encountered an error\" },\n  },\n} as const;\n\nexport const SF_AI_SUBAGENT_DEFAULT_VARIANTS = {\n  status: \"running\",\n} as const;\n\nexport type SFAiSubagentStatus = keyof typeof SF_AI_SUBAGENT_VARIANTS.status;\n\n// ─── Types ────────────────────────────────────────────────────────────────────\n\nexport type AiSubagentProps = HTMLAttributes<HTMLDivElement> & {\n  /** Subagent type ID (e.g. `\"explore\"`, `\"execute\"`). */\n  agentType?: string;\n  /** Human-readable name for this subagent. */\n  name?: string;\n  /** Current status. */\n  status?: SFAiSubagentStatus;\n  /** Current model ID being used (e.g. `\"claude-haiku-3.5\"`). */\n  modelId?: string;\n  /** Duration in milliseconds. */\n  duration?: number;\n  /** Custom icon. Defaults to `RobotIcon`. */\n  icon?: ElementType;\n  /** Whether the subagent content is expanded by default. */\n  defaultExpanded?: boolean;\n  /** Controlled open state. */\n  open?: boolean;\n  /** Called when open state changes. */\n  onOpenChange?: (open: boolean) => void;\n  /**\n   * Content rendered inside the collapsible body — typically streaming text,\n   * tool calls, and other nested agent output.\n   */\n  children?: ReactNode;\n};\n\n// ─── Status config ────────────────────────────────────────────────────────────\n\nconst STATUS_CONFIG: Record<\n  SFAiSubagentStatus,\n  {\n    icon: ElementType;\n    className: string;\n    label: string;\n  }\n> = {\n  running: {\n    icon: SpinnerGapIcon,\n    className: \"text-sf-brand animate-spin\",\n    label: \"Running\",\n  },\n  completed: {\n    icon: CheckCircleIcon,\n    className: \"text-sf-success\",\n    label: \"Completed\",\n  },\n  error: {\n    icon: XCircleIcon,\n    className: \"text-sf-danger\",\n    label: \"Error\",\n  },\n};\n\n// ─── Helpers ──────────────────────────────────────────────────────────────────\n\nfunction formatDuration(ms: number): string {\n  if (ms < 1000) return `${ms}ms`;\n  const s = Math.floor(ms / 1000);\n  if (s < 60) return `${s}s`;\n  const m = Math.floor(s / 60);\n  const remaining = s % 60;\n  return remaining > 0 ? `${m}m ${remaining}s` : `${m}m`;\n}\n\n// ─── Component ────────────────────────────────────────────────────────────────\n\n/**\n * Collapsible wrapper for nested subagent activity. Shows the subagent name,\n * status, model, and duration in a header, with all subagent output (text,\n * tool calls, etc.) in a collapsible body.\n *\n * Maps to harness events: `subagent_start`, `subagent_text_delta`,\n * `subagent_tool_start`, `subagent_tool_end`, `subagent_end`,\n * `subagent_model_changed`.\n *\n * @example\n * ```tsx\n * <AiSubagent\n *   name=\"Explore\"\n *   agentType=\"explore\"\n *   status=\"running\"\n *   modelId=\"claude-haiku-3.5\"\n *   defaultExpanded\n * >\n *   <AiResponse isAnimating>{streamingText}</AiResponse>\n *   <AiToolCallGroup tools={toolCalls} />\n * </AiSubagent>\n * ```\n */\nexport function AiSubagent({\n  agentType,\n  name,\n  status = \"running\",\n  modelId,\n  duration,\n  icon,\n  defaultExpanded = true,\n  open: controlledOpen,\n  onOpenChange,\n  children,\n  className,\n  ...props\n}: AiSubagentProps) {\n  const [internalOpen, setInternalOpen] = useState(defaultExpanded);\n  const isControlled = controlledOpen !== undefined;\n  const isOpen = isControlled ? controlledOpen : internalOpen;\n\n  const handleOpenChange = (nextOpen: boolean) => {\n    if (!isControlled) setInternalOpen(nextOpen);\n    onOpenChange?.(nextOpen);\n  };\n\n  const IconComponent = icon ?? RobotIcon;\n  const statusConfig = STATUS_CONFIG[status];\n  const StatusIcon = statusConfig.icon;\n  const displayName = name ?? agentType ?? \"Subagent\";\n\n  return (\n    <BaseCollapsible.Root\n      defaultOpen={defaultExpanded}\n      onOpenChange={handleOpenChange}\n      open={isOpen}\n    >\n      <div\n        className={cn(\"flex flex-col overflow-hidden rounded-lg\", className)}\n        {...props}\n      >\n        {/* Header / trigger */}\n        <BaseCollapsible.Trigger className=\"flex w-fit items-center gap-2 rounded-md px-2 py-1.5 text-left transition-colors hover:bg-sf-tint\">\n          {/* Agent icon */}\n          <div className=\"flex size-5 shrink-0 items-center justify-center rounded bg-sf-tint text-sf-subtle\">\n            <IconComponent className=\"size-3.5\" />\n          </div>\n\n          {/* Name + model */}\n          <div className=\"flex min-w-0 grow items-center gap-2\">\n            <Text\n              size=\"sm\"\n              wrap=\"shrink\"\n              as=\"span\"\n              DANGEROUS_className=\"font-medium\"\n            >\n              {displayName}\n            </Text>\n            {modelId && (\n              <Text\n                size=\"xs\"\n                variant=\"secondary\"\n                as=\"span\"\n                wrap=\"shrink\"\n                DANGEROUS_className=\"truncate rounded bg-sf-tint px-1.5 py-0.5 font-mono\"\n              >\n                {modelId}\n              </Text>\n            )}\n          </div>\n\n          {/* Status + duration + caret */}\n          <div className=\"flex shrink-0 items-center gap-2\">\n            {duration !== undefined && (\n              <span className=\"text-xs tabular-nums text-sf-subtle\">\n                {formatDuration(duration)}\n              </span>\n            )}\n            <StatusIcon className={cn(\"size-3.5\", statusConfig.className)} />\n            <CaretDownIcon\n              className={cn(\n                \"size-3 text-sf-subtle transition-transform duration-200\",\n                isOpen && \"rotate-180\"\n              )}\n            />\n          </div>\n        </BaseCollapsible.Trigger>\n\n        {/* Collapsible content */}\n        <BaseCollapsible.Panel className=\"overflow-hidden [&[data-ending-style]]:h-0 [&[data-starting-style]]:h-0\">\n          <div className=\"flex flex-col gap-2 bg-sf-tint/50 px-3 py-2.5\">\n            {children}\n          </div>\n        </BaseCollapsible.Panel>\n      </div>\n    </BaseCollapsible.Root>\n  );\n}\n\nAiSubagent.displayName = \"AiSubagent\";\n"],"mappings":";;;;;;;;AAkBA,IAAa,0BAA0B,EACrC,QAAQ;CACN,SAAS;EAAE,SAAS;EAAI,aAAa;CAAkC;CACvE,WAAW;EAAE,SAAS;EAAI,aAAa;CAAiC;CACxE,OAAO;EAAE,SAAS;EAAI,aAAa;CAAgC;AACrE,EACF;AAEA,IAAa,kCAAkC,EAC7C,QAAQ,UACV;AAkCA,IAAM,gBAOF;CACF,SAAS;EACP,MAAM;EACN,WAAW;EACX,OAAO;CACT;CACA,WAAW;EACT,MAAM;EACN,WAAW;EACX,OAAO;CACT;CACA,OAAO;EACL,MAAM;EACN,WAAW;EACX,OAAO;CACT;AACF;AAIA,SAAS,eAAe,IAAoB;CAC1C,IAAI,KAAK,KAAM,OAAO,GAAG,GAAG;CAC5B,MAAM,IAAI,KAAK,MAAM,KAAK,GAAI;CAC9B,IAAI,IAAI,IAAI,OAAO,GAAG,EAAE;CACxB,MAAM,IAAI,KAAK,MAAM,IAAI,EAAE;CAC3B,MAAM,YAAY,IAAI;CACtB,OAAO,YAAY,IAAI,GAAG,EAAE,IAAI,UAAU,KAAK,GAAG,EAAE;AACtD;;;;;;;;;;;;;;;;;;;;;;;;AA2BA,SAAgB,WAAW,EACzB,WACA,MACA,SAAS,WACT,SACA,UACA,MACA,kBAAkB,MAClB,MAAM,gBACN,cACA,UACA,WACA,GAAG,SACe;CAClB,MAAM,CAAC,cAAc,mBAAmB,SAAS,eAAe;CAChE,MAAM,eAAe,mBAAmB,KAAA;CACxC,MAAM,SAAS,eAAe,iBAAiB;CAE/C,MAAM,oBAAoB,aAAsB;EAC9C,IAAI,CAAC,cAAc,gBAAgB,QAAQ;EAC3C,eAAe,QAAQ;CACzB;CAEA,MAAM,gBAAgB,QAAQ;CAC9B,MAAM,eAAe,cAAc;CACnC,MAAM,aAAa,aAAa;CAChC,MAAM,cAAc,QAAQ,aAAa;CAEzC,OACE,oBAAC,YAAgB,MAAjB;EACE,aAAa;EACb,cAAc;EACd,MAAM;YAEN,qBAAC,OAAD;GACE,WAAW,GAAG,4CAA4C,SAAS;GACnE,GAAI;aAFN,CAKE,qBAAC,YAAgB,SAAjB;IAAyB,WAAU;cAAnC;KAEE,oBAAC,OAAD;MAAK,WAAU;gBACb,oBAAC,eAAD,EAAe,WAAU,WAAY,CAAA;KAClC,CAAA;KAGL,qBAAC,OAAD;MAAK,WAAU;gBAAf,CACE,oBAAC,MAAD;OACE,MAAK;OACL,MAAK;OACL,IAAG;OACH,qBAAoB;iBAEnB;MACG,CAAA,GACL,WACC,oBAAC,MAAD;OACE,MAAK;OACL,SAAQ;OACR,IAAG;OACH,MAAK;OACL,qBAAoB;iBAEnB;MACG,CAAA,CAEL;;KAGL,qBAAC,OAAD;MAAK,WAAU;gBAAf;OACG,aAAa,KAAA,KACZ,oBAAC,QAAD;QAAM,WAAU;kBACb,eAAe,QAAQ;OACpB,CAAA;OAER,oBAAC,YAAD,EAAY,WAAW,GAAG,YAAY,aAAa,SAAS,EAAI,CAAA;OAChE,oBAAC,eAAD,EACE,WAAW,GACT,2DACA,UAAU,YACZ,EACD,CAAA;MACE;;IACkB;OAGzB,oBAAC,YAAgB,OAAjB;IAAuB,WAAU;cAC/B,oBAAC,OAAD;KAAK,WAAU;KACZ;IACE,CAAA;GACgB,CAAA,CACpB;;CACe,CAAA;AAE1B;AAEA,WAAW,cAAc"}

package/dist/{ai-suggestion-BdO6MBuH.js → ai-suggestion-Bj6vF7CT.js}

@@ -1,6 +1,6 @@
 "use client";
-import { t as cn } from "./cn-YROP2_ox.js";
-import { t as Button } from "./button-CO6-qPax.js";
+import { t as cn } from "./cn-CmAOpn49.js";
+import { t as Button } from "./button-BHOgXJRU.js";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/ai-suggestion/ai-suggestion.tsx
 var SF_AI_SUGGESTION_VARIANTS = {};
@@ -52,4 +52,4 @@ function AiSuggestion({ suggestion, onClick, className, variant = "secondary", s
 //#endregion
 export { SF_AI_SUGGESTION_VARIANTS as i, AiSuggestions as n, SF_AI_SUGGESTION_DEFAULT_VARIANTS as r, AiSuggestion as t };
 
-//# sourceMappingURL=ai-suggestion-BdO6MBuH.js.map
+//# sourceMappingURL=ai-suggestion-Bj6vF7CT.js.map

package/dist/{ai-suggestion-BdO6MBuH.js.map → ai-suggestion-Bj6vF7CT.js.map}

@@ -1 +1 @@
-{"version":3,"file":"ai-suggestion-BdO6MBuH.js","names":[],"sources":["../src/components/ai-suggestion/ai-suggestion.tsx"],"sourcesContent":["\"use client\";\n\nimport type { ComponentProps } from \"react\";\n\nimport { cn } from \"../../utils/cn\";\nimport { Button } from \"../button\";\n\n// ─── Variants ────────────────────────────────────────────────────────────────\n\nexport const SF_AI_SUGGESTION_VARIANTS = {} as const;\nexport const SF_AI_SUGGESTION_DEFAULT_VARIANTS = {} as const;\n\n// ─── AiSuggestions ───────────────────────────────────────────────────────────\n\nexport type AiSuggestionsProps = ComponentProps<\"div\">;\n\n/**\n * Horizontally scrollable container for suggestion pills.\n * Position it relative to your prompt input (e.g. `bottom-full`).\n *\n * @example\n * ```tsx\n * <div className=\"relative\">\n *   <AiSuggestions>\n *     <AiSuggestion suggestion=\"Summarize this\" onClick={handleSuggestion} />\n *     <AiSuggestion suggestion=\"Explain in simple terms\" onClick={handleSuggestion} />\n *   </AiSuggestions>\n *   <AiPromptInput ... />\n * </div>\n * ```\n */\nexport function AiSuggestions({\n  className,\n  children,\n  ...props\n}: AiSuggestionsProps) {\n  return (\n    <div\n      className={cn(\n        \"flex w-full flex-nowrap items-center gap-2 overflow-x-auto px-3 py-2\",\n        // hide scrollbar cross-browser\n        \"[scrollbar-width:none] [&::-webkit-scrollbar]:hidden\",\n        className\n      )}\n      {...props}\n    >\n      {children}\n    </div>\n  );\n}\n\n// ─── AiSuggestion ────────────────────────────────────────────────────────────\n\nexport type AiSuggestionProps = Omit<\n  ComponentProps<typeof Button>,\n  \"onClick\" | \"shape\"\n> & {\n  /** The suggestion text — used as button label if no children provided. */\n  suggestion: string;\n  /** Called with the suggestion string when clicked. */\n  onClick?: (suggestion: string) => void;\n};\n\n/**\n * A single suggestion pill button.\n *\n * @example\n * ```tsx\n * <AiSuggestion\n *   suggestion=\"What can you help me with?\"\n *   onClick={(s) => setInput(s)}\n * />\n * ```\n */\nexport function AiSuggestion({\n  suggestion,\n  onClick,\n  className,\n  variant = \"secondary\",\n  size = \"sm\",\n  children,\n  ...props\n}: AiSuggestionProps) {\n  return (\n    <Button\n      className={cn(\"shrink-0 rounded-full px-4\", className)}\n      onClick={() => onClick?.(suggestion)}\n      size={size}\n      type=\"button\"\n      variant={variant}\n      {...props}\n    >\n      {children ?? suggestion}\n    </Button>\n  );\n}\n"],"mappings":";;;;;AASA,IAAa,4BAA4B,EAAE;AAC3C,IAAa,oCAAoC,EAAE;;;;;;;;;;;;;;;;AAqBnD,SAAgB,cAAc,EAC5B,WACA,UACA,GAAG,SACkB;AACrB,QACE,oBAAC,OAAD;EACE,WAAW,GACT,wEAEA,wDACA,UACD;EACD,GAAI;EAEH;EACG,CAAA;;;;;;;;;;;;;AA2BV,SAAgB,aAAa,EAC3B,YACA,SACA,WACA,UAAU,aACV,OAAO,MACP,UACA,GAAG,SACiB;AACpB,QACE,oBAAC,QAAD;EACE,WAAW,GAAG,8BAA8B,UAAU;EACtD,eAAe,UAAU,WAAW;EAC9B;EACN,MAAK;EACI;EACT,GAAI;YAEH,YAAY;EACN,CAAA"}
+{"version":3,"file":"ai-suggestion-Bj6vF7CT.js","names":[],"sources":["../src/components/ai-suggestion/ai-suggestion.tsx"],"sourcesContent":["\"use client\";\n\nimport type { ComponentProps } from \"react\";\n\nimport { cn } from \"../../utils/cn\";\nimport { Button } from \"../button\";\n\n// ─── Variants ────────────────────────────────────────────────────────────────\n\nexport const SF_AI_SUGGESTION_VARIANTS = {} as const;\nexport const SF_AI_SUGGESTION_DEFAULT_VARIANTS = {} as const;\n\n// ─── AiSuggestions ───────────────────────────────────────────────────────────\n\nexport type AiSuggestionsProps = ComponentProps<\"div\">;\n\n/**\n * Horizontally scrollable container for suggestion pills.\n * Position it relative to your prompt input (e.g. `bottom-full`).\n *\n * @example\n * ```tsx\n * <div className=\"relative\">\n *   <AiSuggestions>\n *     <AiSuggestion suggestion=\"Summarize this\" onClick={handleSuggestion} />\n *     <AiSuggestion suggestion=\"Explain in simple terms\" onClick={handleSuggestion} />\n *   </AiSuggestions>\n *   <AiPromptInput ... />\n * </div>\n * ```\n */\nexport function AiSuggestions({\n  className,\n  children,\n  ...props\n}: AiSuggestionsProps) {\n  return (\n    <div\n      className={cn(\n        \"flex w-full flex-nowrap items-center gap-2 overflow-x-auto px-3 py-2\",\n        // hide scrollbar cross-browser\n        \"[scrollbar-width:none] [&::-webkit-scrollbar]:hidden\",\n        className\n      )}\n      {...props}\n    >\n      {children}\n    </div>\n  );\n}\n\n// ─── AiSuggestion ────────────────────────────────────────────────────────────\n\nexport type AiSuggestionProps = Omit<\n  ComponentProps<typeof Button>,\n  \"onClick\" | \"shape\"\n> & {\n  /** The suggestion text — used as button label if no children provided. */\n  suggestion: string;\n  /** Called with the suggestion string when clicked. */\n  onClick?: (suggestion: string) => void;\n};\n\n/**\n * A single suggestion pill button.\n *\n * @example\n * ```tsx\n * <AiSuggestion\n *   suggestion=\"What can you help me with?\"\n *   onClick={(s) => setInput(s)}\n * />\n * ```\n */\nexport function AiSuggestion({\n  suggestion,\n  onClick,\n  className,\n  variant = \"secondary\",\n  size = \"sm\",\n  children,\n  ...props\n}: AiSuggestionProps) {\n  return (\n    <Button\n      className={cn(\"shrink-0 rounded-full px-4\", className)}\n      onClick={() => onClick?.(suggestion)}\n      size={size}\n      type=\"button\"\n      variant={variant}\n      {...props}\n    >\n      {children ?? suggestion}\n    </Button>\n  );\n}\n"],"mappings":";;;;;AASA,IAAa,4BAA4B,CAAC;AAC1C,IAAa,oCAAoC,CAAC;;;;;;;;;;;;;;;;AAqBlD,SAAgB,cAAc,EAC5B,WACA,UACA,GAAG,SACkB;CACrB,OACE,oBAAC,OAAD;EACE,WAAW,GACT,wEAEA,wDACA,SACF;EACA,GAAI;EAEH;CACE,CAAA;AAET;;;;;;;;;;;;AAyBA,SAAgB,aAAa,EAC3B,YACA,SACA,WACA,UAAU,aACV,OAAO,MACP,UACA,GAAG,SACiB;CACpB,OACE,oBAAC,QAAD;EACE,WAAW,GAAG,8BAA8B,SAAS;EACrD,eAAe,UAAU,UAAU;EAC7B;EACN,MAAK;EACI;EACT,GAAI;YAEH,YAAY;CACP,CAAA;AAEZ"}

package/dist/{ai-task-list-DYw4R1FA.js → ai-task-list-C_UQYpk9.js}

@@ -1,6 +1,6 @@
 "use client";
-import { t as cn } from "./cn-YROP2_ox.js";
-import { t as Text } from "./text-Cqryz7rk.js";
+import { t as cn } from "./cn-CmAOpn49.js";
+import { t as Text } from "./text-iQ0YUFNg.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/ai-task-list/ai-task-list.tsx
 var SF_AI_TASK_LIST_VARIANTS = {};
@@ -86,7 +86,9 @@ function AiTaskList({ tasks, title, icon, showProgress = true, children, classNa
 				className: "flex items-center justify-between gap-2 pb-0.5",
 				children: [/* @__PURE__ */ jsxs("div", {
 					className: "flex items-center gap-1.5",
-					children: [icon && /* @__PURE__ */ jsx(icon, { className: "size-3.5 text-sf-subtle" }), title && /* @__PURE__ */ jsx(Text, {
+					children: [icon && (() => {
+						return /* @__PURE__ */ jsx(icon, { className: "size-3.5 text-sf-subtle" });
+					})(), title && /* @__PURE__ */ jsx(Text, {
 						size: "sm",
 						variant: "secondary",
 						wrap: "shrink",
@@ -121,4 +123,4 @@ AiTaskList.displayName = "AiTaskList";
 //#endregion
 export { SF_AI_TASK_LIST_VARIANTS as i, AiTaskListItem as n, SF_AI_TASK_LIST_DEFAULT_VARIANTS as r, AiTaskList as t };
 
-//# sourceMappingURL=ai-task-list-DYw4R1FA.js.map
+//# sourceMappingURL=ai-task-list-C_UQYpk9.js.map

package/dist/{ai-task-list-DYw4R1FA.js.map → ai-task-list-C_UQYpk9.js.map}

@@ -1 +1 @@
-{"version":3,"file":"ai-task-list-DYw4R1FA.js","names":[],"sources":["../src/components/ai-task-list/ai-task-list.tsx"],"sourcesContent":["\"use client\";\n\nimport type { ElementType, HTMLAttributes, ReactNode } from \"react\";\n\nimport { cn } from \"../../utils/cn\";\nimport { Text } from \"../text\";\n\n// ─── Variants ────────────────────────────────────────────────────────────────\n\nexport const SF_AI_TASK_LIST_VARIANTS = {} as const;\nexport const SF_AI_TASK_LIST_DEFAULT_VARIANTS = {} as const;\n\n// ─── Types ────────────────────────────────────────────────────────────────────\n\nexport type AiTaskStatus =\n  | \"pending\"\n  | \"in_progress\"\n  | \"completed\"\n  | \"cancelled\";\n\nexport type AiTaskPriority = \"high\" | \"medium\" | \"low\";\n\nexport type AiTaskItem = {\n  /** Unique task identifier. */\n  id: string;\n  /** Task description. */\n  content: string;\n  /** Current status. */\n  status: AiTaskStatus;\n  /** Priority level. */\n  priority?: AiTaskPriority;\n};\n\nexport type AiTaskListProps = Omit<HTMLAttributes<HTMLDivElement>, \"title\"> & {\n  /** List of tasks. */\n  tasks: AiTaskItem[];\n  /** Optional title above the task list. */\n  title?: string;\n  /** Custom icon for the title area. */\n  icon?: ElementType;\n  /** Show a progress summary (e.g. \"3 / 7 done\"). Default: `true`. */\n  showProgress?: boolean;\n  /** Content rendered below the task list. */\n  children?: ReactNode;\n};\n\nexport type AiTaskListItemProps = HTMLAttributes<HTMLDivElement> & {\n  task: AiTaskItem;\n};\n\n// ─── Status config ────────────────────────────────────────────────────────────\n\nconst STATUS_CONFIG: Record<\n  AiTaskStatus,\n  { dotClassName: string; textClassName: string }\n> = {\n  pending: {\n    dotClassName: \"bg-sf-subtle/30\",\n    textClassName: \"text-sf-subtle\",\n  },\n  in_progress: {\n    dotClassName: \"bg-sf-brand\",\n    textClassName: \"text-sf-default\",\n  },\n  completed: {\n    dotClassName: \"bg-sf-success\",\n    textClassName: \"text-sf-subtle/60 line-through\",\n  },\n  cancelled: {\n    dotClassName: \"bg-sf-subtle/30\",\n    textClassName: \"text-sf-subtle/40 line-through\",\n  },\n};\n\nconst PRIORITY_DOT: Record<AiTaskPriority, string> = {\n  high: \"bg-sf-danger\",\n  medium: \"bg-sf-warning\",\n  low: \"bg-sf-subtle\",\n};\n\n// ─── AiTaskListItem ──────────────────────────────────────────────────────────\n\n/**\n * Single task item with status icon, content, and optional priority dot.\n */\nexport function AiTaskListItem({\n  task,\n  className,\n  ...props\n}: AiTaskListItemProps) {\n  const config = STATUS_CONFIG[task.status];\n\n  return (\n    <div className={cn(\"flex items-start gap-2 py-1\", className)} {...props}>\n      <span\n        aria-hidden\n        className={cn(\n          \"mt-[0.4375rem] size-1.5 shrink-0 rounded-full\",\n          config.dotClassName\n        )}\n      />\n      <Text\n        size=\"sm\"\n        wrap=\"shrink\"\n        as=\"span\"\n        DANGEROUS_className={cn(\"min-w-0 grow\", config.textClassName)}\n      >\n        {task.content}\n      </Text>\n      {task.priority && (\n        <span\n          className={cn(\n            \"mt-2 size-1 shrink-0 rounded-full\",\n            PRIORITY_DOT[task.priority]\n          )}\n          title={`${task.priority} priority`}\n        />\n      )}\n    </div>\n  );\n}\n\nAiTaskListItem.displayName = \"AiTaskListItem\";\n\n// ─── AiTaskList ──────────────────────────────────────────────────────────────\n\n/**\n * Task progress list. Renders structured tasks from the harness `task_write`\n * tool. Typically rendered inside the `PromptInputBackLayer` or inline in\n * conversation.\n *\n * Maps to harness event: `task_updated`.\n *\n * @example\n * ```tsx\n * <AiTaskList\n *   title=\"Current tasks\"\n *   tasks={[\n *     { id: \"1\", content: \"Read config file\", status: \"completed\", priority: \"high\" },\n *     { id: \"2\", content: \"Run migrations\", status: \"in_progress\", priority: \"high\" },\n *     { id: \"3\", content: \"Seed database\", status: \"pending\", priority: \"medium\" },\n *   ]}\n * />\n * ```\n */\nexport function AiTaskList({\n  tasks,\n  title,\n  icon,\n  showProgress = true,\n  children,\n  className,\n  ...props\n}: AiTaskListProps) {\n  const completed = tasks.filter((t) => t.status === \"completed\").length;\n  const total = tasks.filter((t) => t.status !== \"cancelled\").length;\n\n  return (\n    <div className={cn(\"flex flex-col gap-1\", className)} {...props}>\n      {/* Header */}\n      {(title || showProgress) && (\n        <div className=\"flex items-center justify-between gap-2 pb-0.5\">\n          <div className=\"flex items-center gap-1.5\">\n            {icon &&\n              (() => {\n                const Icon = icon;\n                return <Icon className=\"size-3.5 text-sf-subtle\" />;\n              })()}\n            {title && (\n              <Text size=\"sm\" variant=\"secondary\" wrap=\"shrink\" as=\"span\">\n                {title}\n              </Text>\n            )}\n          </div>\n          {showProgress && total > 0 && (\n            <span className=\"text-xs tabular-nums text-sf-subtle/60\">\n              {completed}/{total}\n            </span>\n          )}\n        </div>\n      )}\n\n      {/* Tasks */}\n      <div className=\"flex flex-col\">\n        {tasks.map((task) => (\n          <AiTaskListItem key={task.id} task={task} />\n        ))}\n      </div>\n\n      {/* Progress bar */}\n      {showProgress && total > 0 && (\n        <div className=\"mt-1 h-0.5 overflow-hidden rounded-full bg-sf-tint\">\n          <div\n            className=\"h-full rounded-full bg-sf-brand/60 transition-[width] duration-300 ease-out\"\n            style={{ width: `${(completed / total) * 100}%` }}\n          />\n        </div>\n      )}\n\n      {children}\n    </div>\n  );\n}\n\nAiTaskList.displayName = \"AiTaskList\";\n"],"mappings":";;;;;AASA,IAAa,2BAA2B,EAAE;AAC1C,IAAa,mCAAmC,EAAE;AA0ClD,IAAM,gBAGF;CACF,SAAS;EACP,cAAc;EACd,eAAe;EAChB;CACD,aAAa;EACX,cAAc;EACd,eAAe;EAChB;CACD,WAAW;EACT,cAAc;EACd,eAAe;EAChB;CACD,WAAW;EACT,cAAc;EACd,eAAe;EAChB;CACF;AAED,IAAM,eAA+C;CACnD,MAAM;CACN,QAAQ;CACR,KAAK;CACN;;;;AAOD,SAAgB,eAAe,EAC7B,MACA,WACA,GAAG,SACmB;CACtB,MAAM,SAAS,cAAc,KAAK;AAElC,QACE,qBAAC,OAAD;EAAK,WAAW,GAAG,+BAA+B,UAAU;EAAE,GAAI;YAAlE;GACE,oBAAC,QAAD;IACE,eAAA;IACA,WAAW,GACT,iDACA,OAAO,aACR;IACD,CAAA;GACF,oBAAC,MAAD;IACE,MAAK;IACL,MAAK;IACL,IAAG;IACH,qBAAqB,GAAG,gBAAgB,OAAO,cAAc;cAE5D,KAAK;IACD,CAAA;GACN,KAAK,YACJ,oBAAC,QAAD;IACE,WAAW,GACT,qCACA,aAAa,KAAK,UACnB;IACD,OAAO,GAAG,KAAK,SAAS;IACxB,CAAA;GAEA;;;AAIV,eAAe,cAAc;;;;;;;;;;;;;;;;;;;;AAuB7B,SAAgB,WAAW,EACzB,OACA,OACA,MACA,eAAe,MACf,UACA,WACA,GAAG,SACe;CAClB,MAAM,YAAY,MAAM,QAAQ,MAAM,EAAE,WAAW,YAAY,CAAC;CAChE,MAAM,QAAQ,MAAM,QAAQ,MAAM,EAAE,WAAW,YAAY,CAAC;AAE5D,QACE,qBAAC,OAAD;EAAK,WAAW,GAAG,uBAAuB,UAAU;EAAE,GAAI;YAA1D;IAEI,SAAS,iBACT,qBAAC,OAAD;IAAK,WAAU;cAAf,CACE,qBAAC,OAAD;KAAK,WAAU;eAAf,CACG,QAGU,oBADM,MACN,EAAM,WAAU,2BAA4B,CAAA,EAEtD,SACC,oBAAC,MAAD;MAAM,MAAK;MAAK,SAAQ;MAAY,MAAK;MAAS,IAAG;gBAClD;MACI,CAAA,CAEL;QACL,gBAAgB,QAAQ,KACvB,qBAAC,QAAD;KAAM,WAAU;eAAhB;MACG;MAAU;MAAE;MACR;OAEL;;GAIR,oBAAC,OAAD;IAAK,WAAU;cACZ,MAAM,KAAK,SACV,oBAAC,gBAAD,EAAoC,MAAQ,EAAvB,KAAK,GAAkB,CAC5C;IACE,CAAA;GAGL,gBAAgB,QAAQ,KACvB,oBAAC,OAAD;IAAK,WAAU;cACb,oBAAC,OAAD;KACE,WAAU;KACV,OAAO,EAAE,OAAO,GAAI,YAAY,QAAS,IAAI,IAAI;KACjD,CAAA;IACE,CAAA;GAGP;GACG;;;AAIV,WAAW,cAAc"}
+{"version":3,"file":"ai-task-list-C_UQYpk9.js","names":[],"sources":["../src/components/ai-task-list/ai-task-list.tsx"],"sourcesContent":["\"use client\";\n\nimport type { ElementType, HTMLAttributes, ReactNode } from \"react\";\n\nimport { cn } from \"../../utils/cn\";\nimport { Text } from \"../text\";\n\n// ─── Variants ────────────────────────────────────────────────────────────────\n\nexport const SF_AI_TASK_LIST_VARIANTS = {} as const;\nexport const SF_AI_TASK_LIST_DEFAULT_VARIANTS = {} as const;\n\n// ─── Types ────────────────────────────────────────────────────────────────────\n\nexport type AiTaskStatus =\n  | \"pending\"\n  | \"in_progress\"\n  | \"completed\"\n  | \"cancelled\";\n\nexport type AiTaskPriority = \"high\" | \"medium\" | \"low\";\n\nexport type AiTaskItem = {\n  /** Unique task identifier. */\n  id: string;\n  /** Task description. */\n  content: string;\n  /** Current status. */\n  status: AiTaskStatus;\n  /** Priority level. */\n  priority?: AiTaskPriority;\n};\n\nexport type AiTaskListProps = Omit<HTMLAttributes<HTMLDivElement>, \"title\"> & {\n  /** List of tasks. */\n  tasks: AiTaskItem[];\n  /** Optional title above the task list. */\n  title?: string;\n  /** Custom icon for the title area. */\n  icon?: ElementType;\n  /** Show a progress summary (e.g. \"3 / 7 done\"). Default: `true`. */\n  showProgress?: boolean;\n  /** Content rendered below the task list. */\n  children?: ReactNode;\n};\n\nexport type AiTaskListItemProps = HTMLAttributes<HTMLDivElement> & {\n  task: AiTaskItem;\n};\n\n// ─── Status config ────────────────────────────────────────────────────────────\n\nconst STATUS_CONFIG: Record<\n  AiTaskStatus,\n  { dotClassName: string; textClassName: string }\n> = {\n  pending: {\n    dotClassName: \"bg-sf-subtle/30\",\n    textClassName: \"text-sf-subtle\",\n  },\n  in_progress: {\n    dotClassName: \"bg-sf-brand\",\n    textClassName: \"text-sf-default\",\n  },\n  completed: {\n    dotClassName: \"bg-sf-success\",\n    textClassName: \"text-sf-subtle/60 line-through\",\n  },\n  cancelled: {\n    dotClassName: \"bg-sf-subtle/30\",\n    textClassName: \"text-sf-subtle/40 line-through\",\n  },\n};\n\nconst PRIORITY_DOT: Record<AiTaskPriority, string> = {\n  high: \"bg-sf-danger\",\n  medium: \"bg-sf-warning\",\n  low: \"bg-sf-subtle\",\n};\n\n// ─── AiTaskListItem ──────────────────────────────────────────────────────────\n\n/**\n * Single task item with status icon, content, and optional priority dot.\n */\nexport function AiTaskListItem({\n  task,\n  className,\n  ...props\n}: AiTaskListItemProps) {\n  const config = STATUS_CONFIG[task.status];\n\n  return (\n    <div className={cn(\"flex items-start gap-2 py-1\", className)} {...props}>\n      <span\n        aria-hidden\n        className={cn(\n          \"mt-[0.4375rem] size-1.5 shrink-0 rounded-full\",\n          config.dotClassName\n        )}\n      />\n      <Text\n        size=\"sm\"\n        wrap=\"shrink\"\n        as=\"span\"\n        DANGEROUS_className={cn(\"min-w-0 grow\", config.textClassName)}\n      >\n        {task.content}\n      </Text>\n      {task.priority && (\n        <span\n          className={cn(\n            \"mt-2 size-1 shrink-0 rounded-full\",\n            PRIORITY_DOT[task.priority]\n          )}\n          title={`${task.priority} priority`}\n        />\n      )}\n    </div>\n  );\n}\n\nAiTaskListItem.displayName = \"AiTaskListItem\";\n\n// ─── AiTaskList ──────────────────────────────────────────────────────────────\n\n/**\n * Task progress list. Renders structured tasks from the harness `task_write`\n * tool. Typically rendered inside the `PromptInputBackLayer` or inline in\n * conversation.\n *\n * Maps to harness event: `task_updated`.\n *\n * @example\n * ```tsx\n * <AiTaskList\n *   title=\"Current tasks\"\n *   tasks={[\n *     { id: \"1\", content: \"Read config file\", status: \"completed\", priority: \"high\" },\n *     { id: \"2\", content: \"Run migrations\", status: \"in_progress\", priority: \"high\" },\n *     { id: \"3\", content: \"Seed database\", status: \"pending\", priority: \"medium\" },\n *   ]}\n * />\n * ```\n */\nexport function AiTaskList({\n  tasks,\n  title,\n  icon,\n  showProgress = true,\n  children,\n  className,\n  ...props\n}: AiTaskListProps) {\n  const completed = tasks.filter((t) => t.status === \"completed\").length;\n  const total = tasks.filter((t) => t.status !== \"cancelled\").length;\n\n  return (\n    <div className={cn(\"flex flex-col gap-1\", className)} {...props}>\n      {/* Header */}\n      {(title || showProgress) && (\n        <div className=\"flex items-center justify-between gap-2 pb-0.5\">\n          <div className=\"flex items-center gap-1.5\">\n            {icon &&\n              (() => {\n                const Icon = icon;\n                return <Icon className=\"size-3.5 text-sf-subtle\" />;\n              })()}\n            {title && (\n              <Text size=\"sm\" variant=\"secondary\" wrap=\"shrink\" as=\"span\">\n                {title}\n              </Text>\n            )}\n          </div>\n          {showProgress && total > 0 && (\n            <span className=\"text-xs tabular-nums text-sf-subtle/60\">\n              {completed}/{total}\n            </span>\n          )}\n        </div>\n      )}\n\n      {/* Tasks */}\n      <div className=\"flex flex-col\">\n        {tasks.map((task) => (\n          <AiTaskListItem key={task.id} task={task} />\n        ))}\n      </div>\n\n      {/* Progress bar */}\n      {showProgress && total > 0 && (\n        <div className=\"mt-1 h-0.5 overflow-hidden rounded-full bg-sf-tint\">\n          <div\n            className=\"h-full rounded-full bg-sf-brand/60 transition-[width] duration-300 ease-out\"\n            style={{ width: `${(completed / total) * 100}%` }}\n          />\n        </div>\n      )}\n\n      {children}\n    </div>\n  );\n}\n\nAiTaskList.displayName = \"AiTaskList\";\n"],"mappings":";;;;;AASA,IAAa,2BAA2B,CAAC;AACzC,IAAa,mCAAmC,CAAC;AA0CjD,IAAM,gBAGF;CACF,SAAS;EACP,cAAc;EACd,eAAe;CACjB;CACA,aAAa;EACX,cAAc;EACd,eAAe;CACjB;CACA,WAAW;EACT,cAAc;EACd,eAAe;CACjB;CACA,WAAW;EACT,cAAc;EACd,eAAe;CACjB;AACF;AAEA,IAAM,eAA+C;CACnD,MAAM;CACN,QAAQ;CACR,KAAK;AACP;;;;AAOA,SAAgB,eAAe,EAC7B,MACA,WACA,GAAG,SACmB;CACtB,MAAM,SAAS,cAAc,KAAK;CAElC,OACE,qBAAC,OAAD;EAAK,WAAW,GAAG,+BAA+B,SAAS;EAAG,GAAI;YAAlE;GACE,oBAAC,QAAD;IACE,eAAA;IACA,WAAW,GACT,iDACA,OAAO,YACT;GACD,CAAA;GACD,oBAAC,MAAD;IACE,MAAK;IACL,MAAK;IACL,IAAG;IACH,qBAAqB,GAAG,gBAAgB,OAAO,aAAa;cAE3D,KAAK;GACF,CAAA;GACL,KAAK,YACJ,oBAAC,QAAD;IACE,WAAW,GACT,qCACA,aAAa,KAAK,SACpB;IACA,OAAO,GAAG,KAAK,SAAS;GACzB,CAAA;EAEA;;AAET;AAEA,eAAe,cAAc;;;;;;;;;;;;;;;;;;;;AAuB7B,SAAgB,WAAW,EACzB,OACA,OACA,MACA,eAAe,MACf,UACA,WACA,GAAG,SACe;CAClB,MAAM,YAAY,MAAM,QAAQ,MAAM,EAAE,WAAW,WAAW,EAAE;CAChE,MAAM,QAAQ,MAAM,QAAQ,MAAM,EAAE,WAAW,WAAW,EAAE;CAE5D,OACE,qBAAC,OAAD;EAAK,WAAW,GAAG,uBAAuB,SAAS;EAAG,GAAI;YAA1D;IAEI,SAAS,iBACT,qBAAC,OAAD;IAAK,WAAU;cAAf,CACE,qBAAC,OAAD;KAAK,WAAU;eAAf,CACG,eACQ;MAEL,OAAO,oBAAC,MAAD,EAAM,WAAU,0BAA2B,CAAA;KACpD,GAAG,GACJ,SACC,oBAAC,MAAD;MAAM,MAAK;MAAK,SAAQ;MAAY,MAAK;MAAS,IAAG;gBAClD;KACG,CAAA,CAEL;QACJ,gBAAgB,QAAQ,KACvB,qBAAC,QAAD;KAAM,WAAU;eAAhB;MACG;MAAU;MAAE;KACT;MAEL;;GAIP,oBAAC,OAAD;IAAK,WAAU;cACZ,MAAM,KAAK,SACV,oBAAC,gBAAD,EAAoC,KAAO,GAAtB,KAAK,EAAiB,CAC5C;GACE,CAAA;GAGJ,gBAAgB,QAAQ,KACvB,oBAAC,OAAD;IAAK,WAAU;cACb,oBAAC,OAAD;KACE,WAAU;KACV,OAAO,EAAE,OAAO,GAAI,YAAY,QAAS,IAAI,GAAG;IACjD,CAAA;GACE,CAAA;GAGN;EACE;;AAET;AAEA,WAAW,cAAc"}

package/dist/{ai-timeline-C42tOUT8.js → ai-timeline-CePL1LOU.js}

@@ -1,5 +1,5 @@
 "use client";
-import { t as cn } from "./cn-YROP2_ox.js";
+import { t as cn } from "./cn-CmAOpn49.js";
 import { forwardRef, useCallback, useMemo, useRef, useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { BrainIcon, CaretDownIcon, CheckCircleIcon, CircleDashedIcon, CodeIcon, LightningIcon, MagnifyingGlassIcon, RobotIcon, ShieldWarningIcon, SpinnerGapIcon, WrenchIcon, XCircleIcon } from "@phosphor-icons/react";
@@ -36,7 +36,7 @@ function getAgentIcon(agentType, customIcon) {
 }
 function getModelShort(modelId) {
 	if (!modelId) return "";
-	return modelId.split("/").pop()?.replace(/^claude-/, "").replace(/-\d+$/, "") ?? "";
+	return modelId.split("/").pop()?.replace(/^claude-/u, "").replace(/-\d+$/u, "") ?? "";
 }
 function formatMs(ms) {
 	const s = Math.round(ms / 100) / 10;
@@ -370,4 +370,4 @@ AiTimeline.displayName = "AiTimeline";
 //#endregion
 export { SF_AI_TIMELINE_VARIANTS as i, AiTimelineLane as n, SF_AI_TIMELINE_DEFAULT_VARIANTS as r, AiTimeline as t };
 
-//# sourceMappingURL=ai-timeline-C42tOUT8.js.map
+//# sourceMappingURL=ai-timeline-CePL1LOU.js.map

package/dist/ai-timeline-CePL1LOU.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ai-timeline-CePL1LOU.js","names":[],"sources":["../src/components/ai-timeline/ai-timeline.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n  BrainIcon,\n  CaretDownIcon,\n  CheckCircleIcon,\n  CircleDashedIcon,\n  CodeIcon,\n  LightningIcon,\n  MagnifyingGlassIcon,\n  RobotIcon,\n  ShieldWarningIcon,\n  SpinnerGapIcon,\n  WrenchIcon,\n  XCircleIcon,\n} from \"@phosphor-icons/react\";\nimport type { ComponentProps, ElementType, ReactNode } from \"react\";\nimport { forwardRef, useCallback, useMemo, useRef, useState } from \"react\";\n\nimport { cn } from \"../../utils/cn\";\n\n// ─── Variants ────────────────────────────────────────────────────────────────\n\nexport const SF_AI_TIMELINE_VARIANTS = {\n  density: {\n    comfortable: { classes: \"\", description: \"Taller lanes with more padding\" },\n    compact: { classes: \"\", description: \"Tight lanes for dense views\" },\n  },\n} as const;\n\nexport const SF_AI_TIMELINE_DEFAULT_VARIANTS = {\n  density: \"comfortable\",\n} as const;\n\nexport type SFAiTimelineDensity = keyof typeof SF_AI_TIMELINE_VARIANTS.density;\n\n// ─── Block types ─────────────────────────────────────────────────────────────\n\n/** Visual type of a timeline block — controls color and icon. */\nexport type AiTimelineBlockType =\n  | \"running\" // brand blue — agent actively generating\n  | \"tool_call\" // amber — executing a tool\n  | \"waiting\" // gray — idle/blocked\n  | \"approval\" // purple — waiting for human approval\n  | \"completed\" // green — successfully finished\n  | \"error\"; // red — failed\n\n/** A colored segment on a lane representing a period of activity. */\nexport interface AiTimelineBlock {\n  /** Unique ID for this block. */\n  id: string;\n  /** Visual type (controls color). */\n  type: AiTimelineBlockType;\n  /** Wall-clock ms when this activity started. */\n  startMs: number;\n  /**\n   * Wall-clock ms when this activity ended.\n   * Undefined means still active — the block extends to \"now\".\n   */\n  endMs?: number;\n  /** Short label shown inside the block when space allows. */\n  label?: string;\n  /** Longer description shown in the expanded detail panel. */\n  description?: string;\n  /** Extra detail content shown when the block is expanded. */\n  detail?: ReactNode;\n}\n\n// ─── Lane props ───────────────────────────────────────────────────────────────\n\nexport type AiTimelineLaneProps = Omit<ComponentProps<\"div\">, \"children\"> & {\n  /** Lane label (agent name). */\n  label: string;\n  /** Agent type string for icon selection. */\n  agentType?: string;\n  /** Model ID shown as a subtle badge. */\n  modelId?: string;\n  /** Current lane status — controls the label icon. */\n  status?: \"idle\" | \"running\" | \"completed\" | \"error\";\n  /** Ordered activity blocks for this lane. */\n  blocks: AiTimelineBlock[];\n  /** Timeline origin (ms) — same as AiTimeline timeOrigin. */\n  timeOrigin: number;\n  /** Current \"now\" timestamp (ms) for live blocks. */\n  nowMs: number;\n  /** Pixels per millisecond (zoom level). */\n  pxPerMs: number;\n  /** Whether the lane is expanded to show block details. */\n  defaultExpanded?: boolean;\n  /** Callback when a block is clicked. */\n  onBlockClick?: (block: AiTimelineBlock) => void;\n  /** Custom icon override. */\n  icon?: ElementType;\n  /** Lane height variant. */\n  density?: SFAiTimelineDensity;\n};\n\n// ─── Timeline props ───────────────────────────────────────────────────────────\n\nexport type AiTimelineProps = Omit<ComponentProps<\"div\">, \"children\"> & {\n  /**\n   * Wall-clock ms for the timeline origin (t=0).\n   * Defaults to the startMs of the first block across all lanes.\n   */\n  timeOrigin?: number;\n  /**\n   * Pixels per second of elapsed time.\n   * Controls horizontal zoom level.\n   * @default 30\n   */\n  pixelsPerSecond?: number;\n  /**\n   * Whether to show a pulsing \"now\" marker at the live edge.\n   * @default true\n   */\n  showNowMarker?: boolean;\n  /**\n   * Current timestamp in ms. Used to render the \"now\" marker and open-ended\n   * block widths. Pass a stable `useState` value to prevent hydration shifts.\n   * When omitted, `Date.now()` is called at render time (fine for live views\n   * driven by a ticking parent, not suitable for SSR).\n   */\n  nowMs?: number;\n  /** Lane density variant. @default \"comfortable\" */\n  density?: SFAiTimelineDensity;\n  /** Children should be `AiTimelineLane` components. */\n  children?: ReactNode;\n};\n\n// ─── Helpers ──────────────────────────────────────────────────────────────────\n\nconst AGENT_ICONS: Record<string, ElementType> = {\n  explore: MagnifyingGlassIcon,\n  search: MagnifyingGlassIcon,\n  execute: CodeIcon,\n  code: CodeIcon,\n  plan: BrainIcon,\n  think: BrainIcon,\n  tool: WrenchIcon,\n  build: WrenchIcon,\n  main: LightningIcon,\n};\n\nfunction getAgentIcon(\n  agentType?: string,\n  customIcon?: ElementType\n): ElementType {\n  if (customIcon) return customIcon;\n  if (agentType) {\n    const lower = agentType.toLowerCase();\n    for (const [key, icon] of Object.entries(AGENT_ICONS)) {\n      if (lower.includes(key)) return icon;\n    }\n  }\n  return RobotIcon;\n}\n\nfunction getModelShort(modelId?: string) {\n  if (!modelId) return \"\";\n  return (\n    modelId\n      .split(\"/\")\n      .pop()\n      ?.replace(/^claude-/u, \"\")\n      .replace(/-\\d+$/u, \"\") ?? \"\"\n  );\n}\n\nfunction formatMs(ms: number) {\n  const s = Math.round(ms / 100) / 10;\n  if (s < 60) return `${s}s`;\n  return `${Math.floor(s / 60)}m ${Math.round(s % 60)}s`;\n}\n\n// Block colors — all semantic SignalFlare tokens, no raw Tailwind colors\nconst BLOCK_COLORS: Record<AiTimelineBlockType, string> = {\n  running: \"bg-sf-brand text-sf-inverse\",\n  tool_call: \"bg-sf-warning text-sf-inverse\",\n  waiting: \"bg-sf-fill text-sf-subtle\",\n  approval: \"bg-sf-info text-sf-inverse\",\n  completed: \"bg-sf-brand/60 text-sf-inverse\",\n  error: \"bg-sf-danger text-sf-inverse\",\n};\n\n// Hover is a uniform subtle brightness lift — no per-type color shifting\nconst BLOCK_HOVER = \"hover:brightness-110 hover:shadow-sm\";\n\nfunction BlockIcon({ type }: { type: AiTimelineBlockType }) {\n  switch (type) {\n    case \"running\":\n      return <SpinnerGapIcon size={8} className=\"animate-spin\" />;\n    case \"tool_call\":\n      return <WrenchIcon size={8} />;\n    case \"approval\":\n      return <ShieldWarningIcon size={8} />;\n    case \"completed\":\n      return <CheckCircleIcon size={8} />;\n    case \"error\":\n      return <XCircleIcon size={8} />;\n    default:\n      return <CircleDashedIcon size={8} />;\n  }\n}\n\n// ─── AiTimelineBlock (rendered) ───────────────────────────────────────────────\n\nfunction TimelineBlockSegment({\n  block,\n  timeOrigin,\n  nowMs,\n  pxPerMs,\n  laneHeight,\n  onBlockClick,\n  rowIndex = 0,\n  rowCount = 1,\n}: {\n  block: AiTimelineBlock;\n  timeOrigin: number;\n  nowMs: number;\n  pxPerMs: number;\n  laneHeight: number;\n  onBlockClick?: (block: AiTimelineBlock) => void;\n  rowIndex?: number;\n  rowCount?: number;\n}) {\n  const left = Math.max(0, (block.startMs - timeOrigin) * pxPerMs);\n  const end = block.endMs ?? nowMs;\n  const width = Math.max(4, (end - block.startMs) * pxPerMs);\n  const durationMs = end - block.startMs;\n\n  const MIN_LABEL_PX = 40;\n  // Short blocks get sharp corners to avoid weird rounded look when overlaid\n  const isShort = width < 20;\n  const roundedClass = isShort\n    ? \"rounded-none\"\n    : width < 40\n      ? \"rounded-sm\"\n      : \"rounded-md\";\n\n  // Calculate vertical position for overlapping blocks\n  // Blocks that overlap in time stack vertically, centered within the lane\n  const blockHeight = laneHeight - 8;\n  const innerPadding = 2;\n  const availableHeight = blockHeight - innerPadding * 2;\n  const rowHeight = availableHeight / rowCount;\n  const topOffset = innerPadding + rowIndex * rowHeight;\n\n  return (\n    <button\n      type=\"button\"\n      aria-label={block.label ?? block.type}\n      title={block.description ?? block.label}\n      onClick={onBlockClick ? () => onBlockClick(block) : undefined}\n      className={cn(\n        \"group absolute transition-[width] duration-150\",\n        roundedClass,\n        BLOCK_COLORS[block.type],\n        onBlockClick ? BLOCK_HOVER : \"cursor-default\",\n        \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-sf-ring\",\n        \"flex items-center gap-1 overflow-hidden px-1.5\"\n      )}\n      style={{\n        left,\n        width,\n        height: rowHeight - 1,\n        top: topOffset,\n      }}\n    >\n      <BlockIcon type={block.type} />\n      {width >= MIN_LABEL_PX && block.label && (\n        <span className=\"truncate text-[9px] font-medium leading-none\">\n          {block.label}\n        </span>\n      )}\n      {width >= MIN_LABEL_PX && (\n        <span className=\"ml-auto shrink-0 text-[8px] opacity-70\">\n          {formatMs(durationMs)}\n        </span>\n      )}\n    </button>\n  );\n}\n\n/**\n * Calculate row assignments for blocks to avoid overlap.\n * Returns arrays of blocks grouped by row, where no blocks in a row overlap in time.\n */\nfunction computeBlockRows(blocks: AiTimelineBlock[]): AiTimelineBlock[][] {\n  if (blocks.length === 0) return [];\n\n  // Sort blocks by start time\n  const sorted = [...blocks].sort((a, b) => a.startMs - b.startMs);\n  const rows: AiTimelineBlock[][] = [];\n\n  for (const block of sorted) {\n    // Find the first row where this block doesn't overlap with any existing block\n    let placed = false;\n    for (const row of rows) {\n      const overlaps = row.some(\n        (existing) =>\n          block.startMs < (existing.endMs ?? Infinity) &&\n          (block.endMs ?? Infinity) > existing.startMs\n      );\n      if (!overlaps) {\n        row.push(block);\n        placed = true;\n        break;\n      }\n    }\n    if (!placed) {\n      // Start a new row\n      rows.push([block]);\n    }\n  }\n\n  return rows;\n}\n\n// ─── AiTimelineLane ───────────────────────────────────────────────────────────\n\nconst LANE_HEIGHT_COMFORTABLE = 40;\nconst LANE_HEIGHT_COMPACT = 28;\nconst LABEL_WIDTH = 128;\n\n/**\n * `AiTimelineLane` — a single horizontal swim lane within an `AiTimeline`.\n *\n * Shows one agent's activity as colored blocks on a time axis. Blocks\n * represent periods of activity: running, tool calls, waiting, etc.\n *\n * Consumed by `AiTimeline` — pass lanes as children.\n */\nexport const AiTimelineLane = forwardRef<HTMLDivElement, AiTimelineLaneProps>(\n  (\n    {\n      label,\n      agentType,\n      modelId,\n      status = \"idle\",\n      blocks,\n      timeOrigin,\n      nowMs,\n      pxPerMs,\n      defaultExpanded = false,\n      onBlockClick,\n      icon,\n      density = \"comfortable\",\n      className,\n      ...props\n    },\n    ref\n  ) => {\n    const [expanded, setExpanded] = useState(defaultExpanded);\n    const Icon = getAgentIcon(agentType, icon);\n    const modelShort = getModelShort(modelId);\n\n    // Compute block rows to handle overlapping blocks\n    const blockRows = useMemo(() => computeBlockRows(blocks), [blocks]);\n    const rowCount = blockRows.length;\n\n    // Lane height scales with number of rows for overlapping blocks\n    const baseLaneH =\n      density === \"compact\" ? LANE_HEIGHT_COMPACT : LANE_HEIGHT_COMFORTABLE;\n    const laneH = rowCount > 1 ? baseLaneH * rowCount : baseLaneH;\n\n    // Total timeline width needed for this lane\n    const maxEnd = useMemo(() => {\n      if (!blocks.length) return timeOrigin;\n      return Math.max(...blocks.map((b) => b.endMs ?? nowMs));\n    }, [blocks, timeOrigin, nowMs]);\n\n    const totalWidth = Math.max(0, (maxEnd - timeOrigin) * pxPerMs);\n\n    return (\n      <div\n        ref={ref}\n        className={cn(\"border-b border-sf-line last:border-b-0\", className)}\n        {...props}\n      >\n        {/* Lane row */}\n        <div className=\"flex\" style={{ height: laneH }}>\n          {/* Label sidebar */}\n          <div\n            className=\"flex shrink-0 items-center gap-2 border-r border-sf-line bg-sf-base px-3\"\n            style={{ width: LABEL_WIDTH }}\n          >\n            {/* Expand toggle (only when there are expandable blocks) */}\n            {blocks.some((b) => b.detail) && (\n              <button\n                type=\"button\"\n                aria-label={expanded ? \"Collapse lane\" : \"Expand lane\"}\n                onClick={() => setExpanded((v) => !v)}\n                className=\"shrink-0 text-sf-subtle hover:text-sf-default focus-visible:outline-none\"\n              >\n                <CaretDownIcon\n                  size={10}\n                  className={cn(\n                    \"transition-transform\",\n                    expanded && \"rotate-180\"\n                  )}\n                />\n              </button>\n            )}\n\n            {/* Agent icon */}\n            <div\n              className={cn(\n                \"flex shrink-0 items-center justify-center rounded\",\n                density === \"compact\" ? \"size-5\" : \"size-6\",\n                status === \"running\"\n                  ? \"text-sf-brand\"\n                  : status === \"completed\"\n                    ? \"text-sf-success\"\n                    : status === \"error\"\n                      ? \"text-sf-danger\"\n                      : \"text-sf-subtle\"\n              )}\n            >\n              {status === \"running\" ? (\n                <SpinnerGapIcon\n                  size={density === \"compact\" ? 12 : 14}\n                  className=\"animate-spin\"\n                />\n              ) : (\n                <Icon size={density === \"compact\" ? 12 : 14} />\n              )}\n            </div>\n\n            {/* Name + model */}\n            <div className=\"min-w-0 flex-1\">\n              <div\n                className={cn(\n                  \"truncate font-medium text-sf-default\",\n                  density === \"compact\" ? \"text-[10px]\" : \"text-xs\"\n                )}\n              >\n                {label}\n              </div>\n              {modelShort && density === \"comfortable\" && (\n                <div className=\"truncate font-mono text-[9px] text-sf-inactive\">\n                  {modelShort}\n                </div>\n              )}\n            </div>\n          </div>\n\n          {/* Blocks area */}\n          <div\n            className=\"relative flex-1 overflow-hidden\"\n            style={{ minWidth: totalWidth }}\n          >\n            {blockRows.map((row, rowIndex) =>\n              row.map((block) => (\n                <TimelineBlockSegment\n                  key={block.id}\n                  block={block}\n                  timeOrigin={timeOrigin}\n                  nowMs={nowMs}\n                  pxPerMs={pxPerMs}\n                  laneHeight={laneH}\n                  onBlockClick={onBlockClick}\n                  rowIndex={rowIndex}\n                  rowCount={rowCount}\n                />\n              ))\n            )}\n          </div>\n        </div>\n\n        {/* Expanded detail rows */}\n        {expanded &&\n          blocks\n            .filter((b) => b.detail)\n            .map((block) => (\n              <div\n                key={`detail-${block.id}`}\n                className=\"ml-[128px] border-t border-sf-line/50 bg-sf-recessed px-3 py-2\"\n              >\n                <div className=\"mb-1 flex items-center gap-1.5\">\n                  <span\n                    className={cn(\n                      \"size-1.5 rounded-full\",\n                      BLOCK_COLORS[block.type].split(\" \")[0]\n                    )}\n                  />\n                  <span className=\"text-[10px] font-medium text-sf-strong\">\n                    {block.label ?? block.type}\n                  </span>\n                  {block.endMs && (\n                    <span className=\"text-[10px] text-sf-subtle\">\n                      {formatMs(block.endMs - block.startMs)}\n                    </span>\n                  )}\n                </div>\n                <div className=\"text-xs text-sf-subtle\">{block.detail}</div>\n              </div>\n            ))}\n      </div>\n    );\n  }\n);\n\nAiTimelineLane.displayName = \"AiTimelineLane\";\n\n// ─── AiTimeline ───────────────────────────────────────────────────────────────\n\nconst TIME_AXIS_HEIGHT = 24;\n\n/** Format elapsed time for tick labels — shows seconds with 1 decimal when under 1 minute */\nfunction formatElapsed(ms: number): string {\n  if (ms < 60_000) {\n    const s = Math.round(ms / 100) / 10;\n    return `${s.toFixed(s % 1 === 0 ? 0 : 1)}s`;\n  }\n  const m = Math.floor(ms / 60_000);\n  const s = Math.round((ms % 60_000) / 1000);\n  return s > 0 ? `${m}m ${s}s` : `${m}m`;\n}\n\n/** Generate time axis tick marks spaced appropriately for the zoom level. */\nfunction generateTicks(\n  originMs: number,\n  nowMs: number,\n  pxPerMs: number,\n  totalWidth: number\n): Array<{ label: string; sublabel?: string; x: number }> {\n  const durationMs = nowMs - originMs;\n  const tickIntervalMs = (() => {\n    const pxPerSec = pxPerMs * 1000;\n    if (pxPerSec >= 100) return 1000; // 1s ticks\n    if (pxPerSec >= 30) return 5000; // 5s ticks\n    if (pxPerSec >= 10) return 10_000; // 10s ticks\n    if (pxPerSec >= 5) return 30_000; // 30s ticks\n    return 60_000; // 1min ticks\n  })();\n\n  const ticks: Array<{ label: string; sublabel?: string; x: number }> = [];\n  const firstTick = Math.ceil(originMs / tickIntervalMs) * tickIntervalMs;\n\n  for (let t = firstTick; t <= originMs + durationMs; t += tickIntervalMs) {\n    const elapsed = t - originMs;\n    const x = elapsed * pxPerMs;\n    if (x > totalWidth) break;\n    const label = formatElapsed(elapsed);\n    ticks.push({ label, x });\n  }\n  return ticks;\n}\n\n/**\n * `AiTimeline` — horizontal swim-lane timeline for commander-level orchestration.\n *\n * Displays multiple `AiTimelineLane` children on a shared time axis. Supports\n * live updating (a \"now\" marker follows the live edge), panning, and zoom via\n * `pixelsPerSecond`.\n *\n * @example\n * ```tsx\n * <AiTimeline\n *   timeOrigin={state.missionStartedAt}\n *   pixelsPerSecond={30}\n *   showNowMarker\n * >\n *   <AiTimelineLane\n *     label=\"Main\"\n *     blocks={mainLaneBlocks}\n *     timeOrigin={timeOrigin}\n *     nowMs={Date.now()}\n *     pxPerMs={pxPerMs}\n *   />\n *   <AiTimelineLane label=\"Explore\" blocks={exploreBlocks} ... />\n * </AiTimeline>\n * ```\n */\nexport const AiTimeline = forwardRef<HTMLDivElement, AiTimelineProps>(\n  (\n    {\n      timeOrigin,\n      pixelsPerSecond = 30,\n      showNowMarker = true,\n      nowMs: nowMsProp,\n      density: _density = SF_AI_TIMELINE_DEFAULT_VARIANTS.density,\n      className,\n      children,\n      ...props\n    },\n    ref\n  ) => {\n    // Use the provided stable nowMs, or fall back to Date.now().\n    // For SSR-safe demos, always pass a stable useState value as nowMs.\n    const nowMs = nowMsProp ?? Date.now();\n    const origin = timeOrigin ?? nowMs;\n    const pxPerMs = pixelsPerSecond / 1000;\n    const totalDurationMs = nowMs - origin;\n    const totalWidth = Math.max(400, totalDurationMs * pxPerMs + 120);\n    const nowX = totalDurationMs * pxPerMs;\n\n    const ticks = useMemo(\n      () => generateTicks(origin, nowMs, pxPerMs, totalWidth),\n      // eslint-disable-next-line react-hooks/exhaustive-deps\n      [origin, Math.floor(nowMs / 2000), pxPerMs, totalWidth]\n    );\n\n    const scrollRef = useRef<HTMLDivElement>(null);\n\n    // Scroll to keep the now-marker in view\n    const scrollToNow = useCallback(() => {\n      const el = scrollRef.current;\n      if (!el) return;\n      const targetScroll = LABEL_WIDTH + nowX - el.clientWidth * 0.85;\n      el.scrollLeft = Math.max(0, targetScroll);\n    }, [nowX]);\n\n    return (\n      <div\n        ref={ref}\n        className={cn(\n          \"relative overflow-hidden rounded-lg border border-sf-line bg-sf-base\",\n          className\n        )}\n        {...props}\n      >\n        {/* Scrollable horizontal container */}\n        <div ref={scrollRef} className=\"overflow-x-auto\">\n          <div style={{ minWidth: LABEL_WIDTH + totalWidth }}>\n            {/* Time axis */}\n            <div\n              className=\"flex border-b border-sf-line\"\n              style={{ height: TIME_AXIS_HEIGHT }}\n            >\n              {/* Label column spacer */}\n              <div\n                className=\"shrink-0 border-r border-sf-line bg-sf-elevated px-3\"\n                style={{ width: LABEL_WIDTH }}\n              >\n                <span className=\"text-[10px] font-medium uppercase tracking-wider text-sf-subtle\">\n                  Time\n                </span>\n              </div>\n              {/* Axis ticks */}\n              <div\n                className=\"relative flex-1 bg-sf-recessed\"\n                style={{ minWidth: totalWidth }}\n              >\n                {ticks.map((tick) => (\n                  <div\n                    key={tick.x}\n                    className=\"absolute top-0 flex flex-col items-center\"\n                    style={{ left: tick.x }}\n                  >\n                    <div className=\"h-2 w-px bg-sf-line\" />\n                    <span className=\"mt-0.5 font-mono text-[9px] text-sf-inactive\">\n                      +{tick.label}\n                    </span>\n                  </div>\n                ))}\n\n                {/* Now marker line */}\n                {showNowMarker && (\n                  <div\n                    className=\"absolute top-0 flex flex-col items-center\"\n                    style={{ left: nowX }}\n                  >\n                    <div className=\"h-2 w-px bg-sf-brand\" />\n                    <span className=\"mt-0.5 font-mono text-[9px] font-medium text-sf-brand\">\n                      now\n                    </span>\n                  </div>\n                )}\n              </div>\n            </div>\n\n            {/* Lanes — pass timeOrigin/nowMs/pxPerMs via context-like clone or expect them as props */}\n            <div className=\"relative\">\n              {/* Vertical grid lines at tick positions */}\n              <div className=\"pointer-events-none absolute inset-0 ml-[128px]\">\n                {ticks.map((tick) => (\n                  <div\n                    key={`grid-${tick.x}`}\n                    className=\"absolute top-0 h-full w-px bg-sf-line/50\"\n                    style={{ left: tick.x }}\n                  />\n                ))}\n                {/* Now marker vertical line */}\n                {showNowMarker && (\n                  <div\n                    className=\"absolute top-0 h-full w-px bg-sf-brand/30\"\n                    style={{ left: nowX }}\n                  />\n                )}\n              </div>\n\n              {children}\n            </div>\n          </div>\n        </div>\n\n        {/* Scroll-to-now button */}\n        {showNowMarker && (\n          <button\n            type=\"button\"\n            aria-label=\"Scroll to now\"\n            onClick={scrollToNow}\n            className={cn(\n              \"absolute right-2 top-1 rounded px-1.5 py-0.5 text-[9px] font-medium\",\n              \"bg-sf-brand/10 text-sf-brand hover:bg-sf-brand/20 transition-colors\",\n              \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-sf-ring\"\n            )}\n          >\n            → now\n          </button>\n        )}\n      </div>\n    );\n  }\n);\n\nAiTimeline.displayName = \"AiTimeline\";\n"],"mappings":"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"}

package/dist/{ai-tool-03jOTwUI.js → ai-tool-CfRcwmHT.js}

@@ -1,9 +1,9 @@
 "use client";
-import { t as cn } from "./cn-YROP2_ox.js";
-import { t as Text } from "./text-Cqryz7rk.js";
-import { t as Tooltip } from "./tooltip-g9lFsvcT.js";
-import { t as Button } from "./button-CO6-qPax.js";
-import { t as AiStatusBadge } from "./ai-status-badge-CSU_QOdz.js";
+import { t as cn } from "./cn-CmAOpn49.js";
+import { t as Text } from "./text-iQ0YUFNg.js";
+import { t as Tooltip } from "./tooltip-uobk6Oh-.js";
+import { t as Button } from "./button-BHOgXJRU.js";
+import { t as AiStatusBadge } from "./ai-status-badge-BZLczdkI.js";
 import { useEffect, useRef, useState } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import { BrainIcon, CaretDownIcon, ChatCircleIcon, CheckIcon, CircleIcon, CodeIcon, DatabaseIcon, FileTextIcon, GearIcon, GlobeIcon, ImageIcon, LightningIcon, MagnifyingGlassIcon, ShieldWarningIcon, SpinnerGapIcon, TerminalIcon, WarningCircleIcon, XCircleIcon } from "@phosphor-icons/react";
@@ -43,9 +43,12 @@ var TOOL_ICONS = {
 	settings: GearIcon,
 	code: CodeIcon
 };
+var EMPTY_DURATIONS = {};
+var EMPTY_SUMMARIES = {};
+var EMPTY_APPROVAL_STATES = {};
 /** Extract the display-friendly tool name from a tool part. */
 function getToolDisplayName(part) {
-	return part.toolName.replace("tool-", "").replace("Tool", "").replace(/([A-Z])/g, " $1").replace(/_/g, " ").replace(/^./, (s) => s.toUpperCase()).trim();
+	return part.toolName.replace("tool-", "").replace("Tool", "").replace(/([A-Z])/gu, " $1").replace(/_/gu, " ").replace(/^./u, (s) => s.toUpperCase()).trim();
 }
 /** Get the best-matching icon for a tool part. */
 function getToolIcon(part) {
@@ -265,6 +268,7 @@ function AiToolCall({ part, variant = "default", duration, summary, icon: Custom
 			children: [/* @__PURE__ */ jsxs(Collapsible.Trigger, {
 				render: /* @__PURE__ */ jsx("button", {
 					type: "button",
+					"aria-label": displayName,
 					className: cn("flex w-fit items-center gap-1.5 rounded px-1 py-0.5 text-left", "transition-colors hover:bg-sf-tint")
 				}),
 				children: [/* @__PURE__ */ jsx("span", {
@@ -389,6 +393,7 @@ function AiToolCallEphemeral({ part, approvalState, duration, summary, icon: _ic
 			children: [/* @__PURE__ */ jsxs(Collapsible.Trigger, {
 				render: /* @__PURE__ */ jsx("button", {
 					type: "button",
+					"aria-label": displayName,
 					className: cn("flex w-fit items-center gap-1.5 rounded px-1 py-0.5 text-left", "transition-colors hover:bg-sf-tint")
 				}),
 				children: [
@@ -469,7 +474,7 @@ function AiToolCallEphemeral({ part, approvalState, duration, summary, icon: _ic
 * <AiToolCallGroup parts={toolParts} label="3 tools ran" />
 * ```
 */
-function AiToolCallGroup({ parts, label, durations = {}, summaries = {}, approvalStates = {}, onApprove, onReject, defaultExpanded = false, className, ...props }) {
+function AiToolCallGroup({ parts, label, durations = EMPTY_DURATIONS, summaries = EMPTY_SUMMARIES, approvalStates = EMPTY_APPROVAL_STATES, onApprove, onReject, defaultExpanded = false, className, ...props }) {
 	const [isExpanded, setIsExpanded] = useState(defaultExpanded);
 	const completedCount = parts.filter((p) => p.state === "output-available").length;
 	const errorCount = parts.filter(hasToolError).length;
@@ -497,6 +502,7 @@ function AiToolCallGroup({ parts, label, durations = {}, summaries = {}, approva
 			children: [/* @__PURE__ */ jsxs(Collapsible.Trigger, {
 				render: /* @__PURE__ */ jsx("button", {
 					type: "button",
+					"aria-label": label ?? `${totalCount} tool calls`,
 					className: "flex w-fit items-center gap-3 px-3 py-2.5 text-left transition-colors hover:bg-sf-tint"
 				}),
 				children: [
@@ -522,7 +528,7 @@ function AiToolCallGroup({ parts, label, durations = {}, summaries = {}, approva
 					}),
 					/* @__PURE__ */ jsxs("div", {
 						className: "flex items-center gap-2",
-						children: [!isExpanded ? /* @__PURE__ */ jsxs("div", {
+						children: [isExpanded ? null : /* @__PURE__ */ jsxs("div", {
 							className: "flex -space-x-1",
 							children: [parts.slice(0, 5).map((p) => {
 								const Icon = getToolIcon(p);
@@ -534,7 +540,7 @@ function AiToolCallGroup({ parts, label, durations = {}, summaries = {}, approva
 								className: "flex size-6 items-center justify-center rounded-full border-2 border-sf-elevated bg-sf-tint text-[10px] text-sf-subtle",
 								children: ["+", parts.length - 5]
 							}) : null]
-						}) : null, /* @__PURE__ */ jsx(CaretDownIcon, { className: cn("size-4 text-sf-subtle transition-transform duration-200", !isExpanded && "-rotate-90") })]
+						}), /* @__PURE__ */ jsx(CaretDownIcon, { className: cn("size-4 text-sf-subtle transition-transform duration-200", !isExpanded && "-rotate-90") })]
 					})
 				]
 			}), /* @__PURE__ */ jsx(Collapsible.Panel, {
@@ -564,7 +570,7 @@ function AiToolCallGroup({ parts, label, durations = {}, summaries = {}, approva
 * <AiToolCallTimeline parts={toolParts} durations={{ id1: 230, id2: 540 }} />
 * ```
 */
-function AiToolCallTimeline({ parts, durations = {}, className, ...props }) {
+function AiToolCallTimeline({ parts, durations = EMPTY_DURATIONS, className, ...props }) {
 	return /* @__PURE__ */ jsx("div", {
 		className: cn("flex flex-wrap items-center gap-1 py-2", className),
 		...props,
@@ -604,4 +610,4 @@ function AiToolCallTimeline({ parts, durations = {}, className, ...props }) {
 //#endregion
 export { SF_AI_TOOL_VARIANTS as a, getToolIcon as c, hasToolResult as d, isToolLoading as f, SF_AI_TOOL_DEFAULT_VARIANTS as i, hasToolError as l, AiToolCallGroup as n, getToolDisplayName as o, AiToolCallTimeline as r, getToolErrorText as s, AiToolCall as t, hasToolOutputError as u };
 
-//# sourceMappingURL=ai-tool-03jOTwUI.js.map
+//# sourceMappingURL=ai-tool-CfRcwmHT.js.map