@adia-ai/web-components 0.8.44 → 0.8.46

package/components/chart/chart.css

@@ -15,6 +15,17 @@
     --chart-fg:             var(--md-sys-color-neutral-on-surface);
     --chart-bar:            var(--md-sys-color-primary);
     --chart-bar-hover:      var(--a-primary-bg-hover);
+    /* REQ-F-015/016 — a provisional bar's soft fill, paired with
+       `--chart-bar`'s primary role the same way calendar-grid-ui pairs
+       `--md-sys-color-primary` with `--md-sys-color-primary-container`
+       for its own soft/tonal fill. Flat across every series/color variant
+       — a judgment call named here, not left silent: the provisional
+       state already discards per-series hue for its OUTLINE color
+       (`--chart-bar` above, not each series' own stroke), so a single
+       tonal fill costs nothing further and keeps "provisional" reading as
+       one consistent state regardless of which series or chart `color` it
+       belongs to. */
+    --chart-provisional-fill: var(--md-sys-color-primary-container);
     --chart-line:           var(--md-sys-color-primary);
     --chart-dot:            var(--md-sys-color-primary);
     --chart-grid:           var(--md-sys-color-neutral-outline-variant);
@@ -45,6 +56,70 @@
     --chart-segments-gap:   2px;
     --chart-pie-gap:        1.25px;
 
+    /* ── Charts 2.0 foundations (ADR-0081, gh#1804) ──
+       REQ-F-009/010 — chrome-layer clearance + the zero-line→chip-band
+       gap, both --a-space-*-aliased (chart.class.js's #dims() reads these
+       via getComputedStyle with a matching JS fallback for the
+       happy-dom test environment, which doesn't resolve var()/calc()). */
+    --chart-chrome-inset:   var(--a-space-2);
+    --chart-band-gap:       var(--a-space-1);
+    /* REQ-F-008 — today-marker color, default the primary role. */
+    --chart-today:          var(--md-sys-color-primary);
+    /* REQ-F-005 — chip token contract, all six resolving through the
+       existing --a-* / --md-sys-color-* ladders (no new roles minted).
+       OPEN-5 (chip background role) — MEASURED, gh#1814 (real resolved
+       oklch → sRGB + WCAG contrast math, both schemes, both named
+       backdrops: --md-sys-color-neutral-container-low composited over
+       the page background for the full-bleed case, line 842 below; a
+       plain top-level card's own --md-sys-color-neutral-surface for the
+       other). Text legibility (chip-fg on chip-bg) clears AA with a wide
+       margin in every combination (>=11:1, gate floor 4.5:1) — this
+       repo's own verify:contrast discipline is fully satisfied regardless
+       of which of these two tokens is used, since both sit in the same
+       tight, deliberately-subtle neutral "surface elevation" band.
+       Non-text surface DISTINCTNESS is the real, disclosed limitation:
+       no existing --a-* / --md-sys-color-* neutral role reaches the
+       informal 3:1 UI-boundary heuristic against either backdrop, in
+       either scheme — swapping among them is a matter of degree, not a
+       pass/fail token pick, and minting a new role to clear 3:1 would
+       violate this SPEC's own no-new-roles non-goal. The originally
+       shipped --md-sys-color-neutral-surface-bright measured ~1.0-1.1:1
+       against both backdrops in both schemes (barely perceptible — a
+       real gap, not the "distinct pill" its own prior comment claimed
+       without having actually rendered it). --md-sys-color-neutral-
+       container-high measures ~1.24-1.40:1 instead (a real, screenshot-
+       confirmed improvement — the chip's rounded boundary reads clearly
+       in both schemes and against both backdrops) while keeping text
+       legibility comfortably >=11:1 — the better of the two available
+       options, not a 3:1-clearing fix. Full numbers + screenshots in the
+       gh#1814 Findings. */
+    --chart-chip-bg:        var(--md-sys-color-neutral-container-high);
+    --chart-chip-fg:        var(--md-sys-color-neutral-on-surface);
+    --chart-chip-radius:    var(--a-radius-sm);
+    --chart-chip-pad-x:     var(--a-space-1-5);
+    --chart-chip-pad-y:     var(--a-space-1);
+    --chart-chip-font-size: var(--a-ui-tiny);
+    /* REQ-F-013/OPEN-4 — min-plot-height degradation floors (chip mode
+       only, see #dims()'s own doc comment for why `outside` mode never
+       applies these). MEASURED breakpoints, not spacing values (OPEN-4's
+       resolution posture distinguishes the two) — but expressed through
+       the SAME --a-density-scaled-rem mechanism --a-space-* itself is
+       built from (space.css), rather than a bare px literal, so a scoped
+       [density] host still rescales the floor consistently with every
+       other foundations token (REQ-F-014) even though there's no single
+       NAMED --a-space-* rung at exactly 180/120px.
+       OPEN-4 RESOLVED (gh#1814): a real-browser measurement sweep across
+       all three ratio buckets confirmed both values unchanged AND
+       confirmed the model itself — height-only, never per-bucket (the
+       chip/gridline vertical geometry these floors gate doesn't depend on
+       plot width). Full rationale in the SPEC's REQ-F-013 resolution
+       note. That same sweep found and fixed an unrelated real defect: the
+       domain-min/-max y-chip's own edge clamp could overlap its unclamped
+       neighbor at ~155-220px with 7 nice-number ticks — see
+       `#renderYChips`'s own doc comment. */
+    --chart-min-plot-height-chips: calc(var(--a-density) * 11.25rem); /* 180px at d=1 */
+    --chart-min-plot-height-grid:  calc(var(--a-density) * 7.5rem);   /* 120px at d=1 */
+
     /* Transitions */
     --chart-duration:       var(--a-duration-fast);
     --chart-easing:         var(--a-easing);
