@teaflask/assistant 0.3.0 → 0.6.0

package/src/components/activity-rail.tsx

@@ -1,277 +0,0 @@
-"use client";
-
-import { useContext } from "react";
-
-import { activityTitleOf } from "../core/activity-title.js";
-import type { ApprovalCardModel } from "../core/approval-inbox.js";
-import type { ElicitationCardModel } from "../core/elicitation-cards.js";
-import {
-  liveFoldHeadlineOf,
-  settledFoldHeadlineOf,
-  type RunFoldMember,
-  type RunFoldRow,
-  type RunFoldStep,
-} from "../core/run-folds.js";
-
-import {
-  approvalAwaitsMember,
-  elicitationAwaitsMember,
-} from "../core/suspension-queue.js";
-import { anchoredCardsFor } from "./approval-context.js";
-import {
-  anchoredElicitationsFor,
-  ElicitationsContext,
-} from "./elicitation-context.js";
-import { AssistantMarkdown } from "./markdown/assistant-markdown.js";
-import { MemoryUpdatedFooter } from "./memory-updated-footer.js";
-import type { ToolRowSlot } from "./message-list-slots.js";
-import {
-  Disclosure,
-  DisclosureChevron,
-  useDisclosureVisualState,
-} from "./primitives/disclosure.js";
-import { ReasoningRow } from "./reasoning-row.js";
-import { ShimmerText } from "./streaming-states.js";
-import { SurfaceBoundary } from "./surface-boundary.js";
-import { ToolCallRows } from "./tool-call-rows.js";
-import { useMemberToggleOutrank } from "./use-member-toggle-outrank.js";
-import { _foldClaimsLiveness } from "./use-transcript-folds.js";
-
-export function ActivityRail({
-  fold,
-  cards,
-  turnLive,
-  inCurrentTurn,
-  identityToken,
-  decisionSurfacesInShelf,
-  toolRow,
-}: {
-  fold: RunFoldRow;
-  cards: readonly ApprovalCardModel[];
-  turnLive: boolean;
-  /** True while this fold belongs to the transcript's current turn — no
-   *  user or subagent-delivery row follows it. Read by the member rows'
-   *  own hold (a resolved view or a decision keeps the ROW open for its
-   *  turn); the fold itself opens on liveness alone. */
-  inCurrentTurn: boolean;
-  /** The surface's provenance token — folded narration is assistant
-   *  prose and must wear it exactly as the top-level row does (law 10). */
-  identityToken: string;
-  decisionSurfacesInShelf: boolean;
-  toolRow?: ToolRowSlot;
-}) {
-  const { cards: elicitationCards } = useContext(ElicitationsContext);
-  const rows = fold.members;
-  // The one shared spelling (see _foldClaimsLiveness): the trailing
-  // arbiter must judge this fold exactly as this headline renders it.
-  const running = _foldClaimsLiveness(rows, turnLive);
-  // The fold's default openness: the section that is WORKING is the one
-  // expanded — a fold claiming liveness, or one whose member awaits the
-  // member's decision (the row it holds open is the consent reading).
-  // Once the work settles the prop releases (true→undefined) and the
-  // fold collapses, so a finished section reads as one "Worked for …"
-  // line and the transcript stays scannable. A settled member's view,
-  // a settled decision and a failed step no longer hold a fold open:
-  // the failed step's own row pill names the failure (the headline
-  // carries no tally), and the member's explicit toggle outranks every
-  // arm, permanently for the fold.
-  const awaitingDecision = _groupAwaitsDecision(
-    rows,
-    cards,
-    elicitationCards,
-    decisionSurfacesInShelf,
-  );
-  const foldOpenByDefault = running || awaitingDecision;
-  const { groupRef, memberToggled, onGroupActivation } =
-    useMemberToggleOutrank();
-  const steps = fold.steps.map((step) => (
-    <ActivityRailStep
-      key={step.kind === "tool-call" ? step.row.key : step.view.key}
-      step={step}
-      cards={cards}
-      inCurrentTurn={inCurrentTurn}
-      identityToken={identityToken}
-      decisionSurfacesInShelf={decisionSurfacesInShelf}
-      toolRow={toolRow}
-    />
-  ));
-  return (
-    // Every protocol sequence is ONE piece of work in the transcript,
-    // including a one-step run. A stable outer level prevents the visual
-    // model from changing based on how many calls the model happened to
-    // choose. Its children keep their own disclosures, so expanding the
-    // group reveals the timeline and expanding a tool reveals its evidence.
-    <div
-      data-tf-activity-group=""
-      className="tf:my-2"
-      ref={groupRef}
-      onClickCapture={onGroupActivation}
-    >
-      <Disclosure
-        variant="bare"
-        // Open while working or awaiting a decision, released to native
-        // once settled (true→undefined collapses once, never remounting
-        // this <details>). The member's own toggle outranks it, permanently.
-        open={memberToggled ? undefined : foldOpenByDefault || undefined}
-        summaryClassName="tf:flex tf:w-fit tf:items-center tf:gap-1.5 tf:py-1.5 tf:text-tf-label tf:text-tf-muted-foreground tf:hover:text-tf-foreground"
-        bodyClassName="tf:pt-1"
-        summary={
-          <>
-            <FoldHeadline fold={fold} running={running} />
-            <DisclosureChevron revealOnInteraction />
-          </>
-        }
-      >
-        {/* The rail grows to its content: an open fold shows every step in
-            the transcript's own flow — no inner scroller, no height cap, so
-            a tool view inside it is never clipped or scrolled twice. */}
-        <div data-tf-activity-rail="">
-          <div>{steps}</div>
-        </div>
-      </Disclosure>
-      {/* No settled decision lines render here — the meta-receipt rows were
-          deleted: a consent outcome's surfaces are the decision card's own
-          footer and the operation row's state pill. Do not restore the lines
-          as a bug fix. */}
-    </div>
-  );
-}
-
-/** One step of the rail, in transcript order: a reasoning view, the
- *  narration a completed episode folded, or a tool call inside its own
- *  boundary. */
-function ActivityRailStep({
-  step,
-  cards,
-  inCurrentTurn,
-  identityToken,
-  decisionSurfacesInShelf,
-  toolRow,
-}: {
-  step: RunFoldStep;
-  cards: readonly ApprovalCardModel[];
-  inCurrentTurn: boolean;
-  identityToken: string;
-  decisionSurfacesInShelf: boolean;
-  toolRow?: ToolRowSlot;
-}) {
-  if (step.kind === "reasoning") {
-    return (
-      <div data-tf-activity-step="">
-        <ReasoningRow view={step.view} />
-      </div>
-    );
-  }
-  if (step.kind === "narration") {
-    // Narration that folded into a completed episode: the same prose the
-    // top-level assistant-text case renders, in a second home. Carried:
-    // the identity token (law 10) and MemoryUpdatedFooter. Deliberately
-    // not: the paced reveal (a narration step is settled by construction),
-    // the py-2 wrapper (py-1 here is rail geometry, not message padding),
-    // the rows' ps-7 label gutter (prose sits flush with the fold's
-    // headline, as top-level prose sits flush with the marks — law 5:
-    // disclosure adds detail, never indentation), and the copy affordance
-    // (that belongs to top-level messages). Item by item: the episode-fold
-    // audit record.
-    return (
-      <div
-        data-tf-activity-step=""
-        data-tf-activity-narration=""
-        data-tf-agent-identity={identityToken}
-        className="tf:py-1"
-      >
-        <AssistantMarkdown>{step.view.text}</AssistantMarkdown>
-        {step.view.memoryUpdates !== undefined ? (
-          <MemoryUpdatedFooter updates={step.view.memoryUpdates} />
-        ) : null}
-      </div>
-    );
-  }
-  return (
-    <div data-tf-activity-step="">
-      {/* Per-row boundary, same contract as the top-level tool-call
-          case: the projection runs inside ToolCallRows, inside this
-          boundary. */}
-      <SurfaceBoundary surface="tool-row">
-        <ToolCallRows
-          row={step.row}
-          cards={cards}
-          inCurrentTurn={inCurrentTurn}
-          decisionSurfacesInShelf={decisionSurfacesInShelf}
-          toolRow={toolRow}
-        />
-      </SurfaceBoundary>
-    </div>
-  );
-}
-
-/** The fold summary's words. Live, the one shimmered label tracks the work
- *  by disclosure state (TVC-010): COLLAPSED reads the latest step's own
- *  label (liveFoldHeadlineOf); EXPANDED reads the generic "Working…",
- *  because the rail below says what the steps are. The open bit is the
- *  DOM-backed disclosure mirror (useDisclosureVisualState), never the open
- *  prop. Settled, the label is the work's cost ("Worked for 4m 49s",
- *  degrading to "Worked"), NEVER a step label and never an outcome tally: a
- *  step that failed, was interrupted, declined or not approved wears that
- *  word on its own row's pill, where the member who opens the fold reads
- *  it. */
-function FoldHeadline({
-  fold,
-  running,
-}: {
-  fold: RunFoldRow;
-  running: boolean;
-}) {
-  const open = useDisclosureVisualState()?.open ?? false;
-  if (running) {
-    const rawLabel = open ? "Working…" : liveFoldHeadlineOf(fold.steps);
-    const label = open ? rawLabel : activityTitleOf(rawLabel);
-    return (
-      // The measured truncation shape (subagent-group-row's idiom): the
-      // shimmer root is an atomic inline-grid, so the ellipsis lives on the
-      // blockified span inside and grid-cols-1 + max-w-full + min-w-0 make
-      // the track shrinkable — one line, never overflowing the 390px
-      // contract. The RAW step label rides the wrapper's title (never the
-      // inner span: ShimmerText duplicates its children).
-      <span className="tf:min-w-0" title={open ? undefined : rawLabel}>
-        <ShimmerText className="tf:max-w-full tf:grid-cols-1">
-          <span className="tf:block tf:truncate">{label}</span>
-        </ShimmerText>
-      </span>
-    );
-  }
-  return <span>{settledFoldHeadlineOf(fold.duration)}</span>;
-}
-
-/** The fold's decision arm: LIVE pendency only — a member row whose
- *  anchored approval or elicitation card is still actionable or
- *  submitting (approvalAwaitsMember / elicitationAwaitsMember, the one
- *  spelling of "waiting on the human"). The durable `row.decisionBearing`
- *  anchor is the ROW's hold (tool-call-rows.tsx, its decisionBearing
- *  derivation), never the fold's: an answered decision is finished work,
- *  and finished work folds. The cards are read through the same join the
- *  row uses — the shelf tenant's by toolCallId, else the anchored join —
- *  so fold and row agree on which cards are this call's. Every card-store
- *  consumer, classified: docs/transcript-surfaces.md. */
-function _groupAwaitsDecision(
-  rows: readonly RunFoldMember[],
-  approvalCards: readonly ApprovalCardModel[],
-  elicitationCards: readonly ElicitationCardModel[],
-  decisionSurfacesInShelf: boolean,
-): boolean {
-  return rows.some((row) => {
-    if (row.kind !== "tool-call") {
-      return false;
-    }
-    const approvals = decisionSurfacesInShelf
-      ? approvalCards.filter((card) => card.toolCallId === row.toolCallId)
-      : anchoredCardsFor(approvalCards, row.toolCallId);
-    const elicitations = decisionSurfacesInShelf
-      ? elicitationCards.filter((card) => card.toolCallId === row.toolCallId)
-      : anchoredElicitationsFor(elicitationCards, row.toolCallId);
-    return (
-      approvals.some(approvalAwaitsMember) ||
-      elicitations.some(elicitationAwaitsMember)
-    );
-  });
-}

