@epicbagel/saas-kit 0.0.0-stage → 1.1.0

package/dist/primitives/call-card.cjs

@@ -0,0 +1,195 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }"use client";
+"use client";
+
+
+var _chunk6T2EULKNcjs = require('../chunk-6T2EULKN.cjs');
+
+
+var _chunk373W6VADcjs = require('../chunk-373W6VAD.cjs');
+
+
+
+
+var _chunkW5HPHEE7cjs = require('../chunk-W5HPHEE7.cjs');
+
+
+
+
+var _chunkWABCLRBRcjs = require('../chunk-WABCLRBR.cjs');
+
+
+var _chunkVBPPFC7Xcjs = require('../chunk-VBPPFC7X.cjs');
+
+
+var _chunkKWLSBTB2cjs = require('../chunk-KWLSBTB2.cjs');
+
+// src/primitives/call-card.tsx
+var _react = require('react');
+var _lucidereact = require('lucide-react');
+var _jsxruntime = require('react/jsx-runtime');
+var CallCard = _react.forwardRef.call(void 0, 
+  function CallCard2({
+    title,
+    source,
+    timestamp,
+    duration,
+    participants,
+    summary,
+    summaryClampLines = 4,
+    segments,
+    transcript,
+    headerAside,
+    actions,
+    transcriptLabel = "Show transcript",
+    defaultTranscriptOpen = false,
+    transcriptOpen,
+    onTranscriptOpenChange,
+    onLoadTranscript,
+    loading = false,
+    className
+  }, ref) {
+    const [internalOpen, setInternalOpen] = _react.useState.call(void 0, defaultTranscriptOpen);
+    const [loadedOnce, setLoadedOnce] = _react.useState.call(void 0, defaultTranscriptOpen);
+    const open = _nullishCoalesce(transcriptOpen, () => ( internalOpen));
+    const summaryRef = _react.useRef.call(void 0, null);
+    const [summaryExpanded, setSummaryExpanded] = _react.useState.call(void 0, false);
+    const [summaryOverflows, setSummaryOverflows] = _react.useState.call(void 0, false);
+    _react.useEffect.call(void 0, () => {
+      const el = summaryRef.current;
+      if (el) setSummaryOverflows(el.scrollHeight - el.clientHeight > 4);
+    }, [summary]);
+    function handleOpenChange(next) {
+      if (next && !loadedOnce) {
+        setLoadedOnce(true);
+        _optionalChain([onLoadTranscript, 'optionalCall', _ => _()]);
+      }
+      if (transcriptOpen === void 0) setInternalOpen(next);
+      _optionalChain([onTranscriptOpenChange, 'optionalCall', _2 => _2(next)]);
+    }
+    const meta = [timestamp, source, duration].filter(Boolean);
+    const hasTranscript = segments && segments.length > 0 || transcript != null;
+    return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+      "div",
+      {
+        ref,
+        className: _chunkKWLSBTB2cjs.cn.call(void 0, 
+          "overflow-hidden rounded-xl border border-border bg-card text-card-foreground",
+          className
+        ),
+        children: [
+          /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex items-start gap-3 p-4 md:p-5", children: [
+            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+              "span",
+              {
+                className: "grid h-9 w-9 shrink-0 place-items-center rounded-full bg-muted text-muted-foreground",
+                "aria-hidden": true,
+                children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _lucidereact.PhoneCall, { className: "h-4 w-4" })
+              }
+            ),
+            /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "min-w-0 flex-1", children: [
+              /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex items-start justify-between gap-2", children: [
+                loading ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkVBPPFC7Xcjs.Skeleton, { className: "h-4 w-40" }) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "h3", { className: "min-w-0 flex-1 truncate text-sm font-semibold leading-tight", children: _nullishCoalesce(title, () => ( "Untitled call")) }),
+                headerAside && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "-mt-1 shrink-0", children: headerAside })
+              ] }),
+              meta.length > 0 && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { className: "mt-1 truncate text-xs text-muted-foreground", children: meta.map((m, i) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "span", { children: [
+                i > 0 && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "px-1.5 opacity-50", children: "\xB7" }),
+                m
+              ] }, i)) })
+            ] })
+          ] }),
+          participants && participants.length > 0 && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex flex-wrap gap-x-5 gap-y-3 border-t border-border px-4 py-3 md:px-5", children: participants.map((p, i) => {
+            const label = p.name || p.email || "Unknown";
+            return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex min-w-0 items-center gap-2", children: [
+              /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkWABCLRBRcjs.Avatar, { className: "h-7 w-7 text-[10px]", children: [
+                p.avatarUrl ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkWABCLRBRcjs.AvatarImage, { src: p.avatarUrl, alt: label }) : null,
+                /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkWABCLRBRcjs.AvatarFallback, { children: initials(label) })
+              ] }),
+              /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "min-w-0 leading-tight", children: [
+                /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { className: "truncate text-sm font-medium", children: label }),
+                p.email && p.name && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { className: "truncate text-xs text-muted-foreground", children: p.email })
+              ] })
+            ] }, i);
+          }) }),
+          (summary || loading && !title) && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "border-t border-border px-4 py-3 md:px-5", children: [
+            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk6T2EULKNcjs.Eyebrow, { className: "mb-1.5", children: "Summary" }),
+            loading ? /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "space-y-1.5", children: [
+              /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkVBPPFC7Xcjs.Skeleton, { className: "h-3 w-full" }),
+              /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkVBPPFC7Xcjs.Skeleton, { className: "h-3 w-4/5" })
+            ] }) : /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
+              /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+                "div",
+                {
+                  ref: summaryRef,
+                  className: "whitespace-pre-wrap text-sm leading-relaxed text-muted-foreground",
+                  style: summaryExpanded ? void 0 : {
+                    display: "-webkit-box",
+                    WebkitLineClamp: summaryClampLines,
+                    WebkitBoxOrient: "vertical",
+                    overflow: "hidden"
+                  },
+                  children: summary
+                }
+              ),
+              summaryOverflows && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+                "button",
+                {
+                  type: "button",
+                  onClick: () => setSummaryExpanded((v) => !v),
+                  className: "mt-1.5 text-xs font-medium text-muted-foreground transition-colors hover:text-foreground",
+                  children: summaryExpanded ? "Show less" : "Show more"
+                }
+              )
+            ] })
+          ] }),
+          hasTranscript && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+            _chunkW5HPHEE7cjs.Collapsible,
+            {
+              open,
+              onOpenChange: handleOpenChange,
+              className: "border-t border-border",
+              children: [
+                /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkW5HPHEE7cjs.CollapsibleTrigger, { asChild: true, children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+                  "button",
+                  {
+                    type: "button",
+                    className: "flex w-full items-center gap-1.5 px-4 py-3 text-xs font-medium text-muted-foreground transition-colors hover:text-foreground md:px-5",
+                    children: [
+                      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+                        _lucidereact.ChevronRight,
+                        {
+                          className: _chunkKWLSBTB2cjs.cn.call(void 0, 
+                            "h-3.5 w-3.5 transition-transform",
+                            open && "rotate-90"
+                          )
+                        }
+                      ),
+                      open ? "Hide transcript" : transcriptLabel
+                    ]
+                  }
+                ) }),
+                /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkW5HPHEE7cjs.CollapsibleContent, { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "max-h-80 space-y-3 overflow-y-auto px-4 pb-4 md:px-5", children: segments && segments.length > 0 ? segments.map((s, i) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { children: [
+                  s.speaker && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { className: "text-xs font-semibold text-foreground", children: s.speaker }),
+                  /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { className: "mt-0.5 whitespace-pre-wrap text-sm leading-relaxed text-muted-foreground", children: s.text })
+                ] }, i)) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+                  _chunk373W6VADcjs.Text,
+                  {
+                    variant: "muted",
+                    className: "whitespace-pre-wrap text-sm leading-relaxed",
+                    children: transcript
+                  }
+                ) }) })
+              ]
+            }
+          ),
+          actions && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex flex-wrap items-center justify-end gap-2 border-t border-border bg-muted/30 px-4 py-3 md:px-5", children: actions })
+        ]
+      }
+    );
+  }
+);
+function initials(value) {
+  return value.split(/\s+/).filter(Boolean).slice(0, 2).map((w) => w[0]).join("").toUpperCase();
+}
+
+
+exports.CallCard = CallCard;

