@crewlethq/ui 0.18.0 → 0.20.0

package/dist/PeopleRail/PeopleRail.d.ts

@@ -0,0 +1,52 @@
+import { type ReactNode } from 'react';
+import { type PresenceLabels, type PresenceMember } from '../PresenceModel/index.js';
+/** The reader, drawn first as "You". */
+export type PeopleRailSelf = Pick<PresenceMember, 'name' | 'kind' | 'character' | 'hue' | 'src'>;
+export interface PeopleRailLabels {
+    title: string;
+    close: string;
+    you: string;
+    nobody: string;
+    follow: string;
+    following: string;
+    /** The Follow control's accessible name, which names whom it follows. */
+    followName: (name: string) => string;
+    stopFollowingName: (name: string) => string;
+    /** The activity word under a name with no location: "Editing", "Reading". */
+    activity: PresenceLabels['activity'];
+}
+export declare const PEOPLE_RAIL_LABELS: PeopleRailLabels;
+export interface PeopleRailProps {
+    /** Everybody present but the reader. Two tabs of one seat are listed once, the most active. */
+    members: readonly PresenceMember[];
+    /** The reader, listed first as "You". */
+    self?: PeopleRailSelf | undefined;
+    /** The key of the followed member: its `seat`, or its `id` where it has none. */
+    following?: string | undefined;
+    /** Follow a member, or `null` to stop. Without it the rail offers no Follow controls. */
+    onFollow?: ((member: PresenceMember | null) => void) | undefined;
+    /** Close the rail. Without it the rail draws no close control. */
+    onClose?: (() => void) | undefined;
+    /** Further controls for one member, before Follow: "Open turn" for an agent at work. */
+    actions?: ((member: PresenceMember) => ReactNode) | undefined;
+    labels?: Partial<PeopleRailLabels> | undefined;
+    className?: string | undefined;
+}
+/** What identifies a member for following: the seat, so a second tab of the same person stays followed. */
+export declare function peopleRailKey(member: Pick<PresenceMember, 'id' | 'seat'>): string;
+/**
+ * Who is in a shared document now, what each is doing and where, with Follow
+ * beside everybody but the reader.
+ *
+ * THE SAME FACTS AS THE PRESENCE STACK, IN WORDS. A ring, a cursor and a cell
+ * outline are decorative to assistive technology, so this list is where a
+ * screen reader user learns who is here and where. It is ordered the way the
+ * stack is (people editing, agents editing, people viewing, agents reading,
+ * anybody idle last), so the two never disagree about who comes first.
+ *
+ * FOLLOW IS A TOGGLE, pressed while following, and its name says whom it
+ * follows or stops following, because a column of buttons all called "Follow"
+ * is a column of identical controls to a screen reader. The strip that says
+ * the reader is following is `FollowBanner`, which the host draws.
+ */
+export declare function PeopleRail({ members, self, following, onFollow, onClose, actions, labels: overrides, className, }: PeopleRailProps): import("react").JSX.Element;

package/dist/PeopleRail/index.d.ts

@@ -0,0 +1,3 @@
+import './PeopleRail.css';
+export { PeopleRail, PEOPLE_RAIL_LABELS, peopleRailKey } from './PeopleRail.js';
+export type { PeopleRailLabels, PeopleRailProps, PeopleRailSelf } from './PeopleRail.js';

package/dist/PeopleRail/index.js

@@ -0,0 +1,11 @@
+export { PEOPLE_RAIL_LABELS, PeopleRail, peopleRailKey } from '../chunk-N4GFRW5C.js';
+import '../chunk-CENOOTAV.js';
+import '../chunk-S35G6PNC.js';
+import '../chunk-OG6CL3EB.js';
+import '../chunk-UAN5NE7M.js';
+import '../chunk-AYKXMIOR.js';
+import '../chunk-5OM447RW.js';
+import '../chunk-PQADV6P6.js';
+import '../chunk-4FQT6ZAY.js';
+import '../chunk-BZFWDIV6.js';
+import '../chunk-ODEQTPFM.js';

package/dist/PeopleRail-R64WVOSH.css

