pixelize-design-library 2.4.2-beta.64 → 2.4.2-beta.65

package/CHANGELOG.md

@@ -24,6 +24,19 @@ next major.
   `closeLabel(item)`, `dirtyLabel`, `label`; `WorkspaceTrayItem` gains `isDirty` (unsaved dot) and `subtitle`.
   `WorkspaceWindow` gains `labels` ({minimize, close, openFullPage}) and `finalFocusRef`.
   The tray now renders in a portal, so a test that queries inside its render container must query `document.body`.
+- **`WorkspaceTray` `renderItem` receives the built-in pill** as a third argument, `renderItem(item, api, pill)`: the pill
+  already carries the unsaved dot, subtitle and close button, so a consumer can return it or wrap it (in
+  `WorkspaceTrayPreview` for a hover preview, say) instead of rebuilding it. Two-argument callbacks and the default
+  pill are unchanged.
+- **`FormDrawer` `isSubmitDisabled`**: disables the primary button and makes the form ignore Enter and any other submit,
+  so `onSubmit` never fires, not even from `requestSubmit()` or a dispatched submit event (the drawer is a real
+  `<form>`; the button alone does not guard those). Unlike `isSubmitting` it shows no spinner, and Cancel and every
+  close path stay live. Omitted, nothing changes.
+- **`WizardDialog` `chrome="inline"`** (default `"modal"`): draws the wizard (title, stepper, step, review, footer) in place
+  with no Modal, for a host that is already the dialog, such as a `WorkspaceWindow`: no overlay, focus trap, close X,
+  Esc-to-close or `role="dialog"`. It renders nothing while `isOpen` is false, ignores `size`, and Cancel still calls
+  `onClose`. It reuses the same flow as the modal (`useWizardFlow`, `validate`, `finishDisabled`, `finishBlockedReason`,
+  `stepId`); test ids are `wizard-inline` / `${data-testid}-inline`. `Wizard` does not take the prop.
 - **`optionRowFill(rows, isActive)`** and **`optionRowCursorSx(rows)`** are exported from the package root: the one
   fill an option row paints (the cursor's), and its `:hover`/`:focus` form for roving-focus lists.
 - **`accentTextOnPlanes(scale, planes)`** is exported from the package root: the first accent rung clearing AA on every
@@ -95,6 +108,53 @@ next major.
   document-wide `prefers-reduced-motion` rule; `pz-motion-keep` (`MOTION_KEEP_CLASS`) opts an element out.
   The default is unchanged. `CustomThemeProps` gains `zIndices.popoverNested` and the two font sizes, so
   code that hand-builds a full `CustomThemeProps` needs those keys.
+- **`LauncherSearchEngine.matches` and `.createMatcher`**: the boolean form of the engine for table and list filters.
+  `matches(query, ...texts)` is true when every query word hits some text (same folding, typo tolerance and `synonyms`
+  option as `search`, no ranking); `createMatcher(query)` compiles the query once for a loop over rows, and an empty query
+  matches every row. `LauncherMatcher` is exported as a type.
+- **`LauncherSearchEngine` searches Hindi and Tamil by written letter**: Latin accents, the Devanagari nukta and
+  zero-width joiners are ignored, chandrabindu folds into anusvara, and every other combining mark stays part of its
+  letter, so a bare vowel sign never matches ("का" does not find "कमाई"). Typo length and distance count letters
+  ("कम्मचारी" finds "कर्मचारी"), and a Tamil word ending in ம் also finds titles that drop it ("நேரம்" finds "நேர அட்டவணை").
+  `editDistance` accepts arrays of letters. Latin results are unchanged. `engine/conformance.fixture.json` is the
+  behaviour contract shared with HRMS mobile search, asserted by `engine/conformance.test.ts`.
+- **`NavLauncher` spotlight search** (all additive; an app passing none of these renders as before):
+  - `searchMode="spotlight"` ranks every row by relevance (exact > prefix > word > word-prefix >
+    initialism > substring > typo > subsequence, label > keyword > context), tolerates typos
+    (Damerau-Levenshtein 1 from 4 letters, 2 from 8), folds case and accents, expands `synonyms`
+    both ways, boosts `pinnedIds` / `frequentIds` / `recentIds`, and shows the best row first as a
+    **Top hit** card naming the keyword or fact that matched. Groups collapse to `groupLimit` rows
+    (default 5 in spotlight, unlimited in classic) behind a "Show N more" option.
+  - `scopes` + `activeScope` / `onScopeChange`: filter chips in the header row beside the field
+    (their own row below `md`), always shown so they say what can be searched; while typing each
+    chip shows its live match count and is named "People, 3 results". One Tab stop (radiogroup,
+    roving tabindex, arrows / Home / End); the strip scrolls sideways behind an edge fade with a
+    mouse page arrow and keeps the selected chip in view, so the field never drops below 15rem (or a
+    third of a wide row). "All" is prepended, `screens`
+    and `actions` are built in and `LauncherResultGroup.scope` (default its `id`) places any other
+    group. A chip other than All / Screens picked with an empty field lists that scope's items as
+    passed, with the facts pane; `LauncherScope.placeholder` narrows the field's placeholder.
+  - `quickActions`: up to 5 pill buttons at the top of the menu while the query is empty and the
+    scope is All.
+  - `LauncherSearchItem.facts` (`{ label, value, copyable? }`): a right preview pane at `lg`+ for the
+    highlighted row with Copy buttons (blocked clipboard selects the value instead), docked under the
+    list below `lg`. `answers` (items with `answer: { label, value, hint? }`) render as direct-answer
+    cards above every result; Enter copies an answer that has no `run` / `href`.
+  - `LauncherResultGroup.matchLocally`: the launcher filters and ranks a static group itself.
+  - `LauncherSearchEngine` — the framework-free engine behind it (`createIndex`, `search`,
+    `searchDocuments`, `highlightRanges`, `usageBoosts`, `foldText`, `tokenize`, `editDistance`; options
+    `synonyms`, `boosts`, `fuzzy`, `relativeCutoff`, `limit`) for any other list or palette; `highlightSegments` now exported, with an opt-in `{ fuzzy, synonyms }`.
+  - New optional `LauncherLabels` keys: `topHit`, `matchedOn`, `answers`, `hintCopy`, `scopes`,
+    `scopeAll`, `scopeChanged`, `scopeCount`, `scopeEmpty`, `quickActions`, `showMore`, `preview`,
+    `copy`, `copied`, `copySelected`.
+  - The dialog is now always named `labels.title`; the search value and `headerActions` no longer
+    join its accessible name.
+  - Types `LauncherFact`, `LauncherAnswer`, `LauncherScope`, `LauncherSearchMode`, `HighlightOptions`,
+    `LauncherSearch*` / `LauncherSynonyms` / `LauncherMatchKind` / `LauncherTokenMatch`.
+- `CopyButton` `onCopyError` — fires when the clipboard is missing or denied, instead of failing silently.
+- `Drawer` `aria-label` / `aria-labelledby` — name the dialog instead of its whole header (a header
+  holding a field or buttons otherwise becomes the name); `contentProps["aria-labelledby"]` never
+  worked.
 - **HRMS library requests** — a navigation launcher, key caps, a merge-field `Editor`, a wizard and
   smaller gaps found by the HRMS migration:
   - `NavLauncher` — full-height navigation launcher (browse modules, pins, Frequent, Recent, search
@@ -260,8 +320,9 @@ next major.
   library; bring your own.
 
 - **Dark mode.** `PixelizeThemeProvider` (defaults to `system`), `useThemeMode`, `ThemeSwitcher`.
-  Dark palettes are derived per brand from that brand's own light palette, so brand hue carries
-  through. `withTheme` stays light-only, so existing apps are visually unchanged — dark is opt-in.
+  Dark palettes are derived per brand from that brand's own light palette: surfaces are hue-neutral,
+  and the brand hue carries through on the accent, ink, rules and rail. `withTheme` stays light-only,
+  so existing apps are visually unchanged — dark is opt-in.
 - **`MediaViewer`** — a full-screen viewer for images, video, audio, PDF, Office documents, text
   and archives, with a filmstrip, keyboard navigation and per-kind fallbacks. `index` is optional:
   omit it and the viewer owns navigation itself.
@@ -393,6 +454,14 @@ next major.
 
 ### Changed (visual)
 
+- **Dark surfaces are hue-neutral on every brand.** The canvas, card, overlay, named `backgroundColor` ladder,
+  `background[50-900]` and `table.hover` no longer take a brand tint (`SURFACE_SAT` 14 to 0): all 9 brands share
+  canvas `#121212`, card `#212121` (1.163:1 over the canvas) and overlay `#2c2c2c` (1.153:1 over the card), so
+  switching brand no longer recolours the app background. The brand hue stays on the accent, ink, rules and the
+  sidebar rail. Light palettes are byte-identical to before (SHA-256 of all 9 resolved light palettes). Muted dark
+  text re-derives against the neutral surfaces and shifts a few hex values on lavender, rosewood, slate and zinc
+  (lavender `#9f92aa` to `#a498ae`); every muted token still passes the same AA gate. `planes: "flat"` keeps its
+  meaning (card = canvas) on the same canvas.
 - **`Table` loading state.** With `isLoading` and no rows, each row now draws one skeleton per column (a checkbox
   placeholder in the checkbox column, blank spacer cells) with the variant's row rule, instead of one bar spanning the
   table. If `columns` is still empty while loading, the header shows four placeholder cells and a disabled select-all
@@ -461,11 +530,10 @@ next major.
   2px on hover; the shadow still deepens.
 - **`Button` (solid, outline, ghost) and `IconButton` scale to 0.98 while pressed** (`MOTION_PRESS_SCALE`).
   Never when disabled or loading, nor under `prefers-reduced-motion`.
-- **Dark planes carry the brand hue and separate by lift.** The dark canvas takes a faint brand tint and cards
-  (`background[50]`) sit one step (1.16:1) above it, with overlays (`surfaceRaised`) one step (1.15:1) above
-  the card; every filled mark keeps 3:1 on all three. Light mode is unchanged. A brand opts out with
-  `buildDarkPalette(light, { planes: "flat" })`. `meadow` and `rosewood` dark `accentText` move one rung
-  lighter so they clear AA on selected list rows.
+- **Dark planes separate by lift.** Cards (`background[50]`) sit one step (1.16:1) above the canvas, with
+  overlays (`surfaceRaised`) one step (1.15:1) above the card; every filled mark keeps 3:1 on all three. Light
+  mode is unchanged. A brand opts out of the lift with `buildDarkPalette(light, { planes: "flat" })`. `meadow`
+  and `rosewood` dark `accentText` move one rung lighter so they clear AA on selected list rows.
 - **`zinc`:** muted text in light mode is `#515157` (was `#27272a`, 14.9:1), settled under a new 8:1 muted
   ceiling; zinc's dark card is no longer darker than its canvas.
 - **A brand's primary never reads as danger.** `radiant`'s danger colour (`red` and `semantic.error`) is
@@ -538,6 +606,8 @@ next major.
 - **`FileUpload` no longer leaks a blob URL per image thumbnail per render.** Each file gets one URL,
   revoked when the file is removed or the component unmounts.
 - **`Table` column search shows the current search when reopened**, instead of stale text.
+- **`NavLauncher` search rows shorten the `· keyword` hint before the label**, so a long keyword list
+  no longer cuts "Apply for leave" down to "Apply…".
 - **`NavigationBar` right cluster no longer overflows onto the avatar at phone widths.** The title
   truncates first (overflow-only tooltip when it is a string); the `moreIcon` cluster can shrink, while
   the sidebar toggle, back button and avatar menu never do. (HRMS, beta.60 launcher trigger overflow)
@@ -791,7 +861,12 @@ Nothing is removed yet — each of these still ships its full implementation.
 - `CustomModulesTableLabels.loading` — never rendered; the loading state shows skeleton bars only.
 - `WorkspaceWindow` `onMedium` and `onMaximize` — never called; the window has no such controls.
 - `NavLauncher` `openShortcutHint` and `LauncherLabels.hintOpenMenu` — no longer rendered (the launcher
-  is already open when its footer shows); bind the open chord in the app only.
+  is already open when its footer shows); bind the open chord in the app only. `hintOpenMenu` is now
+  optional, so a full `LauncherLabels` object type-checks without it.
+- `searchLauncher` — legacy flat search (one Screens group); `NavLauncher` never calls it. Classic mode
+  runs `searchLauncherSections`, which matches a screen on its own label and keywords only ("leave
+  balance" finds nothing unless one screen's keywords carry both words); `searchMode="spotlight"`
+  ranks and also matches a screen on its module and section.
 - `SelectV2` — use `Select` with `native={false}`; it is already a thin wrapper over it.
 - `SearchSelect`, `SelectSearch` are **no longer `@deprecated`.** Both now say "prefer `Select`
   for new work" instead: `@deprecated` claimed a migration that loses real capabilities

package/COMPONENT-GOTCHAS.md

@@ -586,7 +586,8 @@ It sets `noValidate`: validate in `onSubmit` and pass messages via `errors`. Err
 fires only after a submit; if validation is async, set `isSubmitting` synchronously in `onSubmit` so
 focus waits for the result, otherwise errors that arrive later are not focused. The footer submit
 button is tied to the form with the `form` attribute — Enter-to-submit works in browsers, but
-jsdom / user-event does not simulate it, so use `fireEvent.submit(form)` in tests.
+jsdom / user-event only simulates it for a form with exactly one text field, so use
+`fireEvent.submit(form)` in tests. `isSubmitDisabled` swallows both: `onSubmit` is not called while it is true.
 
 ### `QueryStateBoundary` evaluates JSX `children` even while loading
 
@@ -1292,7 +1293,9 @@ remount, wrap `<Editor>` itself in a keyed parent, not via `Editor`'s own `key`
 
 `validate` runs on Continue, on Finish, and again for every step on Finish. Passing `stepId` controls
 the visible step only: stages past the furthest valid step stay disabled. Esc, close, Back and Cancel
-are disabled while `isFinishing`.
+are disabled while `isFinishing`. With `chrome="inline"` there is no Modal at all: no focus trap, no Esc,
+no close X and no `role="dialog"` (the host window supplies them), `size` is ignored, and nothing renders
+while `isOpen` is false; Cancel still calls `onClose`, so the host must close itself there.
 
 ### `PageHeader` actions wrap by default
 
@@ -1413,8 +1416,9 @@ the `Search` listeners see it — otherwise the first mounted `Search` takes Ctr
 - **Esc is handled by the launcher, not the Drawer** (`closeOnEsc` is off): it clears a non-empty
   query and keeps focus in the field, and closes only when the query is empty. The keydown is stopped inside
   the launcher, so a consumer `Escape` listener on `document` never sees it.
-- **`headerActions` text joins the dialog's accessible name** (header content becomes part of it,
-  as the search value already does: "Menu leave"). Use icon-only buttons with an `aria-label`.
+- **The dialog's accessible name is always `labels.title`** (a hidden heading, through `Drawer`'s
+  `aria-labelledby`); the search value, scope chips and `headerActions` no longer join it. A consumer
+  test asserting the old "Menu leave" style name must assert `labels.title` instead.
 - **The result count is `aria-hidden`; the announcement is a separate visually hidden `aria-live="polite"`
   node, deliberately not `role="status"`**, so `getByRole("status")` still matches only the no-results
   message and the loading skeleton.
