@anchrd/intel-ui 0.18.0 → 0.20.0

package/src/components/ui/kanban.tsx

@@ -1,282 +0,0 @@
-import {
-  type Announcements,
-  closestCorners,
-  DndContext,
-  type DraggableAttributes,
-  DragOverlay,
-  type DragStartEvent,
-  KeyboardSensor,
-  PointerSensor,
-  useDroppable,
-  useSensor,
-  useSensors,
-} from "@dnd-kit/core";
-import { SortableContext, useSortable, verticalListSortingStrategy } from "@dnd-kit/sortable";
-import { CSS } from "@dnd-kit/utilities";
-import { GripVertical } from "lucide-react";
-import { type ReactNode, useState } from "react";
-import { createPortal } from "react-dom";
-import { cn } from "@/lib/utils";
-
-/**
- * A kanban board on dnd-kit, from the Kibo UI registry (MIT) and changed where it had to be.
- *
- * Registry code is our code, and four things about the original do not survive contact with a board
- * whose truth is on a server:
- *
- * ⚠️ **It reported a drop as a new ARRAY, and it reported one twice.** The original called
- * `onDataChange` in `onDragOver` for a cross-column move and again in `onDragEnd`, and both times
- * with a reordered copy of the whole list. Against a server that is two writes for one drag — and
- * the second one describes a state the first already changed. This version says nothing while the
- * card is in the air and emits ONE drop at the end, naming what was dropped and what it was dropped
- * on. What that means is the caller's to decide (`board-kanban.ts`), which is also where the single
- * `board_task_move` is sent from.
- *
- * ⚠️ **It mutated its own props** — `newData[activeIndex].column = overColumn` writes into the
- * object the caller passed in. With TanStack Query holding that object, a drag edited the cache in
- * place and no re-render followed.
- *
- * ⚠️ **`tunnel-rat` is gone.** It existed to render the dragged card into the overlay from inside
- * the card component; `DragOverlay` already does that, and the caller draws the overlay itself.
- * One dependency fewer for something React has a portal for.
- *
- * ⚠️ **The screen reader announcements are handed in.** The originals are English string literals
- * in the component; Intel speaks three languages and its text comes from `useI18n()`.
- *
- * ⚠️ **The card is not itself a `role="button"`, and it holds exactly ONE tab stop.** The original
- * spread `useSortable().attributes` onto the card, which contributes `role="button"` and
- * `tabIndex={0}` — and a card that also has to be OPENED then holds a real button inside that one:
- * two tab stops computing the same accessible name from the same contents, and an Enter that means
- * "start dragging" outside and "open this" inside (anchrd/intel#286). This version keeps the
- * `listeners` on the card so a pointer still drags it from anywhere, and hands the ACTIVATOR to the
- * caller's own control instead of minting a second button beside it (anchrd/intel#315). What
- * separates the two meanings is then the key, not the element: see `KanbanProvider`.
- */
-
-export interface KanbanColumn {
-  id: string;
-  name: string;
-}
-
-export interface KanbanDrop {
-  activeId: string;
-  // The column or the card it was let go over. `null` means it was let go over nothing — a drag
-  // that ended outside the board, which is a cancel and not a move.
-  overId: string | null;
-}
-
-export function KanbanBoard({
-  id,
-  droppable = true,
-  children,
-  className,
-}: {
-  id: string;
-  // A column that exists to be READ but must not be written into. It still draws and still holds
-  // cards; it simply never becomes a drop target, so nothing can be dropped where the answer would
-  // be a refusal (`board-kanban.tsx`).
-  droppable?: boolean;
-  children: ReactNode;
-  className?: string;
-}) {
-  const { isOver, setNodeRef } = useDroppable({ id, disabled: !droppable });
-  return (
-    <div
-      ref={setNodeRef}
-      data-slot="kanban-column"
-      data-droppable={droppable}
-      className={cn(
-        "flex size-full min-h-40 flex-col divide-y overflow-hidden rounded-lg border bg-muted/40 text-xs ring-2 transition-colors",
-        isOver ? "ring-ring" : "ring-transparent",
-        className,
-      )}
-    >
-      {children}
-    </div>
-  );
-}
-
-export function KanbanHeader({ children }: { children: ReactNode }) {
-  return <div className="flex items-center gap-2 p-2 text-sm font-semibold">{children}</div>;
-}
-
-export function KanbanCards({ id, children }: { id: string; children: ReactNode }) {
-  return (
-    <div
-      // The column scrolls, not the page: four lanes of different lengths must not make the board
-      // as tall as its longest one.
-      className="flex min-h-0 flex-1 flex-col gap-2 overflow-y-auto p-2"
-      data-slot="kanban-cards"
-      data-column={id}
-    >
-      {children}
-    </div>
-  );
-}
-
-/**
- * What a card hands to the one control inside it: the activator ref and dnd-kit's ARIA attributes.
- *
- * ⚠️ It is spread onto a control the CALLER renders, which is the whole point — the alternative is
- * a handle of the primitive's own beside it, and that is the second tab stop anchrd/intel#315 is
- * about. `role` and `tabIndex` are in here and are what a native `<button>` already is; what is not
- * already there is `aria-roledescription` and the `aria-describedby` pointing at dnd-kit's keyboard
- * instructions, and those are the half a reader needs to be told the control can also be picked up.
- */
-export type KanbanCardControl = DraggableAttributes & {
-  ref: (node: HTMLElement | null) => void;
-};
-
-export function KanbanCard({
-  id,
-  roleDescription,
-  children,
-  className,
-}: {
-  id: string;
-  // What a reader is told this card IS, past its accessible name — dnd-kit's `aria-roledescription`,
-  // whose own default is the English literal "draggable". Handed in because text comes from
-  // `useI18n()` and only the caller has it.
-  roleDescription: string;
-  // A function, not a node: the one control in a card has to receive `control`, and a primitive that
-  // rendered its own control instead would be back to two tab stops.
-  children: (control: KanbanCardControl) => ReactNode;
-  className?: string;
-}) {
-  const {
-    attributes,
-    listeners,
-    setNodeRef,
-    setActivatorNodeRef,
-    transition,
-    transform,
-    isDragging,
-  } = useSortable({ id, attributes: { roleDescription } });
-  return (
-    <div
-      ref={setNodeRef}
-      style={{ transition, transform: CSS.Transform.toString(transform) }}
-      // ⚠️ `listeners` here, `attributes` NOT. The pointer sensor has to see a press anywhere on the
-      // card — a kanban whose cards can only be dragged by a grip is a kanban nobody drags — but
-      // `attributes` carries `role="button"` and `tabIndex`, and those on the card would wrap the
-      // control that OPENS it in a second button.
-      //
-      // ⚠️ Handing the activator down only holds because something claims to BE it. dnd-kit's
-      // `KeyboardSensor` opens with `if (activator && event.target !== activator) return false` — a
-      // guard that does not exist until `setActivatorNodeRef` has been given a node. Unclaimed, the
-      // keyboard sensor accepts a key press from anywhere under these listeners, which is how a card
-      // ended up impossible to open by keyboard (anchrd/intel#286). The pointer drag is unaffected
-      // either way: `PointerSensor` never consults the activator node.
-      {...listeners}
-      data-slot="kanban-card"
-      className={cn(
-        "flex cursor-grab items-start gap-1 rounded-lg border bg-card p-3 text-left shadow-sm",
-        // Left where it was, faded, rather than removed: a lane that reflows while a card is over
-        // it moves the drop target out from under the pointer.
-        isDragging && "opacity-40",
-        className,
-      )}
-    >
-      {/* Decoration, and deliberately not a control: it says "this can be taken hold of" to whoever
-          uses a pointer, and a pointer can take hold of the whole card anyway. As a button it was a
-          tab stop of its own on every card in the lane. */}
-      <GripVertical aria-hidden="true" className="mt-0.5 size-4 shrink-0 text-muted-foreground" />
-      <div className="min-w-0 flex-1">{children({ ...attributes, ref: setActivatorNodeRef })}</div>
-    </div>
-  );
-}
-
-/**
- * ⚠️ Space picks a card up, Enter does not — and that is the whole of anchrd/intel#315.
- *
- * dnd-kit's default is `start: ['Space', 'Enter']`, which forces the activator to be an element of
- * its own: a control that is also the card's "open" button cannot answer both keys with two
- * different things. With the start key narrowed to Space, the two meanings are told apart by the
- * KEY instead of by the element, and a card costs one tab stop rather than two — fifty cards, fifty
- * stops instead of a hundred.
- *
- * ⚠️ `start` is the ONLY list that is narrowed. `end` and `cancel` are dnd-kit's defaults spelled
- * out — Space, Enter and **Tab** put a card down, Escape leaves it where it was — and dropping one
- * of them here is not a smaller change than it looks. Tab is neither an end key nor a cancel key
- * once it is missing from this list, and `defaultKeyboardCoordinateGetter` answers nothing for it,
- * so nothing calls `preventDefault()`: the focus walks on to the next card while the first one is
- * still in the air and still following the arrow keys.
- *
- * Enter stays an END key, and it cannot open the card while ending a move: `handleEnd` calls
- * `preventDefault()` before the browser turns the key press into a click. Somebody holding a card
- * who presses the key they associate with "yes" should put it down, not be told nothing happened.
- */
-const kanbanKeyboardCodes = {
-  start: ["Space"],
-  cancel: ["Escape"],
-  end: ["Space", "Enter", "Tab"],
-};
-
-export function KanbanProvider({
-  columns,
-  itemsByColumn,
-  children,
-  announcements,
-  instructions,
-  overlay,
-  onDrop,
-  className,
-}: {
-  columns: KanbanColumn[];
-  // Which cards stand in which column, in the order they are drawn. The provider needs it for the
-  // sortable contexts and asks for it rather than deriving it, so the caller stays the only place
-  // that knows how a board is ordered.
-  itemsByColumn: Map<string, string[]>;
-  children: (column: KanbanColumn) => ReactNode;
-  announcements: Announcements;
-  // ⚠️ Not optional, and not a nicety. dnd-kit's built-in text is an English literal naming the
-  // default keys, and this board answers different ones. A card whose `aria-describedby` says
-  // "press space or enter" while Enter opens it describes a widget that is not there.
-  instructions: string;
-  overlay(activeId: string): ReactNode;
-  onDrop(drop: KanbanDrop): void;
-  className?: string;
-}) {
-  const [activeId, setActiveId] = useState<string | null>(null);
-  const sensors = useSensors(
-    // ⚠️ A distance before a drag starts, and it is not decoration: without it every click on a
-    // card is a drag of zero pixels, and the card can then no longer be opened by clicking it.
-    useSensor(PointerSensor, { activationConstraint: { distance: 4 } }),
-    useSensor(KeyboardSensor, { keyboardCodes: kanbanKeyboardCodes }),
-  );
-
-  return (
-    <DndContext
-      accessibility={{ announcements, screenReaderInstructions: { draggable: instructions } }}
-      // Corners rather than centres: a tall card over a short one wins on centre distance even
-      // when the pointer is nowhere near it.
-      collisionDetection={closestCorners}
-      sensors={sensors}
-      onDragStart={(event: DragStartEvent) => setActiveId(String(event.active.id))}
-      onDragCancel={() => setActiveId(null)}
-      onDragEnd={(event) => {
-        setActiveId(null);
-        const over = event.over === null ? null : String(event.over.id);
-        onDrop({ activeId: String(event.active.id), overId: over });
-      }}
-    >
-      <div className={cn("grid size-full auto-cols-fr grid-flow-col gap-3", className)}>
-        {columns.map((column) => (
-          <SortableContext
-            key={column.id}
-            items={itemsByColumn.get(column.id) ?? []}
-            strategy={verticalListSortingStrategy}
-          >
-            {children(column)}
-          </SortableContext>
-        ))}
-      </div>
-      {typeof document === "undefined"
-        ? null
-        : createPortal(
-            <DragOverlay>{activeId === null ? null : overlay(activeId)}</DragOverlay>,
-            document.body,
-          )}
-    </DndContext>
-  );
-}