package/src/components/activity-shelf.tsx

@@ -1,52 +0,0 @@
-import type { ReactNode } from "react";
-
-/** The decision shelf holds active approval and question surfaces. */
-export function ActivityShelf({
-  suspension,
-}: {
-  /** The suspension slot: the active approval or question surface, on
-   *  the full transcript/composer measure. */
-  suspension?: ReactNode;
-}) {
-  return (
-    <div
-      data-tf-activity-shelf=""
-      data-tf-composer-ground=""
-      className="tf:bg-tf-background tf:empty:hidden"
-    >
-      <div className="tf:mx-auto tf:w-full tf:max-w-3xl tf:px-4 tf:empty:hidden">
-        <div
-          data-tf-suspension-slot=""
-          className="tf:flex tf:flex-col tf:gap-2 tf:pt-1 tf:empty:hidden"
-        >
-          {suspension}
-        </div>
-      </div>
-    </div>
-  );
-}
-
-/**
- * Floating activity anchored to the top edge of the shelf+composer
- * anchor (Transcript's [data-tf-composer-anchor]) — above the decision
- * shelf when it is populated, directly above the composer when it is
- * empty, so a floating pill can never sit over a pending card's
- * Approve/Deny row. The overlay never catches input;
- * compact interactive tenants opt back in at their own boundary. No
- * background is painted here.
- */
-export function ComposerActivityOverlay({
-  activity,
-}: {
-  activity?: ReactNode;
-}) {
-  return (
-    <div
-      data-tf-activity-slot=""
-      data-tf-composer-activity-overlay=""
-      className="tf:pointer-events-none tf:absolute tf:inset-x-0 tf:bottom-full tf:flex tf:flex-col tf:items-center tf:gap-1.5 tf:pb-4 tf:empty:hidden"
-    >
-      {activity}
-    </div>
-  );
-}

