@crewlethq/ui 0.82.0 → 0.84.0

package/dist/SheetColumnEditor/index.js

@@ -1,17 +1,18 @@
-export { SHEET_COLUMN_EDITOR_LABELS, SheetColumnEditor, SheetColumnTypeGlyph } from '../chunk-IUWP2LSE.js';
+export { SHEET_COLUMN_EDITOR_LABELS, SheetColumnEditor, SheetColumnTypeGlyph } from '../chunk-SGMWLUYQ.js';
 import '../chunk-3IWZVEXA.js';
 import '../chunk-FFMCMSJB.js';
 import '../chunk-YGRTX67J.js';
 import '../chunk-LFSIKGRQ.js';
 import '../chunk-Z7JYG5TF.js';
-import '../chunk-LSOR77RZ.js';
+import '../chunk-SHH7UD5U.js';
 import '../chunk-AYKXMIOR.js';
 import '../chunk-YQ7Q52XU.js';
-import '../chunk-GZVAZ3LL.js';
-import '../chunk-HCUECVZ3.js';
+import '../chunk-AZYE7NR4.js';
+import '../chunk-MVKUE4FI.js';
 import '../chunk-EGMQURBR.js';
 import '../chunk-CYQBDZ6M.js';
-import '../chunk-YOJAGKTS.js';
+import '../chunk-TGGYSQRD.js';
+import '../chunk-L72URIHR.js';
 import '../chunk-O7N6W52M.js';
 import '../chunk-PGCLHYVP.js';
 import '../chunk-CMAZZY2I.js';

package/dist/SheetGrid/index.js

@@ -1,19 +1,21 @@
-export { CellDisplay, CellEditor, CheckboxCell, DateCell, LongTextCell, MultiSelectCell, NumberCell, PersonCell, RatingCell, SelectCell, SheetCell, SheetGrid, StatusCell, TextCell, UrlCell } from '../chunk-HQFOZJQ4.js';
+export { CellDisplay, CellEditor, CheckboxCell, DateCell, LongTextCell, MultiSelectCell, NumberCell, PersonCell, RatingCell, SelectCell, SheetCell, SheetGrid, StatusCell, TextCell, UrlCell } from '../chunk-46FIBJCV.js';
 import '../chunk-UEOEBOBR.js';
 import '../chunk-CENOOTAV.js';
 import '../chunk-MMCYH5LB.js';
 import '../chunk-EFX2YC5T.js';
-import '../chunk-ONNXUS5Y.js';
+import '../chunk-VB3FVKNI.js';
 import '../chunk-LFSIKGRQ.js';
 import '../chunk-Z7JYG5TF.js';
-import '../chunk-SM4P2SHB.js';
-import '../chunk-AYKXMIOR.js';
 import '../chunk-LBGKLYBY.js';
+import '../chunk-EC6EUIAD.js';
+import '../chunk-AYKXMIOR.js';
 import '../chunk-IRONPJB4.js';
 import '../chunk-XZY6S3UC.js';
 import '../chunk-CYQBDZ6M.js';
-import '../chunk-3QQIGMY3.js';
-import '../chunk-YOJAGKTS.js';
+import '../chunk-7ZSEUO5Q.js';
+import '../chunk-HTS5RJ7S.js';
+import '../chunk-TGGYSQRD.js';
+import '../chunk-L72URIHR.js';
 import '../chunk-DGXZ635L.js';
 import '../chunk-XSPCITPN.js';
 import '../chunk-OMV5W53A.js';

package/dist/SidebarNav/SidebarNav.d.ts

@@ -36,6 +36,7 @@
  * own prop types, so one list of places feeds both shapes.
  */
 import { type MouseEventHandler, type ReactNode } from 'react';
+import type { CountTone } from '../Count/index.js';
 export interface SidebarNavProps {
     /**
      * Names the navigation region. A page with two of them ("Sections" and
@@ -148,6 +149,20 @@ export interface NavFigure {
      */
     label: string;
 }
