@patternfly/pfe-core 2.4.1 → 4.0.0

package/controllers/roving-tabindex-controller.d.ts

@@ -1,55 +1,24 @@
-import type { ReactiveController, ReactiveControllerHost } from 'lit';
+import { type ReactiveControllerHost } from 'lit';
+import { ATFocusController, type ATFocusControllerOptions } from './at-focus-controller.js';
+export type RovingTabindexControllerOptions<Item extends HTMLElement> = ATFocusControllerOptions<Item>;
 /**
  * Implements roving tabindex, as described in WAI-ARIA practices, [Managing Focus Within
- * Components Using a Roving
- * tabindex](https://www.w3.org/WAI/ARIA/apg/practices/keyboard-interface/#kbd_roving_tabindex)
+ * Components Using a Roving tabindex][rti]
+ *
+ * [rti]: https://www.w3.org/WAI/ARIA/apg/practices/keyboard-interface/#kbd_roving_tabindex
  */
-export declare class RovingTabindexController<ItemType extends HTMLElement = HTMLElement> implements ReactiveController {
+export declare class RovingTabindexController<Item extends HTMLElement = HTMLElement> extends ATFocusController<Item> {
     #private;
-    host: ReactiveControllerHost & HTMLElement;
-    /**
-     * active item of array of items
-     */
-    get activeItem(): ItemType | undefined;
-    /**
-     * first item in array of focusable items
-     */
-    get firstItem(): ItemType | undefined;
-    /**
-     * last item in array of focusable items
-     */
-    get lastItem(): ItemType | undefined;
-    /**
-     * next item  after active item in array of focusable items
-     */
-    get nextItem(): ItemType | undefined;
-    /**
-     * previous item  after active item in array of focusable items
-     */
-    get prevItem(): ItemType | undefined;
-    constructor(host: ReactiveControllerHost & HTMLElement);
-    /**
-     * sets tabindex of item based on whether or not it is active
-     */
-    updateActiveItem(item?: ItemType): void;
-    /**
-     * focuses on an item and sets it as active
-     */
-    focusOnItem(item?: ItemType): void;
-    /**
-     * Focuses next focusable item
-     */
-    updateItems(items: ItemType[]): void;
-    /**
-     * from array of HTML items, and sets active items
-     */
-    initItems(items: ItemType[], itemsContainer?: HTMLElement): void;
-    /**
-     * adds event listeners to items container
-     */
-    hostConnected(): void;
-    /**
-     * removes event listeners from items container
-     */
-    hostDisconnected(): void;
+    host: ReactiveControllerHost;
+    static of<Item extends HTMLElement>(host: ReactiveControllerHost, options: RovingTabindexControllerOptions<Item>): RovingTabindexController<Item>;
+    get atFocusedItemIndex(): number;
+    /**
+     * Sets the DOM Focus on the item with assistive technology focus
+     * @param item item
+     */
+    set atFocusedItemIndex(index: number);
+    get items(): Item[];
+    set items(items: Item[]);
+    private constructor();
+    protected onKeydown(event: KeyboardEvent): void;
 }

package/controllers/roving-tabindex-controller.js

@@ -1,201 +1,82 @@
-const isFocusableElement = (el) => !!el &&
-    !el.hasAttribute('disabled') &&
-    !el.ariaHidden &&
-    !el.hasAttribute('hidden');
+var _RovingTabindexController_logger, _RovingTabindexController_gainedInitialFocus, _RovingTabindexController_itemsSet;
+import { __classPrivateFieldGet, __classPrivateFieldSet, __decorate } from "tslib";
+import { isServer } from 'lit';
+import { ATFocusController } from './at-focus-controller.js';
+import { Logger } from './logger.js';
+import { bound } from '../decorators/bound.js';
 /**
  * Implements roving tabindex, as described in WAI-ARIA practices, [Managing Focus Within
- * Components Using a Roving
- * tabindex](https://www.w3.org/WAI/ARIA/apg/practices/keyboard-interface/#kbd_roving_tabindex)
+ * Components Using a Roving tabindex][rti]
+ *
+ * [rti]: https://www.w3.org/WAI/ARIA/apg/practices/keyboard-interface/#kbd_roving_tabindex
  */
-export class RovingTabindexController {
-    /** active focusable element */
-    #activeItem;
-    /** closest ancestor containing items */
-    #itemsContainer;
-    /** array of all focusable elements */
-    #items = [];
-    /**
-     * finds focusable items from a group of items
-     */
-    get #focusableItems() {
-        return this.#items.filter(isFocusableElement);
-    }
-    /**
-     * index of active item in array of focusable items
-     */
-    get #activeIndex() {
-        return !!this.#focusableItems && !!this.activeItem ? this.#focusableItems.indexOf(this.activeItem) : -1;
-    }
-    /**
-     * index of active item in array of items
-     */
-    get #itemIndex() {
-        return this.activeItem ? this.#items.indexOf(this.activeItem) : -1;
+export class RovingTabindexController extends ATFocusController {
+    static of(host, options) {
+        return new RovingTabindexController(host, options);
     }
-    /**
-     * active item of array of items
-     */
-    get activeItem() {
-        return this.#activeItem;
+    get atFocusedItemIndex() {
+        return super.atFocusedItemIndex;
     }
     /**
-     * first item in array of focusable items
+     * Sets the DOM Focus on the item with assistive technology focus
+     * @param item item
      */
-    get firstItem() {
-        return this.#focusableItems[0];
-    }
-    /**
-     * last item in array of focusable items
-     */
-    get lastItem() {
-        return this.#focusableItems.at(-1);
+    set atFocusedItemIndex(index) {
+        super.atFocusedItemIndex = index;
+        const item = this.items.at(this.atFocusedItemIndex);
+        for (const i of this.items) {
+            i.tabIndex = item === i ? 0 : -1;
+        }
+        if (__classPrivateFieldGet(this, _RovingTabindexController_gainedInitialFocus, "f")) {
+            item?.focus();
+        }
+        this.host.requestUpdate();
     }
-    /**
-     * next item  after active item in array of focusable items
-     */
-    get nextItem() {
-        return (this.#activeIndex >= this.#focusableItems.length - 1 ? this.firstItem
-            : this.#focusableItems[this.#activeIndex + 1]);
+    get items() {
+        return this._items;
     }
-    /**
-     * previous item  after active item in array of focusable items
-     */
-    get prevItem() {
-        return (this.#activeIndex > 0 ? this.#focusableItems[this.#activeIndex - 1]
-            : this.lastItem);
+    set items(items) {
+        this._items = items;
+        __classPrivateFieldSet(this, _RovingTabindexController_itemsSet, new Set(items), "f");
+        const pivot = Math.max(0, this.atFocusedItemIndex);
+        const [firstFocusable] = this.atFocusableItems;
+        const firstFocusableIndex = firstFocusable ? items.indexOf(firstFocusable) : -1;
+        const pivotFocusableIndex = items.indexOf(this.items
+            .slice(pivot)
+            .concat(this.items.slice(0, pivot))
+            .find(item => this.atFocusableItems.includes(item)));
+        this.atFocusedItemIndex = Math.max(firstFocusableIndex, pivotFocusableIndex);
+        this.host.requestUpdate();
     }
-    constructor(host) {
+    constructor(host, options) {
+        super(host, options);
         this.host = host;
-        this.host.addController(this);
-    }
-    /**
-     * handles keyboard navigation
-     */
-    #onKeydown = (event) => {
-        if (event.ctrlKey ||
-            event.altKey ||
-            event.metaKey ||
-            !this.#focusableItems.length ||
-            !event.composedPath().some(x => this.#focusableItems.includes(x))) {
-            return;
-        }
-        const item = this.activeItem;
-        let shouldPreventDefault = false;
-        const horizontalOnly = !item ? false
-            : item.tagName === 'SELECT' ||
-                item.getAttribute('role') === 'spinbutton';
-        switch (event.key) {
-            case 'ArrowLeft':
-                this.focusOnItem(this.prevItem);
-                shouldPreventDefault = true;
-                break;
-            case 'ArrowRight':
-                this.focusOnItem(this.nextItem);
-                shouldPreventDefault = true;
-                break;
-            case 'ArrowUp':
-                if (horizontalOnly) {
-                    return;
-                }
-                this.focusOnItem(this.prevItem);
-                shouldPreventDefault = true;
-                break;
-            case 'ArrowDown':
-                if (horizontalOnly) {
-                    return;
-                }
-                this.focusOnItem(this.nextItem);
-                shouldPreventDefault = true;
-                break;
-            case 'Home':
-                this.focusOnItem(this.firstItem);
-                shouldPreventDefault = true;
-                break;
-            case 'PageUp':
-                if (horizontalOnly) {
-                    return;
-                }
-                this.focusOnItem(this.firstItem);
-                shouldPreventDefault = true;
-                break;
-            case 'End':
-                this.focusOnItem(this.lastItem);
-                shouldPreventDefault = true;
-                break;
-            case 'PageDown':
-                if (horizontalOnly) {
-                    return;
-                }
-                this.focusOnItem(this.lastItem);
-                shouldPreventDefault = true;
-                break;
-            default:
-                break;
-        }
-        if (shouldPreventDefault) {
-            event.stopPropagation();
-            event.preventDefault();
-        }
-    };
-    /**
-     * sets tabindex of item based on whether or not it is active
-     */
-    updateActiveItem(item) {
-        if (item) {
-            if (!!this.#activeItem && item !== this.#activeItem) {
-                this.#activeItem.tabIndex = -1;
+        _RovingTabindexController_logger.set(this, new Logger(this.host));
+        _RovingTabindexController_gainedInitialFocus.set(this, false);
+        _RovingTabindexController_itemsSet.set(this, new Set());
+        this.initItems();
+        const container = options.getItemsContainer?.() ?? this.host;
+        if (!isServer) {
+            if (container instanceof HTMLElement) {
+                container.addEventListener('focusin', () => __classPrivateFieldSet(this, _RovingTabindexController_gainedInitialFocus, true, "f"), { once: true });
+            }
+            else {
+                __classPrivateFieldGet(this, _RovingTabindexController_logger, "f").warn('RovingTabindexController requires a getItemsContainer function');
             }
-            item.tabIndex = 0;
-            this.#activeItem = item;
         }
     }
-    /**
-     * focuses on an item and sets it as active
-     */
-    focusOnItem(item) {
-        this.updateActiveItem(item || this.firstItem);
-        this.#activeItem?.focus();
-        this.host.requestUpdate();
-    }
-    /**
-     * Focuses next focusable item
-     */
-    updateItems(items) {
-        const sequence = [...items.slice(this.#itemIndex), ...items.slice(0, this.#itemIndex)];
-        const first = sequence.find(item => this.#focusableItems.includes(item));
-        this.focusOnItem(first || this.firstItem);
-    }
-    /**
-     * from array of HTML items, and sets active items
-     */
-    initItems(items, itemsContainer = this.host) {
-        this.#items = items ?? [];
-        const focusableItems = this.#focusableItems;
-        const [focusableItem] = focusableItems;
-        this.#activeItem = focusableItem;
-        for (const item of focusableItems) {
-            item.tabIndex = this.#activeItem === item ? 0 : -1;
-        }
-        /**
-         * removes listener on previous contained and applies it to new container
-         */
-        if (!this.#itemsContainer || itemsContainer !== this.#itemsContainer) {
-            this.#itemsContainer?.removeEventListener('keydown', this.#onKeydown);
-            this.#itemsContainer = itemsContainer;
-            this.hostConnected();
+    onKeydown(event) {
+        if (!event.ctrlKey
+            && !event.altKey
+            && !event.metaKey
+            && !!this.atFocusableItems.length
+            && !!event.composedPath().some(node => __classPrivateFieldGet(this, _RovingTabindexController_itemsSet, "f").has(node))) {
+            super.onKeydown(event);
         }
     }
-    /**
-     * adds event listeners to items container
-     */
-    hostConnected() {
-        this.#itemsContainer?.addEventListener('keydown', this.#onKeydown);
-    }
-    /**
-     * removes event listeners from items container
-     */
-    hostDisconnected() {
-        this.#itemsContainer?.removeEventListener('keydown', this.#onKeydown);
-    }
 }
+_RovingTabindexController_logger = new WeakMap(), _RovingTabindexController_gainedInitialFocus = new WeakMap(), _RovingTabindexController_itemsSet = new WeakMap();
+__decorate([
+    bound
+], RovingTabindexController.prototype, "onKeydown", null);
 //# sourceMappingURL=roving-tabindex-controller.js.map

package/controllers/roving-tabindex-controller.js.map

@@ -1 +1 @@
-{"version":3,"file":"roving-tabindex-controller.js","sourceRoot":"","sources":["roving-tabindex-controller.ts"],"names":[],"mappings":"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","sourcesContent":["import type { ReactiveController, ReactiveControllerHost } from 'lit';\n\nconst isFocusableElement = (el: Element): el is HTMLElement =>\n  !!el &&\n  !el.hasAttribute('disabled') &&\n  !el.ariaHidden &&\n  !el.hasAttribute('hidden');\n\n/**\n * Implements roving tabindex, as described in WAI-ARIA practices, [Managing Focus Within\n * Components Using a Roving\n * tabindex](https://www.w3.org/WAI/ARIA/apg/practices/keyboard-interface/#kbd_roving_tabindex)\n */\nexport class RovingTabindexController<\n  ItemType extends HTMLElement = HTMLElement,\n> implements ReactiveController {\n  /** active focusable element */\n  #activeItem?: ItemType;\n\n  /** closest ancestor containing items */\n  #itemsContainer?: HTMLElement;\n\n  /** array of all focusable elements */\n  #items: ItemType[] = [];\n\n  /**\n   * finds focusable items from a group of items\n   */\n  get #focusableItems(): ItemType[] {\n    return this.#items.filter(isFocusableElement);\n  }\n\n  /**\n   * index of active item in array of focusable items\n   */\n  get #activeIndex(): number {\n    return !!this.#focusableItems && !!this.activeItem ? this.#focusableItems.indexOf(this.activeItem) : -1;\n  }\n\n  /**\n   * index of active item in array of items\n   */\n  get #itemIndex(): number {\n    return this.activeItem ? this.#items.indexOf(this.activeItem) : -1;\n  }\n\n  /**\n   * active item of array of items\n   */\n  get activeItem(): ItemType | undefined {\n    return this.#activeItem;\n  }\n\n  /**\n   * first item in array of focusable items\n   */\n  get firstItem(): ItemType | undefined {\n    return this.#focusableItems[0];\n  }\n\n  /**\n   * last item in array of focusable items\n   */\n  get lastItem(): ItemType | undefined {\n    return this.#focusableItems.at(-1);\n  }\n\n  /**\n   * next item  after active item in array of focusable items\n   */\n  get nextItem(): ItemType | undefined {\n    return (\n        this.#activeIndex >= this.#focusableItems.length - 1 ? this.firstItem\n      : this.#focusableItems[this.#activeIndex + 1]\n    );\n  }\n\n  /**\n   * previous item  after active item in array of focusable items\n   */\n  get prevItem(): ItemType | undefined {\n    return (\n        this.#activeIndex > 0 ? this.#focusableItems[this.#activeIndex - 1]\n      : this.lastItem\n    );\n  }\n\n  constructor(public host: ReactiveControllerHost & HTMLElement) {\n    this.host.addController(this);\n  }\n\n  /**\n   * handles keyboard navigation\n   */\n  #onKeydown = (event: KeyboardEvent) => {\n    if (event.ctrlKey ||\n        event.altKey ||\n        event.metaKey ||\n        !this.#focusableItems.length ||\n        !event.composedPath().some(x =>\n          this.#focusableItems.includes(x as ItemType))) {\n      return;\n    }\n    const item = this.activeItem;\n    let shouldPreventDefault = false;\n    const horizontalOnly =\n        !item ? false\n      : item.tagName === 'SELECT' ||\n        item.getAttribute('role') === 'spinbutton';\n\n\n    switch (event.key) {\n      case 'ArrowLeft':\n        this.focusOnItem(this.prevItem);\n        shouldPreventDefault = true;\n        break;\n      case 'ArrowRight':\n        this.focusOnItem(this.nextItem);\n        shouldPreventDefault = true;\n        break;\n      case 'ArrowUp':\n        if (horizontalOnly) {\n          return;\n        }\n        this.focusOnItem(this.prevItem);\n        shouldPreventDefault = true;\n        break;\n      case 'ArrowDown':\n        if (horizontalOnly) {\n          return;\n        }\n        this.focusOnItem(this.nextItem);\n        shouldPreventDefault = true;\n        break;\n      case 'Home':\n        this.focusOnItem(this.firstItem);\n        shouldPreventDefault = true;\n        break;\n      case 'PageUp':\n        if (horizontalOnly) {\n          return;\n        }\n        this.focusOnItem(this.firstItem);\n        shouldPreventDefault = true;\n        break;\n      case 'End':\n        this.focusOnItem(this.lastItem);\n        shouldPreventDefault = true;\n        break;\n      case 'PageDown':\n        if (horizontalOnly) {\n          return;\n        }\n        this.focusOnItem(this.lastItem);\n        shouldPreventDefault = true;\n        break;\n      default:\n        break;\n    }\n\n    if (shouldPreventDefault) {\n      event.stopPropagation();\n      event.preventDefault();\n    }\n  };\n\n  /**\n   * sets tabindex of item based on whether or not it is active\n   */\n  updateActiveItem(item?: ItemType): void {\n    if (item) {\n      if (!!this.#activeItem && item !== this.#activeItem) {\n        this.#activeItem.tabIndex = -1;\n      }\n      item.tabIndex = 0;\n      this.#activeItem = item;\n    }\n  }\n\n  /**\n   * focuses on an item and sets it as active\n   */\n  focusOnItem(item?: ItemType): void {\n    this.updateActiveItem(item || this.firstItem);\n    this.#activeItem?.focus();\n    this.host.requestUpdate();\n  }\n\n  /**\n   * Focuses next focusable item\n   */\n  updateItems(items: ItemType[]) {\n    const sequence = [...items.slice(this.#itemIndex), ...items.slice(0, this.#itemIndex)];\n    const first = sequence.find(item => this.#focusableItems.includes(item));\n    this.focusOnItem(first || this.firstItem);\n  }\n\n  /**\n   * from array of HTML items, and sets active items\n   */\n  initItems(items: ItemType[], itemsContainer: HTMLElement = this.host) {\n    this.#items = items ?? [];\n    const focusableItems = this.#focusableItems;\n    const [focusableItem] = focusableItems;\n    this.#activeItem = focusableItem;\n    for (const item of focusableItems) {\n      item.tabIndex = this.#activeItem === item ? 0 : -1;\n    }\n    /**\n     * removes listener on previous contained and applies it to new container\n     */\n    if (!this.#itemsContainer || itemsContainer !== this.#itemsContainer) {\n      this.#itemsContainer?.removeEventListener('keydown', this.#onKeydown);\n      this.#itemsContainer = itemsContainer;\n      this.hostConnected();\n    }\n  }\n\n  /**\n   * adds event listeners to items container\n   */\n  hostConnected() {\n    this.#itemsContainer?.addEventListener('keydown', this.#onKeydown);\n  }\n\n  /**\n   * removes event listeners from items container\n   */\n  hostDisconnected() {\n    this.#itemsContainer?.removeEventListener('keydown', this.#onKeydown);\n  }\n}\n"]}
+{"version":3,"file":"roving-tabindex-controller.js","sourceRoot":"","sources":["roving-tabindex-controller.ts"],"names":[],"mappings":"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","sourcesContent":["import { isServer, type ReactiveControllerHost } from 'lit';\nimport { ATFocusController, type ATFocusControllerOptions } from './at-focus-controller.js';\nimport { Logger } from './logger.js';\nimport { bound } from '../decorators/bound.js';\n\nexport type RovingTabindexControllerOptions<Item extends HTMLElement> =\n  ATFocusControllerOptions<Item>;\n\n/**\n * Implements roving tabindex, as described in WAI-ARIA practices, [Managing Focus Within\n * Components Using a Roving tabindex][rti]\n *\n * [rti]: https://www.w3.org/WAI/ARIA/apg/practices/keyboard-interface/#kbd_roving_tabindex\n */\nexport class RovingTabindexController<\n  Item extends HTMLElement = HTMLElement\n> extends ATFocusController<Item> {\n  static of<Item extends HTMLElement>(\n    host: ReactiveControllerHost,\n    options: RovingTabindexControllerOptions<Item>,\n  ): RovingTabindexController<Item> {\n    return new RovingTabindexController(host, options);\n  }\n\n  #logger = new Logger(this.host);\n\n  #gainedInitialFocus = false;\n\n  #itemsSet = new Set<Item>();\n\n  get atFocusedItemIndex(): number {\n    return super.atFocusedItemIndex;\n  }\n\n  /**\n   * Sets the DOM Focus on the item with assistive technology focus\n   * @param item item\n   */\n  set atFocusedItemIndex(index: number) {\n    super.atFocusedItemIndex = index;\n    const item = this.items.at(this.atFocusedItemIndex);\n    for (const i of this.items) {\n      i.tabIndex = item === i ? 0 : -1;\n    }\n    if (this.#gainedInitialFocus) {\n      item?.focus();\n    }\n    this.host.requestUpdate();\n  }\n\n  get items() {\n    return this._items;\n  }\n\n  public set items(items: Item[]) {\n    this._items = items;\n    this.#itemsSet = new Set(items);\n    const pivot = Math.max(0, this.atFocusedItemIndex);\n    const [firstFocusable] = this.atFocusableItems;\n    const firstFocusableIndex = firstFocusable ? items.indexOf(firstFocusable) : -1;\n    const pivotFocusableIndex = items.indexOf(this.items\n        .slice(pivot)\n        .concat(this.items.slice(0, pivot))\n        .find(item => this.atFocusableItems.includes(item))!);\n    this.atFocusedItemIndex = Math.max(firstFocusableIndex, pivotFocusableIndex);\n    this.host.requestUpdate();\n  }\n\n  private constructor(\n    public host: ReactiveControllerHost,\n    options: RovingTabindexControllerOptions<Item>,\n  ) {\n    super(host, options);\n    this.initItems();\n    const container = options.getItemsContainer?.() ?? this.host;\n    if (!isServer) {\n      if (container instanceof HTMLElement) {\n        container.addEventListener('focusin', () =>\n          this.#gainedInitialFocus = true, { once: true });\n      } else {\n        this.#logger.warn('RovingTabindexController requires a getItemsContainer function');\n      }\n    }\n  }\n\n  @bound\n  protected override onKeydown(event: KeyboardEvent): void {\n    if (!event.ctrlKey\n        && !event.altKey\n        && !event.metaKey\n        && !!this.atFocusableItems.length\n        && !!event.composedPath().some(node => this.#itemsSet.has(node as Item))) {\n      super.onKeydown(event);\n    }\n  }\n}\n"]}

package/controllers/scroll-spy-controller.d.ts

@@ -32,6 +32,9 @@ export declare class ScrollSpyController implements ReactiveController {
     set threshold(v: number | number[]);
     constructor(host: ReactiveControllerHost & HTMLElement, options: ScrollSpyControllerOptions);
     hostConnected(): void;
-    /** Explicitly set the active item */
+    /**
+     * Explicitly set the active item
+     * @param link usually an `<a>`
+     */
     setActive(link: EventTarget | null): Promise<void>;
 }

package/controllers/scroll-spy-controller.js

@@ -1,122 +1,123 @@
+var _ScrollSpyController_instances, _ScrollSpyController_tagNames, _ScrollSpyController_activeAttribute, _ScrollSpyController_io, _ScrollSpyController_passedLinks, _ScrollSpyController_force, _ScrollSpyController_intersected, _ScrollSpyController_root, _ScrollSpyController_rootMargin, _ScrollSpyController_threshold, _ScrollSpyController_getRootNode, _ScrollSpyController_getHash, _ScrollSpyController_linkChildren_get, _ScrollSpyController_initIo, _ScrollSpyController_markPassed, _ScrollSpyController_setActive, _ScrollSpyController_nextIntersection, _ScrollSpyController_onIo;
+import { __classPrivateFieldGet, __classPrivateFieldSet } from "tslib";
 export class ScrollSpyController {
-    #tagNames;
-    #activeAttribute;
-    #io;
-    /** Which link's targets have already scrolled past? */
-    #passedLinks = new Set();
-    /** Ignore intersections? */
-    #force = false;
-    /** Has the intersection observer found an element? */
-    #intersected = false;
-    #root;
-    #rootMargin;
-    #threshold;
-    #rootNode;
-    #getHash;
-    get #linkChildren() {
-        return Array.from(this.host.querySelectorAll(this.#tagNames.join(',')))
-            .filter(this.#getHash);
-    }
     get root() {
-        return this.#root;
+        return __classPrivateFieldGet(this, _ScrollSpyController_root, "f");
     }
     set root(v) {
-        this.#root = v;
-        this.#io?.disconnect();
-        this.#initIo();
+        __classPrivateFieldSet(this, _ScrollSpyController_root, v, "f");
+        __classPrivateFieldGet(this, _ScrollSpyController_io, "f")?.disconnect();
+        __classPrivateFieldGet(this, _ScrollSpyController_instances, "m", _ScrollSpyController_initIo).call(this);
     }
     get rootMargin() {
-        return this.#rootMargin;
+        return __classPrivateFieldGet(this, _ScrollSpyController_rootMargin, "f");
     }
     set rootMargin(v) {
-        this.#rootMargin = v;
-        this.#io?.disconnect();
-        this.#initIo();
+        __classPrivateFieldSet(this, _ScrollSpyController_rootMargin, v, "f");
+        __classPrivateFieldGet(this, _ScrollSpyController_io, "f")?.disconnect();
+        __classPrivateFieldGet(this, _ScrollSpyController_instances, "m", _ScrollSpyController_initIo).call(this);
     }
     get threshold() {
-        return this.#threshold;
+        return __classPrivateFieldGet(this, _ScrollSpyController_threshold, "f");
     }
     set threshold(v) {
-        this.#threshold = v;
-        this.#io?.disconnect();
-        this.#initIo();
+        __classPrivateFieldSet(this, _ScrollSpyController_threshold, v, "f");
+        __classPrivateFieldGet(this, _ScrollSpyController_io, "f")?.disconnect();
+        __classPrivateFieldGet(this, _ScrollSpyController_instances, "m", _ScrollSpyController_initIo).call(this);
     }
     constructor(host, options) {
+        _ScrollSpyController_instances.add(this);
         this.host = host;
+        _ScrollSpyController_tagNames.set(this, void 0);
+        _ScrollSpyController_activeAttribute.set(this, void 0);
+        _ScrollSpyController_io.set(this, void 0);
+        /** Which link's targets have already scrolled past? */
+        _ScrollSpyController_passedLinks.set(this, new Set());
+        /** Ignore intersections? */
+        _ScrollSpyController_force.set(this, false);
+        /** Has the intersection observer found an element? */
+        _ScrollSpyController_intersected.set(this, false);
+        _ScrollSpyController_root.set(this, void 0);
+        _ScrollSpyController_rootMargin.set(this, void 0);
+        _ScrollSpyController_threshold.set(this, void 0);
+        _ScrollSpyController_getRootNode.set(this, void 0);
+        _ScrollSpyController_getHash.set(this, void 0);
         host.addController(this);
-        this.#tagNames = options.tagNames;
-        this.#root = options.root;
-        this.#rootMargin = options.rootMargin;
-        this.#activeAttribute = options.activeAttribute ?? 'active';
-        this.#threshold = options.threshold ?? 0.85;
-        this.#rootNode = options.rootNode ?? host.getRootNode();
-        this.#getHash = options?.getHash ?? ((el) => el.getAttribute('href'));
+        __classPrivateFieldSet(this, _ScrollSpyController_tagNames, options.tagNames, "f");
+        __classPrivateFieldSet(this, _ScrollSpyController_root, options.root, "f");
+        __classPrivateFieldSet(this, _ScrollSpyController_rootMargin, options.rootMargin, "f");
+        __classPrivateFieldSet(this, _ScrollSpyController_activeAttribute, options.activeAttribute ?? 'active', "f");
+        __classPrivateFieldSet(this, _ScrollSpyController_threshold, options.threshold ?? 0.85, "f");
+        __classPrivateFieldSet(this, _ScrollSpyController_getRootNode, () => options.rootNode ?? host.getRootNode(), "f");
+        __classPrivateFieldSet(this, _ScrollSpyController_getHash, options?.getHash ?? ((el) => el.getAttribute('href')), "f");
     }
     hostConnected() {
-        this.#initIo();
+        __classPrivateFieldGet(this, _ScrollSpyController_instances, "m", _ScrollSpyController_initIo).call(this);
     }
-    #initIo() {
-        const rootNode = this.#rootNode;
-        if (rootNode instanceof Document || rootNode instanceof ShadowRoot) {
-            const { rootMargin, threshold, root } = this;
-            this.#io = new IntersectionObserver(r => this.#onIo(r), { root, rootMargin, threshold });
-            this.#linkChildren
-                .map(x => this.#getHash(x))
-                .filter((x) => !!x)
-                .map(x => rootNode.getElementById(x.replace('#', '')))
-                .filter((x) => !!x)
-                .forEach(target => this.#io?.observe(target));
+    /**
+     * Explicitly set the active item
+     * @param link usually an `<a>`
+     */
+    async setActive(link) {
+        __classPrivateFieldSet(this, _ScrollSpyController_force, true, "f");
+        __classPrivateFieldGet(this, _ScrollSpyController_instances, "m", _ScrollSpyController_setActive).call(this, link);
+        let sawActive = false;
+        for (const child of __classPrivateFieldGet(this, _ScrollSpyController_instances, "a", _ScrollSpyController_linkChildren_get)) {
+            __classPrivateFieldGet(this, _ScrollSpyController_instances, "m", _ScrollSpyController_markPassed).call(this, child, !sawActive);
+            if (child === link) {
+                sawActive = true;
+            }
         }
+        await __classPrivateFieldGet(this, _ScrollSpyController_instances, "m", _ScrollSpyController_nextIntersection).call(this);
+        __classPrivateFieldSet(this, _ScrollSpyController_force, false, "f");
     }
-    #markPassed(link, force) {
-        if (force) {
-            this.#passedLinks.add(link);
-        }
-        else {
-            this.#passedLinks.delete(link);
-        }
+}
+_ScrollSpyController_tagNames = new WeakMap(), _ScrollSpyController_activeAttribute = new WeakMap(), _ScrollSpyController_io = new WeakMap(), _ScrollSpyController_passedLinks = new WeakMap(), _ScrollSpyController_force = new WeakMap(), _ScrollSpyController_intersected = new WeakMap(), _ScrollSpyController_root = new WeakMap(), _ScrollSpyController_rootMargin = new WeakMap(), _ScrollSpyController_threshold = new WeakMap(), _ScrollSpyController_getRootNode = new WeakMap(), _ScrollSpyController_getHash = new WeakMap(), _ScrollSpyController_instances = new WeakSet(), _ScrollSpyController_linkChildren_get = function _ScrollSpyController_linkChildren_get() {
+    return Array.from(this.host.querySelectorAll(__classPrivateFieldGet(this, _ScrollSpyController_tagNames, "f").join(',')))
+        .filter(__classPrivateFieldGet(this, _ScrollSpyController_getHash, "f"));
+}, _ScrollSpyController_initIo = function _ScrollSpyController_initIo() {
+    const rootNode = __classPrivateFieldGet(this, _ScrollSpyController_getRootNode, "f").call(this);
+    if (rootNode instanceof Document || rootNode instanceof ShadowRoot) {
+        const { rootMargin, threshold, root } = this;
+        __classPrivateFieldSet(this, _ScrollSpyController_io, new IntersectionObserver(r => __classPrivateFieldGet(this, _ScrollSpyController_instances, "m", _ScrollSpyController_onIo).call(this, r), { root, rootMargin, threshold }), "f");
+        __classPrivateFieldGet(this, _ScrollSpyController_instances, "a", _ScrollSpyController_linkChildren_get)
+            .map(x => __classPrivateFieldGet(this, _ScrollSpyController_getHash, "f").call(this, x))
+            .filter((x) => !!x)
+            .map(x => rootNode.getElementById(x.replace('#', '')))
+            .filter((x) => !!x)
+            .forEach(target => __classPrivateFieldGet(this, _ScrollSpyController_io, "f")?.observe(target));
     }
-    #setActive(link) {
-        for (const child of this.#linkChildren) {
-            child.toggleAttribute(this.#activeAttribute, child === link);
-        }
+}, _ScrollSpyController_markPassed = function _ScrollSpyController_markPassed(link, force) {
+    if (force) {
+        __classPrivateFieldGet(this, _ScrollSpyController_passedLinks, "f").add(link);
     }
-    async #nextIntersection() {
-        this.#intersected = false;
-        // safeguard the loop
-        setTimeout(() => this.#intersected = false, 3000);
-        while (!this.#intersected) {
-            await new Promise(requestAnimationFrame);
-        }
+    else {
+        __classPrivateFieldGet(this, _ScrollSpyController_passedLinks, "f").delete(link);
     }
-    async #onIo(entries) {
-        if (!this.#force) {
-            for (const { target, boundingClientRect, intersectionRect } of entries) {
-                const selector = `:is(${this.#tagNames.join(',')})[href="#${target.id}"]`;
-                const link = this.host.querySelector(selector);
-                if (link) {
-                    this.#markPassed(link, boundingClientRect.top < intersectionRect.top);
-                }
-            }
-            const link = [...this.#passedLinks];
-            const last = link.at(-1);
-            this.#setActive(last ?? this.#linkChildren.at(0));
-        }
-        this.#intersected = true;
+}, _ScrollSpyController_setActive = function _ScrollSpyController_setActive(link) {
+    for (const child of __classPrivateFieldGet(this, _ScrollSpyController_instances, "a", _ScrollSpyController_linkChildren_get)) {
+        child.toggleAttribute(__classPrivateFieldGet(this, _ScrollSpyController_activeAttribute, "f"), child === link);
     }
-    /** Explicitly set the active item */
-    async setActive(link) {
-        this.#force = true;
-        this.#setActive(link);
-        let sawActive = false;
-        for (const child of this.#linkChildren) {
-            this.#markPassed(child, !sawActive);
-            if (child === link) {
-                sawActive = true;
+}, _ScrollSpyController_nextIntersection = async function _ScrollSpyController_nextIntersection() {
+    __classPrivateFieldSet(this, _ScrollSpyController_intersected, false, "f");
+    // safeguard the loop
+    setTimeout(() => __classPrivateFieldSet(this, _ScrollSpyController_intersected, false, "f"), 3000);
+    while (!__classPrivateFieldGet(this, _ScrollSpyController_intersected, "f")) {
+        await new Promise(requestAnimationFrame);
+    }
+}, _ScrollSpyController_onIo = async function _ScrollSpyController_onIo(entries) {
+    if (!__classPrivateFieldGet(this, _ScrollSpyController_force, "f")) {
+        for (const { target, boundingClientRect, intersectionRect } of entries) {
+            const selector = `:is(${__classPrivateFieldGet(this, _ScrollSpyController_tagNames, "f").join(',')})[href="#${target.id}"]`;
+            const link = this.host.querySelector(selector);
+            if (link) {
+                __classPrivateFieldGet(this, _ScrollSpyController_instances, "m", _ScrollSpyController_markPassed).call(this, link, boundingClientRect.top < intersectionRect.top);
             }
         }
-        await this.#nextIntersection();
-        this.#force = false;
+        const link = [...__classPrivateFieldGet(this, _ScrollSpyController_passedLinks, "f")];
+        const last = link.at(-1);
+        __classPrivateFieldGet(this, _ScrollSpyController_instances, "m", _ScrollSpyController_setActive).call(this, last ?? __classPrivateFieldGet(this, _ScrollSpyController_instances, "a", _ScrollSpyController_linkChildren_get).at(0));
     }
-}
+    __classPrivateFieldSet(this, _ScrollSpyController_intersected, true, "f");
+};
 //# sourceMappingURL=scroll-spy-controller.js.map