package/src/components/agent-identity-mark.tsx

@@ -1,120 +0,0 @@
-// The TeaFlask agent identity mark (law 10): ONE canonical mark
-// component for the primary agent and its subagents, so no surface ever
-// borrows a mascot or a provider logo. The flask geometry is the brand
-// SVG the marketing site ships (the dashboard's logo component is its
-// copy of the same pair) — the package cannot import the dashboard's
-// tree, so the two rects are minted here from that source.
-//
-// Subagents use the real filled TeaFlask geometry. A replay-stable
-// dispatch index selects a color, echoing the reference UI's colored
-// coworker avatars without borrowing its ghost mascot. Color is an
-// identity channel here, never a status channel; the accessible name
-// remains textual and the index is intentionally not painted as a badge.
-//
-// data-tf-agent-mark carries the register (TVC-092 reads it); the
-// identity TOKEN hooks (data-tf-agent-identity / data-tf-subagent-
-// identity, TVC-090/091) stay on the surfaces that mint them — this
-// component is the visible treatment, not a second token spelling.
-
-import { cx } from "./primitives/cx.js";
-import { useId } from "react";
-
-export type AgentIdentityRegister = "primary" | "subagent";
-
-const SUBAGENT_GRADIENTS = [
-  ["oklch(83.7% 0.128 66.29)", "oklch(64.6% 0.222 41.116)"],
-  ["oklch(90.5% 0.182 98.111)", "oklch(68.1% 0.162 75.834)"],
-  ["oklch(87.1% 0.15 154.449)", "oklch(62.7% 0.194 149.214)"],
-  ["oklch(82.8% 0.111 230.318)", "oklch(58.8% 0.158 241.966)"],
-  ["oklch(78.5% 0.115 274.713)", "oklch(51.1% 0.262 276.966)"],
-  ["oklch(81.1% 0.111 293.571)", "oklch(54.1% 0.281 293.009)"],
-  ["oklch(82.3% 0.12 346.018)", "oklch(59.2% 0.249 0.584)"],
-  ["oklch(80.8% 0.114 19.571)", "oklch(57.7% 0.245 27.325)"],
-] as const;
-
-export function AgentIdentityMark({
-  register,
-  variantIndex,
-  size = "sm",
-  className,
-}: {
-  register: AgentIdentityRegister;
-  /** The coworker's deterministic 1-based palette index (subagent
-   *  register only) — absent metadata uses the neutral aggregate mark. */
-  variantIndex?: number;
-  /** `fill` takes the parent's box — the companion mark's stages size
-   *  their own box and the flask fills it. */
-  size?: "sm" | "md" | "fill";
-  className?: string;
-}) {
-  const subagent = register === "subagent";
-  const gradientId = `tf-agent-${useId().replace(/:/g, "")}`;
-  // The palette is the identity channel (the visual spec's Agent Identity
-  // Exception), and identity needs a coworker: with no variantIndex there
-  // is nothing to encode, so the aggregate mark (the count-pill trigger,
-  // the group header) paints currentColor and stays theme- and
-  // surface-adaptive — the pill's muted ink, a failed row's destructive
-  // tint — instead of pinning a gray pair that ignores both.
-  const gradient =
-    subagent && variantIndex !== undefined
-      ? SUBAGENT_GRADIENTS[(variantIndex - 1) % SUBAGENT_GRADIENTS.length]
-      : null;
-  return (
-    <span
-      data-tf-agent-mark={register}
-      data-tf-agent-variant={subagent ? variantIndex : undefined}
-      className={cx(
-        "tf:flex tf:shrink-0 tf:items-center",
-        // A percentage-sized svg inside a fit-content parent collapses,
-        // so fill widens the wrapper to the box instead of to the glyph.
-        size === "fill" ? "tf:size-full tf:justify-center" : "tf:w-fit",
-        className,
-      )}
-    >
-      <svg
-        viewBox="0 0 172 172"
-        aria-hidden="true"
-        className={cx(
-          "tf:shrink-0",
-          size === "fill"
-            ? "tf:size-full"
-            : size === "sm"
-              ? "tf:size-3.5"
-              : "tf:size-4",
-        )}
-      >
-        {gradient !== null ? (
-          <defs>
-            <linearGradient id={gradientId} x1="0" y1="0" x2="1" y2="1">
-              <stop stopColor={gradient[0]} />
-              <stop offset="1" stopColor={gradient[1]} />
-            </linearGradient>
-          </defs>
-        ) : null}
-        <rect
-          x="52"
-          y="0"
-          width="68"
-          height="36"
-          rx="14"
-          fill={gradient !== null ? `url(#${gradientId})` : "currentColor"}
-        />
-        <rect
-          x="36"
-          y="52"
-          width="100"
-          height="120"
-          rx="31"
-          fill={gradient !== null ? `url(#${gradientId})` : "currentColor"}
-        />
-      </svg>
-      <span className="tf:sr-only">
-        {subagent
-          ? variantIndex !== undefined
-            ? `Subagent ${String(variantIndex)}`
-            : "Subagent"
-          : "TeaFlask"}
-      </span>
-    </span>
-  );
-}

