@crewlethq/ui 0.82.0 → 0.84.0

package/dist/BrandLockup/index.js

@@ -1,3 +1,3 @@
-export { BrandLockup } from '../chunk-GVPUCEWH.js';
-import '../chunk-ISQANI6Q.js';
+export { BrandLockup } from '../chunk-KXWJJWBD.js';
+import '../chunk-JLOESTT2.js';
 import '../chunk-ODEQTPFM.js';

package/dist/BriefCard/index.js

@@ -1,5 +1,6 @@
-export { BRIEF_CARD_LABELS, BRIEF_CARD_MAX_FOLLOW_UPS, BRIEF_CARD_MAX_NEEDS, BRIEF_CARD_MAX_POINTS, BriefCard } from '../chunk-CF4M6N6A.js';
+export { BRIEF_CARD_LABELS, BRIEF_CARD_MAX_FOLLOW_UPS, BRIEF_CARD_MAX_NEEDS, BRIEF_CARD_MAX_POINTS, BriefCard } from '../chunk-XYSSFI5C.js';
 import '../chunk-Y7PVLEZJ.js';
+import '../chunk-6C7GQOBV.js';
 import '../chunk-FLW5U7YS.js';
 import '../chunk-LBGKLYBY.js';
 import '../chunk-U2IQNDDR.js';

package/dist/Canvas/index.js

@@ -1,6 +1,8 @@
-export { CANVAS_COMPOSE_CONTEXT, CANVAS_FIT_MAX_ZOOM, CANVAS_FIT_PADDING, CANVAS_FOCUS_CONTEXT, CANVAS_MAX_ZOOM, CANVAS_MIN_ZOOM, CANVAS_PAN_MARGIN, CANVAS_PAN_STEP, CANVAS_REVEAL_PADDING, CANVAS_TAP_SLOP, CANVAS_WHEEL_LINE_PX, CANVAS_WHEEL_ZOOM_PER_PIXEL, CANVAS_ZOOM_CEILING, CANVAS_ZOOM_LIMITS, CANVAS_ZOOM_STEP, Canvas, IDENTITY_VIEW, ShortcutTip, anchorView, beyondSlop, clampPan, clampZoom, fitView, gridOf, panBy, pinchView, regionView, revealView, screenRect, toScreen, toWorld, wheelPixels, wheelZoomFactor, zoomAt, zoomLimits } from '../chunk-SEKO6P3Y.js';
+export { CANVAS_COMPOSE_CONTEXT, CANVAS_FIT_MAX_ZOOM, CANVAS_FIT_PADDING, CANVAS_FOCUS_CONTEXT, CANVAS_MAX_ZOOM, CANVAS_MIN_ZOOM, CANVAS_PAN_MARGIN, CANVAS_PAN_STEP, CANVAS_REVEAL_PADDING, CANVAS_TAP_SLOP, CANVAS_WHEEL_LINE_PX, CANVAS_WHEEL_ZOOM_PER_PIXEL, CANVAS_ZOOM_CEILING, CANVAS_ZOOM_LIMITS, CANVAS_ZOOM_STEP, Canvas, IDENTITY_VIEW, ShortcutTip, anchorView, beyondSlop, clampPan, clampZoom, fitView, gridOf, panBy, pinchView, regionView, revealView, screenRect, toScreen, toWorld, wheelPixels, wheelZoomFactor, zoomAt, zoomLimits } from '../chunk-NCUSI4ZU.js';
 import '../chunk-LM3ISVJA.js';
-import '../chunk-3QQIGMY3.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/CanvasBoard/index.js

@@ -1,10 +1,12 @@
-export { BOARD_NAME_MIN_CHARS, CANVAS_BOARD_MAX_LIVE, CANVAS_BOARD_MIN_LIVE_WIDTH, CANVAS_BOARD_MIN_ZOOM, CANVAS_NOTE_COLORS, CanvasBoard, TITLE_GLYPH_EM, boardName, boardRoom, liveBoards, titleSize } from '../chunk-4RYELYWG.js';
+export { BOARD_NAME_MIN_CHARS, CANVAS_BOARD_MAX_LIVE, CANVAS_BOARD_MIN_LIVE_WIDTH, CANVAS_BOARD_MIN_ZOOM, CANVAS_NOTE_COLORS, CanvasBoard, TITLE_GLYPH_EM, boardName, boardRoom, liveBoards, titleSize } from '../chunk-2SVQBQAD.js';
 import '../chunk-5SZGKSGL.js';