+/**
+ * A figure of what waits on the reader, and how loudly it asks.
+ *
+ * `attention` (the default) is the accent's filled pill, the one hue in the
+ * chrome: what the reader is asked to act on, the unread in an inbox.
+ * `quiet` keeps the pill's round shape and its place at the row's end, in
+ * the quiet count's grey: work that is the reader's own and is waiting, but
+ * not calling (the open tasks assigned to them). The vocabulary is `Count`'s
+ * own (`CountTone`), so a figure is quiet or calling in the same words
+ * wherever it stands.
+ */
+export interface NavBadge extends NavFigure {
+    tone?: CountTone | undefined;
+}
 /** A quiet figure: how many of something the destination holds. */
 export interface NavCount extends NavFigure {
     /**
@@ -180,9 +195,10 @@ export interface NavItemProps {
      * of what is waiting on the reader is the one thing in the rail that asks
      * them to act, which is what the accent means; it is a FILL carrying a
      * figure rather than a figure in a hue, so it still reads to somebody who
-     * cannot separate the hue. Anything else is a `count`.
+     * cannot separate the hue. Anything else is a `count`. `tone: 'quiet'`
+     * keeps the pill and draws it in the quiet count's grey (`NavBadge`).
      */
-    badge?: NavFigure | undefined;
+    badge?: NavBadge | undefined;
     href?: string | undefined;
     /** Whether this row is the screen the reader is on. */
     current?: boolean | undefined;

package/dist/SidebarNav/index.d.ts

@@ -1,4 +1,4 @@
 import '../HitArea/HitArea.css';
 import './SidebarNav.css';
 export { NavGroup, NavItem, SidebarNav } from './SidebarNav.js';
-export type { NavCount, NavFigure, NavGroupAction, NavGroupProps, NavItemProps, NavLinkProps, SidebarNavProps, } from './SidebarNav.js';
+export type { NavBadge, NavCount, NavFigure, NavGroupAction, NavGroupProps, NavItemProps, NavLinkProps, SidebarNavProps, } from './SidebarNav.js';

package/dist/SidebarNav/index.js

@@ -1,4 +1,4 @@
-export { NavGroup, NavItem, SidebarNav } from '../chunk-25JQNHTC.js';
+export { NavGroup, NavItem, SidebarNav } from '../chunk-BRK3HXGZ.js';
 import '../chunk-TEV5REGB.js';
 import '../chunk-HBDA76EZ.js';
 import '../chunk-2YTOOH3A.js';

package/dist/{SidebarNav-E7PZGGA6.css → SidebarNav-IKBKGXW4.css}

@@ -415,6 +415,26 @@
   line-height: 1;
 }
 
+/*
+ * A QUIET BADGE keeps the pill, its size and its place at the row's end, and
+ * takes the quiet count's grey: a neutral wash (`--color-fill-soft`, the
+ * ground of a quiet label at rest) carrying the secondary ink, for work that
+ * is the reader's own and waiting, but not calling. The secondary ink rather
+ * than the count's tertiary, because on a wash over a hovered row the
+ * tertiary measured 4.41:1 in light; it is the ink the compact rail's quiet
+ * figure takes, so the two shapes draw the same grey. On the reader's own row
+ * its ink lifts to the row's, as the count's does; the suite measures the
+ * pair on every ground a row can have.
+ */
+.crewlet-nav-item__badge--quiet {
+  background: var(--color-fill-soft);
+  color: var(--color-text-secondary);
+}
+
+.crewlet-nav-item__row[aria-current='page'] .crewlet-nav-item__badge--quiet {
+  color: inherit;
+}
+
 /* Beside a count the badge is the second figure, not a second push to the
    end: two auto margins would split the room between them and float the
    count into the middle of the row. */

package/dist/SlideFilmstrip/index.js

@@ -1,7 +1,9 @@
-export { SlideFilmstrip } from '../chunk-T7WESRZF.js';
+export { SlideFilmstrip } from '../chunk-RO5JU6SN.js';
 import '../chunk-O6EV6GKI.js';
-import '../chunk-MPVMB2DV.js';
-import '../chunk-YOJAGKTS.js';
+import '../chunk-BVML4UVB.js';
+import '../chunk-YJQXESOJ.js';
+import '../chunk-TGGYSQRD.js';
+import '../chunk-L72URIHR.js';
 import '../chunk-CMAZZY2I.js';
 import '../chunk-DGXZ635L.js';
 import '../chunk-XSPCITPN.js';

package/dist/Switcher/index.js

@@ -1,10 +1,11 @@
-export { Switcher } from '../chunk-FKAJBN6G.js';
-import '../chunk-XXDB6KPV.js';
+export { Switcher } from '../chunk-7M7WKYOV.js';
+import '../chunk-ZXXZESCD.js';
 import '../chunk-YGRTX67J.js';
 import '../chunk-HBDA76EZ.js';
-import '../chunk-SM4P2SHB.js';
+import '../chunk-EC6EUIAD.js';
 import '../chunk-I4IUX3JF.js';
