@y14e/tabs 1.5.9 → 2.0.0
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 +5 -5
- package/dist/index.cjs +8 -8
- package/dist/index.d.cts +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.js +8 -8
- package/package.json +3 -3
package/README.md
CHANGED
|
@@ -10,14 +10,14 @@ npm i @y14e/tabs
|
|
|
10
10
|
|
|
11
11
|
```ts
|
|
12
12
|
// npm
|
|
13
|
-
import Tabs from '@y14e/tabs@
|
|
13
|
+
import Tabs from '@y14e/tabs@2.0.0';
|
|
14
14
|
|
|
15
15
|
// CDNs
|
|
16
|
-
import Tabs from 'https://esm.sh/@y14e/tabs@
|
|
16
|
+
import Tabs from 'https://esm.sh/@y14e/tabs@2.0.0';
|
|
17
17
|
// or
|
|
18
|
-
import Tabs from 'https://cdn.jsdelivr.net/npm/@y14e/tabs@
|
|
18
|
+
import Tabs from 'https://cdn.jsdelivr.net/npm/@y14e/tabs@2.0.0/+esm';
|
|
19
19
|
// or
|
|
20
|
-
import Tabs from 'https://esm.unpkg.com/@y14e/tabs@
|
|
20
|
+
import Tabs from 'https://esm.unpkg.com/@y14e/tabs@2.0.0';
|
|
21
21
|
```
|
|
22
22
|
|
|
23
23
|
## Usage
|
|
@@ -39,7 +39,7 @@ interface TabsOptions {
|
|
|
39
39
|
crossFade?: boolean; // default: true
|
|
40
40
|
duration?: number; // ms (default: 300)
|
|
41
41
|
easing?: string; // <easing-function> (default: 'ease')
|
|
42
|
-
fade?: boolean; // default:
|
|
42
|
+
fade?: boolean; // default: true
|
|
43
43
|
};
|
|
44
44
|
indicator?: {
|
|
45
45
|
duration?: number; // ms (default: 300)
|
package/dist/index.cjs
CHANGED
|
@@ -572,11 +572,11 @@ var RovingTabIndex = class {
|
|
|
572
572
|
if (!typeahead) {
|
|
573
573
|
continue;
|
|
574
574
|
}
|
|
575
|
+
const char = focusable.textContent?.trim()?.at(0)?.toUpperCase();
|
|
575
576
|
const value = focusable.ariaKeyShortcuts?.trim();
|
|
576
577
|
const keys = new Set(
|
|
577
578
|
value ? value.split(/\s+/).filter((key) => /^\S$/i.test(key)).map((key) => key.toUpperCase()) : []
|
|
578
579
|
);
|
|
579
|
-
const char = focusable.textContent?.trim()?.at(0)?.toUpperCase();
|
|
580
580
|
if (char) {
|
|
581
581
|
keys.add(char);
|
|
582
582
|
saveAttributes2([focusable], ["aria-keyshortcuts"]);
|
|
@@ -636,7 +636,7 @@ var Tabs = class _Tabs {
|
|
|
636
636
|
crossFade: true,
|
|
637
637
|
duration: 300,
|
|
638
638
|
easing: "ease",
|
|
639
|
-
fade:
|
|
639
|
+
fade: true
|
|
640
640
|
},
|
|
641
641
|
indicator: {
|
|
642
642
|
duration: 300,
|
|
@@ -774,7 +774,7 @@ var Tabs = class _Tabs {
|
|
|
774
774
|
}
|
|
775
775
|
this.#panelElements.forEach((p) => {
|
|
776
776
|
const { style: style2 } = p;
|
|
777
|
-
if (
|
|
777
|
+
if (fade) {
|
|
778
778
|
style2.setProperty("content-visibility", "visible");
|
|
779
779
|
style2.setProperty("display", "block");
|
|
780
780
|
style2.setProperty("opacity", p.hidden ? "0" : "1");
|
|
@@ -840,10 +840,10 @@ var Tabs = class _Tabs {
|
|
|
840
840
|
const isSelected = p === panel;
|
|
841
841
|
const animation2 = p.animate(
|
|
842
842
|
{
|
|
843
|
-
opacity: fade ? isSelected ? [opacity,
|
|
843
|
+
opacity: crossFade || !fade ? isSelected ? [opacity, "1"] : [opacity, "0"] : isSelected ? [opacity, opacity, "1"] : [opacity, "0", "0"]
|
|
844
844
|
},
|
|
845
845
|
{
|
|
846
|
-
duration: isMatch || !
|
|
846
|
+
duration: isMatch || !fade ? 0 : this.#settings.animation.content.duration,
|
|
847
847
|
easing: "ease"
|
|
848
848
|
}
|
|
849
849
|
);
|
|
@@ -1145,7 +1145,7 @@ function isFocusable2(element) {
|
|
|
1145
1145
|
* Tabs
|
|
1146
1146
|
* WAI-ARIA compliant tabs pattern implementation in TypeScript.
|
|
1147
1147
|
*
|
|
1148
|
-
* @version
|
|
1148
|
+
* @version 2.0.0
|
|
1149
1149
|
* @author Yusuke Kamiyamane
|
|
1150
1150
|
* @license MIT
|
|
1151
1151
|
* @copyright Copyright (c) Yusuke Kamiyamane
|
|
@@ -1168,7 +1168,7 @@ function isFocusable2(element) {
|
|
|
1168
1168
|
(**
|
|
1169
1169
|
* Button
|
|
1170
1170
|
*
|
|
1171
|
-
* @version 1.0.
|
|
1171
|
+
* @version 1.0.2
|
|
1172
1172
|
* @author Yusuke Kamiyamane
|
|
1173
1173
|
* @license MIT
|
|
1174
1174
|
* @copyright Copyright (c) Yusuke Kamiyamane
|
|
@@ -1181,7 +1181,7 @@ function isFocusable2(element) {
|
|
|
1181
1181
|
* Lightweight roving tabindex utility with fully focus management.
|
|
1182
1182
|
* Designed for accessible menus, tabs, toolbars, and composite widgets.
|
|
1183
1183
|
*
|
|
1184
|
-
* @version 3.0.
|
|
1184
|
+
* @version 3.0.5
|
|
1185
1185
|
* @author Yusuke Kamiyamane
|
|
1186
1186
|
* @license MIT
|
|
1187
1187
|
* @copyright Copyright (c) Yusuke Kamiyamane
|
package/dist/index.d.cts
CHANGED
package/dist/index.d.ts
CHANGED
package/dist/index.js
CHANGED
|
@@ -570,11 +570,11 @@ var RovingTabIndex = class {
|
|
|
570
570
|
if (!typeahead) {
|
|
571
571
|
continue;
|
|
572
572
|
}
|
|
573
|
+
const char = focusable.textContent?.trim()?.at(0)?.toUpperCase();
|
|
573
574
|
const value = focusable.ariaKeyShortcuts?.trim();
|
|
574
575
|
const keys = new Set(
|
|
575
576
|
value ? value.split(/\s+/).filter((key) => /^\S$/i.test(key)).map((key) => key.toUpperCase()) : []
|
|
576
577
|
);
|
|
577
|
-
const char = focusable.textContent?.trim()?.at(0)?.toUpperCase();
|
|
578
578
|
if (char) {
|
|
579
579
|
keys.add(char);
|
|
580
580
|
saveAttributes2([focusable], ["aria-keyshortcuts"]);
|
|
@@ -634,7 +634,7 @@ var Tabs = class _Tabs {
|
|
|
634
634
|
crossFade: true,
|
|
635
635
|
duration: 300,
|
|
636
636
|
easing: "ease",
|
|
637
|
-
fade:
|
|
637
|
+
fade: true
|
|
638
638
|
},
|
|
639
639
|
indicator: {
|
|
640
640
|
duration: 300,
|
|
@@ -772,7 +772,7 @@ var Tabs = class _Tabs {
|
|
|
772
772
|
}
|
|
773
773
|
this.#panelElements.forEach((p) => {
|
|
774
774
|
const { style: style2 } = p;
|
|
775
|
-
if (
|
|
775
|
+
if (fade) {
|
|
776
776
|
style2.setProperty("content-visibility", "visible");
|
|
777
777
|
style2.setProperty("display", "block");
|
|
778
778
|
style2.setProperty("opacity", p.hidden ? "0" : "1");
|
|
@@ -838,10 +838,10 @@ var Tabs = class _Tabs {
|
|
|
838
838
|
const isSelected = p === panel;
|
|
839
839
|
const animation2 = p.animate(
|
|
840
840
|
{
|
|
841
|
-
opacity: fade ? isSelected ? [opacity,
|
|
841
|
+
opacity: crossFade || !fade ? isSelected ? [opacity, "1"] : [opacity, "0"] : isSelected ? [opacity, opacity, "1"] : [opacity, "0", "0"]
|
|
842
842
|
},
|
|
843
843
|
{
|
|
844
|
-
duration: isMatch || !
|
|
844
|
+
duration: isMatch || !fade ? 0 : this.#settings.animation.content.duration,
|
|
845
845
|
easing: "ease"
|
|
846
846
|
}
|
|
847
847
|
);
|
|
@@ -1143,7 +1143,7 @@ function isFocusable2(element) {
|
|
|
1143
1143
|
* Tabs
|
|
1144
1144
|
* WAI-ARIA compliant tabs pattern implementation in TypeScript.
|
|
1145
1145
|
*
|
|
1146
|
-
* @version
|
|
1146
|
+
* @version 2.0.0
|
|
1147
1147
|
* @author Yusuke Kamiyamane
|
|
1148
1148
|
* @license MIT
|
|
1149
1149
|
* @copyright Copyright (c) Yusuke Kamiyamane
|
|
@@ -1166,7 +1166,7 @@ function isFocusable2(element) {
|
|
|
1166
1166
|
(**
|
|
1167
1167
|
* Button
|
|
1168
1168
|
*
|
|
1169
|
-
* @version 1.0.
|
|
1169
|
+
* @version 1.0.2
|
|
1170
1170
|
* @author Yusuke Kamiyamane
|
|
1171
1171
|
* @license MIT
|
|
1172
1172
|
* @copyright Copyright (c) Yusuke Kamiyamane
|
|
@@ -1179,7 +1179,7 @@ function isFocusable2(element) {
|
|
|
1179
1179
|
* Lightweight roving tabindex utility with fully focus management.
|
|
1180
1180
|
* Designed for accessible menus, tabs, toolbars, and composite widgets.
|
|
1181
1181
|
*
|
|
1182
|
-
* @version 3.0.
|
|
1182
|
+
* @version 3.0.5
|
|
1183
1183
|
* @author Yusuke Kamiyamane
|
|
1184
1184
|
* @license MIT
|
|
1185
1185
|
* @copyright Copyright (c) Yusuke Kamiyamane
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@y14e/tabs",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "2.0.0",
|
|
4
4
|
"description": "WAI-ARIA compliant tabs pattern implementation in TypeScript",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "./dist/index.cjs",
|
|
@@ -43,8 +43,8 @@
|
|
|
43
43
|
"homepage": "https://github.com/y14e/tabs#readme",
|
|
44
44
|
"devDependencies": {
|
|
45
45
|
"@y14e/attributes-utils": "^1.1.2",
|
|
46
|
-
"@y14e/button": "^1.0.
|
|
47
|
-
"@y14e/roving-tabindex": "^3.0.
|
|
46
|
+
"@y14e/button": "^1.0.2",
|
|
47
|
+
"@y14e/roving-tabindex": "^3.0.5",
|
|
48
48
|
"bun-types": "latest",
|
|
49
49
|
"tsup": "^8.0.0",
|
|
50
50
|
"typescript": "^5.6.0",
|