-import '../chunk-HA2PL7PA.js';
+import '../chunk-DRFOTWJE.js';
 import '../chunk-NXFTCPF6.js';
-import '../chunk-SEKO6P3Y.js';
+import '../chunk-NCUSI4ZU.js';
 import '../chunk-LM3ISVJA.js';
-import '../chunk-3QQIGMY3.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/CanvasToolbar/index.js

@@ -1,8 +1,10 @@
-export { CanvasToolbar, toolForKey } from '../chunk-HA2PL7PA.js';
+export { CanvasToolbar, toolForKey } from '../chunk-DRFOTWJE.js';
 import '../chunk-NXFTCPF6.js';
-import '../chunk-SEKO6P3Y.js';
+import '../chunk-NCUSI4ZU.js';
 import '../chunk-LM3ISVJA.js';
-import '../chunk-3QQIGMY3.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/CatalogTile/CatalogTile.d.ts

@@ -1,5 +1,6 @@
 import { type HTMLAttributes, type ReactNode } from 'react';
 import { type HeadingLevel } from '../utils/headingLevel.js';
+import type { Tone } from '../utils/tone.js';
 export type CatalogTileElement = 'article' | 'li' | 'div';
 /**
  * How much room a tile takes. `comfortable` (the default) is the catalogue's
@@ -10,6 +11,23 @@ export type CatalogTileElement = 'article' | 'li' | 'div';
  * already in use rather than offers a choice.
  */
 export type CatalogTileDensity = 'comfortable' | 'compact';
+/**
+ * An entry's state, as data: the tile draws it, the same way on every tile.
+ *
+ * ONE PRESENTATION, NOT A SLOT. Taken as any node, a service's In use came as
+ * a soft pill and an app's Connected as a dot and a word, so one row of tiles
+ * drew its states two ways and at two heights. A tone and a word cannot be
+ * drawn two ways.
+ */
+export interface CatalogTileStatus {
+    /**
+     * What the state is: `success` for in use or connected, `warning` for
+     * something owed, `danger` for broken, `neutral` for coming soon.
+     */
+    tone: Tone;
+    /** The state in a word or two: In use, Connected, Needs attention. */
+    label: string;
+}
 export interface CatalogTileProps extends Omit<HTMLAttributes<HTMLElement>, 'title'> {
     /** The element the tile is: an `li` in a `TileGrid as="ul"`. */
     as?: CatalogTileElement | undefined;
@@ -24,12 +42,12 @@ export interface CatalogTileProps extends Omit<HTMLAttributes<HTMLElement>, 'tit
     /** Overrides the level the name is rendered at. */
     headingLevel?: HeadingLevel | undefined;
     /**
-     * The entry's state, as a `Tag`, ONLY when the state is worth reading: On,
-     * Connected, Needs attention, Coming soon. An entry in its resting state
-     * (available, not set up) carries none, and its name stands centred beside
-     * its mark; a pill under every name is a column a reader learns to skip.
+     * The entry's state, drawn as its tone's dot and its word, ONLY when the
+     * state is worth reading: In use, Connected, Needs attention, Coming soon.
+     * An entry in its resting state (available, not set up) carries none; a
+     * state under every name is a column a reader learns to skip.
      */
-    status?: ReactNode;
+    status?: CatalogTileStatus | undefined;
     /** One sentence: what the entry is for, or what is owed when something is. */
     description?: ReactNode;
     /** A quiet fact at the foot (`2 agents · 14 deliveries`). */

package/dist/CatalogTile/index.d.ts

@@ -1,3 +1,3 @@
 import './CatalogTile.css';
 export { CatalogTile } from './CatalogTile.js';
-export type { CatalogTileDensity, CatalogTileElement, CatalogTileProps } from './CatalogTile.js';
+export type { CatalogTileDensity, CatalogTileElement, CatalogTileProps, CatalogTileStatus } from './CatalogTile.js';

package/dist/CatalogTile/index.js

@@ -1,3 +1,4 @@
-export { CatalogTile } from '../chunk-QE4OIE3Q.js';
+export { CatalogTile } from '../chunk-DJIWCW5Z.js';
+import '../chunk-CYQBDZ6M.js';
 import '../chunk-PQADV6P6.js';
 import '../chunk-ODEQTPFM.js';

package/dist/{CatalogTile-6VF36JWA.css → CatalogTile-TMOSGSV3.css}

@@ -79,9 +79,10 @@
   overflow-wrap: anywhere;
 }
 
