@fluid-topics/ft-wc-utils 2.0.22 → 2.0.24

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 (4) hide show
  1. package/build/directives/focusTrap.d.ts +2 -0
  2. package/build/directives/focusTrap.js +18 -6
  3. package/build/globals.min.js +8 -8
  4. package/package.json +4 -4
package/build/directives/focusTrap.d.ts CHANGED
@@ -23,6 +23,8 @@ export declare class FocusTrapDirective extends AsyncDirective {
23
23
  update(part: ElementPart): symbol;
24
24
  reconnected(): void;
25
25
  disconnected(): void;
26
+ private ensureFocusTrap;
27
+ private removeFocusTrap;
26
28
  private isElementTrappable;
27
29
  private createFocusTrap;
28
30
  /**
package/build/directives/focusTrap.js CHANGED
@@ -51,18 +51,30 @@ export class FocusTrapDirective extends AsyncDirective {
51
51
  }
52
52
  update(part) {
53
53
  this.part = part;
54
- if (this.isElementTrappable(part.element)) {
55
- this.createFocusTrap(part.element);
56
- }
54
+ this.ensureFocusTrap(part.element);
57
55
  return noChange;
58
56
  }
59
57
  reconnected() {
60
58
  var _a;
61
- if (this.isElementTrappable((_a = this.part) === null || _a === void 0 ? void 0 : _a.element)) {
62
- this.createFocusTrap(this.part.element);
63
- }
59
+ this.ensureFocusTrap((_a = this.part) === null || _a === void 0 ? void 0 : _a.element);
64
60
  }
65
61
  disconnected() {
62
+ this.removeFocusTrap();
63
+ }
64
+ ensureFocusTrap(element) {
65
+ var _a, _b;
66
+ if (!this.isElementTrappable(element)) {
67
+ return;
68
+ }
69
+ // If traps already exist and are still anchored to the host element, nothing to do.
70
+ // This prevents duplicating trap divs on every re-render of the host.
71
+ if (((_a = this.firstTrap) === null || _a === void 0 ? void 0 : _a.parentElement) === element && ((_b = this.lastTrap) === null || _b === void 0 ? void 0 : _b.parentElement) === element) {
72
+ return;
73
+ }
74
+ this.removeFocusTrap();
75
+ this.createFocusTrap(element);
76
+ }
77
+ removeFocusTrap() {
66
78
  var _a, _b, _c, _d;
67
79
  (_a = this.firstTrap) === null || _a === void 0 ? void 0 : _a.removeEventListener("focus", this.onFirstTrapFocus);
68
80
  (_b = this.lastTrap) === null || _b === void 0 ? void 0 : _b.removeEventListener("focus", this.onLastTrapFocus);