@y14e/accordion 2.0.4 → 2.0.6
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 +7 -7
- package/dist/index.bundle.cjs +25 -80
- package/dist/index.bundle.js +25 -80
- package/dist/index.cjs +33 -7
- package/dist/index.d.cts +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.js +14 -7
- package/package.json +4 -4
package/README.md
CHANGED
|
@@ -13,11 +13,11 @@ npm i @y14e/accordion
|
|
|
13
13
|
import Accordion from "@y14e/accordion";
|
|
14
14
|
|
|
15
15
|
// CDNs
|
|
16
|
-
import Accordion from "https://esm.sh/@y14e/accordion@2.0.
|
|
16
|
+
import Accordion from "https://esm.sh/@y14e/accordion@2.0.6";
|
|
17
17
|
// or
|
|
18
|
-
import Accordion from "https://cdn.jsdelivr.net/npm/@y14e/accordion@2.0.
|
|
18
|
+
import Accordion from "https://cdn.jsdelivr.net/npm/@y14e/accordion@2.0.6/+esm";
|
|
19
19
|
// or
|
|
20
|
-
import Accordion from "https://esm.unpkg.com/@y14e/accordion@2.0.
|
|
20
|
+
import Accordion from "https://esm.unpkg.com/@y14e/accordion@2.0.6";
|
|
21
21
|
```
|
|
22
22
|
|
|
23
23
|
## Usage
|
|
@@ -35,13 +35,13 @@ new Accordion(root, options);
|
|
|
35
35
|
```ts
|
|
36
36
|
interface AccordionOptions {
|
|
37
37
|
animation: {
|
|
38
|
-
duration: number;
|
|
39
|
-
easing: string;
|
|
38
|
+
duration: number; // ms (default: 300)
|
|
39
|
+
easing: string; // <easing-function> (default: 'ease')
|
|
40
40
|
};
|
|
41
41
|
collapsible: boolean; // default: true
|
|
42
42
|
selector: {
|
|
43
|
-
content: string;
|
|
44
|
-
trigger: string;
|
|
43
|
+
content: string; // default: '[data-accordion-content]'
|
|
44
|
+
trigger: string; // default: '[data-accordion-trigger]'
|
|
45
45
|
};
|
|
46
46
|
}
|
|
47
47
|
```
|
package/dist/index.bundle.cjs
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
// node_modules/@y14e/
|
|
3
|
+
// node_modules/@y14e/attribute-util/dist/index.js
|
|
4
4
|
var DEFAULT_PARSER = (value) => value.split(/\s+/);
|
|
5
5
|
var DEFAULT_SERIALIZER = (tokens) => tokens.join(" ");
|
|
6
6
|
function addAttributeToken(element, name, token, options = {}) {
|
|
@@ -49,7 +49,6 @@ function saveAttributes(element_or_elements, name_or_names) {
|
|
|
49
49
|
});
|
|
50
50
|
});
|
|
51
51
|
}
|
|
52
|
-
var addTokenToAttribute = addAttributeToken;
|
|
53
52
|
|
|
54
53
|
// node_modules/power-focusable/dist/index.js
|
|
55
54
|
var FOCUSABLE_SELECTOR = `:is(a[href], area[href], button, embed, iframe, input:not([type="hidden" i]), object, select, details > summary:first-of-type, textarea, [contenteditable]:not([contenteditable="false" i]), [controls], [tabindex]):not(:disabled, [hidden], [inert], [tabindex="-1"])`;
|
|
@@ -369,56 +368,6 @@ var Button = class {
|
|
|
369
368
|
};
|
|
370
369
|
};
|
|
371
370
|
|
|
372
|
-
// node_modules/@y14e/roving-tabindex/node_modules/@y14e/attributes-utils/dist/index.js
|
|
373
|
-
var DEFAULT_PARSER2 = (value) => value.split(/\s+/);
|
|
374
|
-
var DEFAULT_SERIALIZER2 = (tokens) => tokens.join(" ");
|
|
375
|
-
function addTokenToAttribute2(element, name, token, options = {}) {
|
|
376
|
-
const value = element.getAttribute(name)?.trim();
|
|
377
|
-
const {
|
|
378
|
-
caseInsensitive = false,
|
|
379
|
-
parse = DEFAULT_PARSER2,
|
|
380
|
-
serialize = DEFAULT_SERIALIZER2
|
|
381
|
-
} = options;
|
|
382
|
-
const tokens = value ? parse(value).filter(Boolean) : [];
|
|
383
|
-
if (caseInsensitive) {
|
|
384
|
-
const lower = token.toLowerCase();
|
|
385
|
-
if (tokens.every((token2) => token2.toLowerCase() !== lower)) {
|
|
386
|
-
tokens.push(token);
|
|
387
|
-
element.setAttribute(name, serialize(tokens));
|
|
388
|
-
}
|
|
389
|
-
} else {
|
|
390
|
-
const set = new Set(tokens);
|
|
391
|
-
set.add(token);
|
|
392
|
-
element.setAttribute(name, serialize([...set]));
|
|
393
|
-
}
|
|
394
|
-
}
|
|
395
|
-
var snapshots2 = /* @__PURE__ */ new WeakMap();
|
|
396
|
-
function restoreAttributes2(element_or_elements) {
|
|
397
|
-
for (const element of Array.isArray(element_or_elements) ? element_or_elements : [element_or_elements]) {
|
|
398
|
-
const snapshot = snapshots2.get(element);
|
|
399
|
-
if (!snapshot) {
|
|
400
|
-
continue;
|
|
401
|
-
}
|
|
402
|
-
for (const [name, value] of snapshot.entries()) {
|
|
403
|
-
value === null ? element.removeAttribute(name) : element.setAttribute(name, value);
|
|
404
|
-
}
|
|
405
|
-
snapshots2.delete(element);
|
|
406
|
-
}
|
|
407
|
-
}
|
|
408
|
-
function saveAttributes2(element_or_elements, name_or_names) {
|
|
409
|
-
const names = Array.isArray(name_or_names) ? name_or_names : [name_or_names];
|
|
410
|
-
(Array.isArray(element_or_elements) ? element_or_elements : [element_or_elements]).forEach((element) => {
|
|
411
|
-
let snapshot = snapshots2.get(element);
|
|
412
|
-
if (!snapshot) {
|
|
413
|
-
snapshot = /* @__PURE__ */ new Map();
|
|
414
|
-
snapshots2.set(element, snapshot);
|
|
415
|
-
}
|
|
416
|
-
names.forEach((name) => {
|
|
417
|
-
snapshot.set(name, element.getAttribute(name));
|
|
418
|
-
});
|
|
419
|
-
});
|
|
420
|
-
}
|
|
421
|
-
|
|
422
371
|
// node_modules/@y14e/roving-tabindex/dist/index.js
|
|
423
372
|
function createRovingTabIndex(container, options = {}) {
|
|
424
373
|
if (!(container instanceof Element)) {
|
|
@@ -510,7 +459,7 @@ var RovingTabIndex = class _RovingTabIndex {
|
|
|
510
459
|
this.#controller = null;
|
|
511
460
|
this.#focusables.forEach((focusable) => {
|
|
512
461
|
_RovingTabIndex.#initialized.delete(focusable);
|
|
513
|
-
|
|
462
|
+
restoreAttributes(focusable);
|
|
514
463
|
});
|
|
515
464
|
this.#focusables.clear();
|
|
516
465
|
this.#focusablesByFirstChar.clear();
|
|
@@ -615,7 +564,7 @@ var RovingTabIndex = class _RovingTabIndex {
|
|
|
615
564
|
for (const focusable of this.#focusables) {
|
|
616
565
|
if (!current.has(focusable)) {
|
|
617
566
|
_RovingTabIndex.#initialized.delete(focusable);
|
|
618
|
-
|
|
567
|
+
restoreAttributes(focusable);
|
|
619
568
|
this.#focusables.delete(focusable);
|
|
620
569
|
for (const [key, focusables] of this.#focusablesByFirstChar) {
|
|
621
570
|
const index = focusables.indexOf(focusable);
|
|
@@ -637,7 +586,7 @@ var RovingTabIndex = class _RovingTabIndex {
|
|
|
637
586
|
this.#focusables.add(focusable);
|
|
638
587
|
_RovingTabIndex.#initialized.add(focusable);
|
|
639
588
|
if (!navigationOnly) {
|
|
640
|
-
|
|
589
|
+
saveAttributes(focusable, "tabindex");
|
|
641
590
|
focusable.setAttribute("tabindex", "-1");
|
|
642
591
|
}
|
|
643
592
|
if (!typeahead) {
|
|
@@ -650,8 +599,8 @@ var RovingTabIndex = class _RovingTabIndex {
|
|
|
650
599
|
);
|
|
651
600
|
if (char) {
|
|
652
601
|
keys.add(char);
|
|
653
|
-
|
|
654
|
-
|
|
602
|
+
saveAttributes(focusable, "aria-keyshortcuts");
|
|
603
|
+
addAttributeToken(focusable, "aria-keyshortcuts", char, {
|
|
655
604
|
caseInsensitive: true
|
|
656
605
|
});
|
|
657
606
|
}
|
|
@@ -781,7 +730,10 @@ var Accordion = class _Accordion {
|
|
|
781
730
|
});
|
|
782
731
|
this.#animationController?.abort();
|
|
783
732
|
this.#animationController = null;
|
|
784
|
-
restoreAttributes([
|
|
733
|
+
restoreAttributes([
|
|
734
|
+
...this.#triggerElements,
|
|
735
|
+
...this.#contentElements
|
|
736
|
+
]);
|
|
785
737
|
this.#triggerElements.length = 0;
|
|
786
738
|
this.#contentElements.length = 0;
|
|
787
739
|
this.#rootElement.removeAttribute("data-accordion-initialized");
|
|
@@ -804,7 +756,11 @@ var Accordion = class _Accordion {
|
|
|
804
756
|
"style",
|
|
805
757
|
"tabindex"
|
|
806
758
|
]);
|
|
807
|
-
saveAttributes(this.#contentElements, [
|
|
759
|
+
saveAttributes(this.#contentElements, [
|
|
760
|
+
"aria-labelledby",
|
|
761
|
+
"id",
|
|
762
|
+
"role"
|
|
763
|
+
]);
|
|
808
764
|
this.#eventController = new AbortController();
|
|
809
765
|
const { signal } = this.#eventController;
|
|
810
766
|
this.#triggerElements.forEach((trigger2, i) => {
|
|
@@ -814,7 +770,7 @@ var Accordion = class _Accordion {
|
|
|
814
770
|
return;
|
|
815
771
|
}
|
|
816
772
|
content2.id ||= `accordion-content-${id}`;
|
|
817
|
-
|
|
773
|
+
addAttributeToken(trigger2, "aria-controls", content2.id);
|
|
818
774
|
trigger2.setAttribute(
|
|
819
775
|
"aria-expanded",
|
|
820
776
|
String(trigger2.ariaExpanded === "true")
|
|
@@ -826,7 +782,7 @@ var Accordion = class _Accordion {
|
|
|
826
782
|
trigger2.style.setProperty("pointer-events", "none");
|
|
827
783
|
}
|
|
828
784
|
trigger2.addEventListener("click", this.#onTriggerClick, { signal });
|
|
829
|
-
|
|
785
|
+
addAttributeToken(content2, "aria-labelledby", trigger2.id);
|
|
830
786
|
content2.setAttribute("role", "region");
|
|
831
787
|
content2.addEventListener("beforematch", this.#onContentBeforeMatch, {
|
|
832
788
|
signal
|
|
@@ -961,7 +917,7 @@ function waitAnimationFinish(animation) {
|
|
|
961
917
|
* Accordion
|
|
962
918
|
* WAI-ARIA compliant accordion pattern implementation in TypeScript.
|
|
963
919
|
*
|
|
964
|
-
* @version 2.0.
|
|
920
|
+
* @version 2.0.6
|
|
965
921
|
* @author Yusuke Kamiyamane
|
|
966
922
|
* @license MIT
|
|
967
923
|
* @copyright Copyright (c) Yusuke Kamiyamane
|
|
@@ -969,15 +925,15 @@ function waitAnimationFinish(animation) {
|
|
|
969
925
|
*/
|
|
970
926
|
/*! Bundled license information:
|
|
971
927
|
|
|
972
|
-
@y14e/
|
|
928
|
+
@y14e/attribute-util/dist/index.js:
|
|
973
929
|
(**
|
|
974
|
-
*
|
|
930
|
+
* Attribute Util
|
|
975
931
|
*
|
|
976
|
-
* @version 2.0.
|
|
932
|
+
* @version 2.0.1
|
|
977
933
|
* @author Yusuke Kamiyamane
|
|
978
934
|
* @license MIT
|
|
979
935
|
* @copyright Copyright (c) Yusuke Kamiyamane
|
|
980
|
-
* @see {@link https://github.com/y14e/
|
|
936
|
+
* @see {@link https://github.com/y14e/attribute-util}
|
|
981
937
|
*)
|
|
982
938
|
|
|
983
939
|
power-focusable/dist/index.js:
|
|
@@ -986,7 +942,7 @@ power-focusable/dist/index.js:
|
|
|
986
942
|
* High-precision focus management utility with full composed tree support.
|
|
987
943
|
* Handles complex focus rules including tabindex ordering, radio groups, inert.
|
|
988
944
|
*
|
|
989
|
-
* @version 4.3.
|
|
945
|
+
* @version 4.3.25
|
|
990
946
|
* @author Yusuke Kamiyamane
|
|
991
947
|
* @license MIT
|
|
992
948
|
* @copyright Copyright (c) Yusuke Kamiyamane
|
|
@@ -997,31 +953,20 @@ power-focusable/dist/index.js:
|
|
|
997
953
|
(**
|
|
998
954
|
* Button
|
|
999
955
|
*
|
|
1000
|
-
* @version 1.0.
|
|
956
|
+
* @version 1.0.7
|
|
1001
957
|
* @author Yusuke Kamiyamane
|
|
1002
958
|
* @license MIT
|
|
1003
959
|
* @copyright Copyright (c) Yusuke Kamiyamane
|
|
1004
960
|
* @see {@link https://github.com/y14e/button}
|
|
1005
961
|
*)
|
|
1006
962
|
|
|
1007
|
-
@y14e/attributes-utils/dist/index.js:
|
|
1008
|
-
(**
|
|
1009
|
-
* Attributes Utils
|
|
1010
|
-
*
|
|
1011
|
-
* @version 1.1.7
|
|
1012
|
-
* @author Yusuke Kamiyamane
|
|
1013
|
-
* @license MIT
|
|
1014
|
-
* @copyright Copyright (c) Yusuke Kamiyamane
|
|
1015
|
-
* @see {@link https://github.com/y14e/attributes-utils}
|
|
1016
|
-
*)
|
|
1017
|
-
|
|
1018
963
|
@y14e/roving-tabindex/dist/index.js:
|
|
1019
964
|
(**
|
|
1020
965
|
* Roving Tabindex
|
|
1021
966
|
* Lightweight roving tabindex utility with fully focus management.
|
|
1022
967
|
* Designed for accessible menus, tabs, toolbars, and composite widgets.
|
|
1023
968
|
*
|
|
1024
|
-
* @version 3.1.
|
|
969
|
+
* @version 3.1.22
|
|
1025
970
|
* @author Yusuke Kamiyamane
|
|
1026
971
|
* @license MIT
|
|
1027
972
|
* @copyright Copyright (c) Yusuke Kamiyamane
|
package/dist/index.bundle.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
// node_modules/@y14e/
|
|
1
|
+
// node_modules/@y14e/attribute-util/dist/index.js
|
|
2
2
|
var DEFAULT_PARSER = (value) => value.split(/\s+/);
|
|
3
3
|
var DEFAULT_SERIALIZER = (tokens) => tokens.join(" ");
|
|
4
4
|
function addAttributeToken(element, name, token, options = {}) {
|
|
@@ -47,7 +47,6 @@ function saveAttributes(element_or_elements, name_or_names) {
|
|
|
47
47
|
});
|
|
48
48
|
});
|
|
49
49
|
}
|
|
50
|
-
var addTokenToAttribute = addAttributeToken;
|
|
51
50
|
|
|
52
51
|
// node_modules/power-focusable/dist/index.js
|
|
53
52
|
var FOCUSABLE_SELECTOR = `:is(a[href], area[href], button, embed, iframe, input:not([type="hidden" i]), object, select, details > summary:first-of-type, textarea, [contenteditable]:not([contenteditable="false" i]), [controls], [tabindex]):not(:disabled, [hidden], [inert], [tabindex="-1"])`;
|
|
@@ -367,56 +366,6 @@ var Button = class {
|
|
|
367
366
|
};
|
|
368
367
|
};
|
|
369
368
|
|
|
370
|
-
// node_modules/@y14e/roving-tabindex/node_modules/@y14e/attributes-utils/dist/index.js
|
|
371
|
-
var DEFAULT_PARSER2 = (value) => value.split(/\s+/);
|
|
372
|
-
var DEFAULT_SERIALIZER2 = (tokens) => tokens.join(" ");
|
|
373
|
-
function addTokenToAttribute2(element, name, token, options = {}) {
|
|
374
|
-
const value = element.getAttribute(name)?.trim();
|
|
375
|
-
const {
|
|
376
|
-
caseInsensitive = false,
|
|
377
|
-
parse = DEFAULT_PARSER2,
|
|
378
|
-
serialize = DEFAULT_SERIALIZER2
|
|
379
|
-
} = options;
|
|
380
|
-
const tokens = value ? parse(value).filter(Boolean) : [];
|
|
381
|
-
if (caseInsensitive) {
|
|
382
|
-
const lower = token.toLowerCase();
|
|
383
|
-
if (tokens.every((token2) => token2.toLowerCase() !== lower)) {
|
|
384
|
-
tokens.push(token);
|
|
385
|
-
element.setAttribute(name, serialize(tokens));
|
|
386
|
-
}
|
|
387
|
-
} else {
|
|
388
|
-
const set = new Set(tokens);
|
|
389
|
-
set.add(token);
|
|
390
|
-
element.setAttribute(name, serialize([...set]));
|
|
391
|
-
}
|
|
392
|
-
}
|
|
393
|
-
var snapshots2 = /* @__PURE__ */ new WeakMap();
|
|
394
|
-
function restoreAttributes2(element_or_elements) {
|
|
395
|
-
for (const element of Array.isArray(element_or_elements) ? element_or_elements : [element_or_elements]) {
|
|
396
|
-
const snapshot = snapshots2.get(element);
|
|
397
|
-
if (!snapshot) {
|
|
398
|
-
continue;
|
|
399
|
-
}
|
|
400
|
-
for (const [name, value] of snapshot.entries()) {
|
|
401
|
-
value === null ? element.removeAttribute(name) : element.setAttribute(name, value);
|
|
402
|
-
}
|
|
403
|
-
snapshots2.delete(element);
|
|
404
|
-
}
|
|
405
|
-
}
|
|
406
|
-
function saveAttributes2(element_or_elements, name_or_names) {
|
|
407
|
-
const names = Array.isArray(name_or_names) ? name_or_names : [name_or_names];
|
|
408
|
-
(Array.isArray(element_or_elements) ? element_or_elements : [element_or_elements]).forEach((element) => {
|
|
409
|
-
let snapshot = snapshots2.get(element);
|
|
410
|
-
if (!snapshot) {
|
|
411
|
-
snapshot = /* @__PURE__ */ new Map();
|
|
412
|
-
snapshots2.set(element, snapshot);
|
|
413
|
-
}
|
|
414
|
-
names.forEach((name) => {
|
|
415
|
-
snapshot.set(name, element.getAttribute(name));
|
|
416
|
-
});
|
|
417
|
-
});
|
|
418
|
-
}
|
|
419
|
-
|
|
420
369
|
// node_modules/@y14e/roving-tabindex/dist/index.js
|
|
421
370
|
function createRovingTabIndex(container, options = {}) {
|
|
422
371
|
if (!(container instanceof Element)) {
|
|
@@ -508,7 +457,7 @@ var RovingTabIndex = class _RovingTabIndex {
|
|
|
508
457
|
this.#controller = null;
|
|
509
458
|
this.#focusables.forEach((focusable) => {
|
|
510
459
|
_RovingTabIndex.#initialized.delete(focusable);
|
|
511
|
-
|
|
460
|
+
restoreAttributes(focusable);
|
|
512
461
|
});
|
|
513
462
|
this.#focusables.clear();
|
|
514
463
|
this.#focusablesByFirstChar.clear();
|
|
@@ -613,7 +562,7 @@ var RovingTabIndex = class _RovingTabIndex {
|
|
|
613
562
|
for (const focusable of this.#focusables) {
|
|
614
563
|
if (!current.has(focusable)) {
|
|
615
564
|
_RovingTabIndex.#initialized.delete(focusable);
|
|
616
|
-
|
|
565
|
+
restoreAttributes(focusable);
|
|
617
566
|
this.#focusables.delete(focusable);
|
|
618
567
|
for (const [key, focusables] of this.#focusablesByFirstChar) {
|
|
619
568
|
const index = focusables.indexOf(focusable);
|
|
@@ -635,7 +584,7 @@ var RovingTabIndex = class _RovingTabIndex {
|
|
|
635
584
|
this.#focusables.add(focusable);
|
|
636
585
|
_RovingTabIndex.#initialized.add(focusable);
|
|
637
586
|
if (!navigationOnly) {
|
|
638
|
-
|
|
587
|
+
saveAttributes(focusable, "tabindex");
|
|
639
588
|
focusable.setAttribute("tabindex", "-1");
|
|
640
589
|
}
|
|
641
590
|
if (!typeahead) {
|
|
@@ -648,8 +597,8 @@ var RovingTabIndex = class _RovingTabIndex {
|
|
|
648
597
|
);
|
|
649
598
|
if (char) {
|
|
650
599
|
keys.add(char);
|
|
651
|
-
|
|
652
|
-
|
|
600
|
+
saveAttributes(focusable, "aria-keyshortcuts");
|
|
601
|
+
addAttributeToken(focusable, "aria-keyshortcuts", char, {
|
|
653
602
|
caseInsensitive: true
|
|
654
603
|
});
|
|
655
604
|
}
|
|
@@ -779,7 +728,10 @@ var Accordion = class _Accordion {
|
|
|
779
728
|
});
|
|
780
729
|
this.#animationController?.abort();
|
|
781
730
|
this.#animationController = null;
|
|
782
|
-
restoreAttributes([
|
|
731
|
+
restoreAttributes([
|
|
732
|
+
...this.#triggerElements,
|
|
733
|
+
...this.#contentElements
|
|
734
|
+
]);
|
|
783
735
|
this.#triggerElements.length = 0;
|
|
784
736
|
this.#contentElements.length = 0;
|
|
785
737
|
this.#rootElement.removeAttribute("data-accordion-initialized");
|
|
@@ -802,7 +754,11 @@ var Accordion = class _Accordion {
|
|
|
802
754
|
"style",
|
|
803
755
|
"tabindex"
|
|
804
756
|
]);
|
|
805
|
-
saveAttributes(this.#contentElements, [
|
|
757
|
+
saveAttributes(this.#contentElements, [
|
|
758
|
+
"aria-labelledby",
|
|
759
|
+
"id",
|
|
760
|
+
"role"
|
|
761
|
+
]);
|
|
806
762
|
this.#eventController = new AbortController();
|
|
807
763
|
const { signal } = this.#eventController;
|
|
808
764
|
this.#triggerElements.forEach((trigger2, i) => {
|
|
@@ -812,7 +768,7 @@ var Accordion = class _Accordion {
|
|
|
812
768
|
return;
|
|
813
769
|
}
|
|
814
770
|
content2.id ||= `accordion-content-${id}`;
|
|
815
|
-
|
|
771
|
+
addAttributeToken(trigger2, "aria-controls", content2.id);
|
|
816
772
|
trigger2.setAttribute(
|
|
817
773
|
"aria-expanded",
|
|
818
774
|
String(trigger2.ariaExpanded === "true")
|
|
@@ -824,7 +780,7 @@ var Accordion = class _Accordion {
|
|
|
824
780
|
trigger2.style.setProperty("pointer-events", "none");
|
|
825
781
|
}
|
|
826
782
|
trigger2.addEventListener("click", this.#onTriggerClick, { signal });
|
|
827
|
-
|
|
783
|
+
addAttributeToken(content2, "aria-labelledby", trigger2.id);
|
|
828
784
|
content2.setAttribute("role", "region");
|
|
829
785
|
content2.addEventListener("beforematch", this.#onContentBeforeMatch, {
|
|
830
786
|
signal
|
|
@@ -959,7 +915,7 @@ function waitAnimationFinish(animation) {
|
|
|
959
915
|
* Accordion
|
|
960
916
|
* WAI-ARIA compliant accordion pattern implementation in TypeScript.
|
|
961
917
|
*
|
|
962
|
-
* @version 2.0.
|
|
918
|
+
* @version 2.0.6
|
|
963
919
|
* @author Yusuke Kamiyamane
|
|
964
920
|
* @license MIT
|
|
965
921
|
* @copyright Copyright (c) Yusuke Kamiyamane
|
|
@@ -967,15 +923,15 @@ function waitAnimationFinish(animation) {
|
|
|
967
923
|
*/
|
|
968
924
|
/*! Bundled license information:
|
|
969
925
|
|
|
970
|
-
@y14e/
|
|
926
|
+
@y14e/attribute-util/dist/index.js:
|
|
971
927
|
(**
|
|
972
|
-
*
|
|
928
|
+
* Attribute Util
|
|
973
929
|
*
|
|
974
|
-
* @version 2.0.
|
|
930
|
+
* @version 2.0.1
|
|
975
931
|
* @author Yusuke Kamiyamane
|
|
976
932
|
* @license MIT
|
|
977
933
|
* @copyright Copyright (c) Yusuke Kamiyamane
|
|
978
|
-
* @see {@link https://github.com/y14e/
|
|
934
|
+
* @see {@link https://github.com/y14e/attribute-util}
|
|
979
935
|
*)
|
|
980
936
|
|
|
981
937
|
power-focusable/dist/index.js:
|
|
@@ -984,7 +940,7 @@ power-focusable/dist/index.js:
|
|
|
984
940
|
* High-precision focus management utility with full composed tree support.
|
|
985
941
|
* Handles complex focus rules including tabindex ordering, radio groups, inert.
|
|
986
942
|
*
|
|
987
|
-
* @version 4.3.
|
|
943
|
+
* @version 4.3.25
|
|
988
944
|
* @author Yusuke Kamiyamane
|
|
989
945
|
* @license MIT
|
|
990
946
|
* @copyright Copyright (c) Yusuke Kamiyamane
|
|
@@ -995,31 +951,20 @@ power-focusable/dist/index.js:
|
|
|
995
951
|
(**
|
|
996
952
|
* Button
|
|
997
953
|
*
|
|
998
|
-
* @version 1.0.
|
|
954
|
+
* @version 1.0.7
|
|
999
955
|
* @author Yusuke Kamiyamane
|
|
1000
956
|
* @license MIT
|
|
1001
957
|
* @copyright Copyright (c) Yusuke Kamiyamane
|
|
1002
958
|
* @see {@link https://github.com/y14e/button}
|
|
1003
959
|
*)
|
|
1004
960
|
|
|
1005
|
-
@y14e/attributes-utils/dist/index.js:
|
|
1006
|
-
(**
|
|
1007
|
-
* Attributes Utils
|
|
1008
|
-
*
|
|
1009
|
-
* @version 1.1.7
|
|
1010
|
-
* @author Yusuke Kamiyamane
|
|
1011
|
-
* @license MIT
|
|
1012
|
-
* @copyright Copyright (c) Yusuke Kamiyamane
|
|
1013
|
-
* @see {@link https://github.com/y14e/attributes-utils}
|
|
1014
|
-
*)
|
|
1015
|
-
|
|
1016
961
|
@y14e/roving-tabindex/dist/index.js:
|
|
1017
962
|
(**
|
|
1018
963
|
* Roving Tabindex
|
|
1019
964
|
* Lightweight roving tabindex utility with fully focus management.
|
|
1020
965
|
* Designed for accessible menus, tabs, toolbars, and composite widgets.
|
|
1021
966
|
*
|
|
1022
|
-
* @version 3.1.
|
|
967
|
+
* @version 3.1.22
|
|
1023
968
|
* @author Yusuke Kamiyamane
|
|
1024
969
|
* @license MIT
|
|
1025
970
|
* @copyright Copyright (c) Yusuke Kamiyamane
|
package/dist/index.cjs
CHANGED
|
@@ -1,11 +1,30 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var
|
|
3
|
+
var util = require('@y14e/attribute-util');
|
|
4
4
|
var Button = require('@y14e/button');
|
|
5
5
|
var rovingTabindex = require('@y14e/roving-tabindex');
|
|
6
6
|
|
|
7
7
|
function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
|
|
8
8
|
|
|
9
|
+
function _interopNamespace(e) {
|
|
10
|
+
if (e && e.__esModule) return e;
|
|
11
|
+
var n = Object.create(null);
|
|
12
|
+
if (e) {
|
|
13
|
+
Object.keys(e).forEach(function (k) {
|
|
14
|
+
if (k !== 'default') {
|
|
15
|
+
var d = Object.getOwnPropertyDescriptor(e, k);
|
|
16
|
+
Object.defineProperty(n, k, d.get ? d : {
|
|
17
|
+
enumerable: true,
|
|
18
|
+
get: function () { return e[k]; }
|
|
19
|
+
});
|
|
20
|
+
}
|
|
21
|
+
});
|
|
22
|
+
}
|
|
23
|
+
n.default = e;
|
|
24
|
+
return Object.freeze(n);
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
var util__namespace = /*#__PURE__*/_interopNamespace(util);
|
|
9
28
|
var Button__default = /*#__PURE__*/_interopDefault(Button);
|
|
10
29
|
|
|
11
30
|
// src/index.ts
|
|
@@ -102,7 +121,10 @@ var Accordion = class _Accordion {
|
|
|
102
121
|
});
|
|
103
122
|
this.#animationController?.abort();
|
|
104
123
|
this.#animationController = null;
|
|
105
|
-
|
|
124
|
+
util__namespace.restoreAttributes([
|
|
125
|
+
...this.#triggerElements,
|
|
126
|
+
...this.#contentElements
|
|
127
|
+
]);
|
|
106
128
|
this.#triggerElements.length = 0;
|
|
107
129
|
this.#contentElements.length = 0;
|
|
108
130
|
this.#rootElement.removeAttribute("data-accordion-initialized");
|
|
@@ -118,14 +140,18 @@ var Accordion = class _Accordion {
|
|
|
118
140
|
this.#toggle(trigger, true);
|
|
119
141
|
}
|
|
120
142
|
#initialize() {
|
|
121
|
-
|
|
143
|
+
util__namespace.saveAttributes(this.#triggerElements, [
|
|
122
144
|
"aria-controls",
|
|
123
145
|
"aria-disabled",
|
|
124
146
|
"id",
|
|
125
147
|
"style",
|
|
126
148
|
"tabindex"
|
|
127
149
|
]);
|
|
128
|
-
|
|
150
|
+
util__namespace.saveAttributes(this.#contentElements, [
|
|
151
|
+
"aria-labelledby",
|
|
152
|
+
"id",
|
|
153
|
+
"role"
|
|
154
|
+
]);
|
|
129
155
|
this.#eventController = new AbortController();
|
|
130
156
|
const { signal } = this.#eventController;
|
|
131
157
|
this.#triggerElements.forEach((trigger2, i) => {
|
|
@@ -135,7 +161,7 @@ var Accordion = class _Accordion {
|
|
|
135
161
|
return;
|
|
136
162
|
}
|
|
137
163
|
content2.id ||= `accordion-content-${id}`;
|
|
138
|
-
|
|
164
|
+
util__namespace.addAttributeToken(trigger2, "aria-controls", content2.id);
|
|
139
165
|
trigger2.setAttribute(
|
|
140
166
|
"aria-expanded",
|
|
141
167
|
String(trigger2.ariaExpanded === "true")
|
|
@@ -147,7 +173,7 @@ var Accordion = class _Accordion {
|
|
|
147
173
|
trigger2.style.setProperty("pointer-events", "none");
|
|
148
174
|
}
|
|
149
175
|
trigger2.addEventListener("click", this.#onTriggerClick, { signal });
|
|
150
|
-
|
|
176
|
+
util__namespace.addAttributeToken(content2, "aria-labelledby", trigger2.id);
|
|
151
177
|
content2.setAttribute("role", "region");
|
|
152
178
|
content2.addEventListener("beforematch", this.#onContentBeforeMatch, {
|
|
153
179
|
signal
|
|
@@ -282,7 +308,7 @@ function waitAnimationFinish(animation) {
|
|
|
282
308
|
* Accordion
|
|
283
309
|
* WAI-ARIA compliant accordion pattern implementation in TypeScript.
|
|
284
310
|
*
|
|
285
|
-
* @version 2.0.
|
|
311
|
+
* @version 2.0.6
|
|
286
312
|
* @author Yusuke Kamiyamane
|
|
287
313
|
* @license MIT
|
|
288
314
|
* @copyright Copyright (c) Yusuke Kamiyamane
|
package/dist/index.d.cts
CHANGED
package/dist/index.d.ts
CHANGED
package/dist/index.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import
|
|
1
|
+
import * as util from '@y14e/attribute-util';
|
|
2
2
|
import Button from '@y14e/button';
|
|
3
3
|
import { createRovingTabIndex } from '@y14e/roving-tabindex';
|
|
4
4
|
|
|
@@ -96,7 +96,10 @@ var Accordion = class _Accordion {
|
|
|
96
96
|
});
|
|
97
97
|
this.#animationController?.abort();
|
|
98
98
|
this.#animationController = null;
|
|
99
|
-
restoreAttributes([
|
|
99
|
+
util.restoreAttributes([
|
|
100
|
+
...this.#triggerElements,
|
|
101
|
+
...this.#contentElements
|
|
102
|
+
]);
|
|
100
103
|
this.#triggerElements.length = 0;
|
|
101
104
|
this.#contentElements.length = 0;
|
|
102
105
|
this.#rootElement.removeAttribute("data-accordion-initialized");
|
|
@@ -112,14 +115,18 @@ var Accordion = class _Accordion {
|
|
|
112
115
|
this.#toggle(trigger, true);
|
|
113
116
|
}
|
|
114
117
|
#initialize() {
|
|
115
|
-
saveAttributes(this.#triggerElements, [
|
|
118
|
+
util.saveAttributes(this.#triggerElements, [
|
|
116
119
|
"aria-controls",
|
|
117
120
|
"aria-disabled",
|
|
118
121
|
"id",
|
|
119
122
|
"style",
|
|
120
123
|
"tabindex"
|
|
121
124
|
]);
|
|
122
|
-
saveAttributes(this.#contentElements, [
|
|
125
|
+
util.saveAttributes(this.#contentElements, [
|
|
126
|
+
"aria-labelledby",
|
|
127
|
+
"id",
|
|
128
|
+
"role"
|
|
129
|
+
]);
|
|
123
130
|
this.#eventController = new AbortController();
|
|
124
131
|
const { signal } = this.#eventController;
|
|
125
132
|
this.#triggerElements.forEach((trigger2, i) => {
|
|
@@ -129,7 +136,7 @@ var Accordion = class _Accordion {
|
|
|
129
136
|
return;
|
|
130
137
|
}
|
|
131
138
|
content2.id ||= `accordion-content-${id}`;
|
|
132
|
-
|
|
139
|
+
util.addAttributeToken(trigger2, "aria-controls", content2.id);
|
|
133
140
|
trigger2.setAttribute(
|
|
134
141
|
"aria-expanded",
|
|
135
142
|
String(trigger2.ariaExpanded === "true")
|
|
@@ -141,7 +148,7 @@ var Accordion = class _Accordion {
|
|
|
141
148
|
trigger2.style.setProperty("pointer-events", "none");
|
|
142
149
|
}
|
|
143
150
|
trigger2.addEventListener("click", this.#onTriggerClick, { signal });
|
|
144
|
-
|
|
151
|
+
util.addAttributeToken(content2, "aria-labelledby", trigger2.id);
|
|
145
152
|
content2.setAttribute("role", "region");
|
|
146
153
|
content2.addEventListener("beforematch", this.#onContentBeforeMatch, {
|
|
147
154
|
signal
|
|
@@ -276,7 +283,7 @@ function waitAnimationFinish(animation) {
|
|
|
276
283
|
* Accordion
|
|
277
284
|
* WAI-ARIA compliant accordion pattern implementation in TypeScript.
|
|
278
285
|
*
|
|
279
|
-
* @version 2.0.
|
|
286
|
+
* @version 2.0.6
|
|
280
287
|
* @author Yusuke Kamiyamane
|
|
281
288
|
* @license MIT
|
|
282
289
|
* @copyright Copyright (c) Yusuke Kamiyamane
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@y14e/accordion",
|
|
3
|
-
"version": "2.0.
|
|
3
|
+
"version": "2.0.6",
|
|
4
4
|
"description": "WAI-ARIA compliant accordion pattern implementation in TypeScript",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "./dist/index.cjs",
|
|
@@ -51,8 +51,8 @@
|
|
|
51
51
|
"node": ">=18"
|
|
52
52
|
},
|
|
53
53
|
"dependencies": {
|
|
54
|
-
"@y14e/
|
|
55
|
-
"@y14e/button": "^1.0.
|
|
56
|
-
"@y14e/roving-tabindex": "^3.1.
|
|
54
|
+
"@y14e/attribute-util": "^2.0.1",
|
|
55
|
+
"@y14e/button": "^1.0.7",
|
|
56
|
+
"@y14e/roving-tabindex": "^3.1.22"
|
|
57
57
|
}
|
|
58
58
|
}
|