package/dist/primitives/call-card.d.cts

@@ -0,0 +1,86 @@
+import * as React from 'react';
+import { ReactNode } from 'react';
+
+interface CallParticipant {
+    /** Display name. Falls back to email when absent. */
+    name?: string;
+    /** Email, shown muted under the name. */
+    email?: string;
+    /** Avatar image; initials are used when omitted. */
+    avatarUrl?: string | null;
+}
+interface CallSegment {
+    /** Who is speaking this turn. */
+    speaker: string;
+    /** What they said. */
+    text: string;
+}
+interface CallCardProps {
+    /** Call title, e.g. "Weekly catch up". */
+    title?: ReactNode;
+    /** Provider label, e.g. "Meeting notes". */
+    source?: ReactNode;
+    /** Pre-formatted date/time — anything renderable. */
+    timestamp?: ReactNode;
+    /** Optional duration, e.g. "32 min". */
+    duration?: ReactNode;
+    /** Who was on the call. Rendered as avatar + name (+ muted email). */
+    participants?: CallParticipant[];
+    /**
+     * Short, human summary — the gist of the call. Kept visually distinct
+     * from the transcript (it is NOT a raw transcript snippet). Long summaries
+     * (e.g. a notes provider's full write-up) are clamped with a "Show more" toggle.
+     */
+    summary?: ReactNode;
+    /** Lines of summary shown before the "Show more" clamp. Default 4. */
+    summaryClampLines?: number;
+    /** Speaker-labelled turns — the formatted transcript. */
+    segments?: CallSegment[];
+    /** Flat transcript fallback, used when there are no `segments`. */
+    transcript?: ReactNode;
+    /** Top-right slot — a status Badge or a quiet action (Dismiss / overflow). */
+    headerAside?: ReactNode;
+    /** Footer action row (Attach, Unlink, …). Right-aligned, on a tinted bar. */
+    actions?: ReactNode;
+    /** Transcript trigger label when collapsed. Default "Show transcript". */
+    transcriptLabel?: string;
+    /** Uncontrolled initial open state for the transcript. */
+    defaultTranscriptOpen?: boolean;
+    /** Controlled transcript open state. */
+    transcriptOpen?: boolean;
+    onTranscriptOpenChange?: (open: boolean) => void;
+    /** Fired the first time the transcript expands — lazy-load the content. */
+    onLoadTranscript?: () => void;
+    /** Skeleton placeholder while the call loads. */
+    loading?: boolean;
+    className?: string;
+}
+/**
+ * CallCard — the cross-app representation of a recorded call: a sectioned
+ * card with a clear hierarchy of title → who was on it → summary → transcript
+ * → actions. Built so every "calls" surface across the product family reads
+ * the same, instead of each app re-stacking divs.
+ *
+ * Why sections (header / participants / summary / transcript / actions) instead
+ * of one block: a call answers five questions — what, who, the gist, the detail,
+ * and what can I do — and each deserves its own weight. The transcript is lazy
+ * (`onLoadTranscript`) because it's often fetched on demand. The summary is a
+ * first-class slot, never the raw transcript text.
+ *
+ * ```tsx
+ * <CallCard
+ *   title="Weekly catch up"
+ *   source="Meeting notes"
+ *   timestamp="14 May 2026"
+ *   participants={[{ name: "Jane Doe", email: "jane@example.com" }]}
+ *   summary="Agreed next steps and a follow-up date."
+ *   segments={segments}
+ *   onLoadTranscript={fetchTranscript}
+ *   headerAside={<Button variant="ghost" size="sm">Dismiss</Button>}
+ *   actions={<Button size="sm">Attach</Button>}
+ * />
+ * ```
+ */
+declare const CallCard: React.ForwardRefExoticComponent<CallCardProps & React.RefAttributes<HTMLDivElement>>;
+
+export { CallCard, type CallCardProps, type CallParticipant, type CallSegment };

