@boost33/ui 0.8.1 → 0.9.0

package/dist/components/Backdrop/BackdropHub.d.ts

@@ -0,0 +1,80 @@
+import { ElementType, MouseEvent, ReactNode } from 'react';
+import { BackdropPageAction } from './BackdropPage';
+export interface BackdropQuickActionProps {
+    /**
+     * The 20px icon inside the round tile (D17). Decorative: the label names the
+     * action, so the icon is not announced.
+     */
+    icon: ReactNode;
+    /** The words under the tile: "New campaign". */
+    label: ReactNode;
+    href?: string;
+    /** Called on a press, with the event (see BackdropAppCard's `onClick`). */
+    onClick?: (event: MouseEvent<HTMLElement>) => void;
+    /** The link element for a card with an href (ADR-0011). */
+    linkComponent?: ElementType;
+    className?: string;
+}
+export declare function BackdropQuickAction({ icon, label, href, onClick, linkComponent, className }: BackdropQuickActionProps): import("react").JSX.Element;
+export type BackdropAppCardLayout = 'inline' | 'stacked';
+export interface BackdropAppCardProps {
+    /** The app's 32px mark (ProductMark). Decorative: the name names the card. */
+    mark?: ReactNode;
+    /** The app's name, as identity serves it. */
+    name: ReactNode;
+    /**
+     * `inline` (default) is Day 20's one-line card, 56 tall, with the action in
+     * a fixed lane at the end. `stacked` is Day 1's 64, with the action under
+     * the name, where it reads as the next thing to do rather than a way in.
+     */
+    layout?: BackdropAppCardLayout;
+    /** A second line on a `stacked` card. */
+    description?: ReactNode;
+    /** The trailing words: "Open", "Set up", "Request access". A chevron follows. */
+    actionLabel?: ReactNode;
+    /** Anything before the action: a Soon tag, a count badge. */
+    trailing?: ReactNode;
+    href?: string;
+    /**
+     * Called on a press, with or without `href`; with one, the link still
+     * navigates. It gets the event so a host can tell a plain click from one that
+     * opens a new tab (a modifier key, the middle button) before it paints a
+     * launch screen over the page it is leaving.
+     */
+    onClick?: (event: MouseEvent<HTMLElement>) => void;
+    linkComponent?: ElementType;
+    className?: string;
+}
+export declare function BackdropAppCard({ mark, name, layout, description, actionLabel, trailing, href, onClick, linkComponent, className, }: BackdropAppCardProps): import("react").JSX.Element;
+export interface BackdropProfileStripProps {
+    /** The bold count: "Company profile 5 of 8". */
+    title: ReactNode;
+    /** 0–1, drawn in the 160px bar. */
+    progress: number;
+    /** The bar's accessible name: "Company profile, 5 of 8 done". */
+    progressLabel: string;
+    /** The muted line: "Missing: company size, website". One line; it truncates. */
+    description?: ReactNode;
+    /** The one action, drawn as the outline button. */
+    action?: BackdropPageAction;
+    linkComponent?: ElementType;
+    className?: string;
+}
+export declare function BackdropProfileStrip({ title, progress, progressLabel, description, action, linkComponent, className, }: BackdropProfileStripProps): import("react").JSX.Element;
+export interface BackdropMapCardProps {
+    /** The card's heading: "Events near you". */
+    title: ReactNode;
+    /** A trailing link in the header: "See all events". */
+    action?: BackdropPageAction;
+    /**
+     * The map, which belongs to the product: this package has no map provider
+     * and holds no place data. Drawn in a fixed band that clips it, so a map
+     * that arrives late or at the wrong size cannot move the card.
+     */
+    map: ReactNode;
+    /** One line under the map: the fact the map is there to support. */
+    caption?: ReactNode;
+    linkComponent?: ElementType;
+    className?: string;
+}
+export declare function BackdropMapCard({ title, action, map, caption, linkComponent, className }: BackdropMapCardProps): import("react").JSX.Element;

package/dist/components/Backdrop/BackdropHub.js

@@ -0,0 +1,92 @@
+import { jsxs as o, jsx as e } from "react/jsx-runtime";
+import a from "./BackdropHub.module.css.js";
+import { cx as t } from "./cx.js";
+import { ChevronRight as h } from "./icons.js";
+import { BackdropIconTile as v } from "./BackdropDisplay.js";
+import { BackdropProgress as f } from "./BackdropGlobalPanels.js";
+import { BackdropButton as B } from "./BackdropButton.js";
+import { BackdropCard as A, BackdropSectionHeader as b } from "./BackdropPage.js";
+function j({ icon: n, label: c, href: i, onClick: s, linkComponent: r = "a", className: p }) {
+  return /* @__PURE__ */ o(i !== void 0 ? r : "button", { ...i !== void 0 ? { href: i } : { type: "button" }, onClick: s, className: t(a.quickAction, p), children: [
+    /* @__PURE__ */ e(v, { size: "empty", shape: "circle", className: a.tile, children: n }),
+    /* @__PURE__ */ e("span", { className: a.quickActionLabel, children: c })
+  ] });
+}
+function q({
+  mark: n,
+  name: c,
+  layout: i = "inline",
+  description: s,
+  actionLabel: r,
+  trailing: p,
+  href: d,
+  onClick: m,
+  linkComponent: u = "a",
+  className: N
+}) {
+  const k = d !== void 0 ? u : "button", C = d !== void 0 ? { href: d } : { type: "button" }, l = i === "stacked";
+  return /* @__PURE__ */ o(
+    k,
+    {
+      ...C,
+      onClick: m,
+      className: t(a.appCard, l && a.appCardStacked, N),
+      children: [
+        n !== void 0 && /* @__PURE__ */ e("span", { className: a.appCardMark, "aria-hidden": "true", children: n }),
+        /* @__PURE__ */ o("span", { className: a.appCardText, children: [
+          /* @__PURE__ */ e("span", { className: a.appCardName, children: c }),
+          s !== void 0 && /* @__PURE__ */ e("span", { className: a.appCardDescription, children: s }),
+          l && r !== void 0 && /* @__PURE__ */ o("span", { className: a.appCardAction, children: [
+            r,
+            /* @__PURE__ */ e(h, { size: 14 })
+          ] })
+        ] }),
+        p,
+        !l && r !== void 0 && /* @__PURE__ */ o("span", { className: a.appCardAction, children: [
+          r,
+          /* @__PURE__ */ e(h, { size: 14 })
+        ] })
+      ]
+    }
+  );
+}
+function D({
+  title: n,
+  progress: c,
+  progressLabel: i,
+  description: s,
+  action: r,
+  linkComponent: p,
+  className: d
+}) {
+  return /* @__PURE__ */ o("div", { className: t(a.strip, d), children: [
+    /* @__PURE__ */ e("span", { className: a.stripTitle, children: n }),
+    /* @__PURE__ */ e("span", { className: a.stripBar, children: /* @__PURE__ */ e(f, { value: c, label: i }) }),
+    s !== void 0 && /* @__PURE__ */ e("span", { className: a.stripDescription, children: s }),
+    r && /* @__PURE__ */ e(
+      B,
+      {
+        variant: "outline",
+        size: "md",
+        href: r.href,
+        onClick: r.onClick,
+        linkComponent: p,
+        children: r.label
+      }
+    )
+  ] });
+}
+function M({ title: n, action: c, map: i, caption: s, linkComponent: r, className: p }) {
+  return /* @__PURE__ */ o(A, { padding: "none", className: t(a.mapCard, p), children: [
+    /* @__PURE__ */ e(b, { label: n, action: c, linkComponent: r }),
+    /* @__PURE__ */ e("div", { className: a.mapSlot, children: i }),
+    s !== void 0 && /* @__PURE__ */ e("p", { className: a.mapCaption, children: s })
+  ] });
+}
+export {
+  q as BackdropAppCard,
+  M as BackdropMapCard,
+  D as BackdropProfileStrip,
+  j as BackdropQuickAction
+};
+//# sourceMappingURL=BackdropHub.js.map