package/src/components/appearance-context.ts

@@ -1,55 +0,0 @@
-"use client";
-
-import {
-  createContext,
-  useContext,
-  type CSSProperties,
-  type ReactNode,
-} from "react";
-
-import type { AssistantThemeMode } from "../appearance/theme.js";
-import type { AssistantSuggestionInput } from "./conversation-view.js";
-
-// The provider's appearance channel to the widget roots. A separate
-// context from the session on purpose: hosts write the theme prop as an
-// inline object literal — appearance must be structurally unable to
-// reach the session's memo keys, where a fresh-per-render identity
-// would tear down and rebuild the conversation transport.
-
-export interface AssistantRootProps {
-  style?: CSSProperties;
-  "data-tf-theme"?: AssistantThemeMode;
-}
-
-export interface AssistantAppearanceValue {
-  // Spread onto every element that carries `data-tf-assistant`. The
-  // theme prop rides as inline `--tf-*` variables, which is what makes
-  // explicit JS intent beat ambient host CSS; `data-tf-theme` rides
-  // along when the host passed `mode`. Empty when neither prop is set,
-  // leaving the pure-CSS route exactly as documented.
-  rootProps: AssistantRootProps;
-  // The host's companion mark — the node the perch and the
-  // drawer welcome all show, read by identity like `toolViews`. A
-  // sibling of the theme, never a theme token: the mark is identity,
-  // not paint. Null means the package's own flask.
-  companionMark: ReactNode | null;
-  // The host's opening prompts for the companion drawer's welcome —
-  // content, never the package's (it has no tool catalog to invent
-  // prompts from), so like `companionMark` it rides beside the theme
-  // rather than inside it. Null when the host offers none, and the
-  // welcome simply renders without them.
-  suggestions: readonly AssistantSuggestionInput[] | null;
-}
-
-export const AssistantAppearanceContext =
-  createContext<AssistantAppearanceValue | null>(null);
-
-export function useAssistantAppearance(): AssistantAppearanceValue {
-  const value = useContext(AssistantAppearanceContext);
-  if (value === null) {
-    throw new Error(
-      "Teaflask assistant components must be rendered inside <TeaflaskAssistantProvider>.",
-    );
-  }
-  return value;
-}