-import '../chunk-RTPQDNW3.js';
+import '../chunk-YJQXESOJ.js';
+import '../chunk-L72URIHR.js';
 import '../chunk-O7N6W52M.js';
 import '../chunk-PGCLHYVP.js';
 import '../chunk-DGXZ635L.js';

package/dist/Tabs/index.js

@@ -1,7 +1,8 @@
-export { TabPanel, Tabs, tabId } from '../chunk-HCUECVZ3.js';
+export { TabPanel, Tabs, tabId } from '../chunk-MVKUE4FI.js';
 import '../chunk-EGMQURBR.js';
 import '../chunk-CYQBDZ6M.js';
-import '../chunk-YOJAGKTS.js';
+import '../chunk-TGGYSQRD.js';
+import '../chunk-L72URIHR.js';
 import '../chunk-DGXZ635L.js';
 import '../chunk-XSPCITPN.js';
 import '../chunk-OMV5W53A.js';

package/dist/ThemeSwitcher/index.js

@@ -1,12 +1,13 @@
-export { DensitySwitcher, ThemeSwitcher } from '../chunk-C7UHDM7Y.js';
+export { DensitySwitcher, ThemeSwitcher } from '../chunk-5V6GW6HK.js';
 export { applyStoredPreferences, resolveTheme, useDensityPreference, useSystemTheme, useThemePreference } from '../chunk-Z24ZUSTX.js';
 export { DENSITY_PREFERENCES, PALETTE_ID, THEME_PREFERENCES, applyDensity, applyPalette, applyTheme, isDensityPreference, isPaletteId, isThemePreference } from '../chunk-ZXXDZJQN.js';
 import '../chunk-36WK24AI.js';
-import '../chunk-GZVAZ3LL.js';
-import '../chunk-HCUECVZ3.js';
+import '../chunk-AZYE7NR4.js';
+import '../chunk-MVKUE4FI.js';
 import '../chunk-EGMQURBR.js';
 import '../chunk-CYQBDZ6M.js';
-import '../chunk-YOJAGKTS.js';
+import '../chunk-TGGYSQRD.js';
+import '../chunk-L72URIHR.js';
 import '../chunk-DGXZ635L.js';
 import '../chunk-XSPCITPN.js';
 import '../chunk-OMV5W53A.js';

package/dist/TimeRangePicker/index.js

@@ -1,12 +1,13 @@
-export { TIME_RANGE_CUSTOM, TIME_RANGE_PICKER_LABELS, TimeRangePicker, timeRangeFieldKey, timeRangeProblem } from '../chunk-G6ZFSUIH.js';
-import '../chunk-XXDB6KPV.js';
+export { TIME_RANGE_CUSTOM, TIME_RANGE_PICKER_LABELS, TimeRangePicker, timeRangeFieldKey, timeRangeProblem } from '../chunk-ZJVLGYE3.js';
+import '../chunk-ZXXZESCD.js';
 import '../chunk-BPCY7ZID.js';
 import '../chunk-36WK24AI.js';
-import '../chunk-GZVAZ3LL.js';
-import '../chunk-HCUECVZ3.js';
+import '../chunk-AZYE7NR4.js';
+import '../chunk-MVKUE4FI.js';
 import '../chunk-EGMQURBR.js';
 import '../chunk-CYQBDZ6M.js';
-import '../chunk-YOJAGKTS.js';
+import '../chunk-TGGYSQRD.js';
+import '../chunk-L72URIHR.js';
 import '../chunk-O7N6W52M.js';
 import '../chunk-PGCLHYVP.js';
 import '../chunk-DGXZ635L.js';

package/dist/TimeWindowPicker/index.js

@@ -1,8 +1,9 @@
-export { DEFAULT_TIME_WINDOW_LABELS, TIME_WINDOW_SPANS, TimeWindowPicker, describeTimeWindow, isTimeWindowSet, parseTimeWindowDuration, resolveTimeWindow, timeWindowMatchesPreset } from '../chunk-YM77TZ7Q.js';
+export { DEFAULT_TIME_WINDOW_LABELS, TIME_WINDOW_SPANS, TimeWindowPicker, describeTimeWindow, isTimeWindowSet, parseTimeWindowDuration, resolveTimeWindow, timeWindowMatchesPreset } from '../chunk-T3S3D4FC.js';
 import '../chunk-3IWZVEXA.js';
 import '../chunk-YGRTX67J.js';
 import '../chunk-EE3DJMSQ.js';