@@ -211,6 +286,85 @@
     font-family: var(--chart-font);
   }
 
+  /* ── Chip labels (REQ-F-004/005/006, ADR-0081) ──
+     Rendered by #renderYChips/#renderXChips (chart.class.js) only when
+     `data-labels-resolved="chip"` — geometry (position/clamp/thin/corner
+     clearance) is computed in JS; this is styling only. `rx`/`ry` are set
+     here (not as SVG attributes) because CSS custom properties don't
+     resolve inside a bare SVG presentation-attribute string
+     (svg-authoring.md §5) — a real CSS declaration is required. */
+
+  [data-chip] {
+    fill: var(--chart-chip-bg);
+    rx: var(--chart-chip-radius);
+    ry: var(--chart-chip-radius);
+  }
+
+  [data-chip-label] {
+    fill: var(--chart-chip-fg);
+    font-size: var(--chart-chip-font-size);
+    font-family: var(--chart-font);
+  }
+
+  /* ── Today-marker (REQ-F-008, ADR-0081) ──
+     Anatomy: a baseline dot + a short band tick, never a full-height rule
+     — geometry (position, direction) is computed in
+     #todayMarkerVertical/#todayMarkerHorizontal (chart.class.js); this is
+     styling only. */
+
+  [data-today-dot] {
+    fill: var(--chart-today);
+    stroke: var(--chart-dot-stroke);
+    stroke-width: 1.5;
+  }
+
+  [data-today-tick] {
+    stroke: var(--chart-today);
+    stroke-width: 2;
+    stroke-linecap: round;
+  }
+
+  /* ── Provisional datum (REQ-F-015/016, ADR-0081 §3) ──
+     Per-datum `.provisional` flag — bar family renders a soft tonal fill +
+     dashed outline (never the ordinary solid fill) instead of the
+     ordinary filled bar; scatter's dot renders a hollow ring the same way
+     (no fill at all — a dot has no area to give hover feedback the way a
+     bar's own body does, so it stays hollow). Multi-series types
+     (stacked-bar/grouped-bar/composed) set their per-series color via an
+     inline `style="fill:var(--color-{key},...)"` (#seriesFill(), fill
+     only) — the flat `--chart-bar`/`--chart-provisional-fill`/`--chart-dot`
+     tokens here are this build's deliberate simplification for the
+     provisional OUTLINE/FILL color rather than re-deriving each series'
+     own color, named as a judgment call in the build's Findings rather
+     than left silent. Multi-series bars never carry `data-bar` (only
+     `data-slice` — see #seriesFill), so the selector below also targets
+     `[data-slice]` bar shapes directly; `!important` on `fill` is
+     required to beat that same inline style (expressing this any other
+     way needs the render path to skip #seriesFill for provisional rows,
+     a larger change than this selector fix warrants).
+     Giving the fill a real, visible value (rather than `none`) is
+     deliberate, not decorative: a hollow bar has nothing for a `:hover`
+     rule to darken/lighten, so hovering a provisional bar previously gave
+     no feedback at all. No separate `[data-provisional]:hover` rule is
+     needed — `path[data-slice]:hover`/`rect[data-slice]:hover`/
+     `[data-bar]:hover`'s existing `opacity: 0.92` already match these
+     same elements; they simply had nothing visible to dim before. */
+
+  [data-bar][data-provisional],
+  path[data-slice][data-provisional],
+  rect[data-slice][data-provisional] {
+    fill: var(--chart-provisional-fill) !important;
+    stroke: var(--chart-bar);
+    stroke-width: 1.5;
+    stroke-dasharray: 4 3;
+  }
+
+  [data-dot][data-provisional] {
+    fill: none;
+    stroke: var(--chart-dot);
+    stroke-width: 1.5;
+  }
+
   /* ── Bar ── */
 
   [data-bar] {
@@ -232,6 +386,26 @@
     stroke-linecap: round;
   }
 
