@ai-matrx/design-system 0.86.349 → 0.86.351

package/dist/controls.css

@@ -294,6 +294,18 @@
   .matrx-control-button[data-variant="link"]:hover:not(:disabled) {
     text-decoration: underline !important;
   }
+  /* meta: a section heading's own action ("Edit" beside "Pinned") — the heading's 11px/500 meta
+     text, muted ink, full ink on hover, a tight inset. Same box, same half-gap. */
+  .matrx-control-button[data-variant="meta"] {
+    padding-inline: 0.375rem !important;
+    color: hsl(var(--muted-foreground)) !important;
+    font-size: var(--matrx-control-meta) !important;
+    font-weight: 500 !important;
+  }
+  .matrx-control-button[data-variant="meta"]:hover:not(:disabled) {
+    background-color: hsl(var(--muted)) !important;
+    color: hsl(var(--foreground)) !important;
+  }
   /* PRESSED (Button pressed): a toggle in a set. On = a primary tint with a primary
      hairline (the old accent gray, rgb 239,239,240, vanished on tinted cards; pinned in
      pressed-contrast.test.ts), full ink; off = no fill, quiet ink. Out-ranks the
@@ -1008,24 +1020,24 @@
     border-color: hsl(var(--chip-tone) / 0.3) !important;
     color: hsl(var(--chip-ink, var(--chip-tone))) !important;
   }
-  :is(.matrx-control-chip, .matrx-tile)[data-tone="primary"] { --chip-tone: var(--primary); --chip-ink: var(--primary-ink); }
-  :is(.matrx-control-chip, .matrx-tile)[data-tone="success"] { --chip-tone: var(--success); --chip-ink: var(--success-ink); }
-  :is(.matrx-control-chip, .matrx-tile)[data-tone="destructive"] { --chip-tone: var(--destructive); --chip-ink: var(--destructive-ink); }
-  :is(.matrx-control-chip, .matrx-tile)[data-tone="info"] { --chip-tone: var(--info); --chip-ink: var(--info-ink); }
-  :is(.matrx-control-chip, .matrx-tile)[data-tone="warning"] { --chip-tone: var(--matrx-chip-amber); --chip-ink: var(--matrx-chip-amber-ink); }
-  :is(.matrx-control-chip, .matrx-tile)[data-tone="sky"] { --chip-tone: var(--matrx-chip-sky); --chip-ink: var(--matrx-chip-sky-ink); }
-  :is(.matrx-control-chip, .matrx-tile)[data-tone="blue"] { --chip-tone: var(--matrx-chip-blue); --chip-ink: var(--matrx-chip-blue-ink); }
-  :is(.matrx-control-chip, .matrx-tile)[data-tone="indigo"] { --chip-tone: var(--matrx-chip-indigo); --chip-ink: var(--matrx-chip-indigo-ink); }
-  :is(.matrx-control-chip, .matrx-tile)[data-tone="violet"] { --chip-tone: var(--matrx-chip-violet); --chip-ink: var(--matrx-chip-violet-ink); }
-  :is(.matrx-control-chip, .matrx-tile)[data-tone="fuchsia"] { --chip-tone: var(--matrx-chip-fuchsia); --chip-ink: var(--matrx-chip-fuchsia-ink); }
-  :is(.matrx-control-chip, .matrx-tile)[data-tone="rose"] { --chip-tone: var(--matrx-chip-rose); --chip-ink: var(--matrx-chip-rose-ink); }
-  :is(.matrx-control-chip, .matrx-tile)[data-tone="orange"] { --chip-tone: var(--matrx-chip-orange); --chip-ink: var(--matrx-chip-orange-ink); }
-  :is(.matrx-control-chip, .matrx-tile)[data-tone="amber"] { --chip-tone: var(--matrx-chip-amber); --chip-ink: var(--matrx-chip-amber-ink); }
-  :is(.matrx-control-chip, .matrx-tile)[data-tone="lime"] { --chip-tone: var(--matrx-chip-lime); --chip-ink: var(--matrx-chip-lime-ink); }
-  :is(.matrx-control-chip, .matrx-tile)[data-tone="emerald"] { --chip-tone: var(--matrx-chip-emerald); --chip-ink: var(--matrx-chip-emerald-ink); }
-  :is(.matrx-control-chip, .matrx-tile)[data-tone="teal"] { --chip-tone: var(--matrx-chip-teal); --chip-ink: var(--matrx-chip-teal-ink); }
-  :is(.matrx-control-chip, .matrx-tile)[data-tone="cyan"] { --chip-tone: var(--matrx-chip-cyan); --chip-ink: var(--matrx-chip-cyan-ink); }
-  :is(.matrx-control-chip, .matrx-tile)[data-tone="slate"] { --chip-tone: var(--matrx-chip-slate); --chip-ink: var(--matrx-chip-slate-ink); }
+  :is(.matrx-control-chip, .matrx-tile, .matrx-tile-icon)[data-tone="primary"] { --chip-tone: var(--primary); --chip-ink: var(--primary-ink); }
+  :is(.matrx-control-chip, .matrx-tile, .matrx-tile-icon)[data-tone="success"] { --chip-tone: var(--success); --chip-ink: var(--success-ink); }
+  :is(.matrx-control-chip, .matrx-tile, .matrx-tile-icon)[data-tone="destructive"] { --chip-tone: var(--destructive); --chip-ink: var(--destructive-ink); }
+  :is(.matrx-control-chip, .matrx-tile, .matrx-tile-icon)[data-tone="info"] { --chip-tone: var(--info); --chip-ink: var(--info-ink); }
+  :is(.matrx-control-chip, .matrx-tile, .matrx-tile-icon)[data-tone="warning"] { --chip-tone: var(--matrx-chip-amber); --chip-ink: var(--matrx-chip-amber-ink); }
+  :is(.matrx-control-chip, .matrx-tile, .matrx-tile-icon)[data-tone="sky"] { --chip-tone: var(--matrx-chip-sky); --chip-ink: var(--matrx-chip-sky-ink); }
+  :is(.matrx-control-chip, .matrx-tile, .matrx-tile-icon)[data-tone="blue"] { --chip-tone: var(--matrx-chip-blue); --chip-ink: var(--matrx-chip-blue-ink); }
+  :is(.matrx-control-chip, .matrx-tile, .matrx-tile-icon)[data-tone="indigo"] { --chip-tone: var(--matrx-chip-indigo); --chip-ink: var(--matrx-chip-indigo-ink); }
+  :is(.matrx-control-chip, .matrx-tile, .matrx-tile-icon)[data-tone="violet"] { --chip-tone: var(--matrx-chip-violet); --chip-ink: var(--matrx-chip-violet-ink); }
+  :is(.matrx-control-chip, .matrx-tile, .matrx-tile-icon)[data-tone="fuchsia"] { --chip-tone: var(--matrx-chip-fuchsia); --chip-ink: var(--matrx-chip-fuchsia-ink); }
+  :is(.matrx-control-chip, .matrx-tile, .matrx-tile-icon)[data-tone="rose"] { --chip-tone: var(--matrx-chip-rose); --chip-ink: var(--matrx-chip-rose-ink); }
+  :is(.matrx-control-chip, .matrx-tile, .matrx-tile-icon)[data-tone="orange"] { --chip-tone: var(--matrx-chip-orange); --chip-ink: var(--matrx-chip-orange-ink); }
+  :is(.matrx-control-chip, .matrx-tile, .matrx-tile-icon)[data-tone="amber"] { --chip-tone: var(--matrx-chip-amber); --chip-ink: var(--matrx-chip-amber-ink); }
+  :is(.matrx-control-chip, .matrx-tile, .matrx-tile-icon)[data-tone="lime"] { --chip-tone: var(--matrx-chip-lime); --chip-ink: var(--matrx-chip-lime-ink); }
+  :is(.matrx-control-chip, .matrx-tile, .matrx-tile-icon)[data-tone="emerald"] { --chip-tone: var(--matrx-chip-emerald); --chip-ink: var(--matrx-chip-emerald-ink); }
+  :is(.matrx-control-chip, .matrx-tile, .matrx-tile-icon)[data-tone="teal"] { --chip-tone: var(--matrx-chip-teal); --chip-ink: var(--matrx-chip-teal-ink); }
+  :is(.matrx-control-chip, .matrx-tile, .matrx-tile-icon)[data-tone="cyan"] { --chip-tone: var(--matrx-chip-cyan); --chip-ink: var(--matrx-chip-cyan-ink); }
+  :is(.matrx-control-chip, .matrx-tile, .matrx-tile-icon)[data-tone="slate"] { --chip-tone: var(--matrx-chip-slate); --chip-ink: var(--matrx-chip-slate-ink); }
   /* HUE CARDS tone table: the chip table above, restated for `.matrx-hue-card` (one source of hues). */
   .matrx-hue-card[data-tone="primary"] { --chip-tone: var(--primary); --chip-ink: var(--primary-ink); }
   .matrx-hue-card[data-tone="success"] { --chip-tone: var(--success); --chip-ink: var(--success-ink); }