-import '../chunk-SM4P2SHB.js';
+import '../chunk-EC6EUIAD.js';
+import '../chunk-L72URIHR.js';
 import '../chunk-O7N6W52M.js';
 import '../chunk-PGCLHYVP.js';
 import '../chunk-DGXZ635L.js';

package/dist/Tooltip/index.js

@@ -1,4 +1,6 @@
-export { Tooltip } from '../chunk-3QQIGMY3.js';
+export { Tooltip } from '../chunk-7ZSEUO5Q.js';
+import '../chunk-HTS5RJ7S.js';
+import '../chunk-L72URIHR.js';
 import '../chunk-OMV5W53A.js';
 import '../chunk-TUEM2XIW.js';
 import '../chunk-4ITETIGZ.js';

package/dist/TreeCanvas/index.js

@@ -1,8 +1,11 @@
-export { TreeCanvas } from '../chunk-AMUXSJ2A.js';
+export { TreeCanvas } from '../chunk-FPU7AA3X.js';
 import '../chunk-MY374UUD.js';
-import '../chunk-SEKO6P3Y.js';
+import '../chunk-NCUSI4ZU.js';
 import '../chunk-LM3ISVJA.js';
-import '../chunk-3QQIGMY3.js';
+import '../chunk-YJQXESOJ.js';
+import '../chunk-7ZSEUO5Q.js';
+import '../chunk-HTS5RJ7S.js';
+import '../chunk-L72URIHR.js';
 import '../chunk-CMAZZY2I.js';
 import '../chunk-DGXZ635L.js';
 import '../chunk-XSPCITPN.js';

package/dist/VersionCompare/index.js

@@ -1,11 +1,12 @@
-export { VERSION_COMPARE_LABELS, VERSION_COMPARE_LENSES, VersionCompare } from '../chunk-TGCGLKD4.js';
+export { VERSION_COMPARE_LABELS, VERSION_COMPARE_LENSES, VersionCompare } from '../chunk-RBQRTGXX.js';
 import '../chunk-AOFVXE6V.js';
 import '../chunk-36WK24AI.js';
-import '../chunk-GZVAZ3LL.js';
-import '../chunk-HCUECVZ3.js';
+import '../chunk-AZYE7NR4.js';
+import '../chunk-MVKUE4FI.js';
 import '../chunk-EGMQURBR.js';
 import '../chunk-CYQBDZ6M.js';
-import '../chunk-YOJAGKTS.js';
+import '../chunk-TGGYSQRD.js';
+import '../chunk-L72URIHR.js';
 import '../chunk-PPUR46MK.js';
 import '../chunk-DGXZ635L.js';
 import '../chunk-XSPCITPN.js';

package/dist/{chunk-KJR5X4II.js → chunk-22CU7V4J.js}

@@ -1,5 +1,5 @@
-import { HuePicker } from './chunk-LSOR77RZ.js';
-import { Popover } from './chunk-SM4P2SHB.js';
+import { HuePicker } from './chunk-SHH7UD5U.js';
+import { Popover } from './chunk-EC6EUIAD.js';
 import { NODE_HUE_NAMES } from './chunk-AYKXMIOR.js';
 import { CharacterPicker } from './chunk-LNQSNXGJ.js';
 import { Avatar } from './chunk-XZY6S3UC.js';

package/dist/{chunk-4RYELYWG.js → chunk-2SVQBQAD.js}

@@ -1,6 +1,6 @@
 import { Note } from './chunk-5SZGKSGL.js';
-import { CanvasToolbar, toolForKey } from './chunk-HA2PL7PA.js';
-import { IDENTITY_VIEW, Canvas } from './chunk-SEKO6P3Y.js';
+import { CanvasToolbar, toolForKey } from './chunk-DRFOTWJE.js';
+import { IDENTITY_VIEW, Canvas } from './chunk-NCUSI4ZU.js';
 import { IconButton } from './chunk-UAUP6XGK.js';
 import { cx } from './chunk-ODEQTPFM.js';
 import './CanvasBoard-U6LR5F6H.css';

package/dist/{chunk-N2T7Y5KR.js → chunk-3AMWXJQX.js}

