@cdx-ui/components 0.3.12 → 0.3.13

package/docs/components/data-grid/content.md

@@ -107,10 +107,10 @@ type Product = {
 };
 
 const columns: GridColDef<Product>[] = [
-  { field: 'name', headerName: 'Name', type: 'string', flex: 1, minWidth: 140 },
+  { field: 'name', headerName: 'Name', type: 'string', flex: 1, minWidth: 160 },
   { field: 'price', headerName: 'Price', type: 'number', width: 120 },
   { field: 'listed', headerName: 'Listed', type: 'date', width: 140 },
-  { field: 'updated', headerName: 'Updated', type: 'dateTime', width: 180 },
+  { field: 'updated', headerName: 'Updated', type: 'dateTime', width: 200 },
   { field: 'active', headerName: 'Active', type: 'boolean', width: 100 },
   {
     field: 'status',
@@ -193,10 +193,10 @@ type Product = {
 };
 
 const columns: GridColDef<Product>[] = [
-  { field: 'name', headerName: 'Name', type: 'string', flex: 1, minWidth: 140 },
+  { field: 'name', headerName: 'Name', type: 'string', flex: 1, minWidth: 160 },
   { field: 'price', headerName: 'Price', type: 'number', width: 120 },
   { field: 'listed', headerName: 'Listed', type: 'date', width: 140 },
-  { field: 'updated', headerName: 'Updated', type: 'dateTime', width: 180 },
+  { field: 'updated', headerName: 'Updated', type: 'dateTime', width: 200 },
   { field: 'active', headerName: 'Active', type: 'boolean', width: 100 },
   {
     field: 'status',
@@ -808,6 +808,550 @@ export default function DataGridCheckboxCellsDemo() {
 }
 ```
 
+## Column visibility
+
+Set a field to `false` in `columnVisibilityModel` to hide its column while keeping it in `columns`. A hidden column still sorts, filters, and matches search, and the filter panel still lists it, so a single visible column can show a rich cell while other fields drive the toolbar controls. With `treeData`, the first visible column becomes the tree column. The grid has no built-in control for showing or hiding columns, so keep the model in your own state. The API picker in [Tree data](#tree-data) uses it.
+
+## Tree data
+
+Set `treeData` and return each row's path from `getTreeDataPath`, such as `['Statements', '2026', 'Checking 4821 Oct.pdf']`. The first column becomes the tree column: an expand toggle, then the row content, indented by depth. Pass `groupingColDef` to override that column's header, width, or cell. A row attaches to its nearest ancestor that exists in `rows`, so a path does not need a row for every level.
+
+Every other column renders, sorts, and filters as it does in a flat grid, so parents and children share the same columns. Leave a value empty where it does not apply to a level, such as a folder's size. Sorting reorders siblings at every level and keeps children under their parent.
+
+Groups start collapsed. `defaultGroupingExpansionDepth` expands groups down to a depth (`-1` expands everything), and `isGroupExpandedByDefault` decides per row. While search, header filters, or the filter panel are active, a row stays visible when it or a descendant matches, and every group on the way to a match opens. Clearing the filter restores the groups the user had open.
+
+Pagination counts top-level rows, so a page never splits a group. Tree data sorts and filters on the client. It cannot be combined with server pagination, sorting, or filtering.
+
+This document library uses `groupingColDef` to draw a file-type icon and each folder's file count in the tree column, and opens the current year's statements with `isGroupExpandedByDefault`.
+
+```tsx
+import { HStack, Icon, type IconColor, Text } from '@cdx-ui/components';
+import {
+  DataGrid,
+  type DataGridProps,
+  type GridColDef,
+  type GridTreeNodeParams,
+} from '@cdx-ui/data-grid';
+import { Csv, Description, Folder, type ForgeIcon, PictureAsPdf, TableChart } from '@cdx-ui/icons';
+
+type DocumentType = 'Folder' | 'PDF' | 'CSV' | 'Spreadsheet' | 'Document';
+
+// GridValidRowModel's index signature rejects otherwise equivalent interfaces.
+// eslint-disable-next-line @typescript-eslint/consistent-type-definitions
+type BankDocument = {
+  id: string;
+  path: string[];
+  type: DocumentType;
+  modified: Date;
+  size?: number;
+};
+
+const typeIcons: Record<DocumentType, { icon: ForgeIcon; color: IconColor }> = {
+  Folder: { icon: Folder, color: 'action' },
+  PDF: { icon: PictureAsPdf, color: 'danger' },
+  CSV: { icon: Csv, color: 'success' },
+  Spreadsheet: { icon: TableChart, color: 'success' },
+  Document: { icon: Description, color: 'info' },
+};
+
+const documents: BankDocument[] = [
+  { id: 'statements', path: ['Statements'], type: 'Folder', modified: new Date(2026, 9, 31) },
+  {
+    id: 'statements-2026',
+    path: ['Statements', '2026'],
+    type: 'Folder',
+    modified: new Date(2026, 9, 31),
+  },
+  {
+    id: 'checking-2026-10',
+    path: ['Statements', '2026', 'Checking 4821 Oct.pdf'],
+    type: 'PDF',
+    modified: new Date(2026, 9, 31),
+    size: 184_320,
+  },
+  {
+    id: 'checking-2026-09',
+    path: ['Statements', '2026', 'Checking 4821 Sep.pdf'],
+    type: 'PDF',
+    modified: new Date(2026, 8, 30),
+    size: 176_128,
+  },
+  {
+    id: 'savings-2026-q3',
+    path: ['Statements', '2026', 'Savings 9310 Q3.pdf'],
+    type: 'PDF',
+    modified: new Date(2026, 8, 30),
+    size: 98_304,
+  },
+  {
+    id: 'statements-2025',
+    path: ['Statements', '2025'],
+    type: 'Folder',
+    modified: new Date(2025, 11, 31),
+  },
+  {
+    id: 'checking-2025-12',
+    path: ['Statements', '2025', 'Checking 4821 Dec.pdf'],
+    type: 'PDF',
+    modified: new Date(2025, 11, 31),
+    size: 192_512,
+  },
+  {
+    id: 'savings-2025-q4',
+    path: ['Statements', '2025', 'Savings 9310 Q4.pdf'],
+    type: 'PDF',
+    modified: new Date(2025, 11, 31),
+    size: 101_376,
+  },
+  { id: 'tax', path: ['Tax documents'], type: 'Folder', modified: new Date(2026, 0, 31) },
+  {
+    id: 'tax-1099-int',
+    path: ['Tax documents', '1099-INT 2025.pdf'],
+    type: 'PDF',
+    modified: new Date(2026, 0, 31),
+    size: 64_512,
+  },
+  {
+    id: 'tax-1098',
+    path: ['Tax documents', '1098 Mortgage 2025.pdf'],
+    type: 'PDF',
+    modified: new Date(2026, 0, 29),
+    size: 71_680,
+  },
+  { id: 'loans', path: ['Loans'], type: 'Folder', modified: new Date(2026, 8, 15) },
+  {
+    id: 'mortgage',
+    path: ['Loans', 'Home mortgage 7702'],
+    type: 'Folder',
+    modified: new Date(2026, 8, 15),
+  },
+  {
+    id: 'mortgage-closing',
+    path: ['Loans', 'Home mortgage 7702', 'Closing disclosure.pdf'],
+    type: 'PDF',
+    modified: new Date(2024, 4, 22),
+    size: 1_258_291,
+  },
+  {
+    id: 'mortgage-amortization',
+    path: ['Loans', 'Home mortgage 7702', 'Amortization.xlsx'],
+    type: 'Spreadsheet',
+    modified: new Date(2024, 4, 22),
+    size: 48_128,
+  },
+  {
+    id: 'mortgage-escrow',
+    path: ['Loans', 'Home mortgage 7702', 'Escrow analysis.pdf'],
+    type: 'PDF',
+    modified: new Date(2026, 8, 15),
+    size: 215_040,
+  },
+  {
+    id: 'auto-loan',
+    path: ['Loans', 'Auto loan 3318'],
+    type: 'Folder',
+    modified: new Date(2026, 6, 2),
+  },
+  {
+    id: 'auto-payoff',
+    path: ['Loans', 'Auto loan 3318', 'Payoff quote.pdf'],
+    type: 'PDF',
+    modified: new Date(2026, 6, 2),
+    size: 52_224,
+  },
+  {
+    id: 'transactions-export',
+    path: ['Transactions Oct 2026.csv'],
+    type: 'CSV',
+    modified: new Date(2026, 10, 2),
+    size: 23_552,
+  },
+  {
+    id: 'direct-deposit',
+    path: ['Direct deposit form.pdf'],
+    type: 'PDF',
+    modified: new Date(2026, 2, 9),
+    size: 88_064,
+  },
+  {
+    id: 'beneficiary',
+    path: ['Beneficiaries.docx'],
+    type: 'Document',
+    modified: new Date(2025, 10, 18),
+    size: 36_864,
+  },
+];
+
+const fileCountOf = new Map(
+  documents
+    .filter((folder) => folder.type === 'Folder')
+    .map((folder) => [
+      folder.id,
+      documents.filter(
+        (doc) =>
+          doc.type !== 'Folder' &&
+          folder.path.every((segment, index) => doc.path[index] === segment),
+      ).length,
+    ]),
+);
+
+const sizeFormatter = new Intl.NumberFormat('en-US', { maximumFractionDigits: 1 });
+
+function formatSize(bytes: number) {
+  if (bytes < 1024) {
+    return `${sizeFormatter.format(bytes)} B`;
+  }
+  if (bytes < 1024 * 1024) {
+    return `${sizeFormatter.format(bytes / 1024)} KB`;
+  }
+  return `${sizeFormatter.format(bytes / (1024 * 1024))} MB`;
+}
+
+const columns: GridColDef<BankDocument>[] = [
+  { field: 'name', headerName: 'Name', valueGetter: (_, row) => row.path.at(-1) },
+  { field: 'type', headerName: 'Type', width: 120 },
+  { field: 'modified', headerName: 'Modified', type: 'date', width: 130 },
+  {
+    field: 'size',
+    headerName: 'Size',
+    type: 'number',
+    width: 100,
+    valueFormatter: (value) => (typeof value === 'number' ? formatSize(value) : ''),
+  },
+];
+
+const groupingColDef: DataGridProps<BankDocument>['groupingColDef'] = {
+  flex: 1,
+  minWidth: 240,
+  renderCell: ({ row }) => {
+    const { icon, color } = typeIcons[row.type];
+    const isFolder = row.type === 'Folder';
+    return (
+      <HStack space="sm" className="min-w-0 flex-1 items-center">
+        <Icon as={icon} color={color} />
+        <Text numberOfLines={1} color={isFolder ? 'action' : 'primary'}>
+          {isFolder
+            ? `${String(row.path.at(-1))} (${String(fileCountOf.get(row.id) ?? 0)})`
+            : row.path.at(-1)}
+        </Text>
+      </HStack>
+    );
+  },
+};
+
+const getTreeDataPath = (row: BankDocument) => row.path;
+const isGroupExpandedByDefault = ({ id }: GridTreeNodeParams<BankDocument>) =>
+  id === 'statements' || id === 'statements-2026';
+
+export default function DataGridTreeDataColumnsDemo() {
+  return (
+    <DataGrid
+      rows={documents}
+      columns={columns}
+      treeData
+      getTreeDataPath={getTreeDataPath}
+      groupingColDef={groupingColDef}
+      isGroupExpandedByDefault={isGroupExpandedByDefault}
+      aria-label="Documents"
+      className="h-130"
+    />
+  );
+}
+```
+
+With `checkboxSelection`, the checkbox sits in the tree column. By default, selecting a group selects its descendants, and a group is checked when all of its children are and shows a mixed state when only some are. Set `rowSelectionPropagation` to `{ descendants: false, parents: false }` to select rows independently. Selection is kept for rows that a filter hides, unlike MUI X, and select-all applies to the rows that match the filter.
+
+This picker shows each API as one rich row. `description` and `method` are hidden with `columnVisibilityModel` (see [Column visibility](#column-visibility)), so search also matches descriptions. The filter panel still lists the hidden `method` column, so filtering by method uses the panel that already exists.
+
+```tsx
+import { useState } from 'react';
+import { Chip, HStack, Text, VStack } from '@cdx-ui/components';
+import { DataGrid, type GridColDef, type GridRowSelectionModel } from '@cdx-ui/data-grid';
+
+type Method = 'GET' | 'POST' | 'PUT' | 'DELETE';
+
+// GridValidRowModel's index signature rejects otherwise equivalent interfaces.
+// eslint-disable-next-line @typescript-eslint/consistent-type-definitions
+type Api = {
+  id: string;
+  path: string[];
+  description: string;
+  method?: Method;
+};
+
+const methodColors: Record<Method, 'info' | 'success' | 'warning' | 'danger'> = {
+  GET: 'info',
+  POST: 'success',
+  PUT: 'warning',
+  DELETE: 'danger',
+};
+
+const apis: Api[] = [
+  { id: 'accounts', path: ['Accounts'], description: 'Account information and balances' },
+  { id: 'oauth', path: ['Accounts', 'OAuth V1'], description: 'Token-scoped account APIs' },
+  {
+    id: 'list-accounts',
+    path: ['Accounts', 'OAuth V1', 'List customer accounts'],
+    description: 'Returns every account the customer can see',
+    method: 'GET',
+  },
+  {
+    id: 'close-account',
+    path: ['Accounts', 'OAuth V1', 'Close account'],
+    description: 'Closes an account with a zero balance',
+    method: 'DELETE',
+  },
+  {
+    id: 'open-account',
+    path: ['Accounts', 'OAuth V1', 'Open account'],
+    description: 'Opens a new deposit account',
+    method: 'POST',
+  },
+  { id: 'balances', path: ['Accounts', 'Balances'], description: 'Real-time balance APIs' },
+  {
+    id: 'get-balance',
+    path: ['Accounts', 'Balances', 'Get balance'],
+    description: 'Returns the available and ledger balance',
+    method: 'GET',
+  },
+  { id: 'payments', path: ['Payments'], description: 'Transfers and bill pay' },
+  {
+    id: 'create-transfer',
+    path: ['Payments', 'Create transfer'],
+    description: 'Moves money between two accounts',
+    method: 'POST',
+  },
+  {
+    id: 'update-payee',
+    path: ['Payments', 'Update payee'],
+    description: 'Changes a bill pay payee',
+    method: 'PUT',
+  },
+];
+
+const columns: GridColDef<Api>[] = [
+  {
+    field: 'name',
+    headerName: 'APIs',
+    flex: 1,
+    minWidth: 280,
+    valueGetter: (_, row) => row.path.at(-1),
+    renderCell: ({ row }) => (
+      <HStack space="sm" className="flex-1 items-center">
+        <VStack className="min-w-0 flex-1">
+          <Text numberOfLines={1} weight="medium">
+            {row.path.at(-1)}
+          </Text>
+          <Text numberOfLines={1} color="secondary" size="sm">
+            {row.description}
+          </Text>
+        </VStack>
+        {row.method ? (
+          <Chip color={methodColors[row.method]} size="small">
+            <Chip.Label>{row.method}</Chip.Label>
+          </Chip>
+        ) : null}
+      </HStack>
+    ),
+  },
+  { field: 'description', headerName: 'Description' },
+  { field: 'method', headerName: 'Method' },
+];
+
+const columnVisibilityModel = { description: false, method: false };
+const endpointCount = apis.filter((api) => api.method).length;
+
+export default function DataGridTreeDataSelectionDemo() {
+  const [selection, setSelection] = useState<GridRowSelectionModel>({
+    type: 'include',
+    ids: new Set(['list-accounts', 'create-transfer']),
+  });
+  const selectedEndpoints = apis.filter((api) => api.method && selection.ids.has(api.id)).length;
+
+  return (
+    <DataGrid
+      rows={apis}
+      columns={columns}
+      columnVisibilityModel={columnVisibilityModel}
+      treeData
+      getTreeDataPath={(row) => row.path}
+      defaultGroupingExpansionDepth={1}
+      checkboxSelection
+      rowSelectionModel={selection}
+      onRowSelectionModelChange={setSelection}
+      showToolbar
+      toolbarActions={
+        <Text color="secondary" size="sm">
+          {`${selectedEndpoints.toString()} of ${endpointCount.toString()} endpoints selected`}
+        </Text>
+      }
+      hideFooter
+      aria-label="APIs"
+      className="h-130"
+    />
+  );
+}
+```
+
+## Detail panel
+
+Return content from `getDetailPanelContent` to add a toggle column at the start of the grid. Opening a row shows a panel under it that spans every column. Return `null` for rows that have no details, and those rows get no toggle. Use `defaultDetailPanelExpandedRowIds`, or control `detailPanelExpandedRowIds` with `onDetailPanelExpandedRowIdsChange`, to choose which panels are open. The panel grows to fit its content.
+
+The panel scrolls with the grid when it is wider than the viewport, so keep its content narrow enough to read without horizontal scrolling. When any column is pinned to start, the toggle column pins after the selection column.
+
+```tsx
+import { Button, Chip, HStack, Text, VStack } from '@cdx-ui/components';
+import { DataGrid, type GridColDef } from '@cdx-ui/data-grid';
+import { Check, Close, ContentCopy } from '@cdx-ui/icons';
+
+// GridValidRowModel's index signature rejects otherwise equivalent interfaces.
+// eslint-disable-next-line @typescript-eslint/consistent-type-definitions
+type AuditEvent = {
+  id: string;
+  time: string;
+  user: string;
+  category: 'Access' | 'Change';
+  domain: string;
+  eventType: string;
+  status: 'Success' | 'Failed';
+  details: [label: string, value: string][];
+};
+
+const events: AuditEvent[] = [
+  {
+    id: 'evt_8f2a6c91',
+    time: 'Jan 12, 2026, 11:51:06 AM',
+    user: 'Mary Jane',
+    category: 'Change',
+    domain: 'Track and publish',
+    eventType: 'Login',
+    status: 'Failed',
+    details: [
+      ['Event ID', 'evt_8f2a6c91'],
+      ['Organisation ID', 'org_acme'],
+      ['Category', 'change'],
+      ['Environment ID', 'env_production'],
+      ['Occurred at', '2026-01-12T11:51:06Z'],
+      ['Target collection', 'articles'],
+      ['Actor type', 'user'],
+      ['Version before', '12'],
+      ['User ID', 'usr_10482'],
+      ['Version after', '13'],
+      ['User email', 'mary.jane@example.com'],
+      ['Patch path', '/title'],
+      ['Correlation ID', 'req_7d4b9e23'],
+      ['HTTP status code', '403'],
+    ],
+  },
+  {
+    id: 'evt_51ab07e4',
+    time: 'Jan 12, 2026, 10:05:41 AM',
+    user: 'Peter Parker',
+    category: 'Access',
+    domain: 'Branding and theming',
+    eventType: 'History',
+    status: 'Success',
+    details: [
+      ['Event ID', 'evt_51ab07e4'],
+      ['Organisation ID', 'org_acme'],
+      ['Category', 'access'],
+      ['Environment ID', 'env_production'],
+      ['User ID', 'usr_20311'],
+      ['HTTP status code', '200'],
+    ],
+  },
+  {
+    id: 'evt_c3d94f10',
+    time: 'Jan 11, 2026, 4:18:22 PM',
+    user: 'Jane Cooper',
+    category: 'Access',
+    domain: 'Track and publish',
+    eventType: 'Login',
+    status: 'Success',
+    details: [
+      ['Event ID', 'evt_c3d94f10'],
+      ['Organisation ID', 'org_acme'],
+      ['User ID', 'usr_10077'],
+      ['HTTP status code', '200'],
+    ],
+  },
+];
+
+const columns: GridColDef<AuditEvent>[] = [
+  { field: 'time', headerName: 'Time', width: 220 },
+  { field: 'user', headerName: 'User', width: 140 },
+  {
+    field: 'category',
+    headerName: 'Category',
+    width: 120,
+    renderCell: ({ row }) => (
+      <Chip size="small" color={row.category === 'Access' ? 'info' : 'neutral'}>
+        <Chip.Label>{row.category}</Chip.Label>
+      </Chip>
+    ),
+  },
+  { field: 'domain', headerName: 'Domain', flex: 1, minWidth: 180 },
+  { field: 'eventType', headerName: 'Event type', width: 130 },
+  {
+    field: 'status',
+    headerName: 'Status',
+    width: 120,
+    renderCell: ({ row }) => (
+      <Chip size="small" color={row.status === 'Success' ? 'success' : 'danger'}>
+        <Chip.Icon as={row.status === 'Success' ? Check : Close} />
+        <Chip.Label>{row.status}</Chip.Label>
+      </Chip>
+    ),
+  },
+];
+
+function AuditEventDetails({ event }: { event: AuditEvent }) {
+  return (
+    <VStack space="md" className="rounded-lg bg-surface-secondary p-4">
+      <HStack className="flex-wrap">
+        {event.details.map(([label, value]) => (
+          <HStack key={label} space="md" className="w-1/2 py-1">
+            <Text color="secondary" size="sm" className="w-40">
+              {label}:
+            </Text>
+            <Text size="sm" className="flex-1">
+              {value}
+            </Text>
+          </HStack>
+        ))}
+      </HStack>
+      <Button
+        variant="outline"
+        size="small"
+        className="self-end"
+        onPress={() => {
+          void navigator.clipboard.writeText(
+            JSON.stringify(Object.fromEntries(event.details), null, 2),
+          );
+        }}
+      >
+        <Button.Icon as={ContentCopy} position="leading" />
+        <Button.Label>Copy</Button.Label>
+      </Button>
+    </VStack>
+  );
+}
+
+export default function DataGridDetailPanelDemo() {
+  return (
+    <DataGrid
+      rows={events}
+      columns={columns}
+      getDetailPanelContent={({ row }) => <AuditEventDetails event={row} />}
+      defaultDetailPanelExpandedRowIds={new Set(['evt_8f2a6c91'])}
+      hideFooter
+      aria-label="Audit log"
+      className="h-130"
+    />
+  );
+}
+```
+
 ## Column pinning
 
 Pass `pinnedColumns` with `start` and/or `end` field lists so key columns stay visible while the grid scrolls horizontally. Deprecated `left` / `right` keys are aliases for `start` / `end` (same mapping as `align`). MUI X `initialState.pinnedColumns` moves to the `pinnedColumns` prop.
@@ -1138,4 +1682,6 @@ sort. `valueOptions` is required when `type` is `singleSelect`.
 
 ## Accessibility
 
-The grid renders a semantic HTML table on web. Sortable headers expose `aria-sort`. Select-all and row checkboxes are labelled.
+The grid renders a semantic HTML table on web. Sortable headers expose `aria-sort`. Select-all and row checkboxes are labelled.
+
+Tree and detail panel toggles are buttons with `aria-expanded`, labelled with the row they open, such as "Expand OAuth V1, Accounts". A partly selected tree group exposes `aria-checked="mixed"`. Expanding or collapsing never moves focus. When a filter removes the row that had focus, focus moves to the toolbar search field if `showToolbar` is on. Closing the filter panel with Escape, Remove all, or by removing the last filter returns focus to the control that opened it. A press outside the panel closes it and leaves focus where it went. The grid keeps table semantics rather than `treegrid`, so screen readers do not announce the tree level; the toggle label names the row's ancestors instead.

package/docs/components/list-item/content.md

@@ -658,7 +658,7 @@ Group heading row with an optional accent top-border divider and an optional `su
 | `children` | `ReactNode` | — | Primary section label. String or number children are styled as an uppercase label. |
 | `asChild?` | `boolean` | — | Renders the consumer's child element in place of the default `View` host. |
 | `trailing?` | `ReactNode` | — | Optional right-aligned adornment (e.g. section Chip). |
-| `variant?` | `'ghost' \| 'subtle' \| 'gradient'` | `'ghost'` | Background treatment. `ghost` has no fill and a bottom border; `subtle` adds a neutral fill (matching `subtle` on Avatar, Chip, and IconButton) and drops the bottom border. `gradient` fades from the primary surface into a brand tint, left to right, and keeps the bottom border. Label typography is the same for all three. |
+| `variant?` | `'ghost' \| 'subtle' \| 'gradient'` | `'ghost'` | Background treatment. `ghost` has no fill and a bottom border; `subtle` adds a light neutral fill (`surface-neutral-tint`) and drops the bottom border. `gradient` fades from the primary surface into a brand tint, left to right, and keeps the bottom border. Label typography is the same for all three. |
 | `showDivider?` | `boolean` | `true` | Accent top border above the header. |
 
 Inherits all [`ViewProps`](https://reactnative.dev/docs/view#props).

package/docs/components/table/content.md

@@ -229,6 +229,90 @@ export default function TableRowActionsDemo() {
 }
 ```
 
+## Section rows
+
+Group rows under section titles, as in a permissions matrix, with one `Table.Body` per section. Start each body with a row holding a single `Table.Head` that has `scope="rowgroup"` and a `colSpan` covering every column, so screen readers announce the section for the rows beneath it. Use `scope="row"` on the first cell of each row and name the section in each checkbox label, such as "Edit Transfers, Payments", so every control stays distinct out of context. On native, `colSpan` merges the cells but `scope` is dropped.
+
+For sortable or filterable data with a hierarchy, use [`DataGrid` tree data](https://design.candescent.com/docs/components/data-grid/content.md#tree-data) instead.
+
+```tsx
+import { useState } from 'react';
+import { Checkbox, Table, Text } from '@cdx-ui/components';
+
+const actions = ['View', 'Edit', 'Delete'] as const;
+type Action = (typeof actions)[number];
+
+const sections = [
+  { title: 'Accounts', resources: ['Balances', 'Statements'] },
+  { title: 'Payments', resources: ['Transfers', 'Payees'] },
+] as const;
+
+export default function TableSectionRowsDemo() {
+  const [granted, setGranted] = useState<ReadonlySet<string>>(
+    new Set(['Balances:View', 'Transfers:View', 'Transfers:Edit']),
+  );
+
+  const toggle = (key: string) => {
+    setGranted((previous) => {
+      const next = new Set(previous);
+      if (next.has(key)) {
+        next.delete(key);
+      } else {
+        next.add(key);
+      }
+      return next;
+    });
+  };
+
+  return (
+    <Table>
+      <Table.Caption>Role permissions</Table.Caption>
+      <Table.Header>
+        <Table.Row>
+          <Table.Head>Resource</Table.Head>
+          {actions.map((action) => (
+            <Table.Head key={action} align="center">
+              {action}
+            </Table.Head>
+          ))}
+        </Table.Row>
+      </Table.Header>
+      {sections.map((section) => (
+        <Table.Body key={section.title}>
+          <Table.Row>
+            <Table.Head scope="rowgroup" colSpan={actions.length + 1}>
+              <Text size="sm" weight="semibold">
+                {section.title}
+              </Text>
+            </Table.Head>
+          </Table.Row>
+          {section.resources.map((resource) => (
+            <Table.Row key={resource}>
+              <Table.Head scope="row">{resource}</Table.Head>
+              {actions.map((action: Action) => {
+                const key = `${resource}:${action}`;
+                const label = `${action} ${resource}, ${section.title}`;
+                return (
+                  <Table.Cell key={action} align="center">
+                    <Checkbox
+                      value={key}
+                      isChecked={granted.has(key)}
+                      onChange={() => toggle(key)}
+                      accessibilityLabel={label}
+                      aria-label={label}
+                    />
+                  </Table.Cell>
+                );
+              })}
+            </Table.Row>
+          ))}
+        </Table.Body>
+      ))}
+    </Table>
+  );
+}
+```
+
 ## In card
 
 On mobile, a headerless table can present key-value summaries inside a card. Pair it with a compact visual summary built from layout primitives while chart components are unavailable, and keep the values in the table as the accessible source of detail.

package/docs/llms.txt

@@ -151,6 +151,7 @@ Links point at each page's `content.md`, which carries the page's prose, demo so
 
 ## Release notes
 
+- [0.3.12](resources/release-notes/0.3.12/content.md): DataGrid adds built-in column types, pinning, type-aware filters, and polarity or delta number cells.
 - [0.3.11](resources/release-notes/0.3.11/content.md): Read-only Input and CurrencyInput stay non-editable on Android instead of accepting edits again.
 - [0.3.10](resources/release-notes/0.3.10/content.md): CurrencyInput no longer clips the top of default-size amounts on iOS.
 - [0.3.9](resources/release-notes/0.3.9/content.md): DateRangePicker bottom sheets accept custom snap points, stack behavior, and fill; DataGrid keeps column headers within their bounds.

package/docs/resources/release-notes/0.3.12/content.md

@@ -0,0 +1,15 @@
+# 0.3.12 (https://design.candescent.com/docs/resources/release-notes/0.3.12)
+
+DataGrid adds built-in column types, pinning, type-aware filters, and polarity or delta number cells.
+
+This release expands **DataGrid** with typed columns, pinning, and richer filters, bumps the Uniwind styling layer used across Forge UI, and fixes clamped **[SystemAlert](https://design.candescent.com/docs/components/system-alert/content.md)** descriptions on web.
+
+## What's new
+
+**DataGrid** — Set a column `type` to get defaults for display, sorting, and editing instead of wiring everything by hand. Pin columns to the left or right edge of the viewport, use filter operators that match each column’s type, and render financial-style **polarity** and **delta** number cells for signed amounts and period-over-period change. The filter panel closes on outside presses (including Escape) while nested **[DatePicker](https://design.candescent.com/docs/components/date-picker/content.md)** and Select popovers stay usable, pinned-column edge lines extend through the footer on short grids, and overlay focus handling keeps the panel open when a nested control autofocuses on mount ([#958](https://github.com/dfh-candescent/forge-design-system/pull/958)).
+
+**Uniwind** — Forge UI packages move to a newer Uniwind release; **[Icon](https://design.candescent.com/docs/components/icon/content.md)** class handling is updated to match. If your app depends on Uniwind directly alongside `@cdx-ui/web` or `@cdx-ui/native`, align your Uniwind version with the one Forge UI pulls in to avoid duplicate or mismatched styling ([#891](https://github.com/dfh-candescent/forge-design-system/pull/891)).
+
+## Bug fixes
+
+**[SystemAlert](https://design.candescent.com/docs/components/system-alert/content.md)** — Multi-line descriptions with `numberOfLines` no longer show clipped text in the bottom padding on web ([#939](https://github.com/dfh-candescent/forge-design-system/pull/939)).

package/docs/resources/release-notes/content.md

@@ -8,6 +8,7 @@ Notes are generated from the release commit itself, so the versions and commit r
 each entry are exact. Releases that contained nothing but backlog or dependency bookkeeping
 are omitted.
 
+- [0.3.12](https://design.candescent.com/docs/resources/release-notes/0.3.12/content.md) — 2026-11-04 — DataGrid adds built-in column types, pinning, type-aware filters, and polarity or delta number cells.
 - [0.3.11](https://design.candescent.com/docs/resources/release-notes/0.3.11/content.md) — 2026-10-30 — Read-only Input and CurrencyInput stay non-editable on Android instead of accepting edits again.
 - [0.3.10](https://design.candescent.com/docs/resources/release-notes/0.3.10/content.md) — 2026-10-30 — CurrencyInput no longer clips the top of default-size amounts on iOS.
 - [0.3.9](https://design.candescent.com/docs/resources/release-notes/0.3.9/content.md) — 2026-10-29 — DateRangePicker bottom sheets accept custom snap points, stack behavior, and fill; DataGrid keeps column headers within their bounds.

package/lib/commonjs/components/CurrencyInput/styles.js

@@ -47,7 +47,7 @@ const currencyInputGhostFieldVariants = (0, _utils.cva)(['w-full bg-transparent
 
 // `outline` delegates to the Input shell so border, focus, invalid, disabled, and read-only
 // treatments (including the native `data-[field-state=...]` focus selectors) stay in one place.
-// Figma `outlined` spaces the symbol 8px from the amount, tighter than Input's 16px slot gap.
+// Figma `outline` spaces the symbol 8px from the amount, tighter than Input's 16px slot gap.
 const currencyInputRootVariants = ({
   variant = 'ghost',
   size = 'default'

package/lib/commonjs/components/ListItem/styles.js

@@ -125,7 +125,7 @@ const listItemSectionHeaderVariants = exports.listItemSectionHeaderVariants = (0
     variant: {
       ghost: [],
       // The fill separates the header from its rows, so the bottom border is dropped.
-      subtle: 'bg-surface-neutral-subtle border-b-0',
+      subtle: 'bg-surface-neutral-tint border-b-0',
       gradient: 'bg-gradient-to-r from-surface-primary to-surface-brand-tint'
     },
     showDivider: {

package/lib/commonjs/components/ListItem/styles.js.map

@@ -1 +1 @@
-{"version":3,"names":["_reactNative","require","_utils","_constants","listItemRootVariants","exports","cva","TRANSITION_COLORS","Platform","select","web","join","default","variants","size","compact","showSeparator","true","false","crossAlign","center","start","defaultVariants","listItemPressableRegionVariants","handlePosition","end","listItemLeadingSlotVariants","listItemTrailingSlotVariants","listItemDragHandleVariants","listItemContentVariants","listItemTitleVariants","listItemDescriptionVariants","listItemMetaVariants","listItemSectionHeaderVariants","variant","ghost","subtle","gradient","showDivider","listItemSectionHeaderLabelVariants"],"sourceRoot":"../../../../src","sources":["components/ListItem/styles.ts"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["_reactNative","require","_utils","_constants","listItemRootVariants","exports","cva","TRANSITION_COLORS","Platform","select","web","join","default","variants","size","compact","showSeparator","true","false","crossAlign","center","start","defaultVariants","listItemPressableRegionVariants","handlePosition","end","listItemLeadingSlotVariants","listItemTrailingSlotVariants","listItemDragHandleVariants","listItemContentVariants","listItemTitleVariants","listItemDescriptionVariants","listItemMetaVariants","listItemSectionHeaderVariants","variant","ghost","subtle","gradient","showDivider","listItemSectionHeaderLabelVariants"],"sourceRoot":"../../../../src","sources":["components/ListItem/styles.ts"],"mappings":"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","ignoreList":[]}

package/lib/commonjs/figma/CurrencyInput.figma.js

@@ -12,13 +12,13 @@ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e
 
 const instance = _figma.default.selectedInstance;
 
-// Figma names this component AmountInput. `hero` is the default `ghost` variant (large, centered
-// amount entry) and `outlined` is the bordered `outline` variant. The trailing slot has no code
+// Figma names this component AmountInput. `ghost` is the code default (large, centered amount
+// entry), so the prop is omitted; `outline` is the bordered variant. The trailing slot has no code
 // equivalent, so the snippet flags it rather than substituting another component.
 // `Viewport` only previews responsive type sizes.
 const variant = instance.getEnum('variant', {
   outline: 'outline',
-  hero: 'ghost'
+  ghost: undefined
 });
 const showTrailingSlot = instance.getBoolean('Show TrailingSlot?');
 const isInvalid = instance.getEnum('isInvalid', {
@@ -35,7 +35,7 @@ const isDisabled = instance.getEnum('isDisabled', {
 });
 const currencySymbol = instance.getString('currencySymbol');
 const amount = Number(instance.getString('value').replace(/[^0-9.]/g, ''));
-const variantProp = _figma.default.helpers.react.renderProp('variant', variant === 'outline' ? variant : undefined);
+const variantProp = _figma.default.helpers.react.renderProp('variant', variant);
 const valueProp = _figma.default.helpers.react.renderProp('value', Number.isFinite(amount) ? amount : 0);
 const currencySymbolProp = _figma.default.helpers.react.renderProp('currencySymbol', currencySymbol === '$' ? undefined : currencySymbol);
 const isInvalidProp = _figma.default.helpers.react.renderProp('isInvalid', isInvalid);

package/lib/commonjs/figma/CurrencyInput.figma.js.map

@@ -1 +1 @@
-{"version":3,"names":["_figma","_interopRequireDefault","require","e","__esModule","default","instance","figma","selectedInstance","variant","getEnum","outline","hero","showTrailingSlot","getBoolean","isInvalid","true","false","undefined","isReadOnly","isDisabled","currencySymbol","getString","amount","Number","replace","variantProp","helpers","react","renderProp","valueProp","isFinite","currencySymbolProp","isInvalidProp","isReadOnlyProp","isDisabledProp","_default","exports","id","imports","example","code"],"sourceRoot":"../../../src","sources":["figma/CurrencyInput.figma.ts"],"mappings":";;;;;;AAGA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AAA0B,SAAAD,uBAAAE,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAH1B;AACA;AACA;;AAGA,MAAMG,QAAQ,GAAGC,cAAK,CAACC,gBAAgB;;AAEvC;AACA;AACA;AACA;AACA,MAAMC,OAAO,GAAGH,QAAQ,CAACI,OAAO,CAAC,SAAS,EAAE;EAC1CC,OAAO,EAAE,SAAS;EAClBC,IAAI,EAAE;AACR,CAAC,CAAC;AACF,MAAMC,gBAAgB,GAAGP,QAAQ,CAACQ,UAAU,CAAC,oBAAoB,CAAC;AAElE,MAAMC,SAAS,GAAGT,QAAQ,CAACI,OAAO,CAAC,WAAW,EAAE;EAC9CM,IAAI,EAAE,IAAI;EACVC,KAAK,EAAEC;AACT,CAAC,CAAC;AACF,MAAMC,UAAU,GAAGb,QAAQ,CAACI,OAAO,CAAC,YAAY,EAAE;EAChDM,IAAI,EAAE,IAAI;EACVC,KAAK,EAAEC;AACT,CAAC,CAAC;AACF,MAAME,UAAU,GAAGd,QAAQ,CAACI,OAAO,CAAC,YAAY,EAAE;EAChDM,IAAI,EAAE,IAAI;EACVC,KAAK,EAAEC;AACT,CAAC,CAAC;AAEF,MAAMG,cAAc,GAAGf,QAAQ,CAACgB,SAAS,CAAC,gBAAgB,CAAC;AAC3D,MAAMC,MAAM,GAAGC,MAAM,CAAClB,QAAQ,CAACgB,SAAS,CAAC,OAAO,CAAC,CAACG,OAAO,CAAC,UAAU,EAAE,EAAE,CAAC,CAAC;AAE1E,MAAMC,WAAW,GAAGnB,cAAK,CAACoB,OAAO,CAACC,KAAK,CAACC,UAAU,CAChD,SAAS,EACTpB,OAAO,KAAK,SAAS,GAAGA,OAAO,GAAGS,SACpC,CAAC;AACD,MAAMY,SAAS,GAAGvB,cAAK,CAACoB,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,OAAO,EAAEL,MAAM,CAACO,QAAQ,CAACR,MAAM,CAAC,GAAGA,MAAM,GAAG,CAAC,CAAC;AAC/F,MAAMS,kBAAkB,GAAGzB,cAAK,CAACoB,OAAO,CAACC,KAAK,CAACC,UAAU,CACvD,gBAAgB,EAChBR,cAAc,KAAK,GAAG,GAAGH,SAAS,GAAGG,cACvC,CAAC;AACD,MAAMY,aAAa,GAAG1B,cAAK,CAACoB,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,WAAW,EAAEd,SAAS,CAAC;AAC5E,MAAMmB,cAAc,GAAG3B,cAAK,CAACoB,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,YAAY,EAAEV,UAAU,CAAC;AAC/E,MAAMgB,cAAc,GAAG5B,cAAK,CAACoB,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,YAAY,EAAET,UAAU,CAAC;AAAC,IAAAgB,QAAA,GAAAC,OAAA,CAAAhC,OAAA,GAEjE;EACbiC,EAAE,EAAE,gBAAgB;EACpBC,OAAO,EAAE,CAAC,oDAAoD,CAAC;EAC/DC,OAAO,EAAEjC,cAAK,CAACkC,IAAI;AACrB,EAAE5B,gBAAgB,GAAGN,cAAK,CAACkC,IAAI,kEAAkE,GAAG,IAAI;AACxG;AACA,+BAA+Bf,WAAW,GAAGI,SAAS,GAAGE,kBAAkB,GAAGC,aAAa,GAAGC,cAAc,GAAGC,cAAc;AAC7H;AACA;AACA,CAAC","ignoreList":[]}
+{"version":3,"names":["_figma","_interopRequireDefault","require","e","__esModule","default","instance","figma","selectedInstance","variant","getEnum","outline","ghost","undefined","showTrailingSlot","getBoolean","isInvalid","true","false","isReadOnly","isDisabled","currencySymbol","getString","amount","Number","replace","variantProp","helpers","react","renderProp","valueProp","isFinite","currencySymbolProp","isInvalidProp","isReadOnlyProp","isDisabledProp","_default","exports","id","imports","example","code"],"sourceRoot":"../../../src","sources":["figma/CurrencyInput.figma.ts"],"mappings":";;;;;;AAGA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AAA0B,SAAAD,uBAAAE,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAH1B;AACA;AACA;;AAGA,MAAMG,QAAQ,GAAGC,cAAK,CAACC,gBAAgB;;AAEvC;AACA;AACA;AACA;AACA,MAAMC,OAAO,GAAGH,QAAQ,CAACI,OAAO,CAAC,SAAS,EAAE;EAC1CC,OAAO,EAAE,SAAS;EAClBC,KAAK,EAAEC;AACT,CAAC,CAAC;AACF,MAAMC,gBAAgB,GAAGR,QAAQ,CAACS,UAAU,CAAC,oBAAoB,CAAC;AAElE,MAAMC,SAAS,GAAGV,QAAQ,CAACI,OAAO,CAAC,WAAW,EAAE;EAC9CO,IAAI,EAAE,IAAI;EACVC,KAAK,EAAEL;AACT,CAAC,CAAC;AACF,MAAMM,UAAU,GAAGb,QAAQ,CAACI,OAAO,CAAC,YAAY,EAAE;EAChDO,IAAI,EAAE,IAAI;EACVC,KAAK,EAAEL;AACT,CAAC,CAAC;AACF,MAAMO,UAAU,GAAGd,QAAQ,CAACI,OAAO,CAAC,YAAY,EAAE;EAChDO,IAAI,EAAE,IAAI;EACVC,KAAK,EAAEL;AACT,CAAC,CAAC;AAEF,MAAMQ,cAAc,GAAGf,QAAQ,CAACgB,SAAS,CAAC,gBAAgB,CAAC;AAC3D,MAAMC,MAAM,GAAGC,MAAM,CAAClB,QAAQ,CAACgB,SAAS,CAAC,OAAO,CAAC,CAACG,OAAO,CAAC,UAAU,EAAE,EAAE,CAAC,CAAC;AAE1E,MAAMC,WAAW,GAAGnB,cAAK,CAACoB,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,SAAS,EAAEpB,OAAO,CAAC;AACtE,MAAMqB,SAAS,GAAGvB,cAAK,CAACoB,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,OAAO,EAAEL,MAAM,CAACO,QAAQ,CAACR,MAAM,CAAC,GAAGA,MAAM,GAAG,CAAC,CAAC;AAC/F,MAAMS,kBAAkB,GAAGzB,cAAK,CAACoB,OAAO,CAACC,KAAK,CAACC,UAAU,CACvD,gBAAgB,EAChBR,cAAc,KAAK,GAAG,GAAGR,SAAS,GAAGQ,cACvC,CAAC;AACD,MAAMY,aAAa,GAAG1B,cAAK,CAACoB,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,WAAW,EAAEb,SAAS,CAAC;AAC5E,MAAMkB,cAAc,GAAG3B,cAAK,CAACoB,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,YAAY,EAAEV,UAAU,CAAC;AAC/E,MAAMgB,cAAc,GAAG5B,cAAK,CAACoB,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,YAAY,EAAET,UAAU,CAAC;AAAC,IAAAgB,QAAA,GAAAC,OAAA,CAAAhC,OAAA,GAEjE;EACbiC,EAAE,EAAE,gBAAgB;EACpBC,OAAO,EAAE,CAAC,oDAAoD,CAAC;EAC/DC,OAAO,EAAEjC,cAAK,CAACkC,IAAI;AACrB,EAAE3B,gBAAgB,GAAGP,cAAK,CAACkC,IAAI,kEAAkE,GAAG,IAAI;AACxG;AACA,+BAA+Bf,WAAW,GAAGI,SAAS,GAAGE,kBAAkB,GAAGC,aAAa,GAAGC,cAAc,GAAGC,cAAc;AAC7H;AACA;AACA,CAAC","ignoreList":[]}

package/lib/commonjs/figma/ProgressBar.figma.js

@@ -42,12 +42,15 @@ const isIndeterminate = instance.getEnum('isIndeterminate', {
   true: true,
   false: false
 });
-// Figma ships `color=default|inherit`. `default` is the brand/action fill (code default —
-// omit the prop). `inherit` has no code equivalent (ProgressBar has no currentColor mode).
-// When Figma adds severity/categorical options, extend this map to the public API values.
+// `action` is the code default, so the prop is omitted. When Figma adds the remaining
+// severity/categorical options, extend this map to the public API values.
 const color = instance.getEnum('color', {
-  default: undefined,
-  inherit: undefined
+  action: undefined,
+  danger: 'danger',
+  // No code equivalent: ProgressBar has no `inherit` (currentColor) mode, so the prop is omitted.
+  inherit: undefined,
+  // No code equivalent: ProgressBar has no `neutral` indicator color, so the prop is omitted.
+  neutral: undefined
 });
 const colorProp = _figma.default.helpers.react.renderProp('color', color);
 // Figma has no `size` variant yet. Code accepts `default` | `large` (see ProgressBarProps);

package/lib/commonjs/figma/ProgressBar.figma.js.map

@@ -1 +1 @@
-{"version":3,"names":["_figma","_interopRequireDefault","require","e","__esModule","default","instance","figma","selectedInstance","value","getEnum","isIndeterminate","true","false","color","undefined","inherit","colorProp","helpers","react","renderProp","_default","exports","id","imports","example","code"],"sourceRoot":"../../../src","sources":["figma/ProgressBar.figma.ts"],"mappings":";;;;;;AAGA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AAA0B,SAAAD,uBAAAE,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAH1B;AACA;AACA;;AAGA,MAAMG,QAAQ,GAAGC,cAAK,CAACC,gBAAgB;;AAEvC;AACA,MAAMC,KAAK,GAAGH,QAAQ,CAACI,OAAO,CAAC,OAAO,EAAE;EACtC,GAAG,EAAE,CAAC;EACN,MAAM,EAAE,CAAC;EACT,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,KAAK,EAAE,EAAE;EACT,OAAO,EAAE,EAAE;EACX,MAAM,EAAE,EAAE;EACV,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,OAAO,EAAE,EAAE;EACX,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,GAAG,EAAE;AACP,CAAC,CAAC;AACF,MAAMC,eAAe,GAAGL,QAAQ,CAACI,OAAO,CAAC,iBAAiB,EAAE;EAC1DE,IAAI,EAAE,IAAI;EACVC,KAAK,EAAE;AACT,CAAC,CAAC;AACF;AACA;AACA;AACA,MAAMC,KAAK,GAAGR,QAAQ,CAACI,OAAO,CAAC,OAAO,EAAE;EACtCL,OAAO,EAAEU,SAAS;EAClBC,OAAO,EAAED;AACX,CAAC,CAAC;AACF,MAAME,SAAS,GAAGV,cAAK,CAACW,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,OAAO,EAAEN,KAAK,CAAC;AAChE;AACA;AAAA,IAAAO,QAAA,GAAAC,OAAA,CAAAjB,OAAA,GAEe;EACbkB,EAAE,EAAE,cAAc;EAClBC,OAAO,EAAE,CAAC,kDAAkD,CAAC;EAC7DC,OAAO,EAAElB,cAAK,CAACmB,IAAI;AACrB,sBAAsBf,eAAe,GAAG,MAAM,GAAGF,KAAK,IAAIQ,SAAS;AACnE;AACA;AACA,CAAC","ignoreList":[]}
+{"version":3,"names":["_figma","_interopRequireDefault","require","e","__esModule","default","instance","figma","selectedInstance","value","getEnum","isIndeterminate","true","false","color","action","undefined","danger","inherit","neutral","colorProp","helpers","react","renderProp","_default","exports","id","imports","example","code"],"sourceRoot":"../../../src","sources":["figma/ProgressBar.figma.ts"],"mappings":";;;;;;AAGA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AAA0B,SAAAD,uBAAAE,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAH1B;AACA;AACA;;AAGA,MAAMG,QAAQ,GAAGC,cAAK,CAACC,gBAAgB;;AAEvC;AACA,MAAMC,KAAK,GAAGH,QAAQ,CAACI,OAAO,CAAC,OAAO,EAAE;EACtC,GAAG,EAAE,CAAC;EACN,MAAM,EAAE,CAAC;EACT,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,KAAK,EAAE,EAAE;EACT,OAAO,EAAE,EAAE;EACX,MAAM,EAAE,EAAE;EACV,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,OAAO,EAAE,EAAE;EACX,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,GAAG,EAAE;AACP,CAAC,CAAC;AACF,MAAMC,eAAe,GAAGL,QAAQ,CAACI,OAAO,CAAC,iBAAiB,EAAE;EAC1DE,IAAI,EAAE,IAAI;EACVC,KAAK,EAAE;AACT,CAAC,CAAC;AACF;AACA;AACA,MAAMC,KAAK,GAAGR,QAAQ,CAACI,OAAO,CAAC,OAAO,EAAE;EACtCK,MAAM,EAAEC,SAAS;EACjBC,MAAM,EAAE,QAAQ;EAChB;EACAC,OAAO,EAAEF,SAAS;EAClB;EACAG,OAAO,EAAEH;AACX,CAAC,CAAC;AACF,MAAMI,SAAS,GAAGb,cAAK,CAACc,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,OAAO,EAAET,KAAK,CAAC;AAChE;AACA;AAAA,IAAAU,QAAA,GAAAC,OAAA,CAAApB,OAAA,GAEe;EACbqB,EAAE,EAAE,cAAc;EAClBC,OAAO,EAAE,CAAC,kDAAkD,CAAC;EAC7DC,OAAO,EAAErB,cAAK,CAACsB,IAAI;AACrB,sBAAsBlB,eAAe,GAAG,MAAM,GAAGF,KAAK,IAAIW,SAAS;AACnE;AACA;AACA,CAAC","ignoreList":[]}

package/lib/commonjs/figma/ProgressCircle.figma.js

@@ -11,9 +11,15 @@ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e
 // component=ProgressCircle
 
 const instance = _figma.default.selectedInstance;
+
+// Figma `action` is the code `default` stroke (action tokens), so the prop is omitted.
 const color = instance.getEnum('color', {
-  default: undefined,
-  inherit: 'inherit'
+  action: undefined,
+  // No code equivalent: ProgressCircle has no `danger` color, so the prop is omitted.
+  danger: undefined,
+  inherit: 'inherit',
+  // No code equivalent: ProgressCircle has no `neutral` color, so the prop is omitted.
+  neutral: undefined
 });
 // The code only ships `large` and `small`; Figma `tiny` has no code size, so the snippet flags it
 // instead of silently substituting another size.

package/lib/commonjs/figma/ProgressCircle.figma.js.map

@@ -1 +1 @@
-{"version":3,"names":["_figma","_interopRequireDefault","require","e","__esModule","default","instance","figma","selectedInstance","color","getEnum","undefined","inherit","size","large","small","tiny","isTiny","value","isIndeterminate","true","false","sizeProp","helpers","react","renderProp","colorProp","_default","exports","id","imports","example","code","metadata","nestable"],"sourceRoot":"../../../src","sources":["figma/ProgressCircle.figma.ts"],"mappings":";;;;;;AAGA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AAA0B,SAAAD,uBAAAE,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAH1B;AACA;AACA;;AAGA,MAAMG,QAAQ,GAAGC,cAAK,CAACC,gBAAgB;AAEvC,MAAMC,KAAK,GAAGH,QAAQ,CAACI,OAAO,CAAC,OAAO,EAAE;EACtCL,OAAO,EAAEM,SAAS;EAClBC,OAAO,EAAE;AACX,CAAC,CAAC;AACF;AACA;AACA,MAAMC,IAAI,GAAGP,QAAQ,CAACI,OAAO,CAAC,MAAM,EAAE;EACpCI,KAAK,EAAEH,SAAS;EAChBI,KAAK,EAAE,OAAO;EACdC,IAAI,EAAEL;AACR,CAAC,CAAC;AACF,MAAMM,MAAM,GAAGX,QAAQ,CAACI,OAAO,CAAC,MAAM,EAAE;EACtCI,KAAK,EAAE,KAAK;EACZC,KAAK,EAAE,KAAK;EACZC,IAAI,EAAE;AACR,CAAC,CAAC;AACF;AACA;AACA,MAAME,KAAK,GAAGZ,QAAQ,CAACI,OAAO,CAAC,OAAO,EAAE;EACtC,GAAG,EAAE,CAAC;EACN,MAAM,EAAE,CAAC;EACT,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,GAAG,EAAE;AACP,CAAC,CAAC;AACF,MAAMS,eAAe,GAAGb,QAAQ,CAACI,OAAO,CAAC,iBAAiB,EAAE;EAC1DU,IAAI,EAAE,IAAI;EACVC,KAAK,EAAE;AACT,CAAC,CAAC;AAEF,MAAMC,QAAQ,GAAGf,cAAK,CAACgB,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,MAAM,EAAEZ,IAAI,CAAC;AAC7D,MAAMa,SAAS,GAAGnB,cAAK,CAACgB,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,OAAO,EAAEhB,KAAK,CAAC;AAAC,IAAAkB,QAAA,GAAAC,OAAA,CAAAvB,OAAA,GAElD;EACbwB,EAAE,EAAE,iBAAiB;EACrBC,OAAO,EAAE,CAAC,qDAAqD,CAAC;EAChEC,OAAO,EAAExB,cAAK,CAACyB,IAAI;AACrB,EAAEf,MAAM,GAAGV,cAAK,CAACyB,IAAI,gGAAgG,GAAG,IAAI;AAC5H,yBAAyBb,eAAe,GAAG,MAAM,GAAGD,KAAK,IAAII,QAAQ,GAAGI,SAAS;AACjF;AACA,kBAAkB;EAChBO,QAAQ,EAAE;IAAEC,QAAQ,EAAE;EAAK;AAC7B,CAAC","ignoreList":[]}
+{"version":3,"names":["_figma","_interopRequireDefault","require","e","__esModule","default","instance","figma","selectedInstance","color","getEnum","action","undefined","danger","inherit","neutral","size","large","small","tiny","isTiny","value","isIndeterminate","true","false","sizeProp","helpers","react","renderProp","colorProp","_default","exports","id","imports","example","code","metadata","nestable"],"sourceRoot":"../../../src","sources":["figma/ProgressCircle.figma.ts"],"mappings":";;;;;;AAGA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AAA0B,SAAAD,uBAAAE,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAH1B;AACA;AACA;;AAGA,MAAMG,QAAQ,GAAGC,cAAK,CAACC,gBAAgB;;AAEvC;AACA,MAAMC,KAAK,GAAGH,QAAQ,CAACI,OAAO,CAAC,OAAO,EAAE;EACtCC,MAAM,EAAEC,SAAS;EACjB;EACAC,MAAM,EAAED,SAAS;EACjBE,OAAO,EAAE,SAAS;EAClB;EACAC,OAAO,EAAEH;AACX,CAAC,CAAC;AACF;AACA;AACA,MAAMI,IAAI,GAAGV,QAAQ,CAACI,OAAO,CAAC,MAAM,EAAE;EACpCO,KAAK,EAAEL,SAAS;EAChBM,KAAK,EAAE,OAAO;EACdC,IAAI,EAAEP;AACR,CAAC,CAAC;AACF,MAAMQ,MAAM,GAAGd,QAAQ,CAACI,OAAO,CAAC,MAAM,EAAE;EACtCO,KAAK,EAAE,KAAK;EACZC,KAAK,EAAE,KAAK;EACZC,IAAI,EAAE;AACR,CAAC,CAAC;AACF;AACA;AACA,MAAME,KAAK,GAAGf,QAAQ,CAACI,OAAO,CAAC,OAAO,EAAE;EACtC,GAAG,EAAE,CAAC;EACN,MAAM,EAAE,CAAC;EACT,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,GAAG,EAAE;AACP,CAAC,CAAC;AACF,MAAMY,eAAe,GAAGhB,QAAQ,CAACI,OAAO,CAAC,iBAAiB,EAAE;EAC1Da,IAAI,EAAE,IAAI;EACVC,KAAK,EAAE;AACT,CAAC,CAAC;AAEF,MAAMC,QAAQ,GAAGlB,cAAK,CAACmB,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,MAAM,EAAEZ,IAAI,CAAC;AAC7D,MAAMa,SAAS,GAAGtB,cAAK,CAACmB,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,OAAO,EAAEnB,KAAK,CAAC;AAAC,IAAAqB,QAAA,GAAAC,OAAA,CAAA1B,OAAA,GAElD;EACb2B,EAAE,EAAE,iBAAiB;EACrBC,OAAO,EAAE,CAAC,qDAAqD,CAAC;EAChEC,OAAO,EAAE3B,cAAK,CAAC4B,IAAI;AACrB,EAAEf,MAAM,GAAGb,cAAK,CAAC4B,IAAI,gGAAgG,GAAG,IAAI;AAC5H,yBAAyBb,eAAe,GAAG,MAAM,GAAGD,KAAK,IAAII,QAAQ,GAAGI,SAAS;AACjF;AACA,kBAAkB;EAChBO,QAAQ,EAAE;IAAEC,QAAQ,EAAE;EAAK;AAC7B,CAAC","ignoreList":[]}

package/lib/module/components/CurrencyInput/styles.js

@@ -43,7 +43,7 @@ const currencyInputGhostFieldVariants = cva(['w-full bg-transparent p-0', 'place
 
 // `outline` delegates to the Input shell so border, focus, invalid, disabled, and read-only
 // treatments (including the native `data-[field-state=...]` focus selectors) stay in one place.
-// Figma `outlined` spaces the symbol 8px from the amount, tighter than Input's 16px slot gap.
+// Figma `outline` spaces the symbol 8px from the amount, tighter than Input's 16px slot gap.
 export const currencyInputRootVariants = ({
   variant = 'ghost',
   size = 'default'

package/lib/module/components/ListItem/styles.js

@@ -122,7 +122,7 @@ export const listItemSectionHeaderVariants = cva(['flex-row items-center justify
     variant: {
       ghost: [],
       // The fill separates the header from its rows, so the bottom border is dropped.
-      subtle: 'bg-surface-neutral-subtle border-b-0',
+      subtle: 'bg-surface-neutral-tint border-b-0',
       gradient: 'bg-gradient-to-r from-surface-primary to-surface-brand-tint'
     },
     showDivider: {

package/lib/module/components/ListItem/styles.js.map

@@ -1 +1 @@
-{"version":3,"names":["Platform","cva","TRANSITION_COLORS","listItemRootVariants","select","web","join","default","variants","size","compact","showSeparator","true","false","crossAlign","center","start","defaultVariants","listItemPressableRegionVariants","handlePosition","end","listItemLeadingSlotVariants","listItemTrailingSlotVariants","listItemDragHandleVariants","listItemContentVariants","listItemTitleVariants","listItemDescriptionVariants","listItemMetaVariants","listItemSectionHeaderVariants","variant","ghost","subtle","gradient","showDivider","listItemSectionHeaderLabelVariants"],"sourceRoot":"../../../../src","sources":["components/ListItem/styles.ts"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["Platform","cva","TRANSITION_COLORS","listItemRootVariants","select","web","join","default","variants","size","compact","showSeparator","true","false","crossAlign","center","start","defaultVariants","listItemPressableRegionVariants","handlePosition","end","listItemLeadingSlotVariants","listItemTrailingSlotVariants","listItemDragHandleVariants","listItemContentVariants","listItemTitleVariants","listItemDescriptionVariants","listItemMetaVariants","listItemSectionHeaderVariants","variant","ghost","subtle","gradient","showDivider","listItemSectionHeaderLabelVariants"],"sourceRoot":"../../../../src","sources":["components/ListItem/styles.ts"],"mappings":"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","ignoreList":[]}

package/lib/module/figma/CurrencyInput.figma.js

@@ -6,13 +6,13 @@
 import figma from 'figma';
 const instance = figma.selectedInstance;
 
-// Figma names this component AmountInput. `hero` is the default `ghost` variant (large, centered
-// amount entry) and `outlined` is the bordered `outline` variant. The trailing slot has no code
+// Figma names this component AmountInput. `ghost` is the code default (large, centered amount
+// entry), so the prop is omitted; `outline` is the bordered variant. The trailing slot has no code
 // equivalent, so the snippet flags it rather than substituting another component.
 // `Viewport` only previews responsive type sizes.
 const variant = instance.getEnum('variant', {
   outline: 'outline',
-  hero: 'ghost'
+  ghost: undefined
 });
 const showTrailingSlot = instance.getBoolean('Show TrailingSlot?');
 const isInvalid = instance.getEnum('isInvalid', {
@@ -29,7 +29,7 @@ const isDisabled = instance.getEnum('isDisabled', {
 });
 const currencySymbol = instance.getString('currencySymbol');
 const amount = Number(instance.getString('value').replace(/[^0-9.]/g, ''));
-const variantProp = figma.helpers.react.renderProp('variant', variant === 'outline' ? variant : undefined);
+const variantProp = figma.helpers.react.renderProp('variant', variant);
 const valueProp = figma.helpers.react.renderProp('value', Number.isFinite(amount) ? amount : 0);
 const currencySymbolProp = figma.helpers.react.renderProp('currencySymbol', currencySymbol === '$' ? undefined : currencySymbol);
 const isInvalidProp = figma.helpers.react.renderProp('isInvalid', isInvalid);

package/lib/module/figma/CurrencyInput.figma.js.map

@@ -1 +1 @@
-{"version":3,"names":["figma","instance","selectedInstance","variant","getEnum","outline","hero","showTrailingSlot","getBoolean","isInvalid","true","false","undefined","isReadOnly","isDisabled","currencySymbol","getString","amount","Number","replace","variantProp","helpers","react","renderProp","valueProp","isFinite","currencySymbolProp","isInvalidProp","isReadOnlyProp","isDisabledProp","id","imports","example","code"],"sourceRoot":"../../../src","sources":["figma/CurrencyInput.figma.ts"],"mappings":";;AAAA;AACA;AACA;AACA,OAAOA,KAAK,MAAM,OAAO;AAEzB,MAAMC,QAAQ,GAAGD,KAAK,CAACE,gBAAgB;;AAEvC;AACA;AACA;AACA;AACA,MAAMC,OAAO,GAAGF,QAAQ,CAACG,OAAO,CAAC,SAAS,EAAE;EAC1CC,OAAO,EAAE,SAAS;EAClBC,IAAI,EAAE;AACR,CAAC,CAAC;AACF,MAAMC,gBAAgB,GAAGN,QAAQ,CAACO,UAAU,CAAC,oBAAoB,CAAC;AAElE,MAAMC,SAAS,GAAGR,QAAQ,CAACG,OAAO,CAAC,WAAW,EAAE;EAC9CM,IAAI,EAAE,IAAI;EACVC,KAAK,EAAEC;AACT,CAAC,CAAC;AACF,MAAMC,UAAU,GAAGZ,QAAQ,CAACG,OAAO,CAAC,YAAY,EAAE;EAChDM,IAAI,EAAE,IAAI;EACVC,KAAK,EAAEC;AACT,CAAC,CAAC;AACF,MAAME,UAAU,GAAGb,QAAQ,CAACG,OAAO,CAAC,YAAY,EAAE;EAChDM,IAAI,EAAE,IAAI;EACVC,KAAK,EAAEC;AACT,CAAC,CAAC;AAEF,MAAMG,cAAc,GAAGd,QAAQ,CAACe,SAAS,CAAC,gBAAgB,CAAC;AAC3D,MAAMC,MAAM,GAAGC,MAAM,CAACjB,QAAQ,CAACe,SAAS,CAAC,OAAO,CAAC,CAACG,OAAO,CAAC,UAAU,EAAE,EAAE,CAAC,CAAC;AAE1E,MAAMC,WAAW,GAAGpB,KAAK,CAACqB,OAAO,CAACC,KAAK,CAACC,UAAU,CAChD,SAAS,EACTpB,OAAO,KAAK,SAAS,GAAGA,OAAO,GAAGS,SACpC,CAAC;AACD,MAAMY,SAAS,GAAGxB,KAAK,CAACqB,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,OAAO,EAAEL,MAAM,CAACO,QAAQ,CAACR,MAAM,CAAC,GAAGA,MAAM,GAAG,CAAC,CAAC;AAC/F,MAAMS,kBAAkB,GAAG1B,KAAK,CAACqB,OAAO,CAACC,KAAK,CAACC,UAAU,CACvD,gBAAgB,EAChBR,cAAc,KAAK,GAAG,GAAGH,SAAS,GAAGG,cACvC,CAAC;AACD,MAAMY,aAAa,GAAG3B,KAAK,CAACqB,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,WAAW,EAAEd,SAAS,CAAC;AAC5E,MAAMmB,cAAc,GAAG5B,KAAK,CAACqB,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,YAAY,EAAEV,UAAU,CAAC;AAC/E,MAAMgB,cAAc,GAAG7B,KAAK,CAACqB,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,YAAY,EAAET,UAAU,CAAC;AAE/E,eAAe;EACbgB,EAAE,EAAE,gBAAgB;EACpBC,OAAO,EAAE,CAAC,oDAAoD,CAAC;EAC/DC,OAAO,EAAEhC,KAAK,CAACiC,IAAI;AACrB,EAAE1B,gBAAgB,GAAGP,KAAK,CAACiC,IAAI,kEAAkE,GAAG,IAAI;AACxG;AACA,+BAA+Bb,WAAW,GAAGI,SAAS,GAAGE,kBAAkB,GAAGC,aAAa,GAAGC,cAAc,GAAGC,cAAc;AAC7H;AACA;AACA,CAAC","ignoreList":[]}
+{"version":3,"names":["figma","instance","selectedInstance","variant","getEnum","outline","ghost","undefined","showTrailingSlot","getBoolean","isInvalid","true","false","isReadOnly","isDisabled","currencySymbol","getString","amount","Number","replace","variantProp","helpers","react","renderProp","valueProp","isFinite","currencySymbolProp","isInvalidProp","isReadOnlyProp","isDisabledProp","id","imports","example","code"],"sourceRoot":"../../../src","sources":["figma/CurrencyInput.figma.ts"],"mappings":";;AAAA;AACA;AACA;AACA,OAAOA,KAAK,MAAM,OAAO;AAEzB,MAAMC,QAAQ,GAAGD,KAAK,CAACE,gBAAgB;;AAEvC;AACA;AACA;AACA;AACA,MAAMC,OAAO,GAAGF,QAAQ,CAACG,OAAO,CAAC,SAAS,EAAE;EAC1CC,OAAO,EAAE,SAAS;EAClBC,KAAK,EAAEC;AACT,CAAC,CAAC;AACF,MAAMC,gBAAgB,GAAGP,QAAQ,CAACQ,UAAU,CAAC,oBAAoB,CAAC;AAElE,MAAMC,SAAS,GAAGT,QAAQ,CAACG,OAAO,CAAC,WAAW,EAAE;EAC9CO,IAAI,EAAE,IAAI;EACVC,KAAK,EAAEL;AACT,CAAC,CAAC;AACF,MAAMM,UAAU,GAAGZ,QAAQ,CAACG,OAAO,CAAC,YAAY,EAAE;EAChDO,IAAI,EAAE,IAAI;EACVC,KAAK,EAAEL;AACT,CAAC,CAAC;AACF,MAAMO,UAAU,GAAGb,QAAQ,CAACG,OAAO,CAAC,YAAY,EAAE;EAChDO,IAAI,EAAE,IAAI;EACVC,KAAK,EAAEL;AACT,CAAC,CAAC;AAEF,MAAMQ,cAAc,GAAGd,QAAQ,CAACe,SAAS,CAAC,gBAAgB,CAAC;AAC3D,MAAMC,MAAM,GAAGC,MAAM,CAACjB,QAAQ,CAACe,SAAS,CAAC,OAAO,CAAC,CAACG,OAAO,CAAC,UAAU,EAAE,EAAE,CAAC,CAAC;AAE1E,MAAMC,WAAW,GAAGpB,KAAK,CAACqB,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,SAAS,EAAEpB,OAAO,CAAC;AACtE,MAAMqB,SAAS,GAAGxB,KAAK,CAACqB,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,OAAO,EAAEL,MAAM,CAACO,QAAQ,CAACR,MAAM,CAAC,GAAGA,MAAM,GAAG,CAAC,CAAC;AAC/F,MAAMS,kBAAkB,GAAG1B,KAAK,CAACqB,OAAO,CAACC,KAAK,CAACC,UAAU,CACvD,gBAAgB,EAChBR,cAAc,KAAK,GAAG,GAAGR,SAAS,GAAGQ,cACvC,CAAC;AACD,MAAMY,aAAa,GAAG3B,KAAK,CAACqB,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,WAAW,EAAEb,SAAS,CAAC;AAC5E,MAAMkB,cAAc,GAAG5B,KAAK,CAACqB,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,YAAY,EAAEV,UAAU,CAAC;AAC/E,MAAMgB,cAAc,GAAG7B,KAAK,CAACqB,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,YAAY,EAAET,UAAU,CAAC;AAE/E,eAAe;EACbgB,EAAE,EAAE,gBAAgB;EACpBC,OAAO,EAAE,CAAC,oDAAoD,CAAC;EAC/DC,OAAO,EAAEhC,KAAK,CAACiC,IAAI;AACrB,EAAEzB,gBAAgB,GAAGR,KAAK,CAACiC,IAAI,kEAAkE,GAAG,IAAI;AACxG;AACA,+BAA+Bb,WAAW,GAAGI,SAAS,GAAGE,kBAAkB,GAAGC,aAAa,GAAGC,cAAc,GAAGC,cAAc;AAC7H;AACA;AACA,CAAC","ignoreList":[]}

package/lib/module/figma/ProgressBar.figma.js

@@ -36,12 +36,15 @@ const isIndeterminate = instance.getEnum('isIndeterminate', {
   true: true,
   false: false
 });
-// Figma ships `color=default|inherit`. `default` is the brand/action fill (code default —
-// omit the prop). `inherit` has no code equivalent (ProgressBar has no currentColor mode).
-// When Figma adds severity/categorical options, extend this map to the public API values.
+// `action` is the code default, so the prop is omitted. When Figma adds the remaining
+// severity/categorical options, extend this map to the public API values.
 const color = instance.getEnum('color', {
-  default: undefined,
-  inherit: undefined
+  action: undefined,
+  danger: 'danger',
+  // No code equivalent: ProgressBar has no `inherit` (currentColor) mode, so the prop is omitted.
+  inherit: undefined,
+  // No code equivalent: ProgressBar has no `neutral` indicator color, so the prop is omitted.
+  neutral: undefined
 });
 const colorProp = figma.helpers.react.renderProp('color', color);
 // Figma has no `size` variant yet. Code accepts `default` | `large` (see ProgressBarProps);

package/lib/module/figma/ProgressBar.figma.js.map

@@ -1 +1 @@
-{"version":3,"names":["figma","instance","selectedInstance","value","getEnum","isIndeterminate","true","false","color","default","undefined","inherit","colorProp","helpers","react","renderProp","id","imports","example","code"],"sourceRoot":"../../../src","sources":["figma/ProgressBar.figma.ts"],"mappings":";;AAAA;AACA;AACA;AACA,OAAOA,KAAK,MAAM,OAAO;AAEzB,MAAMC,QAAQ,GAAGD,KAAK,CAACE,gBAAgB;;AAEvC;AACA,MAAMC,KAAK,GAAGF,QAAQ,CAACG,OAAO,CAAC,OAAO,EAAE;EACtC,GAAG,EAAE,CAAC;EACN,MAAM,EAAE,CAAC;EACT,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,KAAK,EAAE,EAAE;EACT,OAAO,EAAE,EAAE;EACX,MAAM,EAAE,EAAE;EACV,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,OAAO,EAAE,EAAE;EACX,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,GAAG,EAAE;AACP,CAAC,CAAC;AACF,MAAMC,eAAe,GAAGJ,QAAQ,CAACG,OAAO,CAAC,iBAAiB,EAAE;EAC1DE,IAAI,EAAE,IAAI;EACVC,KAAK,EAAE;AACT,CAAC,CAAC;AACF;AACA;AACA;AACA,MAAMC,KAAK,GAAGP,QAAQ,CAACG,OAAO,CAAC,OAAO,EAAE;EACtCK,OAAO,EAAEC,SAAS;EAClBC,OAAO,EAAED;AACX,CAAC,CAAC;AACF,MAAME,SAAS,GAAGZ,KAAK,CAACa,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,OAAO,EAAEP,KAAK,CAAC;AAChE;AACA;;AAEA,eAAe;EACbQ,EAAE,EAAE,cAAc;EAClBC,OAAO,EAAE,CAAC,kDAAkD,CAAC;EAC7DC,OAAO,EAAElB,KAAK,CAACmB,IAAI;AACrB,sBAAsBd,eAAe,GAAG,MAAM,GAAGF,KAAK,IAAIS,SAAS;AACnE;AACA;AACA,CAAC","ignoreList":[]}
+{"version":3,"names":["figma","instance","selectedInstance","value","getEnum","isIndeterminate","true","false","color","action","undefined","danger","inherit","neutral","colorProp","helpers","react","renderProp","id","imports","example","code"],"sourceRoot":"../../../src","sources":["figma/ProgressBar.figma.ts"],"mappings":";;AAAA;AACA;AACA;AACA,OAAOA,KAAK,MAAM,OAAO;AAEzB,MAAMC,QAAQ,GAAGD,KAAK,CAACE,gBAAgB;;AAEvC;AACA,MAAMC,KAAK,GAAGF,QAAQ,CAACG,OAAO,CAAC,OAAO,EAAE;EACtC,GAAG,EAAE,CAAC;EACN,MAAM,EAAE,CAAC;EACT,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,KAAK,EAAE,EAAE;EACT,OAAO,EAAE,EAAE;EACX,MAAM,EAAE,EAAE;EACV,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,OAAO,EAAE,EAAE;EACX,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,GAAG,EAAE;AACP,CAAC,CAAC;AACF,MAAMC,eAAe,GAAGJ,QAAQ,CAACG,OAAO,CAAC,iBAAiB,EAAE;EAC1DE,IAAI,EAAE,IAAI;EACVC,KAAK,EAAE;AACT,CAAC,CAAC;AACF;AACA;AACA,MAAMC,KAAK,GAAGP,QAAQ,CAACG,OAAO,CAAC,OAAO,EAAE;EACtCK,MAAM,EAAEC,SAAS;EACjBC,MAAM,EAAE,QAAQ;EAChB;EACAC,OAAO,EAAEF,SAAS;EAClB;EACAG,OAAO,EAAEH;AACX,CAAC,CAAC;AACF,MAAMI,SAAS,GAAGd,KAAK,CAACe,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,OAAO,EAAET,KAAK,CAAC;AAChE;AACA;;AAEA,eAAe;EACbU,EAAE,EAAE,cAAc;EAClBC,OAAO,EAAE,CAAC,kDAAkD,CAAC;EAC7DC,OAAO,EAAEpB,KAAK,CAACqB,IAAI;AACrB,sBAAsBhB,eAAe,GAAG,MAAM,GAAGF,KAAK,IAAIW,SAAS;AACnE;AACA;AACA,CAAC","ignoreList":[]}

package/lib/module/figma/ProgressCircle.figma.js

@@ -5,9 +5,15 @@
 // component=ProgressCircle
 import figma from 'figma';
 const instance = figma.selectedInstance;
+
+// Figma `action` is the code `default` stroke (action tokens), so the prop is omitted.
 const color = instance.getEnum('color', {
-  default: undefined,
-  inherit: 'inherit'
+  action: undefined,
+  // No code equivalent: ProgressCircle has no `danger` color, so the prop is omitted.
+  danger: undefined,
+  inherit: 'inherit',
+  // No code equivalent: ProgressCircle has no `neutral` color, so the prop is omitted.
+  neutral: undefined
 });
 // The code only ships `large` and `small`; Figma `tiny` has no code size, so the snippet flags it
 // instead of silently substituting another size.

package/lib/module/figma/ProgressCircle.figma.js.map

@@ -1 +1 @@
-{"version":3,"names":["figma","instance","selectedInstance","color","getEnum","default","undefined","inherit","size","large","small","tiny","isTiny","value","isIndeterminate","true","false","sizeProp","helpers","react","renderProp","colorProp","id","imports","example","code","metadata","nestable"],"sourceRoot":"../../../src","sources":["figma/ProgressCircle.figma.ts"],"mappings":";;AAAA;AACA;AACA;AACA,OAAOA,KAAK,MAAM,OAAO;AAEzB,MAAMC,QAAQ,GAAGD,KAAK,CAACE,gBAAgB;AAEvC,MAAMC,KAAK,GAAGF,QAAQ,CAACG,OAAO,CAAC,OAAO,EAAE;EACtCC,OAAO,EAAEC,SAAS;EAClBC,OAAO,EAAE;AACX,CAAC,CAAC;AACF;AACA;AACA,MAAMC,IAAI,GAAGP,QAAQ,CAACG,OAAO,CAAC,MAAM,EAAE;EACpCK,KAAK,EAAEH,SAAS;EAChBI,KAAK,EAAE,OAAO;EACdC,IAAI,EAAEL;AACR,CAAC,CAAC;AACF,MAAMM,MAAM,GAAGX,QAAQ,CAACG,OAAO,CAAC,MAAM,EAAE;EACtCK,KAAK,EAAE,KAAK;EACZC,KAAK,EAAE,KAAK;EACZC,IAAI,EAAE;AACR,CAAC,CAAC;AACF;AACA;AACA,MAAME,KAAK,GAAGZ,QAAQ,CAACG,OAAO,CAAC,OAAO,EAAE;EACtC,GAAG,EAAE,CAAC;EACN,MAAM,EAAE,CAAC;EACT,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,GAAG,EAAE;AACP,CAAC,CAAC;AACF,MAAMU,eAAe,GAAGb,QAAQ,CAACG,OAAO,CAAC,iBAAiB,EAAE;EAC1DW,IAAI,EAAE,IAAI;EACVC,KAAK,EAAE;AACT,CAAC,CAAC;AAEF,MAAMC,QAAQ,GAAGjB,KAAK,CAACkB,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,MAAM,EAAEZ,IAAI,CAAC;AAC7D,MAAMa,SAAS,GAAGrB,KAAK,CAACkB,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,OAAO,EAAEjB,KAAK,CAAC;AAEhE,eAAe;EACbmB,EAAE,EAAE,iBAAiB;EACrBC,OAAO,EAAE,CAAC,qDAAqD,CAAC;EAChEC,OAAO,EAAExB,KAAK,CAACyB,IAAI;AACrB,EAAEb,MAAM,GAAGZ,KAAK,CAACyB,IAAI,gGAAgG,GAAG,IAAI;AAC5H,yBAAyBX,eAAe,GAAG,MAAM,GAAGD,KAAK,IAAII,QAAQ,GAAGI,SAAS;AACjF;AACA,kBAAkB;EAChBK,QAAQ,EAAE;IAAEC,QAAQ,EAAE;EAAK;AAC7B,CAAC","ignoreList":[]}
+{"version":3,"names":["figma","instance","selectedInstance","color","getEnum","action","undefined","danger","inherit","neutral","size","large","small","tiny","isTiny","value","isIndeterminate","true","false","sizeProp","helpers","react","renderProp","colorProp","id","imports","example","code","metadata","nestable"],"sourceRoot":"../../../src","sources":["figma/ProgressCircle.figma.ts"],"mappings":";;AAAA;AACA;AACA;AACA,OAAOA,KAAK,MAAM,OAAO;AAEzB,MAAMC,QAAQ,GAAGD,KAAK,CAACE,gBAAgB;;AAEvC;AACA,MAAMC,KAAK,GAAGF,QAAQ,CAACG,OAAO,CAAC,OAAO,EAAE;EACtCC,MAAM,EAAEC,SAAS;EACjB;EACAC,MAAM,EAAED,SAAS;EACjBE,OAAO,EAAE,SAAS;EAClB;EACAC,OAAO,EAAEH;AACX,CAAC,CAAC;AACF;AACA;AACA,MAAMI,IAAI,GAAGT,QAAQ,CAACG,OAAO,CAAC,MAAM,EAAE;EACpCO,KAAK,EAAEL,SAAS;EAChBM,KAAK,EAAE,OAAO;EACdC,IAAI,EAAEP;AACR,CAAC,CAAC;AACF,MAAMQ,MAAM,GAAGb,QAAQ,CAACG,OAAO,CAAC,MAAM,EAAE;EACtCO,KAAK,EAAE,KAAK;EACZC,KAAK,EAAE,KAAK;EACZC,IAAI,EAAE;AACR,CAAC,CAAC;AACF;AACA;AACA,MAAME,KAAK,GAAGd,QAAQ,CAACG,OAAO,CAAC,OAAO,EAAE;EACtC,GAAG,EAAE,CAAC;EACN,MAAM,EAAE,CAAC;EACT,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,KAAK,EAAE,EAAE;EACT,MAAM,EAAE,EAAE;EACV,GAAG,EAAE;AACP,CAAC,CAAC;AACF,MAAMY,eAAe,GAAGf,QAAQ,CAACG,OAAO,CAAC,iBAAiB,EAAE;EAC1Da,IAAI,EAAE,IAAI;EACVC,KAAK,EAAE;AACT,CAAC,CAAC;AAEF,MAAMC,QAAQ,GAAGnB,KAAK,CAACoB,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,MAAM,EAAEZ,IAAI,CAAC;AAC7D,MAAMa,SAAS,GAAGvB,KAAK,CAACoB,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,OAAO,EAAEnB,KAAK,CAAC;AAEhE,eAAe;EACbqB,EAAE,EAAE,iBAAiB;EACrBC,OAAO,EAAE,CAAC,qDAAqD,CAAC;EAChEC,OAAO,EAAE1B,KAAK,CAAC2B,IAAI;AACrB,EAAEb,MAAM,GAAGd,KAAK,CAAC2B,IAAI,gGAAgG,GAAG,IAAI;AAC5H,yBAAyBX,eAAe,GAAG,MAAM,GAAGD,KAAK,IAAII,QAAQ,GAAGI,SAAS;AACjF;AACA,kBAAkB;EAChBK,QAAQ,EAAE;IAAEC,QAAQ,EAAE;EAAK;AAC7B,CAAC","ignoreList":[]}

package/lib/typescript/components/ListItem/index.d.ts

@@ -101,8 +101,8 @@ export interface ListItemSectionHeaderProps extends ViewProps {
     /** Optional right-aligned adornment (e.g. section Chip). */
     trailing?: ReactNode;
     /**
-     * Background treatment. `ghost` has no fill and a bottom border; `subtle` adds a neutral fill
-     * (matching `subtle` on Avatar, Chip, and IconButton) and drops the bottom border. `gradient`
+     * Background treatment. `ghost` has no fill and a bottom border; `subtle` adds a light neutral
+     * fill (`surface-neutral-tint`) and drops the bottom border. `gradient`
      * fades from the primary surface into a brand tint, left to right, and keeps the bottom border.
      * Label typography is the same for all three.
      * @default 'ghost'

package/lib/typescript/figma/CurrencyInput.figma.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CurrencyInput.figma.d.ts","sourceRoot":"","sources":["../../../src/figma/CurrencyInput.figma.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAC;;;;;;AA2C1B,wBASE"}
+{"version":3,"file":"CurrencyInput.figma.d.ts","sourceRoot":"","sources":["../../../src/figma/CurrencyInput.figma.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAC;;;;;;AAwC1B,wBASE"}

package/lib/typescript/figma/ProgressBar.figma.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ProgressBar.figma.d.ts","sourceRoot":"","sources":["../../../src/figma/ProgressBar.figma.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAC;;;;;;AA6C1B,wBAOE"}
+{"version":3,"file":"ProgressBar.figma.d.ts","sourceRoot":"","sources":["../../../src/figma/ProgressBar.figma.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAC;;;;;;AAgD1B,wBAOE"}

package/lib/typescript/figma/ProgressCircle.figma.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ProgressCircle.figma.d.ts","sourceRoot":"","sources":["../../../src/figma/ProgressCircle.figma.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAC;;;;;;;;;AAqD1B,wBASE"}
+{"version":3,"file":"ProgressCircle.figma.d.ts","sourceRoot":"","sources":["../../../src/figma/ProgressCircle.figma.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAC;;;;;;;;;AA0D1B,wBASE"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cdx-ui/components",
-  "version": "0.3.12",
+  "version": "0.3.13",
   "license": "MIT",
   "repository": {
     "type": "git",
@@ -106,10 +106,10 @@
     "@marceloterreiro/flash-calendar": "2.0.0",
     "react-native-reanimated-carousel": "5.0.0-beta.5",
     "uniwind": "1.12.2",
-    "@cdx-ui/icons": "0.3.12",
-    "@cdx-ui/primitives": "0.3.12",
-    "@cdx-ui/utils": "0.3.12",
-    "@cdx-ui/formatters": "0.3.12"
+    "@cdx-ui/formatters": "0.3.13",
+    "@cdx-ui/icons": "0.3.13",
+    "@cdx-ui/primitives": "0.3.13",
+    "@cdx-ui/utils": "0.3.13"
   },
   "devDependencies": {
     "@dnd-kit/core": "6.3.1",

package/src/components/CurrencyInput/styles.ts

@@ -79,7 +79,7 @@ const currencyInputGhostFieldVariants = cva(
 
 // `outline` delegates to the Input shell so border, focus, invalid, disabled, and read-only
 // treatments (including the native `data-[field-state=...]` focus selectors) stay in one place.
-// Figma `outlined` spaces the symbol 8px from the amount, tighter than Input's 16px slot gap.
+// Figma `outline` spaces the symbol 8px from the amount, tighter than Input's 16px slot gap.
 export const currencyInputRootVariants = ({
   variant = 'ghost',
   size = 'default',

package/src/components/ListItem/index.tsx

@@ -521,8 +521,8 @@ export interface ListItemSectionHeaderProps extends ViewProps {
   /** Optional right-aligned adornment (e.g. section Chip). */
   trailing?: ReactNode;
   /**
-   * Background treatment. `ghost` has no fill and a bottom border; `subtle` adds a neutral fill
-   * (matching `subtle` on Avatar, Chip, and IconButton) and drops the bottom border. `gradient`
+   * Background treatment. `ghost` has no fill and a bottom border; `subtle` adds a light neutral
+   * fill (`surface-neutral-tint`) and drops the bottom border. `gradient`
    * fades from the primary surface into a brand tint, left to right, and keeps the bottom border.
    * Label typography is the same for all three.
    * @default 'ghost'

package/src/components/ListItem/styles.ts

@@ -153,7 +153,7 @@ export const listItemSectionHeaderVariants = cva(
       variant: {
         ghost: [],
         // The fill separates the header from its rows, so the bottom border is dropped.
-        subtle: 'bg-surface-neutral-subtle border-b-0',
+        subtle: 'bg-surface-neutral-tint border-b-0',
         gradient: 'bg-gradient-to-r from-surface-primary to-surface-brand-tint',
       },
       showDivider: {