+  /* ── Line/area provisional-span overlay (REQ-F-015, ADR-0081 §3) ──
+     #lineProvisionalOverlay (chart.class.js) emits these two elements
+     only when at least one datum in the series is provisional; a fixture
+     with no provisional data never emits them at all. */
+
+  [data-line-provisional] {
+    stroke: var(--chart-line);
+    stroke-width: var(--chart-line-width);
+    fill: none;
+    stroke-linejoin: round;
+    stroke-linecap: round;
+    stroke-dasharray: 5 4;
+  }
+
+  [data-area-provisional-fade] {
+    fill: var(--md-sys-color-neutral-surface);
+    opacity: 0.55;
+    pointer-events: none;
+  }
+
   /* ── Area fill ──
      Enabled by default for line / multi-line charts. Fades from the top
      (most visible, tinted by --chart-area-opacity) to transparent at the

package/components/chart/chart.d.ts

@@ -24,12 +24,14 @@ export class UIChart extends UIElement {
   color: 'accent' | 'success' | 'warning' | 'danger' | 'info';
   /** Bar corner radius in px (null = let CSS tokens decide) */
   cornerRadius: number | null;
-  /** JS property (set programmatically — `el.data = [...]`). An array of plain objects; each object's keys are named by the `x` and `y` attributes — e.g. `<chart-ui x="month" y="revenue">` consumes `[{month:'Jan', revenue:3200}, {month:'Feb', revenue:4100}]`. The Chart.js `{labels, datasets}` envelope is NOT chart-ui's API — passing it (or any non-array value) renders an empty chart. May also be supplied declaratively as a JSON-array `data="[…]"` attribute, hydrated once at connect. Custom accessor on the element class, not a reflected attribute. */
+  /** JS property (set programmatically — `el.data = [...]`). An array of plain objects; each object's keys are named by the `x` and `y` attributes — e.g. `<chart-ui x="month" y="revenue">` consumes `[{month:'Jan', revenue:3200}, {month:'Feb', revenue:4100}]`. The Chart.js `{labels, datasets}` envelope is NOT chart-ui's API — passing it (or any non-array value) renders an empty chart. May also be supplied declaratively as a JSON-array `data="[…]"` attribute, hydrated once at connect. Custom accessor on the element class, not a reflected attribute. A datum object carrying a truthy `provisional` key (ADR-0081) renders that period's type-specific incomplete-period treatment (hollow/dashed bar, dashed line + faded area, hollow ring dot) on cartesian types; a no-op on radial/part-to-whole types and sparkline (gh#1690's N/A list). Provisional state is per-datum data-shape, not a chart-ui attribute — see ADR-0081 §3. */
   data: string;
   /** Marker (dot) visibility for line and multi-line series. `all` draws a circle[data-dot] on every datum (default — matches pre-gh#561 behavior). `none` hides all dots so a dense series reads as a clean line. `hover` shows only the currently-hovered datum's dot. `last` shows only the terminal point per series (sparkline convention). Tooltip hit targets ([data-hit]) are a separate always-rendered layer — every mode keeps hover/click working along the whole line. */
   dots: 'all' | 'none' | 'hover' | 'last';
   /** Number-format mode applied to axis labels + value overlays + donut total + gauge value + treemap value + funnel value + internal tooltip. `abbr` is the legacy 1.2K / 3M format; `decimal` fixes 2 decimals; `currency` prefixes via `--chart-currency-prefix` token (default "$"); `percent` multiplies × 100 and adds a % suffix. */
   format: 'abbr' | 'decimal' | 'currency' | 'percent';
+  /** Chart 2.0 axis-label mode (ADR-0081). Unset (default, "") always resolves to `outside` — today's pre-2.0 outside-the-plot axis labels, byte-for-byte unchanged. Set explicitly to `chip` to opt into the pill-treated overlay labels inset within the plot box (never hanging outside it) — the resolved value reflects onto the host as `data-labels-resolved="chip"|"outside"`. Deliberately explicit-opt-in rather than auto-detected from full-bleed ancestry (`section[bleed]`/ `card-ui[padding="none"]`): an earlier draft auto-activated chip mode on any full-bleed composition, which silently changed the rendering of every ALREADY-SHIPPED full-bleed chart the moment it shipped — this build's own 60-fixture Charts visual-eval floor caught it (2 `comp-chart-in-card-n-*` regressions). `chart-in-card` compositions opt in explicitly once their own examples are updated (gh#1805). */
+  labels: '' | 'chip' | 'outside';
   /** Show a skeleton placeholder instead of the chart body. Set to true while data is being fetched; clear once data arrives. Preserves the element's aspect-ratio dimensions so the skeleton occupies the same space the chart will fill. Parity with stat-ui[loading] and table-ui[loading] (§FB-12, v0.6.27). */
   loading: boolean;
   /** When true, suppress the overlaid average line. Canonical spelling (ADR-0063, gh#1563) — the deprecated `hideAverage` dual-read shim was cut in 0.8.43 (gh#1617). */
