@ukic/web-components 2.28.0 → 2.29.1
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/cjs/core.cjs.js +1 -1
- package/dist/cjs/ic-accordion.cjs.entry.js +1 -1
- package/dist/cjs/ic-accordion.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-alert.cjs.entry.js +1 -1
- package/dist/cjs/ic-alert.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-popover-menu.cjs.entry.js +18 -12
- package/dist/cjs/ic-popover-menu.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-search-bar.cjs.entry.js +14 -27
- package/dist/cjs/ic-search-bar.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-select.cjs.entry.js +5 -5
- package/dist/cjs/ic-select.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-tab-context.cjs.entry.js +68 -145
- package/dist/cjs/ic-tab-context.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-tab-panel.cjs.entry.js +5 -13
- package/dist/cjs/ic-tab-panel.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-tab.cjs.entry.js +9 -10
- package/dist/cjs/ic-tab.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-text-field.cjs.entry.js +1 -1
- package/dist/cjs/ic-text-field.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-toast-region.cjs.entry.js +6 -0
- package/dist/cjs/ic-toast-region.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-typography.cjs.entry.js +3 -1
- package/dist/cjs/ic-typography.cjs.entry.js.map +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/collection/components/ic-accordion/ic-accordion.css +6 -0
- package/dist/collection/components/ic-alert/ic-alert.css +5 -0
- package/dist/collection/components/ic-popover-menu/ic-popover-menu.js +45 -12
- package/dist/collection/components/ic-popover-menu/ic-popover-menu.js.map +1 -1
- package/dist/collection/components/ic-search-bar/ic-search-bar.js +14 -27
- package/dist/collection/components/ic-search-bar/ic-search-bar.js.map +1 -1
- package/dist/collection/components/ic-select/ic-select.js +5 -5
- package/dist/collection/components/ic-select/ic-select.js.map +1 -1
- package/dist/collection/components/ic-tab/ic-tab.js +9 -10
- package/dist/collection/components/ic-tab/ic-tab.js.map +1 -1
- package/dist/collection/components/ic-tab-context/ic-tab-context.js +68 -145
- package/dist/collection/components/ic-tab-context/ic-tab-context.js.map +1 -1
- package/dist/collection/components/ic-tab-context/test/basic/ic-tab-context.spec.js +2 -2
- package/dist/collection/components/ic-tab-context/test/basic/ic-tab-context.spec.js.map +1 -1
- package/dist/collection/components/ic-tab-panel/ic-tab-panel.js +5 -73
- package/dist/collection/components/ic-tab-panel/ic-tab-panel.js.map +1 -1
- package/dist/collection/components/ic-text-field/ic-text-field.js +1 -1
- package/dist/collection/components/ic-text-field/ic-text-field.js.map +1 -1
- package/dist/collection/components/ic-toast-region/ic-toast-region.js +6 -0
- package/dist/collection/components/ic-toast-region/ic-toast-region.js.map +1 -1
- package/dist/collection/components/ic-typography/ic-typography.js +3 -1
- package/dist/collection/components/ic-typography/ic-typography.js.map +1 -1
- package/dist/components/ic-accordion.js +1 -1
- package/dist/components/ic-accordion.js.map +1 -1
- package/dist/components/ic-alert2.js +1 -1
- package/dist/components/ic-alert2.js.map +1 -1
- package/dist/components/ic-popover-menu.js +20 -13
- package/dist/components/ic-popover-menu.js.map +1 -1
- package/dist/components/ic-search-bar.js +14 -27
- package/dist/components/ic-search-bar.js.map +1 -1
- package/dist/components/ic-select.js +5 -5
- package/dist/components/ic-select.js.map +1 -1
- package/dist/components/ic-tab-context.js +68 -145
- package/dist/components/ic-tab-context.js.map +1 -1
- package/dist/components/ic-tab-panel.js +6 -17
- package/dist/components/ic-tab-panel.js.map +1 -1
- package/dist/components/ic-tab.js +9 -10
- package/dist/components/ic-tab.js.map +1 -1
- package/dist/components/ic-text-field2.js +1 -1
- package/dist/components/ic-text-field2.js.map +1 -1
- package/dist/components/ic-toast-region.js +6 -0
- package/dist/components/ic-toast-region.js.map +1 -1
- package/dist/components/ic-typography2.js +3 -1
- package/dist/components/ic-typography2.js.map +1 -1
- package/dist/core/core.esm.js +1 -1
- package/dist/core/core.esm.js.map +1 -1
- package/dist/core/{p-dcd475cc.entry.js → p-0432d31a.entry.js} +2 -2
- package/dist/core/p-0432d31a.entry.js.map +1 -0
- package/dist/core/{p-227f6a41.entry.js → p-2889cc17.entry.js} +2 -2
- package/dist/core/p-2889cc17.entry.js.map +1 -0
- package/dist/core/p-3969d3c0.entry.js +2 -0
- package/dist/core/p-3969d3c0.entry.js.map +1 -0
- package/dist/core/{p-60746e10.entry.js → p-4f0e9434.entry.js} +2 -2
- package/dist/core/p-4f0e9434.entry.js.map +1 -0
- package/dist/core/{p-4562904d.entry.js → p-72b0a5be.entry.js} +2 -2
- package/dist/core/{p-4562904d.entry.js.map → p-72b0a5be.entry.js.map} +1 -1
- package/dist/core/p-72b350bc.entry.js +2 -0
- package/dist/core/p-72b350bc.entry.js.map +1 -0
- package/dist/core/{p-db52d416.entry.js → p-8a8bf98c.entry.js} +2 -2
- package/dist/core/{p-db52d416.entry.js.map → p-8a8bf98c.entry.js.map} +1 -1
- package/dist/core/p-9df32798.entry.js +2 -0
- package/dist/core/p-9df32798.entry.js.map +1 -0
- package/dist/core/{p-49e997c7.entry.js → p-b1879a44.entry.js} +2 -2
- package/dist/core/p-b1879a44.entry.js.map +1 -0
- package/dist/core/p-bb4b7dcb.entry.js +2 -0
- package/dist/core/p-bb4b7dcb.entry.js.map +1 -0
- package/dist/core/{p-ed2b2bd7.entry.js → p-dd4ef67f.entry.js} +2 -2
- package/dist/core/{p-ed2b2bd7.entry.js.map → p-dd4ef67f.entry.js.map} +1 -1
- package/dist/esm/core.js +1 -1
- package/dist/esm/ic-accordion.entry.js +1 -1
- package/dist/esm/ic-accordion.entry.js.map +1 -1
- package/dist/esm/ic-alert.entry.js +1 -1
- package/dist/esm/ic-alert.entry.js.map +1 -1
- package/dist/esm/ic-popover-menu.entry.js +18 -12
- package/dist/esm/ic-popover-menu.entry.js.map +1 -1
- package/dist/esm/ic-search-bar.entry.js +14 -27
- package/dist/esm/ic-search-bar.entry.js.map +1 -1
- package/dist/esm/ic-select.entry.js +5 -5
- package/dist/esm/ic-select.entry.js.map +1 -1
- package/dist/esm/ic-tab-context.entry.js +68 -145
- package/dist/esm/ic-tab-context.entry.js.map +1 -1
- package/dist/esm/ic-tab-panel.entry.js +5 -13
- package/dist/esm/ic-tab-panel.entry.js.map +1 -1
- package/dist/esm/ic-tab.entry.js +9 -10
- package/dist/esm/ic-tab.entry.js.map +1 -1
- package/dist/esm/ic-text-field.entry.js +1 -1
- package/dist/esm/ic-text-field.entry.js.map +1 -1
- package/dist/esm/ic-toast-region.entry.js +6 -0
- package/dist/esm/ic-toast-region.entry.js.map +1 -1
- package/dist/esm/ic-typography.entry.js +3 -1
- package/dist/esm/ic-typography.entry.js.map +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/types/components/ic-popover-menu/ic-popover-menu.d.ts +2 -2
- package/dist/types/components/ic-tab-context/ic-tab-context.d.ts +9 -6
- package/dist/types/components/ic-tab-panel/ic-tab-panel.d.ts +0 -12
- package/dist/types/components/ic-toast-region/ic-toast-region.d.ts +1 -0
- package/dist/types/components.d.ts +4 -3
- package/hydrate/index.js +135 -221
- package/package.json +2 -2
- package/dist/collection/components/ic-radio-group/test/basic/ic-radio-group.e2e.js +0 -343
- package/dist/collection/components/ic-radio-group/test/basic/ic-radio-group.e2e.js.map +0 -1
- package/dist/collection/components/ic-search-bar/test/basic/ic-search-bar.e2e.js +0 -1106
- package/dist/collection/components/ic-search-bar/test/basic/ic-search-bar.e2e.js.map +0 -1
- package/dist/collection/components/ic-stepper/test/basic/ic-stepper.e2e.js +0 -49
- package/dist/collection/components/ic-stepper/test/basic/ic-stepper.e2e.js.map +0 -1
- package/dist/collection/components/ic-tab-panel/test/basic/ic-tab-panel.spec.js +0 -65
- package/dist/collection/components/ic-tab-panel/test/basic/ic-tab-panel.spec.js.map +0 -1
- package/dist/collection/components/ic-tooltip/test/basic/ic-tooltip.e2e.js +0 -109
- package/dist/collection/components/ic-tooltip/test/basic/ic-tooltip.e2e.js.map +0 -1
- package/dist/collection/components/ic-typography/test/basic/ic-typography.e2e.js +0 -39
- package/dist/collection/components/ic-typography/test/basic/ic-typography.e2e.js.map +0 -1
- package/dist/core/p-1145e33c.entry.js +0 -2
- package/dist/core/p-1145e33c.entry.js.map +0 -1
- package/dist/core/p-227f6a41.entry.js.map +0 -1
- package/dist/core/p-49e997c7.entry.js.map +0 -1
- package/dist/core/p-60746e10.entry.js.map +0 -1
- package/dist/core/p-9e15d0e1.entry.js +0 -2
- package/dist/core/p-9e15d0e1.entry.js.map +0 -1
- package/dist/core/p-cb14349b.entry.js +0 -2
- package/dist/core/p-cb14349b.entry.js.map +0 -1
- package/dist/core/p-dcd475cc.entry.js.map +0 -1
- package/dist/core/p-e735d773.entry.js +0 -2
- package/dist/core/p-e735d773.entry.js.map +0 -1
@@ -1,27 +1,32 @@
|
|
1
1
|
import { h, } from "@stencil/core";
|
2
2
|
import { IcThemeForegroundEnum, } from "../../utils/types";
|
3
|
+
const CONTEXT_ID_ATTR = "context-id";
|
3
4
|
export class TabContext {
|
4
5
|
constructor() {
|
5
6
|
this.newTabPanels = [];
|
6
7
|
this.newTabs = [];
|
7
|
-
|
8
|
+
this.emitEvents = (tabIndex) => {
|
9
|
+
const tabLabel = this.el
|
10
|
+
.querySelectorAll("ic-tab")
|
11
|
+
// eslint-disable-next-line no-unexpected-multiline
|
12
|
+
[tabIndex].textContent.trim();
|
13
|
+
this.icTabSelect.emit({ tabIndex, tabLabel });
|
14
|
+
this.tabSelect.emit({ tabIndex, tabLabel });
|
15
|
+
};
|
16
|
+
/** Sets attributes to link tab-group, tabs and tab-panels */
|
8
17
|
this.linkTabs = () => {
|
9
18
|
this.tabs.forEach((tab, index) => {
|
10
19
|
const tabId = `ic-tab-${index}-context-${this.contextId}`;
|
11
20
|
const tabPanelId = `ic-tab-panel-${index}-context-${this.contextId}`;
|
12
|
-
const shared = `ic-tab--${index}-context-${this.contextId}`;
|
13
|
-
const contextIdAttr = "context-id";
|
14
21
|
tab.setAttribute("id", tabId);
|
15
|
-
tab.tabId =
|
22
|
+
tab.tabId = `ic-tab--${index}-context-${this.contextId}`;
|
16
23
|
tab.tabPosition = index;
|
17
24
|
tab.setAttribute("aria-controls", tabPanelId);
|
18
|
-
tab.setAttribute(
|
19
|
-
this.tabGroup.setAttribute(
|
25
|
+
tab.setAttribute(CONTEXT_ID_ATTR, this.contextId);
|
26
|
+
this.tabGroup.setAttribute(CONTEXT_ID_ATTR, this.contextId);
|
20
27
|
this.tabPanels[index].setAttribute("id", tabPanelId);
|
21
|
-
this.tabPanels[index].panelId = shared;
|
22
|
-
this.tabPanels[index].tabPosition = index;
|
23
28
|
this.tabPanels[index].setAttribute("aria-labelledby", tabId);
|
24
|
-
this.tabPanels[index].setAttribute(
|
29
|
+
this.tabPanels[index].setAttribute(CONTEXT_ID_ATTR, this.contextId);
|
25
30
|
if (this.appearance === IcThemeForegroundEnum.Light) {
|
26
31
|
tab.appearance = this.appearance;
|
27
32
|
this.tabPanels[index].appearance = this.appearance;
|
@@ -31,8 +36,9 @@ export class TabContext {
|
|
31
36
|
this.tabGroup.appearance = this.appearance;
|
32
37
|
}
|
33
38
|
};
|
34
|
-
|
35
|
-
|
39
|
+
/**
|
40
|
+
* Gets tabs and tabpanels with the same context ID using querySelector to selector the children in relation to the host
|
41
|
+
*/
|
36
42
|
this.getChildren = () => {
|
37
43
|
this.tabGroup = this.el.querySelector("ic-tab-group");
|
38
44
|
this.tabs = Array.from(this.tabGroup.querySelectorAll("ic-tab"));
|
@@ -40,28 +46,42 @@ export class TabContext {
|
|
40
46
|
this.enabledTabs = this.getEnabledTabs();
|
41
47
|
};
|
42
48
|
this.keydownHandler = (event) => {
|
43
|
-
|
44
|
-
|
45
|
-
|
46
|
-
|
47
|
-
this.
|
48
|
-
|
49
|
-
|
50
|
-
|
51
|
-
|
52
|
-
|
53
|
-
|
54
|
-
|
55
|
-
|
56
|
-
|
57
|
-
|
58
|
-
|
59
|
-
|
49
|
+
const isManual = this.activationType === "manual";
|
50
|
+
const enabledTabIndex = this.enabledTabs.findIndex((tab) => tab.tabId ===
|
51
|
+
this.tabs[isManual ? this.focusedTabIndex : this.selectedTab].tabId);
|
52
|
+
const keyboardFunction = isManual
|
53
|
+
? this.keyboardFocusTab
|
54
|
+
: this.keyboardSelectTab;
|
55
|
+
let preventDefault = true;
|
56
|
+
switch (event.key) {
|
57
|
+
case "Home":
|
58
|
+
keyboardFunction(0);
|
59
|
+
break;
|
60
|
+
case "End":
|
61
|
+
keyboardFunction(this.enabledTabs.length - 1);
|
62
|
+
break;
|
63
|
+
case "ArrowRight":
|
64
|
+
keyboardFunction(enabledTabIndex < this.enabledTabs.length - 1
|
65
|
+
? enabledTabIndex + 1
|
66
|
+
: 0);
|
67
|
+
break;
|
68
|
+
case "ArrowLeft":
|
69
|
+
keyboardFunction((enabledTabIndex > 0 ? enabledTabIndex : this.enabledTabs.length) - 1);
|
70
|
+
break;
|
71
|
+
default:
|
72
|
+
if (isManual && (event.key === "Enter" || event.key === " ")) {
|
73
|
+
this.keyboardSelectTab(this.focusedTabIndex);
|
74
|
+
}
|
75
|
+
else {
|
76
|
+
preventDefault = false;
|
77
|
+
}
|
60
78
|
}
|
79
|
+
if (preventDefault)
|
80
|
+
event.preventDefault();
|
61
81
|
};
|
62
|
-
|
82
|
+
/** Sets the tab that is selected on initial render */
|
63
83
|
this.setInitialTab = () => {
|
64
|
-
if (this.
|
84
|
+
if (this.selectedTabIndex !== undefined) {
|
65
85
|
this.selectedTab = this.selectedTabIndex;
|
66
86
|
this.focusedTabIndex = this.selectedTabIndex;
|
67
87
|
}
|
@@ -71,120 +91,31 @@ export class TabContext {
|
|
71
91
|
this.focusedTabIndex = firstEnabledTabIndex;
|
72
92
|
}
|
73
93
|
};
|
74
|
-
|
94
|
+
/** Passes the selected tab to the tab and tab panel components */
|
75
95
|
this.configureTabs = () => {
|
76
96
|
this.enabledTabs.forEach((tab) => {
|
77
97
|
tab.selected = tab.tabPosition === this.selectedTab;
|
78
98
|
});
|
79
|
-
this.tabPanels.forEach((tabPanel) => {
|
80
|
-
tabPanel.
|
99
|
+
this.tabPanels.forEach((tabPanel, index) => {
|
100
|
+
tabPanel.hidden = index !== this.selectedTab;
|
81
101
|
});
|
82
102
|
};
|
83
|
-
this.getEnabledTabs = () =>
|
84
|
-
|
85
|
-
};
|
86
|
-
this.getIndexOfEnabledTab = (allTabsIndex) => {
|
87
|
-
return this.enabledTabs.findIndex((tab) => tab.tabId === this.tabs[allTabsIndex].tabId);
|
88
|
-
};
|
89
|
-
// Sets focus on tab and selects it
|
103
|
+
this.getEnabledTabs = () => Array.from(this.tabs).filter((child) => !child.disabled);
|
104
|
+
/** Sets focus on tab and selects it */
|
90
105
|
this.keyboardSelectTab = (enabledTabIndex) => {
|
91
106
|
const newIndex = this.tabs.findIndex((tab) => tab.tabId === this.enabledTabs[enabledTabIndex].tabId);
|
92
107
|
this.enabledTabs[enabledTabIndex].focus();
|
93
|
-
if (
|
108
|
+
if (this.selectedTabIndex === undefined) {
|
94
109
|
this.selectedTab = newIndex;
|
95
110
|
}
|
96
111
|
else {
|
97
|
-
|
98
|
-
this.icTabSelect.emit({
|
99
|
-
tabIndex: newIndex,
|
100
|
-
tabLabel: this.el
|
101
|
-
.querySelectorAll("ic-tab")[newIndex].textContent.trim(),
|
102
|
-
});
|
103
|
-
this.tabSelect.emit({
|
104
|
-
tabIndex: newIndex,
|
105
|
-
tabLabel: this.el
|
106
|
-
.querySelectorAll("ic-tab")[newIndex].textContent.trim(),
|
107
|
-
});
|
112
|
+
this.emitEvents(newIndex);
|
108
113
|
}
|
109
|
-
/* eslint-enable no-unexpected-multiline */
|
110
114
|
};
|
111
|
-
|
115
|
+
/** Sets focus on tab without selecting it (for manual activation) */
|
112
116
|
this.keyboardFocusTab = (enabledTabIndex) => {
|
113
|
-
const newIndex = this.tabs.findIndex((tab) => tab.tabId === this.enabledTabs[enabledTabIndex].tabId);
|
114
117
|
this.enabledTabs[enabledTabIndex].focus();
|
115
|
-
this.focusedTabIndex =
|
116
|
-
};
|
117
|
-
this.handleKeyBoardNavAutomatic = (event) => {
|
118
|
-
const key = event.key;
|
119
|
-
const enabledTabIndex = this.getIndexOfEnabledTab(this.selectedTab);
|
120
|
-
let preventDefault = true;
|
121
|
-
switch (key) {
|
122
|
-
case "Home":
|
123
|
-
this.keyboardSelectTab(0);
|
124
|
-
break;
|
125
|
-
case "End":
|
126
|
-
this.keyboardSelectTab(this.enabledTabs.length - 1);
|
127
|
-
break;
|
128
|
-
case "ArrowRight":
|
129
|
-
if (enabledTabIndex < this.enabledTabs.length - 1) {
|
130
|
-
this.keyboardSelectTab(enabledTabIndex + 1);
|
131
|
-
}
|
132
|
-
else {
|
133
|
-
this.keyboardSelectTab(0);
|
134
|
-
}
|
135
|
-
break;
|
136
|
-
case "ArrowLeft":
|
137
|
-
if (enabledTabIndex > 0) {
|
138
|
-
this.keyboardSelectTab(enabledTabIndex - 1);
|
139
|
-
}
|
140
|
-
else {
|
141
|
-
this.keyboardSelectTab(this.enabledTabs.length - 1);
|
142
|
-
}
|
143
|
-
break;
|
144
|
-
default:
|
145
|
-
preventDefault = false;
|
146
|
-
}
|
147
|
-
if (preventDefault)
|
148
|
-
event.preventDefault();
|
149
|
-
};
|
150
|
-
this.handleKeyBoardNavManual = (event) => {
|
151
|
-
const key = event.key;
|
152
|
-
const enabledTabIndex = this.getIndexOfEnabledTab(this.focusedTabIndex);
|
153
|
-
let preventDefault = true;
|
154
|
-
switch (key) {
|
155
|
-
case "Home":
|
156
|
-
this.keyboardFocusTab(0);
|
157
|
-
break;
|
158
|
-
case "End":
|
159
|
-
this.keyboardFocusTab(this.enabledTabs.length - 1);
|
160
|
-
break;
|
161
|
-
case "ArrowRight":
|
162
|
-
if (enabledTabIndex < this.enabledTabs.length - 1) {
|
163
|
-
this.keyboardFocusTab(enabledTabIndex + 1);
|
164
|
-
}
|
165
|
-
else {
|
166
|
-
this.keyboardFocusTab(0);
|
167
|
-
}
|
168
|
-
break;
|
169
|
-
case "ArrowLeft":
|
170
|
-
if (enabledTabIndex > 0) {
|
171
|
-
this.keyboardFocusTab(enabledTabIndex - 1);
|
172
|
-
}
|
173
|
-
else {
|
174
|
-
this.keyboardFocusTab(this.enabledTabs.length - 1);
|
175
|
-
}
|
176
|
-
break;
|
177
|
-
case "Enter":
|
178
|
-
this.keyboardSelectTab(this.focusedTabIndex);
|
179
|
-
break;
|
180
|
-
case " ":
|
181
|
-
this.keyboardSelectTab(this.focusedTabIndex);
|
182
|
-
break;
|
183
|
-
default:
|
184
|
-
preventDefault = false;
|
185
|
-
}
|
186
|
-
if (preventDefault)
|
187
|
-
event.preventDefault();
|
118
|
+
this.focusedTabIndex = this.tabs.findIndex((tab) => tab.tabId === this.enabledTabs[enabledTabIndex].tabId);
|
188
119
|
};
|
189
120
|
this.selectedTab = undefined;
|
190
121
|
this.activationType = "automatic";
|
@@ -203,10 +134,12 @@ export class TabContext {
|
|
203
134
|
this.selectedTab = newValue;
|
204
135
|
}
|
205
136
|
componentDidLoad() {
|
206
|
-
this.
|
137
|
+
if (this.selectedTabIndex !== undefined) {
|
138
|
+
this.selectedTab = this.selectedTabIndex;
|
139
|
+
}
|
207
140
|
this.getChildren();
|
208
141
|
this.linkTabs();
|
209
|
-
this.
|
142
|
+
this.tabGroup.addEventListener("keydown", this.keydownHandler);
|
210
143
|
this.setInitialTab();
|
211
144
|
this.configureTabs();
|
212
145
|
}
|
@@ -221,18 +154,7 @@ export class TabContext {
|
|
221
154
|
event.detail.contextId === this.contextId) {
|
222
155
|
this.selectedTab = event.detail.position;
|
223
156
|
}
|
224
|
-
|
225
|
-
this.icTabSelect.emit({
|
226
|
-
tabIndex: event.detail.position,
|
227
|
-
tabLabel: this.el
|
228
|
-
.querySelectorAll("ic-tab")[event.detail.position].textContent.trim(),
|
229
|
-
});
|
230
|
-
this.tabSelect.emit({
|
231
|
-
tabIndex: event.detail.position,
|
232
|
-
tabLabel: this.el
|
233
|
-
.querySelectorAll("ic-tab")[event.detail.position].textContent.trim(),
|
234
|
-
});
|
235
|
-
/* eslint-enable no-unexpected-multiline */
|
157
|
+
this.emitEvents(event.detail.position);
|
236
158
|
event.stopImmediatePropagation();
|
237
159
|
}
|
238
160
|
tabCreatedHandler(ev) {
|
@@ -243,6 +165,9 @@ export class TabContext {
|
|
243
165
|
this.tabPanels.push(...this.newTabPanels);
|
244
166
|
this.enabledTabs = this.getEnabledTabs();
|
245
167
|
this.linkTabs();
|
168
|
+
if (!this.tabs[this.selectedTab] || !this.tabPanels[this.selectedTab])
|
169
|
+
this.setInitialTab();
|
170
|
+
this.configureTabs();
|
246
171
|
this.newTabs = [];
|
247
172
|
this.newTabPanels = [];
|
248
173
|
}
|
@@ -256,12 +181,10 @@ export class TabContext {
|
|
256
181
|
*/
|
257
182
|
async tabRemovedHandler(hadFocus) {
|
258
183
|
this.getChildren();
|
259
|
-
this.enabledTabs = this.getEnabledTabs();
|
260
184
|
this.linkTabs();
|
261
185
|
if (this.tabs[this.selectedTab] && this.tabPanels[this.selectedTab]) {
|
262
186
|
this.tabs[this.selectedTab].selected = true;
|
263
|
-
this.tabPanels[this.selectedTab].
|
264
|
-
this.tabs[this.selectedTab].tabId;
|
187
|
+
this.tabPanels[this.selectedTab].hidden = false;
|
265
188
|
}
|
266
189
|
else {
|
267
190
|
this.setInitialTab();
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"ic-tab-context.js","sourceRoot":"","sources":["../../../src/components/ic-tab-context/ic-tab-context.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n Component,\n Element,\n Event,\n EventEmitter,\n Listen,\n Prop,\n State,\n h,\n Watch,\n Method,\n} from \"@stencil/core\";\nimport {\n IcActivationTypes,\n IcThemeForegroundNoDefault,\n IcThemeForegroundEnum,\n} from \"../../utils/types\";\n\nimport {\n IcTabClickEventDetail,\n IcTabSelectEventDetail,\n} from \"../ic-tab/ic-tab.types\";\n\n@Component({\n tag: \"ic-tab-context\",\n})\nexport class TabContext {\n private controlledMode: boolean;\n private enabledTabs: HTMLIcTabElement[];\n private focusedTabIndex: number;\n private newTabPanels: HTMLIcTabPanelElement[] = [];\n private newTabs: HTMLIcTabElement[] = [];\n private tabs: HTMLIcTabElement[];\n private tabGroup: HTMLIcTabGroupElement;\n private tabPanels: HTMLIcTabPanelElement[];\n\n @Element() el: HTMLIcTabContextElement;\n\n @State() selectedTab: number | null;\n\n /**\n * Determines whether tabs have to be manually activated (by pressing 'Enter' or 'Space') when they receive focus using keyboard navigation.\n */\n @Prop() activationType?: IcActivationTypes = \"automatic\";\n\n /**\n * The appearance of the tab context, e.g dark, or light.\n */\n @Prop() appearance?: IcThemeForegroundNoDefault = \"dark\";\n @Watch(\"appearance\")\n watchAppearanceHandler(): void {\n this.tabs.forEach((tab, index) => {\n tab.appearance = this.appearance;\n this.tabPanels[index].appearance = this.appearance;\n });\n this.tabGroup.appearance = this.appearance;\n }\n\n /**\n * The unique context needed if using multiple tabs inside one another i.e. rendering another set of tabs inside a tab panel.\n */\n @Prop({ reflect: true }) contextId?: string = \"default\";\n\n /**\n * The selected tab to be controlled by the user. Must be used alongside the icTabSelect event to manage tab selection.\n */\n @Prop() selectedTabIndex?: number;\n\n @Watch(\"selectedTabIndex\")\n updateSelectedTab(newValue: number): void {\n this.selectedTab = newValue;\n }\n\n /**\n * Emitted when a user selects a tab.\n */\n @Event({ bubbles: false }) icTabSelect: EventEmitter<IcTabSelectEventDetail>;\n\n /**\n * @deprecated This event should not be used anymore. Use icTabSelect instead.\n */\n @Event({ bubbles: false }) tabSelect: EventEmitter<IcTabSelectEventDetail>;\n\n componentDidLoad(): void {\n this.setControlledMode();\n this.getChildren();\n this.linkTabs();\n this.attachEventListeners();\n this.setInitialTab();\n this.configureTabs();\n }\n\n componentWillUpdate(): void {\n this.configureTabs();\n }\n\n disconnectedCallback(): void {\n this.tabGroup.removeEventListener(\"keydown\", this.keydownHandler);\n }\n\n @Listen(\"tabClick\")\n tabClickHandler(event: CustomEvent<IcTabClickEventDetail>): void {\n if (\n this.selectedTabIndex === undefined &&\n event.detail.contextId === this.contextId\n ) {\n this.selectedTab = event.detail.position;\n }\n /* eslint-disable no-unexpected-multiline */\n this.icTabSelect.emit({\n tabIndex: event.detail.position,\n tabLabel: this.el\n .querySelectorAll(\"ic-tab\")\n [event.detail.position].textContent.trim(),\n });\n this.tabSelect.emit({\n tabIndex: event.detail.position,\n tabLabel: this.el\n .querySelectorAll(\"ic-tab\")\n [event.detail.position].textContent.trim(),\n });\n /* eslint-enable no-unexpected-multiline */\n event.stopImmediatePropagation();\n }\n\n @Listen(\"tabCreated\")\n @Listen(\"tabPanelCreated\")\n tabCreatedHandler(ev: CustomEvent): void {\n if (this.tabs && this.tabPanels) {\n (ev.detail.setFocus ? this.newTabs : this.newTabPanels).push(ev.detail);\n if (this.newTabs.length === this.newTabPanels.length) {\n this.tabs.push(...this.newTabs);\n this.tabPanels.push(...this.newTabPanels);\n this.enabledTabs = this.getEnabledTabs();\n this.linkTabs();\n this.newTabs = [];\n this.newTabPanels = [];\n }\n }\n }\n\n @Listen(\"tabEnabled\")\n tabEnabledHandler(): void {\n this.enabledTabs = this.getEnabledTabs();\n }\n\n /**\n * @internal Used to set tab/tab panel IDs when a tab/tab panel has been removed\n */\n @Method()\n async tabRemovedHandler(hadFocus?: boolean): Promise<void> {\n this.getChildren();\n this.enabledTabs = this.getEnabledTabs();\n this.linkTabs();\n if (this.tabs[this.selectedTab] && this.tabPanels[this.selectedTab]) {\n this.tabs[this.selectedTab].selected = true;\n this.tabPanels[this.selectedTab].selectedTab =\n this.tabs[this.selectedTab].tabId;\n } else {\n this.setInitialTab();\n }\n\n if (hadFocus) {\n this.tabs[this.selectedTab].setFocus();\n }\n }\n\n // Sets attributes to link tab-group, tabs and tab-panels\n private linkTabs = () => {\n this.tabs.forEach((tab, index) => {\n const tabId = `ic-tab-${index}-context-${this.contextId}`;\n const tabPanelId = `ic-tab-panel-${index}-context-${this.contextId}`;\n const shared = `ic-tab--${index}-context-${this.contextId}`;\n const contextIdAttr = \"context-id\";\n tab.setAttribute(\"id\", tabId);\n tab.tabId = shared;\n tab.tabPosition = index;\n tab.setAttribute(\"aria-controls\", tabPanelId);\n tab.setAttribute(contextIdAttr, this.contextId);\n this.tabGroup.setAttribute(contextIdAttr, this.contextId);\n this.tabPanels[index].setAttribute(\"id\", tabPanelId);\n this.tabPanels[index].panelId = shared;\n this.tabPanels[index].tabPosition = index;\n this.tabPanels[index].setAttribute(\"aria-labelledby\", tabId);\n this.tabPanels[index].setAttribute(contextIdAttr, this.contextId);\n\n if (this.appearance === IcThemeForegroundEnum.Light) {\n tab.appearance = this.appearance;\n this.tabPanels[index].appearance = this.appearance;\n }\n });\n\n if (this.appearance === IcThemeForegroundEnum.Light) {\n this.tabGroup.appearance = this.appearance;\n }\n };\n\n // Gets tabs and tabpanels with the same context ID\n // Using querySelector to selector the children in relation to the host\n private getChildren = (): void => {\n this.tabGroup = this.el.querySelector(\"ic-tab-group\");\n this.tabs = Array.from(this.tabGroup.querySelectorAll(\"ic-tab\"));\n this.tabPanels = Array.from(this.el.children).filter(\n (child) => child.tagName === \"IC-TAB-PANEL\"\n ) as HTMLIcTabPanelElement[];\n this.enabledTabs = this.getEnabledTabs();\n };\n\n private keydownHandler = (event: KeyboardEvent) => {\n if (this.activationType === \"automatic\") {\n this.handleKeyBoardNavAutomatic(event);\n } else {\n this.handleKeyBoardNavManual(event);\n }\n };\n\n // Determines how keyboard navigation is to be handled based on the activation type\n private attachEventListeners = (): void => {\n this.tabGroup.addEventListener(\"keydown\", this.keydownHandler);\n };\n\n // Determines whether the selected tab is being controlled within the component\n // or by the user (via selectedTabIndex and onIcTabSelect)\n private setControlledMode = (): void => {\n if (this.selectedTabIndex !== undefined) {\n this.controlledMode = true;\n this.selectedTab = this.selectedTabIndex;\n }\n };\n\n // Sets the tab that is selected on initial render\n private setInitialTab = (): void => {\n if (this.controlledMode) {\n this.selectedTab = this.selectedTabIndex;\n this.focusedTabIndex = this.selectedTabIndex;\n } else {\n const firstEnabledTabIndex = this.tabs.findIndex(\n (tab) => tab.tabId === this.enabledTabs[0].tabId\n );\n this.selectedTab = firstEnabledTabIndex;\n this.focusedTabIndex = firstEnabledTabIndex;\n }\n };\n\n // Passes the selected tab to the tab and tab panel components\n private configureTabs = () => {\n this.enabledTabs.forEach((tab) => {\n tab.selected = tab.tabPosition === this.selectedTab;\n });\n this.tabPanels.forEach((tabPanel) => {\n tabPanel.selectedTab = this.tabs[this.selectedTab].tabId;\n });\n };\n\n private getEnabledTabs = () => {\n return Array.from(this.tabs).filter((child) => !child.disabled);\n };\n\n private getIndexOfEnabledTab = (allTabsIndex: number) => {\n return this.enabledTabs.findIndex(\n (tab) => tab.tabId === this.tabs[allTabsIndex].tabId\n );\n };\n\n // Sets focus on tab and selects it\n private keyboardSelectTab = (enabledTabIndex: number) => {\n const newIndex = this.tabs.findIndex(\n (tab) => tab.tabId === this.enabledTabs[enabledTabIndex].tabId\n );\n this.enabledTabs[enabledTabIndex].focus();\n if (!this.controlledMode) {\n this.selectedTab = newIndex;\n } else {\n /* eslint-disable no-unexpected-multiline */\n this.icTabSelect.emit({\n tabIndex: newIndex,\n tabLabel: this.el\n .querySelectorAll(\"ic-tab\")\n [newIndex].textContent.trim(),\n });\n this.tabSelect.emit({\n tabIndex: newIndex,\n tabLabel: this.el\n .querySelectorAll(\"ic-tab\")\n [newIndex].textContent.trim(),\n });\n }\n /* eslint-enable no-unexpected-multiline */\n };\n\n // Sets focus on tab without selecting it (for manual activation)\n private keyboardFocusTab = (enabledTabIndex: number) => {\n const newIndex = this.tabs.findIndex(\n (tab) => tab.tabId === this.enabledTabs[enabledTabIndex].tabId\n );\n this.enabledTabs[enabledTabIndex].focus();\n this.focusedTabIndex = newIndex;\n };\n\n private handleKeyBoardNavAutomatic = (event: KeyboardEvent) => {\n const key = event.key;\n const enabledTabIndex = this.getIndexOfEnabledTab(this.selectedTab);\n let preventDefault = true;\n switch (key) {\n case \"Home\":\n this.keyboardSelectTab(0);\n break;\n case \"End\":\n this.keyboardSelectTab(this.enabledTabs.length - 1);\n break;\n case \"ArrowRight\":\n if (enabledTabIndex < this.enabledTabs.length - 1) {\n this.keyboardSelectTab(enabledTabIndex + 1);\n } else {\n this.keyboardSelectTab(0);\n }\n break;\n case \"ArrowLeft\":\n if (enabledTabIndex > 0) {\n this.keyboardSelectTab(enabledTabIndex - 1);\n } else {\n this.keyboardSelectTab(this.enabledTabs.length - 1);\n }\n break;\n default:\n preventDefault = false;\n }\n if (preventDefault) event.preventDefault();\n };\n\n private handleKeyBoardNavManual = (event: KeyboardEvent) => {\n const key = event.key;\n const enabledTabIndex = this.getIndexOfEnabledTab(this.focusedTabIndex);\n let preventDefault = true;\n switch (key) {\n case \"Home\":\n this.keyboardFocusTab(0);\n break;\n case \"End\":\n this.keyboardFocusTab(this.enabledTabs.length - 1);\n break;\n case \"ArrowRight\":\n if (enabledTabIndex < this.enabledTabs.length - 1) {\n this.keyboardFocusTab(enabledTabIndex + 1);\n } else {\n this.keyboardFocusTab(0);\n }\n break;\n case \"ArrowLeft\":\n if (enabledTabIndex > 0) {\n this.keyboardFocusTab(enabledTabIndex - 1);\n } else {\n this.keyboardFocusTab(this.enabledTabs.length - 1);\n }\n break;\n case \"Enter\":\n this.keyboardSelectTab(this.focusedTabIndex);\n break;\n case \" \":\n this.keyboardSelectTab(this.focusedTabIndex);\n break;\n default:\n preventDefault = false;\n }\n if (preventDefault) event.preventDefault();\n };\n\n render() {\n return <slot></slot>;\n }\n}\n"]}
|
1
|
+
{"version":3,"file":"ic-tab-context.js","sourceRoot":"","sources":["../../../src/components/ic-tab-context/ic-tab-context.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n Component,\n Element,\n Event,\n EventEmitter,\n Listen,\n Prop,\n State,\n h,\n Watch,\n Method,\n} from \"@stencil/core\";\nimport {\n IcActivationTypes,\n IcThemeForegroundNoDefault,\n IcThemeForegroundEnum,\n} from \"../../utils/types\";\n\nimport {\n IcTabClickEventDetail,\n IcTabSelectEventDetail,\n} from \"../ic-tab/ic-tab.types\";\n\nconst CONTEXT_ID_ATTR = \"context-id\";\n\n@Component({\n tag: \"ic-tab-context\",\n})\nexport class TabContext {\n private enabledTabs: HTMLIcTabElement[];\n private focusedTabIndex: number;\n private newTabPanels: HTMLIcTabPanelElement[] = [];\n private newTabs: HTMLIcTabElement[] = [];\n private tabs: HTMLIcTabElement[];\n private tabGroup: HTMLIcTabGroupElement;\n private tabPanels: HTMLIcTabPanelElement[];\n\n @Element() el: HTMLIcTabContextElement;\n\n @State() selectedTab: number | null;\n\n /**\n * Determines whether tabs have to be manually activated (by pressing 'Enter' or 'Space') when they receive focus using keyboard navigation.\n */\n @Prop() activationType?: IcActivationTypes = \"automatic\";\n\n /**\n * The appearance of the tab context, e.g dark, or light.\n */\n @Prop() appearance?: IcThemeForegroundNoDefault = \"dark\";\n @Watch(\"appearance\")\n watchAppearanceHandler(): void {\n this.tabs.forEach((tab, index) => {\n tab.appearance = this.appearance;\n this.tabPanels[index].appearance = this.appearance;\n });\n this.tabGroup.appearance = this.appearance;\n }\n\n /**\n * The unique context needed if using multiple tabs inside one another i.e. rendering another set of tabs inside a tab panel.\n */\n @Prop({ reflect: true }) contextId?: string = \"default\";\n\n /**\n * The selected tab to be controlled by the user. Must be used alongside the icTabSelect event to manage tab selection.\n */\n @Prop() selectedTabIndex?: number;\n\n @Watch(\"selectedTabIndex\")\n updateSelectedTab(newValue: number): void {\n this.selectedTab = newValue;\n }\n\n /**\n * Emitted when a user selects a tab.\n */\n @Event({ bubbles: false }) icTabSelect: EventEmitter<IcTabSelectEventDetail>;\n\n /**\n * @deprecated This event should not be used anymore. Use icTabSelect instead.\n */\n @Event({ bubbles: false }) tabSelect: EventEmitter<IcTabSelectEventDetail>;\n\n componentDidLoad(): void {\n if (this.selectedTabIndex !== undefined) {\n this.selectedTab = this.selectedTabIndex;\n }\n this.getChildren();\n this.linkTabs();\n this.tabGroup.addEventListener(\"keydown\", this.keydownHandler);\n this.setInitialTab();\n this.configureTabs();\n }\n\n componentWillUpdate(): void {\n this.configureTabs();\n }\n\n disconnectedCallback(): void {\n this.tabGroup.removeEventListener(\"keydown\", this.keydownHandler);\n }\n\n @Listen(\"tabClick\")\n tabClickHandler(event: CustomEvent<IcTabClickEventDetail>): void {\n if (\n this.selectedTabIndex === undefined &&\n event.detail.contextId === this.contextId\n ) {\n this.selectedTab = event.detail.position;\n }\n this.emitEvents(event.detail.position);\n event.stopImmediatePropagation();\n }\n\n @Listen(\"tabCreated\")\n @Listen(\"tabPanelCreated\")\n tabCreatedHandler(ev: CustomEvent): void {\n if (this.tabs && this.tabPanels) {\n (ev.detail.setFocus ? this.newTabs : this.newTabPanels).push(ev.detail);\n if (this.newTabs.length === this.newTabPanels.length) {\n this.tabs.push(...this.newTabs);\n this.tabPanels.push(...this.newTabPanels);\n this.enabledTabs = this.getEnabledTabs();\n this.linkTabs();\n if (!this.tabs[this.selectedTab] || !this.tabPanels[this.selectedTab])\n this.setInitialTab();\n this.configureTabs();\n this.newTabs = [];\n this.newTabPanels = [];\n }\n }\n }\n\n @Listen(\"tabEnabled\")\n tabEnabledHandler(): void {\n this.enabledTabs = this.getEnabledTabs();\n }\n\n /**\n * @internal Used to set tab/tab panel IDs when a tab/tab panel has been removed\n */\n @Method()\n async tabRemovedHandler(hadFocus?: boolean): Promise<void> {\n this.getChildren();\n this.linkTabs();\n if (this.tabs[this.selectedTab] && this.tabPanels[this.selectedTab]) {\n this.tabs[this.selectedTab].selected = true;\n this.tabPanels[this.selectedTab].hidden = false;\n } else {\n this.setInitialTab();\n }\n\n if (hadFocus) {\n this.tabs[this.selectedTab].setFocus();\n }\n }\n\n private emitEvents = (tabIndex: number) => {\n const tabLabel = this.el\n .querySelectorAll(\"ic-tab\")\n // eslint-disable-next-line no-unexpected-multiline\n [tabIndex].textContent.trim();\n this.icTabSelect.emit({ tabIndex, tabLabel });\n this.tabSelect.emit({ tabIndex, tabLabel });\n };\n\n /** Sets attributes to link tab-group, tabs and tab-panels */\n private linkTabs = () => {\n this.tabs.forEach((tab, index) => {\n const tabId = `ic-tab-${index}-context-${this.contextId}`;\n const tabPanelId = `ic-tab-panel-${index}-context-${this.contextId}`;\n tab.setAttribute(\"id\", tabId);\n tab.tabId = `ic-tab--${index}-context-${this.contextId}`;\n tab.tabPosition = index;\n tab.setAttribute(\"aria-controls\", tabPanelId);\n tab.setAttribute(CONTEXT_ID_ATTR, this.contextId);\n this.tabGroup.setAttribute(CONTEXT_ID_ATTR, this.contextId);\n this.tabPanels[index].setAttribute(\"id\", tabPanelId);\n this.tabPanels[index].setAttribute(\"aria-labelledby\", tabId);\n this.tabPanels[index].setAttribute(CONTEXT_ID_ATTR, this.contextId);\n\n if (this.appearance === IcThemeForegroundEnum.Light) {\n tab.appearance = this.appearance;\n this.tabPanels[index].appearance = this.appearance;\n }\n });\n\n if (this.appearance === IcThemeForegroundEnum.Light) {\n this.tabGroup.appearance = this.appearance;\n }\n };\n\n /**\n * Gets tabs and tabpanels with the same context ID using querySelector to selector the children in relation to the host\n */\n private getChildren = (): void => {\n this.tabGroup = this.el.querySelector(\"ic-tab-group\");\n this.tabs = Array.from(this.tabGroup.querySelectorAll(\"ic-tab\"));\n this.tabPanels = Array.from(this.el.children).filter(\n (child) => child.tagName === \"IC-TAB-PANEL\"\n ) as HTMLIcTabPanelElement[];\n this.enabledTabs = this.getEnabledTabs();\n };\n\n private keydownHandler = (event: KeyboardEvent) => {\n const isManual = this.activationType === \"manual\";\n const enabledTabIndex = this.enabledTabs.findIndex(\n (tab) =>\n tab.tabId ===\n this.tabs[isManual ? this.focusedTabIndex : this.selectedTab].tabId\n );\n const keyboardFunction = isManual\n ? this.keyboardFocusTab\n : this.keyboardSelectTab;\n let preventDefault = true;\n switch (event.key) {\n case \"Home\":\n keyboardFunction(0);\n break;\n case \"End\":\n keyboardFunction(this.enabledTabs.length - 1);\n break;\n case \"ArrowRight\":\n keyboardFunction(\n enabledTabIndex < this.enabledTabs.length - 1\n ? enabledTabIndex + 1\n : 0\n );\n break;\n case \"ArrowLeft\":\n keyboardFunction(\n (enabledTabIndex > 0 ? enabledTabIndex : this.enabledTabs.length) - 1\n );\n break;\n default:\n if (isManual && (event.key === \"Enter\" || event.key === \" \")) {\n this.keyboardSelectTab(this.focusedTabIndex);\n } else {\n preventDefault = false;\n }\n }\n if (preventDefault) event.preventDefault();\n };\n\n /** Sets the tab that is selected on initial render */\n private setInitialTab = (): void => {\n if (this.selectedTabIndex !== undefined) {\n this.selectedTab = this.selectedTabIndex;\n this.focusedTabIndex = this.selectedTabIndex;\n } else {\n const firstEnabledTabIndex = this.tabs.findIndex(\n (tab) => tab.tabId === this.enabledTabs[0].tabId\n );\n this.selectedTab = firstEnabledTabIndex;\n this.focusedTabIndex = firstEnabledTabIndex;\n }\n };\n\n /** Passes the selected tab to the tab and tab panel components */\n private configureTabs = () => {\n this.enabledTabs.forEach((tab) => {\n tab.selected = tab.tabPosition === this.selectedTab;\n });\n this.tabPanels.forEach((tabPanel, index) => {\n tabPanel.hidden = index !== this.selectedTab;\n });\n };\n\n private getEnabledTabs = () =>\n Array.from(this.tabs).filter((child) => !child.disabled);\n\n /** Sets focus on tab and selects it */\n private keyboardSelectTab = (enabledTabIndex: number) => {\n const newIndex = this.tabs.findIndex(\n (tab) => tab.tabId === this.enabledTabs[enabledTabIndex].tabId\n );\n this.enabledTabs[enabledTabIndex].focus();\n if (this.selectedTabIndex === undefined) {\n this.selectedTab = newIndex;\n } else {\n this.emitEvents(newIndex);\n }\n };\n\n /** Sets focus on tab without selecting it (for manual activation) */\n private keyboardFocusTab = (enabledTabIndex: number) => {\n this.enabledTabs[enabledTabIndex].focus();\n this.focusedTabIndex = this.tabs.findIndex(\n (tab) => tab.tabId === this.enabledTabs[enabledTabIndex].tabId\n );\n };\n\n render() {\n return <slot></slot>;\n }\n}\n"]}
|
@@ -332,7 +332,7 @@ describe("ic-tab-context component", () => {
|
|
332
332
|
const newTab = page.root.querySelector('[id*="ic-tab-3-context-default"]');
|
333
333
|
const newTabPanel = page.root.querySelector('[id*="ic-tab-panel-3-context-default"]');
|
334
334
|
expect(newTab.tabId).toBe("ic-tab--3-context-default");
|
335
|
-
expect(newTabPanel.
|
335
|
+
expect(newTabPanel.id).toBe("ic-tab-panel-3-context-default");
|
336
336
|
});
|
337
337
|
it("should reassign ids if tab and tab panel are dynamically removed", async () => {
|
338
338
|
const page = await newSpecPage({
|
@@ -363,7 +363,7 @@ describe("ic-tab-context component", () => {
|
|
363
363
|
const newlyUpdatedTab = page.root.querySelector('[id*="ic-tab-1-context-default"]');
|
364
364
|
const newlyUpdatedTabPanel = page.root.querySelector('[id*="ic-tab-panel-1-context-default"]');
|
365
365
|
expect(newlyUpdatedTab.tabId).toBe("ic-tab--1-context-default");
|
366
|
-
expect(newlyUpdatedTabPanel.
|
366
|
+
expect(newlyUpdatedTabPanel.id).toBe("ic-tab-panel-1-context-default");
|
367
367
|
});
|
368
368
|
it("should add a tab to enabledTabs when the tab changes from disabled to enabled", async () => {
|
369
369
|
const page = await newSpecPage({
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"ic-tab-context.spec.js","sourceRoot":"","sources":["../../../../../src/components/ic-tab-context/test/basic/ic-tab-context.spec.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AACpD,OAAO,EAAE,QAAQ,EAAE,MAAM,oCAAoC,CAAC;AAC9D,OAAO,EAAE,QAAQ,EAAE,MAAM,oCAAoC,CAAC;AAC9D,OAAO,EAAE,GAAG,EAAE,MAAM,wBAAwB,CAAC;AAC7C,OAAO,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAElD,SAAS,CAAC,GAAG,EAAE;IACb,IAAI,CAAC,KAAK,CAAC,OAAO,EAAE,MAAM,CAAC,CAAC,kBAAkB,CAAC,IAAI,CAAC,EAAE,EAAE,CAAC,CAAC;AAC5D,CAAC,CAAC,CAAC;AAEH,QAAQ,CAAC,0BAA0B,EAAE,GAAG,EAAE;IACxC,EAAE,CAAC,qCAAqC,EAAE,KAAK,IAAI,EAAE;QACnD,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,QAAQ,CAAC;YACjD,IAAI,EAAE;;;;;;;;;wBASY;SACnB,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,eAAe,EAAE,CAAC;QAEpC,qDAAqD;QACrD,IAAI,CAAC,UAAU,CAAC,EAAE,CAAC,CAAC;IACtB,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,wDAAwD,EAAE,KAAK,IAAI,EAAE;QACtE,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,QAAQ,CAAC;YACjD,IAAI,EAAE;;;;;;;;;wBASY;SACnB,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,eAAe,EAAE,CAAC;IACtC,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,oDAAoD,EAAE,KAAK,IAAI,EAAE;QAClE,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,QAAQ,CAAC;YACjD,IAAI,EAAE;;;;;;;;;wBASY;SACnB,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,eAAe,EAAE,CAAC;IACtC,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,4CAA4C,EAAE,KAAK,IAAI,EAAE;QAC1D,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,QAAQ,CAAC;YACjD,IAAI,EAAE;;;;;;;;;wBASY;SACnB,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,WAAW,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;QAE9C,MAAM,QAAQ,GAAG,IAAI,CAAC,EAAE,EAAE,CAAC;QAC3B,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,aAAa,EAAE,QAAQ,CAAC,CAAC;QAEpD,MAAM,QAAQ,GAAG,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,cAAc,CAAC,CAAC;QAEzD,QAAQ,CAAC,aAAa,CACpB,IAAI,MAAM,CAAC,MAAM,CAAC,aAAa,CAAC,SAAS,EAAE;YACzC,GAAG,EAAE,MAAM;YACX,OAAO,EAAE,IAAI;YACb,UAAU,EAAE,IAAI;SACjB,CAAC,CACH,CAAC;QAEF,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;QAC5B,MAAM,CAAC,QAAQ,CAAC,CAAC,gBAAgB,EAAE,CAAC;IACtC,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,yDAAyD,EAAE,KAAK,IAAI,EAAE;QACvE,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,QAAQ,CAAC;YACjD,IAAI,EAAE;;;;;;;;;wBASY;SACnB,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,eAAe,EAAE,CAAC;QAEpC,kDAAkD;QAClD,IAAI,CAAC,UAAU,CAAC,EAAE,CAAC,CAAC;IACtB,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,iDAAiD,EAAE,KAAK,IAAI,EAAE;QAC/D,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,QAAQ,CAAC;YACjD,IAAI,EAAE;;;;;;;;;wBASY;SACnB,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,eAAe,EAAE,CAAC;IACtC,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,kCAAkC,EAAE,KAAK,IAAI,EAAE;QAChD,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,QAAQ,CAAC;YACjD,IAAI,EAAE;;;;;;;;;wBASY;SACnB,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,WAAW,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;QAE9C,IAAI,CAAC,IAAI,CAAC,gBAAgB,GAAG,CAAC,CAAC;QAC/B,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;QAE5B,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,WAAW,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;IAChD,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,+BAA+B,EAAE,KAAK,IAAI,EAAE;QAC7C,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,QAAQ,CAAC;YACjD,IAAI,EAAE;;;;;;;;;wBASY;SACnB,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,gBAAgB,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;QAE3D,MAAM,QAAQ,GAAG,IAAI,CAAC,EAAE,EAAE,CAAC;QAC3B,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,aAAa,EAAE,QAAQ,CAAC,CAAC;QAEpD,MAAM,IAAI,CAAC,YAAY,CAAC,eAAe,CAAC;YACtC,wBAAwB,EAAE,IAAI,CAAC,EAAE,EAAE;YACnC,MAAM,EAAE;gBACN,SAAS,EAAE,SAAS;gBACpB,QAAQ,EAAE,CAAC;gBACX,KAAK,EAAE,2BAA2B;aACnC;SACF,CAAC,CAAC;QAEH,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;QAC5B,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,WAAW,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;QAC9C,MAAM,CAAC,QAAQ,CAAC,CAAC,gBAAgB,EAAE,CAAC;IACtC,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,0CAA0C,EAAE,KAAK,IAAI,EAAE;QACxD,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,QAAQ,CAAC;YACjD,IAAI,EAAE;;;;;;;;;wBASY;SACnB,CAAC,CAAC;QAEH,MAAM,QAAQ,GAAG,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,cAAc,CAAC,CAAC;QAEzD,QAAQ,CAAC,aAAa,CACpB,IAAI,MAAM,CAAC,MAAM,CAAC,aAAa,CAAC,SAAS,EAAE;YACzC,GAAG,EAAE,KAAK;YACV,OAAO,EAAE,IAAI;YACb,UAAU,EAAE,IAAI;SACjB,CAAC,CACH,CAAC;QAEF,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;QAC5B,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,WAAW,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;QAE9C,QAAQ,CAAC,aAAa,CACpB,IAAI,MAAM,CAAC,MAAM,CAAC,aAAa,CAAC,SAAS,EAAE;YACzC,GAAG,EAAE,MAAM;YACX,OAAO,EAAE,IAAI;YACb,UAAU,EAAE,IAAI;SACjB,CAAC,CACH,CAAC;QAEF,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;QAC5B,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,WAAW,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;QAE9C,QAAQ,CAAC,aAAa,CACpB,IAAI,MAAM,CAAC,MAAM,CAAC,aAAa,CAAC,SAAS,EAAE;YACzC,GAAG,EAAE,WAAW;YAChB,OAAO,EAAE,IAAI;YACb,UAAU,EAAE,IAAI;SACjB,CAAC,CACH,CAAC;QAEF,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;QAC5B,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,WAAW,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;QAE9C,QAAQ,CAAC,aAAa,CACpB,IAAI,MAAM,CAAC,MAAM,CAAC,aAAa,CAAC,SAAS,EAAE;YACzC,GAAG,EAAE,WAAW;YAChB,OAAO,EAAE,IAAI;YACb,UAAU,EAAE,IAAI;SACjB,CAAC,CACH,CAAC;QAEF,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;QAC5B,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,WAAW,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;QAE9C,QAAQ,CAAC,aAAa,CACpB,IAAI,MAAM,CAAC,MAAM,CAAC,aAAa,CAAC,SAAS,EAAE;YACzC,GAAG,EAAE,YAAY;YACjB,OAAO,EAAE,IAAI;YACb,UAAU,EAAE,IAAI;SACjB,CAAC,CACH,CAAC;QAEF,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;QAC5B,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,WAAW,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;QAE9C,QAAQ,CAAC,aAAa,CACpB,IAAI,MAAM,CAAC,MAAM,CAAC,aAAa,CAAC,SAAS,EAAE;YACzC,GAAG,EAAE,YAAY;YACjB,OAAO,EAAE,IAAI;YACb,UAAU,EAAE,IAAI;SACjB,CAAC,CACH,CAAC;QAEF,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;QAC5B,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,WAAW,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;QAE9C,QAAQ,CAAC,aAAa,CACpB,IAAI,MAAM,CAAC,MAAM,CAAC,aAAa,CAAC,SAAS,EAAE;YACzC,GAAG,EAAE,QAAQ;YACb,OAAO,EAAE,IAAI;YACb,UAAU,EAAE,IAAI;SACjB,CAAC,CACH,CAAC;QAEF,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;QAC5B,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,WAAW,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;IAChD,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,uCAAuC,EAAE,KAAK,IAAI,EAAE;QACrD,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,QAAQ,CAAC;YACjD,IAAI,EAAE;;;;;;;;;wBASY;SACnB,CAAC,CAAC;QAEH,MAAM,QAAQ,GAAG,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,cAAc,CAAC,CAAC;QAEzD,QAAQ,CAAC,aAAa,CACpB,IAAI,MAAM,CAAC,MAAM,CAAC,aAAa,CAAC,SAAS,EAAE;YACzC,GAAG,EAAE,KAAK;YACV,OAAO,EAAE,IAAI;YACb,UAAU,EAAE,IAAI;SACjB,CAAC,CACH,CAAC;QAEF,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;QAC5B,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,WAAW,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;QAC9C,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,eAAe,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;QAElD,QAAQ,CAAC,aAAa,CACpB,IAAI,MAAM,CAAC,MAAM,CAAC,aAAa,CAAC,SAAS,EAAE;YACzC,GAAG,EAAE,OAAO;YACZ,OAAO,EAAE,IAAI;YACb,UAAU,EAAE,IAAI;SACjB,CAAC,CACH,CAAC;QAEF,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;QAC5B,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,WAAW,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;QAE9C,QAAQ,CAAC,aAAa,CACpB,IAAI,MAAM,CAAC,MAAM,CAAC,aAAa,CAAC,SAAS,EAAE;YACzC,GAAG,EAAE,MAAM;YACX,OAAO,EAAE,IAAI;YACb,UAAU,EAAE,IAAI;SACjB,CAAC,CACH,CAAC;QAEF,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;QAC5B,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,eAAe,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;QAClD,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,WAAW,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;QAE9C,QAAQ,CAAC,aAAa,CACpB,IAAI,MAAM,CAAC,MAAM,CAAC,aAAa,CAAC,SAAS,EAAE;YACzC,GAAG,EAAE,GAAG;YACR,OAAO,EAAE,IAAI;YACb,UAAU,EAAE,IAAI;SACjB,CAAC,CACH,CAAC;QAEF,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;QAC5B,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,WAAW,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;QAE9C,QAAQ,CAAC,aAAa,CACpB,IAAI,MAAM,CAAC,MAAM,CAAC,aAAa,CAAC,SAAS,EAAE;YACzC,GAAG,EAAE,WAAW;YAChB,OAAO,EAAE,IAAI;YACb,UAAU,EAAE,IAAI;SACjB,CAAC,CACH,CAAC;QAEF,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;QAC5B,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,eAAe,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;QAElD,QAAQ,CAAC,aAAa,CACpB,IAAI,MAAM,CAAC,MAAM,CAAC,aAAa,CAAC,SAAS,EAAE;YACzC,GAAG,EAAE,WAAW;YAChB,OAAO,EAAE,IAAI;YACb,UAAU,EAAE,IAAI;SACjB,CAAC,CACH,CAAC;QAEF,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;QAC5B,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,eAAe,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;QAElD,QAAQ,CAAC,aAAa,CACpB,IAAI,MAAM,CAAC,MAAM,CAAC,aAAa,CAAC,SAAS,EAAE;YACzC,GAAG,EAAE,YAAY;YACjB,OAAO,EAAE,IAAI;YACb,UAAU,EAAE,IAAI;SACjB,CAAC,CACH,CAAC;QAEF,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;QAC5B,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,eAAe,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;QAElD,QAAQ,CAAC,aAAa,CACpB,IAAI,MAAM,CAAC,MAAM,CAAC,aAAa,CAAC,SAAS,EAAE;YACzC,GAAG,EAAE,YAAY;YACjB,OAAO,EAAE,IAAI;YACb,UAAU,EAAE,IAAI;SACjB,CAAC,CACH,CAAC;QAEF,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;QAC5B,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,eAAe,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;QAElD,QAAQ,CAAC,aAAa,CACpB,IAAI,MAAM,CAAC,MAAM,CAAC,aAAa,CAAC,SAAS,EAAE;YACzC,GAAG,EAAE,QAAQ;YACb,OAAO,EAAE,IAAI;YACb,UAAU,EAAE,IAAI;SACjB,CAAC,CACH,CAAC;QAEF,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;QAC5B,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,eAAe,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;IACpD,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,sFAAsF,EAAE,KAAK,IAAI,EAAE;QACpG,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,QAAQ,CAAC;YACjD,IAAI,EAAE;;;;;;;;;wBASY;SACnB,CAAC,CAAC;QAEH,MAAM,QAAQ,GAAG,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,cAAc,CAAC,CAAC;QAEzD,QAAQ,CAAC,kBAAkB,CAAC,WAAW,EAAE,uBAAuB,CAAC,CAAC;QAClE,IAAI,CAAC,IAAI,CAAC,kBAAkB,CAC1B,WAAW,EACX,mCAAmC,CACpC,CAAC;QACF,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;QAE5B,MAAM,MAAM,GAAG,IAAI,CAAC,IAAI,CAAC,aAAa,CACpC,kCAAkC,CACf,CAAC;QACtB,MAAM,WAAW,GAAG,IAAI,CAAC,IAAI,CAAC,aAAa,CACzC,wCAAwC,CAChB,CAAC;QAE3B,MAAM,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,IAAI,CAAC,2BAA2B,CAAC,CAAC;QACvD,MAAM,CAAC,WAAW,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,2BAA2B,CAAC,CAAC;IAChE,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,kEAAkE,EAAE,KAAK,IAAI,EAAE;QAChF,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,QAAQ,CAAC;YACjD,IAAI,EAAE;;;;;;;;;wBASY;SACnB,CAAC,CAAC;QAEH,MAAM,QAAQ,GAAG,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,cAAc,CAAC,CAAC;QAEzD,IAAI,OAAO,GAAG,QAAQ,CAAC,gBAAgB,CAAC,QAAQ,CAAC,CAAC;QAClD,IAAI,YAAY,GAAG,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,cAAc,CAAC,CAAC;QAE9D,MAAM,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;QAC/B,MAAM,CAAC,YAAY,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;QAEpC,YAAY,CAAC,YAAY,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,MAAM,EAAE,CAAC;QAC/C,OAAO,CAAC,OAAO,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,MAAM,EAAE,CAAC;QAErC,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;QAE5B,OAAO,GAAG,QAAQ,CAAC,gBAAgB,CAAC,QAAQ,CAAC,CAAC;QAC9C,YAAY,GAAG,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,cAAc,CAAC,CAAC;QAE1D,MAAM,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;QAC/B,MAAM,CAAC,YAAY,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;QAEpC,MAAM,eAAe,GAAG,IAAI,CAAC,IAAI,CAAC,aAAa,CAC7C,kCAAkC,CACf,CAAC;QACtB,MAAM,oBAAoB,GAAG,IAAI,CAAC,IAAI,CAAC,aAAa,CAClD,wCAAwC,CAChB,CAAC;QAE3B,MAAM,CAAC,eAAe,CAAC,KAAK,CAAC,CAAC,IAAI,CAAC,2BAA2B,CAAC,CAAC;QAChE,MAAM,CAAC,oBAAoB,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,2BAA2B,CAAC,CAAC;IACzE,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,+EAA+E,EAAE,KAAK,IAAI,EAAE;QAC7F,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,QAAQ,CAAC;YACjD,IAAI,EAAE;;;;;;;;;wBASY;SACnB,CAAC,CAAC;QAEH,MAAM,GAAG,GAAG,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;QAC9C,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,WAAW,CAAC,CAAC,GAAG,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC;QACzD,GAAG,CAAC,QAAQ,GAAG,KAAK,CAAC;QACrB,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,WAAW,CAAC,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC;QACrD,GAAG,CAAC,QAAQ,GAAG,IAAI,CAAC;QACpB,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,WAAW,CAAC,CAAC,GAAG,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC;IAC3D,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import { newSpecPage } from \"@stencil/core/testing\";\nimport { TabGroup } from \"../../../ic-tab-group/ic-tab-group\";\nimport { TabPanel } from \"../../../ic-tab-panel/ic-tab-panel\";\nimport { Tab } from \"../../../ic-tab/ic-tab\";\nimport { TabContext } from \"../../ic-tab-context\";\n\nbeforeAll(() => {\n jest.spyOn(console, \"warn\").mockImplementation(jest.fn());\n});\n\ndescribe(\"ic-tab-context component\", () => {\n it(\"should render tab context with tabs\", async () => {\n const page = await newSpecPage({\n components: [TabContext, TabGroup, Tab, TabPanel],\n html: `<ic-tab-context>\n <ic-tab-group label=\"Example tab group\">\n <ic-tab>One</ic-tab>\n <ic-tab>Two</ic-tab>\n <ic-tab>Three</ic-tab>\n </ic-tab-group>\n <ic-tab-panel>Tab One</ic-tab-panel>\n <ic-tab-panel>Tab Two</ic-tab-panel>\n <ic-tab-panel>Tab Three</ic-tab-panel>\n </ic-tab-context>`,\n });\n\n expect(page.root).toMatchSnapshot();\n\n //test disconnected callback for automatic activation\n page.setContent(\"\");\n });\n\n it(\"should render tab context with tabs - light appearance\", async () => {\n const page = await newSpecPage({\n components: [TabContext, TabGroup, Tab, TabPanel],\n html: `<ic-tab-context appearance=\"light\">\n <ic-tab-group label=\"Example tab group\" appearance=\"light\">\n <ic-tab>One</ic-tab>\n <ic-tab>Two</ic-tab>\n <ic-tab>Three</ic-tab>\n </ic-tab-group>\n <ic-tab-panel>Tab One</ic-tab-panel>\n <ic-tab-panel>Tab Two</ic-tab-panel>\n <ic-tab-panel>Tab Three</ic-tab-panel>\n </ic-tab-context>`,\n });\n\n expect(page.root).toMatchSnapshot();\n });\n\n it(\"should render tab context with tabs - selected tab\", async () => {\n const page = await newSpecPage({\n components: [TabContext, TabGroup, Tab, TabPanel],\n html: `<ic-tab-context selected-tab-index=\"2\">\n <ic-tab-group label=\"Example tab group\">\n <ic-tab>One</ic-tab>\n <ic-tab>Two</ic-tab>\n <ic-tab>Three</ic-tab>\n </ic-tab-group>\n <ic-tab-panel>Tab One</ic-tab-panel>\n <ic-tab-panel>Tab Two</ic-tab-panel>\n <ic-tab-panel>Tab Three</ic-tab-panel>\n </ic-tab-context>`,\n });\n\n expect(page.root).toMatchSnapshot();\n });\n\n it(\"should test controlled mode - selected tab\", async () => {\n const page = await newSpecPage({\n components: [TabContext, TabGroup, Tab, TabPanel],\n html: `<ic-tab-context selected-tab-index=\"2\">\n <ic-tab-group label=\"Example tab group\">\n <ic-tab>One</ic-tab>\n <ic-tab>Two</ic-tab>\n <ic-tab>Three</ic-tab>\n </ic-tab-group>\n <ic-tab-panel>Tab One</ic-tab-panel>\n <ic-tab-panel>Tab Two</ic-tab-panel>\n <ic-tab-panel>Tab Three</ic-tab-panel>\n </ic-tab-context>`,\n });\n\n expect(page.rootInstance.selectedTab).toBe(2);\n\n const eventSpy = jest.fn();\n page.root.addEventListener(\"icTabSelect\", eventSpy);\n\n const tabGroup = page.root.querySelector(\"ic-tab-group\");\n\n tabGroup.dispatchEvent(\n new window.window.KeyboardEvent(\"keydown\", {\n key: \"Home\",\n bubbles: true,\n cancelable: true,\n })\n );\n\n await page.waitForChanges();\n expect(eventSpy).toHaveBeenCalled();\n });\n\n it(\"should render tab context with tabs - manual activation\", async () => {\n const page = await newSpecPage({\n components: [TabContext, TabGroup, Tab, TabPanel],\n html: `<ic-tab-context activation-type=\"manual\">\n <ic-tab-group label=\"Example tab group\">\n <ic-tab>One</ic-tab>\n <ic-tab>Two</ic-tab>\n <ic-tab>Three</ic-tab>\n </ic-tab-group>\n <ic-tab-panel>Tab One</ic-tab-panel>\n <ic-tab-panel>Tab Two</ic-tab-panel>\n <ic-tab-panel>Tab Three</ic-tab-panel>\n </ic-tab-context>`,\n });\n\n expect(page.root).toMatchSnapshot();\n\n //test disconnected callback for manual activation\n page.setContent(\"\");\n });\n\n it(\"should render tab context with custom contextId\", async () => {\n const page = await newSpecPage({\n components: [TabContext, TabGroup, Tab, TabPanel],\n html: `<ic-tab-context context-id=\"custom-context\">\n <ic-tab-group label=\"Example tab group\">\n <ic-tab>One</ic-tab>\n <ic-tab>Two</ic-tab>\n <ic-tab>Three</ic-tab>\n </ic-tab-group>\n <ic-tab-panel>Tab One</ic-tab-panel>\n <ic-tab-panel>Tab Two</ic-tab-panel>\n <ic-tab-panel>Tab Three</ic-tab-panel>\n </ic-tab-context>`,\n });\n\n expect(page.root).toMatchSnapshot();\n });\n\n it(\"should test setting selected tab\", async () => {\n const page = await newSpecPage({\n components: [TabContext, TabGroup, Tab, TabPanel],\n html: `<ic-tab-context>\n <ic-tab-group label=\"Example tab group\">\n <ic-tab>One</ic-tab>\n <ic-tab>Two</ic-tab>\n <ic-tab>Three</ic-tab>\n </ic-tab-group>\n <ic-tab-panel>Tab One</ic-tab-panel>\n <ic-tab-panel>Tab Two</ic-tab-panel>\n <ic-tab-panel>Tab Three</ic-tab-panel>\n </ic-tab-context>`,\n });\n\n expect(page.rootInstance.selectedTab).toBe(0);\n\n page.root.selectedTabIndex = 1;\n await page.waitForChanges();\n\n expect(page.rootInstance.selectedTab).toBe(1);\n });\n\n it(\"should test tab click handler\", async () => {\n const page = await newSpecPage({\n components: [TabContext, TabGroup, Tab, TabPanel],\n html: `<ic-tab-context>\n <ic-tab-group label=\"Example tab group\">\n <ic-tab>One</ic-tab>\n <ic-tab>Two</ic-tab>\n <ic-tab>Three</ic-tab>\n </ic-tab-group>\n <ic-tab-panel>Tab One</ic-tab-panel>\n <ic-tab-panel>Tab Two</ic-tab-panel>\n <ic-tab-panel>Tab Three</ic-tab-panel>\n </ic-tab-context>`,\n });\n\n expect(page.rootInstance.selectedTabIndex).toBe(undefined);\n\n const eventSpy = jest.fn();\n page.root.addEventListener(\"icTabSelect\", eventSpy);\n\n await page.rootInstance.tabClickHandler({\n stopImmediatePropagation: jest.fn(),\n detail: {\n contextId: \"default\",\n position: 1,\n tabId: \"ic-tab--1-context-default\",\n },\n });\n\n await page.waitForChanges();\n expect(page.rootInstance.selectedTab).toBe(1);\n expect(eventSpy).toHaveBeenCalled();\n });\n\n it(\"should test key down handler - automatic\", async () => {\n const page = await newSpecPage({\n components: [TabContext, TabGroup, Tab, TabPanel],\n html: `<ic-tab-context>\n <ic-tab-group label=\"Example tab group\">\n <ic-tab>One</ic-tab>\n <ic-tab>Two</ic-tab>\n <ic-tab>Three</ic-tab>\n </ic-tab-group>\n <ic-tab-panel>Tab One</ic-tab-panel>\n <ic-tab-panel>Tab Two</ic-tab-panel>\n <ic-tab-panel>Tab Three</ic-tab-panel>\n </ic-tab-context>`,\n });\n\n const tabGroup = page.root.querySelector(\"ic-tab-group\");\n\n tabGroup.dispatchEvent(\n new window.window.KeyboardEvent(\"keydown\", {\n key: \"End\",\n bubbles: true,\n cancelable: true,\n })\n );\n\n await page.waitForChanges();\n expect(page.rootInstance.selectedTab).toBe(2);\n\n tabGroup.dispatchEvent(\n new window.window.KeyboardEvent(\"keydown\", {\n key: \"Home\",\n bubbles: true,\n cancelable: true,\n })\n );\n\n await page.waitForChanges();\n expect(page.rootInstance.selectedTab).toBe(0);\n\n tabGroup.dispatchEvent(\n new window.window.KeyboardEvent(\"keydown\", {\n key: \"ArrowLeft\",\n bubbles: true,\n cancelable: true,\n })\n );\n\n await page.waitForChanges();\n expect(page.rootInstance.selectedTab).toBe(2);\n\n tabGroup.dispatchEvent(\n new window.window.KeyboardEvent(\"keydown\", {\n key: \"ArrowLeft\",\n bubbles: true,\n cancelable: true,\n })\n );\n\n await page.waitForChanges();\n expect(page.rootInstance.selectedTab).toBe(1);\n\n tabGroup.dispatchEvent(\n new window.window.KeyboardEvent(\"keydown\", {\n key: \"ArrowRight\",\n bubbles: true,\n cancelable: true,\n })\n );\n\n await page.waitForChanges();\n expect(page.rootInstance.selectedTab).toBe(2);\n\n tabGroup.dispatchEvent(\n new window.window.KeyboardEvent(\"keydown\", {\n key: \"ArrowRight\",\n bubbles: true,\n cancelable: true,\n })\n );\n\n await page.waitForChanges();\n expect(page.rootInstance.selectedTab).toBe(0);\n\n tabGroup.dispatchEvent(\n new window.window.KeyboardEvent(\"keydown\", {\n key: \"Escape\",\n bubbles: true,\n cancelable: true,\n })\n );\n\n await page.waitForChanges();\n expect(page.rootInstance.selectedTab).toBe(0);\n });\n\n it(\"should test key down handler - manual\", async () => {\n const page = await newSpecPage({\n components: [TabContext, TabGroup, Tab, TabPanel],\n html: `<ic-tab-context activation-type=\"manual\">\n <ic-tab-group label=\"Example tab group\">\n <ic-tab>One</ic-tab>\n <ic-tab>Two</ic-tab>\n <ic-tab>Three</ic-tab>\n </ic-tab-group>\n <ic-tab-panel>Tab One</ic-tab-panel>\n <ic-tab-panel>Tab Two</ic-tab-panel>\n <ic-tab-panel>Tab Three</ic-tab-panel>\n </ic-tab-context>`,\n });\n\n const tabGroup = page.root.querySelector(\"ic-tab-group\");\n\n tabGroup.dispatchEvent(\n new window.window.KeyboardEvent(\"keydown\", {\n key: \"End\",\n bubbles: true,\n cancelable: true,\n })\n );\n\n await page.waitForChanges();\n expect(page.rootInstance.selectedTab).toBe(0);\n expect(page.rootInstance.focusedTabIndex).toBe(2);\n\n tabGroup.dispatchEvent(\n new window.window.KeyboardEvent(\"keydown\", {\n key: \"Enter\",\n bubbles: true,\n cancelable: true,\n })\n );\n\n await page.waitForChanges();\n expect(page.rootInstance.selectedTab).toBe(2);\n\n tabGroup.dispatchEvent(\n new window.window.KeyboardEvent(\"keydown\", {\n key: \"Home\",\n bubbles: true,\n cancelable: true,\n })\n );\n\n await page.waitForChanges();\n expect(page.rootInstance.focusedTabIndex).toBe(0);\n expect(page.rootInstance.selectedTab).toBe(2);\n\n tabGroup.dispatchEvent(\n new window.window.KeyboardEvent(\"keydown\", {\n key: \" \",\n bubbles: true,\n cancelable: true,\n })\n );\n\n await page.waitForChanges();\n expect(page.rootInstance.selectedTab).toBe(0);\n\n tabGroup.dispatchEvent(\n new window.window.KeyboardEvent(\"keydown\", {\n key: \"ArrowLeft\",\n bubbles: true,\n cancelable: true,\n })\n );\n\n await page.waitForChanges();\n expect(page.rootInstance.focusedTabIndex).toBe(2);\n\n tabGroup.dispatchEvent(\n new window.window.KeyboardEvent(\"keydown\", {\n key: \"ArrowLeft\",\n bubbles: true,\n cancelable: true,\n })\n );\n\n await page.waitForChanges();\n expect(page.rootInstance.focusedTabIndex).toBe(1);\n\n tabGroup.dispatchEvent(\n new window.window.KeyboardEvent(\"keydown\", {\n key: \"ArrowRight\",\n bubbles: true,\n cancelable: true,\n })\n );\n\n await page.waitForChanges();\n expect(page.rootInstance.focusedTabIndex).toBe(2);\n\n tabGroup.dispatchEvent(\n new window.window.KeyboardEvent(\"keydown\", {\n key: \"ArrowRight\",\n bubbles: true,\n cancelable: true,\n })\n );\n\n await page.waitForChanges();\n expect(page.rootInstance.focusedTabIndex).toBe(0);\n\n tabGroup.dispatchEvent(\n new window.window.KeyboardEvent(\"keydown\", {\n key: \"Escape\",\n bubbles: true,\n cancelable: true,\n })\n );\n\n await page.waitForChanges();\n expect(page.rootInstance.focusedTabIndex).toBe(0);\n });\n\n it(\"should apply tab and panel ids to elements added after initial render of the context\", async () => {\n const page = await newSpecPage({\n components: [TabContext, TabGroup, Tab, TabPanel],\n html: `<ic-tab-context>\n <ic-tab-group label=\"Example tab group\">\n <ic-tab>One</ic-tab>\n <ic-tab>Two</ic-tab>\n <ic-tab>Three</ic-tab>\n </ic-tab-group>\n <ic-tab-panel>Tab One</ic-tab-panel>\n <ic-tab-panel>Tab Two</ic-tab-panel>\n <ic-tab-panel>Tab Three</ic-tab-panel>\n </ic-tab-context>`,\n });\n\n const tabGroup = page.root.querySelector(\"ic-tab-group\");\n\n tabGroup.insertAdjacentHTML(\"beforeend\", \"<ic-tab>Four</ic-tab>\");\n page.root.insertAdjacentHTML(\n \"beforeend\",\n \"<ic-tab-panel>Four</ic-tab-panel>\"\n );\n await page.waitForChanges();\n\n const newTab = page.root.querySelector(\n '[id*=\"ic-tab-3-context-default\"]'\n ) as HTMLIcTabElement;\n const newTabPanel = page.root.querySelector(\n '[id*=\"ic-tab-panel-3-context-default\"]'\n ) as HTMLIcTabPanelElement;\n\n expect(newTab.tabId).toBe(\"ic-tab--3-context-default\");\n expect(newTabPanel.panelId).toBe(\"ic-tab--3-context-default\");\n });\n\n it(\"should reassign ids if tab and tab panel are dynamically removed\", async () => {\n const page = await newSpecPage({\n components: [TabContext, TabGroup, Tab, TabPanel],\n html: `<ic-tab-context>\n <ic-tab-group label=\"Example tab group\">\n <ic-tab>One</ic-tab>\n <ic-tab>Two</ic-tab>\n <ic-tab>Three</ic-tab>\n </ic-tab-group>\n <ic-tab-panel>Tab One</ic-tab-panel>\n <ic-tab-panel>Tab Two</ic-tab-panel>\n <ic-tab-panel>Tab Three</ic-tab-panel>\n </ic-tab-context>`,\n });\n\n const tabGroup = page.root.querySelector(\"ic-tab-group\");\n\n let allTabs = tabGroup.querySelectorAll(\"ic-tab\");\n let allTabPanels = page.root.querySelectorAll(\"ic-tab-panel\");\n\n expect(allTabs.length).toBe(3);\n expect(allTabPanels.length).toBe(3);\n\n allTabPanels[allTabPanels.length - 2].remove();\n allTabs[allTabs.length - 2].remove();\n\n await page.waitForChanges();\n\n allTabs = tabGroup.querySelectorAll(\"ic-tab\");\n allTabPanels = page.root.querySelectorAll(\"ic-tab-panel\");\n\n expect(allTabs.length).toBe(2);\n expect(allTabPanels.length).toBe(2);\n\n const newlyUpdatedTab = page.root.querySelector(\n '[id*=\"ic-tab-1-context-default\"]'\n ) as HTMLIcTabElement;\n const newlyUpdatedTabPanel = page.root.querySelector(\n '[id*=\"ic-tab-panel-1-context-default\"]'\n ) as HTMLIcTabPanelElement;\n\n expect(newlyUpdatedTab.tabId).toBe(\"ic-tab--1-context-default\");\n expect(newlyUpdatedTabPanel.panelId).toBe(\"ic-tab--1-context-default\");\n });\n\n it(\"should add a tab to enabledTabs when the tab changes from disabled to enabled\", async () => {\n const page = await newSpecPage({\n components: [TabContext, TabGroup, Tab, TabPanel],\n html: `<ic-tab-context>\n <ic-tab-group label=\"Example tab group\">\n <ic-tab disabled>One</ic-tab>\n <ic-tab>Two</ic-tab>\n <ic-tab>Three</ic-tab>\n </ic-tab-group>\n <ic-tab-panel>Tab One</ic-tab-panel>\n <ic-tab-panel>Tab Two</ic-tab-panel>\n <ic-tab-panel>Tab Three</ic-tab-panel>\n </ic-tab-context>`,\n });\n\n const tab = page.root.querySelector(\"ic-tab\");\n expect(page.rootInstance.enabledTabs).not.toContain(tab);\n tab.disabled = false;\n expect(page.rootInstance.enabledTabs).toContain(tab);\n tab.disabled = true;\n expect(page.rootInstance.enabledTabs).not.toContain(tab);\n });\n});\n"]}
|
1
|
+
{"version":3,"file":"ic-tab-context.spec.js","sourceRoot":"","sources":["../../../../../src/components/ic-tab-context/test/basic/ic-tab-context.spec.ts"],"names":[],"mappings":"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","sourcesContent":["import { newSpecPage } from \"@stencil/core/testing\";\nimport { TabGroup } from \"../../../ic-tab-group/ic-tab-group\";\nimport { TabPanel } from \"../../../ic-tab-panel/ic-tab-panel\";\nimport { Tab } from \"../../../ic-tab/ic-tab\";\nimport { TabContext } from \"../../ic-tab-context\";\n\nbeforeAll(() => {\n jest.spyOn(console, \"warn\").mockImplementation(jest.fn());\n});\n\ndescribe(\"ic-tab-context component\", () => {\n it(\"should render tab context with tabs\", async () => {\n const page = await newSpecPage({\n components: [TabContext, TabGroup, Tab, TabPanel],\n html: `<ic-tab-context>\n <ic-tab-group label=\"Example tab group\">\n <ic-tab>One</ic-tab>\n <ic-tab>Two</ic-tab>\n <ic-tab>Three</ic-tab>\n </ic-tab-group>\n <ic-tab-panel>Tab One</ic-tab-panel>\n <ic-tab-panel>Tab Two</ic-tab-panel>\n <ic-tab-panel>Tab Three</ic-tab-panel>\n </ic-tab-context>`,\n });\n\n expect(page.root).toMatchSnapshot();\n\n //test disconnected callback for automatic activation\n page.setContent(\"\");\n });\n\n it(\"should render tab context with tabs - light appearance\", async () => {\n const page = await newSpecPage({\n components: [TabContext, TabGroup, Tab, TabPanel],\n html: `<ic-tab-context appearance=\"light\">\n <ic-tab-group label=\"Example tab group\" appearance=\"light\">\n <ic-tab>One</ic-tab>\n <ic-tab>Two</ic-tab>\n <ic-tab>Three</ic-tab>\n </ic-tab-group>\n <ic-tab-panel>Tab One</ic-tab-panel>\n <ic-tab-panel>Tab Two</ic-tab-panel>\n <ic-tab-panel>Tab Three</ic-tab-panel>\n </ic-tab-context>`,\n });\n\n expect(page.root).toMatchSnapshot();\n });\n\n it(\"should render tab context with tabs - selected tab\", async () => {\n const page = await newSpecPage({\n components: [TabContext, TabGroup, Tab, TabPanel],\n html: `<ic-tab-context selected-tab-index=\"2\">\n <ic-tab-group label=\"Example tab group\">\n <ic-tab>One</ic-tab>\n <ic-tab>Two</ic-tab>\n <ic-tab>Three</ic-tab>\n </ic-tab-group>\n <ic-tab-panel>Tab One</ic-tab-panel>\n <ic-tab-panel>Tab Two</ic-tab-panel>\n <ic-tab-panel>Tab Three</ic-tab-panel>\n </ic-tab-context>`,\n });\n\n expect(page.root).toMatchSnapshot();\n });\n\n it(\"should test controlled mode - selected tab\", async () => {\n const page = await newSpecPage({\n components: [TabContext, TabGroup, Tab, TabPanel],\n html: `<ic-tab-context selected-tab-index=\"2\">\n <ic-tab-group label=\"Example tab group\">\n <ic-tab>One</ic-tab>\n <ic-tab>Two</ic-tab>\n <ic-tab>Three</ic-tab>\n </ic-tab-group>\n <ic-tab-panel>Tab One</ic-tab-panel>\n <ic-tab-panel>Tab Two</ic-tab-panel>\n <ic-tab-panel>Tab Three</ic-tab-panel>\n </ic-tab-context>`,\n });\n\n expect(page.rootInstance.selectedTab).toBe(2);\n\n const eventSpy = jest.fn();\n page.root.addEventListener(\"icTabSelect\", eventSpy);\n\n const tabGroup = page.root.querySelector(\"ic-tab-group\");\n\n tabGroup.dispatchEvent(\n new window.window.KeyboardEvent(\"keydown\", {\n key: \"Home\",\n bubbles: true,\n cancelable: true,\n })\n );\n\n await page.waitForChanges();\n expect(eventSpy).toHaveBeenCalled();\n });\n\n it(\"should render tab context with tabs - manual activation\", async () => {\n const page = await newSpecPage({\n components: [TabContext, TabGroup, Tab, TabPanel],\n html: `<ic-tab-context activation-type=\"manual\">\n <ic-tab-group label=\"Example tab group\">\n <ic-tab>One</ic-tab>\n <ic-tab>Two</ic-tab>\n <ic-tab>Three</ic-tab>\n </ic-tab-group>\n <ic-tab-panel>Tab One</ic-tab-panel>\n <ic-tab-panel>Tab Two</ic-tab-panel>\n <ic-tab-panel>Tab Three</ic-tab-panel>\n </ic-tab-context>`,\n });\n\n expect(page.root).toMatchSnapshot();\n\n //test disconnected callback for manual activation\n page.setContent(\"\");\n });\n\n it(\"should render tab context with custom contextId\", async () => {\n const page = await newSpecPage({\n components: [TabContext, TabGroup, Tab, TabPanel],\n html: `<ic-tab-context context-id=\"custom-context\">\n <ic-tab-group label=\"Example tab group\">\n <ic-tab>One</ic-tab>\n <ic-tab>Two</ic-tab>\n <ic-tab>Three</ic-tab>\n </ic-tab-group>\n <ic-tab-panel>Tab One</ic-tab-panel>\n <ic-tab-panel>Tab Two</ic-tab-panel>\n <ic-tab-panel>Tab Three</ic-tab-panel>\n </ic-tab-context>`,\n });\n\n expect(page.root).toMatchSnapshot();\n });\n\n it(\"should test setting selected tab\", async () => {\n const page = await newSpecPage({\n components: [TabContext, TabGroup, Tab, TabPanel],\n html: `<ic-tab-context>\n <ic-tab-group label=\"Example tab group\">\n <ic-tab>One</ic-tab>\n <ic-tab>Two</ic-tab>\n <ic-tab>Three</ic-tab>\n </ic-tab-group>\n <ic-tab-panel>Tab One</ic-tab-panel>\n <ic-tab-panel>Tab Two</ic-tab-panel>\n <ic-tab-panel>Tab Three</ic-tab-panel>\n </ic-tab-context>`,\n });\n\n expect(page.rootInstance.selectedTab).toBe(0);\n\n page.root.selectedTabIndex = 1;\n await page.waitForChanges();\n\n expect(page.rootInstance.selectedTab).toBe(1);\n });\n\n it(\"should test tab click handler\", async () => {\n const page = await newSpecPage({\n components: [TabContext, TabGroup, Tab, TabPanel],\n html: `<ic-tab-context>\n <ic-tab-group label=\"Example tab group\">\n <ic-tab>One</ic-tab>\n <ic-tab>Two</ic-tab>\n <ic-tab>Three</ic-tab>\n </ic-tab-group>\n <ic-tab-panel>Tab One</ic-tab-panel>\n <ic-tab-panel>Tab Two</ic-tab-panel>\n <ic-tab-panel>Tab Three</ic-tab-panel>\n </ic-tab-context>`,\n });\n\n expect(page.rootInstance.selectedTabIndex).toBe(undefined);\n\n const eventSpy = jest.fn();\n page.root.addEventListener(\"icTabSelect\", eventSpy);\n\n await page.rootInstance.tabClickHandler({\n stopImmediatePropagation: jest.fn(),\n detail: {\n contextId: \"default\",\n position: 1,\n tabId: \"ic-tab--1-context-default\",\n },\n });\n\n await page.waitForChanges();\n expect(page.rootInstance.selectedTab).toBe(1);\n expect(eventSpy).toHaveBeenCalled();\n });\n\n it(\"should test key down handler - automatic\", async () => {\n const page = await newSpecPage({\n components: [TabContext, TabGroup, Tab, TabPanel],\n html: `<ic-tab-context>\n <ic-tab-group label=\"Example tab group\">\n <ic-tab>One</ic-tab>\n <ic-tab>Two</ic-tab>\n <ic-tab>Three</ic-tab>\n </ic-tab-group>\n <ic-tab-panel>Tab One</ic-tab-panel>\n <ic-tab-panel>Tab Two</ic-tab-panel>\n <ic-tab-panel>Tab Three</ic-tab-panel>\n </ic-tab-context>`,\n });\n\n const tabGroup = page.root.querySelector(\"ic-tab-group\");\n\n tabGroup.dispatchEvent(\n new window.window.KeyboardEvent(\"keydown\", {\n key: \"End\",\n bubbles: true,\n cancelable: true,\n })\n );\n\n await page.waitForChanges();\n expect(page.rootInstance.selectedTab).toBe(2);\n\n tabGroup.dispatchEvent(\n new window.window.KeyboardEvent(\"keydown\", {\n key: \"Home\",\n bubbles: true,\n cancelable: true,\n })\n );\n\n await page.waitForChanges();\n expect(page.rootInstance.selectedTab).toBe(0);\n\n tabGroup.dispatchEvent(\n new window.window.KeyboardEvent(\"keydown\", {\n key: \"ArrowLeft\",\n bubbles: true,\n cancelable: true,\n })\n );\n\n await page.waitForChanges();\n expect(page.rootInstance.selectedTab).toBe(2);\n\n tabGroup.dispatchEvent(\n new window.window.KeyboardEvent(\"keydown\", {\n key: \"ArrowLeft\",\n bubbles: true,\n cancelable: true,\n })\n );\n\n await page.waitForChanges();\n expect(page.rootInstance.selectedTab).toBe(1);\n\n tabGroup.dispatchEvent(\n new window.window.KeyboardEvent(\"keydown\", {\n key: \"ArrowRight\",\n bubbles: true,\n cancelable: true,\n })\n );\n\n await page.waitForChanges();\n expect(page.rootInstance.selectedTab).toBe(2);\n\n tabGroup.dispatchEvent(\n new window.window.KeyboardEvent(\"keydown\", {\n key: \"ArrowRight\",\n bubbles: true,\n cancelable: true,\n })\n );\n\n await page.waitForChanges();\n expect(page.rootInstance.selectedTab).toBe(0);\n\n tabGroup.dispatchEvent(\n new window.window.KeyboardEvent(\"keydown\", {\n key: \"Escape\",\n bubbles: true,\n cancelable: true,\n })\n );\n\n await page.waitForChanges();\n expect(page.rootInstance.selectedTab).toBe(0);\n });\n\n it(\"should test key down handler - manual\", async () => {\n const page = await newSpecPage({\n components: [TabContext, TabGroup, Tab, TabPanel],\n html: `<ic-tab-context activation-type=\"manual\">\n <ic-tab-group label=\"Example tab group\">\n <ic-tab>One</ic-tab>\n <ic-tab>Two</ic-tab>\n <ic-tab>Three</ic-tab>\n </ic-tab-group>\n <ic-tab-panel>Tab One</ic-tab-panel>\n <ic-tab-panel>Tab Two</ic-tab-panel>\n <ic-tab-panel>Tab Three</ic-tab-panel>\n </ic-tab-context>`,\n });\n\n const tabGroup = page.root.querySelector(\"ic-tab-group\");\n\n tabGroup.dispatchEvent(\n new window.window.KeyboardEvent(\"keydown\", {\n key: \"End\",\n bubbles: true,\n cancelable: true,\n })\n );\n\n await page.waitForChanges();\n expect(page.rootInstance.selectedTab).toBe(0);\n expect(page.rootInstance.focusedTabIndex).toBe(2);\n\n tabGroup.dispatchEvent(\n new window.window.KeyboardEvent(\"keydown\", {\n key: \"Enter\",\n bubbles: true,\n cancelable: true,\n })\n );\n\n await page.waitForChanges();\n expect(page.rootInstance.selectedTab).toBe(2);\n\n tabGroup.dispatchEvent(\n new window.window.KeyboardEvent(\"keydown\", {\n key: \"Home\",\n bubbles: true,\n cancelable: true,\n })\n );\n\n await page.waitForChanges();\n expect(page.rootInstance.focusedTabIndex).toBe(0);\n expect(page.rootInstance.selectedTab).toBe(2);\n\n tabGroup.dispatchEvent(\n new window.window.KeyboardEvent(\"keydown\", {\n key: \" \",\n bubbles: true,\n cancelable: true,\n })\n );\n\n await page.waitForChanges();\n expect(page.rootInstance.selectedTab).toBe(0);\n\n tabGroup.dispatchEvent(\n new window.window.KeyboardEvent(\"keydown\", {\n key: \"ArrowLeft\",\n bubbles: true,\n cancelable: true,\n })\n );\n\n await page.waitForChanges();\n expect(page.rootInstance.focusedTabIndex).toBe(2);\n\n tabGroup.dispatchEvent(\n new window.window.KeyboardEvent(\"keydown\", {\n key: \"ArrowLeft\",\n bubbles: true,\n cancelable: true,\n })\n );\n\n await page.waitForChanges();\n expect(page.rootInstance.focusedTabIndex).toBe(1);\n\n tabGroup.dispatchEvent(\n new window.window.KeyboardEvent(\"keydown\", {\n key: \"ArrowRight\",\n bubbles: true,\n cancelable: true,\n })\n );\n\n await page.waitForChanges();\n expect(page.rootInstance.focusedTabIndex).toBe(2);\n\n tabGroup.dispatchEvent(\n new window.window.KeyboardEvent(\"keydown\", {\n key: \"ArrowRight\",\n bubbles: true,\n cancelable: true,\n })\n );\n\n await page.waitForChanges();\n expect(page.rootInstance.focusedTabIndex).toBe(0);\n\n tabGroup.dispatchEvent(\n new window.window.KeyboardEvent(\"keydown\", {\n key: \"Escape\",\n bubbles: true,\n cancelable: true,\n })\n );\n\n await page.waitForChanges();\n expect(page.rootInstance.focusedTabIndex).toBe(0);\n });\n\n it(\"should apply tab and panel ids to elements added after initial render of the context\", async () => {\n const page = await newSpecPage({\n components: [TabContext, TabGroup, Tab, TabPanel],\n html: `<ic-tab-context>\n <ic-tab-group label=\"Example tab group\">\n <ic-tab>One</ic-tab>\n <ic-tab>Two</ic-tab>\n <ic-tab>Three</ic-tab>\n </ic-tab-group>\n <ic-tab-panel>Tab One</ic-tab-panel>\n <ic-tab-panel>Tab Two</ic-tab-panel>\n <ic-tab-panel>Tab Three</ic-tab-panel>\n </ic-tab-context>`,\n });\n\n const tabGroup = page.root.querySelector(\"ic-tab-group\");\n\n tabGroup.insertAdjacentHTML(\"beforeend\", \"<ic-tab>Four</ic-tab>\");\n page.root.insertAdjacentHTML(\n \"beforeend\",\n \"<ic-tab-panel>Four</ic-tab-panel>\"\n );\n await page.waitForChanges();\n\n const newTab = page.root.querySelector(\n '[id*=\"ic-tab-3-context-default\"]'\n ) as HTMLIcTabElement;\n const newTabPanel = page.root.querySelector(\n '[id*=\"ic-tab-panel-3-context-default\"]'\n ) as HTMLIcTabPanelElement;\n\n expect(newTab.tabId).toBe(\"ic-tab--3-context-default\");\n expect(newTabPanel.id).toBe(\"ic-tab-panel-3-context-default\");\n });\n\n it(\"should reassign ids if tab and tab panel are dynamically removed\", async () => {\n const page = await newSpecPage({\n components: [TabContext, TabGroup, Tab, TabPanel],\n html: `<ic-tab-context>\n <ic-tab-group label=\"Example tab group\">\n <ic-tab>One</ic-tab>\n <ic-tab>Two</ic-tab>\n <ic-tab>Three</ic-tab>\n </ic-tab-group>\n <ic-tab-panel>Tab One</ic-tab-panel>\n <ic-tab-panel>Tab Two</ic-tab-panel>\n <ic-tab-panel>Tab Three</ic-tab-panel>\n </ic-tab-context>`,\n });\n\n const tabGroup = page.root.querySelector(\"ic-tab-group\");\n\n let allTabs = tabGroup.querySelectorAll(\"ic-tab\");\n let allTabPanels = page.root.querySelectorAll(\"ic-tab-panel\");\n\n expect(allTabs.length).toBe(3);\n expect(allTabPanels.length).toBe(3);\n\n allTabPanels[allTabPanels.length - 2].remove();\n allTabs[allTabs.length - 2].remove();\n\n await page.waitForChanges();\n\n allTabs = tabGroup.querySelectorAll(\"ic-tab\");\n allTabPanels = page.root.querySelectorAll(\"ic-tab-panel\");\n\n expect(allTabs.length).toBe(2);\n expect(allTabPanels.length).toBe(2);\n\n const newlyUpdatedTab = page.root.querySelector(\n '[id*=\"ic-tab-1-context-default\"]'\n ) as HTMLIcTabElement;\n const newlyUpdatedTabPanel = page.root.querySelector(\n '[id*=\"ic-tab-panel-1-context-default\"]'\n ) as HTMLIcTabPanelElement;\n\n expect(newlyUpdatedTab.tabId).toBe(\"ic-tab--1-context-default\");\n expect(newlyUpdatedTabPanel.id).toBe(\"ic-tab-panel-1-context-default\");\n });\n\n it(\"should add a tab to enabledTabs when the tab changes from disabled to enabled\", async () => {\n const page = await newSpecPage({\n components: [TabContext, TabGroup, Tab, TabPanel],\n html: `<ic-tab-context>\n <ic-tab-group label=\"Example tab group\">\n <ic-tab disabled>One</ic-tab>\n <ic-tab>Two</ic-tab>\n <ic-tab>Three</ic-tab>\n </ic-tab-group>\n <ic-tab-panel>Tab One</ic-tab-panel>\n <ic-tab-panel>Tab Two</ic-tab-panel>\n <ic-tab-panel>Tab Three</ic-tab-panel>\n </ic-tab-context>`,\n });\n\n const tab = page.root.querySelector(\"ic-tab\");\n expect(page.rootInstance.enabledTabs).not.toContain(tab);\n tab.disabled = false;\n expect(page.rootInstance.enabledTabs).toContain(tab);\n tab.disabled = true;\n expect(page.rootInstance.enabledTabs).not.toContain(tab);\n });\n});\n"]}
|