@y14e/disclosure 1.3.18 → 1.3.20

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.
package/README.md CHANGED
@@ -10,14 +10,14 @@ npm i @y14e/disclosure
10
10
 
11
11
  ```ts
12
12
  // npm
13
- import Disclosure from '@y14e/disclosure@1.3.18';
13
+ import Disclosure from '@y14e/disclosure';
14
14
 
15
15
  // CDNs
16
- import Disclosure from 'https://esm.sh/@y14e/disclosure@1.3.18';
16
+ import Disclosure from 'https://esm.sh/@y14e/disclosure@1.3.20';
17
17
  // or
18
- import Disclosure from 'https://cdn.jsdelivr.net/npm/@y14e/disclosure@1.3.18/+esm';
18
+ import Disclosure from 'https://cdn.jsdelivr.net/npm/@y14e/disclosure@1.3.20/+esm';
19
19
  // or
20
- import Disclosure from 'https://esm.unpkg.com/@y14e/disclosure@1.3.18';
20
+ import Disclosure from 'https://esm.unpkg.com/@y14e/disclosure@1.3.20';
21
21
  ```
22
22
 
23
23
  ## Usage
@@ -377,28 +377,28 @@ var RovingTabIndex = class _RovingTabIndex {
377
377
  this.#focusablesByFirstChar.clear();
378
378
  }
379
379
  #initialize() {
380
- this.#update(document.activeElement);
380
+ this.#update(getActiveElement());
381
381
  if (!(this.#container instanceof HTMLElement)) {
382
382
  return;
383
383
  }
384
384
  this.#controller = new AbortController();
385
385
  const { signal } = this.#controller;
386
- document.addEventListener("focusin", this.#onFocusIn, {
387
- capture: true,
388
- signal
389
- });
390
- this.#container.addEventListener("keydown", this.#onKeyDown, {
391
- capture: true,
392
- signal
393
- });
386
+ document.addEventListener("focusin", this.#onFocusIn, { signal });
387
+ this.#settings.noMemory && document.addEventListener("focusout", this.#onFocusOut, { signal });
388
+ this.#container.addEventListener("keydown", this.#onKeyDown, { signal });
394
389
  }
395
390
  #onFocusIn = (event) => {
396
391
  const { target } = event;
397
392
  if (!(target instanceof Element)) {
398
393
  return;
399
394
  }
400
- const isFocusable3 = this.#focusables.has(target);
401
- this.#settings.noMemory && !isFocusable3 ? this.#update(null) : isFocusable3 && this.#update(target);
395
+ const isFocusable2 = this.#focusables.has(target);
396
+ this.#settings.noMemory && !isFocusable2 ? this.#update() : isFocusable2 && this.#update(target);
397
+ };
398
+ #onFocusOut = (event) => {
399
+ if (!event.relatedTarget) {
400
+ this.#update();
401
+ }
402
402
  };
403
403
  #onKeyDown = (event) => {
404
404
  const { key, altKey, ctrlKey, metaKey, shiftKey } = event;