@@ -1429,6 +1433,7 @@ the `Search` listeners see it — otherwise the first mounted `Search` takes Ctr
   a consumer that annotates a *full* `LauncherLabels` object fails to compile.
 - **`openShortcutHint` and `labels.hintOpenMenu` are deprecated no-ops:** the open chord is no longer
   shown in the footer. Drop them; the footer's hints are arrows, ENTER, ⌘ ENTER, ⌘ + click, P, ESC.
+  Both are optional, so a full `LauncherLabels` object needs no `Omit<LauncherLabels, "hintOpenMenu">`.
 - **`apps` is data-driven.** Gate by plan by changing the array or setting `locked` / `lockedReason`;
   keep `id`s stable (hues and `key` derive from them), and pass `color` on an app whose mark must not
   shift when siblings are added or removed. Locked rows are not links, not focusable, `aria-disabled`,
@@ -1441,6 +1446,34 @@ the `Search` listeners see it — otherwise the first mounted `Search` takes Ctr
   stylesheet.
 - **A search row without `href` (an action with `run`) cannot open in a new tab:** any click, with or
   without Cmd/Ctrl, runs it and closes the launcher, same as Enter.
+- **Spotlight search is opt-in (`searchMode="spotlight"`).** Without it matching, ranking and row
+  order are exactly as before; `scopes`, `quickActions`, `answers`, `facts` and `groupLimit` work in
+  both modes. Facts are searchable in spotlight only.
+- **Two search models, and classic never matches a screen on its module.** Classic (the default) runs
+  `searchLauncherSections`: registry order, no ranking, and every query word must appear in one row's
+  own label or keywords. "leave balance" therefore finds nothing unless one screen's keywords carry
+  both words. Spotlight ranks and also matches a screen on its module and section labels, so the same
+  query finds Leave › Balances. The exported `searchLauncher` (one flat Screens group) is legacy and
+  `@deprecated`; the component never calls it.
+- **Scope chips live in the header row and are always shown** (their own header row below `md`);
+  while a query is active each chip's name carries its count ("People, 3 results"), so a test that
+  types first must match `getByRole("radio", { name: /^People/ })`, not the bare label.
+- **Picking a chip other than All or Screens with an empty field lists that scope** exactly as
+  passed: its `actions` or `extraResults` groups, so a remote group with nothing loaded yet shows
+  `labels.scopeEmpty`. Load the scope's items when `onScopeChange` fires if it should list them.
+- **Quick actions show only under All with an empty query, as the first block of the menu** (not
+  while `isLoading`); only the first 5 render.
+- **Closing resets the scope to "all"** and calls `onScopeChange("all")`; a controlled `activeScope`
+  must apply it, like `onQueryChange("")`.
+- **`facts` swap the Quick access rail for a Preview pane at `lg`** whenever any visible result has
+  facts; below `lg` the active result's facts dock under the list. Copy buttons are never inside an
+  `option` or the listbox (axe `nested-interactive`, `aria-required-children`).
+- **An answer without `run` or `href` copies `answer.value` on Enter/click**; answers show in the
+  All scope only.
+- **`extraResults` groups are not filtered** unless `matchLocally: true`; remote rows the query does not
+  match stay listed (score 0) and can never be the Top hit.
+- **`LauncherSearchEngine` searches what it is given.** It has no React, DOM or network; build the
+  index with `createIndex` once per data change, not per keystroke.
 - **`LauncherTrigger` does not bind its shortcut**; `shortcut={null}` removes the hint and
   `aria-keyshortcuts`. An explicit `aria-label` hides the visible label from assistive tech, so keep
   the visible text inside the label (WCAG 2.5.3). `display="icon"` has no visible text: the label is

