stimeo-ui 0.1.0-beta.3 → 0.2.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (174) hide show
  1. package/CHANGELOG.md +149 -0
  2. package/README.md +6 -6
  3. package/dist/controllers/accordion_controller.d.ts +3 -2
  4. package/dist/controllers/accordion_controller.js.map +1 -1
  5. package/dist/controllers/alert_dialog_controller.d.ts +64 -0
  6. package/dist/controllers/alert_dialog_controller.js +318 -0
  7. package/dist/controllers/alert_dialog_controller.js.map +1 -0
  8. package/dist/controllers/auto_submit_controller.js +56 -21
  9. package/dist/controllers/auto_submit_controller.js.map +1 -1
  10. package/dist/controllers/carousel_controller.d.ts +100 -0
  11. package/dist/controllers/carousel_controller.js +272 -0
  12. package/dist/controllers/carousel_controller.js.map +1 -0
  13. package/dist/controllers/character_counter_controller.js +52 -15
  14. package/dist/controllers/character_counter_controller.js.map +1 -1
  15. package/dist/controllers/clipboard_controller.d.ts +72 -0
  16. package/dist/controllers/clipboard_controller.js +144 -0
  17. package/dist/controllers/clipboard_controller.js.map +1 -0
  18. package/dist/controllers/collapsible_controller.d.ts +70 -0
  19. package/dist/controllers/collapsible_controller.js +327 -0
  20. package/dist/controllers/collapsible_controller.js.map +1 -0
  21. package/dist/controllers/color_picker_controller.d.ts +76 -0
  22. package/dist/controllers/color_picker_controller.js +213 -0
  23. package/dist/controllers/color_picker_controller.js.map +1 -0
  24. package/dist/controllers/combobox_controller.d.ts +6 -2
  25. package/dist/controllers/combobox_controller.js +64 -3
  26. package/dist/controllers/combobox_controller.js.map +1 -1
  27. package/dist/controllers/command_palette_controller.d.ts +13 -6
  28. package/dist/controllers/command_palette_controller.js +243 -39
  29. package/dist/controllers/command_palette_controller.js.map +1 -1
  30. package/dist/controllers/confirm_controller.js +94 -8
  31. package/dist/controllers/confirm_controller.js.map +1 -1
  32. package/dist/controllers/context_menu_controller.d.ts +11 -6
  33. package/dist/controllers/context_menu_controller.js +191 -13
  34. package/dist/controllers/context_menu_controller.js.map +1 -1
  35. package/dist/controllers/count_up_controller.js +8 -1
  36. package/dist/controllers/count_up_controller.js.map +1 -1
  37. package/dist/controllers/countdown_controller.d.ts +2 -2
  38. package/dist/controllers/countdown_controller.js +2 -2
  39. package/dist/controllers/countdown_controller.js.map +1 -1
  40. package/dist/controllers/currency_input_controller.d.ts +72 -0
  41. package/dist/controllers/currency_input_controller.js +147 -0
  42. package/dist/controllers/currency_input_controller.js.map +1 -0
  43. package/dist/controllers/data_grid_controller.d.ts +71 -0
  44. package/dist/controllers/data_grid_controller.js +168 -0
  45. package/dist/controllers/data_grid_controller.js.map +1 -0
  46. package/dist/controllers/date_range_picker_controller.d.ts +87 -0
  47. package/dist/controllers/date_range_picker_controller.js +417 -0
  48. package/dist/controllers/date_range_picker_controller.js.map +1 -0
  49. package/dist/controllers/dialog_controller.js +94 -8
  50. package/dist/controllers/dialog_controller.js.map +1 -1
  51. package/dist/controllers/dismissible_controller.d.ts +57 -0
  52. package/dist/controllers/dismissible_controller.js +117 -0
  53. package/dist/controllers/dismissible_controller.js.map +1 -0
  54. package/dist/controllers/drawer_controller.d.ts +96 -0
  55. package/dist/controllers/drawer_controller.js +630 -0
  56. package/dist/controllers/drawer_controller.js.map +1 -0
  57. package/dist/controllers/dropdown_controller.d.ts +9 -6
  58. package/dist/controllers/dropdown_controller.js +139 -16
  59. package/dist/controllers/dropdown_controller.js.map +1 -1
  60. package/dist/controllers/editable_controller.d.ts +73 -0
  61. package/dist/controllers/editable_controller.js +168 -0
  62. package/dist/controllers/editable_controller.js.map +1 -0
  63. package/dist/controllers/file_dropzone_controller.d.ts +92 -0
  64. package/dist/controllers/file_dropzone_controller.js +165 -0
  65. package/dist/controllers/file_dropzone_controller.js.map +1 -0
  66. package/dist/controllers/filter_controller.d.ts +60 -0
  67. package/dist/controllers/filter_controller.js +86 -0
  68. package/dist/controllers/filter_controller.js.map +1 -0
  69. package/dist/controllers/flash_controller.js +36 -5
  70. package/dist/controllers/flash_controller.js.map +1 -1
  71. package/dist/controllers/focus_controller.js +94 -8
  72. package/dist/controllers/focus_controller.js.map +1 -1
  73. package/dist/controllers/form_validation_controller.js +2 -2
  74. package/dist/controllers/form_validation_controller.js.map +1 -1
  75. package/dist/controllers/highlight_controller.js +6 -4
  76. package/dist/controllers/highlight_controller.js.map +1 -1
  77. package/dist/controllers/hover_card_controller.d.ts +15 -12
  78. package/dist/controllers/hover_card_controller.js +103 -27
  79. package/dist/controllers/hover_card_controller.js.map +1 -1
  80. package/dist/controllers/intersection_controller.js +41 -18
  81. package/dist/controllers/intersection_controller.js.map +1 -1
  82. package/dist/controllers/lazy_frame_controller.js +33 -11
  83. package/dist/controllers/lazy_frame_controller.js.map +1 -1
  84. package/dist/controllers/listbox_controller.js +1 -0
  85. package/dist/controllers/listbox_controller.js.map +1 -1
  86. package/dist/controllers/masonry_controller.d.ts +54 -0
  87. package/dist/controllers/masonry_controller.js +142 -0
  88. package/dist/controllers/masonry_controller.js.map +1 -0
  89. package/dist/controllers/menu_controller.d.ts +18 -11
  90. package/dist/controllers/menu_controller.js +181 -8
  91. package/dist/controllers/menu_controller.js.map +1 -1
  92. package/dist/controllers/menubar_controller.d.ts +62 -0
  93. package/dist/controllers/menubar_controller.js +433 -0
  94. package/dist/controllers/menubar_controller.js.map +1 -0
  95. package/dist/controllers/multi_select_controller.d.ts +115 -0
  96. package/dist/controllers/multi_select_controller.js +472 -0
  97. package/dist/controllers/multi_select_controller.js.map +1 -0
  98. package/dist/controllers/navigation_menu_controller.d.ts +99 -0
  99. package/dist/controllers/navigation_menu_controller.js +384 -0
  100. package/dist/controllers/navigation_menu_controller.js.map +1 -0
  101. package/dist/controllers/otp_controller.js +62 -22
  102. package/dist/controllers/otp_controller.js.map +1 -1
  103. package/dist/controllers/overflow_indicator_controller.d.ts +12 -4
  104. package/dist/controllers/overflow_indicator_controller.js +178 -27
  105. package/dist/controllers/overflow_indicator_controller.js.map +1 -1
  106. package/dist/controllers/overflow_menu_controller.d.ts +3 -2
  107. package/dist/controllers/overflow_menu_controller.js.map +1 -1
  108. package/dist/controllers/password_reveal_controller.d.ts +49 -0
  109. package/dist/controllers/password_reveal_controller.js +117 -0
  110. package/dist/controllers/password_reveal_controller.js.map +1 -0
  111. package/dist/controllers/pointer_drag_controller.js +3 -3
  112. package/dist/controllers/pointer_drag_controller.js.map +1 -1
  113. package/dist/controllers/popover_controller.d.ts +18 -10
  114. package/dist/controllers/popover_controller.js +118 -27
  115. package/dist/controllers/popover_controller.js.map +1 -1
  116. package/dist/controllers/range_slider_controller.d.ts +87 -0
  117. package/dist/controllers/range_slider_controller.js +166 -0
  118. package/dist/controllers/range_slider_controller.js.map +1 -0
  119. package/dist/controllers/read_more_controller.d.ts +52 -0
  120. package/dist/controllers/read_more_controller.js +194 -0
  121. package/dist/controllers/read_more_controller.js.map +1 -0
  122. package/dist/controllers/scroll_area_controller.js +15 -2
  123. package/dist/controllers/scroll_area_controller.js.map +1 -1
  124. package/dist/controllers/scroll_restore_controller.d.ts +54 -0
  125. package/dist/controllers/scroll_restore_controller.js +93 -0
  126. package/dist/controllers/scroll_restore_controller.js.map +1 -0
  127. package/dist/controllers/scroll_visibility_controller.js +8 -4
  128. package/dist/controllers/scroll_visibility_controller.js.map +1 -1
  129. package/dist/controllers/scrollspy_controller.js +33 -11
  130. package/dist/controllers/scrollspy_controller.js.map +1 -1
  131. package/dist/controllers/separator_controller.d.ts +54 -0
  132. package/dist/controllers/separator_controller.js +87 -0
  133. package/dist/controllers/separator_controller.js.map +1 -0
  134. package/dist/controllers/sidebar_controller.d.ts +107 -0
  135. package/dist/controllers/sidebar_controller.js +761 -0
  136. package/dist/controllers/sidebar_controller.js.map +1 -0
  137. package/dist/controllers/stepper_controller.d.ts +4 -0
  138. package/dist/controllers/stepper_controller.js +28 -12
  139. package/dist/controllers/stepper_controller.js.map +1 -1
  140. package/dist/controllers/stick_to_bottom_controller.js +8 -4
  141. package/dist/controllers/stick_to_bottom_controller.js.map +1 -1
  142. package/dist/controllers/sticky_observer_controller.d.ts +17 -4
  143. package/dist/controllers/sticky_observer_controller.js +88 -20
  144. package/dist/controllers/sticky_observer_controller.js.map +1 -1
  145. package/dist/controllers/tabs_controller.d.ts +3 -3
  146. package/dist/controllers/tabs_controller.js.map +1 -1
  147. package/dist/controllers/tags_input_controller.d.ts +91 -0
  148. package/dist/controllers/tags_input_controller.js +275 -0
  149. package/dist/controllers/tags_input_controller.js.map +1 -0
  150. package/dist/controllers/theme_controller.js +20 -10
  151. package/dist/controllers/theme_controller.js.map +1 -1
  152. package/dist/controllers/time_picker_controller.d.ts +67 -0
  153. package/dist/controllers/time_picker_controller.js +212 -0
  154. package/dist/controllers/time_picker_controller.js.map +1 -0
  155. package/dist/controllers/toast_controller.d.ts +8 -18
  156. package/dist/controllers/toast_controller.js +144 -38
  157. package/dist/controllers/toast_controller.js.map +1 -1
  158. package/dist/controllers/tooltip_controller.d.ts +15 -18
  159. package/dist/controllers/tooltip_controller.js +148 -42
  160. package/dist/controllers/tooltip_controller.js.map +1 -1
  161. package/dist/controllers/transition_controller.d.ts +14 -8
  162. package/dist/controllers/transition_controller.js +153 -38
  163. package/dist/controllers/transition_controller.js.map +1 -1
  164. package/dist/controllers/tree_view_controller.d.ts +54 -0
  165. package/dist/controllers/tree_view_controller.js +275 -0
  166. package/dist/controllers/tree_view_controller.js.map +1 -0
  167. package/dist/index.d.ts +27 -1788
  168. package/dist/index.js +1644 -643
  169. package/dist/index.js.map +1 -1
  170. package/dist/inspector/cli.js.map +1 -1
  171. package/dist/inspector/cli_bin.js.map +1 -1
  172. package/dist/inspector/examples.json +8 -8
  173. package/dist/inspector/manifest.json +30 -5
  174. package/package.json +7 -7
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../src/utils/escape_layer.ts","../../src/utils/safe_timeout.ts","../../src/controllers/navigation_menu_controller.ts"],"names":[],"mappings":"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","file":"navigation_menu_controller.js","sourcesContent":["/**\n * Single resolver for layered Escape dismissal.\n *\n * Every Escape-dismissable overlay layer (modal focus traps, disclosure\n * overlays like dropdown/popover/menu, and hover-triggered transient layers)\n * registers here while it is open. One document-level listener per document\n * resolves each press to exactly one owner and invokes that layer's\n * {@link EscapeLayerOptions.onDismiss} — controllers never listen for a\n * dismissing Escape themselves.\n *\n * @remarks\n * Each document owns an activation-ordered stack. The owner of a press is the\n * **topmost layer whose {@link EscapeLayerOptions.claims} passes**; a layer\n * that declines is transparent, so a background overlay opened behind a modal\n * never blocks it. Because a layer opened from within another is necessarily\n * activated later, LIFO order is also inner-first for nested layers — no DOM\n * inspection is needed.\n *\n * The shared listener runs in the document bubble phase and honors\n * `event.defaultPrevented`, so an element-level widget handler that consumes\n * Escape first (an editor cancelling its edit, a combobox closing its list)\n * always wins over every registered layer — the deepest-first half of the\n * shared layered-Escape contract. A keydown that is part of an IME composition\n * (`event.isComposing`) cancels the composition, never a layer, and is ignored\n * here for every layer at once.\n *\n * A WeakMap keeps documents collectible; the listener is installed only while\n * a document's stack is non-empty, and controller lifecycle hooks guarantee\n * that disconnected layers never remain registered.\n */\n\n/** Behavior a layer registers when it activates. */\nexport interface EscapeLayerOptions {\n /**\n * Dismisses the layer. Called by the shared resolver when this layer owns a\n * press; the resolver has already consumed the event (`preventDefault()`),\n * so the callback only needs to close and place focus per the widget's\n * contract.\n */\n onDismiss: () => void;\n /**\n * Whether the layer claims the current press. Evaluated per press, so it can\n * depend on live state (e.g. \"focus is inside me or fell to the body\"). A\n * declining layer is skipped and the next layer down is consulted; omitting\n * it means the layer always claims while active.\n */\n claims?: () => boolean;\n}\n\n/** A document's stack plus the one shared listener bound to it. */\ninterface EscapeLayerRegistry {\n stack: EscapeLayer[];\n onKeydown: (event: KeyboardEvent) => void;\n}\n\n/**\n * Claims predicate shared by the click-opened disclosure overlays (dropdown /\n * popover / navigation-menu / menu / context-menu / menubar): the layer claims\n * a press while focus is inside `element`, or after focus fell to the body —\n * a click on non-focusable overlay content blurs to `<body>`, and Escape must\n * still close the overlay (the \"body-focus rescue\"). A press made after focus\n * moved to another interactive element is declined, so closing never yanks\n * focus away from where the user deliberately went.\n */\nexport function claimsWhileFocusWithin(element: Element): () => boolean {\n return () => {\n const active = element.ownerDocument.activeElement;\n return active === null || active === element.ownerDocument.body || element.contains(active);\n };\n}\n\nexport class EscapeLayer {\n static readonly #registries = new WeakMap<Document, EscapeLayerRegistry>();\n\n #ownerDocument: Document | null = null;\n /** Dismissal callback while active; `null` when inactive. */\n #onDismiss: (() => void) | null = null;\n /** Live predicate deciding whether the layer claims a press; `null` = always. */\n #claims: (() => boolean) | null = null;\n\n /**\n * Activates this layer at the top of its document's Escape stack, installing\n * the document's shared resolver listener if this is its first layer.\n * Re-activating an already-active layer moves it to the top.\n */\n activate(ownerDocument: Document = document, options: EscapeLayerOptions): void {\n this.deactivate();\n let registry = EscapeLayer.#registries.get(ownerDocument);\n if (!registry) {\n registry = EscapeLayer.#createRegistry();\n EscapeLayer.#registries.set(ownerDocument, registry);\n ownerDocument.addEventListener(\"keydown\", registry.onKeydown);\n }\n registry.stack.push(this);\n this.#ownerDocument = ownerDocument;\n this.#onDismiss = options.onDismiss;\n this.#claims = options.claims ?? null;\n }\n\n /**\n * Removes this layer from its document's Escape stack, uninstalling the\n * shared listener when the stack empties. Safe to call when inactive.\n */\n deactivate(): void {\n const ownerDocument = this.#ownerDocument;\n if (!ownerDocument) return;\n\n const registry = EscapeLayer.#registries.get(ownerDocument);\n if (registry) {\n const index = registry.stack.lastIndexOf(this);\n if (index >= 0) registry.stack.splice(index, 1);\n if (registry.stack.length === 0) {\n ownerDocument.removeEventListener(\"keydown\", registry.onKeydown);\n EscapeLayer.#registries.delete(ownerDocument);\n }\n }\n this.#ownerDocument = null;\n this.#onDismiss = null;\n this.#claims = null;\n }\n\n /**\n * Whether this active layer would own a press right now: it is the topmost\n * layer whose {@link EscapeLayerOptions.claims} passes. Exposed for tests\n * and diagnostics — production dismissal goes through the shared listener.\n */\n get ownsEscape(): boolean {\n const ownerDocument = this.#ownerDocument;\n if (!ownerDocument) return false;\n const registry = EscapeLayer.#registries.get(ownerDocument);\n if (!registry) return false;\n return EscapeLayer.#resolveOwner(registry.stack) === this;\n }\n\n /** Builds a document's registry with its shared resolver listener. */\n static #createRegistry(): EscapeLayerRegistry {\n const registry: EscapeLayerRegistry = {\n stack: [],\n onKeydown: (event: KeyboardEvent): void => {\n if (event.key !== \"Escape\" || event.defaultPrevented || event.isComposing) return;\n const owner = EscapeLayer.#resolveOwner(registry.stack);\n if (!owner) return;\n event.preventDefault();\n owner.#onDismiss?.();\n },\n };\n return registry;\n }\n\n /** The topmost stack layer whose claims predicate passes, or `null`. */\n static #resolveOwner(stack: EscapeLayer[]): EscapeLayer | null {\n for (let index = stack.length - 1; index >= 0; index--) {\n const layer = stack[index];\n if (!layer) continue;\n if (layer.#claims && !layer.#claims()) continue;\n return layer;\n }\n return null;\n }\n}\n","/**\n * Self-cleaning timer registries shared by Stimeo controllers.\n *\n * Stimulus controllers frequently schedule `setTimeout` / `setInterval` work\n * (auto-dismiss, debouncing, polling). When the element leaves the DOM — a\n * Turbo Drive navigation, a Turbo Stream replacement, or any `disconnect()` —\n * orphaned timers keep firing against a detached controller, leaking memory and\n * mutating stale state. {@link SafeTimeout} and {@link SafeInterval} track every\n * timer they create so a single {@link TimerRegistry.clearAll | clearAll()} call\n * in `disconnect()` tears them all down.\n *\n * These are intentionally low-level primitives: they own *registration and\n * cleanup only*. Higher-level policy (pause/resume, remaining-time accounting)\n * stays in the individual controllers so per-widget semantics are not flattened\n * into a lowest-common-denominator helper.\n */\n\n/**\n * Shared registry bookkeeping for the timeout/interval variants.\n *\n * Subclasses provide the scheduling primitive ({@link schedule}) and its matching\n * canceller ({@link cancel}); this base owns the set of live ids plus the\n * per-id and bulk teardown shared by both.\n */\nabstract class TimerRegistry {\n /** Live timer ids that have not yet been cleared (or, for timeouts, fired). */\n protected readonly ids = new Set<number>();\n\n /** Schedules the underlying platform timer and returns its id. */\n protected abstract schedule(callback: () => void, delay: number): number;\n\n /** Cancels the underlying platform timer for `id`. */\n protected abstract cancel(id: number): void;\n\n /**\n * Cancels a single tracked timer.\n *\n * No-ops if the id is unknown (already cleared, fired, or never owned by this\n * registry), so callers can clear defensively without guarding.\n */\n clear(id: number): void {\n if (this.ids.delete(id)) {\n this.cancel(id);\n }\n }\n\n /**\n * Cancels every tracked timer. Call this from a controller's `disconnect()`\n * to guarantee no timer outlives the element.\n */\n clearAll(): void {\n for (const id of this.ids) {\n this.cancel(id);\n }\n this.ids.clear();\n }\n\n /** Number of timers currently tracked (pending). */\n get size(): number {\n return this.ids.size;\n }\n}\n\n/**\n * `setTimeout` wrapper that auto-forgets each timer once it fires and supports\n * bulk teardown on disconnect.\n *\n * @example\n * ```ts\n * #timers = new SafeTimeout();\n *\n * connect() {\n * this.#timers.set(() => this.dismiss(), 5000);\n * }\n *\n * disconnect() {\n * this.#timers.clearAll();\n * }\n * ```\n */\nexport class SafeTimeout extends TimerRegistry {\n /**\n * Schedules `callback` after `delay` ms and returns the timer id.\n *\n * The id is removed from the registry automatically when the timeout fires,\n * so {@link TimerRegistry.size | size} reflects only still-pending timers.\n */\n set(callback: () => void, delay: number): number {\n const id = this.schedule(() => {\n this.ids.delete(id);\n callback();\n }, delay);\n this.ids.add(id);\n return id;\n }\n\n protected schedule(callback: () => void, delay: number): number {\n return window.setTimeout(callback, delay);\n }\n\n protected cancel(id: number): void {\n window.clearTimeout(id);\n }\n}\n\n/**\n * `setInterval` wrapper that tracks every interval for bulk teardown on\n * disconnect. Unlike {@link SafeTimeout}, intervals are retained until they are\n * explicitly cleared because they fire repeatedly.\n *\n * @example\n * ```ts\n * #intervals = new SafeInterval();\n *\n * connect() {\n * this.#intervals.set(() => this.tick(), 1000);\n * }\n *\n * disconnect() {\n * this.#intervals.clearAll();\n * }\n * ```\n */\nexport class SafeInterval extends TimerRegistry {\n /** Schedules a repeating `callback` every `delay` ms and returns the timer id. */\n set(callback: () => void, delay: number): number {\n const id = this.schedule(callback, delay);\n this.ids.add(id);\n return id;\n }\n\n protected schedule(callback: () => void, delay: number): number {\n return window.setInterval(callback, delay);\n }\n\n protected cancel(id: number): void {\n window.clearInterval(id);\n }\n}\n","import { Controller } from \"@hotwired/stimulus\";\nimport { claimsWhileFocusWithin, EscapeLayer } from \"../utils/escape_layer\";\nimport { SafeTimeout } from \"../utils/safe_timeout\";\n\n/**\n * Headless, accessible **navigation menu** behavior (disclosure navigation).\n *\n * Markup contract (identifier: `stimeo--navigation-menu`):\n * <nav data-controller=\"stimeo--navigation-menu\" aria-label=\"Main\">\n * <ul>\n * <li>\n * <button data-stimeo--navigation-menu-target=\"trigger\"\n * aria-expanded=\"false\" aria-controls=\"nav-products\"\n * data-action=\"click->stimeo--navigation-menu#toggle\n * keydown->stimeo--navigation-menu#onTriggerKeydown\">\n * Products\n * </button>\n * <div id=\"nav-products\" data-stimeo--navigation-menu-target=\"panel\" hidden>\n * <a href=\"/a\">Product A</a><a href=\"/b\">Product B</a>\n * </div>\n * </li>\n * </ul>\n * </nav>\n *\n * Implements the WAI-ARIA APG **Disclosure** navigation pattern: each top-level\n * button toggles its sub-panel (`aria-expanded` + `hidden` synced), only one panel\n * is open at a time, and the panel content is a plain set of links (not a\n * `role=\"menu\"`). Focus is **not** trapped — `Tab` moves through the links\n * naturally. `Escape` closes the open panel and returns focus to its trigger.\n * While a panel is open the nav is a layer on the shared {@link EscapeLayer}\n * stack; it claims a press only while focus is inside the nav or fell to the\n * body (a click on non-focusable panel content), so one keypress closes exactly\n * one layer (the shared layered-Escape contract). An outside click, or focus\n * leaving the nav for a known external destination, closes it. `ArrowLeft`/\n * `ArrowRight` move focus between triggers without rewriting `tabindex` (they\n * keep their natural Tab order). Hover open/close is opt-in via `openOnHover`.\n *\n * By default the hover region is each trigger and its panel. An optional\n * `hoverArea` target widens it: mark a wrapper that contains a trigger (e.g. the\n * `<li>` holding a top-level *link*, its disclosure button, and its panel — the\n * APG \"Disclosure Navigation with Top-Level Links\" arrangement) and hovering\n * anywhere over that wrapper opens the contained trigger's panel. A trigger or\n * panel inside a `hoverArea` defers to the wrapper (its own edges stop scheduling\n * open/close), so pointer movement within the area never flickers the panel.\n * Keep a trigger's panel inside its `hoverArea`: a panel left outside simply\n * falls back to the default two-region behavior — moving straight across a\n * shared edge never schedules a close (the leave handler checks\n * `relatedTarget`), and `hoverDelay` bridges the pointer's travel across an\n * actual gap. Targets added or removed while connected (e.g. a Turbo Stream\n * append) re-wire the hover listeners via Stimulus target callbacks.\n * `hoverArea` has no effect unless `openOnHover` is enabled.\n *\n * @remarks\n * Behavior only. Panel layout, mega-menu styling, and animation are the\n * consumer's CSS. Static placement is CSS; viewport-edge collision avoidance is\n * delegated to the opt-in `stimeo-ui/positioning` module (never imported here, so\n * the core stays zero-dependency). For an app command menu with arrow roving and\n * `role=\"menu\"`, use `stimeo--menubar` instead.\n */\nexport class NavigationMenuController extends Controller<HTMLElement> {\n static override targets = [\"trigger\", \"panel\", \"hoverArea\"];\n static override values = {\n openOnHover: { type: Boolean, default: false },\n hoverDelay: { type: Number, default: 150 },\n };\n static actions = [\"onTriggerKeydown\", \"toggle\"] as const;\n\n declare readonly triggerTargets: HTMLElement[];\n declare readonly panelTargets: HTMLElement[];\n declare readonly hoverAreaTargets: HTMLElement[];\n\n declare openOnHoverValue: boolean;\n declare hoverDelayValue: number;\n\n /** Open/close delay timers for hover mode; cleared together on disconnect. */\n readonly #hoverTimers = new SafeTimeout();\n\n /**\n * Elements currently carrying hover listeners. Removal always mirrors this\n * set (not a recomputed target snapshot), so add/remove stays symmetric even\n * when targets churn between connect and disconnect.\n */\n readonly #hoverWired = new Set<HTMLElement>();\n\n /** Escape-stack membership while any panel is open; the shared resolver dismisses via it. */\n readonly #escapeLayer = new EscapeLayer();\n\n /** Establishes the closed baseline and the dismissal listeners. */\n override connect(): void {\n this.#closeAll();\n document.addEventListener(\"click\", this.#onOutsideClick);\n this.element.addEventListener(\"focusout\", this.#onFocusOut);\n if (this.openOnHoverValue) this.#addHoverListeners();\n }\n\n /** Removes every listener, pending hover timer, and stack membership registered while connected. */\n override disconnect(): void {\n this.#escapeLayer.deactivate();\n document.removeEventListener(\"click\", this.#onOutsideClick);\n this.element.removeEventListener(\"focusout\", this.#onFocusOut);\n this.#removeHoverListeners();\n this.#hoverTimers.clearAll();\n }\n\n /** Re-wires hover listeners when a target is added after connect (Turbo Streams etc.). */\n triggerTargetConnected(): void {\n this.#rewireHoverListeners();\n }\n\n /** Re-wires hover listeners when a target is removed while connected. */\n triggerTargetDisconnected(): void {\n this.#rewireHoverListeners();\n }\n\n /** See {@link NavigationMenuController.triggerTargetConnected}. */\n panelTargetConnected(): void {\n this.#rewireHoverListeners();\n }\n\n /** See {@link NavigationMenuController.triggerTargetDisconnected}. */\n panelTargetDisconnected(): void {\n this.#rewireHoverListeners();\n }\n\n /** See {@link NavigationMenuController.triggerTargetConnected}. */\n hoverAreaTargetConnected(): void {\n this.#rewireHoverListeners();\n }\n\n /** See {@link NavigationMenuController.triggerTargetDisconnected}. */\n hoverAreaTargetDisconnected(): void {\n this.#rewireHoverListeners();\n }\n\n /** Toggles a trigger's panel (single-open). Bound via `data-action` (click). */\n toggle(event: Event): void {\n const trigger = event.currentTarget as HTMLElement;\n if (this.#isExpanded(trigger)) {\n this.#closePanel(trigger);\n } else {\n this.#openPanel(trigger);\n }\n }\n\n /** `ArrowLeft`/`ArrowRight` move focus between triggers (keeping Tab order). */\n onTriggerKeydown(event: KeyboardEvent): void {\n const triggers = this.triggerTargets;\n const index = triggers.indexOf(event.currentTarget as HTMLElement);\n if (index === -1) return;\n const length = triggers.length;\n\n if (event.key === \"ArrowRight\") {\n event.preventDefault();\n triggers[(index + 1) % length]?.focus();\n } else if (event.key === \"ArrowLeft\") {\n event.preventDefault();\n triggers[(index - 1 + length) % length]?.focus();\n }\n }\n\n /** Opens `trigger`'s panel, closing any other open panel first. */\n #openPanel(trigger: HTMLElement): void {\n this.#closeAll();\n const panel = this.#panelFor(trigger);\n if (!panel) return;\n panel.hidden = false;\n trigger.setAttribute(\"aria-expanded\", \"true\");\n this.#syncEscapeLayer();\n }\n\n /** Closes `trigger`'s panel and reflects the collapsed state. */\n #closePanel(trigger: HTMLElement): void {\n const panel = this.#panelFor(trigger);\n if (panel) panel.hidden = true;\n trigger.setAttribute(\"aria-expanded\", \"false\");\n this.#syncEscapeLayer();\n }\n\n /** Closes every open panel. */\n #closeAll(): void {\n for (const trigger of this.triggerTargets) this.#closePanel(trigger);\n }\n\n /**\n * Aligns Escape-stack membership with the open state: joins (or re-asserts to\n * the top) while a panel is open, leaves once none is. Re-asserting when the\n * user switches panels is deliberate — the nav is again the newest layer.\n */\n #syncEscapeLayer(): void {\n if (this.#isAnyOpen) {\n this.#escapeLayer.activate(document, {\n onDismiss: () => this.#closeAndRestore(),\n claims: claimsWhileFocusWithin(this.element),\n });\n } else {\n this.#escapeLayer.deactivate();\n }\n }\n\n /** Closes any open panel and returns focus to its trigger (Escape path). */\n #closeAndRestore(): void {\n const open = this.#openTrigger;\n if (!open) return;\n this.#closePanel(open);\n open.focus();\n }\n\n /** Closes panels when a click lands outside the nav element. */\n readonly #onOutsideClick = (event: MouseEvent): void => {\n if (this.#isAnyOpen && !this.element.contains(event.target as Node)) this.#closeAll();\n };\n\n /**\n * Closes (without restoring focus) when focus leaves the nav for a known\n * external destination. A null/non-Node destination is indeterminate:\n * browsers use it for clicks on non-focusable content and for window\n * deactivation, so those never close the nav here (matching the popover\n * convention) — the outside-click handler decides pointer dismissal, and the\n * Escape stack's body-focus claim keeps keyboard dismissal working.\n */\n readonly #onFocusOut = (event: FocusEvent): void => {\n const next = event.relatedTarget;\n if (!(next instanceof Node) || this.element.contains(next)) return;\n this.#closeAll();\n };\n\n /** Opens a trigger's panel after the hover delay (hover mode). */\n readonly #onPointerEnter = (event: Event): void => {\n const trigger = this.#triggerForHover(event.currentTarget as HTMLElement);\n if (!trigger) return;\n this.#hoverTimers.clearAll();\n this.#hoverTimers.set(() => this.#openPanel(trigger), this.hoverDelayValue);\n };\n\n /**\n * Closes the open panel after the hover delay (hover mode) — unless the\n * pointer moved directly into another part of the hover region (an adjacent\n * trigger, panel, or hoverArea): crossing a shared edge must not schedule a\n * spurious close, e.g. a hoverArea whose panel sits outside it as a sibling.\n */\n readonly #onPointerLeave = (event: Event): void => {\n const next = event instanceof MouseEvent ? event.relatedTarget : null;\n if (next instanceof Node && this.#hoverElements.some((el) => el.contains(next))) return;\n this.#hoverTimers.clearAll();\n this.#hoverTimers.set(() => this.#closeAll(), this.hoverDelayValue);\n };\n\n /** Wires hover open/close on each hover element (opt-in), tracking what was wired. */\n #addHoverListeners(): void {\n for (const element of this.#hoverElements) {\n element.addEventListener(\"mouseenter\", this.#onPointerEnter);\n element.addEventListener(\"mouseleave\", this.#onPointerLeave);\n this.#hoverWired.add(element);\n }\n }\n\n /** Removes the hover listeners from exactly the elements that were wired. */\n #removeHoverListeners(): void {\n for (const element of this.#hoverWired) {\n element.removeEventListener(\"mouseenter\", this.#onPointerEnter);\n element.removeEventListener(\"mouseleave\", this.#onPointerLeave);\n }\n this.#hoverWired.clear();\n }\n\n /**\n * Rebuilds the hover wiring from the current targets. Target callbacks call\n * this so items added or removed after connect (e.g. a Turbo Stream append)\n * participate in hover; the wired-set removal keeps the rebuild symmetric.\n */\n #rewireHoverListeners(): void {\n if (!this.openOnHoverValue) return;\n this.#removeHoverListeners();\n this.#addHoverListeners();\n }\n\n /**\n * Elements that participate in hover: each `hoverArea`, plus every trigger and\n * panel **not** wrapped by one. A wrapped trigger/panel must defer to its\n * wrapper — its own mouseleave would otherwise schedule a close while the\n * pointer is still inside the area (mouseenter does not re-fire on the wrapper\n * when moving among its descendants), flickering the panel shut.\n */\n get #hoverElements(): HTMLElement[] {\n const areas = this.hoverAreaTargets;\n const covered = (element: HTMLElement): boolean => areas.some((area) => area.contains(element));\n return [\n ...areas,\n ...this.triggerTargets.filter((trigger) => !covered(trigger)),\n ...this.panelTargets.filter((panel) => !covered(panel)),\n ];\n }\n\n /**\n * Resolves the trigger for a hovered element: the trigger itself, the trigger\n * controlling a hovered panel, or the first trigger contained in a hovered\n * `hoverArea` wrapper.\n */\n #triggerForHover(element: HTMLElement): HTMLElement | null {\n if (this.triggerTargets.includes(element)) return element;\n if (this.panelTargets.includes(element)) {\n return this.triggerTargets.find((trigger) => this.#panelFor(trigger) === element) ?? null;\n }\n if (this.hoverAreaTargets.includes(element)) {\n return this.triggerTargets.find((trigger) => element.contains(trigger)) ?? null;\n }\n return null;\n }\n\n /** The panel controlled by `trigger` (matched by `aria-controls`/`id`). */\n #panelFor(trigger: HTMLElement): HTMLElement | null {\n const id = trigger.getAttribute(\"aria-controls\");\n // Resolve against this controller's own panel targets (not a global id\n // lookup) so it stays scoped to this nav instance.\n return id ? (this.panelTargets.find((panel) => panel.id === id) ?? null) : null;\n }\n\n /** Whether `trigger`'s panel is currently expanded. */\n #isExpanded(trigger: HTMLElement): boolean {\n return trigger.getAttribute(\"aria-expanded\") === \"true\";\n }\n\n /** The trigger whose panel is currently open, if any. */\n get #openTrigger(): HTMLElement | null {\n return this.triggerTargets.find((trigger) => this.#isExpanded(trigger)) ?? null;\n }\n\n /** Whether any panel is currently open. */\n get #isAnyOpen(): boolean {\n return this.#openTrigger !== null;\n }\n}\n"]}
@@ -1,5 +1,54 @@
1
1
  import { Controller } from '@hotwired/stimulus';
2
2
 
3
+ // src/controllers/otp_controller.ts
4
+
5
+ // src/utils/composition_tracker.ts
6
+ var CompositionTracker = class {
7
+ #observedTargets = /* @__PURE__ */ new Set();
8
+ #activeTargets = /* @__PURE__ */ new Set();
9
+ #onStart;
10
+ #onEnd;
11
+ constructor(options = {}) {
12
+ this.#onStart = options.onStart;
13
+ this.#onEnd = options.onEnd;
14
+ }
15
+ /** Starts lifecycle tracking for `target`; repeated calls are idempotent. */
16
+ observe(target) {
17
+ if (this.#observedTargets.has(target)) return;
18
+ target.addEventListener("compositionstart", this.#handleStart);
19
+ target.addEventListener("compositionend", this.#handleEnd);
20
+ this.#observedTargets.add(target);
21
+ }
22
+ /** Stops tracking one target and clears any active composition it owned. */
23
+ unobserve(target) {
24
+ if (!this.#observedTargets.delete(target)) return;
25
+ target.removeEventListener("compositionstart", this.#handleStart);
26
+ target.removeEventListener("compositionend", this.#handleEnd);
27
+ this.#activeTargets.delete(target);
28
+ }
29
+ /** Releases every listener and clears state so reconnect starts cleanly. */
30
+ disconnect() {
31
+ for (const target of this.#observedTargets) {
32
+ target.removeEventListener("compositionstart", this.#handleStart);
33
+ target.removeEventListener("compositionend", this.#handleEnd);
34
+ }
35
+ this.#observedTargets.clear();
36
+ this.#activeTargets.clear();
37
+ }
38
+ /** True when lifecycle tracking or the current event reports composition. */
39
+ isComposing(event) {
40
+ return this.#activeTargets.size > 0 || event?.isComposing === true;
41
+ }
42
+ #handleStart = (event) => {
43
+ if (event.currentTarget) this.#activeTargets.add(event.currentTarget);
44
+ this.#onStart?.(event);
45
+ };
46
+ #handleEnd = (event) => {
47
+ if (event.currentTarget) this.#activeTargets.delete(event.currentTarget);
48
+ this.#onEnd?.(event);
49
+ };
50
+ };
51
+
3
52
  // src/controllers/otp_controller.ts
4
53
  var OtpController = class extends Controller {
5
54
  static targets = ["field", "value", "error"];
@@ -9,21 +58,24 @@ var OtpController = class extends Controller {
9
58
  };
10
59
  static actions = ["onInput", "onKeydown", "onPaste"];
11
60
  static events = ["change", "complete", "invalid"];
12
- #isComposing = /* @__PURE__ */ new Map();
61
+ /** Owns IME lifecycle state across every digit field. */
62
+ #composition = new CompositionTracker({
63
+ onEnd: (event) => {
64
+ const input = event.currentTarget;
65
+ if (input) this.#handleInputValidation(input);
66
+ }
67
+ });
13
68
  connect() {
14
69
  for (const field of this.fieldTargets) {
15
70
  field.addEventListener("focus", this.#onFieldFocus);
16
- field.addEventListener("compositionstart", this.#onCompositionStart);
17
- field.addEventListener("compositionend", this.#onCompositionEnd);
71
+ this.#composition.observe(field);
18
72
  }
19
73
  }
20
74
  disconnect() {
21
75
  for (const field of this.fieldTargets) {
22
76
  field.removeEventListener("focus", this.#onFieldFocus);
23
- field.removeEventListener("compositionstart", this.#onCompositionStart);
24
- field.removeEventListener("compositionend", this.#onCompositionEnd);
25
77
  }
26
- this.#isComposing.clear();
78
+ this.#composition.disconnect();
27
79
  }
28
80
  /**
29
81
  * Stimulus lifecycle callback when a new field target enters the DOM.
@@ -31,21 +83,18 @@ var OtpController = class extends Controller {
31
83
  */
32
84
  fieldTargetConnected(element) {
33
85
  element.addEventListener("focus", this.#onFieldFocus);
34
- element.addEventListener("compositionstart", this.#onCompositionStart);
35
- element.addEventListener("compositionend", this.#onCompositionEnd);
86
+ this.#composition.observe(element);
36
87
  }
37
88
  /** Removes focus listeners when fields are dropped. */
38
89
  fieldTargetDisconnected(element) {
39
90
  element.removeEventListener("focus", this.#onFieldFocus);
40
- element.removeEventListener("compositionstart", this.#onCompositionStart);
41
- element.removeEventListener("compositionend", this.#onCompositionEnd);
42
- this.#isComposing.delete(element);
91
+ this.#composition.unobserve(element);
43
92
  }
44
93
  /** Handles keystroke inputs and advances focus to the next field. */
45
94
  onInput(event) {
46
95
  const input = event.currentTarget;
47
96
  if (!input) return;
48
- if (this.#isComposing.get(input)) return;
97
+ if (this.#composition.isComposing(event)) return;
49
98
  this.#handleInputValidation(input);
50
99
  }
51
100
  /** Handles Backspace retreating, arrows, and home/end navigation. */
@@ -54,7 +103,7 @@ var OtpController = class extends Controller {
54
103
  if (!input) return;
55
104
  const index = this.fieldTargets.indexOf(input);
56
105
  if (index === -1) return;
57
- if (this.#isComposing.get(input)) return;
106
+ if (this.#composition.isComposing(event)) return;
58
107
  switch (event.key) {
59
108
  case "Backspace":
60
109
  if (!input.value) {
@@ -136,15 +185,6 @@ var OtpController = class extends Controller {
136
185
  input.select();
137
186
  }
138
187
  };
139
- #onCompositionStart = (event) => {
140
- const input = event.currentTarget;
141
- this.#isComposing.set(input, true);
142
- };
143
- #onCompositionEnd = (event) => {
144
- const input = event.currentTarget;
145
- this.#isComposing.set(input, false);
146
- this.#handleInputValidation(input);
147
- };
148
188
  #handleInputValidation(input) {
149
189
  const index = this.fieldTargets.indexOf(input);
150
190
  if (index === -1) return;
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/controllers/otp_controller.ts"],"names":[],"mappings":"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","file":"otp_controller.js","sourcesContent":["import { Controller } from \"@hotwired/stimulus\";\n\n/**\n * Headless, accessible One-Time Password / PIN input logic.\n *\n * Markup contract (identifier: `stimeo--otp`):\n * <div data-controller=\"stimeo--otp\"\n * data-stimeo--otp-length-value=\"6\"\n * data-stimeo--otp-pattern-value=\"[0-9]\"\n * role=\"group\" aria-label=\"One-time passcode\">\n * <input data-stimeo--otp-target=\"field\" inputmode=\"numeric\" maxlength=\"1\"\n * data-action=\"input->stimeo--otp#onInput\n * keydown->stimeo--otp#onKeydown\n * paste->stimeo--otp#onPaste\" />\n * <input type=\"hidden\" data-stimeo--otp-target=\"value\" />\n * </div>\n *\n * Implements highly polished UX conventions for single-digit field groups:\n * - Dynamic autofocus advancement upon valid inputs.\n * - Auto-selection `select()` upon gaining focus to enable frictionless digit overwrites.\n * - Retroactive Backspace key focus stepping to clear preceding values safely.\n * - Clipboard intercepting paste division across fields with trailing focus positioning.\n * - Hidden form sync and complete/change event dispatching.\n *\n * @remarks\n * Behavior only. The controller binds events dynamically to pre-rendered inputs,\n * updates `data-filled` and hidden value bindings, and emits Stimulus custom events.\n */\nexport class OtpController extends Controller<HTMLElement> {\n static override targets = [\"field\", \"value\", \"error\"];\n static override values = {\n length: { type: Number, default: 6 },\n pattern: { type: String, default: \"[0-9]\" },\n };\n static actions = [\"onInput\", \"onKeydown\", \"onPaste\"] as const;\n static events = [\"change\", \"complete\", \"invalid\"] as const;\n\n declare readonly fieldTargets: HTMLInputElement[];\n declare readonly valueTarget: HTMLInputElement;\n declare readonly errorTarget: HTMLElement;\n declare readonly hasValueTarget: boolean;\n declare readonly hasErrorTarget: boolean;\n\n declare lengthValue: number;\n declare patternValue: string;\n\n #isComposing = new Map<HTMLInputElement, boolean>();\n\n override connect(): void {\n // Dynamically bind auto-selection and IME tracking logic to all connected inputs\n for (const field of this.fieldTargets) {\n field.addEventListener(\"focus\", this.#onFieldFocus);\n field.addEventListener(\"compositionstart\", this.#onCompositionStart);\n field.addEventListener(\"compositionend\", this.#onCompositionEnd);\n }\n }\n\n override disconnect(): void {\n for (const field of this.fieldTargets) {\n field.removeEventListener(\"focus\", this.#onFieldFocus);\n field.removeEventListener(\"compositionstart\", this.#onCompositionStart);\n field.removeEventListener(\"compositionend\", this.#onCompositionEnd);\n }\n this.#isComposing.clear();\n }\n\n /**\n * Stimulus lifecycle callback when a new field target enters the DOM.\n * Ensures new additions are also wired with overwriting support.\n */\n fieldTargetConnected(element: HTMLInputElement): void {\n element.addEventListener(\"focus\", this.#onFieldFocus);\n element.addEventListener(\"compositionstart\", this.#onCompositionStart);\n element.addEventListener(\"compositionend\", this.#onCompositionEnd);\n }\n\n /** Removes focus listeners when fields are dropped. */\n fieldTargetDisconnected(element: HTMLInputElement): void {\n element.removeEventListener(\"focus\", this.#onFieldFocus);\n element.removeEventListener(\"compositionstart\", this.#onCompositionStart);\n element.removeEventListener(\"compositionend\", this.#onCompositionEnd);\n this.#isComposing.delete(element);\n }\n\n /** Handles keystroke inputs and advances focus to the next field. */\n onInput(event: Event): void {\n const input = event.currentTarget as HTMLInputElement | null;\n if (!input) return;\n\n // Guard during active composition to prevent premature focus switching\n if (this.#isComposing.get(input)) return;\n\n this.#handleInputValidation(input);\n }\n\n /** Handles Backspace retreating, arrows, and home/end navigation. */\n onKeydown(event: KeyboardEvent): void {\n const input = event.currentTarget as HTMLInputElement | null;\n if (!input) return;\n\n const index = this.fieldTargets.indexOf(input);\n if (index === -1) return;\n\n // Do not trigger keydown actions during composition\n if (this.#isComposing.get(input)) return;\n\n switch (event.key) {\n case \"Backspace\":\n if (!input.value) {\n // Empty field: step backward, wipe previous digit, and focus it\n if (index > 0) {\n event.preventDefault();\n const prevField = this.fieldTargets[index - 1];\n if (prevField) {\n prevField.value = \"\";\n prevField.removeAttribute(\"data-filled\");\n prevField.focus();\n this.#clearError();\n this.#syncAndDispatch();\n }\n }\n } else {\n // Filled field: clear current value\n input.value = \"\";\n input.removeAttribute(\"data-filled\");\n this.#clearError();\n this.#syncAndDispatch();\n }\n break;\n\n case \"ArrowLeft\":\n if (index > 0) {\n event.preventDefault();\n this.fieldTargets[index - 1]?.focus();\n }\n break;\n\n case \"ArrowRight\":\n if (index < this.lengthValue - 1) {\n event.preventDefault();\n this.fieldTargets[index + 1]?.focus();\n }\n break;\n\n case \"Home\":\n event.preventDefault();\n this.fieldTargets[0]?.focus();\n break;\n\n case \"End\":\n event.preventDefault();\n this.fieldTargets[this.lengthValue - 1]?.focus();\n break;\n\n default:\n break;\n }\n }\n\n /** Divides pasted string characters across available input fields. */\n onPaste(event: ClipboardEvent): void {\n const input = event.currentTarget as HTMLInputElement | null;\n if (!input) return;\n\n const startIndex = this.fieldTargets.indexOf(input);\n if (startIndex === -1) return;\n\n event.preventDefault();\n\n const rawText = event.clipboardData?.getData(\"text\") || \"\";\n const text = this.#normalizeValue(rawText);\n const regex = new RegExp(`^${this.patternValue}$`);\n const validChars = Array.from(text).filter((char) => regex.test(char));\n\n if (validChars.length === 0) {\n this.#showError();\n return;\n }\n\n const limit = Math.min(validChars.length, this.lengthValue - startIndex);\n let lastFocusedIndex = startIndex;\n\n for (let i = 0; i < limit; i++) {\n const fieldIndex = startIndex + i;\n const field = this.fieldTargets[fieldIndex];\n const char = validChars[i];\n\n if (field && char) {\n field.value = char;\n field.setAttribute(\"data-filled\", \"true\");\n lastFocusedIndex = fieldIndex;\n }\n }\n\n this.#clearError();\n\n // Set trailing focus position to the last filled box (or next empty if one exists)\n const focusTargetIndex =\n lastFocusedIndex < this.lengthValue - 1 ? lastFocusedIndex + 1 : lastFocusedIndex;\n this.fieldTargets[focusTargetIndex]?.focus();\n\n this.#syncAndDispatch();\n }\n\n readonly #onFieldFocus = (event: FocusEvent): void => {\n const input = event.currentTarget as HTMLInputElement | null;\n if (input) {\n // Auto-selection enables effortless character overwrites\n input.select();\n }\n };\n\n readonly #onCompositionStart = (event: CompositionEvent): void => {\n const input = event.currentTarget as HTMLInputElement;\n this.#isComposing.set(input, true);\n };\n\n readonly #onCompositionEnd = (event: CompositionEvent): void => {\n const input = event.currentTarget as HTMLInputElement;\n this.#isComposing.set(input, false);\n\n // Force validation after IME conversion finishes\n this.#handleInputValidation(input);\n };\n\n #handleInputValidation(input: HTMLInputElement): void {\n const index = this.fieldTargets.indexOf(input);\n if (index === -1) return;\n\n const rawValue = input.value;\n const normalized = this.#normalizeValue(rawValue);\n const regex = new RegExp(`^${this.patternValue}$`);\n\n if (normalized && regex.test(normalized)) {\n input.value = normalized;\n input.setAttribute(\"data-filled\", \"true\");\n this.#clearError();\n\n // Step focus forward\n if (index < this.lengthValue - 1) {\n const nextField = this.fieldTargets[index + 1];\n nextField?.focus();\n }\n } else if (normalized) {\n input.value = \"\";\n input.removeAttribute(\"data-filled\");\n this.#showError();\n } else {\n input.removeAttribute(\"data-filled\");\n }\n\n this.#syncAndDispatch();\n }\n\n #normalizeValue(val: string): string {\n // Replaces full-width numbers (0-9) with standard half-width ones (0-9)\n return val.replace(/[0-9]/g, (s) => String.fromCharCode(s.charCodeAt(0) - 0xfee0));\n }\n\n #showError(): void {\n if (this.hasErrorTarget) {\n this.errorTarget.removeAttribute(\"hidden\");\n }\n // Behavior only: emit a neutral payload and let the consumer compose/localize\n // the user-facing message. The pattern is reported so consumers can word it.\n this.dispatch(\"invalid\", { detail: { pattern: this.patternValue } });\n }\n\n #clearError(): void {\n if (this.hasErrorTarget) {\n this.errorTarget.setAttribute(\"hidden\", \"true\");\n }\n }\n\n #syncAndDispatch(): void {\n const fields = this.fieldTargets;\n const combinedValue = fields.map((f) => f.value).join(\"\");\n\n if (this.hasValueTarget) {\n this.valueTarget.value = combinedValue;\n }\n\n this.dispatch(\"change\", { detail: { value: combinedValue } });\n\n // Completed state when all fields contain a digit\n const isCompleted =\n fields.every((f) => f.value.length > 0) && combinedValue.length === this.lengthValue;\n if (isCompleted) {\n this.dispatch(\"complete\", { detail: { value: combinedValue } });\n }\n }\n}\n"]}
1
+ {"version":3,"sources":["../../src/utils/composition_tracker.ts","../../src/controllers/otp_controller.ts"],"names":[],"mappings":"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","file":"otp_controller.js","sourcesContent":["/** Minimal event shape carrying the platform's per-event composition signal. */\nexport interface CompositionSignal {\n readonly isComposing?: boolean;\n}\n\n/** Hooks that keep component-specific work outside {@link CompositionTracker}. */\nexport interface CompositionTrackerOptions {\n /** Runs after lifecycle state is set for a `compositionstart` event. */\n readonly onStart?: (event: Event) => void;\n /** Runs after lifecycle state is cleared for a `compositionend` event. */\n readonly onEnd?: (event: Event) => void;\n}\n\n/**\n * Owns IME composition listeners and transient state for one or more event targets.\n *\n * Some browsers omit `KeyboardEvent.isComposing` on the keydown that confirms a\n * conversion. Tracking `compositionstart` through `compositionend` supplies the\n * missing lifecycle signal without relying on deprecated numeric key codes.\n * Component policy stays with the consumer: filtering, validation, and submission\n * belong in the optional {@link CompositionTrackerOptions.onEnd} callback.\n *\n * @example\n * ```ts\n * #composition = new CompositionTracker({ onEnd: () => this.filter() });\n *\n * connect(): void {\n * this.#composition.observe(this.inputTarget);\n * }\n *\n * disconnect(): void {\n * this.#composition.disconnect();\n * }\n *\n * onKeydown(event: KeyboardEvent): void {\n * if (this.#composition.isComposing(event)) return;\n * }\n * ```\n */\nexport class CompositionTracker {\n readonly #observedTargets = new Set<EventTarget>();\n readonly #activeTargets = new Set<EventTarget>();\n readonly #onStart: ((event: Event) => void) | undefined;\n readonly #onEnd: ((event: Event) => void) | undefined;\n\n constructor(options: CompositionTrackerOptions = {}) {\n this.#onStart = options.onStart;\n this.#onEnd = options.onEnd;\n }\n\n /** Starts lifecycle tracking for `target`; repeated calls are idempotent. */\n observe(target: EventTarget): void {\n if (this.#observedTargets.has(target)) return;\n target.addEventListener(\"compositionstart\", this.#handleStart);\n target.addEventListener(\"compositionend\", this.#handleEnd);\n this.#observedTargets.add(target);\n }\n\n /** Stops tracking one target and clears any active composition it owned. */\n unobserve(target: EventTarget): void {\n if (!this.#observedTargets.delete(target)) return;\n target.removeEventListener(\"compositionstart\", this.#handleStart);\n target.removeEventListener(\"compositionend\", this.#handleEnd);\n this.#activeTargets.delete(target);\n }\n\n /** Releases every listener and clears state so reconnect starts cleanly. */\n disconnect(): void {\n for (const target of this.#observedTargets) {\n target.removeEventListener(\"compositionstart\", this.#handleStart);\n target.removeEventListener(\"compositionend\", this.#handleEnd);\n }\n this.#observedTargets.clear();\n this.#activeTargets.clear();\n }\n\n /** True when lifecycle tracking or the current event reports composition. */\n isComposing(event?: CompositionSignal): boolean {\n return this.#activeTargets.size > 0 || event?.isComposing === true;\n }\n\n readonly #handleStart = (event: Event): void => {\n if (event.currentTarget) this.#activeTargets.add(event.currentTarget);\n this.#onStart?.(event);\n };\n\n readonly #handleEnd = (event: Event): void => {\n if (event.currentTarget) this.#activeTargets.delete(event.currentTarget);\n this.#onEnd?.(event);\n };\n}\n","import { Controller } from \"@hotwired/stimulus\";\nimport { CompositionTracker } from \"../utils/composition_tracker\";\n\n/**\n * Headless, accessible One-Time Password / PIN input logic.\n *\n * Markup contract (identifier: `stimeo--otp`):\n * <div data-controller=\"stimeo--otp\"\n * data-stimeo--otp-length-value=\"6\"\n * data-stimeo--otp-pattern-value=\"[0-9]\"\n * role=\"group\" aria-label=\"One-time passcode\">\n * <input data-stimeo--otp-target=\"field\" inputmode=\"numeric\" maxlength=\"1\"\n * data-action=\"input->stimeo--otp#onInput\n * keydown->stimeo--otp#onKeydown\n * paste->stimeo--otp#onPaste\" />\n * <input type=\"hidden\" data-stimeo--otp-target=\"value\" />\n * </div>\n *\n * Implements highly polished UX conventions for single-digit field groups:\n * - Dynamic autofocus advancement upon valid inputs.\n * - Auto-selection `select()` upon gaining focus to enable frictionless digit overwrites.\n * - Retroactive Backspace key focus stepping to clear preceding values safely.\n * - Clipboard intercepting paste division across fields with trailing focus positioning.\n * - Hidden form sync and complete/change event dispatching.\n *\n * @remarks\n * Behavior only. The controller binds events dynamically to pre-rendered inputs,\n * updates `data-filled` and hidden value bindings, and emits Stimulus custom events.\n */\nexport class OtpController extends Controller<HTMLElement> {\n static override targets = [\"field\", \"value\", \"error\"];\n static override values = {\n length: { type: Number, default: 6 },\n pattern: { type: String, default: \"[0-9]\" },\n };\n static actions = [\"onInput\", \"onKeydown\", \"onPaste\"] as const;\n static events = [\"change\", \"complete\", \"invalid\"] as const;\n\n declare readonly fieldTargets: HTMLInputElement[];\n declare readonly valueTarget: HTMLInputElement;\n declare readonly errorTarget: HTMLElement;\n declare readonly hasValueTarget: boolean;\n declare readonly hasErrorTarget: boolean;\n\n declare lengthValue: number;\n declare patternValue: string;\n\n /** Owns IME lifecycle state across every digit field. */\n readonly #composition = new CompositionTracker({\n onEnd: (event) => {\n const input = event.currentTarget as HTMLInputElement | null;\n if (input) this.#handleInputValidation(input);\n },\n });\n\n override connect(): void {\n // Dynamically bind auto-selection and IME tracking logic to all connected inputs\n for (const field of this.fieldTargets) {\n field.addEventListener(\"focus\", this.#onFieldFocus);\n this.#composition.observe(field);\n }\n }\n\n override disconnect(): void {\n for (const field of this.fieldTargets) {\n field.removeEventListener(\"focus\", this.#onFieldFocus);\n }\n this.#composition.disconnect();\n }\n\n /**\n * Stimulus lifecycle callback when a new field target enters the DOM.\n * Ensures new additions are also wired with overwriting support.\n */\n fieldTargetConnected(element: HTMLInputElement): void {\n element.addEventListener(\"focus\", this.#onFieldFocus);\n this.#composition.observe(element);\n }\n\n /** Removes focus listeners when fields are dropped. */\n fieldTargetDisconnected(element: HTMLInputElement): void {\n element.removeEventListener(\"focus\", this.#onFieldFocus);\n this.#composition.unobserve(element);\n }\n\n /** Handles keystroke inputs and advances focus to the next field. */\n onInput(event: Event): void {\n const input = event.currentTarget as HTMLInputElement | null;\n if (!input) return;\n\n // Guard during active composition to prevent premature focus switching\n if (this.#composition.isComposing(event as InputEvent)) return;\n\n this.#handleInputValidation(input);\n }\n\n /** Handles Backspace retreating, arrows, and home/end navigation. */\n onKeydown(event: KeyboardEvent): void {\n const input = event.currentTarget as HTMLInputElement | null;\n if (!input) return;\n\n const index = this.fieldTargets.indexOf(input);\n if (index === -1) return;\n\n // Do not trigger keydown actions during composition\n if (this.#composition.isComposing(event)) return;\n\n switch (event.key) {\n case \"Backspace\":\n if (!input.value) {\n // Empty field: step backward, wipe previous digit, and focus it\n if (index > 0) {\n event.preventDefault();\n const prevField = this.fieldTargets[index - 1];\n if (prevField) {\n prevField.value = \"\";\n prevField.removeAttribute(\"data-filled\");\n prevField.focus();\n this.#clearError();\n this.#syncAndDispatch();\n }\n }\n } else {\n // Filled field: clear current value\n input.value = \"\";\n input.removeAttribute(\"data-filled\");\n this.#clearError();\n this.#syncAndDispatch();\n }\n break;\n\n case \"ArrowLeft\":\n if (index > 0) {\n event.preventDefault();\n this.fieldTargets[index - 1]?.focus();\n }\n break;\n\n case \"ArrowRight\":\n if (index < this.lengthValue - 1) {\n event.preventDefault();\n this.fieldTargets[index + 1]?.focus();\n }\n break;\n\n case \"Home\":\n event.preventDefault();\n this.fieldTargets[0]?.focus();\n break;\n\n case \"End\":\n event.preventDefault();\n this.fieldTargets[this.lengthValue - 1]?.focus();\n break;\n\n default:\n break;\n }\n }\n\n /** Divides pasted string characters across available input fields. */\n onPaste(event: ClipboardEvent): void {\n const input = event.currentTarget as HTMLInputElement | null;\n if (!input) return;\n\n const startIndex = this.fieldTargets.indexOf(input);\n if (startIndex === -1) return;\n\n event.preventDefault();\n\n const rawText = event.clipboardData?.getData(\"text\") || \"\";\n const text = this.#normalizeValue(rawText);\n const regex = new RegExp(`^${this.patternValue}$`);\n const validChars = Array.from(text).filter((char) => regex.test(char));\n\n if (validChars.length === 0) {\n this.#showError();\n return;\n }\n\n const limit = Math.min(validChars.length, this.lengthValue - startIndex);\n let lastFocusedIndex = startIndex;\n\n for (let i = 0; i < limit; i++) {\n const fieldIndex = startIndex + i;\n const field = this.fieldTargets[fieldIndex];\n const char = validChars[i];\n\n if (field && char) {\n field.value = char;\n field.setAttribute(\"data-filled\", \"true\");\n lastFocusedIndex = fieldIndex;\n }\n }\n\n this.#clearError();\n\n // Set trailing focus position to the last filled box (or next empty if one exists)\n const focusTargetIndex =\n lastFocusedIndex < this.lengthValue - 1 ? lastFocusedIndex + 1 : lastFocusedIndex;\n this.fieldTargets[focusTargetIndex]?.focus();\n\n this.#syncAndDispatch();\n }\n\n readonly #onFieldFocus = (event: FocusEvent): void => {\n const input = event.currentTarget as HTMLInputElement | null;\n if (input) {\n // Auto-selection enables effortless character overwrites\n input.select();\n }\n };\n\n #handleInputValidation(input: HTMLInputElement): void {\n const index = this.fieldTargets.indexOf(input);\n if (index === -1) return;\n\n const rawValue = input.value;\n const normalized = this.#normalizeValue(rawValue);\n const regex = new RegExp(`^${this.patternValue}$`);\n\n if (normalized && regex.test(normalized)) {\n input.value = normalized;\n input.setAttribute(\"data-filled\", \"true\");\n this.#clearError();\n\n // Step focus forward\n if (index < this.lengthValue - 1) {\n const nextField = this.fieldTargets[index + 1];\n nextField?.focus();\n }\n } else if (normalized) {\n input.value = \"\";\n input.removeAttribute(\"data-filled\");\n this.#showError();\n } else {\n input.removeAttribute(\"data-filled\");\n }\n\n this.#syncAndDispatch();\n }\n\n #normalizeValue(val: string): string {\n // Replaces full-width numbers (0-9) with standard half-width ones (0-9)\n return val.replace(/[0-9]/g, (s) => String.fromCharCode(s.charCodeAt(0) - 0xfee0));\n }\n\n #showError(): void {\n if (this.hasErrorTarget) {\n this.errorTarget.removeAttribute(\"hidden\");\n }\n // Behavior only: emit a neutral payload and let the consumer compose/localize\n // the user-facing message. The pattern is reported so consumers can word it.\n this.dispatch(\"invalid\", { detail: { pattern: this.patternValue } });\n }\n\n #clearError(): void {\n if (this.hasErrorTarget) {\n this.errorTarget.setAttribute(\"hidden\", \"true\");\n }\n }\n\n #syncAndDispatch(): void {\n const fields = this.fieldTargets;\n const combinedValue = fields.map((f) => f.value).join(\"\");\n\n if (this.hasValueTarget) {\n this.valueTarget.value = combinedValue;\n }\n\n this.dispatch(\"change\", { detail: { value: combinedValue } });\n\n // Completed state when all fields contain a digit\n const isCompleted =\n fields.every((f) => f.value.length > 0) && combinedValue.length === this.lengthValue;\n if (isCompleted) {\n this.dispatch(\"complete\", { detail: { value: combinedValue } });\n }\n }\n}\n"]}
@@ -22,9 +22,10 @@ import { Controller } from '@hotwired/stimulus';
22
22
  * </div>
23
23
  *
24
24
  * The viewport's scroll position and size are watched (via the wired `scroll`
25
- * action, plus {@link LayoutObserver} for resize and a {@link MutationObserver}
26
- * for content changes). Optional page buttons scroll one viewport at a time and
27
- * have their `disabled` synced to the matching direction's remaining room.
25
+ * action, plus {@link LayoutObserver} for viewport/content resize, a
26
+ * {@link MutationObserver}, and descendant load events). Optional page buttons
27
+ * scroll one logical viewport page at a time (including RTL) and have their
28
+ * disabled state synced to the matching direction's remaining room.
28
29
  *
29
30
  * @remarks
30
31
  * Behavior only — shadows, arrows, and gradients are the consumer's CSS;
@@ -53,7 +54,14 @@ declare class OverflowIndicatorController extends Controller<HTMLElement> {
53
54
  thresholdValue: number;
54
55
  connect(): void;
55
56
  disconnect(): void;
56
- /** Re-measures remaining scroll room and reflects the state hooks. Public so it can be wired to the viewport's `scroll`. */
57
+ viewportTargetConnected(): void;
58
+ viewportTargetDisconnected(viewport: HTMLElement): void;
59
+ orientationValueChanged(): void;
60
+ thresholdValueChanged(): void;
61
+ /**
62
+ * Re-measures remaining scroll room and reflects the state hooks.
63
+ * Public so it can be wired to the viewport's `scroll`.
64
+ */
57
65
  update(): void;
58
66
  /** Scrolls one viewport page toward the `direction` param (`start`/`end`). */
59
67
  scrollByPage(event: Event): void;
@@ -58,7 +58,30 @@ var LayoutObserver = class {
58
58
  }
59
59
  };
60
60
 
61
+ // src/utils/logical_scroll.ts
62
+ function isRtl(element) {
63
+ return window.getComputedStyle(element).direction === "rtl";
64
+ }
65
+ function logicalScrollMetrics(element, horizontal) {
66
+ const max = Math.max(
67
+ 0,
68
+ horizontal ? element.scrollWidth - element.clientWidth : element.scrollHeight - element.clientHeight
69
+ );
70
+ const raw = horizontal ? element.scrollLeft : element.scrollTop;
71
+ const position = horizontal && isRtl(element) ? -raw : raw;
72
+ return { position: Math.min(max, Math.max(0, position)), max };
73
+ }
74
+ function physicalScrollDelta(element, horizontal, logicalDelta) {
75
+ return horizontal && isRtl(element) ? -logicalDelta : logicalDelta;
76
+ }
77
+
78
+ // src/utils/reduced_motion.ts
79
+ function prefersReducedMotion() {
80
+ return typeof window.matchMedia === "function" && window.matchMedia("(prefers-reduced-motion: reduce)").matches;
81
+ }
82
+
61
83
  // src/controllers/overflow_indicator_controller.ts
84
+ var DIRECTION_BUTTON_SELECTOR = "[data-stimeo--overflow-indicator-direction-param]";
62
85
  var OverflowIndicatorController = class extends Controller {
63
86
  static targets = ["viewport"];
64
87
  static values = {
@@ -67,38 +90,50 @@ var OverflowIndicatorController = class extends Controller {
67
90
  };
68
91
  static actions = ["scrollByPage", "update"];
69
92
  static events = ["change"];
70
- #layout = new LayoutObserver(() => this.update());
93
+ #layout = new LayoutObserver(() => {
94
+ if (this.#connected) this.update();
95
+ });
96
+ #connected = false;
97
+ #observedViewport = null;
98
+ #observedContent = /* @__PURE__ */ new Set();
71
99
  #mutationObserver = null;
100
+ #pendingButtonDisables = /* @__PURE__ */ new Map();
72
101
  /** Last reported room, so `change` fires only on transitions. */
73
102
  #state = null;
74
103
  connect() {
75
- if (!this.hasViewportTarget) return;
76
- this.#layout.observe(this.viewportTarget);
77
- this.#layout.observeViewport();
78
- if (typeof MutationObserver !== "undefined") {
79
- this.#mutationObserver = new MutationObserver(() => this.update());
80
- this.#mutationObserver.observe(this.viewportTarget, {
81
- childList: true,
82
- subtree: true,
83
- characterData: true
84
- });
85
- }
86
- this.update();
104
+ this.#connected = true;
105
+ this.#syncViewport();
87
106
  }
88
107
  disconnect() {
108
+ this.#connected = false;
109
+ this.#stopObservingViewport();
89
110
  this.#layout.disconnect();
90
- this.#mutationObserver?.disconnect();
91
- this.#mutationObserver = null;
111
+ this.#clearPendingButtonDisables();
92
112
  this.#state = null;
93
113
  }
94
- /** Re-measures remaining scroll room and reflects the state hooks. Public so it can be wired to the viewport's `scroll`. */
114
+ viewportTargetConnected() {
115
+ this.#syncViewport();
116
+ }
117
+ viewportTargetDisconnected(viewport) {
118
+ if (this.#observedViewport === viewport) this.#stopObservingViewport();
119
+ this.#syncViewport();
120
+ }
121
+ orientationValueChanged() {
122
+ if (this.#connected) this.update();
123
+ }
124
+ thresholdValueChanged() {
125
+ if (this.#connected) this.update();
126
+ }
127
+ /**
128
+ * Re-measures remaining scroll room and reflects the state hooks.
129
+ * Public so it can be wired to the viewport's `scroll`.
130
+ */
95
131
  update() {
96
132
  if (!this.hasViewportTarget) return;
97
133
  const vp = this.viewportTarget;
98
134
  const horizontal = this.orientationValue !== "vertical";
99
- const t = this.thresholdValue;
100
- const scrollPos = horizontal ? vp.scrollLeft : vp.scrollTop;
101
- const maxScroll = horizontal ? vp.scrollWidth - vp.clientWidth : vp.scrollHeight - vp.clientHeight;
135
+ const t = this.#threshold;
136
+ const { position: scrollPos, max: maxScroll } = logicalScrollMetrics(vp, horizontal);
102
137
  const start = scrollPos > t;
103
138
  const end = scrollPos < maxScroll - t;
104
139
  vp.setAttribute("data-overflow-start", start ? "true" : "false");
@@ -114,11 +149,13 @@ var OverflowIndicatorController = class extends Controller {
114
149
  if (!this.hasViewportTarget) return;
115
150
  const direction = this.#directionFromEvent(event);
116
151
  if (!direction) return;
152
+ if (this.#state && !this.#state[direction]) return;
117
153
  const vp = this.viewportTarget;
118
154
  const horizontal = this.orientationValue !== "vertical";
119
155
  const page = horizontal ? vp.clientWidth : vp.clientHeight;
120
- const delta = direction === "start" ? -page : page;
121
- const behavior = this.#prefersReducedMotion() ? "auto" : "smooth";
156
+ const logicalDelta = direction === "start" ? -page : page;
157
+ const delta = physicalScrollDelta(vp, horizontal, logicalDelta);
158
+ const behavior = prefersReducedMotion() ? "auto" : "smooth";
122
159
  if (horizontal) {
123
160
  vp.scrollBy({ left: delta, behavior });
124
161
  } else {
@@ -127,10 +164,16 @@ var OverflowIndicatorController = class extends Controller {
127
164
  }
128
165
  /** Mirrors remaining room onto any direction buttons by toggling `disabled`. */
129
166
  #syncButtons(start, end) {
130
- const buttons = this.element.querySelectorAll(
131
- "[data-stimeo--overflow-indicator-direction-param]"
132
- );
167
+ for (const button of [...this.#pendingButtonDisables.keys()]) {
168
+ if (!button.isConnected || button.closest("[data-controller~='stimeo--overflow-indicator']") !== this.element) {
169
+ this.#cancelPendingButtonDisable(button);
170
+ }
171
+ }
172
+ const buttons = this.element.querySelectorAll(DIRECTION_BUTTON_SELECTOR);
133
173
  for (const button of buttons) {
174
+ if (button.closest("[data-controller~='stimeo--overflow-indicator']") !== this.element) {
175
+ continue;
176
+ }
134
177
  const direction = button.getAttribute("data-stimeo--overflow-indicator-direction-param");
135
178
  if (direction === "start") this.#toggleButton(button, start);
136
179
  else if (direction === "end") this.#toggleButton(button, end);
@@ -143,7 +186,11 @@ var OverflowIndicatorController = class extends Controller {
143
186
  * whole control disabled) is therefore never blindly re-enabled.
144
187
  */
145
188
  #toggleButton(button, hasRoom) {
189
+ if (!this.#pendingButtonDisables.has(button) && button.hasAttribute("data-overflow-indicator-pending-disabled")) {
190
+ this.#cancelPendingButtonDisable(button);
191
+ }
146
192
  if (hasRoom) {
193
+ this.#cancelPendingButtonDisable(button);
147
194
  if (button.hasAttribute("data-overflow-indicator-disabled")) {
148
195
  button.disabled = false;
149
196
  button.removeAttribute("data-overflow-indicator-disabled");
@@ -151,17 +198,121 @@ var OverflowIndicatorController = class extends Controller {
151
198
  return;
152
199
  }
153
200
  if (button.disabled) return;
201
+ if (document.activeElement === button) {
202
+ this.#deferButtonDisable(button);
203
+ } else {
204
+ this.#disableButton(button);
205
+ }
206
+ }
207
+ /**
208
+ * Keeps a boundary button focusable until native blur, exposing its temporary
209
+ * inoperability with `aria-disabled` and making its action a no-op meanwhile.
210
+ */
211
+ #deferButtonDisable(button) {
212
+ if (this.#pendingButtonDisables.has(button)) return;
213
+ button.setAttribute("data-overflow-indicator-pending-disabled", "");
214
+ button.setAttribute(
215
+ "data-overflow-indicator-aria-disabled",
216
+ button.getAttribute("aria-disabled") ?? ""
217
+ );
218
+ button.setAttribute("aria-disabled", "true");
219
+ const onBlur = () => {
220
+ this.#cancelPendingButtonDisable(button);
221
+ if (!button.disabled) this.#disableButton(button);
222
+ };
223
+ this.#pendingButtonDisables.set(button, { onBlur });
224
+ button.addEventListener("blur", onBlur);
225
+ }
226
+ #disableButton(button) {
154
227
  button.disabled = true;
155
228
  button.setAttribute("data-overflow-indicator-disabled", "");
156
229
  }
230
+ #cancelPendingButtonDisable(button) {
231
+ const pending = this.#pendingButtonDisables.get(button);
232
+ if (pending) button.removeEventListener("blur", pending.onBlur);
233
+ this.#pendingButtonDisables.delete(button);
234
+ button.removeAttribute("data-overflow-indicator-pending-disabled");
235
+ const displaced = button.getAttribute("data-overflow-indicator-aria-disabled");
236
+ if (displaced !== null) {
237
+ button.removeAttribute("data-overflow-indicator-aria-disabled");
238
+ if (button.getAttribute("aria-disabled") === "true") {
239
+ if (displaced === "") button.removeAttribute("aria-disabled");
240
+ else button.setAttribute("aria-disabled", displaced);
241
+ }
242
+ }
243
+ }
244
+ #clearPendingButtonDisables() {
245
+ for (const button of [...this.#pendingButtonDisables.keys()]) {
246
+ this.#cancelPendingButtonDisable(button);
247
+ }
248
+ }
249
+ /** Moves resize/mutation/load observation to the current viewport target. */
250
+ #syncViewport() {
251
+ if (!this.#connected) return;
252
+ const next = this.hasViewportTarget ? this.viewportTarget : null;
253
+ if (next === this.#observedViewport) return;
254
+ this.#stopObservingViewport();
255
+ if (!next) return;
256
+ this.#observedViewport = next;
257
+ this.#layout.observe(next);
258
+ this.#layout.observeViewport();
259
+ next.addEventListener("load", this.#onContentLoad, true);
260
+ this.#syncContentObservation();
261
+ if (typeof MutationObserver !== "undefined") {
262
+ this.#mutationObserver = new MutationObserver(() => {
263
+ if (!this.#connected || this.#observedViewport !== next) return;
264
+ this.#syncContentObservation();
265
+ this.update();
266
+ });
267
+ this.#mutationObserver.observe(this.element, {
268
+ childList: true,
269
+ subtree: true,
270
+ characterData: true,
271
+ attributes: true,
272
+ attributeFilter: ["class", "style", "hidden"]
273
+ });
274
+ }
275
+ this.#state = null;
276
+ this.update();
277
+ }
278
+ /** Observes direct content boxes whose resize can change the viewport's scroll extent. */
279
+ #syncContentObservation() {
280
+ const next = new Set(this.#observedViewport?.children ?? []);
281
+ for (const content of this.#observedContent) {
282
+ if (!next.has(content)) {
283
+ this.#layout.unobserve(content);
284
+ this.#observedContent.delete(content);
285
+ }
286
+ }
287
+ for (const content of next) {
288
+ if (!this.#observedContent.has(content)) {
289
+ this.#observedContent.add(content);
290
+ this.#layout.observe(content);
291
+ }
292
+ }
293
+ }
294
+ #stopObservingViewport() {
295
+ this.#mutationObserver?.disconnect();
296
+ this.#mutationObserver = null;
297
+ this.#observedViewport?.removeEventListener("load", this.#onContentLoad, true);
298
+ if (this.#observedViewport) this.#layout.unobserve(this.#observedViewport);
299
+ for (const content of this.#observedContent) this.#layout.unobserve(content);
300
+ this.#observedContent.clear();
301
+ this.#observedViewport = null;
302
+ this.#layout.unobserveViewport();
303
+ }
304
+ #onContentLoad = () => {
305
+ if (this.#connected) this.update();
306
+ };
307
+ get #threshold() {
308
+ const value = this.thresholdValue;
309
+ return Number.isFinite(value) ? Math.max(0, value) : 1;
310
+ }
157
311
  #directionFromEvent(event) {
158
312
  const params = event.params;
159
313
  const direction = params?.direction;
160
314
  return direction === "start" || direction === "end" ? direction : null;
161
315
  }
162
- #prefersReducedMotion() {
163
- return typeof window.matchMedia === "function" && window.matchMedia("(prefers-reduced-motion: reduce)").matches;
164
- }
165
316
  };
166
317
 
167
318
  export { OverflowIndicatorController };