@@ -597,7 +597,7 @@ var Disclosure = class _Disclosure {
597
597
  const summary = this.#summaryElements[i];
598
598
  const content = this.#contentElements[i];
599
599
  if (summary && content) {
600
- const binding = createBinding(details, summary, content);
600
+ const binding = this.#createBinding(details, summary, content);
601
601
  this.#bindings.set(details, binding);
602
602
  this.#bindings.set(summary, binding);
603
603
  this.#bindings.set(content, binding);
@@ -631,7 +631,7 @@ var Disclosure = class _Disclosure {
631
631
  !force && await this.#waitAnimationsFinish();
632
632
  this.#contentElements.forEach((content) => {
633
633
  force && this.#bindings.get(content)?.animation?.finish();
634
- this.#onAnimationFinish(content);
634
+ this.#onContentAnimationFinish(content);
635
635
  });
636
636
  this.#animationController?.abort();
637
637
  this.#animationController = null;
@@ -677,7 +677,7 @@ var Disclosure = class _Disclosure {
677
677
  if (!summary) {
678
678
  return;
679
679
  }
680
- if (!isFocusable2(summary)) {
680
+ if (!this.#isFocusable(summary)) {
681
681
  summary.setAttribute("aria-disabled", "true");
682
682
  summary.setAttribute("tabindex", "-1");
683
683
  summary.style.setProperty("pointer-events", "none");
@@ -705,6 +705,24 @@ var Disclosure = class _Disclosure {
705
705
  const { details } = binding;
706
706
  this.#toggle(details, !details.hasAttribute("data-disclosure-open"));
707
707
  };
708
+ #onContentAnimationFinish(content) {
709
+ const binding = this.#bindings.get(content);
710
+ if (!binding) {
711
+ return;
712
+ }
713
+ const details = binding.details;
714
+ if (!details) {
715
+ return;
716
+ }
717
+ const name = details.getAttribute("data-disclosure-name");
718
+ name && details.setAttribute("name", name);
719
+ if (!details.hasAttribute("data-disclosure-open")) {
720
+ details.open = false;
721
+ }
722
+ ["block-size", "overflow"].forEach((name2) => {
723
+ content.style.removeProperty(name2);
724
+ });
725
+ }
708
726
  #toggle(details, isOpen) {
709
727
  if (details.hasAttribute("data-disclosure-open") === isOpen) {
710
728
  return;
@@ -712,10 +730,10 @@ var Disclosure = class _Disclosure {
712
730
  const name = details.getAttribute("data-disclosure-name");
713
731
  if (name && isOpen) {
714
732
  details.removeAttribute("name");
715
- const opened = this.#detailsElements.find(
733
+ const open = this.#detailsElements.find(
716
734
  (d) => d.hasAttribute("data-disclosure-open") && d.getAttribute("data-disclosure-name") === name
717
735
  );
718
- opened && this.close(opened);
736
+ open && this.close(open);
719
737
  }
720
738
  const binding = this.#bindings.get(details);
721
739
  if (!binding) {
@@ -749,36 +767,24 @@ var Disclosure = class _Disclosure {
749
767
  "finish",
750
768
  () => {
751
769
  if (binding?.animation === animation) {
752
- this.#onAnimationFinish(content);
770
+ this.#onContentAnimationFinish(content);
753
771
  cleanup();
754
772
  }
755
773
  },
756
774
  { once: true, signal }
757
775
  );
758
776
  }
777
+ #createBinding(details, summary, content) {
778
+ return { details, summary, content, animation: null };
779
+ }
780
+ #isFocusable(element) {
781
+ return element.tabIndex >= 0;
782
+ }
759
783
  #mergeOptions(target, source) {
760
784
  return {
761
785
  animation: { ...target.animation, ...source.animation ?? {} }
762
786
  };
763
787
  }
764
- #onAnimationFinish(content) {
765
- const binding = this.#bindings.get(content);
766
- if (!binding) {
767
- return;
768
- }
769
- const details = binding.details;
770
- if (!details) {
771
- return;
772
- }
773
- const name = details.getAttribute("data-disclosure-name");
774
- name && details.setAttribute("name", name);
775
- if (!details.hasAttribute("data-disclosure-open")) {
776
- details.open = false;
777
- }
778
- ["block-size", "overflow"].forEach((name2) => {
779
- content.style.removeProperty(name2);
780
- });
781
- }
782
788
  async #waitAnimationsFinish() {
783
789
  const promises = [];
784
790
  this.#contentElements.forEach((content) => {
@@ -788,27 +794,17 @@ var Disclosure = class _Disclosure {
788
794
  await Promise.allSettled(promises);
789
795
  }
790
796
  };
