forty-cdk 0.10.0 → 0.11.1

package/fesm2022/forty-cdk-combobox.mjs

@@ -1105,9 +1105,10 @@ class ForCombobox extends FormUiControlBase {
      * Re-applies the scroll unconditionally — the bridge already recorded this id
      * as positioned, but the portal move invalidated the real scroll position, so
      * the usual "already positioned" guard must not short-circuit here. Fires once
-     * per open (the positioner hook is one-shot per run), so a later hover never
-     * scrolls. No-op while virtualizing: the navigator owns the virtualized scroll
-     * and the indexed seed is intentionally passive.
+     * per open (the positioner hook is per-open, not per-run, so a side flip while
+     * open never re-fires it and yanks the user's scroll back), so a later hover
+     * never scrolls. No-op while virtualizing: the navigator owns the virtualized
+     * scroll and the indexed seed is intentionally passive.
      */
     scrollActiveOptionIntoView() {
         if (this.totalCount() !== undefined) {
@@ -1658,6 +1659,7 @@ class ForComboboxInput {
                 // and shouldn't bubble through nested layers before it sees it.
                 if (this.ctx.open()) {
                     event.preventDefault();
+                    event.stopPropagation();
                     this.ctx.emitEscapeKeyDown(event);
                 }
                 break;
@@ -1750,13 +1752,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
  * trigger are exempt from outside checks.
  *
  * Focus:
- * - **Editable anatomy** — focus stays in the input across the whole open
- *   lifecycle; the directive never moves DOM focus and exposes no focus hooks.
- *   Active-option highlighting is `aria-activedescendant`-driven.
+ * - **Editable anatomy** — focus normally stays in the input across the whole
+ *   open lifecycle and active-option highlighting is `aria-activedescendant`-
+ *   driven, so the directive exposes no focus hooks. The surface itself is
+ *   focusable (`tabindex="-1"`), so a click on non-option padding can move focus
+ *   onto it; the input's inline Escape handler then never sees the key, so the
+ *   shell wires a fallback Escape channel that closes the popup and returns focus
+ *   to the input.
  * - **Picker anatomy** — on open, focus moves into the input (the search field
  *   inside the panel); on close it returns to the trigger. Both moves are
  *   vetoable via `(autoFocusOnOpen)` / `(autoFocusOnClose)` on `[forCombobox]`,
- *   and the return is gated by `[returnFocus]`. Escape stays owned by the input.
+ *   and the return is gated by `[returnFocus]`. Escape from the input is owned by
+ *   the input directive; the shell's fallback channel covers presses that land on
+ *   the surface or list instead.
  *
  * The lifecycle (positioner + dismissable layer, plus the picker anatomy's
  * focus bundles) is owned by the shared `injectOverlayShell` helper.
@@ -1795,9 +1803,12 @@ class ForComboboxContent {
             dismiss: {
                 dismissible: ctx.dismissible,
                 requestClose: (reason) => ctx.requestClose(reason),
-                // Escape is handled by the input directive (focus stays in the
-                // input, so Escape there shouldn't bubble through nested layers
-                // before the input sees it). Omitted here intentionally.
+                emitEscapeKeyDown: (event) => {
+                    ctx.emitEscapeKeyDown(event);
+                    if (!hasTrigger && !ctx.open()) {
+                        ctx.input()?.focus();
+                    }
+                },
                 emitPointerDownOutside: (veto) => ctx.emitPointerDownOutside(veto),
                 emitFocusOutside: (veto) => ctx.emitFocusOutside(veto),
                 emitInteractOutside: (veto) => ctx.emitInteractOutside(veto),
@@ -1813,6 +1824,8 @@ class ForComboboxContent {
                     const trigger = ctx.trigger();
                     if (trigger)
                         els.push(trigger);
+                    for (const chip of ctx.chips())
+                        els.push(chip.host);
                     return els;
                 },
             },
@@ -2262,6 +2275,7 @@ class ForComboboxAction {
                 break;
             case 'Escape':
                 event.preventDefault();
+                event.stopPropagation();
                 this.#ctx.emitEscapeKeyDown(event);
                 if (!this.#ctx.open() && this.#ctx.trigger() === null) {
                     this.#ctx.input()?.focus();