@lostgradient/cinder 0.8.0 → 0.11.0

package/CHANGELOG.md

@@ -1,5 +1,30 @@
 # @lostgradient/cinder
 
+## 0.11.0
+
+### Minor Changes
+
+- [#717](https://github.com/stevekinney/cinder/pull/717) [`28ddb39`](https://github.com/stevekinney/cinder/commit/28ddb39dd9ca9014bf93c71e4bbe401e304773b8) Thanks [@stevekinney](https://github.com/stevekinney)! - Add a `commitOnSubmit` option to TagInput so native forms can commit a pending draft before submission.
+
+## 0.10.0
+
+### Minor Changes
+
+- [#711](https://github.com/stevekinney/cinder/pull/711) [`6ae21f8`](https://github.com/stevekinney/cinder/commit/6ae21f837f85dd88fd8caf6f3110d80ad950304b) Thanks [@stevekinney](https://github.com/stevekinney)! - Add four additive surfaces for coordination and scheduling UIs:
+  - **RunStepTimeline** gains branch/coordination groups — a `kind: 'branch'` entry with parallel sub-lanes (`won` / `lost` / `settled` outcomes, winner emphasized, losers muted, collapsible), a per-step `rewound` flag for speculatively-executed-then-unwound steps, and a per-step `compensates` linkage that renders a compensating step inset beneath its forward step with a reversal affordance. Existing `RunStep[]` timelines render unchanged.
+  - **ConnectionIndicator** (new) — a standalone live-connection status pill with `connecting` / `live` / `reconnecting` / `polling` / `stale` / `closed` states. `live` pulses (static under reduced motion), `reconnecting` exposes an attempt-count slot, and `polling` reads distinctly quieter than `live`. Status is conveyed by icon + text (never color alone) with a `status` role, and reuses StatusDot's semantic tokens so it composes cleanly beside EventStreamViewer.
+  - **ScheduleBuilder** (new) — a date-library-free recurrence control with Presets / Cron / Interval modes behind a SegmentedControl, an always-visible plain-English summary, a "next N fires" preview (computed via an injected `computeNextFires` callback, hidden when absent), and a timezone slot. Emits a discriminated `{ mode: 'cron' | 'interval', ... }` value; presets lower losslessly to one of those two.
+  - **InvocationRuleBuilder** gains a conditions-only mode: rules carry conditions with no action target, operators constrained to `eq` / `gt` / `lt` / `gte` / `lte`, and typed value inputs inferred from field type. The existing conditions-plus-actions mode is unchanged and remains the default.
+
+## 0.9.0
+
+### Minor Changes
+
+- [#693](https://github.com/stevekinney/cinder/pull/693) [`124e7b2`](https://github.com/stevekinney/cinder/commit/124e7b2740d8243e434c1eb831e2c760dab6265a) Thanks [@stevekinney](https://github.com/stevekinney)! - Move `conversationalist` from a transitive dependency to a required peer
+  dependency. Consumers that use Chat or Cinder's conversation helpers must
+  install `conversationalist@^0.2.1` and `zod@4.4.1` directly so the application
+  and Cinder share one conversation type/schema instance.
+
 ## 0.8.0
 
 ### Minor Changes

package/README.md

@@ -7,10 +7,10 @@ Use cinder when you want UI building blocks without adopting a framework-level r
 ## Install
 
 ```bash
-bun add @lostgradient/cinder svelte lucide-svelte
+bun add @lostgradient/cinder svelte lucide-svelte conversationalist zod
 ```
 
-`svelte` and `lucide-svelte` are peer dependencies. Cinder uses Lucide for its own component chrome, but it does not provide a general icon library for your application-specific icons.
+`svelte`, `lucide-svelte`, `conversationalist`, and `zod` are required peer dependencies. Cinder uses Lucide for its own component chrome, but it does not provide a general icon library for your application-specific icons. `@lostgradient/cinder/chat` expects your app to provide `conversationalist@^0.2.1` and `zod@4.4.1` so Chat data contracts resolve through the same package instances as the host application.
 
 Rich editor, markdown rendering, editor/commentary re-exports, and syntax-highlighting surfaces use optional peer dependencies. Install them only when your app imports `@lostgradient/cinder/chat` with the default composer, `@lostgradient/cinder/markdown-editor`, `@lostgradient/cinder/review-editor`, `@lostgradient/cinder/markdown`, `@lostgradient/cinder/markdown/*`, `@lostgradient/cinder/editor`, `@lostgradient/cinder/editor/*`, `@lostgradient/cinder/commentary`, `@lostgradient/cinder/commentary/*`, `@lostgradient/cinder/highlighters/shiki`, or relies on `Chat` built-in markdown/tool message rendering or `CodeBlock` automatic highlighting:
 

package/components.json

@@ -3,7 +3,7 @@
   "manifestVersion": 1,
   "package": {
     "name": "@lostgradient/cinder",
-    "version": "0.8.0",
+    "version": "0.11.0",
     "framework": "svelte",
     "frameworkVersionRange": ">=5.56.0 <6",
     "classPrefix": "cinder-",
@@ -290,14 +290,7 @@
           "reason": "Collecting arbitrary form input for a workflow — compose form controls directly instead."
         }
       ],
-      "related": [
-        "card",
-        "badge",
-        "status-dot",
-        "payload-inspector",
-        "secret-value-field",
-        "code-block"
-      ],
+      "related": ["card", "badge", "status-dot", "payload-inspector", "code-block", "collapsible"],
       "hasConstraints": false,
       "hasExamples": true,
       "artifacts": {
@@ -307,7 +300,7 @@
       },
       "a11y": {
         "notes": [
-          "Uses a named region and native button controls so approval actions are discoverable by assistive technology.",
+          "Renders as an article with native button controls so approval actions are discoverable without polluting the landmark list.",
           "Expiration changes update the visible state but do not fire approval callbacks automatically."
         ]
       }
@@ -950,6 +943,56 @@
         "examples": "@lostgradient/cinder/chat/examples"
       }
     },
