@persona/design-system 0.10.2 → 0.10.3

package/dist/{inputFields-mUsms2tO.d.mts → inputFields-BZcm1UV5.d.mts}

@@ -1,11 +1,11 @@
 import { n as CheckboxProps } from "./Checkbox-B2MZShdu.mjs";
-import { n as ComboboxMultiSelectProps } from "./ComboboxMultiSelect-DbTYO-Yz.mjs";
-import { n as ComboboxSingleSelectProps } from "./ComboboxSingleSelect-Cd6VYdwr.mjs";
+import { n as ComboboxMultiSelectProps } from "./ComboboxMultiSelect-DY5bAep9.mjs";
+import { n as ComboboxSingleSelectProps } from "./ComboboxSingleSelect-1NglA-u2.mjs";
 import { n as FormFieldBaseProps } from "./FormField-mLbXDJ9B.mjs";
 import { a as InputProps } from "./Input-Bg4bi6VZ.mjs";
 import { n as RadioGroupProps } from "./RadioGroup-BxEmipHa.mjs";
 import { i as SegmentedControlProps } from "./SegmentedControl-xjU-2IsJ.mjs";
-import { i as SelectProps } from "./Select-CSbamhJO.mjs";
+import { i as SelectProps } from "./Select-CG_Xkx0m.mjs";
 import { t as TextAreaProps } from "./TextArea-DFn4XuG-.mjs";
 import { n as ToggleProps } from "./Toggle-xtPgGaGD.mjs";
 import * as _$react from "react";
@@ -68,4 +68,4 @@ type ComboboxMultiSelectFieldProps<T = string> = ImplementsFormField & ComboboxM
 declare const ComboboxField: (props: ComboboxSingleSelectFieldProps | ComboboxMultiSelectFieldProps) => _$react_jsx_runtime0.JSX.Element;
 //#endregion
 export { ToggleField as _, ComboboxSingleSelectFieldProps as a, RadioGroupFieldProps as c, SelectField as d, SelectFieldProps as f, TextFieldProps as g, TextField as h, ComboboxMultiSelectFieldProps as i, SegmentedControlField as l, TextAreaFieldProps as m, CheckboxFieldProps as n, ImplementsFormField as o, TextAreaField as p, ComboboxField as r, RadioGroupField as s, CheckboxField as t, SegmentedControlFieldProps as u, ToggleFieldProps as v, splitOutFormFieldProps as y };
-//# sourceMappingURL=inputFields-mUsms2tO.d.mts.map
+//# sourceMappingURL=inputFields-BZcm1UV5.d.mts.map

package/dist/inputFields.d.mts

@@ -1,2 +1,2 @@
-import { _ as ToggleField, a as ComboboxSingleSelectFieldProps, c as RadioGroupFieldProps, d as SelectField, f as SelectFieldProps, g as TextFieldProps, h as TextField, i as ComboboxMultiSelectFieldProps, l as SegmentedControlField, m as TextAreaFieldProps, n as CheckboxFieldProps, o as ImplementsFormField, p as TextAreaField, r as ComboboxField, s as RadioGroupField, t as CheckboxField, u as SegmentedControlFieldProps, v as ToggleFieldProps, y as splitOutFormFieldProps } from "./inputFields-mUsms2tO.mjs";
+import { _ as ToggleField, a as ComboboxSingleSelectFieldProps, c as RadioGroupFieldProps, d as SelectField, f as SelectFieldProps, g as TextFieldProps, h as TextField, i as ComboboxMultiSelectFieldProps, l as SegmentedControlField, m as TextAreaFieldProps, n as CheckboxFieldProps, o as ImplementsFormField, p as TextAreaField, r as ComboboxField, s as RadioGroupField, t as CheckboxField, u as SegmentedControlFieldProps, v as ToggleFieldProps, y as splitOutFormFieldProps } from "./inputFields-BZcm1UV5.mjs";
 export { CheckboxField, CheckboxFieldProps, ComboboxField, ComboboxMultiSelectFieldProps, ComboboxSingleSelectFieldProps, ImplementsFormField, RadioGroupField, RadioGroupFieldProps, SegmentedControlField, SegmentedControlFieldProps, SelectField, SelectFieldProps, TextAreaField, TextAreaFieldProps, TextField, TextFieldProps, ToggleField, ToggleFieldProps, splitOutFormFieldProps };