package/DESIGN-GUIDE.md

@@ -152,7 +152,7 @@ sections are `Card` with the title in `header`.
 
 | Pattern | Component — don't hand-build it |
 | --- | --- |
-| Multi-step flow (send, import, onboard) with validated Continue and a review step | `WizardDialog` (`Wizard` inline) — don't hand-roll Back / Continue / Finish around `StageProgress`; each step's `validate` returns its error messages, future steps stay locked until valid, each step's `summary` drives the review |
+| Multi-step flow (send, import, onboard) with validated Continue and a review step | `WizardDialog` (`Wizard` inline; `chrome="inline"` inside a `WorkspaceWindow` or other host that is already the dialog) — don't hand-roll Back / Continue / Finish around `StageProgress`; each step's `validate` returns its error messages, future steps stay locked until valid, each step's `summary` drives the review |
 | Rich-text template with `${field}` placeholders | `Editor mergeFields={…}` — not a `Select` + caret tracking + dialog beside it; use its `label` / `helperText` / `errorMessage` |
 | A PDF behind auth, shown inline | `PdfViewer getBlob={…}` — the toolbar's Open / Download then work with the token, so don't add your own buttons |
 | Toolbar: search · filters · active-filter chips · count · actions | `FilterBar` (`search`, children, `activeFilters` + `onRemoveFilter`/`onClearAll`, `summary`, `actions`) |