package/dist/components/Backdrop/BackdropHub.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BackdropHub.js","sources":["../../../src/components/Backdrop/BackdropHub.tsx"],"sourcesContent":["import type { ElementType, MouseEvent, ReactNode } from 'react'\nimport styles from './BackdropHub.module.css'\nimport { cx } from './cx'\nimport { ChevronRight } from './icons'\nimport { BackdropIconTile } from './BackdropDisplay'\nimport { BackdropProgress } from './BackdropGlobalPanels'\nimport { BackdropButton } from './BackdropButton'\nimport { BackdropCard, BackdropSectionHeader, type BackdropPageAction } from './BackdropPage'\n\n/*\n * Batch 5 · Hub. The four parts the Hub's home boards draw that nothing in the\n * package already covers: the quick-actions row, the app launcher card, the\n * completion strip and the map card.\n *\n * Stage A: static and presentational. An action is the package's\n * { label, onClick?, href? } shape so wiring is uniform later, and nothing here\n * holds state.\n *\n * Sizes are read from Hub Final \"Day 20\" and \"Day 1\" (Paper file\n * 01M70VHN0KBFJKNT6VD3DFE83K, page p-5-0) with get_computed_styles, except\n * where ADR-0017 fixes the value, which it wins.\n */\n\n/* ── Quick action ──────────────────────────────────────────────────────── */\n\nexport interface BackdropQuickActionProps {\n  /**\n   * The 20px icon inside the round tile (D17). Decorative: the label names the\n   * action, so the icon is not announced.\n   */\n  icon: ReactNode\n  /** The words under the tile: \"New campaign\". */\n  label: ReactNode\n  href?: string\n  /** Called on a press, with the event (see BackdropAppCard's `onClick`). */\n  onClick?: (event: MouseEvent<HTMLElement>) => void\n  /** The link element for a card with an href (ADR-0011). */\n  linkComponent?: ElementType\n  className?: string\n}\n\n/*\n * One column of the quick-actions row: a 48px round panel tile over a 13/18\n * label, 94 wide on both Hub home boards. The tile is BackdropIconTile's\n * `empty` size drawn round, the same 48 the empty state and the result screen\n * use (D12, Batch 2 gate), rather than a fourth tile size.\n */\nexport function BackdropQuickAction({ icon, label, href, onClick, linkComponent = 'a', className }: BackdropQuickActionProps) {\n  const Element: ElementType = href !== undefined ? linkComponent : 'button'\n  const elementProps = href !== undefined ? { href } : { type: 'button' as const }\n  return (\n    <Element {...elementProps} onClick={onClick} className={cx(styles.quickAction, className)}>\n      <BackdropIconTile size=\"empty\" shape=\"circle\" className={styles.tile}>\n        {icon}\n      </BackdropIconTile>\n      <span className={styles.quickActionLabel}>{label}</span>\n    </Element>\n  )\n}\n\n/* ── App card ──────────────────────────────────────────────────────────── */\n\nexport type BackdropAppCardLayout = 'inline' | 'stacked'\n\nexport interface BackdropAppCardProps {\n  /** The app's 32px mark (ProductMark). Decorative: the name names the card. */\n  mark?: ReactNode\n  /** The app's name, as identity serves it. */\n  name: ReactNode\n  /**\n   * `inline` (default) is Day 20's one-line card, 56 tall, with the action in\n   * a fixed lane at the end. `stacked` is Day 1's 64, with the action under\n   * the name, where it reads as the next thing to do rather than a way in.\n   */\n  layout?: BackdropAppCardLayout\n  /** A second line on a `stacked` card. */\n  description?: ReactNode\n  /** The trailing words: \"Open\", \"Set up\", \"Request access\". A chevron follows. */\n  actionLabel?: ReactNode\n  /** Anything before the action: a Soon tag, a count badge. */\n  trailing?: ReactNode\n  href?: string\n  /**\n   * Called on a press, with or without `href`; with one, the link still\n   * navigates. It gets the event so a host can tell a plain click from one that\n   * opens a new tab (a modifier key, the middle button) before it paints a\n   * launch screen over the page it is leaving.\n   */\n  onClick?: (event: MouseEvent<HTMLElement>) => void\n  linkComponent?: ElementType\n  className?: string\n}\n\n/*\n * One app in the Hub's Apps grid. The grid itself is the host's: the product\n * list is served, never hardcoded, so this draws one card and the page decides\n * how many columns they sit in.\n *\n * The trailing action keeps a fixed-width lane on an `inline` card so every\n * chevron in a grid lines up; a gap alone leaves them ragged against names of\n * different lengths.\n */\nexport function BackdropAppCard({\n  mark,\n  name,\n  layout = 'inline',\n  description,\n  actionLabel,\n  trailing,\n  href,\n  onClick,\n  linkComponent = 'a',\n  className,\n}: BackdropAppCardProps) {\n  const Element: ElementType = href !== undefined ? linkComponent : 'button'\n  const elementProps = href !== undefined ? { href } : { type: 'button' as const }\n  const stacked = layout === 'stacked'\n  return (\n    <Element\n      {...elementProps}\n      onClick={onClick}\n      className={cx(styles.appCard, stacked && styles.appCardStacked, className)}\n    >\n      {mark !== undefined && (\n        <span className={styles.appCardMark} aria-hidden=\"true\">\n          {mark}\n        </span>\n      )}\n      <span className={styles.appCardText}>\n        <span className={styles.appCardName}>{name}</span>\n        {description !== undefined && <span className={styles.appCardDescription}>{description}</span>}\n        {stacked && actionLabel !== undefined && (\n          <span className={styles.appCardAction}>\n            {actionLabel}\n            <ChevronRight size={14} />\n          </span>\n        )}\n      </span>\n      {trailing}\n      {!stacked && actionLabel !== undefined && (\n        <span className={styles.appCardAction}>\n          {actionLabel}\n          <ChevronRight size={14} />\n        </span>\n      )}\n    </Element>\n  )\n}\n\n/* ── Completion strip ──────────────────────────────────────────────────── */\n\nexport interface BackdropProfileStripProps {\n  /** The bold count: \"Company profile 5 of 8\". */\n  title: ReactNode\n  /** 0–1, drawn in the 160px bar. */\n  progress: number\n  /** The bar's accessible name: \"Company profile, 5 of 8 done\". */\n  progressLabel: string\n  /** The muted line: \"Missing: company size, website\". One line; it truncates. */\n  description?: ReactNode\n  /** The one action, drawn as the outline button. */\n  action?: BackdropPageAction\n  linkComponent?: ElementType\n  className?: string\n}\n\n/*\n * The strip at the foot of Hub Day 20: how far a long-running setup has got,\n * on one line, without the weight of a card. BackdropProgress draws the bar at\n * its default 6 height so the package keeps one bar, and the strip only fixes\n * its width.\n *\n * The board draws the action 36 tall with a 1px ink ring. D4 fixes button\n * heights at 32, 34, 40 and 44, so this takes the 34 (`md`) outline button and\n * the drawing is the thing that is out of date; it is in the batch report.\n */\nexport function BackdropProfileStrip({\n  title,\n  progress,\n  progressLabel,\n  description,\n  action,\n  linkComponent,\n  className,\n}: BackdropProfileStripProps) {\n  return (\n    <div className={cx(styles.strip, className)}>\n      <span className={styles.stripTitle}>{title}</span>\n      <span className={styles.stripBar}>\n        <BackdropProgress value={progress} label={progressLabel} />\n      </span>\n      {description !== undefined && <span className={styles.stripDescription}>{description}</span>}\n      {action && (\n        <BackdropButton\n          variant=\"outline\"\n          size=\"md\"\n          href={action.href}\n          onClick={action.onClick}\n          linkComponent={linkComponent}\n        >\n          {action.label}\n        </BackdropButton>\n      )}\n    </div>\n  )\n}\n\n/* ── Map card ──────────────────────────────────────────────────────────── */\n\nexport interface BackdropMapCardProps {\n  /** The card's heading: \"Events near you\". */\n  title: ReactNode\n  /** A trailing link in the header: \"See all events\". */\n  action?: BackdropPageAction\n  /**\n   * The map, which belongs to the product: this package has no map provider\n   * and holds no place data. Drawn in a fixed band that clips it, so a map\n   * that arrives late or at the wrong size cannot move the card.\n   */\n  map: ReactNode\n  /** One line under the map: the fact the map is there to support. */\n  caption?: ReactNode\n  linkComponent?: ElementType\n  className?: string\n}\n\n/*\n * A card whose body is a map. It is BackdropCard and BackdropSectionHeader with\n * one thing added that neither has: a fixed, clipping slot for a surface the\n * product draws. Without that slot every product sizes its own map and the\n * cards stop matching, which is the drift ADR-0017 exists to stop.\n */\nexport function BackdropMapCard({ title, action, map, caption, linkComponent, className }: BackdropMapCardProps) {\n  return (\n    <BackdropCard padding=\"none\" className={cx(styles.mapCard, className)}>\n      <BackdropSectionHeader label={title} action={action} linkComponent={linkComponent} />\n      <div className={styles.mapSlot}>{map}</div>\n      {caption !== undefined && <p className={styles.mapCaption}>{caption}</p>}\n    </BackdropCard>\n  )\n}\n"],"names":["BackdropQuickAction","icon","label","href","onClick","linkComponent","className","jsxs","cx","styles","jsx","BackdropIconTile","BackdropAppCard","mark","name","layout","description","actionLabel","trailing","Element","elementProps","stacked","ChevronRight","BackdropProfileStrip","title","progress","progressLabel","action","BackdropProgress","BackdropButton","BackdropMapCard","map","caption","BackdropCard","BackdropSectionHeader"],"mappings":"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"}