+    {
+      "name": "ChatComposerPopover",
+      "id": "chat-composer-popover",
+      "import": "@lostgradient/cinder/chat-composer-popover",
+      "exportName": "ChatComposerPopover",
+      "category": "overlay",
+      "status": "beta",
+      "purpose": "Chat composer-bound slash-command and mention listbox primitive.",
+      "tags": ["chat", "command", "overlay"],
+      "useWhen": [
+        "Adding slash commands, mentions, or autocomplete to ChatInput without re-implementing combobox ARIA.",
+        "Composer suggestions should stay anchored to the active token and leave command definitions in application code."
+      ],
+      "avoidWhen": [
+        {
+          "reason": "Opening a global command launcher detached from the composer — use command-palette instead."
+        },
+        {
+          "reason": "Anchoring a generic command menu to an arbitrary input — use command-menu instead."
+        }
+      ],
+      "related": ["chat", "command-menu", "command-item", "command-palette"],
+      "hasConstraints": false,
+      "hasExamples": true,
+      "artifacts": {
+        "schema": "@lostgradient/cinder/chat-composer-popover/schema",
+        "variables": "@lostgradient/cinder/chat-composer-popover/variables",
+        "examples": "@lostgradient/cinder/chat-composer-popover/examples"
+      },
+      "a11y": {
+        "pattern": "WAI-ARIA Combobox with Listbox Popup",
+        "keyboard": [
+          {
+            "keys": "ArrowUp / ArrowDown",
+            "action": "Moves the active suggestion."
+          },
+          {
+            "keys": "Enter",
+            "action": "Selects the active suggestion."
+          },
+          {
+            "keys": "Escape",
+            "action": "Dismisses the suggestion popover."
+          }
+        ],
+        "notes": [
+          "Passes combobox role and aria-expanded, aria-controls, aria-activedescendant, and aria-autocomplete through to ChatInput's composer overlay API."
+        ]
+      }
+    },
     {
       "name": "ChatConversationHeader",
       "id": "chat-conversation-header",
@@ -1466,6 +1509,44 @@
         "examples": "@lostgradient/cinder/confirm-dialog/examples"
       }
     },