package/dist/primitives/call-card.d.ts

@@ -0,0 +1,86 @@
+import * as React from 'react';
+import { ReactNode } from 'react';
+
+interface CallParticipant {
+    /** Display name. Falls back to email when absent. */
+    name?: string;
+    /** Email, shown muted under the name. */
+    email?: string;
+    /** Avatar image; initials are used when omitted. */
+    avatarUrl?: string | null;
+}
+interface CallSegment {
+    /** Who is speaking this turn. */
+    speaker: string;
+    /** What they said. */
+    text: string;
+}
+interface CallCardProps {
+    /** Call title, e.g. "Weekly catch up". */
+    title?: ReactNode;
+    /** Provider label, e.g. "Meeting notes". */
+    source?: ReactNode;
+    /** Pre-formatted date/time — anything renderable. */
+    timestamp?: ReactNode;
+    /** Optional duration, e.g. "32 min". */
+    duration?: ReactNode;
+    /** Who was on the call. Rendered as avatar + name (+ muted email). */
+    participants?: CallParticipant[];
+    /**
+     * Short, human summary — the gist of the call. Kept visually distinct
+     * from the transcript (it is NOT a raw transcript snippet). Long summaries
+     * (e.g. a notes provider's full write-up) are clamped with a "Show more" toggle.
+     */
+    summary?: ReactNode;
+    /** Lines of summary shown before the "Show more" clamp. Default 4. */
+    summaryClampLines?: number;
+    /** Speaker-labelled turns — the formatted transcript. */
+    segments?: CallSegment[];
+    /** Flat transcript fallback, used when there are no `segments`. */
+    transcript?: ReactNode;
+    /** Top-right slot — a status Badge or a quiet action (Dismiss / overflow). */
+    headerAside?: ReactNode;
+    /** Footer action row (Attach, Unlink, …). Right-aligned, on a tinted bar. */
+    actions?: ReactNode;
+    /** Transcript trigger label when collapsed. Default "Show transcript". */
+    transcriptLabel?: string;
+    /** Uncontrolled initial open state for the transcript. */
+    defaultTranscriptOpen?: boolean;
+    /** Controlled transcript open state. */
+    transcriptOpen?: boolean;
+    onTranscriptOpenChange?: (open: boolean) => void;
+    /** Fired the first time the transcript expands — lazy-load the content. */
+    onLoadTranscript?: () => void;
+    /** Skeleton placeholder while the call loads. */
+    loading?: boolean;
+    className?: string;
+}
+/**
+ * CallCard — the cross-app representation of a recorded call: a sectioned
+ * card with a clear hierarchy of title → who was on it → summary → transcript
+ * → actions. Built so every "calls" surface across the product family reads
+ * the same, instead of each app re-stacking divs.
+ *
+ * Why sections (header / participants / summary / transcript / actions) instead
+ * of one block: a call answers five questions — what, who, the gist, the detail,
+ * and what can I do — and each deserves its own weight. The transcript is lazy
+ * (`onLoadTranscript`) because it's often fetched on demand. The summary is a
+ * first-class slot, never the raw transcript text.
+ *
+ * ```tsx
+ * <CallCard
+ *   title="Weekly catch up"
+ *   source="Meeting notes"
+ *   timestamp="14 May 2026"
+ *   participants={[{ name: "Jane Doe", email: "jane@example.com" }]}
+ *   summary="Agreed next steps and a follow-up date."
+ *   segments={segments}
+ *   onLoadTranscript={fetchTranscript}
+ *   headerAside={<Button variant="ghost" size="sm">Dismiss</Button>}
+ *   actions={<Button size="sm">Attach</Button>}
+ * />
+ * ```
+ */
+declare const CallCard: React.ForwardRefExoticComponent<CallCardProps & React.RefAttributes<HTMLDivElement>>;
+
+export { CallCard, type CallCardProps, type CallParticipant, type CallSegment };