-/* A state in words (a StatusDot's label) at a Tag's caption step, so a row
-   reads the same whichever one a tile carries. It inherited the page's size,
-   and on a 16px page "Connected" stood taller than the name before it. */
+/* THE STATE, the tone's dot and its word, at the caption step the fact
+   beside it takes, so a compact tile's line reads name, state, fact at one
+   height. It inherited the page's size, and on a 16px page "Connected" stood
+   taller than the name before it. */
 .crewlet-catalog-tile__status {
   display: inline-flex;
   font-size: var(--font-size-xs);

package/dist/ChangeMark/index.js

@@ -1,8 +1,10 @@
-export { ChangeMark } from '../chunk-ONNXUS5Y.js';
+export { ChangeMark } from '../chunk-VB3FVKNI.js';
 import '../chunk-LFSIKGRQ.js';
 import '../chunk-Z7JYG5TF.js';
 import '../chunk-AYKXMIOR.js';
-import '../chunk-3QQIGMY3.js';
+import '../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/ChatThread/index.js

@@ -1,5 +1,5 @@
-export { CHAT_THREAD_FOLLOW_WITHIN, CHAT_THREAD_LABELS, ChatThread } from '../chunk-JHQGNFN3.js';
-import '../chunk-RTPQDNW3.js';
+export { CHAT_THREAD_FOLLOW_WITHIN, CHAT_THREAD_LABELS, ChatThread } from '../chunk-VONEKR3J.js';
+import '../chunk-YJQXESOJ.js';
 import '../chunk-DGXZ635L.js';
 import '../chunk-XSPCITPN.js';
 import '../chunk-UT6CW3C7.js';

package/dist/CommandPalette/index.js

@@ -1,6 +1,7 @@
-export { CommandPalette } from '../chunk-VGOWSOUA.js';
-import '../chunk-XXDB6KPV.js';
+export { CommandPalette } from '../chunk-YXKSUILG.js';
+import '../chunk-ZXXZESCD.js';
 import '../chunk-YGRTX67J.js';
+import '../chunk-L72URIHR.js';
 import '../chunk-O7N6W52M.js';
 import '../chunk-PGCLHYVP.js';
 import '../chunk-CMAZZY2I.js';

package/dist/CompactNav/CompactNav.d.ts

@@ -24,7 +24,7 @@
  */
 import { type MouseEventHandler, type ReactNode } from 'react';
 import { type PlacementRect } from '../Layer/index.js';
-import type { NavFigure, NavLinkProps } from '../SidebarNav/index.js';
+import type { NavBadge, NavFigure, NavLinkProps } from '../SidebarNav/index.js';
 export interface CompactNavProps {
     /** Names the navigation region, as `SidebarNav`'s label does. */
     label: string;
@@ -45,9 +45,11 @@ interface CompactPlace {
     current?: boolean | undefined;
     /**
      * How many things here are waiting on the reader: the accent figure on the
-     * tile's corner, as `SidebarNav.Item`'s badge.
+     * tile's corner, as `SidebarNav.Item`'s badge. `tone: 'quiet'` draws it as
+     * the quiet figure, as the full rail's quiet badge, and keeps it out of a
+     * group's sum.
      */
-    badge?: NavFigure | undefined;
+    badge?: NavBadge | undefined;
     /** How many of something the place holds: the quiet figure, as `SidebarNav.Item`'s count. */
     count?: NavFigure | undefined;
     /**
@@ -123,7 +125,8 @@ export interface CompactNavGroupProps {
  * badge's own value with a `+`, since there is more than it says.
  *
  * The quiet counts are not carried: a count says how much a place holds, and
- * a sum of how much six places hold is a figure about nothing.
+ * a sum of how much six places hold is a figure about nothing. Nor is a quiet
+ * badge: the group's figure is the accent, and only what calls is added to it.
  */
 export declare function groupBadge(links: readonly Pick<CompactNavLink, 'badge'>[]): (number | string) | undefined;
 /**
@@ -157,8 +160,9 @@ lift?: number): {
  * whatever came next in the document.
  *
  * EVERY PLACE IS A REAL LINK, so a modified press opens a tab as it does in
- * the full rail; choosing one closes the flyout and, where the keyboard chose
- * it, hands focus back to the tile.
+ * the full rail; choosing one closes the flyout, and focus follows the
+ * navigation: where the page it opened took focus it stays there, and where
+ * it is still in the flyout it goes back to the tile, by a press as by a key.
  *
  * WHAT OPENED IT DECIDES WHAT CLOSES IT. Opened by the pointer resting on the
  * tile, it closes when the pointer leaves both; opened by a press or the keys,

package/dist/CompactNav/index.js

@@ -1,5 +1,6 @@
-export { CompactNav, CompactNavGroup, CompactNavItem, CompactNavSeparator, groupBadge, placeFlyout } from '../chunk-GP5TNTZH.js';
+export { CompactNav, CompactNavGroup, CompactNavItem, CompactNavSeparator, groupBadge, placeFlyout } from '../chunk-QWRAWKB2.js';
 import '../chunk-TEV5REGB.js';
+import '../chunk-HTS5RJ7S.js';
 import '../chunk-OMV5W53A.js';
 import '../chunk-2YTOOH3A.js';
 import '../chunk-TUEM2XIW.js';

package/dist/ContrastHelp/index.js

@@ -1,9 +1,10 @@
-export { ContrastHelp } from '../chunk-PXLS6JKL.js';
+export { ContrastHelp } from '../chunk-WMO722J2.js';
 import '../chunk-2ZSCHQOA.js';
-import '../chunk-SM4P2SHB.js';
 import '../chunk-LBGKLYBY.js';
+import '../chunk-EC6EUIAD.js';
 import '../chunk-7W3LYIOC.js';
 import '../chunk-CYQBDZ6M.js';
+import '../chunk-L72URIHR.js';
 import '../chunk-OMV5W53A.js';
 import '../chunk-TUEM2XIW.js';
 import '../chunk-4ITETIGZ.js';

package/dist/DataGrid/index.js

@@ -1,6 +1,6 @@
-export { ChooserList, ColumnChooser, DATA_GRID_ICON_TRACK, DataGrid, columnChoicesOf, countDataGridRows, fitGridColumns, nextGridSort, parseGridSort, useAnyDataGridDriving, useDataGridDriving } from '../chunk-57BFL323.js';
-import '../chunk-RTPQDNW3.js';
+export { ChooserList, ColumnChooser, DATA_GRID_ICON_TRACK, DataGrid, columnChoicesOf, countDataGridRows, fitGridColumns, nextGridSort, parseGridSort, useAnyDataGridDriving, useDataGridDriving } from '../chunk-ABRWL5FJ.js';
 import '../chunk-YQ7Q52XU.js';
+import '../chunk-YJQXESOJ.js';
 import '../chunk-PPUR46MK.js';
 import '../chunk-O7N6W52M.js';
 import '../chunk-PGCLHYVP.js';

package/dist/DataTable/index.js

@@ -1,11 +1,12 @@
-export { ALL_ITEMS, CopyableCell, DATA_TABLE_LABELS, DataTable, RowActionsMenu } from '../chunk-P6F3PE4V.js';
-import '../chunk-XXDB6KPV.js';
+export { ALL_ITEMS, CopyableCell, DATA_TABLE_LABELS, DataTable, RowActionsMenu } from '../chunk-WANKINXG.js';
+import '../chunk-ZXXZESCD.js';
 import '../chunk-STJ7QBC3.js';
 import '../chunk-DTIW4CHZ.js';
 import '../chunk-RE3FBGQQ.js';
 import '../chunk-AV2DXAEL.js';
 import '../chunk-YQ7Q52XU.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/DataView/index.js

@@ -1,20 +1,21 @@
-export { DATA_VIEW_TOOLBAR_LABELS, DataView, DataViewToolbar, FILTER_AXIS_LABELS, FilterAxisBar, FilterAxisChip, applyColumnFilters, applyFilters, blankFilterValue, defaultOperator, filterDefsFromColumns, filterHasValue, filterPredicate, formatFilterValue, operatorOf, tableColumns } from '../chunk-SYVQXMLO.js';
+export { DATA_VIEW_TOOLBAR_LABELS, DataView, DataViewToolbar, FILTER_AXIS_LABELS, FilterAxisBar, FilterAxisChip, applyColumnFilters, applyFilters, blankFilterValue, defaultOperator, filterDefsFromColumns, filterHasValue, filterPredicate, formatFilterValue, operatorOf, tableColumns } from '../chunk-XRWHDW6F.js';
 import '../chunk-FPDIHEM4.js';
 import '../chunk-K4LZXSKZ.js';
-import '../chunk-XGLMPPDW.js';
-import '../chunk-P6F3PE4V.js';
-import '../chunk-XXDB6KPV.js';
+import '../chunk-7K6LVM5I.js';
+import '../chunk-WANKINXG.js';
+import '../chunk-ZXXZESCD.js';
+import '../chunk-YGRTX67J.js';
 import '../chunk-STJ7QBC3.js';
 import '../chunk-DTIW4CHZ.js';
-import '../chunk-YGRTX67J.js';
 import '../chunk-EE3DJMSQ.js';
 import '../chunk-NXFTCPF6.js';
-import '../chunk-SM4P2SHB.js';
+import '../chunk-EC6EUIAD.js';
 import '../chunk-EJNJMHQG.js';
 import '../chunk-RE3FBGQQ.js';
 import '../chunk-AV2DXAEL.js';
 import '../chunk-YQ7Q52XU.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/DateTimePicker/index.js

@@ -1,6 +1,7 @@
-export { DEFAULT_DATE_TIME_PICKER_LABELS, DateTimePicker } from '../chunk-XGLMPPDW.js';
+export { DEFAULT_DATE_TIME_PICKER_LABELS, DateTimePicker } from '../chunk-7K6LVM5I.js';
 import '../chunk-EE3DJMSQ.js';
-import '../chunk-SM4P2SHB.js';
+import '../chunk-EC6EUIAD.js';
+import '../chunk-L72URIHR.js';
 import '../chunk-DGXZ635L.js';
 import '../chunk-XSPCITPN.js';
 import '../chunk-OMV5W53A.js';

package/dist/DeepWorkCard/index.js

@@ -1,7 +1,7 @@
-export { DEEP_WORK_CARD_LABELS, DEEP_WORK_STATES, DEEP_WORK_STATE_LABELS, DeepWorkCard } from '../chunk-IYI6HWKN.js';
+export { DEEP_WORK_CARD_LABELS, DEEP_WORK_STATES, DEEP_WORK_STATE_LABELS, DeepWorkCard } from '../chunk-CV2LU2T2.js';
 import '../chunk-RJWO2PC5.js';
-import '../chunk-RQFRRPV6.js';
 import '../chunk-ZWCK4N4L.js';
+import '../chunk-RQFRRPV6.js';
 import '../chunk-FLW5U7YS.js';
 import '../chunk-LBGKLYBY.js';
 import '../chunk-U2IQNDDR.js';

package/dist/DirectoryList/index.js

@@ -1,3 +1,3 @@
-export { DirectoryList } from '../chunk-SRDNGGZE.js';
+export { DirectoryList } from '../chunk-RKIJAXQA.js';
 import '../chunk-PQADV6P6.js';
 import '../chunk-ODEQTPFM.js';

package/dist/{DirectoryList-XZOWYOA3.css → DirectoryList-IXQIMNFS.css}

@@ -17,7 +17,12 @@
   font-family: var(--font-family-sans);
 }
 
-/* The groups take the room and scroll on their own, so the foot stays put. */
+/* The groups take the room and scroll on their own, so the foot stays put.
+
+   THEIR INSET IS INSIDE THE SCROLLER. The gutter is reserved whether or not
+   they scroll, and the lines end a step before it: a line's state pill stood
+   against the scrollbar, and moved by its width when the list grew long
+   enough to scroll. */
 .crewlet-directory__groups {
   display: flex;
   flex: 1 1 auto;
@@ -26,7 +31,9 @@
      under it rather than a band between two runs of them. */
   gap: var(--spacing-3);
   min-height: 0;
+  padding-right: var(--spacing-2);
   overflow-y: auto;
+  scrollbar-gutter: stable;
 }
 
 .crewlet-directory__group {

package/dist/DocTabsEditor/index.js

@@ -1,6 +1,8 @@
-export { DOC_TABS_EDITOR_LABELS, DocTabsEditor } from '../chunk-B3X4DHRB.js';
-import '../chunk-MPVMB2DV.js';
-import '../chunk-YOJAGKTS.js';
+export { DOC_TABS_EDITOR_LABELS, DocTabsEditor } from '../chunk-RDIQB5ZE.js';
+import '../chunk-BVML4UVB.js';
+import '../chunk-YJQXESOJ.js';
+import '../chunk-TGGYSQRD.js';
+import '../chunk-L72URIHR.js';
 import '../chunk-O7N6W52M.js';
 import '../chunk-PGCLHYVP.js';
 import '../chunk-DGXZ635L.js';

package/dist/DockColumn/DockColumn.d.ts

@@ -0,0 +1,68 @@
+/**
+ * A column a host docks beside its content and takes away again: a list of
+ * rooms pinned beside a conversation.
+ *
+ * THE COLUMN IS ALWAYS THERE, as wide as its panel while it is open and as
+ * wide as nothing while it is not, and it eases between the two. It stands in
+ * the host's own `auto` grid track (or as a flex item that does not grow), so
+ * its width IS the track, and the content beside it narrows and widens with
+ * it frame by frame rather than jumping by the panel's width in one.
+ * Swapping the host's grid template between two track lists instead is what
+ * made the content jump: a template is not a length, and it does not ease.
+ *
+ * THE PANEL KEEPS ITS OWN WIDTH, clipped by the column and held to the
+ * column's edge that faces the content, so it slides in from the outer edge
+ * and back out to it, the way a sheet does, and nothing in it reflows on the
+ * way.
+ *
+ * AND IT LEAVES INERT. Closed, the panel stays drawn until the column has
+ * closed over it (`usePresence`), and `inert` all the while, so nothing in a
+ * panel on its way out takes focus or a press; opened again on the way out,
+ * it is live again where it is. Under reduced motion it simply is or is not.
+ *
+ * FOCUS LEAVES WITH IT. A reader who closes the dock from inside it (an Unpin
+ * in its own head) is handed to `focusOnClose`, the control that docks it
+ * again, as the panel starts to leave, and never left in a panel that takes
+ * nothing; with no such control focus is taken off the panel.
+ *
+ * A PLAIN COLUMN, NOT A LANDMARK: what it holds names itself (a navigation
+ * named Rooms), and a column named the same as the region inside it is two
+ * landmarks of one name a screen reader cannot tell apart.
+ */
+import { type HTMLAttributes, type ReactNode } from 'react';
+/** The edge of the content the column stands at, in the inline direction. */
+export type DockColumnSide = 'start' | 'end';
+export interface DockColumnProps extends HTMLAttributes<HTMLDivElement> {
+    /** Whether the panel is docked. The column eases open and shut on a change. */
+    open: boolean;
+    /**
+     * The panel's width, and the column's while it is open: a number of px, or
+     * any CSS length (`var(--rooms-dock)`), so a host keeps the one value its
+     * own layout arithmetic reads.
+     */
+    width: number | string;
+    /**
+     * Which side of the content the column stands on. `start` (the default) is
+     * before it, and its panel slides in from the start edge; `end` is after
+     * it, and slides in from the end edge.
+     */
+    side?: DockColumnSide | undefined;
+    /**
+     * A hairline on the panel's edge that faces the content. On by default; a
+     * panel whose content draws its own edge turns it off.
+     */
+    divider?: boolean | undefined;
+    /**
+     * Where focus goes when the dock closes while focus is inside it: the
+     * control that docks it again. Asked as the panel starts to leave. Left
+     * out, or answering nothing, focus is taken off the panel.
+     */
+    focusOnClose?: (() => HTMLElement | null | undefined) | undefined;
+    /**
+     * The panel. Its ground is the column's `--crewlet-dock-column-ground`,
+     * which a host sets on its own class (`var(--color-surface-subtle)`), and
+     * none by default.
+     */
+    children?: ReactNode;
+}
+export declare function DockColumn({ open, width, side, divider, focusOnClose, className, style, children, ...rest }: DockColumnProps): import("react").JSX.Element;

package/dist/DockColumn/index.d.ts

@@ -0,0 +1,3 @@
+import './DockColumn.css';
+export { DockColumn } from './DockColumn.js';
+export type { DockColumnProps, DockColumnSide } from './DockColumn.js';

package/dist/DockColumn/index.js

@@ -0,0 +1,6 @@
+export { DockColumn } from '../chunk-5JPOFAVN.js';
+import '../chunk-PCAT2EFB.js';
+import '../chunk-YJQXESOJ.js';
+import '../chunk-HTS5RJ7S.js';
+import '../chunk-4ITETIGZ.js';
+import '../chunk-ODEQTPFM.js';

package/dist/DockColumn-SMJCXHS4.css

@@ -0,0 +1,61 @@
+/*
+ * A column docked beside the content (DockColumn.tsx).
+ *
+ * THE COLUMN EASES ITS WIDTH between none and its panel's, on the slow step
+ * with the emphasized curve: the motion the application rail folds by,
+ * so a column of the frame and a column of a screen open and close as one
+ * movement. The host gives it an `auto` track, so its width is the track.
+ * Clipped rather than hidden, so it is never a scroll container a focus or a
+ * scrollIntoView could scroll.
+ *
+ * THE PANEL KEEPS ITS WIDTH and is held to the column's edge that faces the
+ * content: before the content (`start`) it is held to the column's end, so
+ * the moving edge uncovers it from the start edge, and after the content
+ * (`end`) the other way round.
+ *
+ * Tokens only. The width is the component's own variable, set from the
+ * `width` prop, so the column and the panel read one value.
+ */
+
+.crewlet-dock-column {
+  display: flex;
+  justify-content: flex-end;
+  width: 0;
+  min-width: 0;
+  min-height: 0;
+  overflow: clip;
+  transition: width var(--motion-duration-slow) var(--motion-easing-emphasized);
+}
+
+.crewlet-dock-column[data-side='end'] {
+  justify-content: flex-start;
+}
+
+.crewlet-dock-column[data-open] {
+  width: var(--crewlet-dock-column-width);
+}
+
+.crewlet-dock-column__panel {
+  display: flex;
+  flex: none;
+  flex-direction: column;
+  box-sizing: border-box;
+  width: var(--crewlet-dock-column-width);
+  min-height: 0;
+  background: var(--crewlet-dock-column-ground, transparent);
+}
+
+/* The hairline on the panel's edge that faces the content. */
+.crewlet-dock-column--divider[data-side='start'] > .crewlet-dock-column__panel {
+  border-inline-end: 1px solid var(--color-border-default);
+}
+
+.crewlet-dock-column--divider[data-side='end'] > .crewlet-dock-column__panel {
+  border-inline-start: 1px solid var(--color-border-default);
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .crewlet-dock-column {
+    transition: none;
+  }
+}

package/dist/{Editor-7EQWP3RN.js → Editor-VGNB35NJ.js}

@@ -3,7 +3,8 @@ import { schema, readMarkdown, writeMarkdown } from './chunk-7CSTEH5I.js';
 import './chunk-KOJPDCGQ.js';
 import { safeHref, MARKDOWN_CALLOUT_TONES } from './chunk-KBZO4B33.js';
 import { Toolbar } from './chunk-NXFTCPF6.js';
-import { Menu } from './chunk-YOJAGKTS.js';
+import { Menu } from './chunk-TGGYSQRD.js';
+import './chunk-L72URIHR.js';
 import { FormField, Input } from './chunk-O7N6W52M.js';
 import './chunk-PGCLHYVP.js';
 import { Button } from './chunk-DGXZ635L.js';

package/dist/EmojiPicker/index.js

@@ -1,6 +1,8 @@
-export { EMOJI_GROUPS, EMOJI_PICKER_COLUMNS, EMOJI_PICKER_LABELS, EmojiPicker, emojiName, searchEmoji } from '../chunk-MPYRC3GO.js';
-import '../chunk-SM4P2SHB.js';
-import '../chunk-3QQIGMY3.js';
+export { EMOJI_GROUPS, EMOJI_PICKER_COLUMNS, EMOJI_PICKER_LABELS, EmojiPicker, emojiName, searchEmoji } from '../chunk-SPNTUQBV.js';
+import '../chunk-EC6EUIAD.js';
+import '../chunk-7ZSEUO5Q.js';
+import '../chunk-HTS5RJ7S.js';
+import '../chunk-L72URIHR.js';
 import '../chunk-O7N6W52M.js';
 import '../chunk-PGCLHYVP.js';
 import '../chunk-OMV5W53A.js';

package/dist/FactList/index.js

@@ -1,5 +1,7 @@
-export { FactList } from '../chunk-JV6JM6W6.js';
-import '../chunk-3QQIGMY3.js';
+export { FactList } from '../chunk-SNQ7PH3D.js';
+import '../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/HuePicker/index.js

@@ -1,11 +1,12 @@
 import '../chunk-FFMCMSJB.js';
-export { HuePicker, HueSwatch } from '../chunk-LSOR77RZ.js';
+export { HuePicker, HueSwatch } from '../chunk-SHH7UD5U.js';
 import '../chunk-AYKXMIOR.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/InboxList/InboxList.d.ts

@@ -48,13 +48,27 @@ export interface InboxGroupProps extends Omit<HTMLAttributes<HTMLElement>, 'titl
     /** Whether a collapsible group starts open, when the group holds it. */
     defaultOpen?: boolean | undefined;
     onOpenChange?: ((open: boolean) => void) | undefined;
+    /**
+     * The latest row to arrive in the group, as a token (the row's key): each
+     * new value plays a brief wash of the accent over the group's label and
+     * count, so a row that lands in a closed group (Answered) is seen to land.
+     * Pass it only for a row that has just arrived, never on a first draw.
+     */
+    arrived?: string | number | undefined;
 }
+/**
+ * The motion a leaving row waits for: its height closing, a transition of the
+ * row's own `grid-template-rows` (InboxList.css). A suite fakes exactly this.
+ */
+export declare const INBOX_ROW_LEAVE: {
+    readonly transitions: readonly ["grid-template-rows"];
+};
 /**
  * A labelled run of rows. The label is a heading set in the micro-label
  * register, so a reader navigating by heading lands on each group and a
  * reader scanning sees where one ends.
  */
-export declare function InboxGroup({ label, hideLabel, headingLevel, count, collapsible, open: controlledOpen, defaultOpen, onOpenChange, className, children, ...rest }: InboxGroupProps): import("react").JSX.Element;
+export declare function InboxGroup({ label, hideLabel, headingLevel, count, collapsible, open: controlledOpen, defaultOpen, onOpenChange, arrived, className, children, ...rest }: InboxGroupProps): import("react").JSX.Element;
 export type InboxRowTone = 'default' | 'danger';
 export interface InboxRowProps extends Omit<LiHTMLAttributes<HTMLLIElement>, 'onClick' | 'title'> {
     /** Who the row is from: a seat's or a person's name. */
@@ -114,6 +128,18 @@ export interface InboxRowProps extends Omit<LiHTMLAttributes<HTMLLIElement>, 'on
      * open the link in a tab.
      */
     onClick?: ((event: MouseEvent<HTMLElement>) => void) | undefined;
+    /**
+     * On its way out: the row stays drawn, inert, while its height closes, so
+     * the rows under it slide up rather than jump, and is drawn no more once it
+     * has closed. An `InboxGroup` does this itself for a keyed row that leaves
+     * its children, and a wrapper the host draws its rows through forwards
+     * this and `onLeft` to its `InboxRow`; pass it for a list of your own.
+     */
+    leaving?: boolean | undefined;
+    /** Runs once a leaving row has closed and is drawn no more, once for each leave. */
+    onLeft?: (() => void) | undefined;
+    /** Just arrived: a brief wash of the accent that fades back to the row's own ground. */
+    arrived?: boolean | undefined;
 }
 /**
  * One row: WHO, then WHAT in up to three lines, then the task it is about.
@@ -137,7 +163,7 @@ export interface InboxRowProps extends Omit<LiHTMLAttributes<HTMLLIElement>, 'on
  * the words take up to three lines before they stop, so a row says what it is
  * rather than its first few words.
  */
-export declare function InboxRow({ title, qualifier, qualifierTone, meta, leading, excerpt, aside, selected, unread, unreadLabel, actionable, done, doneLabel, status, outcome, outcomeIcon, outcomeTone, href, onClick, className, children, ...rest }: InboxRowProps): import("react").JSX.Element;
+export declare function InboxRow({ title, qualifier, qualifierTone, meta, leading, excerpt, aside, selected, unread, unreadLabel, actionable, done, doneLabel, status, outcome, outcomeIcon, outcomeTone, href, onClick, leaving, onLeft, arrived, className, children, ...rest }: InboxRowProps): import("react").JSX.Element | null;
 export type InboxMoreProps = HTMLAttributes<HTMLDivElement>;
 /**
  * The end of the list: the quiet toggles that open what is not in it by

package/dist/InboxList/index.d.ts

@@ -1,3 +1,3 @@
 import './InboxList.css';
-export { InboxList, InboxGroup, InboxRow, InboxMore, InboxToggle } from './InboxList.js';
+export { InboxList, InboxGroup, InboxRow, InboxMore, InboxToggle, INBOX_ROW_LEAVE } from './InboxList.js';
 export type { InboxListProps, InboxGroupProps, InboxRowProps, InboxRowTone, InboxMoreProps, InboxToggleProps, } from './InboxList.js';