package/src/data/agent-runtime/agent-runtime.ts

@@ -1,131 +0,0 @@
-import { z } from "zod";
-
-/**
- * What the agent runtime answers, read back defensively.
- *
- * ⚠️ These shapes are NOT in `@anchrd/intel-contract`, and that is deliberate rather than an
- * oversight: the runtime (`packages/agent`) imports nothing from the contract either, so a run
- * record has no shared declaration anywhere. It crosses a network boundary into this package, so it
- * is parsed here — tolerantly, in the same spirit the runtime reads a definition, because a field
- * the runtime adds must not blank the log screen.
- */
-export const AgentRunTarget = z.object({
-  kind: z.enum(["chat", "document", "flow", "mail", "task"]),
-  id: z.string().nullable(),
-});
-export type AgentRunTarget = z.infer<typeof AgentRunTarget>;
-
-/**
- * What one run consumed at the provider, as the runtime recorded it (#250).
- *
- * ⚠️ `inputTokens` is the part that was NOT cached, not the size of the prompt — the prompt is all
- * four fields added together. Anything that shows the first as "the prompt" will report a run that
- * suddenly shrank to a twentieth of the previous one.
- *
- * ⚠️ Optional here, and the optionality is the feature. A run recorded before #250 carries no
- * numbers at all, and that is a different fact from "used no tokens" — the row shows an empty state
- * rather than four zeroes, because a zero reads as "cost nothing".
- */
-export const AgentUsage = z.object({
-  inputTokens: z.number(),
-  outputTokens: z.number(),
-  cacheCreationInputTokens: z.number(),
-  cacheReadInputTokens: z.number(),
-});
-export type AgentUsage = z.infer<typeof AgentUsage>;
-
-export const AgentRun = z.object({
-  id: z.string(),
-  trigger: z.enum(["chat", "schedule", "mail", "task", "manual"]),
-  target: AgentRunTarget,
-  status: z.enum(["running", "completed", "failed"]),
-  startedAt: z.string(),
-  finishedAt: z.string().nullable(),
-  steps: z.number(),
-  error: z.string().nullable(),
-  /**
-   * What the run answered, for the runs nobody was watching: `schedule`, `manual` and `task`.
-   *
-   * ⚠️ A `chat` or `mail` run carries none, and that is a runtime invariant rather than an accident
-   * (#268): that answer belongs to the person whose window it was streamed into or to the
-   * correspondent it was posted to. The log screen therefore claims nothing at all on those two
-   * triggers — an empty state there would read as "the answer went missing".
-   *
-   * ⚠️ `.nullish()` for the same reason as `usage` below: a runtime from before #268 sends no such
-   * field, and a required one would blank the whole Log tab over its absence.
-   */
-  answer: z.string().nullish(),
-  // ⚠️ `.nullish()` on both, not `.nullable()`. The runtime is a separate deployment and may be a
-  // version BEHIND this page: a run list from a runtime without #250/#251 has no such field at all,
-  // and a required one would blank the whole Log tab over a missing number.
-  usage: AgentUsage.nullish(),
-  // Which model did the thinking, as `provider:model`, written into the run rather than looked up:
-  // switching the model in the profile must not relabel every past run (#251).
-  model: z.string().nullish(),
-});
-export type AgentRun = z.infer<typeof AgentRun>;
-
-/** Whether the agent is switched off. Runtime state, never part of the definition (#179). */
-export const AgentState = z.object({
-  paused: z.boolean(),
-  pausedAt: z.string().nullable(),
-  alarmAt: z.number().nullable(),
-});
-export type AgentState = z.infer<typeof AgentState>;
-
-/** What "run now" answers: the run exists, and it is on its way. */
-export const AgentManualRun = z.object({
-  runId: z.string(),
-  status: z.string(),
-});
-export type AgentManualRun = z.infer<typeof AgentManualRun>;
-
-export const AgentLogEntry = z.object({
-  id: z.string(),
-  runId: z.string(),
-  at: z.string(),
-  level: z.enum(["info", "warn", "error"]),
-  event: z.string(),
-  detail: z.string(),
-});
-export type AgentLogEntry = z.infer<typeof AgentLogEntry>;
-
-export const AgentRunList = z.object({ items: z.array(AgentRun) });
-export type AgentRunList = z.infer<typeof AgentRunList>;
-
-export const AgentRunDetail = z.object({ run: AgentRun, log: z.array(AgentLogEntry) });
-export type AgentRunDetail = z.infer<typeof AgentRunDetail>;
-
-/**
- * The runtime's own address, for the one thing that is dialled from outside this page.
- *
- * ⚠️ Only the agent's MCP endpoint is reached here, and only as a string somebody copies. A portal
- * or another agent dials it directly with its own credential (ADR-0005 §7), so it has to be the
- * runtime's real hostname — a deployment that puts the runtime somewhere else sets
- * `VITE_AGENT_RUNTIME_URL` at build time. Empty means "the origin this page came from".
- *
- * ⚠️ NOT the browser's path any more (#178). Everything this page fetches goes through intel, which
- * proxies it to the runtime over a service binding; see `agentRuntimePath` below.
- */
-export function agentRuntimeBaseUrl(): string {
-  return (import.meta.env.VITE_AGENT_RUNTIME_URL ?? "").replace(/\/$/, "");
-}
-
-export function agentMcpAddress(agentId: string): string {
-  return `${agentRuntimeBaseUrl()}/agents/${encodeURIComponent(agentId)}/mcp`;
-}
-
-/**
- * Where the browser asks, which is intel and nothing else.
- *
- * ⚠️ One door, one origin, one credential: the page carries its intel session cookie, intel opens
- * it, and intel forwards the call to the runtime with the Gate token of the person who asked. That
- * is why there is no CORS here, no second hostname to configure, and above all no Gate token in
- * browser JavaScript — the runtime still demands `agents/run`, it just hears it from intel.
- *
- * The path is relative on purpose. It is joined to intel's `/api/v1` by the data provider, which is
- * the only module that knows where intel is.
- */
-export function agentRuntimePath(agentId: string, route: string): string {
-  return `/agents/${encodeURIComponent(agentId)}${route}`;
-}