package/dist/primitives/call-card.js

@@ -0,0 +1,195 @@
+"use client";
+"use client";
+import {
+  Eyebrow
+} from "../chunk-LIE6W3QT.js";
+import {
+  Text
+} from "../chunk-EIY5LLSP.js";
+import {
+  Collapsible,
+  CollapsibleContent,
+  CollapsibleTrigger
+} from "../chunk-NBUWGRQO.js";
+import {
+  Avatar,
+  AvatarFallback,
+  AvatarImage
+} from "../chunk-3OWGL4Q2.js";
+import {
+  Skeleton
+} from "../chunk-YEW65ASC.js";
+import {
+  cn
+} from "../chunk-G6SRSWXB.js";
+
+// src/primitives/call-card.tsx
+import { forwardRef, useEffect, useRef, useState } from "react";
+import { ChevronRight, PhoneCall } from "lucide-react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+var CallCard = forwardRef(
+  function CallCard2({
+    title,
+    source,
+    timestamp,
+    duration,
+    participants,
+    summary,
+    summaryClampLines = 4,
+    segments,
+    transcript,
+    headerAside,
+    actions,
+    transcriptLabel = "Show transcript",
+    defaultTranscriptOpen = false,
+    transcriptOpen,
+    onTranscriptOpenChange,
+    onLoadTranscript,
+    loading = false,
+    className
+  }, ref) {
+    const [internalOpen, setInternalOpen] = useState(defaultTranscriptOpen);
+    const [loadedOnce, setLoadedOnce] = useState(defaultTranscriptOpen);
+    const open = transcriptOpen ?? internalOpen;
+    const summaryRef = useRef(null);
+    const [summaryExpanded, setSummaryExpanded] = useState(false);
+    const [summaryOverflows, setSummaryOverflows] = useState(false);
+    useEffect(() => {
+      const el = summaryRef.current;
+      if (el) setSummaryOverflows(el.scrollHeight - el.clientHeight > 4);
+    }, [summary]);
+    function handleOpenChange(next) {
+      if (next && !loadedOnce) {
+        setLoadedOnce(true);
+        onLoadTranscript?.();
+      }
+      if (transcriptOpen === void 0) setInternalOpen(next);
+      onTranscriptOpenChange?.(next);
+    }
+    const meta = [timestamp, source, duration].filter(Boolean);
+    const hasTranscript = segments && segments.length > 0 || transcript != null;
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        className: cn(
+          "overflow-hidden rounded-xl border border-border bg-card text-card-foreground",
+          className
+        ),
+        children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-3 p-4 md:p-5", children: [
+            /* @__PURE__ */ jsx(
+              "span",
+              {
+                className: "grid h-9 w-9 shrink-0 place-items-center rounded-full bg-muted text-muted-foreground",
+                "aria-hidden": true,
+                children: /* @__PURE__ */ jsx(PhoneCall, { className: "h-4 w-4" })
+              }
+            ),
+            /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
+              /* @__PURE__ */ jsxs("div", { className: "flex items-start justify-between gap-2", children: [
+                loading ? /* @__PURE__ */ jsx(Skeleton, { className: "h-4 w-40" }) : /* @__PURE__ */ jsx("h3", { className: "min-w-0 flex-1 truncate text-sm font-semibold leading-tight", children: title ?? "Untitled call" }),
+                headerAside && /* @__PURE__ */ jsx("div", { className: "-mt-1 shrink-0", children: headerAside })
+              ] }),
+              meta.length > 0 && /* @__PURE__ */ jsx("p", { className: "mt-1 truncate text-xs text-muted-foreground", children: meta.map((m, i) => /* @__PURE__ */ jsxs("span", { children: [
+                i > 0 && /* @__PURE__ */ jsx("span", { className: "px-1.5 opacity-50", children: "\xB7" }),
+                m
+              ] }, i)) })
+            ] })
+          ] }),
+          participants && participants.length > 0 && /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-x-5 gap-y-3 border-t border-border px-4 py-3 md:px-5", children: participants.map((p, i) => {
+            const label = p.name || p.email || "Unknown";
+            return /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 items-center gap-2", children: [
+              /* @__PURE__ */ jsxs(Avatar, { className: "h-7 w-7 text-[10px]", children: [
+                p.avatarUrl ? /* @__PURE__ */ jsx(AvatarImage, { src: p.avatarUrl, alt: label }) : null,
+                /* @__PURE__ */ jsx(AvatarFallback, { children: initials(label) })
+              ] }),
+              /* @__PURE__ */ jsxs("div", { className: "min-w-0 leading-tight", children: [
+                /* @__PURE__ */ jsx("p", { className: "truncate text-sm font-medium", children: label }),
+                p.email && p.name && /* @__PURE__ */ jsx("p", { className: "truncate text-xs text-muted-foreground", children: p.email })
+              ] })
+            ] }, i);
+          }) }),
+          (summary || loading && !title) && /* @__PURE__ */ jsxs("div", { className: "border-t border-border px-4 py-3 md:px-5", children: [
+            /* @__PURE__ */ jsx(Eyebrow, { className: "mb-1.5", children: "Summary" }),
+            loading ? /* @__PURE__ */ jsxs("div", { className: "space-y-1.5", children: [
+              /* @__PURE__ */ jsx(Skeleton, { className: "h-3 w-full" }),
+              /* @__PURE__ */ jsx(Skeleton, { className: "h-3 w-4/5" })
+            ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+              /* @__PURE__ */ jsx(
+                "div",
+                {
+                  ref: summaryRef,
+                  className: "whitespace-pre-wrap text-sm leading-relaxed text-muted-foreground",
+                  style: summaryExpanded ? void 0 : {
+                    display: "-webkit-box",
+                    WebkitLineClamp: summaryClampLines,
+                    WebkitBoxOrient: "vertical",
+                    overflow: "hidden"
+                  },
+                  children: summary
+                }
+              ),
+              summaryOverflows && /* @__PURE__ */ jsx(
+                "button",
+                {
+                  type: "button",
+                  onClick: () => setSummaryExpanded((v) => !v),
+                  className: "mt-1.5 text-xs font-medium text-muted-foreground transition-colors hover:text-foreground",
+                  children: summaryExpanded ? "Show less" : "Show more"
+                }
+              )
+            ] })
+          ] }),
+          hasTranscript && /* @__PURE__ */ jsxs(
+            Collapsible,
+            {
+              open,
+              onOpenChange: handleOpenChange,
+              className: "border-t border-border",
+              children: [
+                /* @__PURE__ */ jsx(CollapsibleTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
+                  "button",
+                  {
+                    type: "button",
+                    className: "flex w-full items-center gap-1.5 px-4 py-3 text-xs font-medium text-muted-foreground transition-colors hover:text-foreground md:px-5",
+                    children: [
+                      /* @__PURE__ */ jsx(
+                        ChevronRight,
+                        {
+                          className: cn(
+                            "h-3.5 w-3.5 transition-transform",
+                            open && "rotate-90"
+                          )
+                        }
+                      ),
+                      open ? "Hide transcript" : transcriptLabel
+                    ]
+                  }
+                ) }),
+                /* @__PURE__ */ jsx(CollapsibleContent, { children: /* @__PURE__ */ jsx("div", { className: "max-h-80 space-y-3 overflow-y-auto px-4 pb-4 md:px-5", children: segments && segments.length > 0 ? segments.map((s, i) => /* @__PURE__ */ jsxs("div", { children: [
+                  s.speaker && /* @__PURE__ */ jsx("p", { className: "text-xs font-semibold text-foreground", children: s.speaker }),
+                  /* @__PURE__ */ jsx("p", { className: "mt-0.5 whitespace-pre-wrap text-sm leading-relaxed text-muted-foreground", children: s.text })
+                ] }, i)) : /* @__PURE__ */ jsx(
+                  Text,
+                  {
+                    variant: "muted",
+                    className: "whitespace-pre-wrap text-sm leading-relaxed",
+                    children: transcript
+                  }
+                ) }) })
+              ]
+            }
+          ),
+          actions && /* @__PURE__ */ jsx("div", { className: "flex flex-wrap items-center justify-end gap-2 border-t border-border bg-muted/30 px-4 py-3 md:px-5", children: actions })
+        ]
+      }
+    );
+  }
+);
+function initials(value) {
+  return value.split(/\s+/).filter(Boolean).slice(0, 2).map((w) => w[0]).join("").toUpperCase();
+}
+export {
+  CallCard
+};

