@kerfjs/ui 5.0.0-beta.67 → 5.0.0-beta.69

package/README.md

@@ -418,6 +418,9 @@ restyle). It reports repeated insets, exceptional spacing shorthands, and
 dynamic classes separately as review findings. Text, versioned JSON,
 and SARIF outputs carry stable `KUI-L###` ids, repository-relative locations,
 evidence, and ownership chains. See the [analyzer guide](./docs/ui-analyzer.md).
+Opt into ownership between components in one package with Doctor's
+`"ownership": "component"` setting and catalog `styleSources` declarations;
+the default keeps package-level ownership.
 
 ### Browser-backed integration evaluation
 

package/ai/application-ui-profile-sync.cjs

@@ -28,7 +28,7 @@ function mergeApplicationUiProfiles(layers) {
       catalogs.set(catalog.package, catalog);
       provenance[`$catalogs.${catalog.package}`] = source;
     }
-    for (const field of ['preferences', 'theme', 'tokens', 'layout'])
+    for (const field of ['preferences', 'theme', 'tokens', 'layout', 'wiring'])
       if (
         layer[field] &&
         typeof layer[field] === 'object' &&
@@ -166,6 +166,7 @@ function validateApplicationUiProfile(profile, options = {}) {
       'theme',
       'tokens',
       'layout',
+      'wiring',
       'exceptions',
     ],
     '$',
@@ -183,7 +184,25 @@ function validateApplicationUiProfile(profile, options = {}) {
   const theme = objectAt(profile.theme, '$.theme');
   const tokens = objectAt(profile.tokens, '$.tokens') ?? {};
   const layout = objectAt(profile.layout, '$.layout');
+  const wiring = objectAt(profile.wiring, '$.wiring');
   const exceptions = arrayAt(profile.exceptions, '$.exceptions');
+  rejectUnknown(wiring, ['entries'], '$.wiring');
+  if (wiring?.entries !== undefined) {
+    if (
+      !stringList(wiring.entries) ||
+      wiring.entries.some(
+        (entry) =>
+          isAbsolute(entry) ||
+          entry.split('/').includes('..') ||
+          /[*?]/.test(entry),
+      )
+    )
+      add(
+        'KUI-P030',
+        '$.wiring.entries',
+        'Wiring entries must be unique workspace-relative paths without traversal or wildcards.',
+      );
+  }
   const packages = new Set();
   for (const [index, catalog] of catalogs.entries()) {
     const path = `$.catalogs[${index}]`;

package/ai/application-ui-profile.d.ts

@@ -39,6 +39,10 @@ export interface ApplicationUiProfile {
     scrollOwnership?: 'one-per-pane' | 'application';
     spacingScale?: 'kerf-five-step' | 'application';
   };
+  wiring?: {
+    /** Static application entry modules, relative to the workspace root. */
+    entries?: string[];
+  };
   exceptions?: Array<{
     id: string;
     rules: string[];

package/ai/application-ui-profile.mjs

@@ -123,6 +123,14 @@ export function mergeApplicationUiProfiles(layers) {
       profile.layout = { ...profile.layout, ...layer.layout };
       recordProvenance(provenance, source, '$layout', layer.layout);
     }
+    if (
+      layer.wiring &&
+      typeof layer.wiring === 'object' &&
+      !Array.isArray(layer.wiring)
+    ) {
+      profile.wiring = { ...profile.wiring, ...layer.wiring };
+      recordProvenance(provenance, source, '$wiring', layer.wiring);
+    }
     for (const exception of Array.isArray(layer.exceptions)
       ? layer.exceptions
       : []) {
@@ -250,6 +258,7 @@ export function validateApplicationUiProfile(
       'theme',
       'tokens',
       'layout',
+      'wiring',
       'exceptions',
     ],
     '$',
@@ -269,7 +278,25 @@ export function validateApplicationUiProfile(
   const theme = objectAt(profile?.theme, '$.theme');
   const tokens = objectAt(profile?.tokens, '$.tokens') ?? {};
   const layout = objectAt(profile?.layout, '$.layout');
+  const wiring = objectAt(profile?.wiring, '$.wiring');
   const exceptions = arrayAt(profile?.exceptions, '$.exceptions');
+  rejectUnknown(wiring, ['entries'], '$.wiring');
+  if (wiring?.entries !== undefined) {
+    if (
+      !stringList(wiring.entries) ||
+      wiring.entries.some(
+        (entry) =>
+          isAbsolute(entry) ||
+          entry.split('/').includes('..') ||
+          /[*?]/.test(entry),
+      )
+    )
+      add(
+        'KUI-P030',
+        '$.wiring.entries',
+        'Wiring entries must be unique workspace-relative paths without traversal or wildcards.',
+      );
+  }
 
   const catalogPackages = new Set();
   for (const [index, catalog] of catalogs.entries()) {

package/ai/application-ui-profile.schema.json

@@ -25,6 +25,16 @@
       "additionalProperties": { "type": "string", "minLength": 1 }
     },
     "layout": { "$ref": "#/$defs/layout" },
+    "wiring": {
+      "type": "object",
+      "properties": {
+        "entries": {
+          "description": "Application entry modules, relative to the workspace root, where application-scoped wiring is installed.",
+          "$ref": "#/$defs/stringList"
+        }
+      },
+      "additionalProperties": false
+    },
     "exceptions": {
       "type": "array",
       "items": { "$ref": "#/$defs/exception" }

package/ai/component-catalog-extension.schema.json

@@ -59,6 +59,18 @@
           "uniqueItems": true
         },
         "source": { "$ref": "#/$defs/repositoryPath" },
+        "styleSources": {
+          "description": "Stylesheets owned by this component, relative to the consumer package root. Used by Doctor's opt-in component ownership mode.",
+          "type": "array",
+          "items": {
+            "allOf": [
+              { "$ref": "#/$defs/repositoryPath" },
+              { "pattern": "\\.css$" }
+            ]
+          },
+          "minItems": 1,
+          "uniqueItems": true
+        },
         "demoSource": { "$ref": "#/$defs/repositoryPath" },
         "geometry": { "$ref": "#/$defs/geometry" },
         "documentation": { "type": "string", "minLength": 1 }

package/ai/component-catalog.json

@@ -3,6 +3,13 @@
   "schemaVersion": 1,
   "package": "@kerfjs/ui",
   "description": "Machine-readable selection, composition, delivery, ownership, and accessibility metadata for Kerf UI and its supported Web Awesome set.",
+  "wiringProviders": [
+    {
+      "export": "wireCatalog",
+      "import": "@kerfjs/ui/wire-catalog",
+      "provides": ["wireScrollDividers"]
+    }
+  ],
   "entries": [
     {
       "id": "badge",
@@ -1591,7 +1598,7 @@
       "useWhen": [
         "Group related controls inside a toolbar with a supported visual treatment.",
         "Use ToolbarActionLink for navigation or external resources that must retain native anchor semantics inside a group.",
-        "Fill it with plain <button> controls (the group styles > button fully); use wa-button only for a Web Awesome feature. A popup menu is a PopupMenu in a single group with nestedDropdown; it renders its own trigger, so never hand-write wa-dropdown markup. Nothing wraps inside a group: an icon sits beside its label on one row and no trigger gets a fixed width.",
+        "Fill it with plain <button> controls (the group styles > button fully); use wa-button only for a Web Awesome feature. A popup menu is a PopupMenu in a single group with nestedDropdown; it renders its own trigger, so never hand-write wa-dropdown markup. Each control stays whole: an icon sits beside its label on one row and no trigger gets a fixed width. Use overflow=wrap for independent links that should move as whole actions to another row on narrow surfaces.",
         "For an avatar control, set content=avatar and avatarImage instead of inserting an img; one button paints the group and multiple buttons paint only the pressed highlight.",
         "In a Workbench or CollapsiblePanel toolbar, mark a group relocateOnCollapse to keep it available in the work-area toolbar when the panel closes; place it directly or in an array in any toolbar zone."
       ],
@@ -1628,7 +1635,7 @@
         "brand, neutral, or pop selected tone",
         "nested dropdown trigger",
         "standard, compact, or list-zero dropdown menu inset",
-        "visible or horizontally scrollable overflow",
+        "visible, horizontally scrollable, or whole-action wrapping overflow",
         "always visible or compact-only responsive visibility",
         "relocate on panel collapse",
         "avatar scrim",
@@ -3592,7 +3599,8 @@
       "description": "Controlled tab strips with typed presentation and allocation, a scroll-owning tab region, an optional adjacent trailing action, and a separately pinned far-edge end action.",
       "uses": [
         "tabs",
-        "toolbar-control-group"
+        "toolbar-control-group",
+        "wa-button"
       ],
       "purpose": "Controlled tab strips whose tabs shrink and scroll while fixed leading, trailing, and far-edge end actions remain visible.",
       "publicExports": [
@@ -3637,6 +3645,7 @@
         "intrinsic or fill allocation",
         "separate or adjacent trailing action",
         "far-edge end action",
+        "standalone Web Awesome action in trailing or end",
         "overflow dividers on each side with tabs scrolled out of view (wired by wireScrollDividers)"
       ],
       "accessibility": [
@@ -4691,7 +4700,8 @@
       ],
       "variants": [
         "labeled",
-        "decorative"
+        "decorative",
+        "sized"
       ],
       "accessibility": [
         "Labeled spinners use role img; decorative spinners are hidden and stop for reduced motion."

package/ai/component-catalog.schema.json

@@ -9,6 +9,20 @@
     "schemaVersion": { "const": 1 },
     "package": { "const": "@kerfjs/ui" },
     "description": { "type": "string", "minLength": 1 },
+    "wiringProviders": {
+      "description": "Public helpers whose call installs other cataloged wiring helpers.",
+      "type": "array",
+      "items": {
+        "type": "object",
+        "required": ["export", "import", "provides"],
+        "properties": {
+          "export": { "type": "string", "minLength": 1 },
+          "import": { "type": "string", "minLength": 1 },
+          "provides": { "type": "array", "items": { "type": "string", "minLength": 1 }, "minItems": 1, "uniqueItems": true }
+        },
+        "additionalProperties": false
+      }
+    },
     "entries": {
       "type": "array",
       "items": { "$ref": "#/$defs/entry" }

package/ai/component-composition-rules.json

@@ -171,14 +171,14 @@
       {
         "id": "trailing",
         "jsx": { "prop": "trailing" },
-        "accepts": ["toolbar-control-group"],
+        "accepts": ["toolbar-control-group", "wa-button"],
         "cardinality": { "min": 0, "max": 1 },
         "exclusiveWith": []
       },
       {
         "id": "end",
         "jsx": { "prop": "end" },
-        "accepts": ["toolbar-control-group"],
+        "accepts": ["toolbar-control-group", "wa-button"],
         "cardinality": { "min": 0, "max": 1 },
         "exclusiveWith": []
       }

package/ai/component-composition.d.ts

@@ -85,6 +85,8 @@ export interface CatalogCompositionEntry {
   wiring: {
     required: boolean;
     helpers: string[];
+    /** Defining source files for application-owned helpers, relative to the catalog package root. */
+    sources?: Array<{ export: string; source: string }>;
     obligations: string[];
     /** Wiring-owned `data-*` attributes a helper writes at runtime. Optional
      *  for extension catalogs; first-party entries always list it. */

package/ai/component-composition.json

@@ -3024,14 +3024,14 @@
         {
           "id": "trailing",
           "jsx": { "prop": "trailing" },
-          "accepts": ["toolbar-control-group"],
+          "accepts": ["toolbar-control-group", "wa-button"],
           "cardinality": { "min": 0, "max": 1 },
           "exclusiveWith": []
         },
         {
           "id": "end",
           "jsx": { "prop": "end" },
-          "accepts": ["toolbar-control-group"],
+          "accepts": ["toolbar-control-group", "wa-button"],
           "cardinality": { "min": 0, "max": 1 },
           "exclusiveWith": []
         }

package/ai/component-composition.schema.json

@@ -159,6 +159,16 @@
         },
         "sourceLinks": { "$ref": "#/$defs/stringList" },
         "source": { "type": "string", "minLength": 1 },
+        "styleSources": {
+          "description": "Stylesheets owned by this component, relative to the catalog package root. Required for an entry to own its CSS in opt-in component ownership mode when no selection catalog supplies it.",
+          "type": "array",
+          "items": {
+            "type": "string",
+            "pattern": "^(?!.*(?:^|/)\\.{1,2}(?:/|$))[A-Za-z0-9._-]+(?:/[A-Za-z0-9._-]+)*\\.css$"
+          },
+          "minItems": 1,
+          "uniqueItems": true
+        },
         "rendersAs": {
           "description": "For a wrapper component: the cataloged roots it renders (package-qualified keys), any one of them or nothing. Composition checks treat an element of this entry as each declared root: a zone accepts it only if it accepts every root, and each root's parent contract applies to where it is placed.",
           "type": "array",
@@ -214,7 +224,21 @@
           "required": ["required", "helpers", "obligations"],
           "properties": {
             "required": { "type": "boolean" },
+            "scope": { "enum": ["application", "module"] },
             "helpers": { "$ref": "#/$defs/stringList" },
+            "sources": {
+              "description": "Application-owned helper exports and their defining source files, relative to the catalog package root.",
+              "type": "array",
+              "items": {
+                "type": "object",
+                "required": ["export", "source"],
+                "properties": {
+                  "export": { "type": "string", "minLength": 1 },
+                  "source": { "type": "string", "minLength": 1 }
+                },
+                "additionalProperties": false
+              }
+            },
             "obligations": { "$ref": "#/$defs/stringList" },
             "stateAttributes": {
               "description": "Wiring-owned state attributes: data-* attributes a wiring helper writes at runtime, which the application must not render, remove, or treat as its own state. Optional for extension catalogs; first-party entries always list it, empty when their helpers write none.",

package/ai/components/loading-spinner.md

@@ -34,6 +34,7 @@ Exact prop names and types: [`@kerfjs/ui/loading-spinner`](../public-api-signatu
 
 - labeled
 - decorative
+- sized
 
 ## Composition
 

package/ai/components/tab-bar.md

@@ -45,6 +45,7 @@ Exact prop names and types: [`@kerfjs/ui/tab-bar`](../public-api-signatures-v1.m
 - intrinsic or fill allocation
 - separate or adjacent trailing action
 - far-edge end action
+- standalone Web Awesome action in trailing or end
 - overflow dividers on each side with tabs scrolled out of view (wired by wireScrollDividers)
 
 ## Composition
@@ -52,14 +53,14 @@ Exact prop names and types: [`@kerfjs/ui/tab-bar`](../public-api-signatures-v1.m
 - Parents: any.
 - Contexts: `tabpanel-navigation`.
 - Children: only `app-tab` (required: `app-tab`).
-- Built from: [AppTab](./tabs.md), [ToolbarControlGroup](./toolbar-control-group.md).
+- Built from: [AppTab](./tabs.md), [ToolbarControlGroup](./toolbar-control-group.md), [Button](./wa-button.md).
 
 Zones (a zone is bound to JSX only through its listed prop; never assume the zone id is a prop):
 
 - `tabs` — JSX prop `children`; accepts [AppTab](./tabs.md); at least 1.
 - `leading` — JSX prop `leading`; accepts [ToolbarControlGroup](./toolbar-control-group.md); 0–1.
-- `trailing` — JSX prop `trailing`; accepts [ToolbarControlGroup](./toolbar-control-group.md); 0–1.
-- `end` — JSX prop `end`; accepts [ToolbarControlGroup](./toolbar-control-group.md); 0–1.
+- `trailing` — JSX prop `trailing`; accepts [ToolbarControlGroup](./toolbar-control-group.md), [Button](./wa-button.md); 0–1.
+- `end` — JSX prop `end`; accepts [ToolbarControlGroup](./toolbar-control-group.md), [Button](./wa-button.md); 0–1.
 
 ## State and wiring
 
@@ -107,6 +108,6 @@ Everything else is internal: `kerf-ui-analyze` reports private or unknown `.kui-
 
 ## Related
 
-- Components: [AppTab](./tabs.md), [ToolbarControlGroup](./toolbar-control-group.md), [SegmentedControl](./segmented-control.md), [Select](./select.md), [Tab Group](./wa-tab-group.md).
+- Components: [AppTab](./tabs.md), [ToolbarControlGroup](./toolbar-control-group.md), [Button](./wa-button.md), [SegmentedControl](./segmented-control.md), [Select](./select.md), [Tab Group](./wa-tab-group.md).
 - Docs: [`docs/component-selection.md`](../../docs/component-selection.md), [`docs/accessibility.md#tabs`](../../docs/accessibility.md#tabs).
 - UX catalog route: `?component=tab-bar`.

package/ai/components/toolbar-control-group.md

@@ -12,7 +12,7 @@ Provide complete toolbar action geometry through configuration, including semant
 
 - Group related controls inside a toolbar with a supported visual treatment.
 - Use ToolbarActionLink for navigation or external resources that must retain native anchor semantics inside a group.
-- Fill it with plain \<button> controls (the group styles > button fully); use wa-button only for a Web Awesome feature. A popup menu is a PopupMenu in a single group with nestedDropdown; it renders its own trigger, so never hand-write wa-dropdown markup. Nothing wraps inside a group: an icon sits beside its label on one row and no trigger gets a fixed width.
+- Fill it with plain \<button> controls (the group styles > button fully); use wa-button only for a Web Awesome feature. A popup menu is a PopupMenu in a single group with nestedDropdown; it renders its own trigger, so never hand-write wa-dropdown markup. Each control stays whole: an icon sits beside its label on one row and no trigger gets a fixed width. Use overflow=wrap for independent links that should move as whole actions to another row on narrow surfaces.
 - For an avatar control, set content=avatar and avatarImage instead of inserting an img; one button paints the group and multiple buttons paint only the pressed highlight.
 - In a Workbench or CollapsiblePanel toolbar, mark a group relocateOnCollapse to keep it available in the work-area toolbar when the panel closes; place it directly or in an array in any toolbar zone.
 
@@ -49,7 +49,7 @@ Exact prop names and types: [`@kerfjs/ui/toolbar-control-group`](../public-api-s
 - brand, neutral, or pop selected tone
 - nested dropdown trigger
 - standard, compact, or list-zero dropdown menu inset
-- visible or horizontally scrollable overflow
+- visible, horizontally scrollable, or whole-action wrapping overflow
 - always visible or compact-only responsive visibility
 - relocate on panel collapse
 - avatar scrim

package/ai/public-api-signatures-v1.md

@@ -1,6 +1,6 @@
 # Public API signatures for the UI authoring corpus
 
-Generated from emitted declarations for `@kerfjs/ui@5.0.0-beta.67` and `kerfjs@5.0.0-beta.67`. This bounded reference covers only APIs used by the seven-task corpus. It is interface evidence, not an implementation or runtime guarantee.
+Generated from emitted declarations for `@kerfjs/ui@5.0.0-beta.69` and `kerfjs@5.0.0-beta.69`. This bounded reference covers only APIs used by the seven-task corpus. It is interface evidence, not an implementation or runtime guarantee.
 
 ## `@kerfjs/ui/css-values`
 
@@ -275,9 +275,11 @@ type ToolbarControlGroupContent = 'icon' | 'text' | 'mixed' | 'avatar' | 'search
 type ToolbarControlGroupFocusRing = 'control' | 'outline' | 'halo';
 type ToolbarControlGroupSelectedChrome = 'raised' | 'filled' | 'outline';
 type ToolbarControlGroupSelectedTone = 'brand' | 'neutral' | 'pop';
-type ToolbarControlGroupOverflow = 'visible' | 'scroll';
+type ToolbarControlGroupOverflow = 'visible' | 'scroll' | 'wrap';
 type ToolbarControlGroupMenuInset = 'standard' | 'compact' | 'list-zero';
-type ToolbarControlGroupVisibility = 'always' | 'compact-only';
+type ToolbarControlGroupVisibility = 'always' | 'compact-only' | 'hide-collapsed-tiny' | 'yield-to-expanded-sibling';
+type ToolbarControlGroupSizing = 'content' | 'grow' | 'fill';
+type ToolbarControlGroupPlacement = 'start' | 'end';
 interface ToolbarActionLinkProps {
     href: string;
     label: string;
@@ -316,10 +318,16 @@ interface ToolbarControlGroupProps {
     nestedDropdown?: boolean;
     /** Configure the nested dropdown menu inset without consumer ::part() CSS. */
     menuInset?: ToolbarControlGroupMenuInset;
-    /** Keep an overlong row of actions inside the available width with horizontal scrolling. */
+    /** Keep an overlong row inside the available width by scrolling or wrapping. */
     overflow?: ToolbarControlGroupOverflow;
     /** Responsive visibility owned by the enclosing Toolbar container. */
     visibility?: ToolbarControlGroupVisibility;
+    /** Intrinsic (default), grow from a basis, or occupy a full wrapping row. */
+    sizing?: ToolbarControlGroupSizing;
+    /** Place this group at the end of its flex row in a wrapping Toolbar zone. */
+    placement?: ToolbarControlGroupPlacement;
+    /** CSS length used as the minimum width and flex basis for `sizing="grow"`; defaults to 19rem. */
+    growBasis?: string;
     /** Move this group into the work-area toolbar when its panel collapses. */
     relocateOnCollapse?: boolean;
     /** Add contrast behind photo-backed avatar content. */
@@ -336,9 +344,9 @@ interface ToolbarControlGroupProps {
     /** Native named-slot assignment when composed inside a web component. */
     slot?: string;
 }
-declare function ToolbarControlGroup({ children, label, className, expanded, single, appearance, tone, buttonAppearance, shape, size, density, content, focusRing, selectedChrome, selectedTone, nestedDropdown, menuInset, overflow, visibility, relocateOnCollapse, scrim, busy, busyLabel, avatarImage, slot, }: ToolbarControlGroupProps): kerfjs.SafeHtml;
+declare function ToolbarControlGroup({ children, label, className, expanded, single, appearance, tone, buttonAppearance, shape, size, density, content, focusRing, selectedChrome, selectedTone, nestedDropdown, menuInset, overflow, visibility, sizing, placement, growBasis, relocateOnCollapse, scrim, busy, busyLabel, avatarImage, slot, }: ToolbarControlGroupProps): kerfjs.SafeHtml;
 
-export { ToolbarActionLink, type ToolbarActionLinkProps, ToolbarControlGroup, type ToolbarControlGroupAppearance, type ToolbarControlGroupButtonAppearance, type ToolbarControlGroupContent, type ToolbarControlGroupDensity, type ToolbarControlGroupFocusRing, type ToolbarControlGroupMenuInset, type ToolbarControlGroupOverflow, type ToolbarControlGroupProps, type ToolbarControlGroupSelectedChrome, type ToolbarControlGroupSelectedTone, type ToolbarControlGroupShape, type ToolbarControlGroupSize, type ToolbarControlGroupTone, type ToolbarControlGroupVisibility };
+export { ToolbarActionLink, type ToolbarActionLinkProps, ToolbarControlGroup, type ToolbarControlGroupAppearance, type ToolbarControlGroupButtonAppearance, type ToolbarControlGroupContent, type ToolbarControlGroupDensity, type ToolbarControlGroupFocusRing, type ToolbarControlGroupMenuInset, type ToolbarControlGroupOverflow, type ToolbarControlGroupPlacement, type ToolbarControlGroupProps, type ToolbarControlGroupSelectedChrome, type ToolbarControlGroupSelectedTone, type ToolbarControlGroupShape, type ToolbarControlGroupSize, type ToolbarControlGroupSizing, type ToolbarControlGroupTone, type ToolbarControlGroupVisibility };
 ```
 
 ## `@kerfjs/ui/floating-toolbar`
@@ -1078,10 +1086,12 @@ interface TabBarProps {
     label: string;
     children: KerfUiContent;
     leading?: KerfUiContent;
+    /** Tab-local action: a ToolbarControlGroup or a standalone Web Awesome button. */
     trailing?: KerfUiContent;
     /**
      * Action pinned to the far edge of the bar. Combine with an adjacent `trailing`
      * action when the tab-local and workspace-level actions must remain distinct.
+     * Accepts a ToolbarControlGroup or a standalone Web Awesome button.
      */
     end?: KerfUiContent;
     className?: string;
@@ -1186,6 +1196,7 @@ interface WireScrollDividersOptions {
      */
     targets?: readonly ScrollDividerTarget[];
 }
+type Root = HTMLElement | Document;
 /**
  * Wire scroll dividers below `root`: a divider between pinned chrome and the
  * content that scrolls beside it shows only while content is scrolled away
@@ -1213,11 +1224,13 @@ interface WireScrollDividersOptions {
  *
  * Structure is re-read after every DOM change below root (a re-render that
  * drops the attributes gets them back before paint), scroll is tracked with
- * one capturing listener, and size changes of each scroller and its children
- * with a `ResizeObserver`. Returns a disposer that removes every attribute it
- * wrote. See `docs/23-app-layouts.md` §3.7.
+ * one capturing listener per registered root, and size changes of each
+ * scroller and its children with a `ResizeObserver`. Overlapping registrations
+ * share one attribute writer; each disposer removes its registration, and the
+ * final disposer removes the wiring-owned attributes. See
+ * `docs/23-app-layouts.md` §3.7.
  */
-declare function wireScrollDividers(root: HTMLElement | Document, { targets }?: WireScrollDividersOptions): () => void;
+declare function wireScrollDividers(root: Root, { targets }?: WireScrollDividersOptions): () => void;
 
 export { type ScrollDividerTarget, type WireScrollDividersOptions, wireScrollDividers };
 ```
@@ -2698,7 +2711,7 @@ type SelectAccessibleName = {
     label?: never;
     ariaLabel: string;
 };
-type SelectPresentation = 'form' | 'toolbar-borderless' | 'navigation';
+type SelectPresentation = 'form' | 'toolbar-borderless' | 'navigation' | 'inline' | 'title';
 type SelectSize = 'default' | 'compact';
 type SelectSelectedPresentation = 'label' | 'icon-only';
 type SelectFocusRingOwner = 'select' | 'group';
@@ -2715,7 +2728,7 @@ interface SelectBaseProps<Value extends string = string> {
     fitMenu?: boolean;
     /** Render as an unanimated loading skeleton: the label above a static, empty control box. */
     placeholder?: boolean;
-    /** Form (default), borderless toolbar, or intrinsic navigation chrome. */
+    /** Form (default), borderless toolbar, intrinsic navigation, inline, or view-title chrome. */
     presentation?: SelectPresentation;
     size?: SelectSize;
     /** Closed trigger width; omit to keep the presentation's default. */
@@ -2724,6 +2737,8 @@ interface SelectBaseProps<Value extends string = string> {
     caret?: boolean;
     /** Let an enclosing ToolbarControlGroup paint the composed focus ring. */
     focusRingOwner?: SelectFocusRingOwner;
+    /** Keep the trigger's focus ring inside its box when an ancestor clips overflow. */
+    focusRingInset?: boolean;
     /** Maximum closed-control label width in CSS pixels before ellipsis. */
     labelMaxWidth?: number;
     /** Native named-slot assignment when composed inside a web component. */
@@ -2844,17 +2859,22 @@ export { EmptyState, type EmptyStateProps };
 
 ```ts
 import * as kerfjs from 'kerfjs';
+import { LucideIconSize } from './lucide-icon.js';
+import 'lucide';
 
+type LoadingSpinnerSize = LucideIconSize;
 interface LoadingSpinnerProps {
     className?: string;
     label?: string;
+    /** Named icon scale or positive pixel size, converted to rem. Omit for 1em. */
+    size?: LoadingSpinnerSize;
     /** Native named-slot assignment when composed inside a web component. */
     slot?: string;
 }
 /** Stable viewBox-centered progress ring based on svg-spinners' MIT-licensed 180-ring. */
-declare function LoadingSpinner({ className, label, slot, }: LoadingSpinnerProps): kerfjs.SafeHtml;
+declare function LoadingSpinner({ className, label, size, slot, }: LoadingSpinnerProps): kerfjs.SafeHtml;
 
-export { LoadingSpinner, type LoadingSpinnerProps };
+export { LoadingSpinner, type LoadingSpinnerProps, type LoadingSpinnerSize };
 ```
 
 ## `@kerfjs/ui/skeleton`