package/dist/components/Backdrop/BackdropHub.module.css.js

@@ -0,0 +1,40 @@
+const a = "_quickAction_acuka_3", p = "_quickActionLabel_acuka_21", t = "_tile_acuka_28", c = "_appCard_acuka_34", _ = "_appCardStacked_acuka_55", r = "_appCardMark_acuka_64", i = "_appCardText_acuka_73", o = "_appCardName_acuka_80", s = "_appCardDescription_acuka_89", n = "_appCardAction_acuka_103", k = "_strip_acuka_130", d = "_stripTitle_acuka_141", e = "_stripBar_acuka_148", C = "_stripDescription_acuka_153", u = "_mapCard_acuka_165", l = "_mapSlot_acuka_176", m = "_mapCaption_acuka_190", A = {
+  quickAction: a,
+  quickActionLabel: p,
+  tile: t,
+  appCard: c,
+  appCardStacked: _,
+  appCardMark: r,
+  appCardText: i,
+  appCardName: o,
+  appCardDescription: s,
+  appCardAction: n,
+  strip: k,
+  stripTitle: d,
+  stripBar: e,
+  stripDescription: C,
+  mapCard: u,
+  mapSlot: l,
+  mapCaption: m
+};
+export {
+  c as appCard,
+  n as appCardAction,
+  s as appCardDescription,
+  r as appCardMark,
+  o as appCardName,
+  _ as appCardStacked,
+  i as appCardText,
+  A as default,
+  m as mapCaption,
+  u as mapCard,
+  l as mapSlot,
+  a as quickAction,
+  p as quickActionLabel,
+  k as strip,
+  e as stripBar,
+  C as stripDescription,
+  d as stripTitle,
+  t as tile
+};
+//# sourceMappingURL=BackdropHub.module.css.js.map

package/dist/components/Backdrop/BackdropHub.module.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BackdropHub.module.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;"}

package/dist/components/Backdrop/BackdropLists.d.ts