package/src/hooks/use-capabilities.ts

@@ -1,22 +0,0 @@
-import type { IntelCapabilities } from "@anchrd/intel-contract";
-import { type UseQueryResult, useQuery } from "@tanstack/react-query";
-import { useIntelRouterContext } from "@/router/router-context.ts";
-
-/**
- * What this installation is equipped to do, asked once and believed for the session (#190).
- *
- * ⚠️ Deployment facts, not the caller's permissions — a runtime does not appear or vanish while a
- * page is open, so the answer never goes stale and is never refetched. While the answer is still on
- * its way, `data` is `undefined`: a caller deciding whether to OFFER something treats that as "not
- * yet" (a menu item appearing late is fine; one that vanishes was a lie), and a caller deciding
- * whether to take a rendered page AWAY does the opposite.
- */
-export function useCapabilities(): UseQueryResult<IntelCapabilities> {
-  const { data } = useIntelRouterContext();
-  return useQuery({
-    queryKey: ["capabilities"],
-    queryFn: () => data.getCapabilities(),
-    staleTime: Number.POSITIVE_INFINITY,
-    retry: false,
-  });
-}

package/src/hooks/use-model-catalog.ts

@@ -1,26 +0,0 @@
-import type { ModelCatalog } from "@anchrd/intel-contract";
-import { type UseQueryResult, useQuery } from "@tanstack/react-query";
-import { useIntelRouterContext } from "@/router/router-context.ts";
-
-/**
- * What the offered models cost and how much they hold, asked of intel once an hour at most (#257).
- *
- * ⚠️ The caching is the point of the hook and not an optimisation. Before this, the figures were a
- * table in the bundle; the ticket's own condition for taking that away is that the replacement is
- * not "one fetch every time somebody opens the select". Prices move a few times a year, so an hour
- * is generous in the direction that matters.
- *
- * ⚠️ `retry: false`, like the tools screen's grouping query (#212). A React Query retry is PAUSED
- * while the tab is unfocused, so a select that waited on a retried query could sit unusable for as
- * long as the reader is looking elsewhere. This query only ENRICHES the select — the model can be
- * chosen without it — so it fails fast and the row simply shows no figures.
- */
-export function useModelCatalog(): UseQueryResult<ModelCatalog> {
-  const { data } = useIntelRouterContext();
-  return useQuery({
-    queryKey: ["model-catalog"],
-    queryFn: () => data.listModels(),
-    staleTime: 60 * 60 * 1_000,
-    retry: false,
-  });
-}

