@fluentui/web-components 3.0.0-beta.109 → 3.0.0-beta.110
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/CHANGELOG.md +12 -2
- package/custom-elements.json +4 -4
- package/dist/esm/dropdown/dropdown.base.d.ts +22 -3
- package/dist/esm/dropdown/dropdown.base.js +95 -43
- package/dist/esm/dropdown/dropdown.base.js.map +1 -1
- package/dist/esm/dropdown/dropdown.styles.js +8 -24
- package/dist/esm/dropdown/dropdown.styles.js.map +1 -1
- package/dist/esm/field/field.styles.js +0 -3
- package/dist/esm/field/field.styles.js.map +1 -1
- package/dist/esm/index.d.ts +1 -1
- package/dist/esm/index.js +1 -1
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/listbox/listbox.styles.js +36 -0
- package/dist/esm/listbox/listbox.styles.js.map +1 -1
- package/dist/esm/option/option.styles.js +1 -0
- package/dist/esm/option/option.styles.js.map +1 -1
- package/dist/esm/tab/index.d.ts +1 -0
- package/dist/esm/tab/index.js +1 -0
- package/dist/esm/tab/index.js.map +1 -1
- package/dist/esm/tab/tab.options.d.ts +10 -0
- package/dist/esm/tab/tab.options.js +15 -0
- package/dist/esm/tab/tab.options.js.map +1 -0
- package/dist/esm/tab/tab.styles.js +12 -7
- package/dist/esm/tab/tab.styles.js.map +1 -1
- package/dist/esm/tablist/tablist.base.d.ts +13 -2
- package/dist/esm/tablist/tablist.base.js +16 -0
- package/dist/esm/tablist/tablist.base.js.map +1 -1
- package/dist/esm/tablist/tablist.styles.js +2 -2
- package/dist/esm/tablist/tablist.template.js +1 -1
- package/dist/esm/tablist/tablist.template.js.map +1 -1
- package/dist/web-components.d.ts +44 -5
- package/dist/web-components.js +120 -53
- package/dist/web-components.min.js +107 -107
- package/package.json +1 -1
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import type { Tab } from './tab.js';
|
|
2
|
+
/**
|
|
3
|
+
* Predicate function that determines if the element should be considered a tab.
|
|
4
|
+
*
|
|
5
|
+
* @param element - The element to check.
|
|
6
|
+
* @param tagName - The tag name to check.
|
|
7
|
+
* @returns true if the element is a tab.
|
|
8
|
+
* @public
|
|
9
|
+
*/
|
|
10
|
+
export declare function isTab(element?: Node | null, tagName?: string): element is Tab;
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Predicate function that determines if the element should be considered a tab.
|
|
3
|
+
*
|
|
4
|
+
* @param element - The element to check.
|
|
5
|
+
* @param tagName - The tag name to check.
|
|
6
|
+
* @returns true if the element is a tab.
|
|
7
|
+
* @public
|
|
8
|
+
*/
|
|
9
|
+
export function isTab(element, tagName = '-tab') {
|
|
10
|
+
if (element?.nodeType !== Node.ELEMENT_NODE) {
|
|
11
|
+
return false;
|
|
12
|
+
}
|
|
13
|
+
return element.tagName.toLowerCase().endsWith(tagName);
|
|
14
|
+
}
|
|
15
|
+
//# sourceMappingURL=tab.options.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"tab.options.js","sourceRoot":"","sources":["../../../src/tab/tab.options.ts"],"names":[],"mappings":"AAEA;;;;;;;GAOG;AACH,MAAM,UAAU,KAAK,CAAC,OAAqB,EAAE,UAAkB,MAAM;IACnE,IAAI,OAAO,EAAE,QAAQ,KAAK,IAAI,CAAC,YAAY,EAAE,CAAC;QAC5C,OAAO,KAAK,CAAC;IACf,CAAC;IAED,OAAQ,OAAmB,CAAC,OAAO,CAAC,WAAW,EAAE,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC;AACtE,CAAC"}
|
|
@@ -6,7 +6,8 @@ export const styles = css `
|
|
|
6
6
|
|
|
7
7
|
:host {
|
|
8
8
|
position: relative;
|
|
9
|
-
flex-direction:
|
|
9
|
+
flex-direction: row;
|
|
10
|
+
align-items: center;
|
|
10
11
|
cursor: pointer;
|
|
11
12
|
box-sizing: border-box;
|
|
12
13
|
justify-content: center;
|
|
@@ -18,6 +19,7 @@ export const styles = css `
|
|
|
18
19
|
grid-row: 1;
|
|
19
20
|
padding: ${spacingHorizontalM} ${spacingHorizontalMNudge};
|
|
20
21
|
border-radius: ${borderRadiusMedium};
|
|
22
|
+
gap: 4px;
|
|
21
23
|
}
|
|
22
24
|
:host .tab-content {
|
|
23
25
|
display: inline-flex;
|
|
@@ -65,12 +67,6 @@ export const styles = css `
|
|
|
65
67
|
::slotted([slot='end']) {
|
|
66
68
|
display: flex;
|
|
67
69
|
}
|
|
68
|
-
::slotted([slot='start']) {
|
|
69
|
-
margin-inline-end: 11px;
|
|
70
|
-
}
|
|
71
|
-
::slotted([slot='end']) {
|
|
72
|
-
margin-inline-start: 11px;
|
|
73
|
-
}
|
|
74
70
|
:host([disabled]) {
|
|
75
71
|
cursor: not-allowed;
|
|
76
72
|
fill: ${colorNeutralForegroundDisabled};
|
|
@@ -90,6 +86,15 @@ export const styles = css `
|
|
|
90
86
|
box-shadow: 0 0 0 3px ${colorStrokeFocus2};
|
|
91
87
|
outline: 1px solid ${colorStrokeFocus1};
|
|
92
88
|
}
|
|
89
|
+
|
|
90
|
+
:host([data-hasIndent]) {
|
|
91
|
+
display: grid;
|
|
92
|
+
grid-template-columns: 20px 1fr auto;
|
|
93
|
+
}
|
|
94
|
+
|
|
95
|
+
:host([data-hasIndent]) .tab-content {
|
|
96
|
+
grid-column: 2;
|
|
97
|
+
}
|
|
93
98
|
`.withBehaviors(forcedColorsStylesheetBehavior(css `
|
|
94
99
|
:host([aria-selected='true'])::after {
|
|
95
100
|
background-color: Highlight;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tab.styles.js","sourceRoot":"","sources":["../../../src/tab/tab.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,8BAA8B,EAAE,MAAM,mBAAmB,CAAC;AAC5E,OAAO,EACL,oBAAoB,EACpB,kBAAkB,EAClB,iBAAiB,EACjB,wBAAwB,EACxB,uBAAuB,EACvB,uBAAuB,EACvB,8BAA8B,EAC9B,wBAAwB,EACxB,iBAAiB,EACjB,iBAAiB,EACjB,cAAc,EACd,eAAe,EACf,kBAAkB,EAClB,iBAAiB,EACjB,kBAAkB,EAClB,uBAAuB,GACxB,MAAM,2BAA2B,CAAC;AAEnC,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;IACrB,OAAO,CAAC,aAAa,CAAC
|
|
1
|
+
{"version":3,"file":"tab.styles.js","sourceRoot":"","sources":["../../../src/tab/tab.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,8BAA8B,EAAE,MAAM,mBAAmB,CAAC;AAC5E,OAAO,EACL,oBAAoB,EACpB,kBAAkB,EAClB,iBAAiB,EACjB,wBAAwB,EACxB,uBAAuB,EACvB,uBAAuB,EACvB,8BAA8B,EAC9B,wBAAwB,EACxB,iBAAiB,EACjB,iBAAiB,EACjB,cAAc,EACd,eAAe,EACf,kBAAkB,EAClB,iBAAiB,EACjB,kBAAkB,EAClB,uBAAuB,GACxB,MAAM,2BAA2B,CAAC;AAEnC,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;IACrB,OAAO,CAAC,aAAa,CAAC;;;;;;;;;mBASP,iBAAiB;mBACjB,cAAc;iBAChB,eAAe;aACnB,uBAAuB;;;eAGrB,kBAAkB,IAAI,uBAAuB;qBACvC,kBAAkB;;;;;;;;;;aAU1B,uBAAuB;mBACjB,kBAAkB;;;;;;;;mBAQlB,iBAAiB;mBACjB,kBAAkB;;;;wBAIb,wBAAwB;qBAC3B,oBAAoB;;;;;;;;wBAQjB,wBAAwB;qBAC3B,oBAAoB;;;;;;;;wBAQjB,8BAA8B;;;;;;;;;YAS1C,8BAA8B;aAC7B,8BAA8B;;;;;;;;;;;;qBAYtB,iBAAiB;4BACV,iBAAiB;yBACpB,iBAAiB;;;;;;;;;;;CAWzC,CAAC,aAAa,CACb,8BAA8B,CAAC,GAAG,CAAA;;;;GAIjC,CAAC,CACH,CAAC"}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { FASTElement } from '@microsoft/fast-element';
|
|
2
|
+
import type { Tab } from '../tab/tab.js';
|
|
2
3
|
import { TablistOrientation } from './tablist.options.js';
|
|
3
4
|
/**
|
|
4
5
|
* A Tablist element that wraps a collection of tab elements
|
|
@@ -50,9 +51,19 @@ export declare class BaseTablist extends FASTElement {
|
|
|
50
51
|
*/
|
|
51
52
|
protected activeidChanged(oldValue: string, newValue: string): void;
|
|
52
53
|
/**
|
|
54
|
+
* Content slotted in the tab slot.
|
|
53
55
|
* @internal
|
|
54
56
|
*/
|
|
55
|
-
|
|
57
|
+
slottedTabs: Node[];
|
|
58
|
+
/**
|
|
59
|
+
* Updates the tabs property when content in the tabs slot changes.
|
|
60
|
+
* @internal
|
|
61
|
+
*/
|
|
62
|
+
slottedTabsChanged(prev: Node[] | undefined, next: Node[] | undefined): void;
|
|
63
|
+
/**
|
|
64
|
+
* @internal
|
|
65
|
+
*/
|
|
66
|
+
tabs: Tab[];
|
|
56
67
|
/**
|
|
57
68
|
* @internal
|
|
58
69
|
*/
|
|
@@ -61,7 +72,7 @@ export declare class BaseTablist extends FASTElement {
|
|
|
61
72
|
* A reference to the active tab
|
|
62
73
|
* @public
|
|
63
74
|
*/
|
|
64
|
-
activetab:
|
|
75
|
+
activetab: Tab;
|
|
65
76
|
private prevActiveTabIndex;
|
|
66
77
|
private activeTabIndex;
|
|
67
78
|
private tabIds;
|
|
@@ -4,6 +4,7 @@ import { keyArrowDown, keyArrowLeft, keyArrowRight, keyArrowUp, keyEnd, keyHome,
|
|
|
4
4
|
import { getDirection } from '../utils/index.js';
|
|
5
5
|
import { swapStates, toggleState } from '../utils/element-internals.js';
|
|
6
6
|
import { isFocusableElement } from '../utils/focusable-element.js';
|
|
7
|
+
import { isTab } from '../tab/tab.options.js';
|
|
7
8
|
import { TablistOrientation } from './tablist.options.js';
|
|
8
9
|
/**
|
|
9
10
|
* A Tablist element that wraps a collection of tab elements
|
|
@@ -133,6 +134,13 @@ export class BaseTablist extends FASTElement {
|
|
|
133
134
|
}
|
|
134
135
|
}
|
|
135
136
|
}
|
|
137
|
+
/**
|
|
138
|
+
* Updates the tabs property when content in the tabs slot changes.
|
|
139
|
+
* @internal
|
|
140
|
+
*/
|
|
141
|
+
slottedTabsChanged(prev, next) {
|
|
142
|
+
this.tabs = next?.filter(tab => isTab(tab)) ?? [];
|
|
143
|
+
}
|
|
136
144
|
/**
|
|
137
145
|
* @internal
|
|
138
146
|
*/
|
|
@@ -168,6 +176,7 @@ export class BaseTablist extends FASTElement {
|
|
|
168
176
|
*/
|
|
169
177
|
setTabs() {
|
|
170
178
|
this.activeTabIndex = this.getActiveIndex();
|
|
179
|
+
const hasStartSlot = this.tabs.some(tab => tab.start.assignedNodes().length > 0);
|
|
171
180
|
this.tabs.forEach((tab, index) => {
|
|
172
181
|
if (tab.slot === 'tab') {
|
|
173
182
|
const isActiveTab = this.activeTabIndex === index && isFocusableElement(tab);
|
|
@@ -181,6 +190,10 @@ export class BaseTablist extends FASTElement {
|
|
|
181
190
|
this.activetab = tab;
|
|
182
191
|
this.activeid = tabId;
|
|
183
192
|
}
|
|
193
|
+
// Only set the data-hasIndent attribute if the tab has a start slot and the orientation is vertical
|
|
194
|
+
if (hasStartSlot && this.orientation === TablistOrientation.vertical) {
|
|
195
|
+
tab.setAttribute('data-hasIndent', '');
|
|
196
|
+
}
|
|
184
197
|
}
|
|
185
198
|
});
|
|
186
199
|
}
|
|
@@ -243,6 +256,9 @@ __decorate([
|
|
|
243
256
|
__decorate([
|
|
244
257
|
attr
|
|
245
258
|
], BaseTablist.prototype, "activeid", void 0);
|
|
259
|
+
__decorate([
|
|
260
|
+
observable
|
|
261
|
+
], BaseTablist.prototype, "slottedTabs", void 0);
|
|
246
262
|
__decorate([
|
|
247
263
|
observable
|
|
248
264
|
], BaseTablist.prototype, "tabs", void 0);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tablist.base.js","sourceRoot":"","sources":["../../../src/tablist/tablist.base.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AACxE,OAAO,EACL,YAAY,EACZ,YAAY,EACZ,aAAa,EACb,UAAU,EACV,MAAM,EACN,OAAO,EACP,QAAQ,EACR,YAAY,GACb,MAAM,+BAA+B,CAAC;AACvC,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AACjD,OAAO,EAAE,UAAU,EAAE,WAAW,EAAE,MAAM,+BAA+B,CAAC;AACxE,OAAO,EAAE,kBAAkB,EAAE,MAAM,+BAA+B,CAAC;
|
|
1
|
+
{"version":3,"file":"tablist.base.js","sourceRoot":"","sources":["../../../src/tablist/tablist.base.ts"],"names":[],"mappings":"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"}
|
|
@@ -4,7 +4,7 @@ import { html, slotted } from '@microsoft/fast-element';
|
|
|
4
4
|
*/
|
|
5
5
|
export const template = html `
|
|
6
6
|
<template role="tablist">
|
|
7
|
-
<slot name="tab" ${slotted('
|
|
7
|
+
<slot name="tab" ${slotted('slottedTabs')}></slot>
|
|
8
8
|
</template>
|
|
9
9
|
`;
|
|
10
10
|
//# sourceMappingURL=tablist.template.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tablist.template.js","sourceRoot":"","sources":["../../../src/tablist/tablist.template.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,yBAAyB,CAAC;AAGxD;;GAEG;AACH,MAAM,CAAC,MAAM,QAAQ,GAAG,IAAI,CAAS;;uBAEd,OAAO,CAAC,
|
|
1
|
+
{"version":3,"file":"tablist.template.js","sourceRoot":"","sources":["../../../src/tablist/tablist.template.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,yBAAyB,CAAC;AAGxD;;GAEG;AACH,MAAM,CAAC,MAAM,QAAQ,GAAG,IAAI,CAAS;;uBAEd,OAAO,CAAC,aAAa,CAAC;;CAE5C,CAAC"}
|
package/dist/web-components.d.ts
CHANGED
|
@@ -1816,6 +1816,20 @@ export declare class BaseDropdown extends FASTElement {
|
|
|
1816
1816
|
* @internal
|
|
1817
1817
|
*/
|
|
1818
1818
|
controlSlot: HTMLSlotElement;
|
|
1819
|
+
/**
|
|
1820
|
+
* An abort controller to remove scroll and resize event listeners when the dropdown is closed or disconnected. Used
|
|
1821
|
+
* when the browser does not support CSS anchor positioning.
|
|
1822
|
+
*
|
|
1823
|
+
* @internal
|
|
1824
|
+
*/
|
|
1825
|
+
private debounceController?;
|
|
1826
|
+
/**
|
|
1827
|
+
* Repositions the listbox to align with the control element. Used when the browser does not support CSS anchor
|
|
1828
|
+
* positioning.
|
|
1829
|
+
*
|
|
1830
|
+
* @internal
|
|
1831
|
+
*/
|
|
1832
|
+
private repositionListbox;
|
|
1819
1833
|
/**
|
|
1820
1834
|
* The internal {@link https://developer.mozilla.org/docs/Web/API/ElementInternals | `ElementInternals`} instance for the component.
|
|
1821
1835
|
*
|
|
@@ -1835,11 +1849,11 @@ export declare class BaseDropdown extends FASTElement {
|
|
|
1835
1849
|
*/
|
|
1836
1850
|
static formAssociated: boolean;
|
|
1837
1851
|
/**
|
|
1838
|
-
*
|
|
1852
|
+
* The ID of the frame used for repositioning the listbox when the browser does not support CSS anchor positioning.
|
|
1839
1853
|
*
|
|
1840
1854
|
* @internal
|
|
1841
1855
|
*/
|
|
1842
|
-
|
|
1856
|
+
private frameId?;
|
|
1843
1857
|
/**
|
|
1844
1858
|
* A reference to the first freeform option, if present.
|
|
1845
1859
|
*
|
|
@@ -1975,6 +1989,12 @@ export declare class BaseDropdown extends FASTElement {
|
|
|
1975
1989
|
* @internal
|
|
1976
1990
|
*/
|
|
1977
1991
|
focusoutHandler(e: FocusEvent): boolean | void;
|
|
1992
|
+
/**
|
|
1993
|
+
* Resets the form value to its initial value when the form is reset.
|
|
1994
|
+
*
|
|
1995
|
+
* @internal
|
|
1996
|
+
*/
|
|
1997
|
+
formResetCallback(): void;
|
|
1978
1998
|
/**
|
|
1979
1999
|
* Ensures the active index is within bounds of the enabled options. Out-of-bounds indices are wrapped to the opposite
|
|
1980
2000
|
* end of the range.
|
|
@@ -2048,7 +2068,6 @@ export declare class BaseDropdown extends FASTElement {
|
|
|
2048
2068
|
* @internal
|
|
2049
2069
|
*/
|
|
2050
2070
|
protected updateFreeformOption(value?: string): void;
|
|
2051
|
-
connectedCallback(): void;
|
|
2052
2071
|
disconnectedCallback(): void;
|
|
2053
2072
|
/**
|
|
2054
2073
|
* Handles the connected event for the listbox.
|
|
@@ -2411,9 +2430,19 @@ export declare class BaseTablist extends FASTElement {
|
|
|
2411
2430
|
*/
|
|
2412
2431
|
protected activeidChanged(oldValue: string, newValue: string): void;
|
|
2413
2432
|
/**
|
|
2433
|
+
* Content slotted in the tab slot.
|
|
2414
2434
|
* @internal
|
|
2415
2435
|
*/
|
|
2416
|
-
|
|
2436
|
+
slottedTabs: Node[];
|
|
2437
|
+
/**
|
|
2438
|
+
* Updates the tabs property when content in the tabs slot changes.
|
|
2439
|
+
* @internal
|
|
2440
|
+
*/
|
|
2441
|
+
slottedTabsChanged(prev: Node[] | undefined, next: Node[] | undefined): void;
|
|
2442
|
+
/**
|
|
2443
|
+
* @internal
|
|
2444
|
+
*/
|
|
2445
|
+
tabs: Tab[];
|
|
2417
2446
|
/**
|
|
2418
2447
|
* @internal
|
|
2419
2448
|
*/
|
|
@@ -2422,7 +2451,7 @@ export declare class BaseTablist extends FASTElement {
|
|
|
2422
2451
|
* A reference to the active tab
|
|
2423
2452
|
* @public
|
|
2424
2453
|
*/
|
|
2425
|
-
activetab:
|
|
2454
|
+
activetab: Tab;
|
|
2426
2455
|
private prevActiveTabIndex;
|
|
2427
2456
|
private activeTabIndex;
|
|
2428
2457
|
private tabIds;
|
|
@@ -7426,6 +7455,16 @@ export declare function isDropdownOption(value: Node | null, tagName?: string):
|
|
|
7426
7455
|
*/
|
|
7427
7456
|
export declare function isListbox(element?: Node | null, tagName?: string): element is Listbox;
|
|
7428
7457
|
|
|
7458
|
+
/**
|
|
7459
|
+
* Predicate function that determines if the element should be considered a tab.
|
|
7460
|
+
*
|
|
7461
|
+
* @param element - The element to check.
|
|
7462
|
+
* @param tagName - The tag name to check.
|
|
7463
|
+
* @returns true if the element is a tab.
|
|
7464
|
+
* @public
|
|
7465
|
+
*/
|
|
7466
|
+
export declare function isTab(element?: Node | null, tagName?: string): element is Tab;
|
|
7467
|
+
|
|
7429
7468
|
/**
|
|
7430
7469
|
* Predicate function that determines if the element should be considered an tree-item.
|
|
7431
7470
|
*
|