@@ -203,6 +203,10 @@ scrim `Box`. `Loading` is the older API and stays on the heavier house scrim by
   `headerActions` for the app's own icon button (help, customise) with an `aria-label`.
 - Show the suite's apps with `appsVisibility="always"` and drive plan gating by editing `apps` /
   `locked`.
+- For Spotlight-style search pass `searchMode="spotlight"` plus `synonyms` for the app's jargon
+  (`pf`, `wfh`), `scopes` for its entity groups, up to 5 `quickActions`, copyable `facts` on reference
+  items and `answers` for one-line lookups. Reuse `LauncherSearchEngine` for any other in-app search
+  instead of writing a matcher.
 - Show shortcut hints with `KbdShortcut`, never a hand-styled `<kbd>`.
 
 ## 7. Every page has four states
@@ -260,8 +264,8 @@ not shipped in this package). Start from the closest one:
 | Settings / long form | `settings.tsx` | `SectionRail` (rail from `lg`, `Select` below, dirty dots), `SettingsSection` + `SettingRow`, `SaveBar`, danger zone |
 | Board | `pipeline.tsx` | `KanbanBoard` with custom cards and column totals (`height`/`maxH` to size it) |
 | Inbox / master–detail | `inbox.tsx` | selectable list rows, conversation pane, composer, mobile list↔detail |
-| App launcher (browse, pins, recents, search with actions) | `launcher.tsx` (`/examples/launcher`) | `NavLauncher` + `LauncherTrigger` in `NavigationBar leading`, app-owned registry and permission filter, pinned / frequent / recent ids, `linkAs`, remote results via `extraResults`, `isLoading`, `SideBar pinnedItems` |
-| Wizard / multi-step dialog | `wizard.tsx` (`/examples/wizard`) | `WizardDialog` and inline `Wizard`: per-step `validate` messages, locked future steps, error summary, `summary`-driven review, `isFinishing` |
+| App launcher (browse, pins, recents, search with actions) | `launcher.tsx` (`/examples/launcher`) | `NavLauncher` + `LauncherTrigger` in `NavigationBar leading`, app-owned registry and permission filter, pinned / frequent / recent ids, `linkAs`, remote results via `extraResults`, `isLoading`, `SideBar pinnedItems`, Classic / Spotlight toggle, synonyms, scopes, quick actions, company facts with Copy, answers |
+| Wizard / multi-step dialog | `wizard.tsx` (`/examples/wizard`) | `WizardDialog`, inline `Wizard` and `WizardDialog chrome="inline"` in a `WorkspaceWindow`: per-step `validate` messages, locked future steps, error summary, `summary`-driven review, `isFinishing` |
 | Template editor with merge fields | `templateEditor.tsx` (`/examples/template-editor`) | `Editor mergeFields`: grouped Insert field, chips, unknown-field error chips and `onUnknownTokens`, Make dynamic, side preview, label / helper / error |
 | Shop front (home → listing → product → bag → checkout → order) | `storefront/` | `ProductCard` grid / rail / quick-add, `ProductDetails` + `StickyBuyBar`, `CartItem`, `OrderSummary`, `CouponField`, address/payment groups, `OrderStatusTimeline`, `BagBar`; mobile frame + desktop |
 

package/dist/Components/CopyButton/CopyButton.d.ts