@@ -0,0 +1,165 @@
+import { ElementType, HTMLAttributes, ReactNode } from 'react';
+/**
+ * `flat` (default): bare on the page, rows 4 from the edge (the boards'
+ * majority). `card`: inside a flat card (ADR-0017, D3), rows 12 from the card's
+ * inner edge, as the next-step action list draws them.
+ */
+export type BackdropListSurface = 'flat' | 'card';
+export interface BackdropListProps extends Omit<HTMLAttributes<HTMLUListElement>, 'children'> {
+    /** BackdropListRow elements. */
+    children: ReactNode;
+    surface?: BackdropListSurface;
+    /** The list's accessible name ("Matches", "Up next"), when no heading names it. */
+    label?: string;
+}
+/** A <ul> of BackdropListRow, a soft hairline between each two rows. */
+export declare function BackdropList({ children, surface, label, className, ...rest }: BackdropListProps): import("react").JSX.Element;
+export interface BackdropListRowProps {
+    /**
+     * The leading slot: a BackdropIconTile (36, the row tile), a BackdropAvatar
+     * (36), or nothing. A checkbox goes here too when the row is selectable.
+     */
+    leading?: ReactNode;
+    /** One line; truncates with an ellipsis. Names the row's link or button when it has one. */
+    title: ReactNode;
+    /** The muted second line: one fact ("3 new offers · closes in 4 days"). One line, truncates. */
+    description?: ReactNode;
+    /** A short muted fact after the text, fixed to the end: "2 h ago", "7 Nov". */
+    meta?: ReactNode;
+    /**
+     * Something in this row has not been seen yet (a conversation with a new
+     * message). Draws the 8px ink dot after `meta`, sets `meta` in ink 600, and
+     * gives the dot this text for screen readers, translated by the caller:
+     * "Unread". Without it the row draws no dot (Batch 4, N28).
+     */
+    unreadLabel?: string;
+    /** The row's status: a BackdropStatusMark (ADR-0017, Batch 3 gate). The boxed BackdropPill is for a page's or card's main status, not a row's. */
+    status?: ReactNode;
+    /** The trailing figure: tabular numerals, right-aligned ("€1,760", "−575"). */
+    value?: ReactNode;
+    /** A muted line under the value ("Expected", "saved a year"). */
+    valueCaption?: ReactNode;
+    /** The trailing action: a BackdropButton or BackdropOverflowMenu. Sits above the row's own target. */
+    action?: ReactNode;
+    /** A 16px chevron at the end, for a row that opens something. Decorative. */
+    chevron?: boolean;
+    /**
+     * The whole row opens a page: the title renders as a link (through
+     * `linkComponent`) whose hit area covers the row. The handler is Stage B's.
+     */
+    href?: string;
+    /** `button`: the whole row is a <button type="button"> (opens a side panel). Ignored with `href`. */
+    as?: 'button';
+    linkComponent?: ElementType;
+    /**
+     * This row is the one open beside the list (its side panel is showing):
+     * the panel grey, and `aria-current="true"` on the row's link or button.
+     */
+    current?: boolean;
+    /** This row is ticked (its leading checkbox carries the state): the panel grey only. */
+    selected?: boolean;
+    className?: string;
+}
+export declare function BackdropListRow({ leading, title, description, meta, unreadLabel, status, value, valueCaption, action, chevron, href, as, linkComponent: Link, current, selected, className, }: BackdropListRowProps): import("react").JSX.Element;
+/** One property: "Paid from" · "Monthly tokens", with an optional muted caption under the value. */
+export interface BackdropKeyValueItem {
+    key: string;
+    label: ReactNode;
+    value: ReactNode;
+    caption?: ReactNode;
+}
+/**
+ * `inline` (default): label left, value right, 13/20 (the side-panel boards).
+ * `stacked`: label above a 15/22 value, as Score Leads draws its facts.
+ */
+export type BackdropKeyValueLayout = 'inline' | 'stacked';
+export interface BackdropKeyValueListProps extends Omit<HTMLAttributes<HTMLDListElement>, 'children'> {
+    items: BackdropKeyValueItem[];
+    layout?: BackdropKeyValueLayout;
+    /** The list's accessible name ("Entry details"), when no heading names it. */
+    label?: string;
+}
+/** A <dl>: each pair is a <div> holding its <dt> and <dd>, which the HTML spec allows for styling. */
+export declare function BackdropKeyValueList({ items, layout, label, className, ...rest }: BackdropKeyValueListProps): import("react").JSX.Element;
+export type BackdropSortDirection = 'ascending' | 'descending';
+export interface BackdropDataTableColumn<Row> {
+    key: string;
+    /** The header's words. Short: "Company and need", "Commission". */
+    header: ReactNode;
+    /** `start` (default) or `end`. A `numeric` column defaults to `end`. */
+    align?: 'start' | 'end';
+    /** A fixed width as a CSS length, ideally a token (`var(--…)`). One column without a width takes the rest. */
+    width?: string;
+    /** The header becomes a sort button and the <th> carries `aria-sort`. */
+    sortable?: boolean;
+    /** Tabular numerals, aligned to the end unless `align` says otherwise. */
+    numeric?: boolean;
+    /** The cell. Without it the cell shows `row[key]`. */
+    cell?: (row: Row) => ReactNode;
+}
+/** What the first cell's content opens: a page (`link`) or a side panel (`button`). Stage B wires it. */
+export type BackdropDataTableRowTarget<Row> = {
+    kind: 'link';
+    href: (row: Row) => string;
+} | {
+    kind: 'button';
+};
+export interface BackdropDataTableSelection<Row> {
+    /** The keys of the ticked rows. */
+    selected: string[];
+    /** Each row checkbox's name: "Select Groupe Vivalyon". */
+    rowLabel: (row: Row) => string;
+    /** The header checkbox's name: "Select all". */
+    allLabel: string;
+}
+export interface BackdropDataTableProps<Row extends object> {
+    columns: BackdropDataTableColumn<Row>[];
+    rows: Row[];
+    rowKey: (row: Row) => string;
+    /** The table's name, in a visually hidden <caption> unless `showCaption`. */
+    caption: string;
+    showCaption?: boolean;
+    /** The column the rows are sorted by, and which way. Drawn, not performed: Stage A sorts nothing. */
+    sort?: {
+        key: string;
+        direction: BackdropSortDirection;
+    };
+    /** Adds the select column: a checkbox per row and a select-all in the header. */
+    selection?: BackdropDataTableSelection<Row>;
+    /** The first cell's content becomes the row's link or button; its hit area covers the row. */
+    rowTarget?: BackdropDataTableRowTarget<Row>;
+    /** The open row (its side panel is showing): the panel grey and `aria-current="true"` on its target. */
+    currentRowKey?: string;
+    /** Shown in place of the body when there are no rows: a BackdropEmptyState. */
+    empty?: ReactNode;
+    /** Skeleton rows in place of the body, and `aria-busy` on the table. */
+    loading?: boolean;
+    /** How many skeleton rows. Default 5. */
+    loadingRows?: number;
+    /** The header stays at the top of its scroll container. */
+    stickyHeader?: boolean;
+    linkComponent?: ElementType;
+    className?: string;
+}
+export declare function BackdropDataTable<Row extends object>({ columns, rows, rowKey, caption, showCaption, sort, selection, rowTarget, currentRowKey, empty, loading, loadingRows, stickyHeader, linkComponent: Link, className, }: BackdropDataTableProps<Row>): import("react").JSX.Element;
+export interface BackdropListToolbarProps {
+    /** The group's name ("People list tools"). */
+    label: string;
+    /** A BackdropSearchField at size="md" (34), level with the filter button. */
+    search?: ReactNode;
+    /** ONE BackdropFilterButton (ADR-0017, D11). */
+    filter?: ReactNode;
+    /** Quick toggle chips: BackdropChip, filter kind. Grouped and named by `chipsLabel`. */
+    chips?: ReactNode;
+    chipsLabel?: string;
+    /** The result count, formatted by the caller: "50 people". */
+    count?: ReactNode;
+    /** A BackdropSelect, appearance="pill". */
+    sort?: ReactNode;
+    /** A BackdropSegmented with icons (List | Board). */
+    view?: ReactNode;
+    /** Trailing actions: an outline "Import a list", an "Export CSV". The page's one orange stays in the header. */
+    actions?: ReactNode;
+    className?: string;
+}
+export declare function BackdropListToolbar({ label, search, filter, chips, chipsLabel, count, sort, view, actions, className }: BackdropListToolbarProps): import("react").JSX.Element;

package/dist/components/Backdrop/BackdropLists.js