package/dist/patterns/IndexTableLayout/index.mjs

@@ -1,5 +1,5 @@
 import { t as Card_default } from "../../Card-BXNxWX5C.mjs";
-import { t as DataTable } from "../../DataTable-F9R-aQCg.mjs";
+import { t as DataTable } from "../../DataTable-DQ8axNfo.mjs";
 import { t as PageHeader } from "../../PageHeader-DJF7nxgN.mjs";
 import { a as Section, i as Container } from "../../PageLayout-fXJW7daI.mjs";
 import { useMemo } from "react";

package/dist/patterns/LayoutLoadingShimmer/index.mjs

@@ -2,7 +2,7 @@ import { a as styled } from "../../styledComponentsInterop-NxwFjeA4.mjs";
 import { n as Stack, t as HStack } from "../../Stack-BkC7FCdF.mjs";
 import { t as LoadingShimmer } from "../../LoadingShimmer-Bqjdut7i.mjs";
 import { t as Card_default } from "../../CardV2-Dp4eHSE-.mjs";
-import { h as Table, m as TableHeaderCell, n as TableBody, p as TableRow, r as TableHead, s as TableCell } from "../../Table-CmuWqmVN.mjs";
+import { h as Table, m as TableHeaderCell, n as TableBody, p as TableRow, r as TableHead, s as TableCell } from "../../Table-BIDaC0uS.mjs";
 import { n as PageHeaderContainer } from "../../PageHeader-DJF7nxgN.mjs";
 import { Color, Spacing } from "@persona/design-tokens";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";

package/dist/patterns/WizardModal/index.mjs

@@ -2,7 +2,7 @@ import { a as styled } from "../../styledComponentsInterop-NxwFjeA4.mjs";
 import { semanticColor } from "../../lib/semanticColor.mjs";
 import { t as HStack } from "../../Stack-BkC7FCdF.mjs";
 import { n as Button } from "../../IconButton-HWx5Hlmi.mjs";
-import { i as Modal_default } from "../../Modal-IJdbLORi.mjs";
+import { i as Modal_default } from "../../Modal-kjUptzg1.mjs";
 import { t as ProgressIndicator } from "../../ProgressIndicator-CM37EU1B.mjs";
 import { Color, Spacing } from "@persona/design-tokens";
 import { useState } from "react";

package/dist/{types-CrRWZ0Ia.d.mts → types-Ci-KTHfu.d.mts}

@@ -1,4 +1,4 @@
-import { n as ComboboxProps } from "./Combobox-D0dMN5eY.mjs";
+import { n as ComboboxProps } from "./Combobox-DTeu9_RR.mjs";
 import { n as DateRange } from "./DateRangePicker-CLuBLF1q.mjs";
 import { ReactNode } from "react";
 import { DateValue } from "@internationalized/date";
@@ -92,4 +92,4 @@ interface FilterTypeDefinition<TFilter extends BaseFilterConfig = FilterConfig>
 type FilterTypeResolver<TFilter extends BaseFilterConfig = FilterConfig> = (config: TFilter) => FilterTypeDefinition<TFilter> | undefined;
 //#endregion
 export { ComboboxFilterConfig as a, FilterRenderOptions as c, InputFilterConfig as d, MultiSelectFilterConfig as f, BaseFilterConfig as i, FilterTypeDefinition as l, AttributeColumn as n, DateRangeFilterConfig as o, SelectFilterConfig as p, BaseActiveFilter as r, FilterConfig as s, ActiveFilter as t, FilterTypeResolver as u };