791
- function createBinding(details, summary, content) {
792
- return { details, summary, content, animation: null };
793
- }
794
- function isFocusable2(element) {
795
- return element.tabIndex >= 0;
796
- }
797
797
  function waitAnimationFinish(animation) {
798
- if (["idle", "finished"].includes(animation.playState)) {
799
- return Promise.resolve();
800
- } else {
801
- return new Promise(
802
- (resolve) => animation.addEventListener("finish", () => resolve(), { once: true })
803
- );
804
- }
798
+ return ["idle", "finished"].includes(animation.playState) ? Promise.resolve() : new Promise(
799
+ (resolve) => animation.addEventListener("finish", () => resolve(), { once: true })
800
+ );
805
801
  }
806
802
  /**
807
803
  * Disclosure
808
804
  * WAI-ARIA compliant disclosure pattern implementation in TypeScript.
809
805
  * Using the <details> and <summary> element.
810
806
  *
811
- * @version 1.3.18
807
+ * @version 1.3.20
812
808
  * @author Yusuke Kamiyamane
813
809
  * @license MIT
814
810
  * @copyright Copyright (c) Yusuke Kamiyamane
@@ -833,7 +829,7 @@ power-focusable/dist/index.js:
833
829
  * High-precision focus management utility with full composed tree support.
834
830
  * Handles complex focus rules including tabindex ordering, radio groups, inert.
835
831
  *
836
- * @version 4.3.3
832
+ * @version 4.3.5
837
833
  * @author Yusuke Kamiyamane
838
834
  * @license MIT
839
835
  * @copyright Copyright (c) Yusuke Kamiyamane
@@ -846,7 +842,7 @@ power-focusable/dist/index.js:
846
842
  * Lightweight roving tabindex utility with fully focus management.
847
843
  * Designed for accessible menus, tabs, toolbars, and composite widgets.
848
844
  *
849
- * @version 3.0.14
845
+ * @version 3.1.2
850
846
  * @author Yusuke Kamiyamane
851
847
  * @license MIT
852
848
  * @copyright Copyright (c) Yusuke Kamiyamane
@@ -375,28 +375,28 @@ var RovingTabIndex = class _RovingTabIndex {
375
375
  this.#focusablesByFirstChar.clear();
376
376
  }
377
377
  #initialize() {
378
- this.#update(document.activeElement);
378
+ this.#update(getActiveElement());
379
379
  if (!(this.#container instanceof HTMLElement)) {
380
380
  return;
381
381
  }
382
382
  this.#controller = new AbortController();
383
383
  const { signal } = this.#controller;
384
- document.addEventListener("focusin", this.#onFocusIn, {
385
- capture: true,
386
- signal
387
- });
388
- this.#container.addEventListener("keydown", this.#onKeyDown, {
389
- capture: true,
390
- signal
391
- });
384
+ document.addEventListener("focusin", this.#onFocusIn, { signal });
385
+ this.#settings.noMemory && document.addEventListener("focusout", this.#onFocusOut, { signal });
386
+ this.#container.addEventListener("keydown", this.#onKeyDown, { signal });
392
387
  }
393
388
  #onFocusIn = (event) => {
394
389
  const { target } = event;
395
390
  if (!(target instanceof Element)) {
396
391
  return;
397
392
  }
398
- const isFocusable3 = this.#focusables.has(target);
399
- this.#settings.noMemory && !isFocusable3 ? this.#update(null) : isFocusable3 && this.#update(target);
393
+ const isFocusable2 = this.#focusables.has(target);
394
+ this.#settings.noMemory && !isFocusable2 ? this.#update() : isFocusable2 && this.#update(target);
395
+ };
396
+ #onFocusOut = (event) => {
397
+ if (!event.relatedTarget) {
398
+ this.#update();
399
+ }
400
400
  };
401
401
  #onKeyDown = (event) => {
402
402
  const { key, altKey, ctrlKey, metaKey, shiftKey } = event;
@@ -595,7 +595,7 @@ var Disclosure = class _Disclosure {
595
595
  const summary = this.#summaryElements[i];
596
596
  const content = this.#contentElements[i];
597
597
  if (summary && content) {
598
- const binding = createBinding(details, summary, content);
598
+ const binding = this.#createBinding(details, summary, content);
599
599
  this.#bindings.set(details, binding);
600
600
  this.#bindings.set(summary, binding);
601
601
  this.#bindings.set(content, binding);
@@ -629,7 +629,7 @@ var Disclosure = class _Disclosure {
629
629
  !force && await this.#waitAnimationsFinish();
630
630
  this.#contentElements.forEach((content) => {
631
631
  force && this.#bindings.get(content)?.animation?.finish();
632
- this.#onAnimationFinish(content);
632
+ this.#onContentAnimationFinish(content);
633
633
  });
634
634
  this.#animationController?.abort();
635
635
  this.#animationController = null;
@@ -675,7 +675,7 @@ var Disclosure = class _Disclosure {
675
675
  if (!summary) {
676
676
  return;
677
677
  }
678
- if (!isFocusable2(summary)) {
678
+ if (!this.#isFocusable(summary)) {
679
679
  summary.setAttribute("aria-disabled", "true");
680
680
  summary.setAttribute("tabindex", "-1");
681
681
  summary.style.setProperty("pointer-events", "none");
@@ -703,6 +703,24 @@ var Disclosure = class _Disclosure {
703
703
  const { details } = binding;
704
704
  this.#toggle(details, !details.hasAttribute("data-disclosure-open"));
705
705
  };
706
+ #onContentAnimationFinish(content) {
707
+ const binding = this.#bindings.get(content);
708
+ if (!binding) {
709
+ return;
710
+ }
711
+ const details = binding.details;
712
+ if (!details) {
713
+ return;
714
+ }
715
+ const name = details.getAttribute("data-disclosure-name");
716
+ name && details.setAttribute("name", name);
717
+ if (!details.hasAttribute("data-disclosure-open")) {
718
+ details.open = false;
719
+ }
720
+ ["block-size", "overflow"].forEach((name2) => {
721
+ content.style.removeProperty(name2);
722
+ });
723
+ }
706
724
  #toggle(details, isOpen) {
707
725
  if (details.hasAttribute("data-disclosure-open") === isOpen) {
708
726
  return;
@@ -710,10 +728,10 @@ var Disclosure = class _Disclosure {
710
728
  const name = details.getAttribute("data-disclosure-name");
711
729
  if (name && isOpen) {
712
730
  details.removeAttribute("name");
713
- const opened = this.#detailsElements.find(
731
+ const open = this.#detailsElements.find(
714
732
  (d) => d.hasAttribute("data-disclosure-open") && d.getAttribute("data-disclosure-name") === name
715
733
  );
716
- opened && this.close(opened);
734
+ open && this.close(open);
717
735
  }
718
736
  const binding = this.#bindings.get(details);
719
737
  if (!binding) {
@@ -747,36 +765,24 @@ var Disclosure = class _Disclosure {
747
765
  "finish",
748
766
  () => {
749
767
  if (binding?.animation === animation) {
750
- this.#onAnimationFinish(content);
768
+ this.#onContentAnimationFinish(content);
751
769
  cleanup();
752
770
  }
753
771
  },
754
772
  { once: true, signal }
755
773
  );
756
774
  }
775
+ #createBinding(details, summary, content) {
776
+ return { details, summary, content, animation: null };
777
+ }
778
+ #isFocusable(element) {
779
+ return element.tabIndex >= 0;
780
+ }
757
781
  #mergeOptions(target, source) {
758
782
  return {
759
783
  animation: { ...target.animation, ...source.animation ?? {} }
760
784
  };
761
785
  }
762
- #onAnimationFinish(content) {
763
- const binding = this.#bindings.get(content);
764
- if (!binding) {
765
- return;
766
- }
767
- const details = binding.details;
768
- if (!details) {
769
- return;
770
- }
771
- const name = details.getAttribute("data-disclosure-name");
772
- name && details.setAttribute("name", name);
773
- if (!details.hasAttribute("data-disclosure-open")) {
774
- details.open = false;
775
- }
776
- ["block-size", "overflow"].forEach((name2) => {
777
- content.style.removeProperty(name2);
778
- });
779
- }
780
786
  async #waitAnimationsFinish() {
781
787
  const promises = [];
782
788
  this.#contentElements.forEach((content) => {
@@ -786,27 +792,17 @@ var Disclosure = class _Disclosure {
786
792
  await Promise.allSettled(promises);
787
793
  }
788
794
  };
789
- function createBinding(details, summary, content) {
790
- return { details, summary, content, animation: null };
791
- }
792
- function isFocusable2(element) {
793
- return element.tabIndex >= 0;
794
- }
795
795
  function waitAnimationFinish(animation) {
796
- if (["idle", "finished"].includes(animation.playState)) {
797
- return Promise.resolve();
798
- } else {
799
- return new Promise(
800
- (resolve) => animation.addEventListener("finish", () => resolve(), { once: true })
801
- );
802
- }
796
+ return ["idle", "finished"].includes(animation.playState) ? Promise.resolve() : new Promise(
797
+ (resolve) => animation.addEventListener("finish", () => resolve(), { once: true })
798
+ );
803
799
  }
804
800
  /**
805
801
  * Disclosure
806
802
  * WAI-ARIA compliant disclosure pattern implementation in TypeScript.
807
803
  * Using the <details> and <summary> element.
808
804
  *
809
- * @version 1.3.18
805
+ * @version 1.3.20
810
806
  * @author Yusuke Kamiyamane
811
807
  * @license MIT
812
808
  * @copyright Copyright (c) Yusuke Kamiyamane
@@ -831,7 +827,7 @@ power-focusable/dist/index.js:
831
827
  * High-precision focus management utility with full composed tree support.
832
828
  * Handles complex focus rules including tabindex ordering, radio groups, inert.
833
829
  *
834
- * @version 4.3.3
830
+ * @version 4.3.5
835
831
  * @author Yusuke Kamiyamane
836
832
  * @license MIT
837
833
  * @copyright Copyright (c) Yusuke Kamiyamane
@@ -844,7 +840,7 @@ power-focusable/dist/index.js:
844
840
  * Lightweight roving tabindex utility with fully focus management.
845
841
  * Designed for accessible menus, tabs, toolbars, and composite widgets.
846
842
  *
847
- * @version 3.0.14
843
+ * @version 3.1.2
848
844
  * @author Yusuke Kamiyamane
849
845
  * @license MIT
850
846
  * @copyright Copyright (c) Yusuke Kamiyamane
package/dist/index.cjs CHANGED
@@ -67,7 +67,7 @@ var Disclosure = class _Disclosure {
67
67
  const summary = this.#summaryElements[i];
68
68
  const content = this.#contentElements[i];
69
69
  if (summary && content) {
70
- const binding = createBinding(details, summary, content);
70
+ const binding = this.#createBinding(details, summary, content);
71
71
  this.#bindings.set(details, binding);
72
72
  this.#bindings.set(summary, binding);
73
73
  this.#bindings.set(content, binding);
@@ -101,7 +101,7 @@ var Disclosure = class _Disclosure {
101
101
  !force && await this.#waitAnimationsFinish();
102
102
  this.#contentElements.forEach((content) => {
103
103
  force && this.#bindings.get(content)?.animation?.finish();
104
- this.#onAnimationFinish(content);
104
+ this.#onContentAnimationFinish(content);
105
105
  });
106
106
  this.#animationController?.abort();
107
107
  this.#animationController = null;
@@ -147,7 +147,7 @@ var Disclosure = class _Disclosure {
147
147
  if (!summary) {
148
148
  return;
149
149
  }
150
- if (!isFocusable(summary)) {
150
+ if (!this.#isFocusable(summary)) {
151
151
  summary.setAttribute("aria-disabled", "true");
152
152
  summary.setAttribute("tabindex", "-1");
153
153
  summary.style.setProperty("pointer-events", "none");
@@ -175,6 +175,24 @@ var Disclosure = class _Disclosure {
175
175
  const { details } = binding;
176
176
  this.#toggle(details, !details.hasAttribute("data-disclosure-open"));
177
177
  };
178
+ #onContentAnimationFinish(content) {
179
+ const binding = this.#bindings.get(content);
180
+ if (!binding) {
181
+ return;
182
+ }
183
+ const details = binding.details;
184
+ if (!details) {
185
+ return;
186
+ }
187
+ const name = details.getAttribute("data-disclosure-name");
188
+ name && details.setAttribute("name", name);
189
+ if (!details.hasAttribute("data-disclosure-open")) {
190
+ details.open = false;
191
+ }
192
+ ["block-size", "overflow"].forEach((name2) => {
193
+ content.style.removeProperty(name2);
194
+ });
195
+ }
178
196
  #toggle(details, isOpen) {
179
197
  if (details.hasAttribute("data-disclosure-open") === isOpen) {
180
198
  return;
@@ -182,10 +200,10 @@ var Disclosure = class _Disclosure {
182
200
  const name = details.getAttribute("data-disclosure-name");
183
201
  if (name && isOpen) {
184
202
  details.removeAttribute("name");
185
- const opened = this.#detailsElements.find(
203
+ const open = this.#detailsElements.find(
186
204
  (d) => d.hasAttribute("data-disclosure-open") && d.getAttribute("data-disclosure-name") === name
187
205
  );
188
- opened && this.close(opened);
206
+ open && this.close(open);
189
207
  }
190
208
  const binding = this.#bindings.get(details);
191
209
  if (!binding) {
@@ -219,36 +237,24 @@ var Disclosure = class _Disclosure {
219
237
  "finish",
220
238
  () => {
221
239
  if (binding?.animation === animation) {
222
- this.#onAnimationFinish(content);
240
+ this.#onContentAnimationFinish(content);
223
241
  cleanup();
224
242
  }
225
243
  },
226
244
  { once: true, signal }
227
245
  );
228
246
  }
247
+ #createBinding(details, summary, content) {
248
+ return { details, summary, content, animation: null };
249
+ }
250
+ #isFocusable(element) {
251
+ return element.tabIndex >= 0;
252
+ }
229
253
  #mergeOptions(target, source) {
230
254
  return {
231
255
  animation: { ...target.animation, ...source.animation ?? {} }
232
256
  };
233
257
  }
234
- #onAnimationFinish(content) {
235
- const binding = this.#bindings.get(content);
236
- if (!binding) {
237
- return;
238
- }
239
- const details = binding.details;
240
- if (!details) {
241
- return;
242
- }
243
- const name = details.getAttribute("data-disclosure-name");
244
- name && details.setAttribute("name", name);
245
- if (!details.hasAttribute("data-disclosure-open")) {
246
- details.open = false;
247
- }
248
- ["block-size", "overflow"].forEach((name2) => {
249
- content.style.removeProperty(name2);
250
- });
251
- }
252
258
  async #waitAnimationsFinish() {
253
259
  const promises = [];
254
260
  this.#contentElements.forEach((content) => {
@@ -258,27 +264,17 @@ var Disclosure = class _Disclosure {
258
264
  await Promise.allSettled(promises);
259
265
  }
260
266
  };
261
- function createBinding(details, summary, content) {
262
- return { details, summary, content, animation: null };
263
- }
264
- function isFocusable(element) {
265
- return element.tabIndex >= 0;
266
- }
267
267
  function waitAnimationFinish(animation) {
268
- if (["idle", "finished"].includes(animation.playState)) {
269
- return Promise.resolve();
270
- } else {
271
- return new Promise(
272
- (resolve) => animation.addEventListener("finish", () => resolve(), { once: true })
273
- );
274
- }
268
+ return ["idle", "finished"].includes(animation.playState) ? Promise.resolve() : new Promise(
269
+ (resolve) => animation.addEventListener("finish", () => resolve(), { once: true })
270
+ );
275
271
  }
276
272
  /**
277
273
  * Disclosure
278
274
  * WAI-ARIA compliant disclosure pattern implementation in TypeScript.
279
275
  * Using the <details> and <summary> element.
280
276
  *
281
- * @version 1.3.18
277
+ * @version 1.3.20
282
278
  * @author Yusuke Kamiyamane
283
279
  * @license MIT
284
280
  * @copyright Copyright (c) Yusuke Kamiyamane
package/dist/index.d.cts CHANGED
@@ -3,7 +3,7 @@
3
3
  * WAI-ARIA compliant disclosure pattern implementation in TypeScript.
4
4
  * Using the <details> and <summary> element.
5
5
  *
6
- * @version 1.3.18
6
+ * @version 1.3.20
7
7
  * @author Yusuke Kamiyamane
8
8
  * @license MIT
9
9
  * @copyright Copyright (c) Yusuke Kamiyamane
package/dist/index.d.ts CHANGED
@@ -3,7 +3,7 @@
3
3
  * WAI-ARIA compliant disclosure pattern implementation in TypeScript.
4
4
  * Using the <details> and <summary> element.
5
5
  *
6
- * @version 1.3.18
6
+ * @version 1.3.20
7
7
  * @author Yusuke Kamiyamane
8
8
  * @license MIT
9
9
  * @copyright Copyright (c) Yusuke Kamiyamane
package/dist/index.js CHANGED
@@ -65,7 +65,7 @@ var Disclosure = class _Disclosure {
65
65
  const summary = this.#summaryElements[i];
66
66
  const content = this.#contentElements[i];
67
67
  if (summary && content) {
68
- const binding = createBinding(details, summary, content);
68
+ const binding = this.#createBinding(details, summary, content);
69
69
  this.#bindings.set(details, binding);
70
70
  this.#bindings.set(summary, binding);
71
71
  this.#bindings.set(content, binding);
@@ -99,7 +99,7 @@ var Disclosure = class _Disclosure {
99
99
  !force && await this.#waitAnimationsFinish();
100
100
  this.#contentElements.forEach((content) => {
101
101
  force && this.#bindings.get(content)?.animation?.finish();
102
- this.#onAnimationFinish(content);
102
+ this.#onContentAnimationFinish(content);
103
103
  });
104
104
  this.#animationController?.abort();
105
105
  this.#animationController = null;
@@ -145,7 +145,7 @@ var Disclosure = class _Disclosure {
145
145
  if (!summary) {
146
146
  return;
147
147
  }
148
- if (!isFocusable(summary)) {
148
+ if (!this.#isFocusable(summary)) {
149
149
  summary.setAttribute("aria-disabled", "true");
150
150
  summary.setAttribute("tabindex", "-1");
151
151
  summary.style.setProperty("pointer-events", "none");
@@ -173,6 +173,24 @@ var Disclosure = class _Disclosure {
173
173
  const { details } = binding;
174
174
  this.#toggle(details, !details.hasAttribute("data-disclosure-open"));
175
175
  };
176
+ #onContentAnimationFinish(content) {
177
+ const binding = this.#bindings.get(content);
178
+ if (!binding) {
179
+ return;
180
+ }
181
+ const details = binding.details;
182
+ if (!details) {
183
+ return;
184
+ }
185
+ const name = details.getAttribute("data-disclosure-name");
186
+ name && details.setAttribute("name", name);
187
+ if (!details.hasAttribute("data-disclosure-open")) {
188
+ details.open = false;
189
+ }
190
+ ["block-size", "overflow"].forEach((name2) => {
191
+ content.style.removeProperty(name2);
192
+ });
193
+ }
176
194
  #toggle(details, isOpen) {
177
195
  if (details.hasAttribute("data-disclosure-open") === isOpen) {
178
196
  return;
@@ -180,10 +198,10 @@ var Disclosure = class _Disclosure {
180
198
  const name = details.getAttribute("data-disclosure-name");
181
199
  if (name && isOpen) {
182
200
  details.removeAttribute("name");
183
- const opened = this.#detailsElements.find(
201
+ const open = this.#detailsElements.find(
184
202
  (d) => d.hasAttribute("data-disclosure-open") && d.getAttribute("data-disclosure-name") === name
185
203
  );
186
- opened && this.close(opened);
204
+ open && this.close(open);
187
205
  }
188
206
  const binding = this.#bindings.get(details);
189
207
  if (!binding) {
@@ -217,36 +235,24 @@ var Disclosure = class _Disclosure {
217
235
  "finish",
218
236
  () => {
219
237
  if (binding?.animation === animation) {
220
- this.#onAnimationFinish(content);
238
+ this.#onContentAnimationFinish(content);
221
239
  cleanup();
222
240
  }
223
241
  },
224
242
  { once: true, signal }
225
243
  );
226
244
  }
245
+ #createBinding(details, summary, content) {
246
+ return { details, summary, content, animation: null };
247
+ }
248
+ #isFocusable(element) {
249
+ return element.tabIndex >= 0;
250
+ }
227
251
  #mergeOptions(target, source) {
228
252
  return {
229
253
  animation: { ...target.animation, ...source.animation ?? {} }
230
254
  };
231
255
  }
232
- #onAnimationFinish(content) {
233
- const binding = this.#bindings.get(content);
234
- if (!binding) {
235
- return;
236
- }
237
- const details = binding.details;
238
- if (!details) {
239
- return;
240
- }
241
- const name = details.getAttribute("data-disclosure-name");
242
- name && details.setAttribute("name", name);
243
- if (!details.hasAttribute("data-disclosure-open")) {
244
- details.open = false;
245
- }
246
- ["block-size", "overflow"].forEach((name2) => {
247
- content.style.removeProperty(name2);
248
- });
249
- }
250
256
  async #waitAnimationsFinish() {
251
257
  const promises = [];
252
258
  this.#contentElements.forEach((content) => {
@@ -256,27 +262,17 @@ var Disclosure = class _Disclosure {
256
262
  await Promise.allSettled(promises);
257
263
  }
258
264
  };
259
- function createBinding(details, summary, content) {
260
- return { details, summary, content, animation: null };
261
- }
262
- function isFocusable(element) {
263
- return element.tabIndex >= 0;
264
- }
265
265
  function waitAnimationFinish(animation) {
266
- if (["idle", "finished"].includes(animation.playState)) {
267
- return Promise.resolve();
268
- } else {
269
- return new Promise(
270
- (resolve) => animation.addEventListener("finish", () => resolve(), { once: true })
271
- );
272
- }
266
+ return ["idle", "finished"].includes(animation.playState) ? Promise.resolve() : new Promise(
267
+ (resolve) => animation.addEventListener("finish", () => resolve(), { once: true })
268
+ );
273
269
  }
274
270
  /**
275
271
  * Disclosure
276
272
  * WAI-ARIA compliant disclosure pattern implementation in TypeScript.
277
273
  * Using the <details> and <summary> element.
278
274
  *
279
- * @version 1.3.18
275
+ * @version 1.3.20
280
276
  * @author Yusuke Kamiyamane
281
277
  * @license MIT
282
278
  * @copyright Copyright (c) Yusuke Kamiyamane
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@y14e/disclosure",
3
- "version": "1.3.18",
3
+ "version": "1.3.20",
4
4
  "description": "WAI-ARIA compliant disclosure pattern implementation in TypeScript",
5
5
  "type": "module",
6
6
  "main": "./dist/index.cjs",
@@ -53,6 +53,6 @@
53
53
  },
54
54
  "dependencies": {
55
55
  "@y14e/attributes-utils": "^1.1.2",
56
- "@y14e/roving-tabindex": "^3.0.14"
56
+ "@y14e/roving-tabindex": "^3.1.2"
57
57
  }
58
58
  }