@@ -0,0 +1,162 @@
+import { jsxs as c, jsx as a } from "react/jsx-runtime";
+import e from "./BackdropLists.module.css.js";
+import { cx as s } from "./cx.js";
+import { ArrowUp as V, ArrowDown as D, ChevronRight as R } from "./icons.js";
+import { BackdropCard as U } from "./BackdropPage.js";
+import { BackdropCheckbox as I } from "./BackdropPatterns.js";
+function z({ children: d, surface: t = "flat", label: o, className: i, ...h }) {
+  const l = /* @__PURE__ */ a("ul", { "aria-label": o, className: s(e.list, t === "card" && e.listInCard, t === "flat" && i), ...h, children: d });
+  return t === "card" ? /* @__PURE__ */ a(U, { surface: "flat", padding: "none", className: s(e.listCard, i), children: l }) : l;
+}
+function G({
+  leading: d,
+  title: t,
+  description: o,
+  meta: i,
+  unreadLabel: h,
+  status: l,
+  value: n,
+  valueCaption: p,
+  action: N,
+  chevron: b = !1,
+  href: u,
+  as: g,
+  linkComponent: L = "a",
+  current: k = !1,
+  selected: C = !1,
+  className: w
+}) {
+  const S = u !== void 0 || g === "button";
+  let y = t;
+  return u !== void 0 ? y = /* @__PURE__ */ a(L, { href: u, className: e.rowTarget, "aria-current": k ? "true" : void 0, children: t }) : g === "button" && (y = /* @__PURE__ */ a("button", { type: "button", className: e.rowTarget, "aria-current": k ? "true" : void 0, children: t })), /* @__PURE__ */ c(
+    "li",
+    {
+      className: s(e.row, S && e.rowInteractive, (k || C) && e.rowSelected, w),
+      "data-current": k || void 0,
+      "data-selected": C || void 0,
+      children: [
+        d != null && /* @__PURE__ */ a("span", { className: e.rowLeading, children: d }),
+        /* @__PURE__ */ c("span", { className: e.rowText, children: [
+          /* @__PURE__ */ a("span", { className: e.rowTitle, children: y }),
+          o != null && /* @__PURE__ */ a("span", { className: e.rowDescription, children: o })
+        ] }),
+        i != null && /* @__PURE__ */ a("span", { className: s(e.rowMeta, h !== void 0 && e.rowMetaUnread), children: i }),
+        h !== void 0 && /* @__PURE__ */ a("span", { className: e.rowUnread, children: /* @__PURE__ */ a("span", { className: e.srOnly, children: h }) }),
+        l != null && /* @__PURE__ */ a("span", { className: e.rowStatus, children: l }),
+        (n != null || p != null) && /* @__PURE__ */ c("span", { className: e.rowValue, children: [
+          n != null && /* @__PURE__ */ a("span", { className: e.rowFigure, children: n }),
+          p != null && /* @__PURE__ */ a("span", { className: e.rowValueCaption, children: p })
+        ] }),
+        N != null && /* @__PURE__ */ a("span", { className: e.rowAction, children: N }),
+        b && /* @__PURE__ */ a("span", { className: e.rowChevron, "aria-hidden": "true", children: /* @__PURE__ */ a(R, {}) })
+      ]
+    }
+  );
+}
+function H({ items: d, layout: t = "inline", label: o, className: i, ...h }) {
+  return /* @__PURE__ */ a(
+    "dl",
+    {
+      "aria-label": o,
+      className: s(e.kv, e.kvOpen, t === "stacked" ? e.kvStacked : e.kvInline, i),
+      ...h,
+      children: d.map((l) => /* @__PURE__ */ c("div", { className: e.kvRow, children: [
+        /* @__PURE__ */ a("dt", { className: e.kvLabel, children: l.label }),
+        /* @__PURE__ */ c("dd", { className: e.kvValue, children: [
+          /* @__PURE__ */ a("span", { className: e.kvFigure, children: l.value }),
+          l.caption != null && /* @__PURE__ */ a("span", { className: e.kvCaption, children: l.caption })
+        ] })
+      ] }, l.key))
+    }
+  );
+}
+function T(d) {
+  return d.align ?? (d.numeric ? "end" : "start");
+}
+function J({
+  columns: d,
+  rows: t,
+  rowKey: o,
+  caption: i,
+  showCaption: h = !1,
+  sort: l,
+  selection: n,
+  rowTarget: p,
+  currentRowKey: N,
+  empty: b,
+  loading: u = !1,
+  loadingRows: g = 5,
+  stickyHeader: L = !1,
+  linkComponent: k = "a",
+  className: C
+}) {
+  const w = n ? t.filter((r) => n.selected.includes(o(r))).length : 0, S = w === 0 ? !1 : w === t.length ? !0 : "mixed", y = d.length + (n ? 1 : 0), E = !u && t.length === 0 && b != null;
+  return /* @__PURE__ */ c("table", { className: s(e.table, L && e.tableSticky, p && e.tableInteractive, C), "aria-busy": u || void 0, children: [
+    /* @__PURE__ */ a("caption", { className: h ? e.caption : e.srOnly, children: i }),
+    /* @__PURE__ */ c("colgroup", { children: [
+      n && /* @__PURE__ */ a("col", { className: e.selectCol }),
+      d.map((r) => /* @__PURE__ */ a("col", { style: r.width ? { width: r.width } : void 0 }, r.key))
+    ] }),
+    /* @__PURE__ */ a("thead", { children: /* @__PURE__ */ c("tr", { children: [
+      n && /* @__PURE__ */ a("th", { scope: "col", className: s(e.th, e.selectCell), children: /* @__PURE__ */ a(I, { checked: S, label: n.allLabel, hideLabel: !0, disabled: t.length === 0 || u }) }),
+      d.map((r) => {
+        const m = (l == null ? void 0 : l.key) === r.key ? l.direction : void 0;
+        return /* @__PURE__ */ a(
+          "th",
+          {
+            scope: "col",
+            "aria-sort": r.sortable ? m ?? "none" : void 0,
+            className: s(e.th, T(r) === "end" && e.alignEnd),
+            children: r.sortable ? /* @__PURE__ */ c("button", { type: "button", className: s(e.sortButton, m && e.sortButtonActive), children: [
+              /* @__PURE__ */ a("span", { children: r.header }),
+              m && /* @__PURE__ */ a("span", { className: e.sortIcon, children: m === "ascending" ? /* @__PURE__ */ a(V, {}) : /* @__PURE__ */ a(D, {}) })
+            ] }) : r.header
+          },
+          r.key
+        );
+      })
+    ] }) }),
+    /* @__PURE__ */ c("tbody", { children: [
+      u && Array.from({ length: g }, (r, m) => /* @__PURE__ */ c("tr", { className: e.tr, "aria-hidden": "true", "data-loading": "true", children: [
+        n && /* @__PURE__ */ a("td", { className: s(e.td, e.selectCell) }),
+        d.map((v) => /* @__PURE__ */ a("td", { className: s(e.td, T(v) === "end" && e.alignEnd), children: /* @__PURE__ */ a("span", { className: e.skeleton }) }, v.key))
+      ] }, `loading-${m}`)),
+      E && /* @__PURE__ */ a("tr", { children: /* @__PURE__ */ a("td", { colSpan: y, className: e.emptyCell, children: b }) }),
+      !u && t.map((r) => {
+        const m = o(r), v = (n == null ? void 0 : n.selected.includes(m)) ?? !1, B = N === m;
+        return /* @__PURE__ */ c("tr", { className: s(e.tr, (v || B) && e.trSelected), "data-selected": v || void 0, "data-current": B || void 0, children: [
+          n && /* @__PURE__ */ a("td", { className: s(e.td, e.selectCell), children: /* @__PURE__ */ a(I, { checked: v, label: n.rowLabel(r), hideLabel: !0 }) }),
+          d.map((f, O) => {
+            const x = f.cell ? f.cell(r) : r[f.key];
+            let A = x;
+            return O === 0 && p && (A = p.kind === "link" ? /* @__PURE__ */ a(k, { href: p.href(r), className: e.cellTarget, "aria-current": B ? "true" : void 0, children: x }) : /* @__PURE__ */ a("button", { type: "button", className: e.cellTarget, "aria-current": B ? "true" : void 0, children: x })), /* @__PURE__ */ a("td", { className: s(e.td, T(f) === "end" && e.alignEnd, f.numeric && e.numeric), children: A }, f.key);
+          })
+        ] }, m);
+      })
+    ] })
+  ] });
+}
+function K({ label: d, search: t, filter: o, chips: i, chipsLabel: h, count: l, sort: n, view: p, actions: N, className: b }) {
+  const u = l != null || n != null || p != null || N != null;
+  return /* @__PURE__ */ c("div", { role: "group", "aria-label": d, className: s(e.toolbar, b), children: [
+    /* @__PURE__ */ c("div", { className: e.toolbarLead, children: [
+      t != null && /* @__PURE__ */ a("div", { className: e.toolbarSearch, children: t }),
+      o,
+      i != null && /* @__PURE__ */ a("div", { role: "group", "aria-label": h, className: e.toolbarChips, children: i })
+    ] }),
+    u && /* @__PURE__ */ c("div", { className: e.toolbarTrail, children: [
+      l != null && /* @__PURE__ */ a("span", { className: e.toolbarCount, children: l }),
+      n,
+      p,
+      N
+    ] })
+  ] });
+}
+export {
+  J as BackdropDataTable,
+  H as BackdropKeyValueList,
+  z as BackdropList,
+  G as BackdropListRow,
+  K as BackdropListToolbar
+};
+//# sourceMappingURL=BackdropLists.js.map