@@ -16,8 +16,10 @@ export interface CopyButtonProps {
     iconSize?: number;
     /** Only affects the default "icon" variant's IconButton — "button" and "menu-item" ignore it. */
     size?: "xs" | "sm" | "md";
-    /** Fires only if the clipboard write resolves — a denied/insecure-context failure is swallowed silently. */
+    /** Fires only if the clipboard write resolves. */
     onCopy?: (value: string) => void;
+    /** Fires when the clipboard is missing or denied, instead of failing silently. */
+    onCopyError?: (value: string) => void;
 }
 /** Copies `value` to the clipboard in 3 layouts (icon/button/menu-item) — not a full share/export action. */
 declare const CopyButton: React.FC<CopyButtonProps>;

package/dist/Components/CopyButton/CopyButton.js

@@ -15,7 +15,7 @@ const primitives_1 = require("../../Theme/tokens/primitives");
 const focusRing_styles_1 = require("../../Theme/chakra/focusRing.styles");
 const ToolTip_1 = __importDefault(require("../ToolTip/ToolTip"));
 /** Copies `value` to the clipboard in 3 layouts (icon/button/menu-item) — not a full share/export action. */
-const CopyButton = ({ value, variant = "icon", label = "Copy", copiedLabel = "Copied!", tooltip = "Copy", feedbackDuration = 1500, iconSize = 16, size = "sm", onCopy, }) => {
+const CopyButton = ({ value, variant = "icon", label = "Copy", copiedLabel = "Copied!", tooltip = "Copy", feedbackDuration = 1500, iconSize = 16, size = "sm", onCopy, onCopyError, }) => {
     const theme = (0, useCustomTheme_1.useCustomTheme)();
     const [copied, setCopied] = (0, react_1.useState)(false);
     const timer = (0, react_1.useRef)();
@@ -30,7 +30,7 @@ const CopyButton = ({ value, variant = "icon", label = "Copy", copiedLabel = "Co
             timer.current = setTimeout(() => setCopied(false), feedbackDuration);
         }
         catch {
-            /* clipboard unavailable — silently ignore */
+            onCopyError === null || onCopyError === void 0 ? void 0 : onCopyError(value);
         }
     };
     // NOTE: primary[500] fails AA as canvas ink in 5/7 brands (dark) — accentTextOnCanvas steps to a clearing rung.

package/dist/Components/Drawer/Drawer.d.ts

@@ -3,4 +3,4 @@ import { DrawerProps, DrawerHeaderSlotProps, DrawerBodySlotProps, DrawerFooterSl
 export declare const DrawerHeader: React.FC<DrawerHeaderSlotProps>;
 export declare const DrawerBody: React.FC<DrawerBodySlotProps>;
 export declare const DrawerFooter: React.FC<DrawerFooterSlotProps>;
-export default function Drawer({ isOpen, onClose, placement, size, id, variant, vaiant, initialFocusRef, finalFocusRef, closeOnOverlayClick, closeOnEsc, contentProps, hideCloseButton, portalChildren, children, }: DrawerProps): import("react/jsx-runtime").JSX.Element;
+export default function Drawer({ isOpen, onClose, placement, size, id, variant, vaiant, initialFocusRef, finalFocusRef, closeOnOverlayClick, closeOnEsc, contentProps, hideCloseButton, portalChildren, children, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, }: DrawerProps): import("react/jsx-runtime").JSX.Element;

package/dist/Components/Drawer/Drawer.js

@@ -9,6 +9,7 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = __importDefault(require("react"));
 const useCustomTheme_1 = require("../../Theme/useCustomTheme");
 const surfaceRaised_1 = require("../../Theme/tokens/builders/surfaceRaised");
+const dialogNaming_1 = require("../Modal/dialogNaming");
 const warnDroppedSlotChildren_1 = require("../Modal/warnDroppedSlotChildren");
 const react_2 = require("@chakra-ui/react");
 const DrawerHeader = ({ children }) => {
@@ -39,12 +40,15 @@ const findSlot = (children, slot) => {
     }
     return undefined;
 };
-function Drawer({ isOpen, onClose, placement = "right", size = "xl", id, variant, vaiant, initialFocusRef, finalFocusRef, closeOnOverlayClick, closeOnEsc, contentProps, hideCloseButton, portalChildren, children, }) {
+function DialogContent({ label, labelledBy, ...props }) {
+    return ((0, jsx_runtime_1.jsx)(dialogNaming_1.DialogNaming, { label: label, labelledBy: labelledBy, children: (0, jsx_runtime_1.jsx)(react_2.DrawerContent, { ...props }) }));
+}
+function Drawer({ isOpen, onClose, placement = "right", size = "xl", id, variant, vaiant, initialFocusRef, finalFocusRef, closeOnOverlayClick, closeOnEsc, contentProps, hideCloseButton, portalChildren, children, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, }) {
     var _a, _b;
     const { colors } = (0, useCustomTheme_1.useCustomTheme)();
     const headerSlot = findSlot(children, exports.DrawerHeader);
     const bodySlot = findSlot(children, exports.DrawerBody);
     const footerSlot = findSlot(children, exports.DrawerFooter);
     (0, warnDroppedSlotChildren_1.warnDroppedSlotChildren)("Drawer", children, [exports.DrawerHeader, exports.DrawerBody, exports.DrawerFooter]);
-    return ((0, jsx_runtime_1.jsxs)(react_2.Drawer, { isOpen: isOpen, placement: placement, onClose: onClose, size: size, variant: (_a = variant !== null && variant !== void 0 ? variant : vaiant) !== null && _a !== void 0 ? _a : "solid", id: id, initialFocusRef: initialFocusRef, finalFocusRef: finalFocusRef, closeOnOverlayClick: closeOnOverlayClick, closeOnEsc: closeOnEsc, children: [(0, jsx_runtime_1.jsx)(react_2.DrawerOverlay, {}), (0, jsx_runtime_1.jsxs)(react_2.DrawerContent, { ...contentProps, children: [!hideCloseButton && (0, jsx_runtime_1.jsx)(react_2.DrawerCloseButton, {}), headerSlot && ((0, jsx_runtime_1.jsx)(react_2.DrawerHeader, { borderBottomWidth: "1px", borderColor: (0, surfaceRaised_1.raisedRule)(colors), ...headerSlot.props, children: headerSlot })), (0, jsx_runtime_1.jsx)(react_2.DrawerBody, { ...((_b = bodySlot === null || bodySlot === void 0 ? void 0 : bodySlot.props) !== null && _b !== void 0 ? _b : {}), children: bodySlot }), footerSlot && ((0, jsx_runtime_1.jsx)(react_2.DrawerFooter, { borderTopWidth: "1px", borderColor: (0, surfaceRaised_1.raisedRule)(colors), ...footerSlot.props, children: footerSlot })), portalChildren] })] }));
+    return ((0, jsx_runtime_1.jsxs)(react_2.Drawer, { isOpen: isOpen, placement: placement, onClose: onClose, size: size, variant: (_a = variant !== null && variant !== void 0 ? variant : vaiant) !== null && _a !== void 0 ? _a : "solid", id: id, initialFocusRef: initialFocusRef, finalFocusRef: finalFocusRef, closeOnOverlayClick: closeOnOverlayClick, closeOnEsc: closeOnEsc, children: [(0, jsx_runtime_1.jsx)(react_2.DrawerOverlay, {}), (0, jsx_runtime_1.jsxs)(DialogContent, { ...contentProps, label: ariaLabel, labelledBy: ariaLabelledBy, children: [!hideCloseButton && (0, jsx_runtime_1.jsx)(react_2.DrawerCloseButton, {}), headerSlot && ((0, jsx_runtime_1.jsx)(react_2.DrawerHeader, { borderBottomWidth: "1px", borderColor: (0, surfaceRaised_1.raisedRule)(colors), ...headerSlot.props, children: headerSlot })), (0, jsx_runtime_1.jsx)(react_2.DrawerBody, { ...((_b = bodySlot === null || bodySlot === void 0 ? void 0 : bodySlot.props) !== null && _b !== void 0 ? _b : {}), children: bodySlot }), footerSlot && ((0, jsx_runtime_1.jsx)(react_2.DrawerFooter, { borderTopWidth: "1px", borderColor: (0, surfaceRaised_1.raisedRule)(colors), ...footerSlot.props, children: footerSlot })), portalChildren] })] }));
 }

package/dist/Components/Drawer/DrawerProps.d.ts

@@ -14,6 +14,10 @@ export type DrawerProps = Pick<ChakraDrawerProps, "isOpen" | "onClose" | "placem
     hideCloseButton?: boolean;
     /** Rendered inside the drawer's dialog after the slots (so live regions stay announced); nested dialogs portal out and keep focus here. Unmounts with the drawer. */
     portalChildren?: React.ReactNode;
+    /** Names the dialog instead of the whole header, for a header that holds fields or buttons. */
+    "aria-label"?: string;
+    /** Id of the element that names the dialog, e.g. a heading inside the header; wins over `aria-label`. */
+    "aria-labelledby"?: string;
 };
 /** Chakra style props (padding, borderBottom, gap, sx, ...) spread onto the rendered DrawerHeader; omit to keep theme defaults. Chakra's Drawer reuses Modal's header part internally. */
 export type DrawerHeaderSlotProps = ModalHeaderProps;

package/dist/Components/FormDrawer/FormDrawer.d.ts

@@ -1,2 +1,2 @@
 import type { FormDrawerProps } from "./FormDrawerProps";
-export default function FormDrawer({ isOpen, onClose, title, description, sections, errors, isDirty, onSubmit, isSubmitting, submitLabel, cancelLabel, secondaryAction, size, labels, "data-testid": testId, }: FormDrawerProps): import("react/jsx-runtime").JSX.Element;
+export default function FormDrawer({ isOpen, onClose, title, description, sections, errors, isDirty, onSubmit, isSubmitting, isSubmitDisabled, submitLabel, cancelLabel, secondaryAction, size, labels, "data-testid": testId, }: FormDrawerProps): import("react/jsx-runtime").JSX.Element;

package/dist/Components/FormDrawer/FormDrawer.js

@@ -51,7 +51,7 @@ const DEFAULT_LABELS = {
     discard: "Discard",
     keepEditing: "Keep editing",
 };
-function FormDrawer({ isOpen, onClose, title, description, sections, errors = [], isDirty, onSubmit, isSubmitting = false, submitLabel = "Save", cancelLabel = "Cancel", secondaryAction, size = "md", labels, "data-testid": testId = "form-drawer", }) {
+function FormDrawer({ isOpen, onClose, title, description, sections, errors = [], isDirty, onSubmit, isSubmitting = false, isSubmitDisabled = false, submitLabel = "Save", cancelLabel = "Cancel", secondaryAction, size = "md", labels, "data-testid": testId = "form-drawer", }) {
     const { colors } = (0, useCustomTheme_1.useCustomTheme)();
     const uid = (0, react_1.useId)();
     const formId = `${uid}-form`;
@@ -84,7 +84,7 @@ function FormDrawer({ isOpen, onClose, title, description, sections, errors = []
     };
     const submit = (event) => {
         event.preventDefault();
-        if (isSubmitting)
+        if (isSubmitting || isSubmitDisabled)
             return;
         focusPending.current = true;
         setAttempt((n) => n + 1);
@@ -93,5 +93,5 @@ function FormDrawer({ isOpen, onClose, title, description, sections, errors = []
     return ((0, jsx_runtime_1.jsxs)(Drawer_1.default, { isOpen: isOpen, onClose: requestClose, size: size, closeOnEsc: !isSubmitting, closeOnOverlayClick: !isSubmitting, portalChildren: (0, jsx_runtime_1.jsx)(AlertDialog_1.default, { isOpen: confirmDiscard, onClose: () => setConfirmDiscard(false), leastDestructiveRef: keepEditingRef, isCentered: true, tone: "danger", title: text.discardTitle, content: (0, jsx_runtime_1.jsx)(react_2.Text, { fontSize: "sm", color: colors.text[800], children: text.discardBody }), cancelButtonText: text.keepEditing, confirmButtonText: text.discard, onConfirm: () => {
                 setConfirmDiscard(false);
                 onClose();
-            } }), children: [(0, jsx_runtime_1.jsxs)(Drawer_1.DrawerHeader, { children: [(0, jsx_runtime_1.jsx)(react_2.Heading, { id: titleId, as: "h2", fontSize: "md", fontWeight: 600, color: colors.header[900], children: title }), description ? ((0, jsx_runtime_1.jsx)(react_2.Text, { mt: 0.5, fontSize: "sm", fontWeight: 400, color: colors.textMuted, children: description })) : null] }), (0, jsx_runtime_1.jsx)(Drawer_1.DrawerBody, { children: (0, jsx_runtime_1.jsx)(react_2.Box, { as: "form", id: formId, "aria-labelledby": titleId, onSubmit: submit, noValidate: true, "data-testid": testId, children: (0, jsx_runtime_1.jsxs)(react_2.Flex, { direction: "column", gap: 5, pt: 2, children: [errors.length ? ((0, jsx_runtime_1.jsxs)(react_2.Alert, { ref: summaryRef, tabIndex: -1, status: "error", variant: "subtle", borderRadius: "md", alignItems: "flex-start", "data-testid": `${testId}-errors`, children: [(0, jsx_runtime_1.jsx)(react_2.AlertIcon, {}), (0, jsx_runtime_1.jsxs)(react_2.Box, { children: [(0, jsx_runtime_1.jsx)(react_2.AlertTitle, { fontSize: "sm", children: text.fixErrors }), (0, jsx_runtime_1.jsx)(react_2.AlertDescription, { fontSize: "sm", children: (0, jsx_runtime_1.jsx)(react_2.UnorderedList, { mt: 1, children: errors.map((message) => ((0, jsx_runtime_1.jsx)(react_2.ListItem, { children: message }, message))) }) })] })] })) : null, sections.map((section, index) => ((0, jsx_runtime_1.jsxs)(react_1.Fragment, { children: [index > 0 ? (0, jsx_runtime_1.jsx)(react_2.Divider, { borderColor: colors.boxborder[200] }) : null, (0, jsx_runtime_1.jsxs)(react_2.Flex, { as: "section", direction: "column", gap: 4, "aria-label": section.title, children: [section.title ? ((0, jsx_runtime_1.jsxs)(react_2.Box, { children: [(0, jsx_runtime_1.jsx)(react_2.Heading, { as: "h3", fontSize: "sm", fontWeight: 600, color: colors.header[900], children: section.title }), section.description ? ((0, jsx_runtime_1.jsx)(react_2.Text, { mt: 0.5, fontSize: "xs", color: colors.textMuted, children: section.description })) : null] })) : null, section.content] })] }, section.id)))] }) }) }), (0, jsx_runtime_1.jsx)(Drawer_1.DrawerFooter, { children: (0, jsx_runtime_1.jsxs)(react_2.Flex, { gap: 2, w: "100%", justify: "flex-end", wrap: "wrap", children: [secondaryAction, (0, jsx_runtime_1.jsx)(Button_1.default, { variant: "ghost", colorScheme: "gray", onClick: requestClose, isDisabled: isSubmitting, label: cancelLabel }), (0, jsx_runtime_1.jsx)(Button_1.default, { variant: "solid", colorScheme: "primary", type: "submit", form: formId, isLoading: isSubmitting, loadingText: submitLabel, label: submitLabel, "data-testid": `${testId}-submit` })] }) })] }));
+            } }), children: [(0, jsx_runtime_1.jsxs)(Drawer_1.DrawerHeader, { children: [(0, jsx_runtime_1.jsx)(react_2.Heading, { id: titleId, as: "h2", fontSize: "md", fontWeight: 600, color: colors.header[900], children: title }), description ? ((0, jsx_runtime_1.jsx)(react_2.Text, { mt: 0.5, fontSize: "sm", fontWeight: 400, color: colors.textMuted, children: description })) : null] }), (0, jsx_runtime_1.jsx)(Drawer_1.DrawerBody, { children: (0, jsx_runtime_1.jsx)(react_2.Box, { as: "form", id: formId, "aria-labelledby": titleId, onSubmit: submit, noValidate: true, "data-testid": testId, children: (0, jsx_runtime_1.jsxs)(react_2.Flex, { direction: "column", gap: 5, pt: 2, children: [errors.length ? ((0, jsx_runtime_1.jsxs)(react_2.Alert, { ref: summaryRef, tabIndex: -1, status: "error", variant: "subtle", borderRadius: "md", alignItems: "flex-start", "data-testid": `${testId}-errors`, children: [(0, jsx_runtime_1.jsx)(react_2.AlertIcon, {}), (0, jsx_runtime_1.jsxs)(react_2.Box, { children: [(0, jsx_runtime_1.jsx)(react_2.AlertTitle, { fontSize: "sm", children: text.fixErrors }), (0, jsx_runtime_1.jsx)(react_2.AlertDescription, { fontSize: "sm", children: (0, jsx_runtime_1.jsx)(react_2.UnorderedList, { mt: 1, children: errors.map((message) => ((0, jsx_runtime_1.jsx)(react_2.ListItem, { children: message }, message))) }) })] })] })) : null, sections.map((section, index) => ((0, jsx_runtime_1.jsxs)(react_1.Fragment, { children: [index > 0 ? (0, jsx_runtime_1.jsx)(react_2.Divider, { borderColor: colors.boxborder[200] }) : null, (0, jsx_runtime_1.jsxs)(react_2.Flex, { as: "section", direction: "column", gap: 4, "aria-label": section.title, children: [section.title ? ((0, jsx_runtime_1.jsxs)(react_2.Box, { children: [(0, jsx_runtime_1.jsx)(react_2.Heading, { as: "h3", fontSize: "sm", fontWeight: 600, color: colors.header[900], children: section.title }), section.description ? ((0, jsx_runtime_1.jsx)(react_2.Text, { mt: 0.5, fontSize: "xs", color: colors.textMuted, children: section.description })) : null] })) : null, section.content] })] }, section.id)))] }) }) }), (0, jsx_runtime_1.jsx)(Drawer_1.DrawerFooter, { children: (0, jsx_runtime_1.jsxs)(react_2.Flex, { gap: 2, w: "100%", justify: "flex-end", wrap: "wrap", children: [secondaryAction, (0, jsx_runtime_1.jsx)(Button_1.default, { variant: "ghost", colorScheme: "gray", onClick: requestClose, isDisabled: isSubmitting, label: cancelLabel }), (0, jsx_runtime_1.jsx)(Button_1.default, { variant: "solid", colorScheme: "primary", type: "submit", form: formId, isLoading: isSubmitting, isDisabled: isSubmitDisabled, loadingText: submitLabel, label: submitLabel, "data-testid": `${testId}-submit` })] }) })] }));
 }

package/dist/Components/FormDrawer/FormDrawerProps.d.ts

@@ -40,6 +40,8 @@ export interface FormDrawerProps {
     onSubmit: () => void;
     /** Spins the submit button, disables Cancel and blocks every close path. Set it synchronously in `onSubmit` so error focus waits for the result. */
     isSubmitting?: boolean;
+    /** Disables the primary button and swallows Enter and any other form submit, so `onSubmit` never fires; unlike `isSubmitting`, Cancel and every close path stay live. */
+    isSubmitDisabled?: boolean;
     /** Defaults to "Save". */
     submitLabel?: string;
     /** Defaults to "Cancel". */

package/dist/Components/Modal/dialogNaming.d.ts

@@ -0,0 +1,8 @@
+import { type ReactNode } from "react";
+type DialogNamingProps = {
+    label?: string;
+    labelledBy?: string;
+    children: ReactNode;
+};
+export declare function DialogNaming({ label, labelledBy, children }: DialogNamingProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/Components/Modal/dialogNaming.js

@@ -0,0 +1,21 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DialogNaming = DialogNaming;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const react_2 = require("@chakra-ui/react");
+// Chakra's getDialogProps always points aria-labelledby at the header, so override it at the source.
+function DialogNaming({ label, labelledBy, children }) {
+    const modal = (0, react_2.useModalContext)();
+    const value = (0, react_1.useMemo)(() => label || labelledBy
+        ? {
+            ...modal,
+            getDialogProps: ((...args) => ({
+                ...modal.getDialogProps(...args),
+                ...(label ? { "aria-label": label } : {}),
+                "aria-labelledby": labelledBy,
+            })),
+        }
+        : modal, [modal, label, labelledBy]);
+    return (0, jsx_runtime_1.jsx)(react_2.ModalContextProvider, { value: value, children: children });
+}

package/dist/Components/NavLauncher/LauncherTabs.js

@@ -48,7 +48,7 @@ function LauncherTabs({ tabs, selected, onSelect, idBase, label, onLeaveUp, onLe
                         refs.current.set(tab.id, node);
                     else
                         refs.current.delete(tab.id);
-                }, "aria-selected": isSelected, "aria-controls": isSelected ? (0, exports.panelId)(idBase) : undefined, tabIndex: isSelected ? 0 : -1, onClick: () => onSelect(tab.id), position: "relative", flex: { base: 1, md: "none" }, minW: { md: "112px" }, h: "46px", px: { base: "6px", md: "14px" }, whiteSpace: "nowrap", fontSize: "14px", fontWeight: isSelected ? 600 : 500, color: isSelected ? colors.accentText : colors.textMuted, transition: (0, motion_1.transitionFor)(["color"]), _hover: {
+                }, "aria-selected": isSelected, "aria-controls": isSelected ? (0, exports.panelId)(idBase) : undefined, tabIndex: isSelected ? 0 : -1, onClick: () => onSelect(tab.id), position: "relative", flex: { base: 1, md: "none" }, minW: { md: "112px" }, h: "46px", px: { base: "6px", md: "14px" }, whiteSpace: "nowrap", fontSize: "sm", fontWeight: isSelected ? 600 : 500, color: isSelected ? colors.accentText : colors.textMuted, transition: (0, motion_1.transitionFor)(["color"]), _hover: {
                     color: isSelected ? colors.accentText : colors.text[900],
                 }, _after: {
                     content: '""',
@@ -59,6 +59,6 @@ function LauncherTabs({ tabs, selected, onSelect, idBase, label, onLeaveUp, onLe
                     h: "2px",
                     borderRadius: "2px 2px 0 0",
                     bg: isSelected ? colors.primary[500] : "transparent",
-                }, sx: { ...ring, borderRadius: "8px" }, children: tab.label }, tab.id));
+                }, sx: { ...ring, borderRadius: "lg" }, children: tab.label }, tab.id));
         }) }));
 }

