forty-cdk 0.13.0 → 0.15.0

package/README.md

@@ -36,7 +36,7 @@ Optional — install only if you use the matching entry point / primitives:
 
 ## Primitives
 
-Every primitive ships as its own **secondary entry point** — import `ForDialog` from `forty-cdk/dialog`, `ForAccordion` from `forty-cdk/accordion`, and so on — backed by the shared `forty-cdk/core` entry point. Each lives in its own folder under `projects/forty-cdk/` with its own `README.md` documenting its anatomy, API, keyboard interaction and styling hooks. The `@internationalized/date` adapters live in a dedicated `forty-cdk/internationalized-date` entry point so that optional peer stays truly optional. The main `forty-cdk` barrel is **intentionally empty** (it exports no symbols): always import from the specific `forty-cdk/<primitive>` entry point. Standalone directives plus `"sideEffects": false` mean your bundle only ever includes the primitives you import.
+Every primitive ships as its own **secondary entry point** — import `ForDialog` from `forty-cdk/dialog`, `ForAccordion` from `forty-cdk/accordion`, and so on — backed by the shared `forty-cdk/core` entry point. Each lives in its own folder under `projects/forty-cdk/` with its own `README.md` documenting its anatomy, API, keyboard interaction and styling hooks. The `@internationalized/date` adapters live in a dedicated `forty-cdk/internationalized-date` entry point so that optional peer stays truly optional. The cross-primitive contract types a primitive's public API references — `WritingDirection`, `VetoableEvent`, `DateAdapter`, `FloatingSide`, … — are published by [`forty-cdk/shared`](shared); the main `forty-cdk` barrel is **intentionally empty** (it exports no symbols), so always import primitives from the specific `forty-cdk/<primitive>` entry point. Standalone directives plus `"sideEffects": false` mean your bundle only ever includes the primitives you import.
 
 The tables below group the primitives by purpose. The link on each name opens that primitive's README — the canonical reference for which HTML element each directive belongs on, its inputs / outputs, `data-*` attributes and keyboard map.
 

package/button/README.md

@@ -34,6 +34,15 @@ Disabled buttons stay focusable so assistive technology can announce them. The n
 <button forButton [disabled]="isSaving()" (activate)="save()">Save</button>
 ```
 
+A surrounding disabled `[forFieldset]` disables the button too — its `disabled` input is OR'd with the group's, so `aria-disabled` / `data-disabled` are reflected and activation is suppressed. This matters most on a non-native host (`<div forButton>`), which a native `<fieldset disabled>` cannot reach.
+
+```html
+<fieldset forFieldset [disabled]="locked()">
+  <legend forFieldsetLegend>Account</legend>
+  <button forButton (activate)="save()">Save</button>
+</fieldset>
+```
+
 ### Preserve consumer `type`
 
 A native `<button>` without an explicit `type` attribute defaults to `type="button"`. A consumer-set `type="submit"` is preserved:
@@ -46,10 +55,10 @@ A native `<button>` without an explicit `type` attribute defaults to `type="butt
 
 ### `ForButton`
 
-| Property   | Type             | Description                                                                                        |
-| ---------- | ---------------- | -------------------------------------------------------------------------------------------------- |
-| `disabled` | `input<boolean>` | Suppresses activation and reflects `aria-disabled` + `data-disabled`.<br>**Default:** `false`      |
-| `activate` | `output<void>`   | Fires once per user activation (click, Enter, Space). Never fires when disabled.<br>**Default:** — |
+| Property   | Type             | Description                                                                                                                                             |
+| ---------- | ---------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| `disabled` | `input<boolean>` | Suppresses activation and reflects `aria-disabled` + `data-disabled`. OR'd with a surrounding `[forFieldset]`'s disabled state.<br>**Default:** `false` |
+| `activate` | `output<void>`   | Fires once per user activation (click, Enter, Space). Never fires when disabled.<br>**Default:** —                                                      |
 
 The directive reflects boolean `data-*` attributes (present with an empty-string value when true, absent when false). There is no `data-state` — this primitive has no open/closed or checked/unchecked logical state.
 

package/carousel/README.md

@@ -110,6 +110,11 @@ the defaults with `startLabel` / `stopLabel` inputs:
 <button forCarouselRotationControl startLabel="Play slideshow" stopLabel="Pause slideshow"></button>
 ```
 
+Both defaults come from the scope's `rotationStartLabel` / `rotationStopLabel`
+(see [Localizing the default labels](#localizing-the-default-labels)); set either
+input to `null` when the button carries a visible text label and you don't want
+an `aria-label` overriding it.
+
 **Programmatic control** via `exportAs`:
 
 ```html
@@ -189,16 +194,19 @@ captured, so page scrolling on the perpendicular axis is unaffected.
 
 ## Localizing the default labels
 