package/dist/components/Backdrop/BackdropLists.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BackdropLists.js","sources":["../../../src/components/Backdrop/BackdropLists.tsx"],"sourcesContent":["import type { CSSProperties, ElementType, HTMLAttributes, ReactNode } from 'react'\nimport styles from './BackdropLists.module.css'\nimport { cx } from './cx'\nimport { ArrowDown, ArrowUp, ChevronRight } from './icons'\nimport { BackdropCard } from './BackdropPage'\nimport { BackdropCheckbox } from './BackdropPatterns'\n\n/*\n * Batch 3 · Lists (N17–N20). Stage A: static and presentational. Nothing here\n * sorts, filters, selects or navigates: the story passes the state (the sort\n * column and direction, the ticked rows, the open row) as props, and the\n * handlers are Stage B's. What opens something is already the right element\n * (a link through `linkComponent`, or a <button type=\"button\">), never a\n * clickable <div>, so Stage B adds a handler and changes no markup.\n *\n *   List / ListRow    the one flexible row: leading tile or avatar, a title\n *                     and a muted second line, then meta, status, a value and\n *                     a trailing action. Hairlines between rows; bare or in a\n *                     card.\n *   KeyValueList      property rows as a <dl>: label and value side by side\n *                     or stacked, with hairlines between rows.\n *   DataTable         a real <table>: one header style, sortable headers,\n *                     a select column, a row target, empty and loading.\n *   ListToolbar       the bar above a list or table. It composes the\n *                     existing controls and draws none of its own.\n *\n * No product nouns: rows and columns are data, cells are ReactNode. Status in\n * a row is a slot; this module draws no status dot or check of its own.\n */\n\n/* ── N17 · List and list row ───────────────────────────────────────────── */\n\n/**\n * `flat` (default): bare on the page, rows 4 from the edge (the boards'\n * majority). `card`: inside a flat card (ADR-0017, D3), rows 12 from the card's\n * inner edge, as the next-step action list draws them.\n */\nexport type BackdropListSurface = 'flat' | 'card'\n\nexport interface BackdropListProps extends Omit<HTMLAttributes<HTMLUListElement>, 'children'> {\n  /** BackdropListRow elements. */\n  children: ReactNode\n  surface?: BackdropListSurface\n  /** The list's accessible name (\"Matches\", \"Up next\"), when no heading names it. */\n  label?: string\n}\n\n/** A <ul> of BackdropListRow, a soft hairline between each two rows. */\nexport function BackdropList({ children, surface = 'flat', label, className, ...rest }: BackdropListProps) {\n  const list = (\n    <ul aria-label={label} className={cx(styles.list, surface === 'card' && styles.listInCard, surface === 'flat' && className)} {...rest}>\n      {children}\n    </ul>\n  )\n  if (surface === 'card') {\n    return (\n      <BackdropCard surface=\"flat\" padding=\"none\" className={cx(styles.listCard, className)}>\n        {list}\n      </BackdropCard>\n    )\n  }\n  return list\n}\n\nexport interface BackdropListRowProps {\n  /**\n   * The leading slot: a BackdropIconTile (36, the row tile), a BackdropAvatar\n   * (36), or nothing. A checkbox goes here too when the row is selectable.\n   */\n  leading?: ReactNode\n  /** One line; truncates with an ellipsis. Names the row's link or button when it has one. */\n  title: ReactNode\n  /** The muted second line: one fact (\"3 new offers · closes in 4 days\"). One line, truncates. */\n  description?: ReactNode\n  /** A short muted fact after the text, fixed to the end: \"2 h ago\", \"7 Nov\". */\n  meta?: ReactNode\n  /**\n   * Something in this row has not been seen yet (a conversation with a new\n   * message). Draws the 8px ink dot after `meta`, sets `meta` in ink 600, and\n   * gives the dot this text for screen readers, translated by the caller:\n   * \"Unread\". Without it the row draws no dot (Batch 4, N28).\n   */\n  unreadLabel?: string\n  /** The row's status: a BackdropStatusMark (ADR-0017, Batch 3 gate). The boxed BackdropPill is for a page's or card's main status, not a row's. */\n  status?: ReactNode\n  /** The trailing figure: tabular numerals, right-aligned (\"€1,760\", \"−575\"). */\n  value?: ReactNode\n  /** A muted line under the value (\"Expected\", \"saved a year\"). */\n  valueCaption?: ReactNode\n  /** The trailing action: a BackdropButton or BackdropOverflowMenu. Sits above the row's own target. */\n  action?: ReactNode\n  /** A 16px chevron at the end, for a row that opens something. Decorative. */\n  chevron?: boolean\n  /**\n   * The whole row opens a page: the title renders as a link (through\n   * `linkComponent`) whose hit area covers the row. The handler is Stage B's.\n   */\n  href?: string\n  /** `button`: the whole row is a <button type=\"button\"> (opens a side panel). Ignored with `href`. */\n  as?: 'button'\n  linkComponent?: ElementType\n  /**\n   * This row is the one open beside the list (its side panel is showing):\n   * the panel grey, and `aria-current=\"true\"` on the row's link or button.\n   */\n  current?: boolean\n  /** This row is ticked (its leading checkbox carries the state): the panel grey only. */\n  selected?: boolean\n  className?: string\n}\n\n/*\n * One row, every drawn variant. When the row has a target, the title is the\n * link or button and its ::after stretches over the row, so the hit area is\n * the whole row while the accessible name stays the title. Anything else in\n * the row that is itself a control (the trailing action, a checkbox) is lifted\n * above that layer and keeps its own click.\n */\nexport function BackdropListRow({\n  leading,\n  title,\n  description,\n  meta,\n  unreadLabel,\n  status,\n  value,\n  valueCaption,\n  action,\n  chevron = false,\n  href,\n  as,\n  linkComponent: Link = 'a',\n  current = false,\n  selected = false,\n  className,\n}: BackdropListRowProps) {\n  const interactive = href !== undefined || as === 'button'\n  let titleNode: ReactNode = title\n  if (href !== undefined) {\n    titleNode = (\n      <Link href={href} className={styles.rowTarget} aria-current={current ? 'true' : undefined}>\n        {title}\n      </Link>\n    )\n  } else if (as === 'button') {\n    titleNode = (\n      <button type=\"button\" className={styles.rowTarget} aria-current={current ? 'true' : undefined}>\n        {title}\n      </button>\n    )\n  }\n  return (\n    <li\n      className={cx(styles.row, interactive && styles.rowInteractive, (current || selected) && styles.rowSelected, className)}\n      data-current={current || undefined}\n      data-selected={selected || undefined}\n    >\n      {leading != null && <span className={styles.rowLeading}>{leading}</span>}\n      <span className={styles.rowText}>\n        <span className={styles.rowTitle}>{titleNode}</span>\n        {description != null && <span className={styles.rowDescription}>{description}</span>}\n      </span>\n      {meta != null && <span className={cx(styles.rowMeta, unreadLabel !== undefined && styles.rowMetaUnread)}>{meta}</span>}\n      {unreadLabel !== undefined && (\n        <span className={styles.rowUnread}>\n          <span className={styles.srOnly}>{unreadLabel}</span>\n        </span>\n      )}\n      {status != null && <span className={styles.rowStatus}>{status}</span>}\n      {(value != null || valueCaption != null) && (\n        <span className={styles.rowValue}>\n          {value != null && <span className={styles.rowFigure}>{value}</span>}\n          {valueCaption != null && <span className={styles.rowValueCaption}>{valueCaption}</span>}\n        </span>\n      )}\n      {action != null && <span className={styles.rowAction}>{action}</span>}\n      {chevron && (\n        <span className={styles.rowChevron} aria-hidden=\"true\">\n          <ChevronRight />\n        </span>\n      )}\n    </li>\n  )\n}\n\n/* ── N18 · Key-value list ──────────────────────────────────────────────── */\n\n/** One property: \"Paid from\" · \"Monthly tokens\", with an optional muted caption under the value. */\nexport interface BackdropKeyValueItem {\n  key: string\n  label: ReactNode\n  value: ReactNode\n  caption?: ReactNode\n}\n\n/**\n * `inline` (default): label left, value right, 13/20 (the side-panel boards).\n * `stacked`: label above a 15/22 value, as Score Leads draws its facts.\n */\nexport type BackdropKeyValueLayout = 'inline' | 'stacked'\n\nexport interface BackdropKeyValueListProps extends Omit<HTMLAttributes<HTMLDListElement>, 'children'> {\n  items: BackdropKeyValueItem[]\n  layout?: BackdropKeyValueLayout\n  /** The list's accessible name (\"Entry details\"), when no heading names it. */\n  label?: string\n}\n\n/** A <dl>: each pair is a <div> holding its <dt> and <dd>, which the HTML spec allows for styling. */\nexport function BackdropKeyValueList({ items, layout = 'inline', label, className, ...rest }: BackdropKeyValueListProps) {\n  return (\n    <dl\n      aria-label={label}\n      className={cx(styles.kv, styles.kvOpen, layout === 'stacked' ? styles.kvStacked : styles.kvInline, className)}\n      {...rest}\n    >\n      {items.map((item) => (\n        <div key={item.key} className={styles.kvRow}>\n          <dt className={styles.kvLabel}>{item.label}</dt>\n          <dd className={styles.kvValue}>\n            <span className={styles.kvFigure}>{item.value}</span>\n            {item.caption != null && <span className={styles.kvCaption}>{item.caption}</span>}\n          </dd>\n        </div>\n      ))}\n    </dl>\n  )\n}\n\n/* ── N19 · Data table ──────────────────────────────────────────────────── */\n\nexport type BackdropSortDirection = 'ascending' | 'descending'\n\nexport interface BackdropDataTableColumn<Row> {\n  key: string\n  /** The header's words. Short: \"Company and need\", \"Commission\". */\n  header: ReactNode\n  /** `start` (default) or `end`. A `numeric` column defaults to `end`. */\n  align?: 'start' | 'end'\n  /** A fixed width as a CSS length, ideally a token (`var(--…)`). One column without a width takes the rest. */\n  width?: string\n  /** The header becomes a sort button and the <th> carries `aria-sort`. */\n  sortable?: boolean\n  /** Tabular numerals, aligned to the end unless `align` says otherwise. */\n  numeric?: boolean\n  /** The cell. Without it the cell shows `row[key]`. */\n  cell?: (row: Row) => ReactNode\n}\n\n/** What the first cell's content opens: a page (`link`) or a side panel (`button`). Stage B wires it. */\nexport type BackdropDataTableRowTarget<Row> = { kind: 'link'; href: (row: Row) => string } | { kind: 'button' }\n\nexport interface BackdropDataTableSelection<Row> {\n  /** The keys of the ticked rows. */\n  selected: string[]\n  /** Each row checkbox's name: \"Select Groupe Vivalyon\". */\n  rowLabel: (row: Row) => string\n  /** The header checkbox's name: \"Select all\". */\n  allLabel: string\n}\n\nexport interface BackdropDataTableProps<Row extends object> {\n  columns: BackdropDataTableColumn<Row>[]\n  rows: Row[]\n  rowKey: (row: Row) => string\n  /** The table's name, in a visually hidden <caption> unless `showCaption`. */\n  caption: string\n  showCaption?: boolean\n  /** The column the rows are sorted by, and which way. Drawn, not performed: Stage A sorts nothing. */\n  sort?: { key: string; direction: BackdropSortDirection }\n  /** Adds the select column: a checkbox per row and a select-all in the header. */\n  selection?: BackdropDataTableSelection<Row>\n  /** The first cell's content becomes the row's link or button; its hit area covers the row. */\n  rowTarget?: BackdropDataTableRowTarget<Row>\n  /** The open row (its side panel is showing): the panel grey and `aria-current=\"true\"` on its target. */\n  currentRowKey?: string\n  /** Shown in place of the body when there are no rows: a BackdropEmptyState. */\n  empty?: ReactNode\n  /** Skeleton rows in place of the body, and `aria-busy` on the table. */\n  loading?: boolean\n  /** How many skeleton rows. Default 5. */\n  loadingRows?: number\n  /** The header stays at the top of its scroll container. */\n  stickyHeader?: boolean\n  linkComponent?: ElementType\n  className?: string\n}\n\nfunction alignOf<Row>(column: BackdropDataTableColumn<Row>): 'start' | 'end' {\n  return column.align ?? (column.numeric ? 'end' : 'start')\n}\n\n/*\n * One header style, the majority of the Final boards' tables: 36 tall, 12/500\n * in the muted grey, a hairline under it, no ground (Wallet History, Brokers\n * Opportunities, Financing applications x2). Outbound People draws 13/500 and\n * Content 13/400; those are the drawings that are out of date.\n */\nexport function BackdropDataTable<Row extends object>({\n  columns,\n  rows,\n  rowKey,\n  caption,\n  showCaption = false,\n  sort,\n  selection,\n  rowTarget,\n  currentRowKey,\n  empty,\n  loading = false,\n  loadingRows = 5,\n  stickyHeader = false,\n  linkComponent: Link = 'a',\n  className,\n}: BackdropDataTableProps<Row>) {\n  const selectedCount = selection ? rows.filter((row) => selection.selected.includes(rowKey(row))).length : 0\n  const allState: boolean | 'mixed' = selectedCount === 0 ? false : selectedCount === rows.length ? true : 'mixed'\n  const span = columns.length + (selection ? 1 : 0)\n  const showEmpty = !loading && rows.length === 0 && empty != null\n\n  return (\n    <table className={cx(styles.table, stickyHeader && styles.tableSticky, rowTarget && styles.tableInteractive, className)} aria-busy={loading || undefined}>\n      <caption className={showCaption ? styles.caption : styles.srOnly}>{caption}</caption>\n      <colgroup>\n        {selection && <col className={styles.selectCol} />}\n        {columns.map((column) => (\n          <col key={column.key} style={column.width ? ({ width: column.width } as CSSProperties) : undefined} />\n        ))}\n      </colgroup>\n      <thead>\n        <tr>\n          {selection && (\n            <th scope=\"col\" className={cx(styles.th, styles.selectCell)}>\n              <BackdropCheckbox checked={allState} label={selection.allLabel} hideLabel disabled={rows.length === 0 || loading} />\n            </th>\n          )}\n          {columns.map((column) => {\n            const sorted = sort?.key === column.key ? sort.direction : undefined\n            return (\n              <th\n                key={column.key}\n                scope=\"col\"\n                aria-sort={column.sortable ? (sorted ?? 'none') : undefined}\n                className={cx(styles.th, alignOf(column) === 'end' && styles.alignEnd)}\n              >\n                {column.sortable ? (\n                  <button type=\"button\" className={cx(styles.sortButton, sorted && styles.sortButtonActive)}>\n                    <span>{column.header}</span>\n                    {sorted && <span className={styles.sortIcon}>{sorted === 'ascending' ? <ArrowUp /> : <ArrowDown />}</span>}\n                  </button>\n                ) : (\n                  column.header\n                )}\n              </th>\n            )\n          })}\n        </tr>\n      </thead>\n      <tbody>\n        {loading &&\n          Array.from({ length: loadingRows }, (_, i) => (\n            <tr key={`loading-${i}`} className={styles.tr} aria-hidden=\"true\" data-loading=\"true\">\n              {selection && <td className={cx(styles.td, styles.selectCell)} />}\n              {columns.map((column) => (\n                <td key={column.key} className={cx(styles.td, alignOf(column) === 'end' && styles.alignEnd)}>\n                  <span className={styles.skeleton} />\n                </td>\n              ))}\n            </tr>\n          ))}\n        {showEmpty && (\n          <tr>\n            <td colSpan={span} className={styles.emptyCell}>\n              {empty}\n            </td>\n          </tr>\n        )}\n        {!loading &&\n          rows.map((row) => {\n            const key = rowKey(row)\n            const ticked = selection?.selected.includes(key) ?? false\n            const current = currentRowKey === key\n            return (\n              <tr key={key} className={cx(styles.tr, (ticked || current) && styles.trSelected)} data-selected={ticked || undefined} data-current={current || undefined}>\n                {selection && (\n                  <td className={cx(styles.td, styles.selectCell)}>\n                    <BackdropCheckbox checked={ticked} label={selection.rowLabel(row)} hideLabel />\n                  </td>\n                )}\n                {columns.map((column, index) => {\n                  const content = column.cell ? column.cell(row) : ((row as Record<string, unknown>)[column.key] as ReactNode)\n                  let body: ReactNode = content\n                  if (index === 0 && rowTarget) {\n                    body =\n                      rowTarget.kind === 'link' ? (\n                        <Link href={rowTarget.href(row)} className={styles.cellTarget} aria-current={current ? 'true' : undefined}>\n                          {content}\n                        </Link>\n                      ) : (\n                        <button type=\"button\" className={styles.cellTarget} aria-current={current ? 'true' : undefined}>\n                          {content}\n                        </button>\n                      )\n                  }\n                  return (\n                    <td key={column.key} className={cx(styles.td, alignOf(column) === 'end' && styles.alignEnd, column.numeric && styles.numeric)}>\n                      {body}\n                    </td>\n                  )\n                })}\n              </tr>\n            )\n          })}\n      </tbody>\n    </table>\n  )\n}\n\n/* ── N20 · List toolbar ────────────────────────────────────────────────── */\n\nexport interface BackdropListToolbarProps {\n  /** The group's name (\"People list tools\"). */\n  label: string\n  /** A BackdropSearchField at size=\"md\" (34), level with the filter button. */\n  search?: ReactNode\n  /** ONE BackdropFilterButton (ADR-0017, D11). */\n  filter?: ReactNode\n  /** Quick toggle chips: BackdropChip, filter kind. Grouped and named by `chipsLabel`. */\n  chips?: ReactNode\n  chipsLabel?: string\n  /** The result count, formatted by the caller: \"50 people\". */\n  count?: ReactNode\n  /** A BackdropSelect, appearance=\"pill\". */\n  sort?: ReactNode\n  /** A BackdropSegmented with icons (List | Board). */\n  view?: ReactNode\n  /** Trailing actions: an outline \"Import a list\", an \"Export CSV\". The page's one orange stays in the header. */\n  actions?: ReactNode\n  className?: string\n}\n\n/*\n * Leading cluster: search, filter, chips. Trailing cluster, pushed to the end:\n * count, sort, view, actions. Both wrap, so a narrow sheet stacks the clusters\n * rather than squeezing a control. 10 between controls, as Outbound People\n * draws it.\n */\nexport function BackdropListToolbar({ label, search, filter, chips, chipsLabel, count, sort, view, actions, className }: BackdropListToolbarProps) {\n  const trailing = count != null || sort != null || view != null || actions != null\n  return (\n    <div role=\"group\" aria-label={label} className={cx(styles.toolbar, className)}>\n      <div className={styles.toolbarLead}>\n        {search != null && <div className={styles.toolbarSearch}>{search}</div>}\n        {filter}\n        {chips != null && (\n          <div role=\"group\" aria-label={chipsLabel} className={styles.toolbarChips}>\n            {chips}\n          </div>\n        )}\n      </div>\n      {trailing && (\n        <div className={styles.toolbarTrail}>\n          {count != null && <span className={styles.toolbarCount}>{count}</span>}\n          {sort}\n          {view}\n          {actions}\n        </div>\n      )}\n    </div>\n  )\n}\n"],"names":["BackdropList","children","surface","label","className","rest","list","jsx","cx","styles","BackdropCard","BackdropListRow","leading","title","description","meta","unreadLabel","status","value","valueCaption","action","chevron","href","as","Link","current","selected","interactive","titleNode","jsxs","ChevronRight","BackdropKeyValueList","items","layout","item","alignOf","column","BackdropDataTable","columns","rows","rowKey","caption","showCaption","sort","selection","rowTarget","currentRowKey","empty","loading","loadingRows","stickyHeader","selectedCount","row","allState","span","showEmpty","BackdropCheckbox","sorted","ArrowUp","ArrowDown","_","i","key","ticked","index","content","body","BackdropListToolbar","search","filter","chips","chipsLabel","count","view","actions","trailing"],"mappings":"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"}