package/src/timezone/timezone-combobox/timezone-combobox.tsx

@@ -1,149 +0,0 @@
-import { Check, ChevronsUpDown } from "lucide-react";
-import { useMemo, useState } from "react";
-import {
-  Command,
-  CommandEmpty,
-  CommandGroup,
-  CommandInput,
-  CommandItem,
-  CommandList,
-} from "@/components/ui/command";
-import { Popover, PopoverContent, PopoverTrigger } from "@/components/ui/popover";
-import { useI18n } from "@/i18n/i18n-context.tsx";
-import { cn } from "@/lib/utils";
-import {
-  browserTimezone,
-  type TimezoneOption,
-  timezoneOption,
-  timezoneOptions,
-} from "../timezone.ts";
-
-/**
- * Picking one of 418 timezones.
- *
- * ⚠️ A `Select` was the wrong shape and this replaces it (#243). Four hundred entries cannot be
- * scrolled to, and a bare zone name does not say whether you got the right one — `Europe/Berlin`
- * and `Europe/Madrid` are the same clock, `America/New_York` is not. So: type to search, and the
- * current offset stands in front of every name.
- *
- * ⚠️ The label is computed here, at render time, and never stored. A zone's offset AND its
- * abbreviation move with daylight saving, so a written-down label is wrong for half of every year.
- */
-interface TimezoneComboboxProps {
-  id: string;
-  value: string;
-  onChange(zone: string): void;
-  /** Handed in rather than read from the clock, so a test does not have to travel in time. */
-  now?: Date;
-  describedBy?: string;
-}
-
-function OptionLabel({ option }: { option: TimezoneOption }) {
-  return (
-    <>
-      {/* Fixed width, so the zone names line up into a column instead of stepping left and right
-          with every offset. Tabular figures keep "GMT+05:30" and "GMT-04:00" the same width, and
-          ⚠️ `whitespace-nowrap` is not decoration: the longest label ("GMT-09:00 · HADT") wrapped
-          onto a second line and pushed its own row out of the column. */}
-      <span className="w-36 shrink-0 whitespace-nowrap text-xs tabular-nums text-muted-foreground">
-        {option.offsetLabel}
-        {option.abbreviation ? ` · ${option.abbreviation}` : ""}
-      </span>
-      <span className="truncate">{option.zone.replace(/_/g, " ")}</span>
-    </>
-  );
-}
-
-export function TimezoneCombobox({ id, value, onChange, now, describedBy }: TimezoneComboboxProps) {
-  const i18n = useI18n();
-  const [open, setOpen] = useState(false);
-  const at = now ?? new Date();
-  // The clock is a dependency on purpose: without it in the key, a session that crossed a DST
-  // boundary would keep showing yesterday's offsets.
-  const at_ = at.getTime();
-
-  const options = useMemo(
-    () => timezoneOptions(value, new Date(at_), i18n.locale),
-    [value, at_, i18n.locale],
-  );
-  const selected = useMemo(
-    () => timezoneOption(value, new Date(at_), i18n.locale),
-    [value, at_, i18n.locale],
-  );
-  // The reader's own zone, pinned above the list: it is the answer in the overwhelming majority of
-  // cases, and finding it in a sorted list of 418 is the work this saves.
-  const own = useMemo(
-    () => timezoneOption(browserTimezone(), new Date(at_), i18n.locale),
-    [at_, i18n.locale],
-  );
-
-  const choose = (zone: string) => {
-    onChange(zone);
-    setOpen(false);
-  };
-
-  return (
-    <Popover open={open} onOpenChange={setOpen}>
-      <PopoverTrigger asChild>
-        <button
-          id={id}
-          type="button"
-          role="combobox"
-          aria-expanded={open}
-          aria-describedby={describedBy}
-          className="flex w-full items-center gap-2 rounded-md border bg-background px-3 py-2 text-left text-sm outline-none focus-visible:ring-2 focus-visible:ring-ring"
-        >
-          <OptionLabel option={selected} />
-          <ChevronsUpDown aria-hidden="true" className="ml-auto size-4 shrink-0 opacity-50" />
-        </button>
-      </PopoverTrigger>
-      <PopoverContent className="w-(--radix-popover-trigger-width) p-0" align="start">
-        {/* ⚠️ A substring filter, not cmdk's default fuzzy one. Fuzzy matches a scattered
-            subsequence, so over 418 zones "berlin" also surfaced Brisbane, Dublin and Lisbon —
-            technically a match, useless as an answer. Prefix beats contains, so typing a city puts
-            that city first. An empty search returns 1 for everything, which leaves the list in DOM
-            order: sorted west to east. */}
-        <Command
-          filter={(value, search, keywords) => {
-            const needle = search.trim().toLowerCase();
-            if (!needle) return 1;
-            const haystack = [value.toLowerCase(), ...(keywords ?? [])];
-            if (haystack.some((word) => word.startsWith(needle))) return 2;
-            return haystack.some((word) => word.includes(needle)) ? 1 : 0;
-          }}
-        >
-          <CommandInput placeholder={i18n.t("settings.timezoneSearch")} />
-          <CommandList>
-            <CommandEmpty>{i18n.t("settings.timezoneNoMatch")}</CommandEmpty>
-            {own.zone !== value ? (
-              <CommandGroup heading={i18n.t("settings.timezoneOwn")}>
-                <CommandItem value={own.zone} keywords={own.keywords} onSelect={choose}>
-                  <OptionLabel option={own} />
-                </CommandItem>
-              </CommandGroup>
-            ) : null}
-            <CommandGroup heading={i18n.t("settings.timezoneAll")}>
-              {options.map((option) => (
-                <CommandItem
-                  key={option.zone}
-                  value={option.zone}
-                  keywords={option.keywords}
-                  onSelect={choose}
-                >
-                  <OptionLabel option={option} />
-                  <Check
-                    aria-hidden="true"
-                    className={cn(
-                      "ml-auto size-4 shrink-0",
-                      option.zone === value ? "opacity-100" : "opacity-0",
-                    )}
-                  />
-                </CommandItem>
-              ))}
-            </CommandGroup>
-          </CommandList>
-        </Command>
-      </PopoverContent>
-    </Popover>
-  );
-}