-//# sourceMappingURL=types-CrRWZ0Ia.d.mts.map
+//# sourceMappingURL=types-Ci-KTHfu.d.mts.map

package/dist/{types-DxJyE_U8.d.mts → types-SYxBPX6o.d.mts}

@@ -1,4 +1,4 @@
-import { l as MenuItemProps } from "./Menu-DHnQZ5yN.mjs";
+import { l as MenuItemProps } from "./Menu-5VknNr1T.mjs";
 import { o as StickerProps } from "./Sticker-CsUSNIH-.mjs";
 import { ReactNode } from "react";
 import { Column, DeepKeys, FilterFnOption, Header, RowData, SortingState, Table } from "@tanstack/react-table";
@@ -177,4 +177,4 @@ type BulkAction = {
 };
 //#endregion
 export { RowAction as C, RowDataWithTourTarget as D, RowDataWithSubrowsToAlwaysShowIds as E, SortProps as O, RenderValueStickerFormatConfig as S, RowDataWithSubrows as T, DataTableColumns as _, DataTableColumnBaseFormat as a, DatetimeConfig as b, DataTableColumnDatetimeFormat as c, DataTableColumnImageFormat as d, DataTableColumnNumberFormat as f, DataTableColumnURLFormat as g, DataTableColumnStringFormat as h, ColumnConfig as i, StickerMapping as k, DataTableColumnFormat as l, DataTableColumnStickerFormat as m, ClientFilterConfig as n, DataTableColumnCheckboxFormat as o, DataTableColumnPiiFormat as p, ClientFilterType as r, DataTableColumnDateFormat as s, BulkAction as t, DataTableColumnIDFormat as u, DataTableVariables as v, RowDataWithDetails as w, HeadlessFilterConfig as x, DateConfig as y };
-//# sourceMappingURL=types-DxJyE_U8.d.mts.map
+//# sourceMappingURL=types-SYxBPX6o.d.mts.map

package/dist/types5.d.mts

@@ -1,2 +1,2 @@
-import { a as ComboboxFilterConfig, c as FilterRenderOptions, d as InputFilterConfig, f as MultiSelectFilterConfig, i as BaseFilterConfig, l as FilterTypeDefinition, n as AttributeColumn, o as DateRangeFilterConfig, p as SelectFilterConfig, r as BaseActiveFilter, s as FilterConfig, t as ActiveFilter, u as FilterTypeResolver } from "./types-CrRWZ0Ia.mjs";
+import { a as ComboboxFilterConfig, c as FilterRenderOptions, d as InputFilterConfig, f as MultiSelectFilterConfig, i as BaseFilterConfig, l as FilterTypeDefinition, n as AttributeColumn, o as DateRangeFilterConfig, p as SelectFilterConfig, r as BaseActiveFilter, s as FilterConfig, t as ActiveFilter, u as FilterTypeResolver } from "./types-Ci-KTHfu.mjs";
 export { ActiveFilter, AttributeColumn, BaseActiveFilter, BaseFilterConfig, ComboboxFilterConfig, DateRangeFilterConfig, FilterConfig, FilterRenderOptions, FilterTypeDefinition, FilterTypeResolver, InputFilterConfig, MultiSelectFilterConfig, SelectFilterConfig };

package/dist/useColumnConfiguration.d.mts

@@ -1,5 +1,5 @@
-import { i as TableViewConfigurationProps } from "./TableViewConfigurationDropdown-BvOlDkJy.mjs";
-import { i as ColumnConfig } from "./types-DxJyE_U8.mjs";
+import { i as TableViewConfigurationProps } from "./TableViewConfigurationDropdown-Gut16-vY.mjs";
+import { i as ColumnConfig } from "./types-SYxBPX6o.mjs";
 import { RowData } from "@tanstack/react-table";
 
 //#region patterns/IndexTableLayout/useColumnConfiguration.d.ts

package/dist/useComboboxFooterAction.d.mts