-Each slide's default `aria-label` is the positional `"N of M"` string, and each
-indicator's is `"Go to slide N"`. Localize both centrally with
-`provideForCarouselDefaults` instead of setting `ariaLabel` on every slide and
-indicator:
+Each slide's default `aria-label` is the positional `"N of M"` string, each
+indicator's is `"Go to slide N"`, and the rotation control's swaps between
+`"Start automatic slide show"` and `"Stop automatic slide show"`. Localize them
+all centrally with `provideForCarouselDefaults` instead of setting `ariaLabel` on
+every slide and indicator:
 
 ```ts
 providers: [
   provideForCarouselDefaults({
     slideLabel: (position, total) => `Diapositiva ${position} de ${total}`,
     indicatorLabel: (position) => `Ir a la diapositiva ${position}`,
+    rotationStartLabel: 'Iniciar la presentación',
+    rotationStopLabel: 'Detener la presentación',
   }),
 ];
 ```
@@ -206,7 +214,8 @@ providers: [
 `position` is the 1-based slide index and `total` is the slide count. Overrides
 merge with the parent scope, so you can localize just the labels and inherit the
 rest of the defaults. A per-element `ariaLabel` on `[forCarouselSlide]` /
-`[forCarouselIndicator]` still takes precedence over the localized default.
+`[forCarouselIndicator]` still takes precedence over the localized default, as do
+`[startLabel]` / `[stopLabel]` on `[forCarouselRotationControl]`.
 
 ## API
 
@@ -229,8 +238,8 @@ All inputs are on `[forCarousel]` unless noted.
 | `ariaLabel` (on `[forCarouselIndicators]`)       | `string \| null`               | Label for the picker group.<br>**Default:** `null`                                                                                                         |
 | `ariaLabel` (on `[forCarouselSlide]`)            | `string \| null`               | Override the positional "N of M" label.<br>**Default:** `null`                                                                                             |
 | `disabled` (on `[forCarouselIndicator]`)         | `boolean`                      | Disable this indicator.<br>**Default:** `false`                                                                                                            |
-| `startLabel` (on `[forCarouselRotationControl]`) | `string`                       | Accessible name while rotation is stopped.<br>**Default:** `'Start automatic slide show'`                                                                  |
-| `stopLabel` (on `[forCarouselRotationControl]`)  | `string`                       | Accessible name while rotation is playing.<br>**Default:** `'Stop automatic slide show'`                                                                   |
+| `startLabel` (on `[forCarouselRotationControl]`) | `string \| null`               | Accessible name while rotation is stopped.<br>**Default:** scope `rotationStartLabel` (`'Start automatic slide show'`)                                     |
+| `stopLabel` (on `[forCarouselRotationControl]`)  | `string \| null`               | Accessible name while rotation is playing.<br>**Default:** scope `rotationStopLabel` (`'Stop automatic slide show'`)                                       |
 
 Reflected on the `[forCarousel]` host:
 
@@ -298,8 +307,10 @@ Implements the [WAI-ARIA Carousel pattern](https://www.w3.org/WAI/ARIA/apg/patte
   accessibility tree and focus order.
 - The indicator group should be labelled (e.g. `ariaLabel="Choose slide to display"`).
 - The current indicator is marked with `aria-current="true"`.
-- Prev/next buttons use native `disabled` so they are removed from the tab order when
-  at the boundary without loop.
+- Prev/next buttons never use the native `disabled` attribute. At a boundary without `loop`
+  they reflect `aria-disabled="true"` + `data-disabled` and ignore activation, so a keyboard
+  user who reaches the last slide keeps focus on the button instead of being dropped to
+  `<body>`. Style the boundary state off `[data-disabled]`, never `:disabled`.
 - The viewport carries `aria-live` and `aria-atomic="false"`. While the carousel is actively
   auto-rotating, `aria-live` is `"off"` so advancing slides do not bombard the screen reader.
   When stopped or paused, it is `"polite"` so manual navigation announces. The per-slide
@@ -365,6 +376,13 @@ children, unless noted otherwise:
 | `data-rotating` | On `[forCarousel]` — actively rotating right now        |
 | `data-autoplay` | On `[forCarousel]` — the `autoplay` input is `true`     |
 
+### Boundary styling hooks
+
+| Attribute       | When present                                              |
+| --------------- | --------------------------------------------------------- |
+| `data-disabled` | On `[forCarouselPrevious]` — at index 0 without `loop`    |
+| `data-disabled` | On `[forCarouselNext]` — at the last index without `loop` |
+
 ### Drag styling hooks
 
 | Attribute       | Host                    | When present                           |

package/combobox/README.md

@@ -129,6 +129,7 @@ Input tables are not yet tabulated for this primitive. See the feature sections
 | `[forComboboxIndicator]` | `data-state`       | `checked` \| `unchecked` (mirrors the parent option)                |
 | `[forComboboxChip]`      | `data-value`       | the chip's serialized value (verbatim string, or `itemToFormValue`) |
 | `[forComboboxChip]`      | `data-disabled`    | present / absent                                                    |
+| `[forComboboxSeparator]` | `data-orientation` | `horizontal` \| `vertical`                                          |
 
 Focus stays on the `<input>` the whole time the listbox is open, so options never get `:focus` — `data-highlighted` is the canonical hook for styling the keyboard-active option.
 
@@ -608,7 +609,7 @@ Implements the [WAI-ARIA Combobox pattern](https://www.w3.org/WAI/ARIA/apg/patte
 - `data-state="checked" | "unchecked"` always reflects membership in `value()`, so consumers can paint a checkmark icon with pure CSS regardless of mode.
 - `data-highlighted=""` marks the option that is the current `aria-activedescendant`. Because focus stays on the `<input>`, there is no `:focus` on the option to style — `data-highlighted` is the canonical CSS hook.
 - Disabled options keep the host `aria-disabled="true"`. Click and hover (activedescendant pinning) are no-ops on disabled options.
-- `[forComboboxSeparator]` is decorative and never registers with the listbox's option collection — keyboard navigation skips it automatically.
+- `[forComboboxSeparator]` never registers with the listbox's option collection — keyboard navigation skips it automatically. It carries `role="separator"` and emits `aria-orientation` only for `orientation="vertical"`, because `horizontal` is the ARIA default; `data-orientation` is always stamped for styling. Set `decorative` when the surrounding options already convey the split — it switches the line to `role="none"` and drops `aria-orientation`, matching the [shared separator emission policy](../separator/README.md#accessibility).
 - `[forComboboxGroup]` is purely advisory grouping — options inside still register flatly with the root, so navigation flows through groups without interruption.
 - `[forComboboxEmpty]` carries `role="status"` + `aria-live="polite"` so the empty-state message is announced when filtering removes all matches.
 - Non-option pieces (`[forComboboxAction]`, and ideally `[forComboboxEmpty]` / `[forComboboxStatus]`) belong inside `[forComboboxContent]` but **outside** `[forComboboxList]` — `role="listbox"` may only own `option` / `group` children (`aria-required-owned-elements`). Wrapping the options in a `[forComboboxList]` (the "editable + list" shape) makes those pieces siblings of the listbox. `[forComboboxAction]` **requires** a `[forComboboxList]` and throws `[forty-cdk/combobox]` without one; `[forComboboxEmpty]` / `[forComboboxStatus]` stay lenient in the bare editable anatomy (documented compromise) — see the [editable-anatomy caveat](#anatomy).

package/context-menu/README.md

@@ -99,26 +99,26 @@ Angular resolves `ng-template` DI at the template's **declaration** site, not wh
 
 ### `ForContextMenu`
 
-| Property                    | Type                                                      | Description                                                                                                                                                                                            |
-| --------------------------- | --------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
-| `open`                      | `model<boolean>`                                          | Two-way bindable. Whether the menu is shown.<br>**Default:** `false`                                                                                                                                   |
-| `side`                      | `input<string>`                                           | Anchor side relative to the pointer.<br>**Default:** `'bottom'`                                                                                                                                        |
-| `align`                     | `input<string>`                                           | Alignment along `side` (`'start'` / `'center'` / `'end'`).<br>**Default:** `'start'`                                                                                                                   |
-| `sideOffset`                | `input<number>`                                           | Gap (px) between the pointer and the menu along the main axis.<br>**Default:** `0`                                                                                                                     |
-| `alignOffset`               | `input<number>`                                           | Gap (px) along the cross axis (parallel to `side`).<br>**Default:** `0`                                                                                                                                |
-| `fallbackAxisSideDirection` | `input<'none' \| 'start' \| 'end'>`                       | When both sides of the preferred axis overflow, lets `flip` drop the menu to a perpendicular side instead of clipping. `'none'` keeps only the opposite same-axis placement.<br>**Default:** `'none'`  |
-| `loop`                      | `input<boolean>`                                          | Whether arrow navigation wraps.<br>**Default:** `true`                                                                                                                                                 |
-| `dir`                       | `input<string>`                                           | Writing direction. In RTL, ArrowLeft opens submenus and ArrowRight closes them — the swap is automatic. Inherited by every nested `[forMenuSub]` underneath unless overridden.<br>**Default:** `'ltr'` |
-| `disabled`                  | `input<boolean>`                                          | When `true`, the contextmenu event falls through to the native browser menu.<br>**Default:** `false`                                                                                                   |
-| `dismissible`               | `input<boolean>`                                          | When `false`, Escape and outside interactions don't close.<br>**Default:** `true`                                                                                                                      |
-| `returnFocus`               | `input<boolean>`                                          | When `true`, focus returns to the trigger element on close.<br>**Default:** `true`                                                                                                                     |
-| `ariaLabel`                 | `input<string \| null>`                                   | Manual `aria-label` on `[forMenuContent]`.<br>**Default:** `null`                                                                                                                                      |
-| `escapeKeyDown`             | `output<VetoableNativeEvent<KeyboardEvent>>`              | Output. Escape pressed while the menu is the topmost dismissable layer.<br>**Default:** —                                                                                                              |
-| `pointerDownOutside`        | `output<VetoableNativeEvent<PointerEvent>>`               | Output. Pointer-down on a target outside content + trigger.<br>**Default:** —                                                                                                                          |
-| `focusOutside`              | `output<VetoableNativeEvent<FocusEvent>>`                 | Output. Focus moves outside content + trigger.<br>**Default:** —                                                                                                                                       |
-| `interactOutside`           | `output<VetoableNativeEvent<PointerEvent \| FocusEvent>>` | Output. Composite — fires alongside the two above (and shares their veto state).<br>**Default:** —                                                                                                     |
-| `autoFocusOnOpen`           | `output<VetoableEvent>`                                   | Output. Just before the imperative focus move on mount.<br>**Default:** —                                                                                                                              |
-| `autoFocusOnClose`          | `output<VetoableEvent>`                                   | Output. Just before the imperative focus move on unmount.<br>**Default:** —                                                                                                                            |
+| Property                    | Type                                                      | Description                                                                                                                                                                                                 |
+| --------------------------- | --------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| `open`                      | `model<boolean>`                                          | Two-way bindable. Whether the menu is shown.<br>**Default:** `false`                                                                                                                                        |
+| `side`                      | `input<string>`                                           | Anchor side relative to the pointer.<br>**Default:** `'bottom'`                                                                                                                                             |
+| `align`                     | `input<string>`                                           | Alignment along `side` (`'start'` / `'center'` / `'end'`).<br>**Default:** `'start'`                                                                                                                        |
+| `sideOffset`                | `input<number>`                                           | Gap (px) between the pointer and the menu along the main axis.<br>**Default:** `0`                                                                                                                          |
+| `alignOffset`               | `input<number>`                                           | Gap (px) along the cross axis (parallel to `side`).<br>**Default:** `0`                                                                                                                                     |
+| `fallbackAxisSideDirection` | `input<'none' \| 'start' \| 'end'>`                       | When both sides of the preferred axis overflow, lets `flip` drop the menu to a perpendicular side instead of clipping. `'none'` keeps only the opposite same-axis placement.<br>**Default:** `'none'`       |
+| `loop`                      | `input<boolean>`                                          | Whether arrow navigation wraps.<br>**Default:** `true`                                                                                                                                                      |
+| `dir`                       | `input<string>`                                           | Writing direction. In RTL, ArrowLeft opens submenus and ArrowRight closes them — the swap is automatic. Inherited by every nested `[forMenuSub]` underneath unless overridden.<br>**Default:** `'ltr'`      |
+| `disabled`                  | `input<boolean>`                                          | When `true`, the contextmenu event falls through to the native browser menu.<br>**Default:** `false`                                                                                                        |
+| `dismissible`               | `input<boolean>`                                          | When `false`, Escape and outside interactions don't close.<br>**Default:** `true`                                                                                                                           |
+| `returnFocus`               | `input<boolean>`                                          | When `true`, focus returns to the trigger element on close.<br>**Default:** `true`                                                                                                                          |
+| `ariaLabel`                 | `input<string \| null>`                                   | Accessible name reflected as `aria-label` on `[forMenuContent]`. The root's only name hook for a context menu — the right-click region is never used as an `aria-labelledby` target.<br>**Default:** `null` |
+| `escapeKeyDown`             | `output<VetoableNativeEvent<KeyboardEvent>>`              | Output. Escape pressed while the menu is the topmost dismissable layer.<br>**Default:** —                                                                                                                   |
+| `pointerDownOutside`        | `output<VetoableNativeEvent<PointerEvent>>`               | Output. Pointer-down on a target outside content + trigger.<br>**Default:** —                                                                                                                               |
+| `focusOutside`              | `output<VetoableNativeEvent<FocusEvent>>`                 | Output. Focus moves outside content + trigger.<br>**Default:** —                                                                                                                                            |
+| `interactOutside`           | `output<VetoableNativeEvent<PointerEvent \| FocusEvent>>` | Output. Composite — fires alongside the two above (and shares their veto state).<br>**Default:** —                                                                                                          |
+| `autoFocusOnOpen`           | `output<VetoableEvent>`                                   | Output. Just before the imperative focus move on mount.<br>**Default:** —                                                                                                                                   |
+| `autoFocusOnClose`          | `output<VetoableEvent>`                                   | Output. Just before the imperative focus move on unmount.<br>**Default:** —                                                                                                                                 |
 
 Same vetoable dismiss API as DropdownMenu. Call `preventDefault()` on the emitted veto to suppress the directive's default action; the original DOM event, when present, is on `.event`.
 
@@ -137,6 +137,8 @@ Same vetoable dismiss API as DropdownMenu. Call `preventDefault()` on the emitte
 
 `[forContextMenu]` implements the [WAI-ARIA Menu pattern](https://www.w3.org/WAI/ARIA/apg/patterns/menubar/). The trigger captures `contextmenu`, `Shift+F10`, and the `ContextMenu` key; the menu surface and item roles come from the shared [`menu/`](../menu/README.md) primitives. Pointer activations anchor at the cursor; keyboard activations anchor at the bounding rect of the focused element so keyboard-only users get the menu next to whatever they're working on.
 
+- **Name the menu with `[ariaLabel]`.** Unlike `[forDropdownMenu]` / `[forMenubar]` / `[forMenuSub]`, the content surface emits **no** `aria-labelledby` fallback here: the trigger is the whole right-click region, so pointing the menu's name at it would make screen readers announce the entire row / card text as the menu name. With no `[ariaLabel]` the `role="menu"` surface simply has no accessible name. A consumer-set static `aria-labelledby` on `[forMenuContent]` is still preserved, so pointing at your own visible heading also works. Submenus nested inside a context menu are unaffected — a `[forMenuSubContent]` is still labelled by its `[forMenuSubTrigger]`.
+
 ## Styling
 
 forty-cdk ships no styles. Add your own class to each piece — the for\* selectors are the behavior API, not a styling contract (see [Styling forty-cdk](../../../../../docs/styling.md)). Key your CSS off the reflected data-\* attributes listed under [Data attributes](#data-attributes).

package/date-field/README.md

@@ -118,17 +118,17 @@ export class DobFormField {
 
 ### `ForDateField`
 
-| Property      | Type                                                  | Description                                                                                                                                |
-| ------------- | ----------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------ |
-| `value`       | `model<D \| null>`                                    | Two-way bindable entered date, or `null` while any segment is empty. The `FormValueControl` backing.<br>**Default:** `null`                |
-| `minDate`     | `input<D \| null>`                                    | Minimum date (inclusive). A composed value below it is clamped up. Named `minDate` — see note below.<br>**Default:** `null`                |
-| `maxDate`     | `input<D \| null>`                                    | Maximum date (inclusive). A composed value above it is clamped down.<br>**Default:** `null`                                                |
-| `granularity` | `input<'day' \| 'hour' \| 'minute' \| 'second'>`      | Date-time precision. `'day'` is date-only; coarser-than-day appends time segments. See below.<br>**Default:** `'day'`                      |
-| `hourCycle`   | `input<12 \| 24 \| null>`                             | 12/24-hour cycle for the time segments. `null` → locale. 12-hour adds the AM/PM segment.<br>**Default:** `null`                            |
-| `locale`      | `input<string \| null>`                               | BCP 47 locale driving segment order, separators, and month name. `null` → runtime locale.<br>**Default:** `null`                           |
-| `placeholder` | `input<Partial<Record<DateTimeSegmentType, string>>>` | Per-segment placeholder while empty. Unspecified parts fall back to `dd` / `mm` / `yyyy` / `hh` / `mm` / `ss` / `--`.<br>**Default:** `{}` |
-| `ariaLabel`   | `input<string \| null>`                               | Accessible name for the group. Emits no `aria-label` while `null`.<br>**Default:** `null`                                                  |
-| `dir`         | `input<'ltr' \| 'rtl' \| null>`                       | Writing direction. `null` resolves the ambient direction; mirrors ArrowLeft / ArrowRight segment navigation.<br>**Default:** `null`        |
+| Property      | Type                                             | Description                                                                                                                                |
+| ------------- | ------------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------ |
+| `value`       | `model<D \| null>`                               | Two-way bindable entered date, or `null` while any segment is empty. The `FormValueControl` backing.<br>**Default:** `null`                |
+| `minDate`     | `input<D \| null>`                               | Minimum date (inclusive). A composed value below it is clamped up. Named `minDate` — see note below.<br>**Default:** `null`                |
+| `maxDate`     | `input<D \| null>`                               | Maximum date (inclusive). A composed value above it is clamped down.<br>**Default:** `null`                                                |
+| `granularity` | `input<'day' \| 'hour' \| 'minute' \| 'second'>` | Date-time precision. `'day'` is date-only; coarser-than-day appends time segments. See below.<br>**Default:** `'day'`                      |
+| `hourCycle`   | `input<12 \| 24 \| null>`                        | 12/24-hour cycle for the time segments. `null` → locale. 12-hour adds the AM/PM segment.<br>**Default:** `null`                            |
+| `locale`      | `input<string \| null>`                          | BCP 47 locale driving segment order, separators, and month name. `null` → runtime locale.<br>**Default:** `null`                           |
+| `placeholder` | `input<Partial<Record<SegmentType, string>>>`    | Per-segment placeholder while empty. Unspecified parts fall back to `dd` / `mm` / `yyyy` / `hh` / `mm` / `ss` / `--`.<br>**Default:** `{}` |
+| `ariaLabel`   | `input<string \| null>`                          | Accessible name for the group. Emits no `aria-label` while `null`.<br>**Default:** `null`                                                  |
+| `dir`         | `input<'ltr' \| 'rtl' \| null>`                  | Writing direction. `null` resolves the ambient direction; mirrors ArrowLeft / ArrowRight segment navigation.<br>**Default:** `null`        |
 
 Plus the shared `FormUiControl` members from `@angular/forms/signals`: `disabled`, `readonly`, `required`, `invalid`, `name`, `errors`, `touched` (bound automatically by `[formField]`).
 
@@ -212,6 +212,7 @@ Composes the [WAI-ARIA Spinbutton pattern](https://www.w3.org/WAI/ARIA/apg/patte
 - **Roving tabindex**: exactly one segment is tabbable, so `Tab` enters and leaves the whole field in one stop; arrows move between segments.
 - **Literals are `aria-hidden`** and never focusable — assistive tech reads only the spinbutton segments.
 - **Boolean `data-*`** on each segment — `data-highlighted` (focused/roving), `data-placeholder` (empty), `data-disabled`, `data-readonly` — present when true, absent when false.
+- **`aria-readonly` belongs on the segments, not the group.** WAI-ARIA supports it on `role="spinbutton"` but not on `role="group"`, so each segment carries `aria-readonly="true"` while the group reflects the `data-readonly` styling hook only.
 
 ## Styling
 

package/date-range-field/README.md

@@ -158,17 +158,17 @@ export class StayFormField {
 
 ### `ForDateRangeField`
 
-| Property      | Type                                                  | Description                                                                                                                                       |
-| ------------- | ----------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------- |
-| `value`       | `model<DateRange<D> \| null>`                         | Two-way bindable committed range, or `null` while incomplete or out of order. The `FormValueControl` backing.<br>**Default:** `null`              |
-| `minDate`     | `input<D \| null>`                                    | Minimum date (inclusive) for both endpoints. A composed endpoint below it is clamped up. Named `minDate` — see note below.<br>**Default:** `null` |
-| `maxDate`     | `input<D \| null>`                                    | Maximum date (inclusive) for both endpoints. A composed endpoint above it is clamped down.<br>**Default:** `null`                                 |
-| `granularity` | `input<'day' \| 'hour' \| 'minute' \| 'second'>`      | Date-time precision shared by both endpoints. `'day'` is date-only; coarser-than-day appends time segments.<br>**Default:** `'day'`               |
-| `hourCycle`   | `input<12 \| 24 \| null>`                             | 12/24-hour cycle for the time segments. `null` → locale. 12-hour adds the AM/PM segment.<br>**Default:** `null`                                   |
-| `locale`      | `input<string \| null>`                               | BCP 47 locale driving segment order, separators, and month name. `null` → runtime locale.<br>**Default:** `null`                                  |
-| `placeholder` | `input<Partial<Record<DateTimeSegmentType, string>>>` | Per-segment placeholder while empty, applied to both endpoints.<br>**Default:** `{}`                                                              |
-| `ariaLabel`   | `input<string \| null>`                               | Accessible name for the whole range field group. Emits no `aria-label` while `null`.<br>**Default:** `null`                                       |
-| `dir`         | `input<'ltr' \| 'rtl' \| null>`                       | Writing direction. `null` resolves the ambient direction; mirrors ArrowLeft / ArrowRight segment navigation.<br>**Default:** `null`               |
+| Property      | Type                                             | Description                                                                                                                                       |
+| ------------- | ------------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------- |
+| `value`       | `model<DateRange<D> \| null>`                    | Two-way bindable committed range, or `null` while incomplete or out of order. The `FormValueControl` backing.<br>**Default:** `null`              |
+| `minDate`     | `input<D \| null>`                               | Minimum date (inclusive) for both endpoints. A composed endpoint below it is clamped up. Named `minDate` — see note below.<br>**Default:** `null` |
+| `maxDate`     | `input<D \| null>`                               | Maximum date (inclusive) for both endpoints. A composed endpoint above it is clamped down.<br>**Default:** `null`                                 |
+| `granularity` | `input<'day' \| 'hour' \| 'minute' \| 'second'>` | Date-time precision shared by both endpoints. `'day'` is date-only; coarser-than-day appends time segments.<br>**Default:** `'day'`               |
+| `hourCycle`   | `input<12 \| 24 \| null>`                        | 12/24-hour cycle for the time segments. `null` → locale. 12-hour adds the AM/PM segment.<br>**Default:** `null`                                   |
+| `locale`      | `input<string \| null>`                          | BCP 47 locale driving segment order, separators, and month name. `null` → runtime locale.<br>**Default:** `null`                                  |
+| `placeholder` | `input<Partial<Record<SegmentType, string>>>`    | Per-segment placeholder while empty, applied to both endpoints.<br>**Default:** `{}`                                                              |
+| `ariaLabel`   | `input<string \| null>`                          | Accessible name for the whole range field group. Emits no `aria-label` while `null`.<br>**Default:** `null`                                       |
+| `dir`         | `input<'ltr' \| 'rtl' \| null>`                  | Writing direction. `null` resolves the ambient direction; mirrors ArrowLeft / ArrowRight segment navigation.<br>**Default:** `null`               |
 
 The endpoint groups (`[forDateRangeFieldStart]` / `[forDateRangeFieldEnd]`) each accept an `ariaLabel` input for their own group label, falling back to the scope defaults (`'Start date'` / `'End date'`).
 
@@ -242,6 +242,7 @@ Each segment implements the [WAI-ARIA Spinbutton pattern](https://www.w3.org/WAI
 - **Roving tabindex per endpoint**: exactly one segment per endpoint is tabbable, so `Tab` steps start group → end group; arrows move between segments within an endpoint.
 - **`aria-invalid="true"`** is reflected on the root when the form marks it invalid **or** when two complete endpoints are out of order.
 - **Literals are `aria-hidden`** and never focusable — assistive tech reads only the spinbutton segments.
+- **`aria-readonly` belongs on the segments, not the groups.** WAI-ARIA supports it on `role="spinbutton"` but not on `role="group"`, so each segment carries `aria-readonly="true"` while the root and both endpoint groups reflect the `data-readonly` styling hook only.
 
 ## Styling
 

package/drag-drop/README.md

@@ -7,15 +7,15 @@ whole dialog around by its header — see [`[forFreeDrag]`](#free-drag).
 
 ## Keyboard
 
-| State  | Key         | Action                                            |
-| ------ | ----------- | ------------------------------------------------- |
-| Idle   | Arrow keys  | Move roving focus between items                   |
-| Idle   | Home / End  | Jump to first / last item                         |
-| Idle   | Space/Enter | **Lift** the focused item                         |
-| Lifted | Arrow keys  | Step the logical drop position                    |
-| Lifted | Home / End  | Jump the lifted item to the first / last position |
-| Lifted | Space/Enter | **Drop** (commits and emits `(dragDrop)`)         |
-| Lifted | Escape      | **Cancel** (no event, focus stays on item)        |
+| State  | Key         | Action                                                         |
+| ------ | ----------- | -------------------------------------------------------------- |
+| Idle   | Arrow keys  | Move roving focus between items                                |
+| Idle   | Home / End  | Jump to first / last item                                      |
+| Idle   | Space/Enter | **Lift** the focused item                                      |
+| Lifted | Arrow keys  | Step the logical drop position                                 |
+| Lifted | Home / End  | Jump the lifted item to the first / last position              |
+| Lifted | Space/Enter | **Drop** (commits, emits `(dragDrop)`, focus follows the item) |
+| Lifted | Escape      | **Cancel** (no event, focus stays on item)                     |
 
 Arrow direction follows the list's `orientation` and respects RTL via `dir`. In
 `orientation="mixed"` every arrow key steps the lifted item linearly in DOM order.
@@ -24,6 +24,21 @@ Arrow direction follows the list's `orientation` and respects RTL via `dir`. In
 
 Keyboard lifting, stepping, dropping, and cancellation are announced via ARIA live regions. Override the default messages at any injector scope via `provideForDragDropDefaults` (see Announcement customisation below). Free-drag is pointer-only — there is no WAI-ARIA pattern for "reposition an element", so `[forFreeDrag]` owns no role or ARIA state; the consumer is responsible for keeping the moved element fully usable at its default position.
 
+### Focus after a keyboard drop
+
+Applying the move in `(dragDrop)` destroys or re-inserts the lifted element, which would otherwise
+leave focus on `<body>`. So after a **keyboard** drop whose lifted item held focus, `[forDropList]`
+restores focus to the item at `currentIndex` in the target container on the next render — the same
+element the user just placed, whether it stayed in this list or transferred to a connected one.
+
+Two escape hatches:
+
+- **Focus something yourself** inside the `(dragDrop)` handler (a status region, a toolbar, the next
+  row). The restore only fires when focus has already fallen to `<body>`, so whatever you focus wins.
+- **Pointer drops are untouched** — focus is never moved after a mouse / touch / pen drop.
+
+If your handler leaves the data unchanged, nothing is detached and focus simply stays on the item.
+
 ## Pointer dragging
 
 When a pointer drag starts, the dragged item stays in place and reflects
@@ -119,7 +134,8 @@ stays in the dragged item's source slot.
 ```
 
 `[liveSort]` has no visible effect without a `[forDragPlaceholder]` template, and has no effect
-on keyboard dragging.
+on keyboard dragging. The drop index is resolved from the geometry measured at lift, so
+`[liveSort]` never changes which index a pointer path commits — it only moves the placeholder.
 
 ### Boundary & axis lock
 
@@ -198,6 +214,10 @@ preview is destroyed promptly.
   happens to render as a single row or single column resolves identically to `"horizontal"` /
   `"vertical"`.
 
+In a cross-list transfer each container resolves the drop index on **its own** `orientation` and
+`dir`, so a vertical list can be connected to a horizontal one (or to one in the opposite writing
+direction) and the pointer index lands on the target's axis.
+
 ```html
 <ul class="grid" forDropList orientation="mixed" (dragDrop)="onDrop($event)">
   @for (item of items(); track item.id) {
@@ -413,3 +433,7 @@ providers: [
   }),
 ];
 ```
+
+`total` is the number of valid drop positions in the list being announced: the item count for a
+same-list reorder, and one more than the item count for a transfer into a connected list (the
+append gap counts).

package/dropdown-menu/README.md

@@ -155,11 +155,13 @@ The menu items, content surface, radio groups, separators, and groups live in th
 
 ## Keyboard
 
-| Key                         | Behavior                                                          |
-| --------------------------- | ----------------------------------------------------------------- |
-| `Click` / `Enter` / `Space` | Toggles the menu. On open, focus moves to the first enabled item. |
-| `ArrowDown`                 | Opens the menu and focuses the first enabled item.                |
-| `ArrowUp`                   | Opens the menu and focuses the last enabled item.                 |
+| Key                             | Behavior                                                                                       |
+| ------------------------------- | ---------------------------------------------------------------------------------------------- |
+| `Click`                         | Toggles the menu. On open, focus moves to the first enabled item.                              |
+| `Enter` / `Space` / `ArrowDown` | Opens the menu and focuses the first enabled item; on an already-open menu, moves focus there. |
+| `ArrowUp`                       | Opens the menu and focuses the last enabled item; on an already-open menu, moves focus there.  |
+
+The open keys never close the menu — the APG menu-button pattern gives them no close semantics (that's `Escape`, or a pointer click on the trigger). Pressing one while the menu is already open moves focus into it, which is what makes them useful after an `(autoFocusOnOpen)`-vetoed open left focus on the trigger. A menu with no enabled item moves nothing.
 
 Once focus is in the menu, see [`menu/README.md`](../menu/README.md) for the in-menu keyboard.
 
@@ -167,6 +169,8 @@ Once focus is in the menu, see [`menu/README.md`](../menu/README.md) for the in-
 
 `[forDropdownMenu]` implements the [WAI-ARIA Menu Button pattern](https://www.w3.org/WAI/ARIA/apg/patterns/menu-button/). The trigger wires `aria-haspopup="menu"`, `aria-expanded`, and `aria-controls`; the menu surface and item roles come from the shared [`menu/`](../menu/README.md) primitives.
 
+A disabled trigger (its own `[disabled]`, or the root's) reflects through a **single channel**: the native `disabled` attribute plus the `data-disabled` styling hook. No `aria-disabled` is emitted — the trigger is a real single-purpose `<button>` and the native attribute already conveys the state to assistive technology, per the sanctioned native-`disabled` case in [rule #561](https://github.com/tutkli/forty-cdk/issues/561) (D2). Style the disabled trigger off `[disabled]` or `[data-disabled]`, never `[aria-disabled]`.
+
 ## Styling
 
 forty-cdk ships no styles. Add your own class to each piece — the `for*` selectors are the behavior API, not a styling contract (see [Styling forty-cdk](../../../../../docs/styling.md)). Key your CSS off the reflected `data-*` attributes listed under [Data attributes](#data-attributes).
@@ -186,5 +190,5 @@ forty-cdk ships no styles. Add your own class to each piece — the `for*` selec
 
 - **Mount equals open.** The directive does not toggle `[hidden]` — `@if (open())` controls presence so `animate.enter` / `animate.leave` fire on the natural mount cycle.
 - **Trigger is exempt** from outside-pointer / outside-focus checks. Without this, clicking the trigger to close would race with its own toggle handler and reopen immediately.
-- **Initial focus depends on the opening key.** Click / Space / Enter / ArrowDown focus the first enabled item; ArrowUp focuses the last enabled item.
+- **Initial focus depends on the opening key.** Click / Space / Enter / ArrowDown focus the first enabled item; ArrowUp focuses the last enabled item. The same keys re-focus that item when the menu is already open.
 - **Selecting an item closes the menu** by default. To keep the menu open after activation (multi-select pattern), call `$event.preventDefault()` in the item's `(activate)` handler.

package/fesm2022/forty-cdk-accordion.mjs

@@ -1,6 +1,6 @@
 import * as i0 from '@angular/core';
 import { InjectionToken, inject, input, booleanAttribute, model, Directive, computed, signal, ElementRef } from '@angular/core';
-import { Collection, injectTextDirection, moveIndex, IdGenerator, adoptHostId, registerHandle, reflectDisabled, resolveListNavigation } from 'forty-cdk/core';
+import { Collection, injectTextDirection, moveIndex, IdGenerator, adoptHostId, registerHandle, reflectDisabled, resolveListNavigation, hostLabelledBy } from 'forty-cdk/core';
 
 const FOR_ACCORDION_CONTEXT = new InjectionToken('FOR_ACCORDION_CONTEXT');
 const FOR_ACCORDION_ITEM_CONTEXT = new InjectionToken('FOR_ACCORDION_ITEM_CONTEXT');
@@ -324,11 +324,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
 class ForAccordionContent {
     parent = injectAccordionContext('ForAccordionContent');
     item = injectAccordionItemContext('ForAccordionContent');
+    labelledBy = hostLabelledBy(() => this.item.triggerId());
     constructor() {
         this.item.adoptContentId(inject(ElementRef).nativeElement);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: ForAccordionContent, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.2", type: ForAccordionContent, isStandalone: true, selector: "[forAccordionContent]", host: { properties: { "id": "item.contentId()", "attr.role": "\"region\"", "attr.aria-labelledby": "item.triggerId()", "attr.aria-hidden": "item.expanded() ? null : \"true\"", "attr.inert": "item.expanded() ? null : \"\"", "attr.data-state": "item.expanded() ? \"open\" : \"closed\"", "attr.data-disabled": "item.disabled() ? \"\" : null", "attr.data-orientation": "parent.orientation()" } }, exportAs: ["forAccordionContent"], ngImport: i0 });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.2", type: ForAccordionContent, isStandalone: true, selector: "[forAccordionContent]", host: { properties: { "id": "item.contentId()", "attr.role": "\"region\"", "attr.aria-labelledby": "labelledBy()", "attr.aria-hidden": "item.expanded() ? null : \"true\"", "attr.inert": "item.expanded() ? null : \"\"", "attr.data-state": "item.expanded() ? \"open\" : \"closed\"", "attr.data-disabled": "item.disabled() ? \"\" : null", "attr.data-orientation": "parent.orientation()" } }, exportAs: ["forAccordionContent"], ngImport: i0 });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: ForAccordionContent, decorators: [{
             type: Directive,
@@ -338,7 +339,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
                     host: {
                         '[id]': 'item.contentId()',
                         '[attr.role]': '"region"',
-                        '[attr.aria-labelledby]': 'item.triggerId()',
+                        '[attr.aria-labelledby]': 'labelledBy()',
                         '[attr.aria-hidden]': 'item.expanded() ? null : "true"',
                         '[attr.inert]': 'item.expanded() ? null : ""',
                         '[attr.data-state]': 'item.expanded() ? "open" : "closed"',