package/dist/primitives/callout.cjs

@@ -0,0 +1,8 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client";
+
+
+var _chunkCTYOW3V2cjs = require('../chunk-CTYOW3V2.cjs');
+require('../chunk-KWLSBTB2.cjs');
+
+
+exports.Callout = _chunkCTYOW3V2cjs.Callout;

package/dist/primitives/callout.d.cts

@@ -0,0 +1,41 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ReactNode } from 'react';
+
+type CalloutPointer = "top" | "top-left" | "top-right" | "bottom" | "bottom-left" | "bottom-right" | "left" | "right";
+type CalloutPadding = "none" | "sm" | "compact" | "md" | "lg";
+interface CalloutProps {
+    /**
+     * Optional pointer (small triangle on the edge) tying the callout to
+     * a related element on the page. Omit for a standalone well.
+     *
+     * - `top` / `bottom` / `left` / `right` — centered on that edge
+     * - `top-left`, `top-right`, etc — aligned near the start/end of the edge
+     */
+    pointer?: CalloutPointer;
+    /** Internal padding. Defaults to `md`. */
+    padding?: CalloutPadding;
+    children: ReactNode;
+    className?: string;
+    tone?: "default" | "warning";
+    marginBottom?: "none" | "md";
+    textSize?: "inherit" | "micro";
+}
+/**
+ * A muted well/card with an optional pointer triangle, used to visually
+ * tie a block of related content to a target element on the page.
+ *
+ * Common uses:
+ * - Suggestion / example pills under an input (pointer="top")
+ * - Inline help text under a form field (pointer="top")
+ * - Quick-action chips after a state change ("nice — what next?")
+ * - Onboarding nudges that point at a specific UI element
+ *
+ * Pointer-less callouts are valid too — drop the `pointer` prop for a
+ * generic muted well that just groups related content.
+ *
+ * Styling: subtle border + `bg-muted/40` so it reads as related-to
+ * rather than primary content. Override via `className`.
+ */
+declare function Callout({ pointer, padding, children, className, tone, marginBottom, textSize, }: CalloutProps): react_jsx_runtime.JSX.Element;
+
+export { Callout, type CalloutPadding, type CalloutPointer, type CalloutProps };