@@ -1609,6 +1621,15 @@
     background-color: hsl(var(--chip-tone) / 0.14);
     color: hsl(var(--chip-ink, var(--chip-tone)));
   }
+  /* Tile iconTone: only the icon is tinted — a 28px colored square on a neutral card. */
+  .matrx-tile-icon[data-tone]:not([data-tone="neutral"]) {
+    justify-content: center;
+    width: 1.75rem;
+    height: 1.75rem;
+    border-radius: var(--matrx-control-radius);
+    background-color: hsl(var(--chip-tone) / 0.14);
+    color: hsl(var(--chip-ink, var(--chip-tone)));
+  }
   /* A chosen hero card fills its icon square: the choice reads at a glance. */
   .matrx-tile[data-hero][data-selected] .matrx-tile-icon {
     background-color: hsl(var(--primary));
@@ -1716,6 +1737,19 @@
     top: 0.25rem;
     inset-inline-end: 0.25rem;
   }
+  /* dense icon tile: a sidebar's pinned grid — tight air, one-line label that ellipsizes
+     (never broken mid-word). */
+  .matrx-tile[data-layout="icon"][data-dense] {
+    gap: 0.125rem !important;
+    min-height: 2.75rem !important;
+    padding: 0.3125rem 0.125rem 0.25rem !important;
+  }
+  .matrx-tile[data-layout="icon"][data-dense] .matrx-tile-title {
+    display: block;
+    -webkit-line-clamp: unset;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
 
   /* ── Button meta: the mixed-content fact after a label (0.68.12) ───────── */
   .matrx-control-button-meta {

package/dist/controls.d.cts

@@ -52,7 +52,7 @@ declare const CONTROLS_COLLAPSE_BELOW_REM = 48;
  * publish, mark done); `link` is a text action at the control's height — no
  * fill, no border, primary ink, underline on hover (an inline "View all").
  */
-type ControlVariant = "primary" | "quiet" | "outline" | "danger" | "success" | "link";
+type ControlVariant = "primary" | "quiet" | "outline" | "danger" | "success" | "link" | "meta";
 /**
  * THE NAMED CONTROL WIDTHS (0.68.22) — a button, field or select trigger that should not fill
  * its row takes one of these instead of a pasted `w-40`. Derived from the call sites:
@@ -661,6 +661,9 @@ interface TileProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>,
     hero?: boolean;
     /** Tint card, edge and icon square from one `ChipTone` (the `Chip` hue tokens). */
     tone?: ChipTone;
+    /** Tint ONLY the icon, as a 28px colored square, on a neutral card: a grid of actions where each
+     *  job keeps its own hue (quick actions) without every card turning into a colored card. */
+    iconTone?: ChipTone;
     /** A 28px navigation / filter row for sidebars and dense lists: `min-height` is the control size,
      *  padding 4px 8px, gap 8px, 13px title. The `line` is HIDDEN when dense (one line, always).
      *  `variant="quiet"` + `dense` is a clean nav row: transparent until hover / selected. */
@@ -871,6 +874,51 @@ interface StageStepsProps extends Omit<React.HTMLAttributes<HTMLOListElement>, "
 declare function stageStates(count: number, current: number): StageState[];
 declare function StageSteps({ steps, current, labels, maxVisible, className, ...props }: StageStepsProps): React.JSX.Element;
 
+/**
+ * Checklist — conditions a person works through, each with a status mark, and a meter over them.
+ *
+ * `ChecklistItem` is one condition: a 16px mark (done = filled success disc with a check, open =
+ * a warning ring, unknown = a dashed muted ring), a 13px title, one 12px line (one line, full text
+ * in its tooltip) and an optional end slot for the ONE action that fixes it. Under 640px the end
+ * slot drops under the text, on the text's left edge. `ChecklistMeter` heads a group: its name,
+ * "N of M" and one segment per condition, met segments in success. A status word goes in `end`
+ * (a `Badge`). Neither draws a frame: they sit inside the caller's card.
+ *
+ * First caller: the brand page's research readiness (2026-10-23). Pinned by `checklist.test.tsx`.
+ */
+
+type ChecklistState = "done" | "open" | "unknown";
+declare function ChecklistMark({ state, className }: {
+    state: ChecklistState;
+    className?: string;
+}): React.JSX.Element;
+interface ChecklistProps extends React.HTMLAttributes<HTMLUListElement> {
+    "aria-label"?: string;
+}
+/** The list around `ChecklistItem`s: no frame, no gap of its own beyond the rows. */
+declare function Checklist({ className, children, ...props }: ChecklistProps): React.JSX.Element;
+interface ChecklistItemProps extends Omit<React.LiHTMLAttributes<HTMLLIElement>, "title"> {
+    state: ChecklistState;
+    /** The condition, in a few words. */
+    title: React.ReactNode;
+    /** One line under the title: what was measured, or what is missing. Its full text is the tooltip. */
+    line?: string | null;
+    /** The one action that fixes this condition (a `Button`). */
+    end?: React.ReactNode;
+}
+declare function ChecklistItem({ state, title, line, end, className, ...props }: ChecklistItemProps): React.JSX.Element;
+interface ChecklistMeterProps {
+    /** The group's name ("What others say"). */
+    label: React.ReactNode;
+    met: number;
+    total: number;
+    /** A status word after the count (a `Badge`). */
+    end?: React.ReactNode;
+    className?: string;
+}
+/** A group's head: name, "N of M" and one segment per condition. */
+declare function ChecklistMeter({ label, met, total, end, className }: ChecklistMeterProps): React.JSX.Element;
+
 type ClampedNumberInputProps = {
     id?: string;
     value: number;
@@ -2129,5 +2177,5 @@ interface TileCardGridProps {
 }
 declare function TileCardGrid({ title, description, cards, columns, className }: TileCardGridProps): React.JSX.Element;
 
-export { ActionFeedbackButton, AdvancedCollapsible, AnchoredToolbar, AspectRatioGlyph, AspectRatioSelect, Badge, Button, CHIP_TONES, CONFIGURATION_CHOICE_SIZE, CONTROLS_COLLAPSE_BELOW_REM, CONTROLS_CONTAINER_CLASS, CONTROLS_CONTAINER_NAME, CalloutBanner, Chip, ChipSet, CitationChip, CitationPopoverBody, ClampedNumberInput, CollapsibleText, CollapsibleTextGroupControls, ColorSwatchRow, ConfigurationTable, ConfigurationTableRow, ConfigurationValueList, ConfirmDelete, ControlRow, ControlScope, DangerZone, DateField, DateTimeField, DecisionControl, DeleteButton, DisclosureHeader, EmptyState, EmptyStateCard, Field, FieldHelp, GatedActionButton, HUE_TONE, HelpIcon, HueCard, HueGrid, HueList, HueRow, IconDropdownMenu, IconSelect, IndicatorStrip, InfoHint, Input, IosWidget, KpiGrid, KpiTile, LabeledField, LightSwitchToggle, MiddleTruncate, MissingTag, NumberStepper, OpacitySlider, OptionCombobox, PageRangeInput, PromoBanner, PropertyRow, RegionSkeleton, RowGroup, STATUS_TONES, SearchField, SearchInput, SegmentedControl, Select, SelectTrigger, SettingRow, Slider, SplitButton, StageSteps, StatusBadge, StatusToken, StructuredSectionCard, Switch, Tabs, TabsList, TabsTrigger, TextArrayInput, Textarea, Tile, TileCard, TileCardGrid, TimeField, ToolRail, WindowChromeButton, WindowLight, WindowLights, clampDraft, cleanUrl, firstBlockingReason, formatDay, formatPageRanges, formatTime, groupRatioOptions, humanizeRatioWord, indicatorText, isAspectRatioOptionSet, isCollectedValue, parsePageRanges, parseRatio, parseTypedDate, parseTypedTime, ratioShapeName, shownDraft, spansOf, splitForMiddleTruncate, stageStates, valueSummary };
-export type { ActionFeedbackButtonProps, AdvancedCollapsibleProps, AnchorRect, AnchoredToolbarProps, AspectRatioSelectProps, BadgeProps, BadgeTone, BlockingCheck, ButtonProps$1 as ButtonProps, CalloutTone, CardColor, CardSize, ChipHue, ChipProps, ChipSetProps, ChipTone, CitationChipProps, CitationPopoverBodyProps, ClampedNumberInputProps, ColorSwatch, ColorSwatchRowProps, ConfigurationColumn, ConfirmDeleteProps, ControlRowProps, ControlVariant, ControlWidth, DateFieldMode, DateFieldProps, DecisionAnswer, DecisionControlProps, DeleteButtonProps, DisclosureHeaderProps, DisclosureHeaderVariant, EmptyStateCardProps, EmptyStateProps, FieldProps, GatedActionButtonProps, GlyphTone, HelpIconProps, HueCardProps, HueGridProps, HueListProps, HueRowProps, IconDropdownMenuProps, IconDropdownOption, IconSelectItem, IconSelectProps, IndicatorItem, IndicatorStripProps, IndicatorTone, InfoHintProps, InputProps, IosWidgetProps, KpiTileProps, KpiTone, KpiTrend, LabeledFieldProps, LightSwitchToggleProps, NumberStepperProps, OpacitySliderProps, OptionComboboxGroup, OptionComboboxProps, PageRangeInputProps, PageRangeIssue, PageRangeIssueKind, ParsedPageRanges, ParsedRatio, PromoBannerProps, PromoTone, PropertyRowProps, RatioGroups, RegionSkeletonProps, RowGroupProps, SearchInputProps, SegmentOption, SegmentedControlProps, SelectOption, SelectProps, SelectTriggerProps, SettingRowProps, SliderProps, StageState, StageStep, StageStepsProps, StatusBadgeProps, StatusBadgeSize, StatusTone, StructuredSectionCardProps, StructuredSectionCardTitleTone, SwitchProps, TabsListProps, TabsProps, TabsVariant, TextArrayInputProps, TextareaProps, TileCardGridProps, TileCardProps, TileLayout, TileProps, ToolRailItem, ToolRailProps, WayOutItem, WindowChromeButtonProps, WindowLightKind, WindowLightProps, WindowLightsProps };
+export { ActionFeedbackButton, AdvancedCollapsible, AnchoredToolbar, AspectRatioGlyph, AspectRatioSelect, Badge, Button, CHIP_TONES, CONFIGURATION_CHOICE_SIZE, CONTROLS_COLLAPSE_BELOW_REM, CONTROLS_CONTAINER_CLASS, CONTROLS_CONTAINER_NAME, CalloutBanner, Checklist, ChecklistItem, ChecklistMark, ChecklistMeter, Chip, ChipSet, CitationChip, CitationPopoverBody, ClampedNumberInput, CollapsibleText, CollapsibleTextGroupControls, ColorSwatchRow, ConfigurationTable, ConfigurationTableRow, ConfigurationValueList, ConfirmDelete, ControlRow, ControlScope, DangerZone, DateField, DateTimeField, DecisionControl, DeleteButton, DisclosureHeader, EmptyState, EmptyStateCard, Field, FieldHelp, GatedActionButton, HUE_TONE, HelpIcon, HueCard, HueGrid, HueList, HueRow, IconDropdownMenu, IconSelect, IndicatorStrip, InfoHint, Input, IosWidget, KpiGrid, KpiTile, LabeledField, LightSwitchToggle, MiddleTruncate, MissingTag, NumberStepper, OpacitySlider, OptionCombobox, PageRangeInput, PromoBanner, PropertyRow, RegionSkeleton, RowGroup, STATUS_TONES, SearchField, SearchInput, SegmentedControl, Select, SelectTrigger, SettingRow, Slider, SplitButton, StageSteps, StatusBadge, StatusToken, StructuredSectionCard, Switch, Tabs, TabsList, TabsTrigger, TextArrayInput, Textarea, Tile, TileCard, TileCardGrid, TimeField, ToolRail, WindowChromeButton, WindowLight, WindowLights, clampDraft, cleanUrl, firstBlockingReason, formatDay, formatPageRanges, formatTime, groupRatioOptions, humanizeRatioWord, indicatorText, isAspectRatioOptionSet, isCollectedValue, parsePageRanges, parseRatio, parseTypedDate, parseTypedTime, ratioShapeName, shownDraft, spansOf, splitForMiddleTruncate, stageStates, valueSummary };
+export type { ActionFeedbackButtonProps, AdvancedCollapsibleProps, AnchorRect, AnchoredToolbarProps, AspectRatioSelectProps, BadgeProps, BadgeTone, BlockingCheck, ButtonProps$1 as ButtonProps, CalloutTone, CardColor, CardSize, ChecklistItemProps, ChecklistMeterProps, ChecklistProps, ChecklistState, ChipHue, ChipProps, ChipSetProps, ChipTone, CitationChipProps, CitationPopoverBodyProps, ClampedNumberInputProps, ColorSwatch, ColorSwatchRowProps, ConfigurationColumn, ConfirmDeleteProps, ControlRowProps, ControlVariant, ControlWidth, DateFieldMode, DateFieldProps, DecisionAnswer, DecisionControlProps, DeleteButtonProps, DisclosureHeaderProps, DisclosureHeaderVariant, EmptyStateCardProps, EmptyStateProps, FieldProps, GatedActionButtonProps, GlyphTone, HelpIconProps, HueCardProps, HueGridProps, HueListProps, HueRowProps, IconDropdownMenuProps, IconDropdownOption, IconSelectItem, IconSelectProps, IndicatorItem, IndicatorStripProps, IndicatorTone, InfoHintProps, InputProps, IosWidgetProps, KpiTileProps, KpiTone, KpiTrend, LabeledFieldProps, LightSwitchToggleProps, NumberStepperProps, OpacitySliderProps, OptionComboboxGroup, OptionComboboxProps, PageRangeInputProps, PageRangeIssue, PageRangeIssueKind, ParsedPageRanges, ParsedRatio, PromoBannerProps, PromoTone, PropertyRowProps, RatioGroups, RegionSkeletonProps, RowGroupProps, SearchInputProps, SegmentOption, SegmentedControlProps, SelectOption, SelectProps, SelectTriggerProps, SettingRowProps, SliderProps, StageState, StageStep, StageStepsProps, StatusBadgeProps, StatusBadgeSize, StatusTone, StructuredSectionCardProps, StructuredSectionCardTitleTone, SwitchProps, TabsListProps, TabsProps, TabsVariant, TextArrayInputProps, TextareaProps, TileCardGridProps, TileCardProps, TileLayout, TileProps, ToolRailItem, ToolRailProps, WayOutItem, WindowChromeButtonProps, WindowLightKind, WindowLightProps, WindowLightsProps };

package/dist/controls.d.ts

@@ -52,7 +52,7 @@ declare const CONTROLS_COLLAPSE_BELOW_REM = 48;
  * publish, mark done); `link` is a text action at the control's height — no
  * fill, no border, primary ink, underline on hover (an inline "View all").
  */
-type ControlVariant = "primary" | "quiet" | "outline" | "danger" | "success" | "link";
+type ControlVariant = "primary" | "quiet" | "outline" | "danger" | "success" | "link" | "meta";
 /**
  * THE NAMED CONTROL WIDTHS (0.68.22) — a button, field or select trigger that should not fill
  * its row takes one of these instead of a pasted `w-40`. Derived from the call sites:
@@ -661,6 +661,9 @@ interface TileProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>,
     hero?: boolean;
     /** Tint card, edge and icon square from one `ChipTone` (the `Chip` hue tokens). */
     tone?: ChipTone;
+    /** Tint ONLY the icon, as a 28px colored square, on a neutral card: a grid of actions where each
+     *  job keeps its own hue (quick actions) without every card turning into a colored card. */
+    iconTone?: ChipTone;
     /** A 28px navigation / filter row for sidebars and dense lists: `min-height` is the control size,
      *  padding 4px 8px, gap 8px, 13px title. The `line` is HIDDEN when dense (one line, always).
      *  `variant="quiet"` + `dense` is a clean nav row: transparent until hover / selected. */
@@ -871,6 +874,51 @@ interface StageStepsProps extends Omit<React.HTMLAttributes<HTMLOListElement>, "
 declare function stageStates(count: number, current: number): StageState[];
 declare function StageSteps({ steps, current, labels, maxVisible, className, ...props }: StageStepsProps): React.JSX.Element;
 
+/**
+ * Checklist — conditions a person works through, each with a status mark, and a meter over them.
+ *
+ * `ChecklistItem` is one condition: a 16px mark (done = filled success disc with a check, open =
+ * a warning ring, unknown = a dashed muted ring), a 13px title, one 12px line (one line, full text
+ * in its tooltip) and an optional end slot for the ONE action that fixes it. Under 640px the end
+ * slot drops under the text, on the text's left edge. `ChecklistMeter` heads a group: its name,
+ * "N of M" and one segment per condition, met segments in success. A status word goes in `end`
+ * (a `Badge`). Neither draws a frame: they sit inside the caller's card.
+ *
+ * First caller: the brand page's research readiness (2026-10-23). Pinned by `checklist.test.tsx`.
+ */
+
+type ChecklistState = "done" | "open" | "unknown";
+declare function ChecklistMark({ state, className }: {
+    state: ChecklistState;
+    className?: string;
+}): React.JSX.Element;
+interface ChecklistProps extends React.HTMLAttributes<HTMLUListElement> {
+    "aria-label"?: string;
+}
+/** The list around `ChecklistItem`s: no frame, no gap of its own beyond the rows. */
+declare function Checklist({ className, children, ...props }: ChecklistProps): React.JSX.Element;
+interface ChecklistItemProps extends Omit<React.LiHTMLAttributes<HTMLLIElement>, "title"> {
+    state: ChecklistState;
+    /** The condition, in a few words. */
+    title: React.ReactNode;
+    /** One line under the title: what was measured, or what is missing. Its full text is the tooltip. */
+    line?: string | null;
+    /** The one action that fixes this condition (a `Button`). */
+    end?: React.ReactNode;
+}
+declare function ChecklistItem({ state, title, line, end, className, ...props }: ChecklistItemProps): React.JSX.Element;
+interface ChecklistMeterProps {
+    /** The group's name ("What others say"). */
+    label: React.ReactNode;
+    met: number;
+    total: number;
+    /** A status word after the count (a `Badge`). */
+    end?: React.ReactNode;
+    className?: string;
+}
+/** A group's head: name, "N of M" and one segment per condition. */
+declare function ChecklistMeter({ label, met, total, end, className }: ChecklistMeterProps): React.JSX.Element;
+
 type ClampedNumberInputProps = {
     id?: string;
     value: number;
@@ -2129,5 +2177,5 @@ interface TileCardGridProps {
 }
 declare function TileCardGrid({ title, description, cards, columns, className }: TileCardGridProps): React.JSX.Element;
 
-export { ActionFeedbackButton, AdvancedCollapsible, AnchoredToolbar, AspectRatioGlyph, AspectRatioSelect, Badge, Button, CHIP_TONES, CONFIGURATION_CHOICE_SIZE, CONTROLS_COLLAPSE_BELOW_REM, CONTROLS_CONTAINER_CLASS, CONTROLS_CONTAINER_NAME, CalloutBanner, Chip, ChipSet, CitationChip, CitationPopoverBody, ClampedNumberInput, CollapsibleText, CollapsibleTextGroupControls, ColorSwatchRow, ConfigurationTable, ConfigurationTableRow, ConfigurationValueList, ConfirmDelete, ControlRow, ControlScope, DangerZone, DateField, DateTimeField, DecisionControl, DeleteButton, DisclosureHeader, EmptyState, EmptyStateCard, Field, FieldHelp, GatedActionButton, HUE_TONE, HelpIcon, HueCard, HueGrid, HueList, HueRow, IconDropdownMenu, IconSelect, IndicatorStrip, InfoHint, Input, IosWidget, KpiGrid, KpiTile, LabeledField, LightSwitchToggle, MiddleTruncate, MissingTag, NumberStepper, OpacitySlider, OptionCombobox, PageRangeInput, PromoBanner, PropertyRow, RegionSkeleton, RowGroup, STATUS_TONES, SearchField, SearchInput, SegmentedControl, Select, SelectTrigger, SettingRow, Slider, SplitButton, StageSteps, StatusBadge, StatusToken, StructuredSectionCard, Switch, Tabs, TabsList, TabsTrigger, TextArrayInput, Textarea, Tile, TileCard, TileCardGrid, TimeField, ToolRail, WindowChromeButton, WindowLight, WindowLights, clampDraft, cleanUrl, firstBlockingReason, formatDay, formatPageRanges, formatTime, groupRatioOptions, humanizeRatioWord, indicatorText, isAspectRatioOptionSet, isCollectedValue, parsePageRanges, parseRatio, parseTypedDate, parseTypedTime, ratioShapeName, shownDraft, spansOf, splitForMiddleTruncate, stageStates, valueSummary };
-export type { ActionFeedbackButtonProps, AdvancedCollapsibleProps, AnchorRect, AnchoredToolbarProps, AspectRatioSelectProps, BadgeProps, BadgeTone, BlockingCheck, ButtonProps$1 as ButtonProps, CalloutTone, CardColor, CardSize, ChipHue, ChipProps, ChipSetProps, ChipTone, CitationChipProps, CitationPopoverBodyProps, ClampedNumberInputProps, ColorSwatch, ColorSwatchRowProps, ConfigurationColumn, ConfirmDeleteProps, ControlRowProps, ControlVariant, ControlWidth, DateFieldMode, DateFieldProps, DecisionAnswer, DecisionControlProps, DeleteButtonProps, DisclosureHeaderProps, DisclosureHeaderVariant, EmptyStateCardProps, EmptyStateProps, FieldProps, GatedActionButtonProps, GlyphTone, HelpIconProps, HueCardProps, HueGridProps, HueListProps, HueRowProps, IconDropdownMenuProps, IconDropdownOption, IconSelectItem, IconSelectProps, IndicatorItem, IndicatorStripProps, IndicatorTone, InfoHintProps, InputProps, IosWidgetProps, KpiTileProps, KpiTone, KpiTrend, LabeledFieldProps, LightSwitchToggleProps, NumberStepperProps, OpacitySliderProps, OptionComboboxGroup, OptionComboboxProps, PageRangeInputProps, PageRangeIssue, PageRangeIssueKind, ParsedPageRanges, ParsedRatio, PromoBannerProps, PromoTone, PropertyRowProps, RatioGroups, RegionSkeletonProps, RowGroupProps, SearchInputProps, SegmentOption, SegmentedControlProps, SelectOption, SelectProps, SelectTriggerProps, SettingRowProps, SliderProps, StageState, StageStep, StageStepsProps, StatusBadgeProps, StatusBadgeSize, StatusTone, StructuredSectionCardProps, StructuredSectionCardTitleTone, SwitchProps, TabsListProps, TabsProps, TabsVariant, TextArrayInputProps, TextareaProps, TileCardGridProps, TileCardProps, TileLayout, TileProps, ToolRailItem, ToolRailProps, WayOutItem, WindowChromeButtonProps, WindowLightKind, WindowLightProps, WindowLightsProps };
+export { ActionFeedbackButton, AdvancedCollapsible, AnchoredToolbar, AspectRatioGlyph, AspectRatioSelect, Badge, Button, CHIP_TONES, CONFIGURATION_CHOICE_SIZE, CONTROLS_COLLAPSE_BELOW_REM, CONTROLS_CONTAINER_CLASS, CONTROLS_CONTAINER_NAME, CalloutBanner, Checklist, ChecklistItem, ChecklistMark, ChecklistMeter, Chip, ChipSet, CitationChip, CitationPopoverBody, ClampedNumberInput, CollapsibleText, CollapsibleTextGroupControls, ColorSwatchRow, ConfigurationTable, ConfigurationTableRow, ConfigurationValueList, ConfirmDelete, ControlRow, ControlScope, DangerZone, DateField, DateTimeField, DecisionControl, DeleteButton, DisclosureHeader, EmptyState, EmptyStateCard, Field, FieldHelp, GatedActionButton, HUE_TONE, HelpIcon, HueCard, HueGrid, HueList, HueRow, IconDropdownMenu, IconSelect, IndicatorStrip, InfoHint, Input, IosWidget, KpiGrid, KpiTile, LabeledField, LightSwitchToggle, MiddleTruncate, MissingTag, NumberStepper, OpacitySlider, OptionCombobox, PageRangeInput, PromoBanner, PropertyRow, RegionSkeleton, RowGroup, STATUS_TONES, SearchField, SearchInput, SegmentedControl, Select, SelectTrigger, SettingRow, Slider, SplitButton, StageSteps, StatusBadge, StatusToken, StructuredSectionCard, Switch, Tabs, TabsList, TabsTrigger, TextArrayInput, Textarea, Tile, TileCard, TileCardGrid, TimeField, ToolRail, WindowChromeButton, WindowLight, WindowLights, clampDraft, cleanUrl, firstBlockingReason, formatDay, formatPageRanges, formatTime, groupRatioOptions, humanizeRatioWord, indicatorText, isAspectRatioOptionSet, isCollectedValue, parsePageRanges, parseRatio, parseTypedDate, parseTypedTime, ratioShapeName, shownDraft, spansOf, splitForMiddleTruncate, stageStates, valueSummary };
+export type { ActionFeedbackButtonProps, AdvancedCollapsibleProps, AnchorRect, AnchoredToolbarProps, AspectRatioSelectProps, BadgeProps, BadgeTone, BlockingCheck, ButtonProps$1 as ButtonProps, CalloutTone, CardColor, CardSize, ChecklistItemProps, ChecklistMeterProps, ChecklistProps, ChecklistState, ChipHue, ChipProps, ChipSetProps, ChipTone, CitationChipProps, CitationPopoverBodyProps, ClampedNumberInputProps, ColorSwatch, ColorSwatchRowProps, ConfigurationColumn, ConfirmDeleteProps, ControlRowProps, ControlVariant, ControlWidth, DateFieldMode, DateFieldProps, DecisionAnswer, DecisionControlProps, DeleteButtonProps, DisclosureHeaderProps, DisclosureHeaderVariant, EmptyStateCardProps, EmptyStateProps, FieldProps, GatedActionButtonProps, GlyphTone, HelpIconProps, HueCardProps, HueGridProps, HueListProps, HueRowProps, IconDropdownMenuProps, IconDropdownOption, IconSelectItem, IconSelectProps, IndicatorItem, IndicatorStripProps, IndicatorTone, InfoHintProps, InputProps, IosWidgetProps, KpiTileProps, KpiTone, KpiTrend, LabeledFieldProps, LightSwitchToggleProps, NumberStepperProps, OpacitySliderProps, OptionComboboxGroup, OptionComboboxProps, PageRangeInputProps, PageRangeIssue, PageRangeIssueKind, ParsedPageRanges, ParsedRatio, PromoBannerProps, PromoTone, PropertyRowProps, RatioGroups, RegionSkeletonProps, RowGroupProps, SearchInputProps, SegmentOption, SegmentedControlProps, SelectOption, SelectProps, SelectTriggerProps, SettingRowProps, SliderProps, StageState, StageStep, StageStepsProps, StatusBadgeProps, StatusBadgeSize, StatusTone, StructuredSectionCardProps, StructuredSectionCardTitleTone, SwitchProps, TabsListProps, TabsProps, TabsVariant, TextArrayInputProps, TextareaProps, TileCardGridProps, TileCardProps, TileLayout, TileProps, ToolRailItem, ToolRailProps, WayOutItem, WindowChromeButtonProps, WindowLightKind, WindowLightProps, WindowLightsProps };

package/dist/controls.js

@@ -6,6 +6,10 @@ import {
   AspectRatioGlyph,
   AspectRatioSelect,
   CalloutBanner,
+  Checklist,
+  ChecklistItem,
+  ChecklistMark,
+  ChecklistMeter,
   CitationChip,
   CitationPopoverBody,
   ClampedNumberInput,
@@ -69,7 +73,7 @@ import {
   spansOf,
   splitForMiddleTruncate,
   stageStates
-} from "./chunk-KYH42WEX.js";
+} from "./chunk-UGQRAQTE.js";
 import "./chunk-6NOLVA4E.js";
 import {
   Input,
@@ -82,7 +86,7 @@ import {
 } from "./chunk-ZRHVA3DL.js";
 import "./chunk-XERGQT2M.js";
 import "./chunk-WQ2QCMMA.js";
-import "./chunk-MIJMP4WI.js";
+import "./chunk-YRF22M5S.js";
 import {
   ConfirmDelete,
   DangerZone,
@@ -94,7 +98,7 @@ import {
   RowGroup,
   SettingRow,
   Tile
-} from "./chunk-6CDAHINE.js";
+} from "./chunk-GMNROZQJ.js";
 import "./chunk-K4XCB576.js";
 import "./chunk-HKLIRHT2.js";
 import "./chunk-DRSBLHOF.js";
@@ -115,7 +119,7 @@ import {
   StatusToken,
   isCollectedValue,
   valueSummary
-} from "./chunk-6QKT52FR.js";
+} from "./chunk-MTE6N7XU.js";
 import "./chunk-WFBPCMPF.js";
 import "./chunk-OPF265PU.js";
 import {
@@ -137,7 +141,7 @@ import {
   Switch,
   Tabs,
   Textarea
-} from "./chunk-XTP6HOB6.js";
+} from "./chunk-6XNYYROM.js";
 import "./chunk-BD77DHUO.js";
 import "./chunk-BKCJUFD3.js";
 import "./chunk-PIQJULQB.js";
@@ -167,6 +171,10 @@ export {
   CONTROLS_CONTAINER_CLASS,
   CONTROLS_CONTAINER_NAME,
   CalloutBanner,
+  Checklist,
+  ChecklistItem,
+  ChecklistMark,
+  ChecklistMeter,
   Chip,
   ChipSet,
   CitationChip,