@@ -1,4 +1,4 @@
-import { p as FooterAction } from "./ComboboxBase-BlNi9OnF.mjs";
+import { p as FooterAction } from "./ComboboxBase-BMBdtP2Z.mjs";
 import { KeyboardEvent } from "react";
 
 //#region components/Combobox/useComboboxFooterAction.d.ts

package/dist/{useTableColumns-DSXRInPb.d.mts → useTableColumns-PyxNyTD6.d.mts}

@@ -1,4 +1,4 @@
-import { C as RowAction, O as SortProps, _ as DataTableColumns, l as DataTableColumnFormat } from "./types-DxJyE_U8.mjs";
+import { C as RowAction, O as SortProps, _ as DataTableColumns, l as DataTableColumnFormat } from "./types-SYxBPX6o.mjs";
 import { ColumnDef, Row, RowData, Table } from "@tanstack/react-table";
 
 //#region components/DataTable/useTableColumns.d.ts
@@ -69,4 +69,4 @@ declare function useTableColumns<TData extends RowData, TFormat extends {
 }[]];
 //#endregion
 export { UseTableColumnsParams as n, useTableColumns as r, RenderFormatFn as t };
-//# sourceMappingURL=useTableColumns-DSXRInPb.d.mts.map
+//# sourceMappingURL=useTableColumns-PyxNyTD6.d.mts.map

package/dist/useTableColumns.d.mts

@@ -1,2 +1,2 @@
-import { n as UseTableColumnsParams, r as useTableColumns, t as RenderFormatFn } from "./useTableColumns-DSXRInPb.mjs";
+import { n as UseTableColumnsParams, r as useTableColumns, t as RenderFormatFn } from "./useTableColumns-PyxNyTD6.mjs";
 export { RenderFormatFn, UseTableColumnsParams, useTableColumns };

package/dist/useTruncation.d.mts

@@ -1,4 +1,4 @@
-import { i as ComboboxOption } from "./ComboboxBase-BlNi9OnF.mjs";
+import { i as ComboboxOption } from "./ComboboxBase-BMBdtP2Z.mjs";
 import { MutableRefObject, RefObject } from "react";
 
 //#region components/Combobox/useTruncation.d.ts

package/llms.txt