@@ -46,6 +48,8 @@ export class UIChart extends UIElement {
   size: 'sm' | 'md' | 'lg';
   /** Line smoothing factor */
   smooth: number;
+  /** Names the datum whose x-axis value marks "today" (ADR-0081). Unset (default, "") renders no marker — additive. Compared against each datum's x-key value via a loose string comparison (`String(datum[x]) === String(today)`), so category axes ("month", "region") work the same as literal date strings; chart-ui never auto-derives today from the clock. Renders a baseline dot + a short band tick (REQ-F-008) on cartesian types (bar, line, area, scatter, multi-line, stacked-bar, grouped-bar, composed); a no-op on every radial/part-to-whole type and on sparkline (gh#1690's N/A list). Fallback (not the primary mechanism): a datum already carrying a truthy `today` key is treated as an equivalent marker even with this attribute unset. */
+  today: string;
   /** Data key for x-axis (category) values */
   x: string;
   /** Y-axis key(s), comma-separated for multi-series */

package/components/chart/chart.yaml

@@ -115,6 +115,45 @@ props:
       - "1:1"
       - "2:3"
     reflect: true
+  labels:
+    description: >-
+      Chart 2.0 axis-label mode (ADR-0081). Unset (default, "") always
+      resolves to `outside` — today's pre-2.0 outside-the-plot axis labels,
+      byte-for-byte unchanged. Set explicitly to `chip` to opt into the
+      pill-treated overlay labels inset within the plot box (never hanging
+      outside it) — the resolved value reflects onto the host as
+      `data-labels-resolved="chip"|"outside"`. Deliberately explicit-opt-in
+      rather than auto-detected from full-bleed ancestry (`section[bleed]`/
+      `card-ui[padding="none"]`): an earlier draft auto-activated chip mode
+      on any full-bleed composition, which silently changed the rendering of
+      every ALREADY-SHIPPED full-bleed chart the moment it shipped — this
+      build's own 60-fixture Charts visual-eval floor caught it
+      (2 `comp-chart-in-card-n-*` regressions). `chart-in-card` compositions
+      opt in explicitly once their own examples are updated (gh#1805).
+    type: string
+    default: ""
+    enum:
+      - ""
+      - chip
+      - outside
+    reflect: true
+  today:
+    description: >-
+      Names the datum whose x-axis value marks "today" (ADR-0081). Unset
+      (default, "") renders no marker — additive. Compared against each
+      datum's x-key value via a loose string comparison
+      (`String(datum[x]) === String(today)`), so category axes ("month",
+      "region") work the same as literal date strings; chart-ui never
+      auto-derives today from the clock. Renders a baseline dot + a short
+      band tick (REQ-F-008) on cartesian types (bar, line, area, scatter,
+      multi-line, stacked-bar, grouped-bar, composed); a no-op on every
+      radial/part-to-whole type and on sparkline (gh#1690's N/A list).
+      Fallback (not the primary mechanism): a datum already carrying a
+      truthy `today` key is treated as an equivalent marker even with this
+      attribute unset.
+    type: string
+    default: ""
+    reflect: true
   smooth:
     description: Line smoothing factor
     type: number
@@ -213,7 +252,12 @@ props:
       passing it (or any non-array value) renders an empty chart. May also
       be supplied declaratively as a JSON-array `data="[…]"` attribute,
       hydrated once at connect. Custom accessor on the element class, not a
-      reflected attribute.
+      reflected attribute. A datum object carrying a truthy `provisional`
+      key (ADR-0081) renders that period's type-specific incomplete-period
+      treatment (hollow/dashed bar, dashed line + faded area, hollow ring
+      dot) on cartesian types; a no-op on radial/part-to-whole types and
+      sparkline (gh#1690's N/A list). Provisional state is per-datum
+      data-shape, not a chart-ui attribute — see ADR-0081 §3.
     type: array
     items:
       type: object

package/components/context-menu/context-menu.a2ui.json

@@ -2,7 +2,7 @@
   "$schema": "https://json-schema.org/draft/2020-12/schema",
   "$id": "https://adiaui.dev/a2ui/v0_9/components/ContextMenu.json",
   "title": "ContextMenu",
-  "description": "Right-click activated menu — the OS-native context-menu pattern as a\nweb component. Distinct from `menu-ui` (which is button-triggered):\nsame item shape (`menu-item-ui` children), different trigger surface\n(`contextmenu` event), and pointer-anchored positioning instead of\nelement-anchored. Pattern: WAI-APG Menu.\n\nTwo binding modes:\n **A. Wrap.** Default-slot child becomes the target:\n `<context-menu-ui><my-table>...</my-table>...items</context-menu-ui>`.\n **B. Selector.** Point at one or more existing elements via [for]:\n `<context-menu-ui for=\"#my-table\">...items</context-menu-ui>`.\n\nOn `contextmenu` event on a target: `preventDefault()`, position the\nmenu at the pointer coords, show via Popover API. Touch long-press\n(configurable via [long-press-ms]) does the same. Shift+F10 / Menu\nkey opens at the focused target's center for keyboard users.\n",
+  "description": "Right-click activated menu — the OS-native context-menu pattern as a\nweb component. Distinct from `menu-ui` (which is button-triggered):\nsame item shape (`menu-item-ui` children), different trigger surface\n(`contextmenu` event), and pointer-anchored positioning instead of\nelement-anchored. Pattern: WAI-APG Menu.\n\nTwo binding modes:\n **A. Wrap.** Default-slot child becomes the target:\n `<context-menu-ui><my-table>...</my-table>...items</context-menu-ui>`.\n **B. Selector.** Point at one or more existing elements via\n [target-selector]:\n `<context-menu-ui target-selector=\"#my-table\">...items</context-menu-ui>`.\n\nOn `contextmenu` event on a target: `preventDefault()`, position the\nmenu at the pointer coords, show via Popover API. Touch long-press\n(configurable via [long-press-ms]) does the same. Shift+F10 / Menu\nkey opens at the focused target's center for keyboard users.\n",
   "type": "object",
   "allOf": [
     {
@@ -17,7 +17,7 @@
       "const": "ContextMenu"
     },
     "for": {
-      "description": "CSS selector(s) for target element(s). Empty = use default-slot child.",
+      "description": "DEPRECATED alias for [target-selector] — still a CSS selector, NOT an id-ref. Honored when [target-selector] is unset, with a one-shot console.warn pointing consumers at the replacement. New authoring should use [target-selector].",
       "type": "string",
       "default": ""
     },
@@ -30,6 +30,11 @@
       "description": "Programmatic open state. Set true to open at target center.",
       "type": "boolean",
       "default": false
+    },
+    "targetSelector": {
+      "description": "CSS selector(s) for target element(s). Empty = use default-slot child. Ratified name (gh#1764/#1780, ADR-0079) for what [for] used to carry — [for] means an id-ref everywhere else in AdiaUI (table-toolbar-ui, chart-legend-ui, tooltip-ui); context-menu-ui's own selector meaning predates that convention and was a same-name/ different-contract collision (ADR-0053's no-shadowing doctrine).",
+      "type": "string",
+      "default": ""
     }
   },
   "required": [
@@ -39,7 +44,7 @@
   "x-adiaui": {
     "anti_patterns": [
       {
-        "fix": "Wrap a target: `<context-menu-ui><my-target></my-target>...items</context-menu-ui>` OR point at one: `<context-menu-ui for=\"#my-target\">...items</context-menu-ui>`.",
+        "fix": "Wrap a target: `<context-menu-ui><my-target></my-target>...items</context-menu-ui>` OR point at one: `<context-menu-ui target-selector=\"#my-target\">...items</context-menu-ui>`.",
         "why": "No target binding — the menu never opens.",
         "wrong": "<context-menu-ui>...just items...</context-menu-ui>"
       }

package/components/context-menu/context-menu.class.js

@@ -4,8 +4,16 @@
  * Two binding shapes:
  *   A. Wrap a target — first non-menu-item-ui default-slot child becomes
  *      the contextmenu host.
- *   B. Point at targets via [for="<selector>"] — useful for whole-table
- *      / whole-canvas menus where wrapping isn't practical.
+ *   B. Point at targets via [target-selector="<css-selector>"] — useful for
+ *      whole-table / whole-canvas menus where wrapping isn't practical.
+ *      [for] is a DEPRECATED alias for this (gh#1764/#1780, ADR-0079): `for=`
+ *      means an id-ref everywhere else in AdiaUI (table-toolbar-ui,
+ *      chart-legend-ui, tooltip-ui) — context-menu-ui's own pre-ruling [for]
+ *      carried a CSS-selector meaning instead, the exact same-attribute-
+ *      different-contract shape ADR-0053's no-shadowing doctrine forbids.
+ *      [target-selector] still resolves via `document.querySelectorAll()`
+ *      (multiple targets); a still-set legacy [for] is honored with a
+ *      one-shot console.warn pointing at the replacement.
  *
  * Architecture: reuses the existing anchor pattern (core/anchor.js) by
  * creating a virtual 1×1 anchor element at the pointer coords on each
@@ -23,8 +31,21 @@ import { anchorPopover } from '../../core/anchor.js';
 
 const LONG_PRESS_DEFAULT = 500;
 
+// DEPRECATED [for]-alias one-shot warning guard (gh#1764/#1780, ADR-0079) —
+// module-scope, matching this file's own idiom (a plain top-level const
+// rather than a lazily-created public static field, which stayed mutable
+// and externally visible for no reason).
+const warnedForDeprecated = new WeakSet();
+
 export class UIContextMenu extends UIElement {
   static properties = {
+    // gh#1764/#1780, ADR-0079 — the ratified replacement for the
+    // selector-flavored [for] below; a plain CSS selector, not an id-ref.
+    targetSelector: { type: String,  default: '',                 reflect: true, attribute: 'target-selector' },
+    // DEPRECATED — kept as a back-compat alias for `targetSelector` only.
+    // Honored (with a one-shot console.warn, see #legacyForSelector())
+    // whenever [target-selector] is unset. Never given id-ref semantics;
+    // the sweep did not attempt to dual-purpose this attribute.
     for:         { type: String,  default: '',                 reflect: true },
     open:        { type: Boolean, default: false,              reflect: true },
     longPressMs: { type: Number,  default: LONG_PRESS_DEFAULT, reflect: false, attribute: 'long-press-ms' },
@@ -97,11 +118,12 @@ export class UIContextMenu extends UIElement {
   }
 
   #resolveTargets() {
-    if (this.for) {
-      try { return [...document.querySelectorAll(this.for)]; }
+    const selector = this.targetSelector || this.#legacyForSelector();
+    if (selector) {
+      try { return [...document.querySelectorAll(selector)]; }
       catch (e) {
         // eslint-disable-next-line no-console
-        console.warn(`[context-menu-ui] invalid [for] selector: ${this.for}`, e);
+        console.warn(`[context-menu-ui] invalid [target-selector] selector: ${selector}`, e);
         return [];
       }
     }
@@ -113,6 +135,25 @@ export class UIContextMenu extends UIElement {
     return [];
   }
 
+  // DEPRECATED alias path (gh#1764/#1780, ADR-0079) — [for] used to carry
+  // context-menu-ui's own CSS-selector binding; [target-selector] is now
+  // the canonical name. Warn once per element, never per resolve (this
+  // runs on every #bindTargets() call, including reconnects).
+  #legacyForSelector() {
+    if (!this.for) return '';
+    if (!warnedForDeprecated.has(this)) {
+      warnedForDeprecated.add(this);
+      // eslint-disable-next-line no-console
+      console.warn(
+        `[context-menu-ui] [for="${this.for}"] is deprecated — use ` +
+        `[target-selector="${this.for}"] instead. [for] now means an ` +
+        'id-ref everywhere else in AdiaUI; context-menu-ui\'s own prior ' +
+        '[for] carried a CSS-selector meaning (ADR-0079).',
+      );
+    }
+    return this.for;
+  }
+
   /* ── Trigger event handlers ──────────────────────────────────────── */
 
   #onContextMenu = (e) => {

package/components/context-menu/context-menu.d.ts

@@ -8,8 +8,9 @@ element-anchored. Pattern: WAI-APG Menu.
 Two binding modes:
  **A. Wrap.** Default-slot child becomes the target:
  `<context-menu-ui><my-table>...</my-table>...items</context-menu-ui>`.
- **B. Selector.** Point at one or more existing elements via [for]:
- `<context-menu-ui for="#my-table">...items</context-menu-ui>`.
+ **B. Selector.** Point at one or more existing elements via
+ [target-selector]:
+ `<context-menu-ui target-selector="#my-table">...items</context-menu-ui>`.
 
 On `contextmenu` event on a target: `preventDefault()`, position the
 menu at the pointer coords, show via Popover API. Touch long-press
@@ -54,12 +55,14 @@ export interface ContextMenuSelectEventDetail {
 export type ContextMenuSelectEvent = CustomEvent<ContextMenuSelectEventDetail>;
 
 export class UIContextMenu extends UIElement {
-  /** CSS selector(s) for target element(s). Empty = use default-slot child. */
+  /** DEPRECATED alias for [target-selector] — still a CSS selector, NOT an id-ref. Honored when [target-selector] is unset, with a one-shot console.warn pointing consumers at the replacement. New authoring should use [target-selector]. */
   for: string;
   /** Long-press duration (ms) on touch devices to open the menu. */
   longPressMs: number;
   /** Programmatic open state. Set true to open at target center. */
   open: boolean;
+  /** CSS selector(s) for target element(s). Empty = use default-slot child. Ratified name (gh#1764/#1780, ADR-0079) for what [for] used to carry — [for] means an id-ref everywhere else in AdiaUI (table-toolbar-ui, chart-legend-ui, tooltip-ui); context-menu-ui's own selector meaning predates that convention and was a same-name/ different-contract collision (ADR-0053's no-shadowing doctrine). */
+  targetSelector: string;
 
   addEventListener(type: 'context-menu-close', listener: (ev: ContextMenuCloseEvent) => unknown, options?: boolean | AddEventListenerOptions): void;
   addEventListener(type: 'context-menu-open', listener: (ev: ContextMenuOpenEvent) => unknown, options?: boolean | AddEventListenerOptions): void;

package/components/context-menu/context-menu.examples.md

@@ -17,7 +17,7 @@
 </context-menu-ui>
 ```
 
-## [for] selector mode — point at existing targets
+## [target-selector] mode — point at existing targets
 
 ```html
 <div style="display: grid; gap: var(--a-space-2);">
@@ -25,7 +25,7 @@
   <div data-row tabindex="0" style="padding: var(--a-space-3); border: 1px solid var(--md-sys-color-neutral-outline); border-radius: var(--a-radius-sm); background: var(--md-sys-color-neutral-background);">Row B — right-click</div>
   <div data-row tabindex="0" style="padding: var(--a-space-3); border: 1px solid var(--md-sys-color-neutral-outline); border-radius: var(--a-radius-sm); background: var(--md-sys-color-neutral-background);">Row C — right-click</div>
 </div>
-<context-menu-ui for='[data-chunk="context-menu-for"] [data-row]'>
+<context-menu-ui target-selector='[data-chunk="context-menu-for"] [data-row]'>
   <menu-item-ui value="edit" text="Edit"></menu-item-ui>
   <menu-item-ui value="duplicate" text="Duplicate"></menu-item-ui>
   <menu-divider-ui></menu-divider-ui>

package/components/context-menu/context-menu.yaml

@@ -15,8 +15,9 @@ description: |
   Two binding modes:
    **A. Wrap.** Default-slot child becomes the target:
    `<context-menu-ui><my-table>...</my-table>...items</context-menu-ui>`.
-   **B. Selector.** Point at one or more existing elements via [for]:
-   `<context-menu-ui for="#my-table">...items</context-menu-ui>`.
+   **B. Selector.** Point at one or more existing elements via
+   [target-selector]:
+   `<context-menu-ui target-selector="#my-table">...items</context-menu-ui>`.
 
   On `contextmenu` event on a target: `preventDefault()`, position the
   menu at the pointer coords, show via Popover API. Touch long-press
@@ -25,8 +26,24 @@ description: |
 composes:
   - menu-item-ui
 props:
+  targetSelector:
+    description: >-
+      CSS selector(s) for target element(s). Empty = use default-slot
+      child. Ratified name (gh#1764/#1780, ADR-0079) for what [for] used
+      to carry — [for] means an id-ref everywhere else in AdiaUI
+      (table-toolbar-ui, chart-legend-ui, tooltip-ui); context-menu-ui's
+      own selector meaning predates that convention and was a same-name/
+      different-contract collision (ADR-0053's no-shadowing doctrine).
+    type: string
+    default: ""
+    reflect: true
+    attribute: target-selector
   for:
-    description: CSS selector(s) for target element(s). Empty = use default-slot child.
+    description: >-
+      DEPRECATED alias for [target-selector] — still a CSS selector, NOT
+      an id-ref. Honored when [target-selector] is unset, with a one-shot
+      console.warn pointing consumers at the replacement. New authoring
+      should use [target-selector].
     type: string
     default: ""
     reflect: true
@@ -101,12 +118,12 @@ a2ui:
       reason: 'Trigger surface boundary.'
     - rule: 'Items are <menu-item-ui> children inside the default slot — same shape as <menu-ui> items.'
       reason: 'Single menu vocabulary.'
-    - rule: 'Bind target via wrap (default-slot first non-menu-item-ui child) OR [for] selector. The selector form is useful for whole-table or whole-canvas menus where wrapping isn''t practical.'
+    - rule: 'Bind target via wrap (default-slot first non-menu-item-ui child) OR [target-selector]. The selector form is useful for whole-table or whole-canvas menus where wrapping isn''t practical. [for] still works as a deprecated alias but new authoring should use [target-selector] (gh#1764/#1780, ADR-0079).'
       reason: 'Two binding shapes.'
 anti_patterns:
   - wrong: '<context-menu-ui>...just items...</context-menu-ui>'
     why: 'No target binding — the menu never opens.'
-    fix: 'Wrap a target: `<context-menu-ui><my-target></my-target>...items</context-menu-ui>` OR point at one: `<context-menu-ui for="#my-target">...items</context-menu-ui>`.'
+    fix: 'Wrap a target: `<context-menu-ui><my-target></my-target>...items</context-menu-ui>` OR point at one: `<context-menu-ui target-selector="#my-target">...items</context-menu-ui>`.'
 examples:
   - name: file-actions
     description: Right-click a file row for Open / Rename / Delete.

package/components/field/field.css

@@ -77,8 +77,30 @@
     row-gap: var(--field-gap);
   }
 
-  /* Stacked + (trailing or action) → 2-col */
-  :scope:has(> :is([slot="trailing"], [slot="action"])) {
+  /* Stacked + trailing only (no action) — the "action" column would
+     otherwise still be sized by row 1's trailing content while row 2's
+     action cell sits empty, stealing width from `control` (gh#1836).
+     `control` spans both columns so it fills the full row instead. */
+  :scope:has(> [slot="trailing"]):not(:has(> [slot="action"])) {
+    grid-template-columns: minmax(0, 1fr) auto;
+    grid-template-areas:
+      "label   trailing"
+      "control control"
+      "message message";
+  }
+  /* Stacked + action only (no trailing) — label spans the full row since
+     there's no trailing content contesting it. */
+  :scope:has(> [slot="action"]):not(:has(> [slot="trailing"])) {
+    grid-template-columns: minmax(0, 1fr) auto;
+    grid-template-areas:
+      "label   label"
+      "control action"
+      "message message";
+  }
+  /* Stacked + both trailing and action — today's combined template,
+     unchanged: row 2's second column is legitimately contested only by
+     `action`, since `trailing` lives in row 1. */
+  :scope:has(> [slot="trailing"]):has(> [slot="action"]) {
     grid-template-columns: minmax(0, 1fr) auto;
     grid-template-areas:
       "label   trailing"

package/components/index.js

@@ -55,6 +55,7 @@ export { UIColorInput } from './color-input/color-input.js';
 export { UINoodles } from './noodles/noodles.js';
 export { UITable } from './table/table.js';
 export { UITableToolbar } from './table-toolbar/table-toolbar.js';
+export { UITableFooter } from './table-footer/table-footer.js';
 export { UITimeline, UITimelineItem } from './timeline/timeline.js';
 export { UIStepper, UIStepperItem } from './stepper/stepper.js';
 export { UISwiper } from './swiper/swiper.js';

package/components/input/input.css

@@ -92,6 +92,13 @@ input-ui:not([disabled]) [slot="field"]:hover [slot="suffix"] {
     min-width: var(--input-label-min-width);
     color: var(--input-affix-fg);
     font-size: var(--input-font-size);
+    /* Match [slot="field"]'s line-height (§113) — without it the label
+       falls back to the UA's normal line-height for its font/size, which
+       differs from --a-font-leading-normal. align-items: center on the
+       field centers each flex item's own line box, so a mismatched
+       line-height shifts the label's glyph baseline off the value/
+       placeholder text's baseline even though both boxes are centered. */
+    line-height: var(--a-font-leading-normal);
     user-select: none;
     pointer-events: none;
   }

package/components/nav/nav.a2ui.json

@@ -27,7 +27,7 @@
       "default": false
     },
     "heading": {
-      "description": "Optional kicker label. Section variant renders it via ::before; primary uses it as aria-label only.",
+      "description": "Optional kicker label. Section variant renders it via ::before; primary uses it as aria-label only. For a VISIBLE kicker inside a primary-variant rail — or more than one kicker per <nav-ui> — hand-place <span data-nav-label> in the default slot instead; see slots below.",
       "type": "string",
       "default": ""
     },
@@ -108,7 +108,7 @@
     ],
     "slots": {
       "default": {
-        "description": "Primary slot — accepts <nav-group-ui> + <nav-item-ui> children, plus <hr data-nav-divider> for hand-placed dividers."
+        "description": "Primary slot — accepts <nav-group-ui> + <nav-item-ui> children, plus <hr data-nav-divider> for hand-placed dividers and <span data-nav-label> for hand-placed group-label kickers (titled runs of items/groups that aren't wrapped in a <nav-group-ui>). <span data-nav-label> renders with the same uppercase/tracking/muted kicker treatment as the [heading] ::before kicker, and is hidden alongside dividers whenever the primary-variant rail collapses ([collapsed] or ≤96px container width)."
       }
     },
     "states": [

package/components/nav/nav.css

@@ -32,7 +32,7 @@
     --nav-label-fg:        var(--a-fg-muted);
     --nav-label-font-size: var(--a-kicker-sm);
     --nav-label-weight:    var(--a-weight-medium);
-    --nav-label-px:        var(--a-space-2);
+    --nav-label-px:        var(--a-space-4);
     --nav-label-py:        var(--a-space-3) var(--a-space-1);
   }
 

package/components/nav/nav.d.ts

@@ -36,7 +36,7 @@ export class UINav extends UIElement {
   collapsed: boolean;
   /** Auto-place dividers between adjacent groups + items. */
   divider: boolean;
-  /** Optional kicker label. Section variant renders it via ::before; primary uses it as aria-label only. */
+  /** Optional kicker label. Section variant renders it via ::before; primary uses it as aria-label only. For a VISIBLE kicker inside a primary-variant rail — or more than one kicker per <nav-ui> — hand-place <span data-nav-label> in the default slot instead; see slots below. */
   heading: string;
   /** Opt out of the default single-expanded-group behavior. When unset, selecting a nav-item-ui collapses every nav-group-ui except the one containing the newly selected item (all, when the selection is ungrouped); manual multi-expansion still works up until the next selection. */
   multiExpand: boolean;