package/dist/primitives/callout.d.ts

@@ -0,0 +1,41 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ReactNode } from 'react';
+
+type CalloutPointer = "top" | "top-left" | "top-right" | "bottom" | "bottom-left" | "bottom-right" | "left" | "right";
+type CalloutPadding = "none" | "sm" | "compact" | "md" | "lg";
+interface CalloutProps {
+    /**
+     * Optional pointer (small triangle on the edge) tying the callout to
+     * a related element on the page. Omit for a standalone well.
+     *
+     * - `top` / `bottom` / `left` / `right` — centered on that edge
+     * - `top-left`, `top-right`, etc — aligned near the start/end of the edge
+     */
+    pointer?: CalloutPointer;
+    /** Internal padding. Defaults to `md`. */
+    padding?: CalloutPadding;
+    children: ReactNode;
+    className?: string;
+    tone?: "default" | "warning";
+    marginBottom?: "none" | "md";
+    textSize?: "inherit" | "micro";
+}
+/**
+ * A muted well/card with an optional pointer triangle, used to visually
+ * tie a block of related content to a target element on the page.
+ *
+ * Common uses:
+ * - Suggestion / example pills under an input (pointer="top")
+ * - Inline help text under a form field (pointer="top")
+ * - Quick-action chips after a state change ("nice — what next?")
+ * - Onboarding nudges that point at a specific UI element
+ *
+ * Pointer-less callouts are valid too — drop the `pointer` prop for a
+ * generic muted well that just groups related content.
+ *
+ * Styling: subtle border + `bg-muted/40` so it reads as related-to
+ * rather than primary content. Override via `className`.
+ */
+declare function Callout({ pointer, padding, children, className, tone, marginBottom, textSize, }: CalloutProps): react_jsx_runtime.JSX.Element;
+
+export { Callout, type CalloutPadding, type CalloutPointer, type CalloutProps };

package/dist/primitives/callout.js

@@ -0,0 +1,8 @@
+"use client";
+import {
+  Callout
+} from "../chunk-GL5CV4FF.js";
+import "../chunk-G6SRSWXB.js";
+export {
+  Callout
+};