@@ -9,7 +9,7 @@ import { jsx } from 'react/jsx-runtime';
 var engine = null;
 var loading = null;
 function loadEngine() {
-  loading ??= import('./Editor-7EQWP3RN.js').then(
+  loading ??= import('./Editor-VGNB35NJ.js').then(
     (module) => {
       engine = module.Editor;
       return engine;

package/dist/{chunk-HQFOZJQ4.js → chunk-46FIBJCV.js}

@@ -1,15 +1,15 @@
 import { TagGroup } from './chunk-UEOEBOBR.js';
 import { CursorFlag } from './chunk-MMCYH5LB.js';
 import { presenceHueClass } from './chunk-EFX2YC5T.js';
-import { ChangeMark } from './chunk-ONNXUS5Y.js';
+import { ChangeMark } from './chunk-VB3FVKNI.js';
 import { isEmptyValue, displayText, ratingMax, findPerson, findOption, statusTone, editText, textMax, sheetLabels, normalizeValue, sameValue, spokenText, drawnColumns, fitSamples, fittedWidth, columnWidth, SHEET_COLUMN_BOUNDS, sortRows, SHEET_ROW_HEIGHT, cellKey, columnOffsets, SHEET_ROW_NUMBER_WIDTH, rangeOf, presenceByCell, presenceByRow, presenceByColumn, scrollToRow, planClear, visibleRows, cellDescription, nextSort, rowName, inRange, hasPrevious, flagText, toTSV, planPaste, parseTSV, isMod, moveFrom, isTypingKey, editorSide, optionHue, parseText, liveOptions, checkValue } from './chunk-LFSIKGRQ.js';
 import { presenceLabels } from './chunk-Z7JYG5TF.js';
-import { Popover } from './chunk-SM4P2SHB.js';
 import { Tag } from './chunk-LBGKLYBY.js';
+import { Popover } from './chunk-EC6EUIAD.js';
 import { Avatar } from './chunk-XZY6S3UC.js';
 import { StatusDot } from './chunk-CYQBDZ6M.js';
-import { Tooltip } from './chunk-3QQIGMY3.js';
-import { Menu } from './chunk-YOJAGKTS.js';
+import { Tooltip } from './chunk-7ZSEUO5Q.js';
+import { Menu } from './chunk-TGGYSQRD.js';
 import { Button } from './chunk-DGXZ635L.js';
 import { isComposing } from './chunk-TUEM2XIW.js';
 import { IconButton } from './chunk-UAUP6XGK.js';

package/dist/{chunk-LQRN2XZK.js → chunk-4DEKONVJ.js}

@@ -1,6 +1,6 @@
 import { heldHint } from './chunk-TDFLCUBE.js';
-import { emojiName, EmojiPicker } from './chunk-MPYRC3GO.js';
-import { Tooltip } from './chunk-3QQIGMY3.js';
+import { emojiName, EmojiPicker } from './chunk-SPNTUQBV.js';
+import { Tooltip } from './chunk-7ZSEUO5Q.js';
 import { cx } from './chunk-ODEQTPFM.js';
 import './ChatScale-L4SIHSKL.css';
 import './ReactionBar-XXI4V7XG.css';

package/dist/chunk-5JPOFAVN.js

@@ -0,0 +1,58 @@
+import { usePresence, releaseFocus } from './chunk-PCAT2EFB.js';
+import { cx } from './chunk-ODEQTPFM.js';
+import './DockColumn-SMJCXHS4.css';
+import { useRef, useCallback, useLayoutEffect } from 'react';
+import { jsx } from 'react/jsx-runtime';
+
+var DOCK_MOTION = { transitions: ["width"] };
+function DockColumn({
+  open,
+  width,
+  side = "start",
+  divider = true,
+  focusOnClose,
+  className,
+  style,
+  children,
+  ...rest
+}) {
+  const column = useRef(null);
+  const { present, leaving } = usePresence(open, column, DOCK_MOTION);
+  const closed = useRef(!open);
+  closed.current = !open;
+  const isClosed = useCallback(() => closed.current, []);
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ...rest,
+      ref: column,
+      className: cx("crewlet-dock-column", divider && "crewlet-dock-column--divider", className),
+      "data-side": side,
+      "data-open": open ? "" : void 0,
+      style: { ...style, "--crewlet-dock-column-width": typeof width === "number" ? `${width}px` : width },
+      children: present ? /* @__PURE__ */ jsx(DockPanel, { leaving, isClosed, focusOnClose, children }) : null
+    }
+  );
+}
+function DockPanel({
+  leaving,
+  isClosed,
+  focusOnClose,
+  children
+}) {
+  const panel = useRef(null);
+  const target = useRef(focusOnClose);
+  target.current = focusOnClose;
+  useLayoutEffect(() => {
+    if (leaving) releaseFocus(panel.current, target.current?.());
+  }, [leaving]);
+  useLayoutEffect(() => {
+    const element = panel.current;
+    return () => {
+      if (isClosed()) releaseFocus(element, target.current?.());
+    };
+  }, [isClosed]);
+  return /* @__PURE__ */ jsx("div", { ref: panel, className: "crewlet-dock-column__panel", inert: leaving || void 0, children });
+}
+
+export { DockColumn };

package/dist/{chunk-C7UHDM7Y.js → chunk-5V6GW6HK.js}

@@ -1,5 +1,5 @@
 import { useThemePreference, useDensityPreference } from './chunk-Z24ZUSTX.js';
-import { SegmentedControl } from './chunk-GZVAZ3LL.js';
+import { SegmentedControl } from './chunk-AZYE7NR4.js';
 import { SunGlyph, MonitorGlyph, MoonGlyph } from '@crewlethq/icons/glyphs';
 import { jsx } from 'react/jsx-runtime';
 

package/dist/{chunk-Q7N2ATMC.js → chunk-64JNKLLP.js}

@@ -1,8 +1,9 @@
 import { Eyebrow } from './chunk-RK4XPHVG.js';
+import { returnFocus } from './chunk-4ITETIGZ.js';
 import { useHeadingLevel, HeadingLevelProvider, nextHeadingLevel, headingTag } from './chunk-PQADV6P6.js';
 import { cx } from './chunk-ODEQTPFM.js';
-import './ReadingPane-VLYOWMCM.css';
-import { createContext, useId, useContext } from 'react';
+import './ReadingPane-VFTRDPC5.css';
+import { createContext, useId, useRef, useState, useEffect, useLayoutEffect, createElement, useContext } from 'react';
 import { ClockGlyph, CheckGlyph } from '@crewlethq/icons/glyphs';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 
@@ -12,19 +13,62 @@ function usePane(part) {
   if (pane === null) throw new Error(`${part} must be drawn inside a ReadingPane.`);
   return pane;
 }
-function ReadingPane({ headingLevel, className, children, ...rest }) {
+var READING_PANE_ENTER = { animations: ["crewlet-reading-pane-enter"] };
+function ReadingPane({ headingLevel, contentKey, focusTarget, className, children, ...rest }) {
   const titleId = useId();
   const outer = useHeadingLevel();
   const level = headingLevel ?? outer;
   const named = rest["aria-label"] !== void 0 || rest["aria-labelledby"] !== void 0;
-  return /* @__PURE__ */ jsx("div", { className: "crewlet-reading-pane", children: /* @__PURE__ */ jsx(
+  const pane = useRef(null);
+  const column = useRef(null);
+  const [drawnKey, setDrawnKey] = useState(contentKey);
+  const [moved, setMoved] = useState(false);
+  if (drawnKey !== contentKey) {
+    setDrawnKey(contentKey);
+    setMoved(true);
+  }
+  const owned = useRef(false);
+  useEffect(() => {
+    const root = pane.current;
+    if (!root) return void 0;
+    const doc = root.ownerDocument;
+    const inside = (node) => node instanceof Node && root.contains(node);
+    const focusIn = () => {
+      owned.current = true;
+    };
+    const focusOut = (event) => {
+      if (event.relatedTarget !== null && !inside(event.relatedTarget)) owned.current = false;
+    };
+    const press = (event) => {
+      owned.current = inside(event.target);
+    };
+    root.addEventListener("focusin", focusIn);
+    root.addEventListener("focusout", focusOut);
+    doc.addEventListener("pointerdown", press, true);
+    return () => {
+      root.removeEventListener("focusin", focusIn);
+      root.removeEventListener("focusout", focusOut);
+      doc.removeEventListener("pointerdown", press, true);
+    };
+  }, []);
+  const settled = useRef(contentKey);
+  useLayoutEffect(() => {
+    if (contentKey === settled.current) return;
+    settled.current = contentKey;
+    if (!owned.current) return;
+    const target = focusTarget?.() ?? column.current?.querySelector(".crewlet-reading-pane__title");
+    returnFocus(target, { preventScroll: true });
+  }, [contentKey, focusTarget]);
+  return /* @__PURE__ */ jsx("div", { ref: pane, className: "crewlet-reading-pane", children: /* @__PURE__ */ createElement(
     "article",
     {
       ...rest,
+      key: contentKey,
+      ref: column,
       "aria-labelledby": named ? rest["aria-labelledby"] : titleId,
-      className: cx("crewlet-reading-pane__column", className),
-      children: /* @__PURE__ */ jsx(ReadingPaneContext.Provider, { value: { titleId, level }, children: /* @__PURE__ */ jsx(HeadingLevelProvider, { level: nextHeadingLevel(level), children }) })
-    }
+      className: cx("crewlet-reading-pane__column", moved && "crewlet-reading-pane__column--entering", className)
+    },
+    /* @__PURE__ */ jsx(ReadingPaneContext.Provider, { value: { titleId, level }, children: /* @__PURE__ */ jsx(HeadingLevelProvider, { level: nextHeadingLevel(level), children }) })
   ) });
 }
 function ReadingPaneByline({ start, leading, note, className, children, ...rest }) {
@@ -46,7 +90,11 @@ function ReadingPaneByline({ start, leading, note, className, children, ...rest
 function ReadingPaneTitle({ className, children, ...rest }) {
   const { titleId, level } = usePane("ReadingPane.Title");
   const Heading = headingTag(level);
-  return /* @__PURE__ */ jsx(Heading, { id: titleId, ...rest, className: cx("crewlet-reading-pane__title", className), children });
+  return (
+    // Focusable from code alone, for the pane to hand focus to when its item
+    // changes; never a tab stop.
+    /* @__PURE__ */ jsx(Heading, { id: titleId, tabIndex: -1, ...rest, className: cx("crewlet-reading-pane__title", className), children })
+  );
 }
 function ReadingPaneLead({ className, children, ...rest }) {
   return /* @__PURE__ */ jsx("div", { ...rest, className: cx("crewlet-reading-pane__lead", className), children });
@@ -109,4 +157,4 @@ ReadingPane.Reasoning = ReadingPaneReasoning;
 ReadingPane.Outcome = ReadingPaneOutcome;
 ReadingPane.Section = ReadingPaneSection;
 
-export { ReadingPane, ReadingPaneByline, ReadingPaneLead, ReadingPaneOutcome, ReadingPaneQuote, ReadingPaneReasoning, ReadingPaneSection, ReadingPaneTitle };
+export { READING_PANE_ENTER, ReadingPane, ReadingPaneByline, ReadingPaneLead, ReadingPaneOutcome, ReadingPaneQuote, ReadingPaneReasoning, ReadingPaneSection, ReadingPaneTitle };

package/dist/chunk-6C7GQOBV.js

@@ -0,0 +1,10 @@
+// src/utils/developing.ts
+function developing() {
+  try {
+    return process.env.NODE_ENV !== "production";
+  } catch {
+    return false;
+  }
+}
+
+export { developing };

package/dist/{chunk-YRNNUCQP.js → chunk-7BDBO2NP.js}

@@ -1,4 +1,4 @@
-import { SidebarNav } from './chunk-25JQNHTC.js';
+import { SidebarNav } from './chunk-BRK3HXGZ.js';
 import { VisuallyHidden } from './chunk-UT6CW3C7.js';
 import { cx } from './chunk-ODEQTPFM.js';
 import './SectionFrame-M62UUVFQ.css';

package/dist/{chunk-XGLMPPDW.js → chunk-7K6LVM5I.js}

@@ -1,5 +1,5 @@
 import { today, CalendarGrid, shiftMonth, compareDays } from './chunk-EE3DJMSQ.js';
-import { Popover } from './chunk-SM4P2SHB.js';
+import { Popover } from './chunk-EC6EUIAD.js';
 import { Button } from './chunk-DGXZ635L.js';
 import { useFocusModality } from './chunk-4ITETIGZ.js';
 import { IconButton } from './chunk-UAUP6XGK.js';

package/dist/{chunk-FKAJBN6G.js → chunk-7M7WKYOV.js}

@@ -1,9 +1,9 @@
-import { Modal } from './chunk-XXDB6KPV.js';
+import { Modal } from './chunk-ZXXZESCD.js';
 import { useListbox, useOptionKeys } from './chunk-YGRTX67J.js';
 import { KeyChip, highlightMatch } from './chunk-HBDA76EZ.js';
-import { Popover } from './chunk-SM4P2SHB.js';
+import { Popover } from './chunk-EC6EUIAD.js';
 import { Skeleton } from './chunk-I4IUX3JF.js';
-import { useMediaMatch } from './chunk-RTPQDNW3.js';
+import { useMediaMatch } from './chunk-YJQXESOJ.js';
 import { Input } from './chunk-O7N6W52M.js';
 import { focusables, isComposing } from './chunk-TUEM2XIW.js';
 import { returnFocus } from './chunk-4ITETIGZ.js';

package/dist/{chunk-A5YKNRG6.js → chunk-7QCSISHM.js}

@@ -1,3 +1,4 @@
+import { prefersReducedMotion } from './chunk-YJQXESOJ.js';
 import { cx } from './chunk-ODEQTPFM.js';
 import './Outline-VCXKKU3E.css';
 import { useState, useRef, useEffect } from 'react';
@@ -28,7 +29,7 @@ function scrollToHeading(id, ownerDocument = document) {
   const heading = ownerDocument.getElementById(id);
   if (!heading) return false;
   if (!heading.hasAttribute("tabindex")) heading.setAttribute("tabindex", "-1");
-  const still = ownerDocument.defaultView?.matchMedia?.("(prefers-reduced-motion: reduce)").matches ?? false;
+  const still = prefersReducedMotion(ownerDocument.defaultView);
   heading.scrollIntoView?.({ behavior: still ? "auto" : "smooth", block: "start" });
   heading.focus({ preventScroll: true });
   return true;

package/dist/{chunk-3QQIGMY3.js → chunk-7ZSEUO5Q.js}

@@ -1,3 +1,5 @@
+import { tokenMs } from './chunk-HTS5RJ7S.js';
+import { useComposedRef } from './chunk-L72URIHR.js';
 import { useLayerContainer, viewportBounds, LAYER_GAP, anchorGone, placePopup, LAYER_REPOSITION_EVENT } from './chunk-OMV5W53A.js';
 import { usePopupLayer } from './chunk-TUEM2XIW.js';
 import { isVisibleFocus } from './chunk-4ITETIGZ.js';
@@ -8,9 +10,6 @@ import { createPortal } from 'react-dom';
 import { motion } from '@crewlethq/tokens';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 
-function ms(value) {
-  return Number.parseFloat(value);
-}
 function composeHandlers(first, second) {
   if (typeof first !== "function") return second;
   if (typeof second !== "function") return first;
@@ -19,21 +18,8 @@ function composeHandlers(first, second) {
     second(...args);
   };
 }
-function attach(ref, el) {
-  if (typeof ref === "function") {
-    const release = ref(el);
-    return typeof release === "function" ? release : () => void ref(null);
-  }
-  if (!ref) return () => {
-  };
-  const box = ref;
-  box.current = el;
-  return () => {
-    box.current = null;
-  };
-}
-var OPEN_DELAY = ms(motion.duration.slow);
-var CLOSE_DELAY = ms(motion.duration.base);
+var OPEN_DELAY = tokenMs(motion.duration.slow);
+var CLOSE_DELAY = tokenMs(motion.duration.base);
 function Tooltip({
   content,
   placement = "top",
@@ -157,21 +143,11 @@ function Tooltip({
   if (outer["style"] !== void 0) passed["style"] = { ...child.props["style"], ...outer["style"] };
   const describedBy = cx(child.props["aria-describedby"], outer["aria-describedby"]) || void 0;
   const ownRef = child.props["ref"];
+  const triggerRef = useComposedRef(anchor, layer.insideRef, ownRef, forwardedRef);
   const call = (key, event) => (passed[key] ?? child.props[key])?.(event);
   const trigger = cloneElement(child, {
     ...passed,
-    ref: (el) => {
-      anchor.current = el;
-      layer.insideRef(el);
-      const release = attach(ownRef, el);
-      const releaseForwarded = attach(forwardedRef, el);
-      return () => {
-        anchor.current = null;
-        layer.insideRef(null);
-        release();
-        releaseForwarded();
-      };
-    },
+    ref: triggerRef,
     "aria-describedby": open ? cx(describedBy, panelId) : describedBy,
     onPointerEnter: (event) => {
       over.current.pointer = true;

package/dist/{chunk-57BFL323.js → chunk-ABRWL5FJ.js}

@@ -1,5 +1,5 @@
-import { useMediaMatch } from './chunk-RTPQDNW3.js';
 import { Checkbox } from './chunk-YQ7Q52XU.js';
+import { useMediaMatch } from './chunk-YJQXESOJ.js';
 import { EmptyState } from './chunk-PPUR46MK.js';
 import { Button } from './chunk-DGXZ635L.js';
 import { VisuallyHidden } from './chunk-UT6CW3C7.js';