+    {
+      "name": "ConnectionIndicator",
+      "id": "connection-indicator",
+      "import": "@lostgradient/cinder/connection-indicator",
+      "exportName": "ConnectionIndicator",
+      "category": "feedback",
+      "status": "beta",
+      "purpose": "Small standalone status pill for a live connection, distinguishing connecting, live, reconnecting, polling, stale, and closed states through icon and text rather than color alone.",
+      "tags": ["connection", "status", "realtime"],
+      "useWhen": [
+        "Surfacing the transport-level health of a websocket, SSE stream, or polling loop as a compact, self-contained pill.",
+        "Distinguishing push (`live`) from interval polling (`polling`) so operators don't mistake one for the other."
+      ],
+      "avoidWhen": [
+        {
+          "reason": "Annotating a static entity's state (a row, a user, a deployment) rather than a live transport — use status-dot instead.",
+          "alternative": "status-dot"
+        },
+        {
+          "reason": "Rendering a full event log with per-event connection transitions — use event-stream-viewer instead.",
+          "alternative": "event-stream-viewer"
+        }
+      ],
+      "related": ["status-dot", "event-stream-viewer", "badge"],
+      "hasConstraints": false,
+      "hasExamples": true,
+      "artifacts": {
+        "schema": "@lostgradient/cinder/connection-indicator/schema",
+        "variables": "@lostgradient/cinder/connection-indicator/variables",
+        "examples": "@lostgradient/cinder/connection-indicator/examples"
+      },
+      "a11y": {
+        "pattern": "role=\"status\" live region",
+        "notes": [
+          "Status is conveyed by icon and text together, never color alone (WCAG 1.4.1); the live pulsing dot collapses to a static dot under prefers-reduced-motion."
+        ]
+      }
+    },
     {
       "name": "Container",
       "id": "container",
@@ -2782,7 +2863,8 @@
       "purpose": "Render and edit conditional automation rules composed of conditions and actions.",
       "tags": ["automation", "rules"],
       "useWhen": [
-        "Building a UI for configuring which agents or services run based on event conditions."
+        "Building a UI for configuring which agents or services run based on event conditions.",
+        "You only need conditions (no actions) — pass mode=\"conditions\" for a constrained operator set and typed value inputs."
       ],
       "avoidWhen": [
         {
@@ -3645,11 +3727,11 @@
       "exportName": "PayloadInspector",
       "category": "data-display",
       "status": "stable",
-      "purpose": "Composed inspector for structured payloads with summary, tree, and raw views, copy actions, and size/truncation status.",
+      "purpose": "Compact inspector for structured payloads: a labeled tree view with a copy action and size/truncation status.",
       "tags": ["json", "inspector", "payload"],
       "useWhen": [
         "Inspecting workflow inputs, signal payloads, activity results, or API response bodies in a dashboard.",
-        "Displaying a structured payload with metadata like content type, source, and timestamp."
+        "Displaying a structured payload with a visible label, byte size, and copy affordance."
       ],
       "avoidWhen": [
         {
@@ -3659,7 +3741,7 @@
           "reason": "Needing search, filtering, or virtualization over large collections — compose a custom viewer."
         }
       ],
-      "related": ["json-viewer", "code-block", "description-list", "copy-button"],
+      "related": ["json-viewer", "code-block", "copy-button"],
       "hasConstraints": false,
       "hasExamples": true,
       "artifacts": {
@@ -4066,11 +4148,12 @@
       "exportName": "RunStepTimeline",
       "category": "data-display",
       "status": "stable",
-      "purpose": "Ordered step-by-step execution rail that visualizes async run state with per-step status, durations, retries, optional progress, and expandable detail panels.",
+      "purpose": "Ordered execution rail for async run state: per-step status, durations, retries, plus parallel branch groups, rewound speculation, and saga compensation.",
       "tags": ["timeline", "progress", "execution"],
       "useWhen": [
         "Displaying the live or completed state of a multi-step async operation: CI jobs, workflow runs, import pipelines, or deployments.",
-        "Showing a sequence where one step is currently active and prior steps have streamed in over time."
+        "Showing a sequence where one step is currently active and prior steps have streamed in over time.",
+        "Visualizing speculative parallel work (race N lanes, keep the winner) or saga-style compensation of a forward step."
       ],
       "avoidWhen": [
         {
@@ -4089,6 +4172,44 @@
         "examples": "@lostgradient/cinder/run-step-timeline/examples"
       }
     },
+    {
+      "name": "ScheduleBuilder",
+      "id": "schedule-builder",
+      "import": "@lostgradient/cinder/schedule-builder",
+      "exportName": "ScheduleBuilder",
+      "category": "form",
+      "status": "beta",
+      "purpose": "Recurrence-definition control that authors a cron or fixed-interval schedule via presets, raw cron fields, or an interval, alongside an always-visible summary, next-fires preview, and timezone slot.",
+      "tags": ["schedule", "recurrence", "cron", "form"],
+      "useWhen": [
+        "Letting a user define when a job or notification recurs, supplying your own date/cron library to compute upcoming fire times.",
+        "You want a friendly presets UI (every N, daily, weekly, monthly) that still round-trips to a portable cron or interval value."
+      ],
+      "avoidWhen": [
+        {
+          "reason": "You need overlap policy, jitter, or backfill controls — those belong to the consumer's surrounding form.",
+          "alternative": "invocation-rule-builder"
+        },
+        {
+          "reason": "You only need to pick a single point in time, not a recurrence — use date-picker instead.",
+          "alternative": "date-picker"
+        }
+      ],
+      "related": ["date-picker", "segmented-control", "input", "time-field"],
+      "hasConstraints": false,
+      "hasExamples": true,
+      "artifacts": {
+        "schema": "@lostgradient/cinder/schedule-builder/schema",
+        "variables": "@lostgradient/cinder/schedule-builder/variables",
+        "examples": "@lostgradient/cinder/schedule-builder/examples"
+      },
+      "a11y": {
+        "pattern": "WAI-ARIA Tabs",
+        "notes": [
+          "The three authoring modes (presets, cron, interval) are a tablist; each cron field reports validity via aria-invalid and an associated hint/error."
+        ]
+      }
+    },
     {
       "name": "SchemaForm",
       "id": "schema-form",
@@ -5126,11 +5247,12 @@
       "exportName": "Tab",
       "category": "navigation",
       "status": "stable",
-      "purpose": "Single selectable tab trigger inside a tabs composite that registers with the parent context and controls a matching tab-panel.",
+      "purpose": "Single selectable tab trigger inside a tabs composite that registers with the parent context and controls a matching tab-panel or caller-owned panel id.",
       "tags": ["navigation", "tabs"],
       "useWhen": [
         "Declaring one tab heading inside a tabs ancestor with a stable value identifier.",
-        "Pairing one-to-one with a tab-panel that shares the same value to wire aria-controls."
+        "Pairing one-to-one with a tab-panel that shares the same value to wire aria-controls.",
+        "Pointing multiple tab triggers at a caller-owned panel with the controls prop."
       ],
       "avoidWhen": [
         {

package/dist/components/_internal/command-list-context.d.ts

@@ -30,16 +30,16 @@ export type CommandItemRegistrationInput = {
  * Context provided by CommandPalette and consumed by CommandItem.
  */
 export type CommandListContext = {
-    /** Stable id for the listbox; items compose their own ids from this. */
+    /** Live id for the listbox; items keep their ids in sync with it. */
     readonly listboxId: string;
     /** Id of the currently active (virtually focused) item, or null. */
     readonly activeItemId: string | null;
     /**
      * Called by each CommandItem when it mounts.
-     * Returns a stable id and an unregister function.
+     * Returns a live id handle and an unregister function.
      */
     register: (input: CommandItemRegistrationInput, node: HTMLElement) => {
-        id: string;
+        readonly id: string;
         unregister: () => void;
     };
     /** Called by items on pointerenter to sync hover with arrow-key navigation. */

package/dist/components/_internal/create-command-list-state.svelte.d.ts

@@ -1,7 +1,12 @@
 import type { CommandItemRegistrationInput } from './command-list-context.ts';
+type RegistrationHandle = {
+    id: string;
+    unregister: () => void;
+};
 type RegistrationRecord = CommandItemRegistrationInput & {
     id: string;
     node: HTMLElement;
+    handle: RegistrationHandle;
 };
 export type CommandListKeyboardOptions = {
     event: KeyboardEvent;
@@ -12,32 +17,27 @@ export type CommandListKeyboardOptions = {
 };
 export declare class CommandListState {
     #private;
-    readonly listboxId: string;
     registrations: RegistrationRecord[];
     registrationsReady: boolean;
     enabledIds: string[];
     activeItemId: string | null;
-    constructor(listboxId: string);
+    constructor(listboxId: string | (() => string));
+    get listboxId(): string;
+    syncListboxId(nextListboxId?: string): void;
     resetActiveItem(): void;
     refreshRegistrationsReady(): void;
     scrollActiveItemIntoView(): void;
     setActiveById(id: string): void;
-    register(input: CommandItemRegistrationInput, node: HTMLElement): {
-        id: string;
-        unregister: () => void;
-    };
+    register(input: CommandItemRegistrationInput, node: HTMLElement): RegistrationHandle;
     activateItemById(id: string): RegistrationRecord | null;
     handleKeydown({ event, onEnter, onEscape, ignoreModifiedNavigation, preventDefaultOnEmptyEnter, }: CommandListKeyboardOptions): boolean;
     createContext(activateItemById?: (id: string) => void): {
         readonly listboxId: string;
         readonly activeItemId: string | null;
-        register: (input: CommandItemRegistrationInput, node: HTMLElement) => {
-            id: string;
-            unregister: () => void;
-        };
+        register: (input: CommandItemRegistrationInput, node: HTMLElement) => RegistrationHandle;
         setActiveById: (id: string) => void;
         activateItemById: (id: string) => void;
     };
 }
-export declare function createCommandListState(listboxId: string): CommandListState;
+export declare function createCommandListState(listboxId: string | (() => string)): CommandListState;
 export {};