@crewlethq/ui 0.54.1 → 0.56.0

package/dist/{chunk-LDGQIDIZ.js → chunk-CGT4R7LW.js}

@@ -1,9 +1,12 @@
 import { StatusDot } from './chunk-WIATRXEJ.js';
+import { Spinner } from './chunk-EA23JG6R.js';
 import { VisuallyHidden } from './chunk-BZFWDIV6.js';
 import { cx } from './chunk-ODEQTPFM.js';
 import './Stepper-QEJI5RGX.css';
-import { CheckGlyph, TriangleAlertGlyph } from '@crewlethq/icons/glyphs';
+import './StepList-A4YVU4JI.css';
+import { CircleCheckGlyph, CircleAlertGlyph, LockGlyph, CircleStopGlyph, ClockGlyph, CheckGlyph, TriangleAlertGlyph } from '@crewlethq/icons/glyphs';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import { Fragment as Fragment$1 } from 'react';
 
 function Stepper({
   steps,
@@ -125,5 +128,64 @@ function Stepper({
     )
   );
 }
+var STEP_STATES = ["running", "done", "failed", "refused", "stopped", "waiting"];
+var STEP_STATE_LABELS = {
+  running: "Running",
+  done: "Done",
+  failed: "Failed",
+  refused: "Not permitted",
+  stopped: "Stopped",
+  waiting: "Waiting for your approval"
+};
+function StepStateMark({ state, className }) {
+  return /* @__PURE__ */ jsx("span", { className: cx("crewlet-step-mark", `crewlet-step-mark--${state}`, className), "aria-hidden": "true", children: state === "running" ? /* @__PURE__ */ jsx(Spinner, { size: "sm" }) : state === "done" ? /* @__PURE__ */ jsx(CircleCheckGlyph, { size: "sm" }) : state === "failed" ? /* @__PURE__ */ jsx(CircleAlertGlyph, { size: "sm" }) : state === "refused" ? /* @__PURE__ */ jsx(LockGlyph, { size: "sm" }) : state === "stopped" ? /* @__PURE__ */ jsx(CircleStopGlyph, { size: "sm" }) : /* @__PURE__ */ jsx(ClockGlyph, { size: "sm" }) });
+}
+function stepDetailPieces(text) {
+  const pieces = [];
+  let piece = "";
+  for (const character of text) {
+    if (character === " ") {
+      if (piece) pieces.push(piece);
+      pieces.push(" ");
+      piece = "";
+      continue;
+    }
+    piece += character;
+    if (character === "/" || character === "?" || character === "&") {
+      pieces.push(piece);
+      piece = "";
+    }
+  }
+  if (piece) pieces.push(piece);
+  return pieces;
+}
+function Detail({ children }) {
+  if (typeof children !== "string") return /* @__PURE__ */ jsx(Fragment, { children });
+  return /* @__PURE__ */ jsx(Fragment, { children: stepDetailPieces(children).map(
+    (piece, index) => piece === " " ? /* @__PURE__ */ jsx(Fragment$1, { children: " " }, index) : /* @__PURE__ */ jsx("span", { className: "crewlet-step-list__piece", children: piece }, index)
+  ) });
+}
+function StepList({ steps, label, summary, labels: overrides, className, ...rest }) {
+  const labels = overrides ? { ...STEP_STATE_LABELS, ...overrides } : STEP_STATE_LABELS;
+  const seen = /* @__PURE__ */ new Set();
+  for (const step of steps) {
+    if (seen.has(step.id)) throw new RangeError(`StepList step ids must be unique; "${step.id}" is used twice`);
+    seen.add(step.id);
+  }
+  return /* @__PURE__ */ jsxs("div", { ...rest, className: cx("crewlet-step-list", className), children: [
+    summary === void 0 ? null : /* @__PURE__ */ jsx("div", { className: "crewlet-step-list__summary", children: summary }),
+    /* @__PURE__ */ jsx("ol", { role: "list", "aria-label": label, className: "crewlet-step-list__steps", children: steps.map((step) => /* @__PURE__ */ jsxs("li", { className: cx("crewlet-step-list__step", `crewlet-step-list__step--${step.state}`), children: [
+      /* @__PURE__ */ jsx(StepStateMark, { state: step.state, className: "crewlet-step-list__mark" }),
+      /* @__PURE__ */ jsxs("span", { className: "crewlet-step-list__text", children: [
+        /* @__PURE__ */ jsxs("span", { className: "crewlet-step-list__label", children: [
+          step.label,
+          /* @__PURE__ */ jsx(VisuallyHidden, { children: `, ${labels[step.state]}` })
+        ] }),
+        step.detail === void 0 ? null : /* @__PURE__ */ jsx("code", { className: "crewlet-step-list__detail", children: /* @__PURE__ */ jsx(Detail, { children: step.detail }) })
+      ] }),
+      step.duration === void 0 ? null : /* @__PURE__ */ jsx("span", { className: "crewlet-step-list__duration", children: step.duration })
+    ] }, step.id)) })
+  ] });
+}
 
-export { Stepper };
+export { STEP_STATES, STEP_STATE_LABELS, StepList, StepStateMark, Stepper, stepDetailPieces };

package/dist/{chunk-WXWMHYKW.js → chunk-D5OSP3KI.js}

@@ -1,6 +1,6 @@
-import { Stepper } from './chunk-LDGQIDIZ.js';
+import { Stepper } from './chunk-CGT4R7LW.js';
 import { PageHeader } from './chunk-DKB73KZI.js';
-import { Disclosure } from './chunk-OGXHZHRX.js';
+import { Disclosure } from './chunk-GG4QZWMQ.js';
 import { useHeadingLevel, nextHeadingLevel, headingTag, HeadingLevelProvider } from './chunk-PQADV6P6.js';
 import { useMediaMatch } from './chunk-RTPQDNW3.js';
 import { cx } from './chunk-ODEQTPFM.js';

package/dist/{chunk-CQEYF3UW.js → chunk-DOPPU6TZ.js}

@@ -1,11 +1,11 @@
 import { useReorder } from './chunk-XJ2QEBMM.js';
 import { Kbd } from './chunk-SMBKXWML.js';
-import { FormField, Textarea } from './chunk-LJHH4WWB.js';
+import { FormField, Textarea } from './chunk-FXQLNETQ.js';
 import { characterCountState, CharacterCount, countCharacters } from './chunk-XCUUI7E7.js';
 import { announce } from './chunk-RSAQOKH3.js';
-import { Button } from './chunk-OG6CL3EB.js';
+import { Button } from './chunk-HD4QJ2SI.js';
 import { isComposing } from './chunk-H5XTJ7GJ.js';
-import { IconButton } from './chunk-LACA4JGC.js';
+import { IconButton } from './chunk-2BQYODY3.js';
 import { cx } from './chunk-ODEQTPFM.js';
 import './ListInput-RLQND5QK.css';
 import { forwardRef, useState, useRef, useImperativeHandle, useLayoutEffect, useId } from 'react';

package/dist/{chunk-AC22RZKC.js → chunk-DRT4L4WC.js}

@@ -1,12 +1,23 @@
 import { useLayerContainer } from './chunk-OMV5W53A.js';
 import { VisuallyHidden } from './chunk-BZFWDIV6.js';
 import { cx } from './chunk-ODEQTPFM.js';
-import './Toaster-C6BQ7L6I.css';
+import './Toaster-MX7TBMC3.css';
 import { createContext, useMemo, useState, useRef, useEffect, useContext, useCallback } from 'react';
 import { createPortal } from 'react-dom';
 import { XGlyph, CircleAlertGlyph, TriangleAlertGlyph, CircleCheckGlyph, InfoGlyph } from '@crewlethq/icons/glyphs';
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 
+function toasterInsetStyle(inset) {
+  if (!inset) return void 0;
+  const px = (value) => typeof value === "number" && Number.isFinite(value) && value > 0 ? value : 0;
+  const inline = px(inset.inline);
+  const block = px(inset.block);
+  if (inline === 0 && block === 0) return void 0;
+  return {
+    "--crewlet-toaster-inset-inline": `${inline}px`,
+    "--crewlet-toaster-inset-block": `${block}px`
+  };
+}
 var ICONS = {
   info: /* @__PURE__ */ jsx(InfoGlyph, { size: "lg" }),
   success: /* @__PURE__ */ jsx(CircleCheckGlyph, { size: "lg" }),
@@ -149,6 +160,7 @@ function Toaster({
   onDismiss,
   renderAction,
   position = "bottom-right",
+  inset,
   politeLabel = "Notifications",
   assertiveLabel = "Alerts",
   dismissLabel = "Dismiss notification",
@@ -189,7 +201,7 @@ function Toaster({
      * they watch a region for changes, and a region's first appearance is not
      * one.
      */
-    /* @__PURE__ */ jsxs("div", { className: cx("crewlet-toaster", `crewlet-toaster--${position}`, className), children: [
+    /* @__PURE__ */ jsxs("div", { className: cx("crewlet-toaster", `crewlet-toaster--${position}`, className), style: toasterInsetStyle(inset), children: [
       toasts.map((toast) => /* @__PURE__ */ jsx(
         ToastItem,
         {
@@ -229,7 +241,7 @@ function admit(held, toast, max) {
   );
   return stack.filter((one) => !evicted.has(one));
 }
-function ToastProvider({ children, position = "bottom-right", renderAction, max = 4 }) {
+function ToastProvider({ children, position = "bottom-right", inset, renderAction, max = 4 }) {
   const [toasts, setToasts] = useState([]);
   const next = useRef(1);
   const dismiss = useCallback((id) => {
@@ -257,8 +269,8 @@ function ToastProvider({ children, position = "bottom-right", renderAction, max
   );
   return /* @__PURE__ */ jsxs(ToastContext.Provider, { value: api, children: [
     children,
-    /* @__PURE__ */ jsx(Toaster, { toasts, onDismiss: dismiss, position, renderAction })
+    /* @__PURE__ */ jsx(Toaster, { toasts, onDismiss: dismiss, position, inset, renderAction })
   ] });
 }
 
-export { ToastProvider, Toaster, useToast };
+export { ToastProvider, Toaster, toasterInsetStyle, useToast };

package/dist/chunk-E4DZOE55.js

@@ -0,0 +1,162 @@
+import { ReceiptStrip, RefusalStrip } from './chunk-XQI2OUV4.js';
+import { StatusCard } from './chunk-WDIVALLP.js';
+import { ChangeList } from './chunk-NEHSV55H.js';
+import { Button } from './chunk-HD4QJ2SI.js';
+import { Spinner } from './chunk-EA23JG6R.js';
+import { cx } from './chunk-ODEQTPFM.js';
+import './ProposalCard-HLB3FNLA.css';
+import { RefreshCwGlyph, LockGlyph, BanGlyph, ClockGlyph, CircleAlertGlyph, CircleCheckGlyph } from '@crewlethq/icons/glyphs';
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+
+var PROPOSAL_STATES = [
+  "pending",
+  "stepup",
+  "applying",
+  "applied",
+  "declined",
+  "expired",
+  "stale",
+  "failed"
+];
+var PROPOSAL_CARD_LABELS = {
+  needsApproval: "Needs your approval",
+  needsSignIn: "Needs sign-in",
+  applying: "Applying",
+  saving: "Saving",
+  applied: "Applied",
+  saved: "Saved",
+  declined: "Declined",
+  expired: "Expired",
+  stale: "Needs a fresh look",
+  notApplied: "Not applied",
+  decline: "Decline",
+  confirmIdentity: "Confirm it\u2019s you",
+  prepareAgain: "Prepare it again",
+  tryAgain: "Try again",
+  whatWillChange: "What will change",
+  whatWillBeCreated: "What will be created",
+  whatChanged: "What changed",
+  whatWasCreated: "What was created",
+  whatWasProposed: "What was proposed",
+  stepUpNotice: "This approval asks you to sign in again. Nothing changed yet.",
+  declinedNotice: "You declined this. Nothing changed.",
+  expiredNotice: "This proposal expired. Nothing changed.",
+  staleNotice: "What this would change moved after it was prepared, so it was not applied. Nothing changed.",
+  nothingChanged: "Nothing changed.",
+  busy: "The approved change is being carried out"
+};
+var SETTLED = /* @__PURE__ */ new Set(["applied", "declined", "expired", "stale", "failed"]);
+function statusOf(state, scope, labels) {
+  switch (state) {
+    case "pending":
+      return { label: labels.needsApproval, tone: "warning", icon: /* @__PURE__ */ jsx(ClockGlyph, { size: "xs" }) };
+    case "stepup":
+      return { label: labels.needsSignIn, tone: "warning", icon: /* @__PURE__ */ jsx(LockGlyph, { size: "xs" }) };
+    case "applying":
+      return { label: scope === "page" ? labels.applying : labels.saving, tone: "neutral", icon: /* @__PURE__ */ jsx(Spinner, { size: "xs" }) };
+    case "applied":
+      return { label: scope === "page" ? labels.applied : labels.saved, tone: "success", icon: /* @__PURE__ */ jsx(CircleCheckGlyph, { size: "xs" }) };
+    case "declined":
+      return { label: labels.declined, tone: "neutral", icon: /* @__PURE__ */ jsx(BanGlyph, { size: "xs" }) };
+    case "expired":
+      return { label: labels.expired, tone: "neutral", icon: /* @__PURE__ */ jsx(ClockGlyph, { size: "xs" }) };
+    case "stale":
+      return { label: labels.stale, tone: "neutral", icon: /* @__PURE__ */ jsx(ClockGlyph, { size: "xs" }) };
+    case "failed":
+      return { label: labels.notApplied, tone: "danger", icon: /* @__PURE__ */ jsx(CircleAlertGlyph, { size: "xs" }) };
+  }
+}
+function headingOf(state, kind, labels) {
+  if (state === "applied") return kind === "create" ? labels.whatWasCreated : labels.whatChanged;
+  if (SETTLED.has(state)) return labels.whatWasProposed;
+  return kind === "create" ? labels.whatWillBeCreated : labels.whatWillChange;
+}
+function ProposalCard({
+  title,
+  subtitle,
+  state,
+  scope = "server",
+  kind = "change",
+  summary,
+  changes,
+  changesHeading,
+  note,
+  approveLabel,
+  onApprove,
+  onDecline,
+  onPrepareAgain,
+  onRetry,
+  receipt,
+  failure,
+  failureHint,
+  approveBlocked,
+  notice,
+  labels: overrides,
+  changeLabels,
+  diffLabels,
+  className,
+  ...rest
+}) {
+  const labels = overrides ? { ...PROPOSAL_CARD_LABELS, ...overrides } : PROPOSAL_CARD_LABELS;
+  const settled = SETTLED.has(state);
+  const blocked = (state === "pending" || state === "stepup") && approveBlocked ? approveBlocked : void 0;
+  const decision = state === "pending" || state === "stepup" || state === "applying" ? /* @__PURE__ */ jsxs(Fragment, { children: [
+    blocked === void 0 ? null : /* @__PURE__ */ jsx("p", { className: "crewlet-proposal-card__blocked", "aria-hidden": "true", children: blocked }),
+    /* @__PURE__ */ jsx(
+      Button,
+      {
+        variant: "secondary",
+        onClick: onDecline,
+        disabledReason: state === "applying" ? labels.busy : void 0,
+        children: labels.decline
+      }
+    ),
+    /* @__PURE__ */ jsx(Button, { variant: "primary", loading: state === "applying", disabledReason: blocked, onClick: onApprove, children: state === "stepup" ? labels.confirmIdentity : approveLabel })
+  ] }) : void 0;
+  const again = (state === "expired" || state === "stale") && onPrepareAgain ? /* @__PURE__ */ jsx(Button, { variant: "secondary", size: "small", leadingIcon: /* @__PURE__ */ jsx(RefreshCwGlyph, {}), onClick: onPrepareAgain, children: labels.prepareAgain }) : void 0;
+  const strip = state === "stepup" ? /* @__PURE__ */ jsx(ReceiptStrip, { tone: "neutral", icon: /* @__PURE__ */ jsx(LockGlyph, { size: "md" }), children: notice ?? labels.stepUpNotice }) : state === "applied" && receipt !== void 0 ? /* @__PURE__ */ jsx(ReceiptStrip, { tone: "success", children: receipt }) : state === "declined" ? /* @__PURE__ */ jsx(ReceiptStrip, { tone: "neutral", icon: /* @__PURE__ */ jsx(BanGlyph, { size: "md" }), children: notice ?? labels.declinedNotice }) : state === "expired" ? /* @__PURE__ */ jsx(ReceiptStrip, { tone: "neutral", icon: /* @__PURE__ */ jsx(ClockGlyph, { size: "md" }), children: notice ?? labels.expiredNotice }) : state === "stale" ? /* @__PURE__ */ jsx(ReceiptStrip, { tone: "neutral", icon: /* @__PURE__ */ jsx(ClockGlyph, { size: "md" }), children: notice ?? labels.staleNotice }) : state === "failed" ? /* @__PURE__ */ jsx(
+    RefusalStrip,
+    {
+      placement: "foot",
+      hint: failure === void 0 ? void 0 : failureHint,
+      onRetry,
+      labels: { retry: labels.tryAgain },
+      children: failure === void 0 ? labels.nothingChanged : /* @__PURE__ */ jsxs(Fragment, { children: [
+        failure,
+        " ",
+        labels.nothingChanged
+      ] })
+    }
+  ) : void 0;
+  return /* @__PURE__ */ jsxs(
+    StatusCard,
+    {
+      ...rest,
+      title,
+      subtitle,
+      status: statusOf(state, scope, labels),
+      settled,
+      strip,
+      actions: decision ?? again,
+      actionsAlign: decision ? "end" : "start",
+      className: cx("crewlet-proposal-card", `crewlet-proposal-card--${state}`, className),
+      "data-state": state,
+      children: [
+        summary === void 0 || summary === null ? null : /* @__PURE__ */ jsx("p", { className: "crewlet-proposal-card__summary", children: summary }),
+        /* @__PURE__ */ jsx(
+          ChangeList,
+          {
+            rows: changes,
+            heading: changesHeading ?? headingOf(state, kind, labels),
+            settled,
+            labels: changeLabels,
+            diffLabels
+          }
+        ),
+        note === void 0 || note === null ? null : /* @__PURE__ */ jsx("p", { className: "crewlet-proposal-card__note", children: note })
+      ]
+    }
+  );
+}
+
+export { PROPOSAL_CARD_LABELS, PROPOSAL_STATES, ProposalCard };

package/dist/chunk-EA23JG6R.js

@@ -0,0 +1,9 @@
+import { cx } from './chunk-ODEQTPFM.js';
+import './Spinner-XZ2TVYE5.css';
+import { jsx } from 'react/jsx-runtime';
+
+function Spinner({ size = "em", className, ...rest }) {
+  return /* @__PURE__ */ jsx("span", { ...rest, "aria-hidden": "true", className: cx("crewlet-spinner", `crewlet-spinner--${size}`, className) });
+}
+
+export { Spinner };

package/dist/{chunk-J53T2QAH.js → chunk-EBG3V4MK.js}

@@ -1,13 +1,13 @@
 import { Select } from './chunk-XQZ6EWOE.js';
 import { SHEET_LABELS, SHEET_COLUMN_TYPES, optionHue, retypeColumn } from './chunk-LFSIKGRQ.js';
-import { HueSwatch } from './chunk-34RMTXDZ.js';
+import { HueSwatch } from './chunk-OYAXKHVW.js';
 import { NODE_HUES, NODE_HUE_NAMES } from './chunk-AYKXMIOR.js';
-import { Checkbox } from './chunk-RQI43UJ7.js';
+import { Checkbox } from './chunk-NHJQXDHA.js';
 import { Kbd } from './chunk-SMBKXWML.js';
-import { FormField, Input } from './chunk-LJHH4WWB.js';
-import { Menu } from './chunk-TMM32U7D.js';
-import { Button } from './chunk-OG6CL3EB.js';
-import { IconButton } from './chunk-LACA4JGC.js';
+import { FormField, Input } from './chunk-FXQLNETQ.js';
+import { Menu } from './chunk-TKS7FTTO.js';
+import { Button } from './chunk-HD4QJ2SI.js';
+import { IconButton } from './chunk-2BQYODY3.js';
 import { VisuallyHidden } from './chunk-BZFWDIV6.js';
 import { cx } from './chunk-ODEQTPFM.js';
 import './SheetColumnEditor-BO2HKFRB.css';

package/dist/{chunk-7PE56HHD.js → chunk-EDNZHW4K.js}

@@ -1,11 +1,11 @@
-import { Checkbox } from './chunk-RQI43UJ7.js';
+import { Checkbox } from './chunk-NHJQXDHA.js';
 import { EmptyState } from './chunk-PPUR46MK.js';
 import { useMediaMatch } from './chunk-RTPQDNW3.js';
-import { Button } from './chunk-OG6CL3EB.js';
+import { Button } from './chunk-HD4QJ2SI.js';
 import { VisuallyHidden } from './chunk-BZFWDIV6.js';
 import { cx } from './chunk-ODEQTPFM.js';
 import './DataGrid-VNGQESJA.css';
-import { useId, useRef, useState, useMemo, useCallback, useLayoutEffect, useImperativeHandle } from 'react';
+import { useId, useRef, useState, useMemo, useCallback, useLayoutEffect, useImperativeHandle, useSyncExternalStore, useEffect } from 'react';
 import { breakpoint } from '@crewlethq/tokens';
 import { ChevronDownGlyph, ChevronUpGlyph } from '@crewlethq/icons/glyphs';
 import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
@@ -279,9 +279,9 @@ function DataGrid({
   const [boxWidth, setBoxWidth] = useState(0);
   useLayoutEffect(() => {
     if (!wrap || typeof ResizeObserver !== "function") return;
-    const watch = new ResizeObserver(() => setBoxWidth(wrap.clientWidth));
-    watch.observe(wrap);
-    return () => watch.disconnect();
+    const watch2 = new ResizeObserver(() => setBoxWidth(wrap.clientWidth));
+    watch2.observe(wrap);
+    return () => watch2.disconnect();
   }, [wrap]);
   useLayoutEffect(() => {
     const el = wrap;
@@ -482,5 +482,55 @@ function DataGrid({
     }
   );
 }
+var drivable = [];
+var touched = null;
+var revision = 0;
+var watchers = /* @__PURE__ */ new Set();
+function announce() {
+  revision += 1;
+  for (const watcher of watchers) watcher();
+}
+function watch(watcher) {
+  watchers.add(watcher);
+  return () => {
+    watchers.delete(watcher);
+  };
+}
+function current() {
+  return revision;
+}
+function isDriving(id) {
+  if (touched !== null) return touched === id;
+  return drivable[0] === id;
+}
+function countDataGridRows(rows, bands) {
+  const inBand = (band) => band.bands ? band.bands.reduce((n, sub) => n + inBand(sub), 0) : band.rows.length;
+  return bands ? bands.reduce((n, band) => n + inBand(band), 0) : rows?.length ?? 0;
+}
+function useDataGridDriving(drivableNow) {
+  const id = useId();
+  useSyncExternalStore(watch, current, current);
+  useEffect(() => {
+    if (!drivableNow) return void 0;
+    drivable.push(id);
+    announce();
+    return () => {
+      const at = drivable.indexOf(id);
+      if (at >= 0) drivable.splice(at, 1);
+      if (touched === id) touched = null;
+      announce();
+    };
+  }, [id, drivableNow]);
+  const claim = useCallback(() => {
+    if (touched === id) return;
+    touched = id;
+    announce();
+  }, [id]);
+  return { driving: drivableNow && isDriving(id), claim };
+}
+function useAnyDataGridDriving() {
+  useSyncExternalStore(watch, current, current);
+  return drivable.length > 0;
+}
 
-export { ChooserList, ColumnChooser, DataGrid, columnChoicesOf, fitGridColumns, parseGridSort };
+export { ChooserList, ColumnChooser, DataGrid, columnChoicesOf, countDataGridRows, fitGridColumns, parseGridSort, useAnyDataGridDriving, useDataGridDriving };

package/dist/{chunk-E6HXFFWO.js → chunk-EGL24VY5.js}

@@ -1,7 +1,7 @@
-import { SlideNav } from './chunk-RRO7UEYU.js';
+import { SlideNav } from './chunk-OHBXOEP3.js';
 import { SlideStage, SLIDE_WIDTH, SLIDE_HEIGHT } from './chunk-RMEBFYL7.js';
 import { Eyebrow } from './chunk-RK4XPHVG.js';
-import { Button } from './chunk-OG6CL3EB.js';
+import { Button } from './chunk-HD4QJ2SI.js';
 import { cx } from './chunk-ODEQTPFM.js';
 import './PresenterView-T3EXIQ5S.css';
 import { useRef, useState, useEffect } from 'react';

package/dist/{chunk-7SHAFLEX.js → chunk-ES4HR34Y.js}

@@ -1,6 +1,6 @@
 import { useClipboard } from './chunk-STJ7QBC3.js';
-import { Button } from './chunk-OG6CL3EB.js';
-import { IconButton } from './chunk-LACA4JGC.js';
+import { Button } from './chunk-HD4QJ2SI.js';
+import { IconButton } from './chunk-2BQYODY3.js';
 import { VisuallyHidden } from './chunk-BZFWDIV6.js';
 import { cx } from './chunk-ODEQTPFM.js';
 import './Copyable-5PNRFOLS.css';

package/dist/chunk-EVWTLFKI.js

@@ -0,0 +1,102 @@
+import { StepStateMark } from './chunk-CGT4R7LW.js';
+import { DisclosureAnatomy } from './chunk-TFGCNBWP.js';
+import { VisuallyHidden } from './chunk-BZFWDIV6.js';
+import { cx } from './chunk-ODEQTPFM.js';
+import './RunChip-I2S4VZ3R.css';
+import { useState, useRef, useEffect, useId } from 'react';
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+
+var RUN_STATES = [
+  "thinking",
+  "working",
+  "done",
+  "waiting",
+  "applying",
+  "stopped",
+  "failed",
+  "refused"
+];
+var ACTIVE = /* @__PURE__ */ new Set(["thinking", "working", "applying"]);
+var MARK = {
+  thinking: "running",
+  working: "running",
+  applying: "running",
+  done: "done",
+  waiting: "waiting",
+  stopped: "stopped",
+  failed: "failed",
+  refused: "refused"
+};
+function RunChip({
+  state,
+  title,
+  meta,
+  children,
+  expandable: expandableProp,
+  open: controlledOpen,
+  defaultOpen,
+  onOpenChange,
+  className,
+  ...rest
+}) {
+  const expandable = expandableProp ?? (children !== void 0 && children !== null && children !== false);
+  const controlled = controlledOpen !== void 0;
+  const [uncontrolled, setUncontrolled] = useState(defaultOpen ?? ACTIVE.has(state));
+  const active = ACTIVE.has(state);
+  const wasActive = useRef(active);
+  useEffect(() => {
+    if (controlled || wasActive.current === active) return;
+    wasActive.current = active;
+    setUncontrolled(active);
+  }, [active, controlled]);
+  const open = expandable && (controlled ? controlledOpen : uncontrolled);
+  const rid = useId();
+  const toggle = () => {
+    if (!controlled) setUncontrolled(!open);
+    onOpenChange?.(!open);
+  };
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      ...rest,
+      className: cx("crewlet-run-chip", `crewlet-run-chip--${state}`, className),
+      "data-state": open ? "open" : "closed",
+      children: [
+        /* @__PURE__ */ jsx(
+          DisclosureAnatomy,
+          {
+            open,
+            onToggle: toggle,
+            expandable,
+            icon: /* @__PURE__ */ jsx(StepStateMark, { state: MARK[state] }),
+            title: /* @__PURE__ */ jsxs(Fragment, { children: [
+              title,
+              meta === void 0 ? null : /* @__PURE__ */ jsx(VisuallyHidden, { children: "," })
+            ] }),
+            meta: meta === void 0 ? void 0 : /* @__PURE__ */ jsxs(Fragment, { children: [
+              /* @__PURE__ */ jsx("span", { className: "crewlet-run-chip__separator", "aria-hidden": "true", children: "\xB7 " }),
+              meta
+            ] }),
+            headingLevel: "none",
+            triggerId: `${rid}-trigger`,
+            panelId: `${rid}-panel`,
+            triggerClassName: "crewlet-run-chip__trigger"
+          }
+        ),
+        expandable ? /* @__PURE__ */ jsx(
+          "div",
+          {
+            id: `${rid}-panel`,
+            role: "region",
+            "aria-labelledby": `${rid}-trigger`,
+            className: "crewlet-run-chip__panel",
+            hidden: !open,
+            children
+          }
+        ) : null
+      ]
+    }
+  );
+}
+
+export { RUN_STATES, RunChip };

package/dist/chunk-FA44M2YT.js

@@ -0,0 +1,25 @@
+import { StatusCard } from './chunk-WDIVALLP.js';
+import { cx } from './chunk-ODEQTPFM.js';
+import './EntityList-XIICECVC.css';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+function EntityList({ items, label, title, className, ...rest }) {
+  const list = (
+    // The role is restated for WebKit, which drops it from a list with no markers.
+    // eslint-disable-next-line jsx-a11y/no-redundant-roles
+    /* @__PURE__ */ jsx("ul", { role: "list", "aria-label": title === void 0 ? label : void 0, className: "crewlet-entity-list__rows", children: items.map((item) => /* @__PURE__ */ jsxs("li", { className: "crewlet-entity-list__row", children: [
+      item.avatar === void 0 ? null : /* @__PURE__ */ jsx("span", { className: "crewlet-entity-list__avatar", "aria-hidden": "true", children: item.avatar }),
+      /* @__PURE__ */ jsxs("span", { className: "crewlet-entity-list__words", children: [
+        /* @__PURE__ */ jsx("span", { className: "crewlet-entity-list__name", children: item.name }),
+        item.fact === void 0 || item.fact === null ? null : /* @__PURE__ */ jsx("span", { className: "crewlet-entity-list__fact", children: item.fact })
+      ] }),
+      item.action === void 0 || item.action === null ? null : /* @__PURE__ */ jsx("span", { className: "crewlet-entity-list__action", children: item.action })
+    ] }, item.id)) })
+  );
+  if (title === void 0) {
+    return /* @__PURE__ */ jsx("div", { ...rest, className: cx("crewlet-entity-list", className), children: list });
+  }
+  return /* @__PURE__ */ jsx(StatusCard, { ...rest, title, bodyPadding: "none", className: cx("crewlet-entity-list", "crewlet-entity-list--card", className), children: list });
+}
+
+export { EntityList };

package/dist/{chunk-VWYT3GVV.js → chunk-FLTMDSC3.js}

@@ -1,5 +1,5 @@
 import { announce } from './chunk-RSAQOKH3.js';
-import { IconButton } from './chunk-LACA4JGC.js';
+import { IconButton } from './chunk-2BQYODY3.js';
 import { cx } from './chunk-ODEQTPFM.js';
 import './ArrangeFrame-QXOQTFAH.css';
 import { forwardRef, useRef, useCallback, useState, useEffect } from 'react';

package/dist/{chunk-LJHH4WWB.js → chunk-FXQLNETQ.js}

@@ -2,7 +2,7 @@ import { characterCountState, CharacterCount } from './chunk-XCUUI7E7.js';
 import { useHeadingLevel, headingTag, HeadingLevelProvider, nextHeadingLevel } from './chunk-PQADV6P6.js';
 import { announce } from './chunk-RSAQOKH3.js';
 import { isComposing } from './chunk-H5XTJ7GJ.js';
-import { IconButton } from './chunk-LACA4JGC.js';
+import { IconButton } from './chunk-2BQYODY3.js';
 import { useFocusModality } from './chunk-NUZHC6MM.js';
 import { VisuallyHidden } from './chunk-BZFWDIV6.js';
 import { cx } from './chunk-ODEQTPFM.js';

package/dist/{chunk-3NXWH5NC.js → chunk-GCASX3FD.js}

@@ -1,9 +1,9 @@
 import { Timeline } from './chunk-AUQPBL4O.js';
 import { Section } from './chunk-JQ7IFSF6.js';
-import { Disclosure } from './chunk-OGXHZHRX.js';
-import { Composer } from './chunk-UJ4VVK7R.js';
-import { ArtifactPanel } from './chunk-NBDN5JZV.js';
-import { Button } from './chunk-OG6CL3EB.js';
+import { Composer } from './chunk-JLRXCKTS.js';
+import { Disclosure } from './chunk-GG4QZWMQ.js';
+import { ArtifactPanel } from './chunk-HGYHWWA5.js';
+import { Button } from './chunk-HD4QJ2SI.js';
 import { cx } from './chunk-ODEQTPFM.js';
 import './AgentHandoffPanel-JWSW62GU.css';
 import { useId, useRef, useEffect } from 'react';

package/dist/{chunk-OGXHZHRX.js → chunk-GG4QZWMQ.js}

@@ -1,7 +1,7 @@
-import { DisclosureAnatomy } from './chunk-FZVJDJFN.js';
+import { DisclosureAnatomy } from './chunk-TFGCNBWP.js';
 import { useHeadingLevel } from './chunk-PQADV6P6.js';
 import { cx } from './chunk-ODEQTPFM.js';
-import './Disclosure-P4FH3C35.css';
+import './Disclosure-FVMA4RW2.css';
 import { useState, useId, useCallback } from 'react';
 import { jsxs, jsx } from 'react/jsx-runtime';
 

package/dist/{chunk-XP7EXNKF.js → chunk-GPW4M4OI.js}

@@ -1,8 +1,8 @@
-import { TreeGrid } from './chunk-ON2E46DX.js';
+import { TreeGrid } from './chunk-VRNUKH2W.js';
 import { createTreeModel, treeParent } from './chunk-MY374UUD.js';
 import { OrgLabel } from './chunk-ONQKKHON.js';
 import { AddPill } from './chunk-TROLVEZY.js';
-import { IconButton } from './chunk-LACA4JGC.js';
+import { IconButton } from './chunk-2BQYODY3.js';
 import { cx } from './chunk-ODEQTPFM.js';
 import './OrgTable-JZSYTUIK.css';
 import { useMemo, useRef, useImperativeHandle, useCallback } from 'react';