package/src/timezone/timezone-context.tsx

@@ -1,65 +0,0 @@
-import { createContext, type ReactNode, useContext, useMemo, useState } from "react";
-import { browserTimezone, readChosenTimezone, rememberTimezone } from "./timezone.ts";
-
-// The React seam of the timezone preference, the same shape as i18n-context and theme-context.
-
-export interface TimezoneSelection {
-  /** The zone to read times in: the choice, or the browser's own where there is none. */
-  current: string;
-  /**
-   * ⚠️ The zone somebody actually CHOSE — `null` while they never did (#256). `current` cannot
-   * answer this: it falls back to the browser, and a screen that treated that as a preference would
-   * annotate every schedule with a guess nobody made.
-   */
-  chosen: string | null;
-  select(zone: string): void;
-}
-
-const TimezoneContext = createContext<TimezoneSelection | null>(null);
-
-interface TimezoneProviderProps {
-  store?: Pick<Storage, "getItem" | "setItem">;
-  children: ReactNode;
-}
-
-export function TimezoneProvider({ store, children }: TimezoneProviderProps) {
-  const [chosen, setChosen] = useState(() => readChosenTimezone(store));
-
-  const selection = useMemo<TimezoneSelection>(
-    () => ({
-      current: chosen ?? browserTimezone(),
-      chosen,
-      select: (zone) => {
-        rememberTimezone(zone, store);
-        setChosen(zone);
-      },
-    }),
-    [chosen, store],
-  );
-
-  return <TimezoneContext value={selection}>{children}</TimezoneContext>;
-}
-
-// `null` without a provider — the settings dialog asks whether there is anything to choose.
-export function useTimezoneSelection(): TimezoneSelection | null {
-  return useContext(TimezoneContext);
-}
-
-// The zone to read times in. Never null: a component without a provider still has to format a date,
-// and the browser's own zone is the honest answer there.
-export function useTimezone(): string {
-  const selection = useContext(TimezoneContext);
-  return selection?.current ?? browserTimezone();
-}
-
-/**
- * The zone the reader CHOSE, or `null` (#256).
- *
- * ⚠️ Not `useTimezone`. This is for screens that add the reader's own reading BESIDE a time that is
- * already correct — the agent's calendar. Nothing may be added for somebody who never set a zone:
- * the browser's guess presented as "your time" is a setting the reader did not make, and it would
- * put a second time on every row of a screen that was fine as it was.
- */
-export function useChosenTimezone(): string | null {
-  return useContext(TimezoneContext)?.chosen ?? null;
-}