@@ -0,0 +1,75 @@
+/* PeopleRail: a raised column of everybody present, one row a person, the
+   name over what they are doing and the controls at the row's end. */
+.crewlet-people-rail {
+  display: flex;
+  flex-direction: column;
+  gap: var(--spacing-3);
+  min-width: 0;
+  padding: var(--spacing-3);
+  border: 1px solid var(--color-border-default);
+  border-radius: var(--radius-md);
+  background: var(--color-surface-elevated);
+}
+
+.crewlet-people-rail__head {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: var(--spacing-2);
+}
+
+.crewlet-people-rail__title {
+  margin: 0;
+  color: var(--color-text-primary);
+  font-size: var(--font-size-sm);
+  font-weight: var(--font-weight-semibold);
+}
+
+.crewlet-people-rail__list {
+  display: flex;
+  flex-direction: column;
+  gap: var(--spacing-2);
+  margin: 0;
+  padding: 0;
+  list-style: none;
+}
+
+.crewlet-people-rail__person {
+  display: flex;
+  align-items: center;
+  gap: var(--spacing-2);
+  min-width: 0;
+}
+
+.crewlet-people-rail__text {
+  display: flex;
+  flex: 1;
+  flex-direction: column;
+  min-width: 0;
+}
+
+.crewlet-people-rail__name {
+  overflow: hidden;
+  color: var(--color-text-primary);
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.crewlet-people-rail__where {
+  color: var(--color-text-tertiary);
+  font-size: var(--font-size-compact);
+  overflow-wrap: anywhere;
+}
+
+.crewlet-people-rail__actions {
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: flex-end;
+  gap: var(--spacing-1);
+}
+
+.crewlet-people-rail__note {
+  margin: 0;
+  color: var(--color-text-tertiary);
+  font-size: var(--font-size-compact);
+}

package/dist/PinTile/PinTile.d.ts

@@ -0,0 +1,37 @@
+import { type HTMLAttributes, type ReactNode } from 'react';
+import type { ReorderHandleProps } from '../Reorder/index.js';
+export interface PinTileProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {
+    /** What was pinned, and the link's name. */
+    title: string;
+    /** Where it opens. */
+    href: string;
+    /** What kind of thing it is, before the facts: "Agent", "Project". */
+    kind?: string | undefined;
+    /** One line of what is true of it now: "Working on FAIR-1". */
+    meta?: ReactNode;
+    /** An avatar or glyph before the title. */
+    leading?: ReactNode;
+    /** A state mark (a dot, a tag) beside the title. */
+    status?: ReactNode;
+    /** One figure at the end: "14%", "3 open". */
+    figure?: ReactNode;
+    /** Unpin it; left out, the tile cannot be unpinned from here. */
+    onUnpin?: (() => void) | undefined;
+    /** The handle's props from `useReorder`; left out, the tile does not move. */
+    handle?: ReorderHandleProps | undefined;
+}
+/**
+ * Something a reader pinned, kept where they land: an agent, a project, a
+ * board, a page. A link with the one or two facts that make opening it
+ * unnecessary on most mornings.
+ *
+ * THE WHOLE TILE IS THE LINK'S TARGET, and the link is the title only. The
+ * tile's area is one stretched pseudo-element over the title's anchor, so a
+ * press anywhere opens it, a screen reader hears one link named by the title,
+ * and the unpin button and the handle are siblings of the anchor rather than
+ * buttons nested inside a link, which no browser can make operable.
+ *
+ * UNPIN IS ALWAYS THERE, quiet until the tile is hovered or focused. A
+ * control that appears only on hover is one a touch screen never shows.
+ */
+export declare const PinTile: import("react").ForwardRefExoticComponent<PinTileProps & import("react").RefAttributes<HTMLDivElement>>;

package/dist/PinTile/index.d.ts

@@ -0,0 +1,3 @@
+import './PinTile.css';
+export { PinTile } from './PinTile.js';
+export type { PinTileProps } from './PinTile.js';

package/dist/PinTile/index.js

@@ -0,0 +1,4 @@
+export { PinTile } from '../chunk-6MIXD6IW.js';
+import '../chunk-4FQT6ZAY.js';
+import '../chunk-BZFWDIV6.js';
+import '../chunk-ODEQTPFM.js';

package/dist/PinTile-IIA25MNZ.css

@@ -0,0 +1,141 @@
+/*
+ * PinTile: one pinned thing, a link with its facts.
+ *
+ * A raised row rather than a card with a header: a shelf holds six of them,
+ * and six headed cards are six sections where the reader wanted six links.
+ */
+
+.crewlet-pin-tile {
+  position: relative;
+  display: flex;
+  align-items: center;
+  gap: var(--spacing-3);
+  min-width: 0;
+  min-height: 56px;
+  padding: var(--spacing-2) var(--spacing-2) var(--spacing-2) var(--spacing-3);
+  border: 1px solid var(--color-border-default);
+  border-radius: var(--radius-lg);
+  background: var(--color-surface-elevated);
+  transition: border-color var(--motion-duration-fast) var(--motion-easing-default),
+    background-color var(--motion-duration-fast) var(--motion-easing-default);
+}
+.crewlet-pin-tile:hover {
+  border-color: var(--color-border-hover);
+  background: var(--color-surface-hover);
+}
+.crewlet-pin-tile:has(.crewlet-pin-tile__handle) {
+  padding-inline-start: var(--spacing-1);
+}
+
+.crewlet-pin-tile[data-reorder='dragging'] {
+  border-style: dashed;
+  border-color: var(--color-brand-accent);
+  background: var(--color-brand-accent-soft);
+}
+.crewlet-pin-tile[data-reorder='dragging'] > * {
+  opacity: 0.35;
+}
+
+.crewlet-pin-tile__handle {
+  position: relative;
+  z-index: var(--z-index-raised);
+  flex-shrink: 0;
+  cursor: grab;
+  color: var(--color-text-tertiary);
+}
+
+.crewlet-pin-tile__leading {
+  display: inline-flex;
+  flex-shrink: 0;
+  color: var(--color-text-secondary);
+}
+
+.crewlet-pin-tile__body {
+  display: flex;
+  flex: 1 1 auto;
+  flex-direction: column;
+  gap: 2px;
+  min-width: 0;
+}
+
+.crewlet-pin-tile__head {
+  display: flex;
+  align-items: center;
+  gap: var(--spacing-2);
+  min-width: 0;
+}
+
+.crewlet-pin-tile__link {
+  overflow: hidden;
+  font-size: var(--font-size-sm);
+  font-weight: var(--font-weight-medium);
+  color: var(--color-text-primary);
+  text-decoration: none;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+/* The tile's whole area, as the link's. */
+.crewlet-pin-tile__link::after {
+  content: '';
+  position: absolute;
+  inset: 0;
+  border-radius: inherit;
+}
+.crewlet-pin-tile__link:focus-visible {
+  outline: 2px solid transparent;
+}
+/* The tile's ring, over its own edge, for the link that is its target. */
+.crewlet-pin-tile:has(.crewlet-pin-tile__link:focus-visible) {
+  outline: 2px solid var(--color-focus);
+  outline-offset: -1px;
+}
+
+.crewlet-pin-tile__status {
+  display: inline-flex;
+  flex-shrink: 0;
+}
+
+.crewlet-pin-tile__meta {
+  overflow: hidden;
+  font-size: var(--font-size-xs);
+  color: var(--color-text-secondary);
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.crewlet-pin-tile__kind {
+  color: var(--color-text-tertiary);
+}
+
+.crewlet-pin-tile__figure {
+  flex-shrink: 0;
+  font-size: var(--font-size-sm);
+  font-weight: var(--font-weight-semibold);
+  font-variant-numeric: tabular-nums;
+  color: var(--color-text-primary);
+}
+
+/* Above the stretched link, so it takes its own press. */
+.crewlet-pin-tile__unpin {
+  position: relative;
+  z-index: var(--z-index-raised);
+  flex-shrink: 0;
+  color: var(--color-brand-accent-ink);
+  opacity: 0.55;
+  transition: opacity var(--motion-duration-fast) var(--motion-easing-default);
+}
+.crewlet-pin-tile:hover .crewlet-pin-tile__unpin,
+.crewlet-pin-tile:focus-within .crewlet-pin-tile__unpin {
+  opacity: 1;
+}
+@media (hover: none) {
+  .crewlet-pin-tile__unpin {
+    opacity: 1;
+  }
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .crewlet-pin-tile,
+  .crewlet-pin-tile__unpin {
+    transition: none;
+  }
+}

package/dist/PresenceStack/index.js

@@ -2,8 +2,8 @@ export { PresenceStack } from '../chunk-YM3GJHGW.js';
 import '../chunk-CENOOTAV.js';
 import '../chunk-I6POAB4V.js';
 import '../chunk-S35G6PNC.js';
-import '../chunk-AYKXMIOR.js';
 import '../chunk-UAN5NE7M.js';
+import '../chunk-AYKXMIOR.js';
 import '../chunk-5OM447RW.js';
 import '../chunk-BZFWDIV6.js';
 import '../chunk-ODEQTPFM.js';

package/dist/PrincipalPicker/index.js

@@ -1,12 +1,12 @@
-export { PrincipalPicker } from '../chunk-3UAA4IWJ.js';
-import '../chunk-ZFH7H7GS.js';
+export { PrincipalPicker } from '../chunk-JEDWC3GI.js';
+import '../chunk-LOLELDBW.js';
 import '../chunk-F73MC7EZ.js';
-import '../chunk-4GB57WIT.js';
-import '../chunk-4FQT6ZAY.js';
-import '../chunk-R25RGPUB.js';
+import '../chunk-Q55TXPA3.js';
 import '../chunk-4KP4RC3O.js';
 import '../chunk-UAN5NE7M.js';
 import '../chunk-5OM447RW.js';
 import '../chunk-PQADV6P6.js';
+import '../chunk-R25RGPUB.js';
+import '../chunk-4FQT6ZAY.js';
 import '../chunk-BZFWDIV6.js';
 import '../chunk-ODEQTPFM.js';

package/dist/Reorder/index.d.ts

@@ -0,0 +1,2 @@
+export { useReorder, useReorderLists, moveKey, DEFAULT_REORDER_LABELS } from './useReorder.js';
+export type { Reorder, ReorderAxis, ReorderContainerProps, ReorderHandleProps, ReorderItemProps, ReorderLabels, ReorderLists, ReorderListsState, UseReorderListsOptions, UseReorderOptions, } from './useReorder.js';

package/dist/Reorder/index.js

@@ -0,0 +1,4 @@
+export { DEFAULT_REORDER_LABELS, moveKey, useReorder, useReorderLists } from '../chunk-XJ2QEBMM.js';
+import '../chunk-RSAQOKH3.js';
+import '../chunk-BZFWDIV6.js';
+import '../chunk-ODEQTPFM.js';

package/dist/Reorder/useReorder.d.ts

@@ -0,0 +1,138 @@
+import { type DragEvent, type KeyboardEvent } from 'react';
+/**
+ * How the arrow keys map to a move.
+ *
+ * - `vertical`: Up moves an item one place earlier, Down one place later. A
+ *   list.
+ * - `grid`: Left and Up move it one place earlier, Right and Down one place
+ *   later. A wrapping row of cards, where the reading order is the order and
+ *   "the card above" is not a position the list holds.
+ */
+export type ReorderAxis = 'vertical' | 'grid';
+export interface ReorderLabels {
+    /** What the handle does, and its NAME: "Move Projects". */
+    handle: (name: string) => string;
+    /** The instruction a handle is described by, for a reader who cannot drag. */
+    hint: string;
+    /** Said after every move, by any means: "Projects moved to position 2 of 6." */
+    moved: (name: string, position: number, total: number) => string;
+}
+export declare const DEFAULT_REORDER_LABELS: ReorderLabels;
+/** Several ordered lists, by the id of the container each one is drawn in. */
+export type ReorderLists<K extends string> = Readonly<Record<string, readonly K[]>>;
+export interface UseReorderListsOptions<K extends string> {
+    /** Every list as it stands. The hook never owns them. */
+    lists: ReorderLists<K>;
+    /** A finished move: a drop, an arrow key or a call to `move`. */
+    onReorder: (next: Record<string, K[]>) => void;
+    /** What a reader calls an item, for the handle's name and the announcement. */
+    nameOf: (key: K) => string;
+    /**
+     * Whether an item may be dropped into a list. Left out, every item goes
+     * anywhere. A page refuses a group inside a group here.
+     */
+    accepts?: ((key: K, list: string) => boolean) | undefined;
+    axis?: ReorderAxis | undefined;
+    labels?: Partial<ReorderLabels> | undefined;
+}
+export interface ReorderHandleProps {
+    draggable: true;
+    'aria-label': string;
+    'aria-describedby': string;
+    onDragStart: (event: DragEvent<HTMLElement>) => void;
+    onDragEnd: () => void;
+    onKeyDown: (event: KeyboardEvent<HTMLElement>) => void;
+}
+export interface ReorderItemProps {
+    ref: (node: HTMLElement | null) => void;
+    'data-reorder': 'dragging' | 'idle';
+    /** Set on the item another list's drag would land before, or after when it is the last. */
+    'data-reorder-target'?: 'before' | 'after' | undefined;
+    /**
+     * Which way the target's marker runs: `vertical` beside an item that shares
+     * its row, `horizontal` above or below one that spans the row.
+     */
+    'data-reorder-line'?: 'vertical' | 'horizontal' | undefined;
+    onDragOver: (event: DragEvent<HTMLElement>) => void;
+    onDrop: (event: DragEvent<HTMLElement>) => void;
+}
+export interface ReorderContainerProps {
+    'data-reorder-over'?: 'true' | undefined;
+    onDragOver: (event: DragEvent<HTMLElement>) => void;
+    onDrop: (event: DragEvent<HTMLElement>) => void;
+}
+export interface ReorderListsState<K extends string> {
+    /** The lists to DRAW: the caller's, or the preview while a drag is held. */
+    lists: Readonly<Record<string, readonly K[]>>;
+    /** The item being dragged, if any. */
+    dragging: K | null;
+    /** Spread on the control an item is moved BY. */
+    handleProps: (key: K) => ReorderHandleProps;
+    /** Spread on the element that holds the item, the one a drag passes over. */
+    itemProps: (key: K) => ReorderItemProps;
+    /**
+     * Spread on the element a list is drawn in. A drop in the gap between two
+     * items keeps the preview, and a drag over an EMPTY stretch of another list
+     * (an empty group, the space after its last item) moves the item to its end.
+     */
+    listProps: (list: string) => ReorderContainerProps;
+    /** Move an item by a number of places within its own list, clamped to the ends. */
+    move: (key: K, by: number) => void;
+    /** Move an item to the end of another list, by command (a menu's "Move to"). */
+    moveTo: (key: K, list: string) => void;
+    /** The id of the hidden instruction every handle is described by. */
+    hintId: string;
+    /** The instruction itself, for the caller to render once (`VisuallyHidden`). */
+    hint: string;
+}
+export interface UseReorderOptions<K extends string> {
+    keys: readonly K[];
+    onReorder: (next: K[]) => void;
+    nameOf: (key: K) => string;
+    axis?: ReorderAxis | undefined;
+    labels?: Partial<ReorderLabels> | undefined;
+}
+export interface Reorder<K extends string> {
+    order: readonly K[];
+    dragging: K | null;
+    handleProps: (key: K) => ReorderHandleProps;
+    itemProps: (key: K) => ReorderItemProps;
+    containerProps: ReorderContainerProps;
+    move: (key: K, by: number) => void;
+    hintId: string;
+    hint: string;
+}
+/** `keys` with `key` taken out and put back at `to`. */
+export declare function moveKey<K>(keys: readonly K[], key: K, to: number): K[];
+/**
+ * Reordering items within and between lists, by drag, by keyboard and by
+ * command, as one operation: the cards of a page and the cards inside each
+ * of its groups.
+ *
+ * ONE IMPLEMENTATION, because there were three. DataTable's column settings,
+ * the dashboard's priority list and its board each carried their own drag
+ * handlers, and only one of them could be reached from a keyboard. This hook
+ * is that one's rules, given to every list that can be put in order.
+ *
+ * THE HANDLE IS A CONTROL. It is what an item is dragged BY, it has a name
+ * ("Move Projects"), it takes focus, and the arrow keys move the item from
+ * there. Moving into another list by keyboard is `moveTo`, which a caller
+ * offers as a command ("Move to group"), because "the next list" is not a
+ * direction an arrow key names.
+ *
+ * THE CALLER OWNS THE LISTS. While a drag is held the hook draws a PREVIEW
+ * within the item's own list and MARKS where it would land in another one
+ * (`data-reorder-target` on the item it would precede, `data-reorder-over`
+ * on the list); a drop reports the new lists once, and a drag that ends
+ * anywhere else (Escape, outside every list) leaves them as they were.
+ *
+ * EVERY MOVE IS SAID, through the page's `Announcer`, and ITEMS GLIDE to
+ * their new place (a FLIP transform) unless the reader asked for reduced
+ * motion.
+ */
+export declare function useReorderLists<K extends string>({ lists, onReorder, nameOf, accepts, axis, labels: labelOverrides, }: UseReorderListsOptions<K>): ReorderListsState<K>;
+/**
+ * One list's reordering: `useReorderLists` over a single list, for the
+ * common case of a settings panel or a shelf.
+ */
+export declare function useReorder<K extends string>({ keys, onReorder, nameOf, axis, labels, }: UseReorderOptions<K>): Reorder<K>;

package/dist/ShareDialog/index.js

@@ -1,19 +1,19 @@
-export { ARTIFACT_ROLES, SHAREABLE_ROLES, ShareDialog, roleAtLeast } from '../chunk-2YR5ZPQ3.js';
+export { ARTIFACT_ROLES, SHAREABLE_ROLES, ShareDialog, roleAtLeast } from '../chunk-HTCJSUIZ.js';
 import '../chunk-FC4YTTFJ.js';
-import '../chunk-2TZATTIU.js';
-import '../chunk-F73MC7EZ.js';
 import '../chunk-W46LPU4R.js';
 import '../chunk-STJ7QBC3.js';
 import '../chunk-DTIW4CHZ.js';
+import '../chunk-7IJARUIF.js';
+import '../chunk-F73MC7EZ.js';
 import '../chunk-SVSCLHHI.js';
 import '../chunk-OG6CL3EB.js';
-import '../chunk-IG75YMUN.js';
-import '../chunk-4FQT6ZAY.js';
-import '../chunk-HMPFGIWM.js';
-import '../chunk-R25RGPUB.js';
 import '../chunk-4KP4RC3O.js';
 import '../chunk-UAN5NE7M.js';
 import '../chunk-5OM447RW.js';
 import '../chunk-PQADV6P6.js';
+import '../chunk-IG75YMUN.js';
+import '../chunk-HMPFGIWM.js';
+import '../chunk-R25RGPUB.js';
+import '../chunk-4FQT6ZAY.js';
 import '../chunk-BZFWDIV6.js';
 import '../chunk-ODEQTPFM.js';

package/dist/SheetGrid/index.js

@@ -1,18 +1,18 @@
-export { CellDisplay, CellEditor, CheckboxCell, DateCell, LongTextCell, MultiSelectCell, NumberCell, PersonCell, RatingCell, SelectCell, SheetCell, SheetGrid, StatusCell, TextCell, UrlCell } from '../chunk-FYXRWBJJ.js';
+export { CellDisplay, CellEditor, CheckboxCell, DateCell, LongTextCell, MultiSelectCell, NumberCell, PersonCell, RatingCell, SelectCell, SheetCell, SheetGrid, StatusCell, TextCell, UrlCell } from '../chunk-J2G4HGQM.js';
+import '../chunk-CENOOTAV.js';
 import '../chunk-GFV4LJHH.js';
 import '../chunk-WIATRXEJ.js';
-import '../chunk-CENOOTAV.js';
 import '../chunk-3BYIWOTV.js';
 import '../chunk-I6POAB4V.js';
 import '../chunk-PPAQFGS2.js';
 import '../chunk-YYZRLLLY.js';
 import '../chunk-S35G6PNC.js';
 import '../chunk-QWOPX2MN.js';
-import '../chunk-AYKXMIOR.js';
 import '../chunk-OG6CL3EB.js';
-import '../chunk-HMPFGIWM.js';
-import '../chunk-R25RGPUB.js';
 import '../chunk-UAN5NE7M.js';
+import '../chunk-AYKXMIOR.js';
 import '../chunk-5OM447RW.js';
+import '../chunk-HMPFGIWM.js';
+import '../chunk-R25RGPUB.js';
 import '../chunk-BZFWDIV6.js';
 import '../chunk-ODEQTPFM.js';

package/dist/StatGroup/StatGroup.d.ts

@@ -7,6 +7,12 @@ export interface StatGroupProps extends HTMLAttributes<HTMLDivElement> {
      * nothing to do with the numbers.
      */
     columns?: 2 | 3 | 4;
+    /**
+     * Inside another card: the row gives up its own surface, hairline and
+     * corner and keeps only the hairlines between its tiles, so a card holding
+     * it does not draw a box inside a box.
+     */
+    flush?: boolean | undefined;
     children?: ReactNode;
 }
 /**
@@ -17,4 +23,4 @@ export interface StatGroupProps extends HTMLAttributes<HTMLDivElement> {
  * md breakpoint it drops to two columns, which is the last count at which a
  * six-character number still fits on one line of a phone.
  */
-export declare function StatGroup({ columns, className, children, ...rest }: StatGroupProps): import("react").JSX.Element;
+export declare function StatGroup({ columns, flush, className, children, ...rest }: StatGroupProps): import("react").JSX.Element;

package/dist/StatGroup/index.js

@@ -1,2 +1,2 @@
-export { StatGroup } from '../chunk-QVAFL2LE.js';
+export { StatGroup } from '../chunk-JXRI5YD2.js';
 import '../chunk-ODEQTPFM.js';

package/dist/{StatGroup-HVG6O62W.css → StatGroup-PADTJCUQ.css}

@@ -20,6 +20,13 @@
   overflow: hidden;
 }
 
+/* Inside another card: the card's surface and edge are the row's. */
+.crewlet-stat-group--flush {
+  background: transparent;
+  border: 0;
+  border-radius: var(--radius-none);
+}
+
 /*
  * A tile inside the row brings no surface of its own, whether or not its
  * caller remembered `flush`. The group draws one card and the hairlines

package/dist/Switcher/index.js

@@ -1,16 +1,16 @@
-export { Switcher } from '../chunk-NZY77ZDU.js';
+export { Switcher } from '../chunk-7FQEUNHX.js';
 import '../chunk-W5J7R5EB.js';
-import '../chunk-2TZATTIU.js';
+import '../chunk-7IJARUIF.js';
 import '../chunk-F73MC7EZ.js';
-import '../chunk-FYTIJM2T.js';
-import '../chunk-4GB57WIT.js';
-import '../chunk-BWRGFKJP.js';
 import '../chunk-OG6CL3EB.js';
-import '../chunk-RSAQOKH3.js';
+import '../chunk-Q55TXPA3.js';
+import '../chunk-BWRGFKJP.js';
+import '../chunk-FYTIJM2T.js';
+import '../chunk-PQADV6P6.js';
 import '../chunk-IG75YMUN.js';
-import '../chunk-4FQT6ZAY.js';
 import '../chunk-HMPFGIWM.js';
 import '../chunk-R25RGPUB.js';
-import '../chunk-PQADV6P6.js';
+import '../chunk-RSAQOKH3.js';
+import '../chunk-4FQT6ZAY.js';
 import '../chunk-BZFWDIV6.js';
 import '../chunk-ODEQTPFM.js';