@@ -14,6 +14,7 @@ For exact prop types, prefer the published type declarations (`dist/**/*.d.mts`,
 ## Skills
 
 - [ui-authoring](skills/ui-authoring/SKILL.md): design tokens, PDS implementation guidelines, table guidelines (DataTable vs TableBox vs TableLayout), routing/link adapters (react-router, TanStack, custom), localization (PDSProvider strings/locale), loading states, testing, Storybook
+- [Product UI standard](skills/ui-authoring/STANDARD.md): the rules every screen meets (11 px minimum for copy and 8 px for labels inside charts and diagrams, WCAG AA contrast, reduced motion, status not by colour alone), the screen brief, and the `new-screen` task lane defined in `lanes.json`
 - [Tokens](skills/ui-authoring/TOKENS.md): semantic color tokens (Fg / Surface / Border / Action / Input / Feedback / Status / Opacity) with recipes and a dark-mode checklist; Spacing / Typography catalog, radius, elevation, charts
 - [Patterns](skills/ui-authoring/PATTERNS.md): forms, layout, index tables, indicators, feedback, empty states, charts, panels
 - [Components](skills/ui-authoring/COMPONENTS.md): which PDS component to use (and its import path); APIs live in that component's `.mdx` when one exists, otherwise in `dist/components/<Name>/index.d.mts`
@@ -39,7 +40,7 @@ their own subpaths.
 - Modal close button: localize the default with `PDSProvider strings={{ closeModal: translatedLabel }}` (English: "Close"), or override one modal with `contentProps.closeButtonLabel`.
 - Forms: `ConfigFormGroup`, `FormField` (`TextField`, `TextAreaField`, `TableBoxField`), `Input`, `TextArea`, `Select`, `Combobox`, `Checkbox`, `Radio`, `Toggle`, `DatePicker`
 - Status: `Sticker` (status badges), `Badge` (counts), `StatusIndicator`
-- Saved views: `TableControls` (or `DataTable.controls`) requires `onSetDefaultView` and `onUnsetDefaultView` together, or neither. Editable views offer "Set as default" / "Unset default" based on `view.isDefault`; the design system confirms before calling either callback and warns that both changes affect the entire organization. Consumers own persistence and must remove their own confirmations to avoid double prompts. Compact controls omit saved views.
+- Saved views: `TableControls` (or `DataTable.controls`) requires `onSetDefaultView` and `onUnsetDefaultView` together, or neither. Editable views offer "Set as default" / "Unset default" based on `view.isDefault`; the design system confirms before calling either callback and warns that both changes affect the entire organization. Consumers own persistence and must remove their own confirmations to avoid double prompts. Compact controls omit saved views. Pass `starredDefaultView` to star the default view: the `isDefault` view is pinned first with a star icon, cannot be dragged, hidden, deleted or unset, and its menu offers only Save and Duplicate (its name field still renames it); every other view gets the full menu. Rename and Duplicate on it call `onViewNameChange` / `onDuplicateView` with its id; Save calls `onSaveView()` with no id, saving whatever the consumer treats as the current view. A null `currentView` is shown as the starred view, so `onSaveView` and toolbar Save must treat null as the starred view; while an `isDefault` view exists, pass its id as `currentView` rather than null. A lazy default is a consumer-owned placeholder view with `isDefault: true`. While a view is the default the built-in tab is not shown and a `null` `currentView` is displayed as the starred view; with no `isDefault` view the built-in tab is shown starred and read-only.
 - DataTable filters: pass `filtersV2` (`TableControlsFiltersV2Props` / `FilterBarProps`) through `DataTable.controls` or directly to `TableControls` for a first-class FilterBar; defaults visible with size derived from `compact`. Hosts own V2 data filtering and feed `onChange` back to `initialState` for active-filter messaging; hydration needs no remount key. Precedence: `filterPanel` → `filtersV2` → legacy `filters`. Legacy `filters` supports `input`, `select`, `multiselect`, `combobox`, and `daterange` with optional `filterResolver`. With `clientFiltering`, `column.filter` generates legacy-only controls backed by TanStack column-filter state, not V2 filtering.
 - SmartTextInput: when method chains are allowed (`ValueType.MethodChain` or `{{...}}` interpolation), you MUST pass `renderFunctionForm`. PDS does not build the function-parameter form, so without it the dialog opened by placing the cursor in a call like `convert_to(...)` shows only the function name over an empty body. It receives `FunctionFormRenderProps` and must call `onComplete(nodes)` or `onCancel()`. In persona-web, `useDashboardSmartTextInputProps` supplies it (backed by `InputMethodChain/FunctionForm`). See components/SmartTextInput/SmartTextInput.mdx.
 - FilterBar: optional `FilterField.condition`, `pickerGroup`, and `disabledReason` support host-defined individual predicates in pills and native Rules; existing aggregate fields stay unchanged. See components/DataTable/DataTable.mdx. Hosts own feature activation and serialization.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@persona/design-system",
-  "version": "0.10.2",
+  "version": "0.10.3",
   "description": "React components for Persona UI",
   "keywords": [
     "tanstack-intent"
@@ -243,7 +243,7 @@
     "jsdom": "^27.4.0",
     "lodash": "^4.18.1",
     "msw": "^2.12.14",
-    "playwright": "1.60.0",
+    "playwright": "1.61.0",
     "react": "^17.0.2",
     "react-dom": "^17.0.2",
     "react-router-dom": "^6.30.5",

package/skills/ui-authoring/SKILL.md

@@ -8,6 +8,13 @@ metadata:
 
 # UI Authoring
 
+## Product UI standard
+
+Building a screen in an app? [STANDARD.md](STANDARD.md) holds the rules every screen meets: text the
+user reads is at least 11 px (8 px for a label inside a chart or diagram), contrast meets WCAG AA in light and dark, motion honours
+`prefers-reduced-motion`, and status never relies on colour alone. It also defines the `new-screen`
+lane for building one screen with no designer. Read it first, then the sections below.
+
 ## Design Tokens
 
 ```tsx
@@ -184,6 +191,7 @@ Add `ComponentName.stories.tsx` for every new component or visual variant.
 
 ## Resources
 
+- [STANDARD.md](STANDARD.md) — product UI standard: accessibility values, screen brief, `new-screen` lane ([lanes.json](lanes.json)), checks, departures
 - [TOKENS.md](TOKENS.md) — semantic color tokens (Fg / Surface / Border / Action / Input / Feedback / Status / Opacity), recipes and dark-mode checklist; Spacing / Typography catalog, radius, elevation, charts
 - [PATTERNS.md](PATTERNS.md) — forms, layout, panels, indicators, feedback, empty states
 - [COMPONENTS.md](COMPONENTS.md) — which PDS component to use, and its import path; APIs live in each component's `.mdx`

package/skills/ui-authoring/STANDARD.md

@@ -0,0 +1,137 @@
+# Product UI standard
+
+The rules every screen built on PDS meets, above the shared accessibility floor. This is the product
+UI area standard of the Persona design harness. It cites `persona-id/design-harness` at
+**`core-v0.3`**, where the product UI area's entry is `areas/product-ui.md`.
+
+- **Owner:** Michael Hu.
+- **Covers:** screens in Persona apps built on `@persona/design-system` (the dashboard, internal
+  apps, App Builder).
+- **Pinned by the app's PDS version.** The installed package is the live source and beats any
+  description of it, this file included (PDH-S1).
+
+## Ranks
+
+PDH-P1 (honesty) and PDH-P2 (brand) rank first and second. Then:
+
+3. **Component-first.** A PDS pattern or component over custom code. Tokens only style what no
+   component covers. The failure this guards against is one-off UI that drifts from every other
+   screen.
+4. **Craft.** Hierarchy, spacing, copy and every state (loading, empty, error, disabled) finished,
+   not just working.
+
+## Parameters
+
+| Rule | Product UI value |
+| ---- | ---------------- |
+| PDH-F1 contrast | The core value, WCAG 2.2 AA, in every colour mode the screen ships (light and dark) |
+| PDH-F2 copy | **11 CSS px** for text the user reads, the core web-copy value. 10 px styles are below it (see Checks); use `TextSmall` or `TextSmallMono` (12 px) |
+| PDH-F2 label inside a graphic | **8 CSS px** for a label inside a chart, a diagram or rebuilt product UI, the core value |
+| PDH-F3 reduced motion | Every animation and transition honours `prefers-reduced-motion`; flashing follows PDH-F3 |
+| PDH-F4 status | An icon or label as well as colour. `StatusIndicator` and `Sticker` already do this |
+
+Product UI shown in a fixed frame (a slide, a video) takes the core's fixed-frame value instead.
+
+## Types
+
+| Type | What | Governed by |
+| ---- | ---- | ----------- |
+| `screen` | A route, page, panel or modal flow in app code | This file. It bends nothing here without a departure row |
+| `component` | A component or pattern in PDS itself | `REVIEW.md` and the `design-system-component-authoring` skill, plus this file's parameters |
+
+No type bends the floor or PDH-P1.
+
+## What `persona` means here
+
+Product UI is always `persona` (PDH-M4): PDS as shipped, in the app's theme. Briefs and receipts
+record `brand: persona` without asking. Work that needs to be `unbranded` isn't covered by this
+standard.
+
+## Screen brief
+
+Record these in the PR body before building, so the source is consulted at intake (PDH-S2):
+
+- **Intent:** who uses the screen, to do what, in one line.
+- **Source:** the live product, a Figma link, or none. Say so if a source couldn't be reached.
+- **PDS version:** from the app's lockfile.
+- **Brand:** `persona`.
+- **Lane:** `new-screen`, or none.
+
+## Lanes
+
+A lane is a strict path for one common task. A PR opts in with a commit trailer, and the diff is then
+held to the lane's allow-list. Work that fits no lane goes without a trailer, through normal review;
+don't stretch a lane to fit it.
+
+Lanes are data, in [lanes.json](lanes.json). They name roles, not paths. Each app's harness config
+maps roles to its own paths, so one lane works in any app.
+
+### `new-screen`
+
+One new screen built from PDS, with no designer (App Builder, internal apps).
+
+- **Opt in:** a `Harness-Task: new-screen` trailer on any commit in the PR.
+- **Allowed:** one new screen directory (`screen`), its tests and stories (`screen-tests`), and
+  locale files (`locale`).
+- **Reported, not failed:** edits to the route table (`route-table`), so the screen can be reached.
+- **Forbidden:** shared components (`shared`), theme (`theme`), and code mirrored from PDS
+  (`pds-mirror`). A change there is its own PR, or a PDS change.
+- A file that matches no allowed or reported role fails. A file that matches a forbidden role is
+  forbidden, even if it also matches another role.
+- Build only from PDS patterns, components and tokens, per [SKILL.md](SKILL.md), and finish with the
+  "Before you hand it over" list in [TOKENS.md](TOKENS.md).
+
+### Adding a lane
+
+Add an entry under `lanes` in `lanes.json`: a `description`, `newScreens` (how many new screen
+directories the diff may add; `0` for an edit-only lane), and `allow`, `note` and `forbid` role
+lists. Add a role only when no existing one covers the paths. Then describe the lane here.
+Specialized work gets its own lane; never loosen `new-screen` to fit it.
+
+## Checks
+
+All of these are review until the screen checker ships. When it does, it fails only on new findings;
+existing ones are grandfathered.
+
+| Rule | Source | Check |
+| ---- | ------ | ----- |
+| Painted colours are semantic: no hex, no `Color.*` outside the `semanticColor` fallback | PDS; keeps PDH-F1 in dark mode | Review |
+| Complete `Typography` styles, never individual font properties or a raw `font-size` | PDS; makes PDH-F2 checkable | Review |
+| No copy under 11 px. The 10 px routes are `Typography.TextExtraSmall` and `TextExtraSmallMono`, `theme.text.paragraph.xs`, the text mixin's `xs` (`Paragraph` / `Label` `size="xs"`), and the `TextMono` + `TextExtraSmall.fontSize` composite | PDH-F2 | Review. Report-only once automated, since a text check can't tell copy from a label inside a graphic |
+| `@keyframes`, `animation` or `transition` only with a `prefers-reduced-motion` block | PDH-F3 | Review. Report-only once automated |
+| No hand-rolled `<table>`, `<th>` or `<td>` | PDS (Table Guidelines in SKILL.md) | Review |
+| Contrast | PDH-F1 | Review |
+| Status not by colour alone | PDH-F4 | Review |
+| The diff stays within its lane | `lanes.json` | Review |
+
+## Departure ledger
+
+Departures from this file or the core that aren't tightenings, one row each, in the PDH-M3 format:
+`rule ID · what changed · scope · reason (medium or audience) · owner · expiry or "standing" · date`.
+A one-screen departure goes in that PR's brief instead.
+
+| Rule | What changed | Scope | Reason | Owner | Expiry | Date |
+| ---- | ------------ | ----- | ------ | ----- | ------ | ---- |
+| PDH-F2 | 10 px mono text (`TextMono` + `TextExtraSmall.fontSize`) | `components/TechnicalSticker/TechnicalSticker.tsx`, the `font-size` in the `TechnicalText` style | PDS's existing 10 px step for dense technical identifiers; predates this standard | Michael Hu | standing | 2026-10-26 |
+| PDH-F2 | 10 px mono pill text (`Typography.TextExtraSmall`, mono family) | `components/SmartTextInput/PillType.tsx`, the `PillType` style | PDS's existing 10 px step for type pills in the editor; predates this standard | Michael Hu | standing | 2026-10-26 |
+| PDH-F2 | 10 px helper copy (`paragraphMixins.xs`); copy, not a label inside a graphic | `components/DataTable/TableControls/FiltersV2/FilterPopover/FilterPopover.tsx`, the `Footer` style | PDS's existing 10 px step for the filter popover's field note; predates this standard | Michael Hu | standing | 2026-10-26 |
+| PDH-F2 | 10 px `xs` paragraph mixin (`Typography.TextExtraSmall`), reached by `Paragraph` / `Label` `size="xs"` | `mixins/text.ts` `xs` | PDS's existing 10 px step, kept for current callers; predates this standard | Michael Hu | standing | 2026-10-26 |
+| PDH-F2 | 10 px theme value (`Typography.TextExtraSmall`) | `theme.ts` `text.paragraph.xs` | Part of the theme contract consumers compile against; predates this standard | Michael Hu | standing | 2026-10-26 |
+
+`lib/middleTruncateText.ts` needs no row: its 10 px `DEFAULT_FONT` only measures text on a canvas
+and paints nothing.
+
+## Receipt
+
+Each screen records the receipt core (design-harness `spec/receipt.md`) plus `brand: persona`,
+`departures`, and `shared_components_touched` (the shared components changed, with every screen they
+reach). Until the screen receipt is automated, the screen brief in the PR body stands in for it.
+
+## Citations and tightenings
+
+No tightenings for now: every value above is the core's value.
+
+Core rules cited, all at `persona-id/design-harness` `core-v0.3`: PDH-P1, PDH-P2 (ranks 1–2) · PDH-F1 to PDH-F4 ·
+PDH-S1, PDH-S2 · PDH-M1, host side (a screen hosting an illustration, such as an empty state, sets the
+surface it sits on) · PDH-M3 · PDH-M4 · PDH-M5 (a correction meant to hold lands as a PR to this
+file). Not cited: PDH-M2, campaigns don't apply to product UI.

package/skills/ui-authoring/TOKENS.md

@@ -634,9 +634,11 @@ Typography.TextMediumLink     // 14px, regular, underlined
 Typography.TextSmall          // 12px, regular
 Typography.TextSmallBold      // 12px, bold
 Typography.TextSmallLink      // 12px, regular, underlined
-Typography.TextExtraSmall     // 10px
+Typography.TextExtraSmall     // 10px, below the 11px minimum for text the user reads (STANDARD.md)
 
 Typography.TextMono           // 14px, monospace
+Typography.TextSmallMono      // 12px, monospace
+Typography.TextExtraSmallMono // 10px, monospace, below the 11px minimum for text the user reads (STANDARD.md)
 ```
 
 ## Radius

package/skills/ui-authoring/lanes.json

@@ -0,0 +1,22 @@
+{
+  "version": 1,
+  "trailer": "Harness-Task",
+  "roles": {
+    "screen": "Files inside the screen or route directory the lane adds. The app's harness config names where screen directories live.",
+    "screen-tests": "Tests and stories for that screen kept outside its directory.",
+    "locale": "Locale (translation) files.",
+    "route-table": "The app's route or navigation table.",
+    "shared": "Components, hooks and layouts used by more than one screen.",
+    "theme": "Theme, global styles and token overrides.",
+    "pds-mirror": "Code mirrored or copied from @persona/design-system."
+  },
+  "lanes": {
+    "new-screen": {
+      "description": "One new screen built from PDS patterns and components, with no designer.",
+      "newScreens": 1,
+      "allow": ["screen", "screen-tests", "locale"],
+      "note": ["route-table"],
+      "forbid": ["shared", "theme", "pds-mirror"]
+    }
+  }
+}