package/dist/Components/NavLauncher/NavLauncher.d.ts

@@ -1,3 +1,3 @@
 import type { NavLauncherProps } from "./NavLauncherProps";
 /** Left-drawer navigation launcher: browse every module, pins, Frequent, Recent, search and (compact) the suite's apps. */
-export default function NavLauncher({ isOpen, onClose, sections: rawSections, pinnedIds, frequentIds, recentIds, onTogglePin, onNavigate, linkAs, actions, extraResults, query: controlledQuery, onQueryChange, isSearching, isLoading, keyScreenLimit, frequentLimit, suggestions, searchHint, modKeyLabel, headerActions, maxWidth, labels: labelOverrides, apps, currentAppId, onAppSelect, appsVisibility, "data-testid": testId, }: NavLauncherProps): import("react/jsx-runtime").JSX.Element;
+export default function NavLauncher({ isOpen, onClose, sections: rawSections, pinnedIds, frequentIds, recentIds, onTogglePin, onNavigate, linkAs, actions, extraResults, query: controlledQuery, onQueryChange, isSearching, isLoading, keyScreenLimit, frequentLimit, suggestions, searchHint, modKeyLabel, headerActions, maxWidth, labels: labelOverrides, apps, currentAppId, onAppSelect, appsVisibility, searchMode, synonyms, scopes, activeScope, onScopeChange, quickActions, answers, groupLimit, "data-testid": testId, }: NavLauncherProps): import("react/jsx-runtime").JSX.Element;