@fluentui/web-components 3.0.0-beta.120 → 3.0.0-beta.121
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 +11 -2
- package/custom-elements.json +0 -56
- package/dist/esm/tree/tree.base.d.ts +6 -0
- package/dist/esm/tree/tree.base.js +6 -0
- package/dist/esm/tree/tree.base.js.map +1 -1
- package/dist/esm/tree/tree.template.js +2 -8
- package/dist/esm/tree/tree.template.js.map +1 -1
- package/dist/esm/tree-item/tree-item.base.d.ts +5 -0
- package/dist/esm/tree-item/tree-item.base.js +8 -0
- package/dist/esm/tree-item/tree-item.base.js.map +1 -1
- package/dist/esm/tree-item/tree-item.template.js +2 -9
- package/dist/esm/tree-item/tree-item.template.js.map +1 -1
- package/dist/web-components.d.ts +11 -0
- package/dist/web-components.js +12 -8
- package/dist/web-components.min.js +133 -133
- package/package.json +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,12 +1,21 @@
|
|
|
1
1
|
# Change Log - @fluentui/web-components
|
|
2
2
|
|
|
3
|
-
This log was last generated on
|
|
3
|
+
This log was last generated on Wed, 03 Sep 2025 04:08:27 GMT and should not be manually modified.
|
|
4
4
|
|
|
5
5
|
<!-- Start content -->
|
|
6
6
|
|
|
7
|
+
## [3.0.0-beta.121](https://github.com/microsoft/fluentui/tree/@fluentui/web-components_v3.0.0-beta.121)
|
|
8
|
+
|
|
9
|
+
Wed, 03 Sep 2025 04:08:27 GMT
|
|
10
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/web-components_v3.0.0-beta.120..@fluentui/web-components_v3.0.0-beta.121)
|
|
11
|
+
|
|
12
|
+
### Changes
|
|
13
|
+
|
|
14
|
+
- refactor: replace slotted with slotchange for tree and tree-item ([PR #35138](https://github.com/microsoft/fluentui/pull/35138) by machi@microsoft.com)
|
|
15
|
+
|
|
7
16
|
## [3.0.0-beta.120](https://github.com/microsoft/fluentui/tree/@fluentui/web-components_v3.0.0-beta.120)
|
|
8
17
|
|
|
9
|
-
Mon, 01 Sep 2025 04:08:
|
|
18
|
+
Mon, 01 Sep 2025 04:08:19 GMT
|
|
10
19
|
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/web-components_v3.0.0-beta.119..@fluentui/web-components_v3.0.0-beta.120)
|
|
11
20
|
|
|
12
21
|
### Changes
|
package/custom-elements.json
CHANGED
|
@@ -26702,15 +26702,6 @@
|
|
|
26702
26702
|
}
|
|
26703
26703
|
]
|
|
26704
26704
|
},
|
|
26705
|
-
{
|
|
26706
|
-
"kind": "field",
|
|
26707
|
-
"name": "childTreeItems",
|
|
26708
|
-
"type": {
|
|
26709
|
-
"text": "BaseTreeItem[] | undefined"
|
|
26710
|
-
},
|
|
26711
|
-
"privacy": "public",
|
|
26712
|
-
"default": "[]"
|
|
26713
|
-
},
|
|
26714
26705
|
{
|
|
26715
26706
|
"kind": "method",
|
|
26716
26707
|
"name": "childTreeItemsChanged",
|
|
@@ -26976,19 +26967,6 @@
|
|
|
26976
26967
|
"module": "src/tree-item/tree-item.base.ts"
|
|
26977
26968
|
}
|
|
26978
26969
|
},
|
|
26979
|
-
{
|
|
26980
|
-
"kind": "field",
|
|
26981
|
-
"name": "childTreeItems",
|
|
26982
|
-
"type": {
|
|
26983
|
-
"text": "BaseTreeItem[] | undefined"
|
|
26984
|
-
},
|
|
26985
|
-
"privacy": "public",
|
|
26986
|
-
"default": "[]",
|
|
26987
|
-
"inheritedFrom": {
|
|
26988
|
-
"name": "BaseTreeItem",
|
|
26989
|
-
"module": "src/tree-item/tree-item.base.ts"
|
|
26990
|
-
}
|
|
26991
|
-
},
|
|
26992
26970
|
{
|
|
26993
26971
|
"kind": "method",
|
|
26994
26972
|
"name": "childTreeItemsChanged",
|
|
@@ -27135,19 +27113,6 @@
|
|
|
27135
27113
|
"default": "null",
|
|
27136
27114
|
"description": "The currently selected tree item"
|
|
27137
27115
|
},
|
|
27138
|
-
{
|
|
27139
|
-
"kind": "field",
|
|
27140
|
-
"name": "childTreeItems",
|
|
27141
|
-
"type": {
|
|
27142
|
-
"text": "BaseTreeItem[]"
|
|
27143
|
-
},
|
|
27144
|
-
"default": "[]"
|
|
27145
|
-
},
|
|
27146
|
-
{
|
|
27147
|
-
"kind": "method",
|
|
27148
|
-
"name": "childTreeItemsChanged",
|
|
27149
|
-
"privacy": "public"
|
|
27150
|
-
},
|
|
27151
27116
|
{
|
|
27152
27117
|
"kind": "method",
|
|
27153
27118
|
"name": "updateCurrentSelected",
|
|
@@ -27287,27 +27252,6 @@
|
|
|
27287
27252
|
"module": "src/tree/tree.base.ts"
|
|
27288
27253
|
}
|
|
27289
27254
|
},
|
|
27290
|
-
{
|
|
27291
|
-
"kind": "field",
|
|
27292
|
-
"name": "childTreeItems",
|
|
27293
|
-
"type": {
|
|
27294
|
-
"text": "BaseTreeItem[]"
|
|
27295
|
-
},
|
|
27296
|
-
"default": "[]",
|
|
27297
|
-
"inheritedFrom": {
|
|
27298
|
-
"name": "BaseTree",
|
|
27299
|
-
"module": "src/tree/tree.base.ts"
|
|
27300
|
-
}
|
|
27301
|
-
},
|
|
27302
|
-
{
|
|
27303
|
-
"kind": "method",
|
|
27304
|
-
"name": "childTreeItemsChanged",
|
|
27305
|
-
"privacy": "public",
|
|
27306
|
-
"inheritedFrom": {
|
|
27307
|
-
"name": "BaseTree",
|
|
27308
|
-
"module": "src/tree/tree.base.ts"
|
|
27309
|
-
}
|
|
27310
|
-
},
|
|
27311
27255
|
{
|
|
27312
27256
|
"kind": "method",
|
|
27313
27257
|
"name": "updateCurrentSelected",
|
|
@@ -18,8 +18,12 @@ export declare class BaseTree extends FASTElement {
|
|
|
18
18
|
* @internal
|
|
19
19
|
*/
|
|
20
20
|
elementInternals: ElementInternals;
|
|
21
|
+
/** @internal */
|
|
22
|
+
defaultSlot: HTMLSlotElement;
|
|
21
23
|
constructor();
|
|
24
|
+
/** @internal */
|
|
22
25
|
childTreeItems: BaseTreeItem[];
|
|
26
|
+
/** @internal */
|
|
23
27
|
childTreeItemsChanged(): void;
|
|
24
28
|
/**
|
|
25
29
|
* Updates current selected when slottedTreeItems changes
|
|
@@ -65,4 +69,6 @@ export declare class BaseTree extends FASTElement {
|
|
|
65
69
|
* Move focus to a tree item based on its offset from the provided item
|
|
66
70
|
*/
|
|
67
71
|
private focusNextNode;
|
|
72
|
+
/** @internal */
|
|
73
|
+
handleDefaultSlotChange(): void;
|
|
68
74
|
}
|
|
@@ -22,9 +22,11 @@ export class BaseTree extends FASTElement {
|
|
|
22
22
|
* @internal
|
|
23
23
|
*/
|
|
24
24
|
this.elementInternals = this.attachInternals();
|
|
25
|
+
/** @internal */
|
|
25
26
|
this.childTreeItems = [];
|
|
26
27
|
this.elementInternals.role = 'tree';
|
|
27
28
|
}
|
|
29
|
+
/** @internal */
|
|
28
30
|
childTreeItemsChanged() {
|
|
29
31
|
this.updateCurrentSelected();
|
|
30
32
|
}
|
|
@@ -221,6 +223,10 @@ export class BaseTree extends FASTElement {
|
|
|
221
223
|
focusItem.focus();
|
|
222
224
|
}
|
|
223
225
|
}
|
|
226
|
+
/** @internal */
|
|
227
|
+
handleDefaultSlotChange() {
|
|
228
|
+
this.childTreeItems = this.defaultSlot.assignedElements().filter(el => isTreeItem(el));
|
|
229
|
+
}
|
|
224
230
|
}
|
|
225
231
|
__decorate([
|
|
226
232
|
observable
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tree.base.js","sourceRoot":"","sources":["../../../src/tree/tree.base.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAClE,OAAO,EACL,aAAa,EACb,YAAY,EACZ,YAAY,EACZ,aAAa,EACb,UAAU,EACV,MAAM,EACN,QAAQ,EACR,OAAO,EACP,QAAQ,GACT,MAAM,+BAA+B,CAAC;AAEvC,OAAO,EAAE,UAAU,EAAE,MAAM,gCAAgC,CAAC;AAE5D,MAAM,OAAO,QAAS,SAAQ,WAAW;
|
|
1
|
+
{"version":3,"file":"tree.base.js","sourceRoot":"","sources":["../../../src/tree/tree.base.ts"],"names":[],"mappings":"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"}
|
|
@@ -1,5 +1,4 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import { FluentDesignSystem } from '../fluent-design-system.js';
|
|
1
|
+
import { html, ref } from '@microsoft/fast-element';
|
|
3
2
|
export const template = html `
|
|
4
3
|
<template
|
|
5
4
|
tabindex="0"
|
|
@@ -9,12 +8,7 @@ export const template = html `
|
|
|
9
8
|
@keydown="${(x, c) => x.keydownHandler(c.event)}"
|
|
10
9
|
@change="${(x, c) => x.changeHandler(c.event)}"
|
|
11
10
|
>
|
|
12
|
-
<slot
|
|
13
|
-
${slotted({
|
|
14
|
-
property: 'childTreeItems',
|
|
15
|
-
filter: elements(`${FluentDesignSystem.prefix}-tree-item`),
|
|
16
|
-
})}
|
|
17
|
-
></slot>
|
|
11
|
+
<slot ${ref('defaultSlot')} @slotchange="${x => x.handleDefaultSlotChange()}"></slot>
|
|
18
12
|
</template>
|
|
19
13
|
`;
|
|
20
14
|
//# sourceMappingURL=tree.template.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tree.template.js","sourceRoot":"","sources":["../../../src/tree/tree.template.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"tree.template.js","sourceRoot":"","sources":["../../../src/tree/tree.template.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAGpD,MAAM,CAAC,MAAM,QAAQ,GAAG,IAAI,CAAM;;;cAGpB,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,KAAK,CAAC;gBAC/B,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,KAAmB,CAAC;iBAC9C,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,KAAmB,CAAC;gBAC/C,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,KAAsB,CAAC;eACrD,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,KAAK,CAAC;;YAErC,GAAG,CAAC,aAAa,CAAC,iBAAiB,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,uBAAuB,EAAE;;CAE9E,CAAC"}
|
|
@@ -6,6 +6,8 @@ export declare class BaseTreeItem extends FASTElement {
|
|
|
6
6
|
* @internal
|
|
7
7
|
*/
|
|
8
8
|
elementInternals: ElementInternals;
|
|
9
|
+
/** @internal */
|
|
10
|
+
itemSlot: HTMLSlotElement;
|
|
9
11
|
constructor();
|
|
10
12
|
/**
|
|
11
13
|
* When true, the control will be appear expanded by user interaction.
|
|
@@ -50,6 +52,7 @@ export declare class BaseTreeItem extends FASTElement {
|
|
|
50
52
|
*/
|
|
51
53
|
dataIndent: number | undefined;
|
|
52
54
|
protected dataIndentChanged(prev: number, next: number): void;
|
|
55
|
+
/** @internal */
|
|
53
56
|
childTreeItems: BaseTreeItem[] | undefined;
|
|
54
57
|
/**
|
|
55
58
|
* Handles changes to the child tree items
|
|
@@ -80,4 +83,6 @@ export declare class BaseTreeItem extends FASTElement {
|
|
|
80
83
|
*/
|
|
81
84
|
get isNestedItem(): boolean;
|
|
82
85
|
protected updateTabindexBySelected(): void;
|
|
86
|
+
/** @internal */
|
|
87
|
+
handleItemSlotChange(): void;
|
|
83
88
|
}
|
|
@@ -30,6 +30,7 @@ export class BaseTreeItem extends FASTElement {
|
|
|
30
30
|
* HTML Attribute: empty
|
|
31
31
|
*/
|
|
32
32
|
this.empty = false;
|
|
33
|
+
/** @internal */
|
|
33
34
|
this.childTreeItems = [];
|
|
34
35
|
this.elementInternals.role = 'treeitem';
|
|
35
36
|
}
|
|
@@ -133,7 +134,14 @@ export class BaseTreeItem extends FASTElement {
|
|
|
133
134
|
this.tabIndex = this.selected ? 0 : -1;
|
|
134
135
|
}
|
|
135
136
|
}
|
|
137
|
+
/** @internal */
|
|
138
|
+
handleItemSlotChange() {
|
|
139
|
+
this.childTreeItems = this.itemSlot.assignedElements().filter(el => isTreeItem(el));
|
|
140
|
+
}
|
|
136
141
|
}
|
|
142
|
+
__decorate([
|
|
143
|
+
observable
|
|
144
|
+
], BaseTreeItem.prototype, "itemSlot", void 0);
|
|
137
145
|
__decorate([
|
|
138
146
|
attr({ mode: 'boolean' })
|
|
139
147
|
], BaseTreeItem.prototype, "expanded", void 0);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tree-item.base.js","sourceRoot":"","sources":["../../../src/tree-item/tree-item.base.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,GAAG,EAAiB,WAAW,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAC5F,OAAO,EAAE,WAAW,EAAE,MAAM,+BAA+B,CAAC;AAC5D,OAAO,EAAE,UAAU,EAAE,MAAM,wBAAwB,CAAC;AAEpD,MAAM,OAAO,YAAa,SAAQ,WAAW;
|
|
1
|
+
{"version":3,"file":"tree-item.base.js","sourceRoot":"","sources":["../../../src/tree-item/tree-item.base.ts"],"names":[],"mappings":"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"}
|
|
@@ -1,5 +1,4 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import { FluentDesignSystem } from '../fluent-design-system.js';
|
|
1
|
+
import { html, ref } from '@microsoft/fast-element';
|
|
3
2
|
const chevronIcon = html `
|
|
4
3
|
<svg viewBox="0 0 12 12" fill="currentColor">
|
|
5
4
|
<path
|
|
@@ -23,13 +22,7 @@ export const template = html `
|
|
|
23
22
|
</div>
|
|
24
23
|
</div>
|
|
25
24
|
<div role="group" class="items" part="items">
|
|
26
|
-
<slot
|
|
27
|
-
name="item"
|
|
28
|
-
${slotted({
|
|
29
|
-
property: 'childTreeItems',
|
|
30
|
-
filter: elements(`${FluentDesignSystem.prefix}-tree-item`),
|
|
31
|
-
})}
|
|
32
|
-
></slot>
|
|
25
|
+
<slot name="item" ${ref('itemSlot')} @slotchange="${x => x.handleItemSlotChange()}"></slot>
|
|
33
26
|
</div>
|
|
34
27
|
</template>
|
|
35
28
|
`;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tree-item.template.js","sourceRoot":"","sources":["../../../src/tree-item/tree-item.template.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"tree-item.template.js","sourceRoot":"","sources":["../../../src/tree-item/tree-item.template.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAGpD,MAAM,WAAW,GAAG,IAAI,CAAA;;;;;;CAMvB,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAG,IAAI,CAAU;oBAClB,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC;;;;iCAI1B,WAAW;;;;;;;;;;;0BAWlB,GAAG,CAAC,UAAU,CAAC,iBAAiB,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,oBAAoB,EAAE;;;CAGtF,CAAC"}
|
package/dist/web-components.d.ts
CHANGED
|
@@ -3327,8 +3327,12 @@ export declare class BaseTree extends FASTElement {
|
|
|
3327
3327
|
* @internal
|
|
3328
3328
|
*/
|
|
3329
3329
|
elementInternals: ElementInternals;
|
|
3330
|
+
/** @internal */
|
|
3331
|
+
defaultSlot: HTMLSlotElement;
|
|
3330
3332
|
constructor();
|
|
3333
|
+
/** @internal */
|
|
3331
3334
|
childTreeItems: BaseTreeItem[];
|
|
3335
|
+
/** @internal */
|
|
3332
3336
|
childTreeItemsChanged(): void;
|
|
3333
3337
|
/**
|
|
3334
3338
|
* Updates current selected when slottedTreeItems changes
|
|
@@ -3374,6 +3378,8 @@ export declare class BaseTree extends FASTElement {
|
|
|
3374
3378
|
* Move focus to a tree item based on its offset from the provided item
|
|
3375
3379
|
*/
|
|
3376
3380
|
private focusNextNode;
|
|
3381
|
+
/** @internal */
|
|
3382
|
+
handleDefaultSlotChange(): void;
|
|
3377
3383
|
}
|
|
3378
3384
|
|
|
3379
3385
|
declare class BaseTreeItem extends FASTElement {
|
|
@@ -3383,6 +3389,8 @@ declare class BaseTreeItem extends FASTElement {
|
|
|
3383
3389
|
* @internal
|
|
3384
3390
|
*/
|
|
3385
3391
|
elementInternals: ElementInternals;
|
|
3392
|
+
/** @internal */
|
|
3393
|
+
itemSlot: HTMLSlotElement;
|
|
3386
3394
|
constructor();
|
|
3387
3395
|
/**
|
|
3388
3396
|
* When true, the control will be appear expanded by user interaction.
|
|
@@ -3427,6 +3435,7 @@ declare class BaseTreeItem extends FASTElement {
|
|
|
3427
3435
|
*/
|
|
3428
3436
|
dataIndent: number | undefined;
|
|
3429
3437
|
protected dataIndentChanged(prev: number, next: number): void;
|
|
3438
|
+
/** @internal */
|
|
3430
3439
|
childTreeItems: BaseTreeItem[] | undefined;
|
|
3431
3440
|
/**
|
|
3432
3441
|
* Handles changes to the child tree items
|
|
@@ -3457,6 +3466,8 @@ declare class BaseTreeItem extends FASTElement {
|
|
|
3457
3466
|
*/
|
|
3458
3467
|
get isNestedItem(): boolean;
|
|
3459
3468
|
protected updateTabindexBySelected(): void;
|
|
3469
|
+
/** @internal */
|
|
3470
|
+
handleItemSlotChange(): void;
|
|
3460
3471
|
}
|
|
3461
3472
|
|
|
3462
3473
|
/**
|
package/dist/web-components.js
CHANGED
|
@@ -13463,6 +13463,7 @@ class BaseTree extends FASTElement {
|
|
|
13463
13463
|
this.childTreeItems = [];
|
|
13464
13464
|
this.elementInternals.role = "tree";
|
|
13465
13465
|
}
|
|
13466
|
+
/** @internal */
|
|
13466
13467
|
childTreeItemsChanged() {
|
|
13467
13468
|
this.updateCurrentSelected();
|
|
13468
13469
|
}
|
|
@@ -13649,6 +13650,10 @@ class BaseTree extends FASTElement {
|
|
|
13649
13650
|
focusItem.focus();
|
|
13650
13651
|
}
|
|
13651
13652
|
}
|
|
13653
|
+
/** @internal */
|
|
13654
|
+
handleDefaultSlotChange() {
|
|
13655
|
+
this.childTreeItems = this.defaultSlot.assignedElements().filter(el => isTreeItem(el));
|
|
13656
|
+
}
|
|
13652
13657
|
}
|
|
13653
13658
|
__decorateClass$3([observable], BaseTree.prototype, "currentSelected", 2);
|
|
13654
13659
|
__decorateClass$3([observable], BaseTree.prototype, "childTreeItems", 2);
|
|
@@ -13703,10 +13708,7 @@ const styles$1 = css`
|
|
|
13703
13708
|
|
|
13704
13709
|
:host{outline:none}`;
|
|
13705
13710
|
|
|
13706
|
-
const template$1 = html`<template tabindex="0" @click="${(x, c) => x.clickHandler(c.event)}" @focusin="${(x, c) => x.focusHandler(c.event)}" @focusout="${(x, c) => x.blurHandler(c.event)}" @keydown="${(x, c) => x.keydownHandler(c.event)}" @change="${(x, c) => x.changeHandler(c.event)}"><slot ${
|
|
13707
|
-
property: "childTreeItems",
|
|
13708
|
-
filter: elements(`${FluentDesignSystem.prefix}-tree-item`)
|
|
13709
|
-
})}></slot></template>`;
|
|
13711
|
+
const template$1 = html`<template tabindex="0" @click="${(x, c) => x.clickHandler(c.event)}" @focusin="${(x, c) => x.focusHandler(c.event)}" @focusout="${(x, c) => x.blurHandler(c.event)}" @keydown="${(x, c) => x.keydownHandler(c.event)}" @change="${(x, c) => x.changeHandler(c.event)}"><slot ${ref("defaultSlot")} @slotchange="${x => x.handleDefaultSlotChange()}"></slot></template>`;
|
|
13710
13712
|
|
|
13711
13713
|
const definition$1 = Tree.compose({
|
|
13712
13714
|
name: `${FluentDesignSystem.prefix}-tree`,
|
|
@@ -13835,7 +13837,12 @@ class BaseTreeItem extends FASTElement {
|
|
|
13835
13837
|
this.tabIndex = this.selected ? 0 : -1;
|
|
13836
13838
|
}
|
|
13837
13839
|
}
|
|
13840
|
+
/** @internal */
|
|
13841
|
+
handleItemSlotChange() {
|
|
13842
|
+
this.childTreeItems = this.itemSlot.assignedElements().filter(el => isTreeItem(el));
|
|
13843
|
+
}
|
|
13838
13844
|
}
|
|
13845
|
+
__decorateClass$1([observable], BaseTreeItem.prototype, "itemSlot", 2);
|
|
13839
13846
|
__decorateClass$1([attr({
|
|
13840
13847
|
mode: "boolean"
|
|
13841
13848
|
})], BaseTreeItem.prototype, "expanded", 2);
|
|
@@ -13914,10 +13921,7 @@ const styles = css`
|
|
|
13914
13921
|
${colorStrokeFocus2} inset}.positioning-region{display:flex;align-items:center;justify-content:space-between;cursor:pointer;height:${spacingVerticalXXXL};padding-inline-start:calc(var(--indent) * ${spacingHorizontalXXL});padding-inline-end:${spacingVerticalS};border-radius:${borderRadiusMedium};background-color:${colorSubtleBackground};color:${colorNeutralForeground2};gap:${spacingHorizontalXS}}@media (prefers-contrast:more){:host(:focus-visible) .positioning-region{outline:1px solid ${colorStrokeFocus2}}}.content{display:flex;align-items:center;gap:${spacingHorizontalXS}}.chevron{display:flex;align-items:center;flex-shrink:0;justify-content:center;width:${spacingHorizontalXXL};height:${spacingVerticalXXL};transition:transform ${durationFaster} ${curveEasyEaseMax};transform:rotate(0deg)}.chevron:dir(rtl){transform:rotate(180deg)}.chevron svg{inline-size:12px;block-size:12px}.aside{display:flex;align-items:center}.positioning-region:hover{background-color:${colorSubtleBackgroundHover};color:${colorNeutralForeground2Hover}}.positioning-region:active{background-color:${colorSubtleBackgroundPressed};color:${colorNeutralForeground2Pressed}}::slotted([slot='start']),::slotted([slot='end']),::slotted(:not([slot])){display:flex;align-items:center;min-width:0}::slotted([slot='start']){flex-shrink:0}::slotted(:not([slot])){padding-inline:${spacingHorizontalXXS}}.items{display:none}:host([expanded]) .items{display:block}:host([empty]) .chevron,:host([empty]) .items{visibility:hidden}:host([selected]) .positioning-region{background-color:${colorSubtleBackgroundSelected};color:${colorNeutralForeground2Selected}}:host([selected]) .content,:host([selected]) .chevron{color:${colorNeutralForeground3Selected}}:host([size='small']) .positioning-region{height:${spacingVerticalXXL};padding-inline-start:calc(var(--indent) * ${spacingHorizontalM})}:host([appearance='subtle-alpha']) .positioning-region:hover{background-color:${colorSubtleBackgroundLightAlphaHover}}:host([appearance='subtle-alpha']) .positioning-region:active{background-color:${colorSubtleBackgroundLightAlphaPressed}}:host([appearance='subtle-alpha'][selected]) .positioning-region{background-color:${colorSubtleBackgroundLightAlphaSelected};color:${colorNeutralForeground2Selected}}:host([appearance='transparent']) .positioning-region{background-color:${colorTransparentBackground}}:host([appearance='transparent']) .positioning-region:hover{background-color:${colorTransparentBackgroundHover}}:host([appearance='transparent']) .positioning-region:active{background-color:${colorTransparentBackgroundPressed}}:host([appearance='transparent'][selected]) .positioning-region{background-color:${colorTransparentBackgroundSelected};color:${colorNeutralForeground2Selected}}:host([expanded]) .chevron{transform:rotate(90deg)}`;
|
|
13915
13922
|
|
|
13916
13923
|
const chevronIcon = html`<svg viewBox="0 0 12 12" fill="currentColor"><path d="M4.65 2.15a.5.5 0 000 .7L7.79 6 4.65 9.15a.5.5 0 10.7.7l3.5-3.5a.5.5 0 000-.7l-3.5-3.5a.5.5 0 00-.7 0z"></path></svg>`;
|
|
13917
|
-
const template = html`<template slot="${x => x.isNestedItem ? "item" : void 0}"><div class="positioning-region" part="positioning-region"><div class="content" part="content"><span class="chevron" part="chevron" aria-hidden="true"><slot name="chevron">${chevronIcon}</slot></span><slot name="start"></slot><slot></slot><slot name="end"></slot></div><div class="aside" part="aside"><slot name="aside"></slot></div></div><div role="group" class="items" part="items"><slot name="item" ${
|
|
13918
|
-
property: "childTreeItems",
|
|
13919
|
-
filter: elements(`${FluentDesignSystem.prefix}-tree-item`)
|
|
13920
|
-
})}></slot></div></template>`;
|
|
13924
|
+
const template = html`<template slot="${x => x.isNestedItem ? "item" : void 0}"><div class="positioning-region" part="positioning-region"><div class="content" part="content"><span class="chevron" part="chevron" aria-hidden="true"><slot name="chevron">${chevronIcon}</slot></span><slot name="start"></slot><slot></slot><slot name="end"></slot></div><div class="aside" part="aside"><slot name="aside"></slot></div></div><div role="group" class="items" part="items"><slot name="item" ${ref("itemSlot")} @slotchange="${x => x.handleItemSlotChange()}"></slot></div></template>`;
|
|
13921
13925
|
|
|
13922
13926
|
const definition = TreeItem.compose({
|
|
13923
13927
|
name: `${FluentDesignSystem.prefix}-tree-item`,
|