@assure-one/design-system 1.41.2 → 1.43.0

package/dist/suite/index.d.ts

@@ -1,8 +1,11 @@
 import * as React$1 from 'react';
 import { ReactNode } from 'react';
 import * as react_jsx_runtime from 'react/jsx-runtime';
-export { B as BRAND_PRODUCTS, a as BrandProduct, b as brandLabel } from '../brand-scope-BOHId6BY.js';
-import { C as ComingSoonMessages } from '../types-Coqw8iaS.js';
+import { C as ComboboxSize } from '../brand-scope-BOKu4iOc.js';
+export { B as BRAND_PRODUCTS, a as BrandProduct, b as brandLabel } from '../brand-scope-BOKu4iOc.js';
+import { c as ComingSoonMessages } from '../types-DlqmlVyZ.js';
+import '../vocab-DornLJbW.js';
+import '../system-DfJIVBlJ.js';
 
 interface BrandIconProps extends React.SVGAttributes<SVGElement> {
     size?: number;
@@ -25,8 +28,16 @@ interface ClientSelectProps {
     error?: string;
     className?: string;
     placeholder?: string;
+    /**
+     * Height, padding, font and glyph size from the shared control scale (A1,
+     * ADR-013), forwarded to the underlying `Combobox`. Default `md` — today's
+     * frozen 36px row, byte for byte.
+     *
+     * @experimental
+     */
+    size?: ComboboxSize | undefined;
 }
-declare function ClientSelect({ clients, value, onChange, name, error, className, placeholder, }: ClientSelectProps): react_jsx_runtime.JSX.Element;
+declare function ClientSelect({ clients, value, onChange, name, error, className, placeholder, size, }: ClientSelectProps): react_jsx_runtime.JSX.Element;
 declare namespace ClientSelect {
     var displayName: string;
 }

package/dist/suite/index.js

@@ -1,7 +1,7 @@
 "use client";
-export { AgreementPaneHeading, AgreementViewer, AssureAuditBrandIcon, AssureBooksBrandIcon, AssureProBrandIcon, AssureTaxBrandIcon, BRAND_PRODUCTS, ClientSelect, ComingSoon, Grid, Logo, ProposalAddOn, ProposalBillingTerms, ProposalConsentGate, ProposalCustomPage, ProposalNote, ProposalPackageCard, ProposalPaymentCapture, ProposalPricingSummary, ProposalServiceRow, ProposalSignatureBlock, ProposalSignerList, QUESTION_TYPES, QUESTION_TYPE_CONTRACT_VERSION, Questions, SidebarBrandSwitcher, SidebarBrandSwitcherTile, brandLabel } from '../chunk-JKNHNNNY.js';
-export { DocumentDetailActions, DocumentDetailBody, DocumentDetailHeader, DocumentDetailMetaRow, DocumentDetailPanel, DocumentDetailRequester, DocumentDetailTitle, DocumentList, DocumentListSection, DocumentRow } from '../chunk-XN7OBLQR.js';
-import '../chunk-AF3QYJ24.js';
+export { AgreementPaneHeading, AgreementViewer, AssureAuditBrandIcon, AssureBooksBrandIcon, AssureProBrandIcon, AssureTaxBrandIcon, BRAND_PRODUCTS, ClientSelect, ComingSoon, Grid, Logo, ProposalAddOn, ProposalBillingTerms, ProposalConsentGate, ProposalCustomPage, ProposalNote, ProposalPackageCard, ProposalPaymentCapture, ProposalPricingSummary, ProposalServiceRow, ProposalSignatureBlock, ProposalSignerList, QUESTION_TYPES, QUESTION_TYPE_CONTRACT_VERSION, Questions, SidebarBrandSwitcher, SidebarBrandSwitcherTile, brandLabel } from '../chunk-TYXT5C2B.js';
+export { DocumentDetailActions, DocumentDetailBody, DocumentDetailHeader, DocumentDetailMetaRow, DocumentDetailPanel, DocumentDetailRequester, DocumentDetailTitle, DocumentList, DocumentListSection, DocumentRow } from '../chunk-XJKCKBHI.js';
+import '../chunk-TBDTXAFH.js';
 import '../chunk-EUHGZA6Q.js';
 import '../chunk-YRHRVOLV.js';
 //# sourceMappingURL=index.js.map

package/dist/{types-Coqw8iaS.d.ts → types-DlqmlVyZ.d.ts}

@@ -363,6 +363,15 @@ interface TableMessages {
      */
     region: string;
 }
+/** The copy a `TableDensityToggle` renders. @experimental */
+interface TableDensityMessages {
+    /** The group's accessible name. Default `"Row density"`. */
+    label: string;
+    /** The comfortable item's accessible name and tooltip. Default `"Detailed view"`. */
+    comfortable: string;
+    /** The compact item's accessible name and tooltip. Default `"Compact view"`. */
+    compact: string;
+}
 /** The copy a `StackedBarChart` renders. @experimental */
 interface StackedBarChartMessages {
     /**
@@ -482,6 +491,7 @@ interface DsMessages {
     errorState: ErrorStateMessages;
     tableStates: TableStatesMessages;
     table: TableMessages;
+    tableDensity: TableDensityMessages;
     stackedBarChart: StackedBarChartMessages;
     pdfPreview: PdfPreviewMessages;
     spreadsheetPreview: SpreadsheetPreviewMessages;
@@ -500,4 +510,4 @@ type DsMessagesOverride = {
     [N in DsMessageNamespace]?: Partial<DsMessages[N]>;
 };
 
-export type { ComingSoonMessages as C, DsMessageNamespace as D, ErrorStateMessages as E, FileUploadMessages as F, KeyboardShortcutsMessages as K, PaginationMessages as P, SearchInputMessages as S, TableMessages as T, DsMessages as a, DsMessagesOverride as b, CommandPaletteMessages as c, ConfirmMessages as d, CopyButtonMessages as e, PhoneFieldMessages as f, SelectMessages as g, ToastMessages as h, FieldMessages as i, ComboboxMessages as j, TableStatesMessages as k, DataTableMessages as l };
+export type { ComboboxMessages as C, DsMessageNamespace as D, ErrorStateMessages as E, FileUploadMessages as F, KeyboardShortcutsMessages as K, PaginationMessages as P, SelectMessages as S, TableMessages as T, DsMessages as a, DsMessagesOverride as b, ComingSoonMessages as c, CommandPaletteMessages as d, ConfirmMessages as e, CopyButtonMessages as f, PhoneFieldMessages as g, SearchInputMessages as h, TableDensityMessages as i, ToastMessages as j, FieldMessages as k, TableStatesMessages as l, DataTableMessages as m };

package/docs/components.md

@@ -2,7 +2,7 @@
 
 <!-- Generated by `pnpm docs:catalogue` from api/*.api.md and docs/components.registry.json. Do not edit by hand; edit the registry and regenerate. -->
 
-Every public component of `@assure-one/design-system`, in one place: **491 component exports** — 180 component families with 228 compound parts, and 166 icons — plus the hooks, utilities, tokens and testing helpers the package exports. The list is derived from the API reports, so a public component cannot be missing from this page (`pnpm docs:catalogue --check` runs in `pnpm test:contracts`).
+Every public component of `@assure-one/design-system`, in one place: **496 component exports** — 183 component families with 228 compound parts, and 168 icons — plus the hooks, utilities, tokens and testing helpers the package exports. The list is derived from the API reports, so a public component cannot be missing from this page (`pnpm docs:catalogue --check` runs in `pnpm test:contracts`).
 
 **How to use this page.** Start from the ["Pick a component"](#pick-a-component) table with the UI need you have, or from ["Never hand-roll"](#never-hand-roll) with the raw element you were about to write; links land on the category section that holds the row. Every row links to the story that shows the states. The short rulebook for agents and new contributors is [`docs/for-ai-agents.md`](./for-ai-agents.md).
 
@@ -140,8 +140,8 @@ Controls that carry a value into a form. Every one binds to `Field` through `use
 | **PhoneInput** (deprecated)<br>since 0.0.0 | Only in code that already uses it: US-only phone formatting on the `Input` chrome. | New code — `PhoneField` (deprecated, removed in 3.0). | — | [PhoneField](#forms), [Input](#forms) | [story](https://github.com/Assure-One/design-system/blob/main/src/primitives/phone-input.stories.tsx) |
 | **PhoneCountryInput** (deprecated)<br>parts: `CountrySelect` (deprecated), `CountryFlag` (deprecated)<br>since 1.1.0 | Only in code that already uses it: the pre-PhoneField country `Select` + `tel` input pair; `parsePhoneForEditing` seeds it from a stored E.164 string. | New code — `PhoneField` (its country picker is a `Combobox`; deprecated, removed in 3.0). | — | [PhoneField](#forms), [COUNTRY_CODES](#hooks-utilities) | [story](https://github.com/Assure-One/design-system/blob/main/src/primitives/phone-country-input.stories.tsx) |
 | **FileUpload**<br>since 0.0.0 | Pick or drop files: accept/multiple/max size, file list with remove, keyboard-focusable input, Field binding. | The upload belongs to a client document request (`DocumentRequestUpload`) or you only show already-uploaded files (`AttachmentChip`, `FileChip`). | `<input type="file">`, `drop-zone div with onDrop` | [DocumentRequestUpload](#forms), [AttachmentChip](#data-display), [FileTypeBadge](#data-display) | [story](https://github.com/Assure-One/design-system/blob/main/src/primitives/file-upload.stories.tsx) |
-| **DatePicker**<br>since 0.0.0 | One date (or a year in year mode) typed with a mask or picked from a `Calendar` popover; ISO `YYYY-MM-DD` value, `onValueChange`, deterministic `en-US` display. | A range (`DateRangePicker`) or an always-visible calendar (`Calendar`). | `<input type="date">` | [DateRangePicker](#forms), [Calendar](#forms), [isoToDisplay](#hooks-utilities) | [story](https://github.com/Assure-One/design-system/blob/main/src/primitives/date-picker.stories.tsx) |
-| **DateRangePicker**<br>since 0.11.0 | A from/to pair in one control; posts `${name}_from` / `${name}_to`. | A single date (`DatePicker`) or two independent dates in a form (two `DatePicker`s in a `Fieldset`). | `two <input type="date">` | [DatePicker](#forms), [Calendar](#forms) | [story](https://github.com/Assure-One/design-system/blob/main/src/primitives/date-range-picker.stories.tsx) |
+| **DatePicker**<br>since 0.0.0 | One date (or a year in year mode) typed with a mask or picked from a `Calendar` popover; ISO `YYYY-MM-DD` value, `onValueChange`, deterministic `en-US` display, `size`. | A range (`DateRangePicker`) or an always-visible calendar (`Calendar`). | `<input type="date">` | [DateRangePicker](#forms), [Calendar](#forms), [isoToDisplay](#hooks-utilities) | [story](https://github.com/Assure-One/design-system/blob/main/src/primitives/date-picker.stories.tsx) |
+| **DateRangePicker**<br>since 0.11.0 | A from/to pair in one control; posts `${name}_from` / `${name}_to`; `size`. | A single date (`DatePicker`) or two independent dates in a form (two `DatePicker`s in a `Fieldset`). | `two <input type="date">` | [DatePicker](#forms), [Calendar](#forms) | [story](https://github.com/Assure-One/design-system/blob/main/src/primitives/date-range-picker.stories.tsx) |
 | **Calendar**<br>since 0.0.0 | An inline month grid (react-day-picker) for choosing a day or range without a popover. | The date belongs in a form field (`DatePicker`, `DateRangePicker`). | — | [DatePicker](#forms), [DateRangePicker](#forms) | [story](https://github.com/Assure-One/design-system/blob/main/src/primitives/calendar.stories.tsx) |
 | **Checkbox**<br>since 0.0.0 | A boolean or one of several independent choices; `checked` accepts `"indeterminate"` for select-all; native form participation. | The change applies immediately as a setting (`Switch`) or the choices are exclusive (`RadioGroup`). | `<input type="checkbox">` | [Switch](#forms), [RadioGroup](#forms), [DataTable](#data-display) | [story](https://github.com/Assure-One/design-system/blob/main/src/primitives/checkbox.stories.tsx) |
 | **RadioGroup**<br>parts: `RadioGroupItem`<br>since 0.0.0 | Exclusive choice among a few visible options in a form; wrap in `Fieldset` for the legend. | More than about six options (`Select`) or an immediate view switch (`ToggleGroup`). | `<input type="radio">` | [Fieldset](#forms), [ToggleGroup](#selection), [Select](#selection) | [story](https://github.com/Assure-One/design-system/blob/main/src/primitives/radio-group.stories.tsx) |
@@ -170,9 +170,9 @@ Pick one or many from a set: dropdowns, comboboxes, toggle groups, chips and fil
 | **Select**<br>parts: `SelectRoot`, `SelectTrigger`, `SelectValue`, `SelectContent`, `SelectItem`, `SelectGroup`, `SelectLabel`, `SelectSeparator`, `SelectScrollUpButton`, `SelectScrollDownButton`<br>since 0.0.0 | One of a short static list in a dropdown: the sealed `Select` takes `options`; the `Select*` parts compose custom items. Empty value is a real empty (no sentinel option), `size`, `classNames`, Field binding. | The user should type to filter, the list is long or async (`Combobox`), several values (`MultiSelect`), or a few options that can all be visible (`RadioGroup`, `ToggleGroup`). | `<select>`, `<option>` | [Combobox](#selection), [MultiSelect](#selection), [ClientSelect](#selection), [TeamMemberSelect](#selection) | — |
 | **Combobox** (experimental)<br>also: `DEFAULT_COMBOBOX_MESSAGES`<br>since unreleased | A searchable pick: one input, a portalled listbox, the `Option<T>` model (`{ value, label }`), async loading and empty messages, single or `multiple`. | A short static list (`Select`) or free text with suggestions that need not match (`Input` + `Popover`). | `<input list> + <datalist>`, `<select> with a search box` | [Select](#selection), [MultiSelect](#selection), [SearchSelect](#selection) | [story](https://github.com/Assure-One/design-system/blob/main/src/primitives/combobox.stories.tsx) |
 | **MultiSelect** (experimental)<br>since unreleased | Several of many options with search: `Combobox` in `multiple` mode with selected chips. | A handful of options that should all be visible (`MultiSelectField`) or one value (`Combobox`, `Select`). | `<select multiple>` | [Combobox](#selection), [MultiSelectField](#forms), [Chip](#selection) | [story](https://github.com/Assure-One/design-system/blob/main/src/primitives/multi-select.stories.tsx) |
-| **SearchSelect** (deprecated)<br>since 0.0.0 | Only in code that already uses it: the pre-Combobox searchable select with `{ id, label }` options (contract C-SEARCHSELECT). | New code — `Combobox` with `Option` (deprecated, removed in 3.0; CM-08 rewrites single-mode call sites). | — | [Combobox](#selection), [MultiSelect](#selection) | [story](https://github.com/Assure-One/design-system/blob/main/src/primitives/search-select.stories.tsx) |
-| **ClientSelect** (`/suite`)<br>since 0.0.0 | Pick one client: searchable name and email rows on the `Combobox` primitive, long names truncated. | Clients fetched per keystroke (`Combobox` with async options) or any other entity (`Select`). | — | [Select](#selection), [TeamMemberSelect](#selection), [Combobox](#selection) | [story](https://github.com/Assure-One/design-system/blob/main/src/primitives/client-select.stories.tsx) |
-| **TeamMemberSelect** (deprecated) (`/legacy`)<br>since 0.0.0 | Pick an assignee: avatar and name rows on the `Select` primitive, with an unassigned option. | Several assignees (`MultiSelect`) or any other entity (`Select`). | — | [Select](#selection), [ClientSelect](#selection), [DataTableView](#data-display) | [story](https://github.com/Assure-One/design-system/blob/main/src/legacy/team-member-select.stories.tsx) |
+| **SearchSelect** (deprecated)<br>since 0.0.0 | Only in code that already uses it: the pre-Combobox searchable select with `{ id, label }` options (contract C-SEARCHSELECT), `size` (forwarded to `Combobox`). | New code — `Combobox` with `Option` (deprecated, removed in 3.0; CM-08 rewrites single-mode call sites). | — | [Combobox](#selection), [MultiSelect](#selection) | [story](https://github.com/Assure-One/design-system/blob/main/src/primitives/search-select.stories.tsx) |
+| **ClientSelect** (`/suite`)<br>since 0.0.0 | Pick one client: searchable name and email rows on the `Combobox` primitive, long names truncated, `size` (forwarded to `Combobox`). | Clients fetched per keystroke (`Combobox` with async options) or any other entity (`Select`). | — | [Select](#selection), [TeamMemberSelect](#selection), [Combobox](#selection) | [story](https://github.com/Assure-One/design-system/blob/main/src/primitives/client-select.stories.tsx) |
+| **TeamMemberSelect** (deprecated) (`/legacy`)<br>since 0.0.0 | Pick an assignee: avatar and name rows on the `Select` primitive, with an unassigned option, `size` (forwarded to `Select`). | Several assignees (`MultiSelect`) or any other entity (`Select`). | — | [Select](#selection), [ClientSelect](#selection), [DataTableView](#data-display) | [story](https://github.com/Assure-One/design-system/blob/main/src/legacy/team-member-select.stories.tsx) |
 | **ToggleGroup**<br>parts: `ToggleGroupItem`<br>since 0.0.0 | A view or mode switch with immediate effect (list/grid, day/week), single or multiple, roving focus. | The choice is a form value (`RadioGroup`, `MultiSelectField`) or navigation between panels (`Tabs`). | `group of <button aria-pressed>` | [Tabs](#navigation), [RadioGroup](#forms), [DocumentSourceFilter](#selection) | [story](https://github.com/Assure-One/design-system/blob/main/src/primitives/toggle-group.stories.tsx) |
 | **Chip** (experimental)<br>also: `chipVariants`, `resolveChipStyle`<br>since 1.35.0 | A removable, toggleable or clickable token: applied filters, tags, selected values; `variant` × `intent` × `size`, `onRemove`, `pressed`. | A static label (`Badge`), a status (`StatusBadge`) or a file (`FileChip`, `AttachmentChip`). | `<span class="rounded-full …"><button>×</button></span>` | [DismissibleChip](#selection), [Badge](#data-display), [Toolbar](#actions), [MultiSelect](#selection) | [story](https://github.com/Assure-One/design-system/blob/main/src/primitives/chip.stories.tsx) |
 | **DismissibleChip**<br>since 0.4.0 | Only in code that already uses it: a label with a remove button. | New code — `Chip` with `onRemove` covers it with the shared variants and sizes. | — | [Chip](#selection) | [story](https://github.com/Assure-One/design-system/blob/main/src/primitives/dismissible-chip.stories.tsx) |
@@ -290,6 +290,7 @@ Show records and status: tables, key/value grids, badges, dots, avatars, lists a
 | **AvatarGroup**<br>since 1.38.0 | An overlapping stack of `Avatar`s with a `+N` overflow bubble: `max` caps the faces, `total` carries the real count, `size` cascades from Avatar's scale. | A single person (`Avatar`) or a list that needs names (`DescriptionList`). | `flex row of avatars with negative margins and a +N circle` | [Avatar](#data-display), [TeamMemberSelect](#selection) | [story](https://github.com/Assure-One/design-system/blob/main/src/primitives/avatar-group.stories.tsx) |
 | **StarRating**<br>also: `starRatingVariants`<br>since 0.0.0 | A display-only rating: fractional stars, `max`, sized variants. | Capturing a rating (compose `RadioGroup` or `ToggleGroup` with star icons). | — | [Badge](#data-display), [KpiCard](#data-display) | [story](https://github.com/Assure-One/design-system/blob/main/src/primitives/star-rating.stories.tsx) |
 | **Table**<br>parts: `TableHeader`, `TableBody`, `TableFooter`, `TableRow`, `TableHead`, `TableCell`, `TableCaption`<br>since 0.0.0 | A bare semantic table with the design system's row, header and caption styling. | A records table with toolbar, sorting and pagination (`DataTable`, `DataTableView`) or an editable matrix (`Grid`). | `<table>`, `<tr>`, `<td>`, `<th>` | [DataTable](#data-display), [DataTableView](#data-display), [MetadataGrid](#data-display) | [story](https://github.com/Assure-One/design-system/blob/main/src/primitives/table.stories.tsx) |
+| **TableDensityToggle** (experimental)<br>also: `useTableDensity`<br>since unreleased | A table's own toolbar control for row density — pairs with `useTableDensity` and `<Table density>`. Two icon items, "Detailed" and "Compact", each with an accessible name and a tooltip. | A generic view-mode switch unrelated to table rows (ToggleGroup directly, or SegmentedControl). | — | [Table](#data-display), [ToggleGroup](#selection) | [story](https://github.com/Assure-One/design-system/blob/main/src/primitives/table-density-toggle.stories.tsx) |
 | **DataTable**<br>parts: `DataTableToolbar`, `DataTableSearch`, `DataTableSpacer`, `DataTableResultsCount`, `DataTableHead`, `DataTableHeader`, `DataTableBody`, `DataTableRow`, `DataTableCell`, `DataTableCellName`, `DataTableCellMono`, `DataTableCellId`, `DataTableCellDue`, `DataTableCheckbox`, `DataTablePagination`<br>since 0.3.0 | The composable records table: card frame, toolbar with search and count, sortable headers, typed cells (name, mono, id, due), row checkbox, pagination. | A config-driven table is enough (`DataTableView`) or the table is a plain semantic one (`Table`). | `<table> + hand-rolled toolbar and pager` | [DataTableView](#data-display), [Table](#data-display), [BulkActionBar](#actions), [LoadingRows](#feedback), [TableLoading](#data-display) | [story](https://github.com/Assure-One/design-system/blob/main/src/composites/data-table.stories.tsx) |
 | **TableLoading** (experimental)<br>since 1.38.0 | The `<tbody aria-busy>` of a data table while its rows load: skeleton rows sized to the columns. Slots in place of `DataTableBody`. | A list outside a table (`LoadingRows`) or a single shape (`Skeleton`). | `<tbody> of hand-rolled skeleton <td>s` | [TableEmpty](#data-display), [TableError](#data-display), [DataTable](#data-display), [LoadingRows](#feedback) | [story](https://github.com/Assure-One/design-system/blob/main/src/composites/data-table-states.stories.tsx) |
 | **TableEmpty** (experimental)<br>since 1.38.0 | The `<tbody>` of a data table with no rows: one full-width row holding a compact `EmptyState`. | An empty panel outside a table (`EmptyState`). | `<tr><td colSpan> with centred grey text` | [TableLoading](#data-display), [TableError](#data-display), [EmptyState](#feedback), [DataTable](#data-display) | [story](https://github.com/Assure-One/design-system/blob/main/src/composites/data-table-states.stories.tsx) |
@@ -345,14 +346,14 @@ Every glyph comes from the catalogue; never inline an `<svg>` or add `lucide-rea
 
 ### Icons (experimental)
 
-The UI glyph catalogue: Lucide glyphs on the 24-unit grid, `currentColor` strokes at 2, `aria-hidden` unless titled. Import from `@assure-one/design-system/icons` (server-safe) or the root. 164 exports, plus `createIcon`.
+The UI glyph catalogue: Lucide glyphs on the 24-unit grid, `currentColor` strokes at 2, `aria-hidden` unless titled. Import from `@assure-one/design-system/icons` (server-safe) or the root. 166 exports, plus `createIcon`.
 
 **Use when:** Any glyph in a control, a list row, a status, an empty state; `createIcon` to register a one-off glyph in the same contract.  
 **Don't use when:** You need a product mark (brand icon family or `Logo`), a state-driven glyph (`StatusIcon`, `PriorityIcon`) or an illustration.  
 **Replaces:** `<svg>`, `lucide-react`  
 **Story:** [src/primitives/icons.stories.tsx](https://github.com/Assure-One/design-system/blob/main/src/primitives/icons.stories.tsx)  
 
-`AlertCircleIcon` · `AlertTriangleIcon` · `AlertTriangleSolidIcon` · `ArchiveIcon` · `ArrowDownIcon` · `ArrowLeftIcon` · `ArrowRightIcon` · `ArrowUpIcon` · `ArrowUpRightIcon` · `AtSignIcon` · `BanIcon` · `BarChartIcon` · `BellIcon` · `BoldIcon` · `BrainIcon` · `BriefcaseIcon` · `Building2Icon` · `BuildingIcon` · `CalculatorIcon` · `CalendarIcon` · `CameraIcon` · `ChatBubbleIcon` · `CheckCheckIcon` · `CheckCircle2Icon` · `CheckCircleSolidIcon` · `CheckIcon` · `ChevronDownIcon` · `ChevronLeftIcon` · `ChevronRightIcon` · `ChevronsDownUpIcon` · `ChevronsLeftIcon` · `ChevronsRightIcon` · `ChevronsUpDownIcon` · `ChevronUpIcon` · `CircleDotIcon` · `CircleIcon` · `ClipboardCheckIcon` · `ClockIcon` · `CommandIcon` · `CopyIcon` · `CornerDownLeftIcon` · `CreditCardIcon` · `DocumentIcon` · `DollarSignIcon` · `DownloadIcon` · `ExternalLinkIcon` · `ExtractIcon` · `EyeIcon` · `EyeOffIcon` · `FileChartColumnIcon` · `FileIcon` · `FileReturnIcon` · `FileTextIcon` · `FilterIcon` · `FlagIcon` · `FolderClosedIcon` · `FolderDownIcon` · `FolderOpenIcon` · `FolderPlusIcon` · `FolderUpIcon` · `GlobeIcon` · `GraduationCapIcon` · `GripHorizontalIcon` · `GripVerticalIcon` · `HelpCircleIcon` · `HistoryIcon` · `HomeIcon` · `InboxIcon` · `InfoCircleSolidIcon` · `InfoIcon` · `ItalicIcon` · `KanbanIcon` · `KeyIcon` · `LandmarkIcon` · `LayersIcon` · `LayoutDashboardIcon` · `LayoutGridIcon` · `LayoutListIcon` · `LightningIcon` · `Link2Icon` · `LinkIcon` · `ListChecksIcon` · `ListIcon` · `ListOrderedIcon` · `LoaderIcon` · `LockIcon` · `LockKeyholeIcon` · `LockOpenIcon` · `LogOutIcon` · `MailIcon` · `MapPinIcon` · `MaximizeIcon` · `MenuIcon` · `MessageCircleIcon` · `MessageCircleMoreIcon` · `MessageCircleWarningIcon` · `MicIcon` · `MinimizeIcon` · `MinusIcon` · `MonitorIcon` · `MoonIcon` · `MoreHorizontalIcon` · `MoreVerticalIcon` · `MousePointer2Icon` · `MoveIcon` · `PaletteIcon` · `PanelLeftCloseIcon` · `PanelLeftIcon` · `PanelRightCloseIcon` · `PanelRightIcon` · `PaperclipIcon` · `PauseIcon` · `PencilIcon` · `PenSignIcon` · `PenToolIcon` · `PhoneIcon` · `PlayIcon` · `PlusIcon` · `ReceiptIcon` · `RefreshCwIcon` · `ReplyIcon` · `RotateCcwIcon` · `SaveIcon` · `SearchIcon` · `SendIcon` · `SettingsIcon` · `ShieldIcon` · `SigmaIcon` · `SlashIcon` · `SmartphoneIcon` · `SparkleIcon` · `SparklesIcon` · `SquarePlayIcon` · `StarIcon` · `StopIcon` · `StrikethroughIcon` · `SunIcon` · `TableIcon` · `TagIcon` · `TeamIcon` · `ThumbsDownIcon` · `ThumbsUpIcon` · `TimerIcon` · `Trash2Icon` · `TrashIcon` · `TrashSolidIcon` · `TrendingDownIcon` · `TrendingUpIcon` · `TypeIcon` · `UnderlineIcon` · `UploadIcon` · `UserCircleIcon` · `UserIcon` · `UsersIcon` · `VideoIcon` · `Volume2Icon` · `VolumeXIcon` · `WorkflowIcon` · `XCircleSolidIcon` · `XIcon` · `ZoomInIcon` · `ZoomOutIcon`
+`AlertCircleIcon` · `AlertTriangleIcon` · `AlertTriangleSolidIcon` · `ArchiveIcon` · `ArrowDownIcon` · `ArrowLeftIcon` · `ArrowRightIcon` · `ArrowUpIcon` · `ArrowUpRightIcon` · `AtSignIcon` · `BanIcon` · `BarChartIcon` · `BellIcon` · `BoldIcon` · `BrainIcon` · `BriefcaseIcon` · `Building2Icon` · `BuildingIcon` · `CalculatorIcon` · `CalendarIcon` · `CameraIcon` · `ChatBubbleIcon` · `CheckCheckIcon` · `CheckCircle2Icon` · `CheckCircleSolidIcon` · `CheckIcon` · `ChevronDownIcon` · `ChevronLeftIcon` · `ChevronRightIcon` · `ChevronsDownUpIcon` · `ChevronsLeftIcon` · `ChevronsRightIcon` · `ChevronsUpDownIcon` · `ChevronUpIcon` · `CircleDotIcon` · `CircleIcon` · `ClipboardCheckIcon` · `ClockIcon` · `CommandIcon` · `CopyIcon` · `CornerDownLeftIcon` · `CreditCardIcon` · `DocumentIcon` · `DollarSignIcon` · `DownloadIcon` · `ExternalLinkIcon` · `ExtractIcon` · `EyeIcon` · `EyeOffIcon` · `FileChartColumnIcon` · `FileIcon` · `FileReturnIcon` · `FileTextIcon` · `FilterIcon` · `FlagIcon` · `FolderClosedIcon` · `FolderDownIcon` · `FolderOpenIcon` · `FolderPlusIcon` · `FolderUpIcon` · `GlobeIcon` · `GraduationCapIcon` · `GripHorizontalIcon` · `GripVerticalIcon` · `HelpCircleIcon` · `HistoryIcon` · `HomeIcon` · `InboxIcon` · `InfoCircleSolidIcon` · `InfoIcon` · `ItalicIcon` · `KanbanIcon` · `KeyIcon` · `LandmarkIcon` · `LayersIcon` · `LayoutDashboardIcon` · `LayoutGridIcon` · `LayoutListIcon` · `LightningIcon` · `Link2Icon` · `LinkIcon` · `ListChecksIcon` · `ListIcon` · `ListOrderedIcon` · `LoaderIcon` · `LockIcon` · `LockKeyholeIcon` · `LockOpenIcon` · `LogOutIcon` · `MailIcon` · `MapPinIcon` · `MaximizeIcon` · `MenuIcon` · `MessageCircleIcon` · `MessageCircleMoreIcon` · `MessageCircleWarningIcon` · `MicIcon` · `MinimizeIcon` · `MinusIcon` · `MonitorIcon` · `MoonIcon` · `MoreHorizontalIcon` · `MoreVerticalIcon` · `MousePointer2Icon` · `MoveIcon` · `PaletteIcon` · `PanelLeftCloseIcon` · `PanelLeftIcon` · `PanelRightCloseIcon` · `PanelRightIcon` · `PaperclipIcon` · `PauseIcon` · `PencilIcon` · `PenSignIcon` · `PenToolIcon` · `PhoneIcon` · `PlayIcon` · `PlusIcon` · `ReceiptIcon` · `RefreshCwIcon` · `ReplyIcon` · `RotateCcwIcon` · `Rows4Icon` · `RowsIcon` · `SaveIcon` · `SearchIcon` · `SendIcon` · `SettingsIcon` · `ShieldIcon` · `SigmaIcon` · `SlashIcon` · `SmartphoneIcon` · `SparkleIcon` · `SparklesIcon` · `SquarePlayIcon` · `StarIcon` · `StopIcon` · `StrikethroughIcon` · `SunIcon` · `TableIcon` · `TagIcon` · `TeamIcon` · `ThumbsDownIcon` · `ThumbsUpIcon` · `TimerIcon` · `Trash2Icon` · `TrashIcon` · `TrashSolidIcon` · `TrendingDownIcon` · `TrendingUpIcon` · `TypeIcon` · `UnderlineIcon` · `UploadIcon` · `UserCircleIcon` · `UserIcon` · `UsersIcon` · `VideoIcon` · `Volume2Icon` · `VolumeXIcon` · `WorkflowIcon` · `XCircleSolidIcon` · `XIcon` · `ZoomInIcon` · `ZoomOutIcon`
 
 Deprecated aliases (same drawing under an older name): `ArrowRightSmallIcon`, `CloseIcon`.
 
@@ -389,6 +390,8 @@ The application frame and full-screen composites: shell, sidebar, header, brand
 | **BrandScope**<br>parts: `BrandScopeProvider`<br>also: `BRAND_PRODUCTS`, `brandLabel`, `brandScope`, `useBrandScope`<br>since 1.18.0 | Theme a subtree as a product: stamps `data-brand` and provides it so portalled surfaces re-stamp themselves; `brandScope(product)` for the attribute alone. | Colouring by service line (`serviceToneStyle`) or by status (`intent`). | — | [Shell](#shell-screens), [SidebarBrandSwitcher](#shell-screens) | [docs](https://github.com/Assure-One/design-system/blob/main/docs/integration/css.md) |
 | **AgreementViewer** (`/suite`)<br>parts: `AgreementPaneHeading` (`/suite`)<br>since 1.12.0 | The client-facing agreement / proposal viewer: cover, steps, firm accent scope for the proposal blocks. | Previewing a PDF (`PdfPreview`). | — | [ProposalPackageCard](#data-display), [ProposalSignatureBlock](#forms), [ProposalSignerList](#data-display) | [story](https://github.com/Assure-One/design-system/blob/main/src/composites/agreement-viewer.stories.tsx) |
 | **SidebarDrawer** (experimental)<br>since 1.38.0 | The sidebar nav off-canvas on small viewports: the same tree in a left-hand Sheet, with the focus trap, scroll lock and dismissal the overlay parts already provide. | Desktop widths (`Sidebar`) or a bottom tab bar (`BottomNav`). | — | [Sidebar](#shell-screens), [Sheet](#overlays), [Shell](#shell-screens) | [story](https://github.com/Assure-One/design-system/blob/main/src/composites/sidebar.stories.tsx) |
+| **AppSidebar** (experimental)<br>since unreleased | A data-driven app nav: sections/items configured as data instead of hand-nested SidebarSection/SidebarLink JSX. Active item is the longest-matching href; a group opens automatically when a child is active. | A bespoke nav with per-row logic beyond icon/label/badge/children (compose Sidebar's parts directly). | — | [AppSidebarNav](#shell-screens), [Sidebar](#shell-screens), [SidebarBrandSwitcher](#shell-screens), [SidebarDrawer](#shell-screens) | [story](https://github.com/Assure-One/design-system/blob/main/src/composites/app-sidebar.stories.tsx) |
+| **AppSidebarNav** (experimental)<br>since unreleased | The same `sections` config as AppSidebar, rendered without a Sidebar root — drop it inside SidebarDrawer for the mobile nav. | The desktop column (use AppSidebar itself). | — | [AppSidebar](#shell-screens), [SidebarDrawer](#shell-screens) | [story](https://github.com/Assure-One/design-system/blob/main/src/composites/app-sidebar.stories.tsx) |
 
 ## Hooks/utilities
 

package/docs/components.registry.json

@@ -794,26 +794,49 @@
     },
     "InfoHint": {
       "category": "data display",
-      "useWhen": "The \u24d8 beside a label or a figure (W7-15): `label` names what the hint is about, `children` is the explanation, `presentation=\"tooltip\"` (default) or `\"popover\"` for an explanation with a paragraph or a link. The trigger is a real `IconButton`, so the hint is reachable by keyboard and by touch.",
+      "useWhen": "The ⓘ beside a label or a figure (W7-15): `label` names what the hint is about, `children` is the explanation, `presentation=\"tooltip\"` (default) or `\"popover\"` for an explanation with a paragraph or a link. The trigger is a real `IconButton`, so the hint is reachable by keyboard and by touch.",
       "dontUseWhen": "The text belongs in the layout (`FieldDescription` under a field) or the surface is a rich hover preview (`HoverCard`).",
-      "replacesRawHtml": ["<svg title>", "<span title>"],
-      "related": ["Tooltip", "Popover", "IconButton", "FieldDescription"],
+      "replacesRawHtml": [
+        "<svg title>",
+        "<span title>"
+      ],
+      "related": [
+        "Tooltip",
+        "Popover",
+        "IconButton",
+        "FieldDescription"
+      ],
       "since": "unreleased"
     },
     "PeoplePicker": {
       "category": "selection",
       "useWhen": "Pick a person or people from the firm's roster (W7-10): `people`, single or `multiple`, avatars with an optional second line, an \"assign to me\" shortcut from `currentUserId`, and an `unassignedLabel` row that reports `null`. Search, keyboard, `Field` binding and form submission come from `Combobox`.",
       "dontUseWhen": "The options are not people (`Combobox`, `MultiSelect`), or a plain roster select with no roster affordances is enough (`Select`). `TeamMemberSelect` is the predecessor it replaces.",
-      "replacesRawHtml": ["hand-rolled assignee popover with checkboxes"],
-      "related": ["Combobox", "MultiSelect", "Avatar", "TeamMemberSelect"],
+      "replacesRawHtml": [
+        "hand-rolled assignee popover with checkboxes"
+      ],
+      "related": [
+        "Combobox",
+        "MultiSelect",
+        "Avatar",
+        "TeamMemberSelect"
+      ],
       "since": "unreleased"
     },
     "SegmentedControl": {
       "category": "selection",
       "useWhen": "One of a few mutually exclusive views or scopes, shown side by side (W7-17): `options` with an optional `count` per segment, `size` on the control scale, radio semantics and arrow-key movement from `ToggleGroup`. The active segment cannot be cleared by clicking it again.",
       "dontUseWhen": "The set is long or open-ended (`Select`, `Combobox`), more than one may be active (`ToggleGroup type=\"multiple\"`), or the segments switch page regions rather than a value (`Tabs`).",
-      "replacesRawHtml": ["pill Tabs used as a filter", "<div> of <button> with a manual active class"],
-      "related": ["ToggleGroup", "Tabs", "Select", "MultiFilterPill"],
+      "replacesRawHtml": [
+        "pill Tabs used as a filter",
+        "<div> of <button> with a manual active class"
+      ],
+      "related": [
+        "ToggleGroup",
+        "Tabs",
+        "Select",
+        "MultiFilterPill"
+      ],
       "since": "unreleased"
     },
     "Input": {
@@ -960,7 +983,7 @@
     },
     "DatePicker": {
       "category": "forms",
-      "useWhen": "One date (or a year in year mode) typed with a mask or picked from a `Calendar` popover; ISO `YYYY-MM-DD` value, `onValueChange`, deterministic `en-US` display.",
+      "useWhen": "One date (or a year in year mode) typed with a mask or picked from a `Calendar` popover; ISO `YYYY-MM-DD` value, `onValueChange`, deterministic `en-US` display, `size`.",
       "dontUseWhen": "A range (`DateRangePicker`) or an always-visible calendar (`Calendar`).",
       "replacesRawHtml": [
         "<input type=\"date\">"
@@ -974,7 +997,7 @@
     },
     "DateRangePicker": {
       "category": "forms",
-      "useWhen": "A from/to pair in one control; posts `${name}_from` / `${name}_to`.",
+      "useWhen": "A from/to pair in one control; posts `${name}_from` / `${name}_to`; `size`.",
       "dontUseWhen": "A single date (`DatePicker`) or two independent dates in a form (two `DatePicker`s in a `Fieldset`).",
       "replacesRawHtml": [
         "two <input type=\"date\">"
@@ -1098,18 +1121,24 @@
       "since": "1.17.0"
     },
     "QUESTION_TYPES": {
-        "category": "hooks/utilities",
-        "useWhen": "Runtime list of every questionnaire question type the DS renders — validate or switch over types from API data.",
-        "dontUseWhen": "Rendering a question — use `Questions` / `QuestionnairePanel`.",
-        "related": ["QUESTION_TYPE_CONTRACT_VERSION", "Questions"],
-        "since": "1.39.0"
+      "category": "hooks/utilities",
+      "useWhen": "Runtime list of every questionnaire question type the DS renders — validate or switch over types from API data.",
+      "dontUseWhen": "Rendering a question — use `Questions` / `QuestionnairePanel`.",
+      "related": [
+        "QUESTION_TYPE_CONTRACT_VERSION",
+        "Questions"
+      ],
+      "since": "1.39.0"
     },
     "QUESTION_TYPE_CONTRACT_VERSION": {
-        "category": "hooks/utilities",
-        "useWhen": "Check which version of the question-type contract the installed DS implements before trusting a stored questionnaire.",
-        "dontUseWhen": "Rendering a question — use `Questions` / `QuestionnairePanel`.",
-        "related": ["QUESTION_TYPES", "Questions"],
-        "since": "1.39.0"
+      "category": "hooks/utilities",
+      "useWhen": "Check which version of the question-type contract the installed DS implements before trusting a stored questionnaire.",
+      "dontUseWhen": "Rendering a question — use `Questions` / `QuestionnairePanel`.",
+      "related": [
+        "QUESTION_TYPES",
+        "Questions"
+      ],
+      "since": "1.39.0"
     },
     "MessageComposer": {
       "category": "forms",
@@ -1256,7 +1285,7 @@
     },
     "SearchSelect": {
       "category": "selection",
-      "useWhen": "Only in code that already uses it: the pre-Combobox searchable select with `{ id, label }` options (contract C-SEARCHSELECT).",
+      "useWhen": "Only in code that already uses it: the pre-Combobox searchable select with `{ id, label }` options (contract C-SEARCHSELECT), `size` (forwarded to `Combobox`).",
       "dontUseWhen": "New code — `Combobox` with `Option` (deprecated, removed in 3.0; CM-08 rewrites single-mode call sites).",
       "related": [
         "Combobox",
@@ -1266,7 +1295,7 @@
     },
     "ClientSelect": {
       "category": "selection",
-      "useWhen": "Pick one client: searchable name and email rows on the `Combobox` primitive, long names truncated.",
+      "useWhen": "Pick one client: searchable name and email rows on the `Combobox` primitive, long names truncated, `size` (forwarded to `Combobox`).",
       "dontUseWhen": "Clients fetched per keystroke (`Combobox` with async options) or any other entity (`Select`).",
       "related": [
         "Select",
@@ -1277,7 +1306,7 @@
     },
     "TeamMemberSelect": {
       "category": "selection",
-      "useWhen": "Pick an assignee: avatar and name rows on the `Select` primitive, with an unassigned option.",
+      "useWhen": "Pick an assignee: avatar and name rows on the `Select` primitive, with an unassigned option, `size` (forwarded to `Select`).",
       "dontUseWhen": "Several assignees (`MultiSelect`) or any other entity (`Select`).",
       "related": [
         "Select",
@@ -2386,6 +2415,20 @@
       ],
       "since": "0.0.0"
     },
+    "TableDensityToggle": {
+      "category": "data display",
+      "parts": [],
+      "useWhen": "A table's own toolbar control for row density — pairs with `useTableDensity` and `<Table density>`. Two icon items, \"Detailed\" and \"Compact\", each with an accessible name and a tooltip.",
+      "dontUseWhen": "A generic view-mode switch unrelated to table rows (ToggleGroup directly, or SegmentedControl).",
+      "related": [
+        "Table",
+        "ToggleGroup"
+      ],
+      "since": "unreleased",
+      "hooks": [
+        "useTableDensity"
+      ]
+    },
     "DataTable": {
       "category": "data display",
       "parts": [
@@ -3335,6 +3378,30 @@
       ],
       "status": "experimental",
       "since": "1.38.0"
+    },
+    "AppSidebar": {
+      "category": "shell/screens",
+      "parts": [],
+      "useWhen": "A data-driven app nav: sections/items configured as data instead of hand-nested SidebarSection/SidebarLink JSX. Active item is the longest-matching href; a group opens automatically when a child is active.",
+      "dontUseWhen": "A bespoke nav with per-row logic beyond icon/label/badge/children (compose Sidebar's parts directly).",
+      "related": [
+        "AppSidebarNav",
+        "Sidebar",
+        "SidebarBrandSwitcher",
+        "SidebarDrawer"
+      ],
+      "since": "unreleased"
+    },
+    "AppSidebarNav": {
+      "category": "shell/screens",
+      "parts": [],
+      "useWhen": "The same `sections` config as AppSidebar, rendered without a Sidebar root — drop it inside SidebarDrawer for the mobile nav.",
+      "dontUseWhen": "The desktop column (use AppSidebar itself).",
+      "related": [
+        "AppSidebar",
+        "SidebarDrawer"
+      ],
+      "since": "unreleased"
     }
   },
   "entries": {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@assure-one/design-system",
-  "version": "1.41.2",
+  "version": "1.43.0",
   "description": "Assure One design system — tokens, primitives, and patterns for the Assure Suite.",
   "license": "UNLICENSED",
   "private": false,

package/dist/brand-scope-BOHId6BY.d.ts

@@ -1,58 +0,0 @@
-import * as React$1 from 'react';
-import * as react_jsx_runtime from 'react/jsx-runtime';
-
-/**
- * Brand scope — ambient product theming.
- *
- * The `brand` color family (bg-brand, hover:bg-brand-hover, bg-brand-bg,
- * border-brand-line, text-fg-on-brand, plus the accent/focus/primary
- * interaction tokens) follows the nearest `[data-brand]` scope and defaults to
- * Pro. Authors type the STATE only; the product comes from the scope. Set it
- * once high in the tree — ideally on the same root as the `.dark` class
- * (`<html>`/`<body>`) — so Radix-portalled surfaces inherit it through the DOM.
- *
- *   <html data-brand="tax">           // whole shell renders teal
- *   <div {...brandScope("audit")}>    // a subtree renders blue
- *
- * For the rarer case of multiple scopes on one page WITH portalled content
- * (a Dialog/Popover that escapes its scoped subtree to document.body), wrap the
- * region in <BrandScope> / <BrandScopeProvider> and have the portalled
- * `*Content` re-stamp `data-brand={useBrandScope()}` on its own element.
- */
-type BrandProduct = "pro" | "audit" | "books" | "tax";
-/**
- * `data-brand` attribute object to spread on any element (mirrors
- * `serviceToneStyle`). This is the primary API for opting a subtree into a
- * product without naming the product in a utility class.
- */
-declare function brandScope(product: BrandProduct): {
-    "data-brand": BrandProduct;
-};
-/** Every product, in suite order — for switchers and story matrices. */
-declare const BRAND_PRODUCTS: BrandProduct[];
-/** Human label for a product, for switchers and headings. */
-declare const brandLabel: Record<BrandProduct, string>;
-/**
- * Provides the active product to descendants so portalled surfaces can
- * re-stamp `data-brand` on themselves via {@link useBrandScope}. Purely a
- * structural carrier — the visual theming still comes from the `[data-brand]`
- * attribute in the DOM, not from this context.
- */
-declare function BrandScopeProvider({ product, children, }: {
-    product: BrandProduct;
-    children: React.ReactNode;
-}): react_jsx_runtime.JSX.Element;
-/** Read the ambient product from the nearest provider (defaults to Pro). */
-declare function useBrandScope(): BrandProduct;
-interface BrandScopeProps extends React.HTMLAttributes<HTMLDivElement> {
-    /** The product this subtree renders as. */
-    product: BrandProduct;
-}
-/**
- * Convenience wrapper that stamps `data-brand` on a `<div>` AND provides the
- * product via context, so a portalled descendant can re-stamp itself. Use
- * `brandScope()` directly when you want the attribute on your own element.
- */
-declare const BrandScope: React$1.ForwardRefExoticComponent<BrandScopeProps & React$1.RefAttributes<HTMLDivElement>>;
-
-export { BRAND_PRODUCTS as B, type BrandProduct as a, brandLabel as b, BrandScope as c, type BrandScopeProps as d, BrandScopeProvider as e, brandScope as f, useBrandScope as u };