@fluentui/web-components 3.0.0-rc.1 → 3.0.0-rc.11
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 +93 -2
- package/custom-elements.json +773 -1306
- package/dist/esm/anchor-button/anchor-button.base.js +4 -0
- package/dist/esm/anchor-button/anchor-button.base.js.map +1 -1
- package/dist/esm/avatar/avatar.base.d.ts +75 -1
- package/dist/esm/avatar/avatar.base.js +110 -1
- package/dist/esm/avatar/avatar.base.js.map +1 -1
- package/dist/esm/avatar/avatar.js +1 -1
- package/dist/esm/avatar/avatar.js.map +1 -1
- package/dist/esm/avatar/avatar.styles.js +24 -7
- package/dist/esm/avatar/avatar.styles.js.map +1 -1
- package/dist/esm/avatar/avatar.template.js +4 -3
- package/dist/esm/avatar/avatar.template.js.map +1 -1
- package/dist/esm/badge/badge.options.d.ts +3 -1
- package/dist/esm/badge/badge.options.js.map +1 -1
- package/dist/esm/button/button.base.d.ts +15 -1
- package/dist/esm/button/button.base.js +27 -24
- package/dist/esm/button/button.base.js.map +1 -1
- package/dist/esm/button/button.template.d.ts +3 -3
- package/dist/esm/button/button.template.js.map +1 -1
- package/dist/esm/compound-button/compound-button.styles.js +1 -1
- package/dist/esm/compound-button/compound-button.styles.js.map +1 -1
- package/dist/esm/counter-badge/counter-badge.d.ts +2 -1
- package/dist/esm/counter-badge/counter-badge.js +2 -1
- package/dist/esm/counter-badge/counter-badge.js.map +1 -1
- package/dist/esm/dialog/dialog.d.ts +31 -11
- package/dist/esm/dialog/dialog.js +41 -26
- package/dist/esm/dialog/dialog.js.map +1 -1
- package/dist/esm/dialog/dialog.template.js.map +1 -1
- package/dist/esm/dialog-body/dialog-body.js +1 -1
- package/dist/esm/dialog-body/dialog-body.js.map +1 -1
- package/dist/esm/drawer/drawer.d.ts +18 -9
- package/dist/esm/drawer/drawer.js +12 -7
- package/dist/esm/drawer/drawer.js.map +1 -1
- package/dist/esm/drawer-body/drawer-body.js +1 -1
- package/dist/esm/drawer-body/drawer-body.js.map +1 -1
- package/dist/esm/dropdown/dropdown.base.d.ts +1 -0
- package/dist/esm/dropdown/dropdown.base.js +24 -15
- package/dist/esm/dropdown/dropdown.base.js.map +1 -1
- package/dist/esm/index-rollup.d.ts +1 -2
- package/dist/esm/index-rollup.js +1 -2
- package/dist/esm/index-rollup.js.map +1 -1
- package/dist/esm/index.d.ts +2 -4
- package/dist/esm/index.js +0 -2
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/listbox/listbox.d.ts +12 -7
- package/dist/esm/listbox/listbox.js +27 -17
- package/dist/esm/listbox/listbox.js.map +1 -1
- package/dist/esm/listbox/listbox.template.js +2 -3
- package/dist/esm/listbox/listbox.template.js.map +1 -1
- package/dist/esm/menu/menu.d.ts +7 -0
- package/dist/esm/menu/menu.js +22 -17
- package/dist/esm/menu/menu.js.map +1 -1
- package/dist/esm/menu-list/menu-list.js +4 -4
- package/dist/esm/menu-list/menu-list.js.map +1 -1
- package/dist/esm/message-bar/message-bar.d.ts +2 -1
- package/dist/esm/message-bar/message-bar.js +2 -1
- package/dist/esm/message-bar/message-bar.js.map +1 -1
- package/dist/esm/message-bar/message-bar.options.d.ts +6 -3
- package/dist/esm/message-bar/message-bar.options.js +6 -3
- package/dist/esm/message-bar/message-bar.options.js.map +1 -1
- package/dist/esm/option/option.js +1 -1
- package/dist/esm/option/option.js.map +1 -1
- package/dist/esm/progress-bar/progress-bar.base.d.ts +35 -8
- package/dist/esm/progress-bar/progress-bar.base.js +41 -20
- package/dist/esm/progress-bar/progress-bar.base.js.map +1 -1
- package/dist/esm/progress-bar/progress-bar.d.ts +8 -2
- package/dist/esm/progress-bar/progress-bar.js.map +1 -1
- package/dist/esm/radio/radio.options.d.ts +9 -0
- package/dist/esm/radio/radio.options.js +12 -1
- package/dist/esm/radio/radio.options.js.map +1 -1
- package/dist/esm/radio-group/radio-group.d.ts +13 -7
- package/dist/esm/radio-group/radio-group.js +14 -21
- package/dist/esm/radio-group/radio-group.js.map +1 -1
- package/dist/esm/radio-group/radio-group.template.js +2 -2
- package/dist/esm/radio-group/radio-group.template.js.map +1 -1
- package/dist/esm/rating-display/rating-display.base.d.ts +11 -1
- package/dist/esm/rating-display/rating-display.base.js +24 -11
- package/dist/esm/rating-display/rating-display.base.js.map +1 -1
- package/dist/esm/slider/slider.d.ts +7 -3
- package/dist/esm/slider/slider.js +46 -28
- package/dist/esm/slider/slider.js.map +1 -1
- package/dist/esm/styles/partials/badge.partials.d.ts +2 -1
- package/dist/esm/styles/partials/badge.partials.js +2 -1
- package/dist/esm/styles/partials/badge.partials.js.map +1 -1
- package/dist/esm/tab/tab.d.ts +13 -1
- package/dist/esm/tab/tab.js +16 -2
- package/dist/esm/tab/tab.js.map +1 -1
- package/dist/esm/tablist/tablist.base.d.ts +2 -1
- package/dist/esm/tablist/tablist.base.js +109 -95
- package/dist/esm/tablist/tablist.base.js.map +1 -1
- package/dist/esm/tablist/tablist.d.ts +2 -1
- package/dist/esm/tablist/tablist.js +2 -2
- package/dist/esm/tablist/tablist.js.map +1 -1
- package/dist/esm/text-input/text-input.base.js +12 -5
- package/dist/esm/text-input/text-input.base.js.map +1 -1
- package/dist/esm/text-input/text-input.template.d.ts +1 -1
- package/dist/esm/text-input/text-input.template.js +2 -8
- package/dist/esm/text-input/text-input.template.js.map +1 -1
- package/dist/esm/textarea/textarea.base.d.ts +12 -3
- package/dist/esm/textarea/textarea.base.js +42 -24
- package/dist/esm/textarea/textarea.base.js.map +1 -1
- package/dist/esm/textarea/textarea.template.js +1 -1
- package/dist/esm/textarea/textarea.template.js.map +1 -1
- package/dist/esm/theme/design-tokens.d.ts +115 -0
- package/dist/esm/theme/design-tokens.js +115 -0
- package/dist/esm/theme/design-tokens.js.map +1 -1
- package/dist/esm/theme/set-theme.d.ts +2 -2
- package/dist/esm/theme/set-theme.js +1 -1
- package/dist/esm/tree/tree.base.d.ts +9 -1
- package/dist/esm/tree/tree.base.js +17 -3
- package/dist/esm/tree/tree.base.js.map +1 -1
- package/dist/esm/tree/tree.d.ts +8 -2
- package/dist/esm/tree/tree.js +8 -2
- package/dist/esm/tree/tree.js.map +1 -1
- package/dist/esm/tree-item/tree-item.base.d.ts +15 -2
- package/dist/esm/tree-item/tree-item.base.js +22 -14
- package/dist/esm/tree-item/tree-item.base.js.map +1 -1
- package/dist/esm/utils/focusable-element.js +2 -1
- package/dist/esm/utils/focusable-element.js.map +1 -1
- package/dist/esm/utils/request-idle-callback.js +4 -9
- package/dist/esm/utils/request-idle-callback.js.map +1 -1
- package/dist/esm/utils/typings.d.ts +8 -0
- package/dist/esm/utils/typings.js +15 -1
- package/dist/esm/utils/typings.js.map +1 -1
- package/dist/web-components.d.ts +443 -318
- package/dist/web-components.js +1374 -1427
- package/dist/web-components.min.js +254 -248
- package/package.json +5 -6
- package/dist/esm/tab-panel/define.d.ts +0 -1
- package/dist/esm/tab-panel/define.js +0 -7
- package/dist/esm/tab-panel/define.js.map +0 -1
- package/dist/esm/tab-panel/index.d.ts +0 -4
- package/dist/esm/tab-panel/index.js +0 -5
- package/dist/esm/tab-panel/index.js.map +0 -1
- package/dist/esm/tab-panel/tab-panel.bench.d.ts +0 -3
- package/dist/esm/tab-panel/tab-panel.bench.js +0 -13
- package/dist/esm/tab-panel/tab-panel.bench.js.map +0 -1
- package/dist/esm/tab-panel/tab-panel.d.ts +0 -8
- package/dist/esm/tab-panel/tab-panel.definition.d.ts +0 -5
- package/dist/esm/tab-panel/tab-panel.definition.js +0 -13
- package/dist/esm/tab-panel/tab-panel.definition.js.map +0 -1
- package/dist/esm/tab-panel/tab-panel.js +0 -9
- package/dist/esm/tab-panel/tab-panel.js.map +0 -1
- package/dist/esm/tab-panel/tab-panel.styles.d.ts +0 -1
- package/dist/esm/tab-panel/tab-panel.styles.js +0 -12
- package/dist/esm/tab-panel/tab-panel.styles.js.map +0 -1
- package/dist/esm/tab-panel/tab-panel.template.d.ts +0 -7
- package/dist/esm/tab-panel/tab-panel.template.js +0 -13
- package/dist/esm/tab-panel/tab-panel.template.js.map +0 -1
- package/dist/esm/tabs/define.d.ts +0 -1
- package/dist/esm/tabs/define.js +0 -7
- package/dist/esm/tabs/define.js.map +0 -1
- package/dist/esm/tabs/index.d.ts +0 -6
- package/dist/esm/tabs/index.js +0 -6
- package/dist/esm/tabs/index.js.map +0 -1
- package/dist/esm/tabs/tabs.base.d.ts +0 -90
- package/dist/esm/tabs/tabs.base.js +0 -279
- package/dist/esm/tabs/tabs.base.js.map +0 -1
- package/dist/esm/tabs/tabs.bench.d.ts +0 -3
- package/dist/esm/tabs/tabs.bench.js +0 -32
- package/dist/esm/tabs/tabs.bench.js.map +0 -1
- package/dist/esm/tabs/tabs.d.ts +0 -100
- package/dist/esm/tabs/tabs.definition.d.ts +0 -5
- package/dist/esm/tabs/tabs.definition.js +0 -13
- package/dist/esm/tabs/tabs.definition.js.map +0 -1
- package/dist/esm/tabs/tabs.js +0 -180
- package/dist/esm/tabs/tabs.js.map +0 -1
- package/dist/esm/tabs/tabs.options.d.ts +0 -32
- package/dist/esm/tabs/tabs.options.js +0 -16
- package/dist/esm/tabs/tabs.options.js.map +0 -1
- package/dist/esm/tabs/tabs.styles.d.ts +0 -1
- package/dist/esm/tabs/tabs.styles.js +0 -230
- package/dist/esm/tabs/tabs.styles.js.map +0 -1
- package/dist/esm/tabs/tabs.template.d.ts +0 -8
- package/dist/esm/tabs/tabs.template.js +0 -19
- package/dist/esm/tabs/tabs.template.js.map +0 -1
|
@@ -37,6 +37,7 @@ export class BaseAnchor extends FASTElement {
|
|
|
37
37
|
}
|
|
38
38
|
connectedCallback() {
|
|
39
39
|
super.connectedCallback();
|
|
40
|
+
this.tabIndex = Number(this.getAttribute('tabindex') ?? 0) < 0 ? -1 : 0;
|
|
40
41
|
Observable.getNotifier(this).subscribe(this);
|
|
41
42
|
Object.keys(this.$fastController.definition.attributeLookup).forEach(key => {
|
|
42
43
|
this.handleChange(this, key);
|
|
@@ -70,6 +71,9 @@ export class BaseAnchor extends FASTElement {
|
|
|
70
71
|
clickHandler(e) {
|
|
71
72
|
if (this.href) {
|
|
72
73
|
const newTab = !this.isMac ? e.ctrlKey : e.metaKey;
|
|
74
|
+
if (newTab) {
|
|
75
|
+
e.preventDefault();
|
|
76
|
+
}
|
|
73
77
|
this.handleNavigation(newTab);
|
|
74
78
|
}
|
|
75
79
|
return true;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"anchor-button.base.js","sourceRoot":"","sources":["../../../src/anchor-button/anchor-button.base.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AACxE,OAAO,EAAE,QAAQ,EAAE,MAAM,+BAA+B,CAAC;AACzD,OAAO,EAAE,gBAAgB,EAAqB,MAAM,4BAA4B,CAAC;AAEjF;;;;;;;;;;;GAWG;AACH,MAAM,OAAO,UAAW,SAAQ,WAAW;IA6GzC;QACE,KAAK,EAAE,CAAC;QA7GV;;;WAGG;QACc,UAAK,GAAG,SAAS,CAAC,SAAS,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;QAE7D;;;;WAIG;QACI,qBAAgB,GAAqB,IAAI,CAAC,eAAe,EAAE,CAAC;QAEnE;;;WAGG;QACK,wBAAmB,GAAsB,IAAI,CAAC,kBAAkB,EAAE,CAAC;QA8FzE,IAAI,CAAC,gBAAgB,CAAC,IAAI,GAAG,MAAM,CAAC;IACtC,CAAC;IAEM,iBAAiB;QACtB,KAAK,CAAC,iBAAiB,EAAE,CAAC;
|
|
1
|
+
{"version":3,"file":"anchor-button.base.js","sourceRoot":"","sources":["../../../src/anchor-button/anchor-button.base.ts"],"names":[],"mappings":"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"}
|
|
@@ -4,6 +4,51 @@ import { FASTElement } from '@microsoft/fast-element';
|
|
|
4
4
|
* @public
|
|
5
5
|
*/
|
|
6
6
|
export declare class BaseAvatar extends FASTElement {
|
|
7
|
+
/**
|
|
8
|
+
* Reference to the default slot element.
|
|
9
|
+
*
|
|
10
|
+
* @internal
|
|
11
|
+
*/
|
|
12
|
+
defaultSlot: HTMLSlotElement;
|
|
13
|
+
/**
|
|
14
|
+
* Handles changes to the default slot element reference.
|
|
15
|
+
*
|
|
16
|
+
* Toggles the `has-slotted` class on the slot element for browsers that do not
|
|
17
|
+
* support the `:has-slotted` CSS selector. Defers cleanup using
|
|
18
|
+
* `Updates.enqueue` to avoid DOM mutations during hydration that could
|
|
19
|
+
* corrupt binding markers.
|
|
20
|
+
*
|
|
21
|
+
* @internal
|
|
22
|
+
*/
|
|
23
|
+
defaultSlotChanged(): void;
|
|
24
|
+
/**
|
|
25
|
+
* Reference to the monogram element that displays generated initials.
|
|
26
|
+
*
|
|
27
|
+
* @internal
|
|
28
|
+
*/
|
|
29
|
+
monogram: HTMLElement;
|
|
30
|
+
/**
|
|
31
|
+
* Updates the monogram text content when the ref is captured.
|
|
32
|
+
*
|
|
33
|
+
* @internal
|
|
34
|
+
*/
|
|
35
|
+
protected monogramChanged(): void;
|
|
36
|
+
/**
|
|
37
|
+
* The slotted content nodes assigned to the default slot.
|
|
38
|
+
*
|
|
39
|
+
* @internal
|
|
40
|
+
*/
|
|
41
|
+
slottedDefaults: Node[];
|
|
42
|
+
/**
|
|
43
|
+
* Handles changes to the slotted default content.
|
|
44
|
+
*
|
|
45
|
+
* Normalizes the DOM, toggles the `has-slotted` class on the default slot element
|
|
46
|
+
* for browsers that do not support the `:has-slotted` CSS selector, and removes
|
|
47
|
+
* empty text nodes from the default slot to keep the DOM clean.
|
|
48
|
+
*
|
|
49
|
+
* @internal
|
|
50
|
+
*/
|
|
51
|
+
protected slottedDefaultsChanged(): void;
|
|
7
52
|
/**
|
|
8
53
|
* The internal {@link https://developer.mozilla.org/docs/Web/API/ElementInternals | `ElementInternals`} instance for the component.
|
|
9
54
|
*
|
|
@@ -18,13 +63,42 @@ export declare class BaseAvatar extends FASTElement {
|
|
|
18
63
|
* HTML Attribute: name
|
|
19
64
|
*/
|
|
20
65
|
name?: string | undefined;
|
|
66
|
+
/**
|
|
67
|
+
* Handles changes to the name attribute.
|
|
68
|
+
* @internal
|
|
69
|
+
*/
|
|
70
|
+
protected nameChanged(): void;
|
|
21
71
|
/**
|
|
22
72
|
* Provide custom initials rather than one generated via the name
|
|
23
73
|
*
|
|
24
74
|
* @public
|
|
25
75
|
* @remarks
|
|
26
|
-
* HTML Attribute:
|
|
76
|
+
* HTML Attribute: initials
|
|
27
77
|
*/
|
|
28
78
|
initials?: string | undefined;
|
|
79
|
+
/**
|
|
80
|
+
* Handles changes to the initials attribute.
|
|
81
|
+
* @internal
|
|
82
|
+
*/
|
|
83
|
+
protected initialsChanged(): void;
|
|
29
84
|
constructor();
|
|
85
|
+
/**
|
|
86
|
+
* Generates and sets the initials for the template.
|
|
87
|
+
* Subclasses should override this to provide custom initials logic.
|
|
88
|
+
*
|
|
89
|
+
* @internal
|
|
90
|
+
*/
|
|
91
|
+
generateInitials(): string | void;
|
|
92
|
+
/**
|
|
93
|
+
* Updates the monogram element's text content with the generated initials.
|
|
94
|
+
*
|
|
95
|
+
* @internal
|
|
96
|
+
*/
|
|
97
|
+
protected updateMonogram(): void;
|
|
98
|
+
/**
|
|
99
|
+
* Normalizes the DOM and removes empty text nodes from the default slot.
|
|
100
|
+
*
|
|
101
|
+
* @internal
|
|
102
|
+
*/
|
|
103
|
+
protected cleanupSlottedContent(): void;
|
|
30
104
|
}
|
|
@@ -1,12 +1,75 @@
|
|
|
1
1
|
import { __decorate } from "tslib";
|
|
2
|
-
import { attr, FASTElement } from '@microsoft/fast-element';
|
|
2
|
+
import { attr, FASTElement, observable, Updates } from '@microsoft/fast-element';
|
|
3
|
+
import { getInitials } from '../utils/get-initials.js';
|
|
3
4
|
/**
|
|
4
5
|
* The base class used for constructing a fluent-avatar custom element
|
|
5
6
|
* @public
|
|
6
7
|
*/
|
|
7
8
|
export class BaseAvatar extends FASTElement {
|
|
9
|
+
/**
|
|
10
|
+
* Handles changes to the default slot element reference.
|
|
11
|
+
*
|
|
12
|
+
* Toggles the `has-slotted` class on the slot element for browsers that do not
|
|
13
|
+
* support the `:has-slotted` CSS selector. Defers cleanup using
|
|
14
|
+
* `Updates.enqueue` to avoid DOM mutations during hydration that could
|
|
15
|
+
* corrupt binding markers.
|
|
16
|
+
*
|
|
17
|
+
* @internal
|
|
18
|
+
*/
|
|
19
|
+
defaultSlotChanged() {
|
|
20
|
+
if (!CSS.supports('selector(:has-slotted)')) {
|
|
21
|
+
const elements = this.defaultSlot.assignedElements();
|
|
22
|
+
this.defaultSlot.classList.toggle('has-slotted', elements.length > 0);
|
|
23
|
+
}
|
|
24
|
+
Updates.enqueue(() => {
|
|
25
|
+
this.cleanupSlottedContent();
|
|
26
|
+
});
|
|
27
|
+
}
|
|
28
|
+
/**
|
|
29
|
+
* Updates the monogram text content when the ref is captured.
|
|
30
|
+
*
|
|
31
|
+
* @internal
|
|
32
|
+
*/
|
|
33
|
+
monogramChanged() {
|
|
34
|
+
this.updateMonogram();
|
|
35
|
+
}
|
|
36
|
+
/**
|
|
37
|
+
* Handles changes to the slotted default content.
|
|
38
|
+
*
|
|
39
|
+
* Normalizes the DOM, toggles the `has-slotted` class on the default slot element
|
|
40
|
+
* for browsers that do not support the `:has-slotted` CSS selector, and removes
|
|
41
|
+
* empty text nodes from the default slot to keep the DOM clean.
|
|
42
|
+
*
|
|
43
|
+
* @internal
|
|
44
|
+
*/
|
|
45
|
+
slottedDefaultsChanged() {
|
|
46
|
+
if (!this.defaultSlot) {
|
|
47
|
+
return;
|
|
48
|
+
}
|
|
49
|
+
this.cleanupSlottedContent();
|
|
50
|
+
}
|
|
51
|
+
/**
|
|
52
|
+
* Handles changes to the name attribute.
|
|
53
|
+
* @internal
|
|
54
|
+
*/
|
|
55
|
+
nameChanged() {
|
|
56
|
+
this.updateMonogram();
|
|
57
|
+
}
|
|
58
|
+
/**
|
|
59
|
+
* Handles changes to the initials attribute.
|
|
60
|
+
* @internal
|
|
61
|
+
*/
|
|
62
|
+
initialsChanged() {
|
|
63
|
+
this.updateMonogram();
|
|
64
|
+
}
|
|
8
65
|
constructor() {
|
|
9
66
|
super();
|
|
67
|
+
/**
|
|
68
|
+
* The slotted content nodes assigned to the default slot.
|
|
69
|
+
*
|
|
70
|
+
* @internal
|
|
71
|
+
*/
|
|
72
|
+
this.slottedDefaults = [];
|
|
10
73
|
/**
|
|
11
74
|
* The internal {@link https://developer.mozilla.org/docs/Web/API/ElementInternals | `ElementInternals`} instance for the component.
|
|
12
75
|
*
|
|
@@ -15,7 +78,53 @@ export class BaseAvatar extends FASTElement {
|
|
|
15
78
|
this.elementInternals = this.attachInternals();
|
|
16
79
|
this.elementInternals.role = 'img';
|
|
17
80
|
}
|
|
81
|
+
/**
|
|
82
|
+
* Generates and sets the initials for the template.
|
|
83
|
+
* Subclasses should override this to provide custom initials logic.
|
|
84
|
+
*
|
|
85
|
+
* @internal
|
|
86
|
+
*/
|
|
87
|
+
generateInitials() {
|
|
88
|
+
return this.initials || getInitials(this.name, window.getComputedStyle(this).direction === 'rtl');
|
|
89
|
+
}
|
|
90
|
+
/**
|
|
91
|
+
* Updates the monogram element's text content with the generated initials.
|
|
92
|
+
*
|
|
93
|
+
* @internal
|
|
94
|
+
*/
|
|
95
|
+
updateMonogram() {
|
|
96
|
+
if (this.monogram) {
|
|
97
|
+
this.monogram.textContent = this.generateInitials() ?? '';
|
|
98
|
+
}
|
|
99
|
+
}
|
|
100
|
+
/**
|
|
101
|
+
* Normalizes the DOM and removes empty text nodes from the default slot.
|
|
102
|
+
*
|
|
103
|
+
* @internal
|
|
104
|
+
*/
|
|
105
|
+
cleanupSlottedContent() {
|
|
106
|
+
this.normalize();
|
|
107
|
+
if (!CSS.supports('selector(:has-slotted)')) {
|
|
108
|
+
this.defaultSlot.classList.toggle('has-slotted', !!this.slottedDefaults.length);
|
|
109
|
+
}
|
|
110
|
+
if (!this.innerText.trim()) {
|
|
111
|
+
this.slottedDefaults.forEach(node => {
|
|
112
|
+
if (node.nodeType === Node.TEXT_NODE) {
|
|
113
|
+
node.remove();
|
|
114
|
+
}
|
|
115
|
+
});
|
|
116
|
+
}
|
|
117
|
+
}
|
|
18
118
|
}
|
|
119
|
+
__decorate([
|
|
120
|
+
observable
|
|
121
|
+
], BaseAvatar.prototype, "defaultSlot", void 0);
|
|
122
|
+
__decorate([
|
|
123
|
+
observable
|
|
124
|
+
], BaseAvatar.prototype, "monogram", void 0);
|
|
125
|
+
__decorate([
|
|
126
|
+
observable
|
|
127
|
+
], BaseAvatar.prototype, "slottedDefaults", void 0);
|
|
19
128
|
__decorate([
|
|
20
129
|
attr
|
|
21
130
|
], BaseAvatar.prototype, "name", void 0);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"avatar.base.js","sourceRoot":"","sources":["../../../src/avatar/avatar.base.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;
|
|
1
|
+
{"version":3,"file":"avatar.base.js","sourceRoot":"","sources":["../../../src/avatar/avatar.base.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,WAAW,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,yBAAyB,CAAC;AACjF,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAEvD;;;GAGG;AACH,MAAM,OAAO,UAAW,SAAQ,WAAW;IASzC;;;;;;;;;OASG;IACI,kBAAkB;QACvB,IAAI,CAAC,GAAG,CAAC,QAAQ,CAAC,wBAAwB,CAAC,EAAE,CAAC;YAC5C,MAAM,QAAQ,GAAG,IAAI,CAAC,WAAW,CAAC,gBAAgB,EAAE,CAAC;YACrD,IAAI,CAAC,WAAW,CAAC,SAAS,CAAC,MAAM,CAAC,aAAa,EAAE,QAAQ,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;QACxE,CAAC;QAED,OAAO,CAAC,OAAO,CAAC,GAAG,EAAE;YACnB,IAAI,CAAC,qBAAqB,EAAE,CAAC;QAC/B,CAAC,CAAC,CAAC;IACL,CAAC;IAUD;;;;OAIG;IACO,eAAe;QACvB,IAAI,CAAC,cAAc,EAAE,CAAC;IACxB,CAAC;IAUD;;;;;;;;OAQG;IACO,sBAAsB;QAC9B,IAAI,CAAC,IAAI,CAAC,WAAW,EAAE,CAAC;YACtB,OAAO;QACT,CAAC;QACD,IAAI,CAAC,qBAAqB,EAAE,CAAC;IAC/B,CAAC;IAmBD;;;OAGG;IACO,WAAW;QACnB,IAAI,CAAC,cAAc,EAAE,CAAC;IACxB,CAAC;IAYD;;;OAGG;IACO,eAAe;QACvB,IAAI,CAAC,cAAc,EAAE,CAAC;IACxB,CAAC;IAED;QACE,KAAK,EAAE,CAAC;QApEV;;;;WAIG;QAEI,oBAAe,GAAW,EAAE,CAAC;QAkBpC;;;;WAIG;QACI,qBAAgB,GAAqB,IAAI,CAAC,eAAe,EAAE,CAAC;QAyCjE,IAAI,CAAC,gBAAgB,CAAC,IAAI,GAAG,KAAK,CAAC;IACrC,CAAC;IAED;;;;;OAKG;IACI,gBAAgB;QACrB,OAAO,IAAI,CAAC,QAAQ,IAAI,WAAW,CAAC,IAAI,CAAC,IAAI,EAAE,MAAM,CAAC,gBAAgB,CAAC,IAAI,CAAC,CAAC,SAAS,KAAK,KAAK,CAAC,CAAC;IACpG,CAAC;IAED;;;;OAIG;IACO,cAAc;QACtB,IAAI,IAAI,CAAC,QAAQ,EAAE,CAAC;YAClB,IAAI,CAAC,QAAQ,CAAC,WAAW,GAAG,IAAI,CAAC,gBAAgB,EAAE,IAAI,EAAE,CAAC;QAC5D,CAAC;IACH,CAAC;IAED;;;;OAIG;IACO,qBAAqB;QAC7B,IAAI,CAAC,SAAS,EAAE,CAAC;QAEjB,IAAI,CAAC,GAAG,CAAC,QAAQ,CAAC,wBAAwB,CAAC,EAAE,CAAC;YAC5C,IAAI,CAAC,WAAW,CAAC,SAAS,CAAC,MAAM,CAAC,aAAa,EAAE,CAAC,CAAC,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC,CAAC;QAClF,CAAC;QAED,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,IAAI,EAAE,EAAE,CAAC;YAC3B,IAAI,CAAC,eAAe,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE;gBAClC,IAAI,IAAI,CAAC,QAAQ,KAAK,IAAI,CAAC,SAAS,EAAE,CAAC;oBACpC,IAAkB,CAAC,MAAM,EAAE,CAAC;gBAC/B,CAAC;YACH,CAAC,CAAC,CAAC;QACL,CAAC;IACH,CAAC;CACF;AA1JQ;IADN,UAAU;+CAC0B;AA6B9B;IADN,UAAU;4CACmB;AAiBvB;IADN,UAAU;mDACyB;AAiC7B;IADN,IAAI;wCAC4B;AAkB1B;IADN,IAAI;4CACgC"}
|
|
@@ -38,7 +38,7 @@ export class Avatar extends BaseAvatar {
|
|
|
38
38
|
}
|
|
39
39
|
// size can be undefined since we default it in CSS only
|
|
40
40
|
const size = this.size ?? 32;
|
|
41
|
-
return (this.initials
|
|
41
|
+
return (this.initials ||
|
|
42
42
|
getInitials(this.name, window.getComputedStyle(this).direction === 'rtl', {
|
|
43
43
|
firstInitialOnly: size <= 16,
|
|
44
44
|
}));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"avatar.js","sourceRoot":"","sources":["../../../src/avatar/avatar.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,uBAAuB,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AACpF,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AACvD,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC9C,OAAO,EAGL,WAAW,EACX,gBAAgB,GAGjB,MAAM,qBAAqB,CAAC;AAE7B;;;;;;;GAOG;AACH,MAAM,OAAO,MAAO,SAAQ,UAAU;IA6EpC;;;;;OAKG;IACI,YAAY,CAAC,MAAW,EAAE,YAAoB;QACnD,QAAQ,YAAY,EAAE,CAAC;YACrB,KAAK,OAAO,CAAC;YACb,KAAK,SAAS;gBACZ,IAAI,CAAC,aAAa,EAAE,CAAC;gBACrB,MAAM;YACR;gBACE,MAAM;QACV,CAAC;IACH,CAAC;IAED;;;OAGG;IACI,gBAAgB;QACrB,IAAI,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE,CAAC;YACjC,OAAO;QACT,CAAC;QAED,wDAAwD;QACxD,MAAM,IAAI,GAAG,IAAI,CAAC,IAAI,IAAI,EAAE,CAAC;QAE7B,OAAO,CACL,IAAI,CAAC,QAAQ;YACb,WAAW,CAAC,IAAI,CAAC,IAAI,EAAE,MAAM,CAAC,gBAAgB,CAAC,
|
|
1
|
+
{"version":3,"file":"avatar.js","sourceRoot":"","sources":["../../../src/avatar/avatar.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,uBAAuB,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AACpF,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AACvD,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC9C,OAAO,EAGL,WAAW,EACX,gBAAgB,GAGjB,MAAM,qBAAqB,CAAC;AAE7B;;;;;;;GAOG;AACH,MAAM,OAAO,MAAO,SAAQ,UAAU;IA6EpC;;;;;OAKG;IACI,YAAY,CAAC,MAAW,EAAE,YAAoB;QACnD,QAAQ,YAAY,EAAE,CAAC;YACrB,KAAK,OAAO,CAAC;YACb,KAAK,SAAS;gBACZ,IAAI,CAAC,aAAa,EAAE,CAAC;gBACrB,MAAM;YACR;gBACE,MAAM;QACV,CAAC;IACH,CAAC;IAED;;;OAGG;IACI,gBAAgB;QACrB,IAAI,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE,CAAC;YACjC,OAAO;QACT,CAAC;QAED,wDAAwD;QACxD,MAAM,IAAI,GAAG,IAAI,CAAC,IAAI,IAAI,EAAE,CAAC;QAE7B,OAAO,CACL,IAAI,CAAC,QAAQ;YACb,WAAW,CAAC,IAAI,CAAC,IAAI,EAAE,MAAM,CAAC,gBAAgB,CAAC,IAAI,CAAC,CAAC,SAAS,KAAK,KAAK,EAAE;gBACxE,gBAAgB,EAAE,IAAI,IAAI,EAAE;aAC7B,CAAC,CACH,CAAC;IACJ,CAAC;IAED;;;OAGG;IACI,aAAa;QAClB,MAAM,QAAQ,GAAY,IAAI,CAAC,KAAK,KAAK,WAAW,CAAC,QAAQ,CAAC;QAC9D,MAAM,IAAI,GAAG,IAAI,CAAC,YAAY,CAAC;QAE/B,IAAI,CAAC,YAAY;YACf,QAAQ,IAAI,IAAI,CAAC,OAAO;gBACtB,CAAC,CAAC,IAAI,CAAC,OAAO;gBACd,CAAC,CAAC,QAAQ;oBACV,CAAC,CAAE,MAAM,CAAC,MAAM,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,IAAI,EAAE,CAAC,GAAG,MAAM,CAAC,MAAM,CAAC,MAAM,CAAiB;oBACrF,CAAC,CAAC,IAAI,CAAC,KAAK,IAAI,WAAW,CAAC,OAAO,CAAC;QAExC,IAAI,CAAC,YAAY,CAAC,YAAY,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC;IACrD,CAAC;IAED;;OAEG;aACW,WAAM,GAAG,MAAM,CAAC,MAAM,CAAC,gBAAgB,CAAC,CAAC;IAEhD,iBAAiB;QACtB,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAE1B,UAAU,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC;QAE7C,IAAI,CAAC,aAAa,EAAE,CAAC;IACvB,CAAC;IAEM,oBAAoB;QACzB,KAAK,CAAC,oBAAoB,EAAE,CAAC;QAE7B,UAAU,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC;IACjD,CAAC;;AAzIM;IADN,IAAI;sCACoC;AAUlC;IADN,IAAI;qCACkC;AAUhC;IADN,IAAI;0CAC4C;AAiB1C;IADN,IAAI,CAAC,EAAE,SAAS,EAAE,uBAAuB,EAAE,CAAC;oCACR;AAc9B;IADN,IAAI;qCACkC;AAOhC;IADN,IAAI,CAAC,EAAE,SAAS,EAAE,UAAU,EAAE,CAAC;uCACc;AAkFhD,2BAA2B;AAC3B,MAAM,WAAW,GAAG,CAAC,GAAW,EAAU,EAAE;IAC1C,IAAI,QAAQ,GAAG,CAAC,CAAC;IACjB,KAAK,IAAI,GAAG,GAAW,GAAG,CAAC,MAAM,GAAG,CAAC,EAAE,GAAG,IAAI,CAAC,EAAE,GAAG,EAAE,EAAE,CAAC;QACvD,MAAM,EAAE,GAAG,GAAG,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC;QAC/B,MAAM,KAAK,GAAG,GAAG,GAAG,CAAC,CAAC;QACtB,QAAQ,IAAI,CAAC,EAAE,IAAI,KAAK,CAAC,GAAG,CAAC,EAAE,IAAI,CAAC,CAAC,GAAG,KAAK,CAAC,CAAC,CAAC,CAAC,iCAAiC;IACpF,CAAC;IAED,OAAO,QAAQ,CAAC;AAClB,CAAC,CAAC"}
|
|
@@ -16,10 +16,11 @@ const animations = {
|
|
|
16
16
|
* @public
|
|
17
17
|
*/
|
|
18
18
|
export const styles = css `
|
|
19
|
-
${display('inline-
|
|
19
|
+
${display('inline-grid')} :host {
|
|
20
20
|
position: relative;
|
|
21
|
-
|
|
22
|
-
|
|
21
|
+
place-items: center;
|
|
22
|
+
place-content: center;
|
|
23
|
+
grid-template: 1fr / 1fr;
|
|
23
24
|
flex-shrink: 0;
|
|
24
25
|
width: 32px;
|
|
25
26
|
height: 32px;
|
|
@@ -32,6 +33,22 @@ export const styles = css `
|
|
|
32
33
|
contain: layout style;
|
|
33
34
|
}
|
|
34
35
|
|
|
36
|
+
.monogram,
|
|
37
|
+
.default-icon {
|
|
38
|
+
grid-area: 1 / 1 / -1 / -1;
|
|
39
|
+
}
|
|
40
|
+
|
|
41
|
+
.monogram:empty {
|
|
42
|
+
display: none;
|
|
43
|
+
}
|
|
44
|
+
|
|
45
|
+
.default-slot:is(.has-slotted, :has-slotted) ~ .default-icon,
|
|
46
|
+
.default-slot:is(.has-slotted, :has-slotted) ~ .monogram,
|
|
47
|
+
:host(:is([name]):not([name=''])) .default-icon,
|
|
48
|
+
:host(:is([initials]):not([initials=''])) .default-icon {
|
|
49
|
+
display: none;
|
|
50
|
+
}
|
|
51
|
+
|
|
35
52
|
.default-icon,
|
|
36
53
|
::slotted(svg) {
|
|
37
54
|
width: 20px;
|
|
@@ -50,7 +67,7 @@ export const styles = css `
|
|
|
50
67
|
position: absolute;
|
|
51
68
|
bottom: 0;
|
|
52
69
|
right: 0;
|
|
53
|
-
box-shadow: 0 0 0 ${strokeWidthThin}
|
|
70
|
+
box-shadow: 0 0 0 ${strokeWidthThin} ${colorNeutralBackground1};
|
|
54
71
|
}
|
|
55
72
|
|
|
56
73
|
:host([size='64']) ::slotted([slot='badge']),
|
|
@@ -58,7 +75,7 @@ export const styles = css `
|
|
|
58
75
|
:host([size='96']) ::slotted([slot='badge']),
|
|
59
76
|
:host([size='120']) ::slotted([slot='badge']),
|
|
60
77
|
:host([size='128']) ::slotted([slot='badge']) {
|
|
61
|
-
box-shadow: 0 0 0 ${strokeWidthThick}
|
|
78
|
+
box-shadow: 0 0 0 ${strokeWidthThick} ${colorNeutralBackground1};
|
|
62
79
|
}
|
|
63
80
|
|
|
64
81
|
:host([size='16']),
|
|
@@ -392,8 +409,8 @@ export const styles = css `
|
|
|
392
409
|
right: 0;
|
|
393
410
|
border-radius: inherit;
|
|
394
411
|
transition-property: margin, opacity;
|
|
395
|
-
transition-duration: ${durationUltraSlow}
|
|
396
|
-
transition-delay: ${animations.fastEase}
|
|
412
|
+
transition-duration: ${durationUltraSlow}, ${durationSlower};
|
|
413
|
+
transition-delay: ${animations.fastEase}, ${animations.nullEasing};
|
|
397
414
|
}
|
|
398
415
|
:host([active])::before {
|
|
399
416
|
box-shadow: ${shadow8};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"avatar.styles.js","sourceRoot":"","sources":["../../../src/avatar/avatar.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,MAAM,mBAAmB,CAAC;AAC5C,OAAO,EACL,oBAAoB,EACpB,iBAAiB,EACjB,kBAAkB,EAClB,iBAAiB,EACjB,kBAAkB,EAClB,0BAA0B,EAC1B,uBAAuB,EACvB,uBAAuB,EACvB,uBAAuB,EACvB,oCAAoC,EACpC,6BAA6B,EAC7B,6BAA6B,EAC7B,4BAA4B,EAC5B,4BAA4B,EAC5B,2BAA2B,EAC3B,2BAA2B,EAC3B,4BAA4B,EAC5B,4BAA4B,EAC5B,4BAA4B,EAC5B,4BAA4B,EAC5B,iCAAiC,EACjC,iCAAiC,EACjC,gCAAgC,EAChC,gCAAgC,EAChC,gCAAgC,EAChC,gCAAgC,EAChC,8BAA8B,EAC9B,8BAA8B,EAC9B,6BAA6B,EAC7B,6BAA6B,EAC7B,2BAA2B,EAC3B,2BAA2B,EAC3B,4BAA4B,EAC5B,4BAA4B,EAC5B,+BAA+B,EAC/B,+BAA+B,EAC/B,gCAAgC,EAChC,gCAAgC,EAChC,4BAA4B,EAC5B,4BAA4B,EAC5B,8BAA8B,EAC9B,8BAA8B,EAC9B,+BAA+B,EAC/B,+BAA+B,EAC/B,2BAA2B,EAC3B,2BAA2B,EAC3B,2BAA2B,EAC3B,2BAA2B,EAC3B,4BAA4B,EAC5B,4BAA4B,EAC5B,2BAA2B,EAC3B,2BAA2B,EAC3B,+BAA+B,EAC/B,+BAA+B,EAC/B,2BAA2B,EAC3B,2BAA2B,EAC3B,8BAA8B,EAC9B,8BAA8B,EAC9B,6BAA6B,EAC7B,6BAA6B,EAC7B,0BAA0B,EAC1B,0BAA0B,EAC1B,gCAAgC,EAChC,gCAAgC,EAChC,8BAA8B,EAC9B,8BAA8B,EAC9B,4BAA4B,EAC5B,4BAA4B,EAC5B,2BAA2B,EAC3B,2BAA2B,EAC3B,kBAAkB,EAClB,kBAAkB,EAClB,kBAAkB,EAClB,kBAAkB,EAClB,kBAAkB,EAClB,kBAAkB,EAClB,aAAa,EACb,gBAAgB,EAChB,WAAW,EACX,cAAc,EACd,cAAc,EACd,iBAAiB,EACjB,cAAc,EACd,eAAe,EACf,eAAe,EACf,eAAe,EACf,eAAe,EACf,eAAe,EACf,eAAe,EACf,iBAAiB,EACjB,kBAAkB,EAClB,QAAQ,EACR,QAAQ,EACR,OAAO,EACP,OAAO,EACP,gBAAgB,EAChB,kBAAkB,EAClB,mBAAmB,EACnB,eAAe,GAChB,MAAM,2BAA2B,CAAC;AAEnC,MAAM,UAAU,GAAG;IACjB,gBAAgB,EAAE,kBAAkB;IACpC,gBAAgB,EAAE,kBAAkB;IACpC,gBAAgB,EAAE,kBAAkB;IACpC,gBAAgB,EAAE,kBAAkB;IACpC,gBAAgB,EAAE,kBAAkB;IACpC,gBAAgB,EAAE,kBAAkB;IACpC,QAAQ,EAAE,gBAAgB;IAC1B,UAAU,EAAE,aAAa;IACzB,UAAU,EAAE,WAAW;CACxB,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;IACrB,OAAO,CAAC,aAAa,CAAC
|
|
1
|
+
{"version":3,"file":"avatar.styles.js","sourceRoot":"","sources":["../../../src/avatar/avatar.styles.ts"],"names":[],"mappings":"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"}
|
|
@@ -1,9 +1,8 @@
|
|
|
1
|
-
import { html } from '@microsoft/fast-element';
|
|
1
|
+
import { html, ref, slotted } from '@microsoft/fast-element';
|
|
2
2
|
const defaultIconTemplate = html `<svg
|
|
3
3
|
width="1em"
|
|
4
4
|
height="1em"
|
|
5
5
|
viewBox="0 0 20 20"
|
|
6
|
-
xmlns="http://www.w3.org/2000/svg"
|
|
7
6
|
class="default-icon"
|
|
8
7
|
fill="currentcolor"
|
|
9
8
|
aria-hidden="true"
|
|
@@ -18,7 +17,9 @@ const defaultIconTemplate = html `<svg
|
|
|
18
17
|
*/
|
|
19
18
|
export function avatarTemplate() {
|
|
20
19
|
return html `
|
|
21
|
-
<slot
|
|
20
|
+
<slot class="default-slot" ${slotted('slottedDefaults')} ${ref('defaultSlot')}></slot>
|
|
21
|
+
<span class="monogram" ${ref('monogram')}>${x => x.initials}</span>
|
|
22
|
+
${defaultIconTemplate}
|
|
22
23
|
<slot name="badge"></slot>
|
|
23
24
|
`;
|
|
24
25
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"avatar.template.js","sourceRoot":"","sources":["../../../src/avatar/avatar.template.ts"],"names":[],"mappings":"AAAA,OAAO,EAA4B,IAAI,EAAE,MAAM,yBAAyB,CAAC;
|
|
1
|
+
{"version":3,"file":"avatar.template.js","sourceRoot":"","sources":["../../../src/avatar/avatar.template.ts"],"names":[],"mappings":"AAAA,OAAO,EAA4B,IAAI,EAAE,GAAG,EAAE,OAAO,EAAE,MAAM,yBAAyB,CAAC;AAGvF,MAAM,mBAAmB,GAAG,IAAI,CAAA;;;;;;;;;;;OAWzB,CAAC;AAER;;;GAGG;AACH,MAAM,UAAU,cAAc;IAC5B,OAAO,IAAI,CAAG;iCACiB,OAAO,CAAC,iBAAiB,CAAC,IAAI,GAAG,CAAC,aAAa,CAAC;6BACpD,GAAG,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,QAAQ;MACzD,mBAAmB;;GAEtB,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,MAAM,QAAQ,GAAgC,cAAc,EAAE,CAAC"}
|
|
@@ -2,7 +2,9 @@ import type { StartEndOptions } from '../patterns/index.js';
|
|
|
2
2
|
import type { StaticallyComposableHTML, ValuesOf } from '../utils/index.js';
|
|
3
3
|
import type { Badge } from './badge.js';
|
|
4
4
|
/**
|
|
5
|
-
*
|
|
5
|
+
* - marking as internal update when Badge PR for start/end is in
|
|
6
|
+
*
|
|
7
|
+
* @internal
|
|
6
8
|
*/
|
|
7
9
|
export type BadgeOptions = StartEndOptions<Badge> & {
|
|
8
10
|
defaultContent?: StaticallyComposableHTML;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"badge.options.js","sourceRoot":"","sources":["../../../src/badge/badge.options.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"badge.options.js","sourceRoot":"","sources":["../../../src/badge/badge.options.ts"],"names":[],"mappings":"AAaA;;;GAGG;AACH,MAAM,CAAC,MAAM,eAAe,GAAG;IAC7B,MAAM,EAAE,QAAQ;IAChB,KAAK,EAAE,OAAO;IACd,OAAO,EAAE,SAAS;IAClB,IAAI,EAAE,MAAM;CACJ,CAAC;AAQX;;;GAGG;AACH,MAAM,CAAC,MAAM,UAAU,GAAG;IACxB,KAAK,EAAE,OAAO;IACd,MAAM,EAAE,QAAQ;IAChB,SAAS,EAAE,WAAW;IACtB,WAAW,EAAE,aAAa;IAC1B,MAAM,EAAE,QAAQ;IAChB,MAAM,EAAE,QAAQ;IAChB,OAAO,EAAE,SAAS;IAClB,OAAO,EAAE,SAAS;CACV,CAAC;AAQX;;;GAGG;AACH,MAAM,CAAC,MAAM,UAAU,GAAG;IACxB,QAAQ,EAAE,UAAU;IACpB,OAAO,EAAE,SAAS;IAClB,MAAM,EAAE,QAAQ;CACR,CAAC;AAQX;;;GAGG;AACH,MAAM,CAAC,MAAM,SAAS,GAAG;IACvB,IAAI,EAAE,MAAM;IACZ,UAAU,EAAE,aAAa;IACzB,KAAK,EAAE,OAAO;IACd,MAAM,EAAE,QAAQ;IAChB,KAAK,EAAE,OAAO;IACd,UAAU,EAAE,aAAa;CACjB,CAAC"}
|
|
@@ -36,7 +36,15 @@ export declare class BaseButton extends FASTElement {
|
|
|
36
36
|
* HTML Attribute: `disabled`
|
|
37
37
|
*/
|
|
38
38
|
disabled: boolean;
|
|
39
|
-
|
|
39
|
+
/**
|
|
40
|
+
* Handles changes to the disabled attribute. If the button is disabled, it
|
|
41
|
+
* should not be focusable.
|
|
42
|
+
*
|
|
43
|
+
* @param previous - the previous disabled value
|
|
44
|
+
* @param next - the new disabled value
|
|
45
|
+
* @internal
|
|
46
|
+
*/
|
|
47
|
+
disabledChanged(): void;
|
|
40
48
|
/**
|
|
41
49
|
* Indicates that the button is focusable while disabled.
|
|
42
50
|
*
|
|
@@ -226,6 +234,12 @@ export declare class BaseButton extends FASTElement {
|
|
|
226
234
|
* @public
|
|
227
235
|
*/
|
|
228
236
|
resetForm(): void;
|
|
237
|
+
/**
|
|
238
|
+
* Sets the `tabindex` attribute based on the disabled state of the button.
|
|
239
|
+
*
|
|
240
|
+
* @internal
|
|
241
|
+
*/
|
|
242
|
+
protected setTabIndex(): void;
|
|
229
243
|
/**
|
|
230
244
|
* Submits the associated form.
|
|
231
245
|
*
|
|
@@ -14,20 +14,16 @@ import { ButtonType } from './button.options.js';
|
|
|
14
14
|
* @public
|
|
15
15
|
*/
|
|
16
16
|
export class BaseButton extends FASTElement {
|
|
17
|
+
/**
|
|
18
|
+
* Handles changes to the disabled attribute. If the button is disabled, it
|
|
19
|
+
* should not be focusable.
|
|
20
|
+
*
|
|
21
|
+
* @param previous - the previous disabled value
|
|
22
|
+
* @param next - the new disabled value
|
|
23
|
+
* @internal
|
|
24
|
+
*/
|
|
17
25
|
disabledChanged() {
|
|
18
|
-
|
|
19
|
-
return;
|
|
20
|
-
}
|
|
21
|
-
if (this.disabled) {
|
|
22
|
-
this.removeAttribute('tabindex');
|
|
23
|
-
}
|
|
24
|
-
else {
|
|
25
|
-
// If author sets tabindex to a non-positive value, the component should
|
|
26
|
-
// respect it, otherwise set it to 0 to avoid the anti-pattern of setting
|
|
27
|
-
// tabindex to a positive number. See details:
|
|
28
|
-
// https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Global_attributes/tabindex
|
|
29
|
-
this.tabIndex = Number(this.getAttribute('tabindex') ?? 0) < 0 ? -1 : 0;
|
|
30
|
-
}
|
|
26
|
+
this.setTabIndex();
|
|
31
27
|
}
|
|
32
28
|
/**
|
|
33
29
|
* Sets the element's internal disabled state when the element is focusable while disabled.
|
|
@@ -37,7 +33,7 @@ export class BaseButton extends FASTElement {
|
|
|
37
33
|
* @internal
|
|
38
34
|
*/
|
|
39
35
|
disabledFocusableChanged(previous, next) {
|
|
40
|
-
if (this
|
|
36
|
+
if (this.elementInternals) {
|
|
41
37
|
this.elementInternals.ariaDisabled = `${!!next}`;
|
|
42
38
|
}
|
|
43
39
|
}
|
|
@@ -94,19 +90,10 @@ export class BaseButton extends FASTElement {
|
|
|
94
90
|
connectedCallback() {
|
|
95
91
|
super.connectedCallback();
|
|
96
92
|
this.elementInternals.ariaDisabled = `${!!this.disabledFocusable}`;
|
|
97
|
-
this.
|
|
93
|
+
this.setTabIndex();
|
|
98
94
|
}
|
|
99
95
|
constructor() {
|
|
100
96
|
super();
|
|
101
|
-
/**
|
|
102
|
-
* Sets the element's disabled state.
|
|
103
|
-
* @see The {@link https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#disabled | `disabled`} attribute
|
|
104
|
-
*
|
|
105
|
-
* @public
|
|
106
|
-
* @remarks
|
|
107
|
-
* HTML Attribute: `disabled`
|
|
108
|
-
*/
|
|
109
|
-
this.disabled = false;
|
|
110
97
|
/**
|
|
111
98
|
* Indicates that the button is focusable while disabled.
|
|
112
99
|
*
|
|
@@ -220,6 +207,22 @@ export class BaseButton extends FASTElement {
|
|
|
220
207
|
resetForm() {
|
|
221
208
|
this.elementInternals.form?.reset();
|
|
222
209
|
}
|
|
210
|
+
/**
|
|
211
|
+
* Sets the `tabindex` attribute based on the disabled state of the button.
|
|
212
|
+
*
|
|
213
|
+
* @internal
|
|
214
|
+
*/
|
|
215
|
+
setTabIndex() {
|
|
216
|
+
if (this.disabled) {
|
|
217
|
+
this.removeAttribute('tabindex');
|
|
218
|
+
return;
|
|
219
|
+
}
|
|
220
|
+
// If author sets tabindex to a non-positive value, the component should
|
|
221
|
+
// respect it, otherwise set it to 0 to avoid the anti-pattern of setting
|
|
222
|
+
// tabindex to a positive number. See details:
|
|
223
|
+
// https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Global_attributes/tabindex
|
|
224
|
+
this.tabIndex = Number(this.getAttribute('tabindex') ?? 0) < 0 ? -1 : 0;
|
|
225
|
+
}
|
|
223
226
|
/**
|
|
224
227
|
* Submits the associated form.
|
|
225
228
|
*
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button.base.js","sourceRoot":"","sources":["../../../src/button/button.base.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AACxE,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAE,MAAM,+BAA+B,CAAC;AACnE,OAAO,EAAyB,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAExE;;;;;;;;;;GAUG;AACH,MAAM,OAAO,UAAW,SAAQ,WAAW;IA+
|
|
1
|
+
{"version":3,"file":"button.base.js","sourceRoot":"","sources":["../../../src/button/button.base.ts"],"names":[],"mappings":"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"}
|
|
@@ -1,15 +1,15 @@
|
|
|
1
1
|
import { type ElementViewTemplate } from '@microsoft/fast-element';
|
|
2
|
-
import type {
|
|
2
|
+
import type { BaseButton } from './button.base.js';
|
|
3
3
|
import type { ButtonOptions } from './button.options.js';
|
|
4
4
|
/**
|
|
5
5
|
* Generates a template for the Button component.
|
|
6
6
|
*
|
|
7
7
|
* @public
|
|
8
8
|
*/
|
|
9
|
-
export declare function buttonTemplate<T extends
|
|
9
|
+
export declare function buttonTemplate<T extends BaseButton>(options?: ButtonOptions): ElementViewTemplate<T>;
|
|
10
10
|
/**
|
|
11
11
|
* The template for the Button component.
|
|
12
12
|
*
|
|
13
13
|
* @public
|
|
14
14
|
*/
|
|
15
|
-
export declare const template: ElementViewTemplate<
|
|
15
|
+
export declare const template: ElementViewTemplate<BaseButton>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button.template.js","sourceRoot":"","sources":["../../../src/button/button.template.ts"],"names":[],"mappings":"AAAA,OAAO,EAA4B,IAAI,EAAE,OAAO,EAAE,MAAM,yBAAyB,CAAC;AAClF,OAAO,EAAE,eAAe,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAI1E;;;;GAIG;AACH,MAAM,UAAU,cAAc,
|
|
1
|
+
{"version":3,"file":"button.template.js","sourceRoot":"","sources":["../../../src/button/button.template.ts"],"names":[],"mappings":"AAAA,OAAO,EAA4B,IAAI,EAAE,OAAO,EAAE,MAAM,yBAAyB,CAAC;AAClF,OAAO,EAAE,eAAe,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAI1E;;;;GAIG;AACH,MAAM,UAAU,cAAc,CAAuB,UAAyB,EAAE;IAC9E,OAAO,IAAI,CAAG;;gBAEA,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,KAAmB,CAAC;mBAC5C,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,KAAsB,CAAC;;QAEhE,iBAAiB,CAAC,OAAO,CAAC;;gBAElB,OAAO,CAAC,uBAAuB,CAAC;;QAExC,eAAe,CAAC,OAAO,CAAC;;GAE7B,CAAC;AACJ,CAAC;AAED;;;;GAIG;AACH,MAAM,CAAC,MAAM,QAAQ,GAAoC,cAAc,EAAE,CAAC"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { css } from '@microsoft/fast-element';
|
|
2
2
|
import { styles as ButtonStyles } from '../button/button.styles.js';
|
|
3
3
|
import { colorNeutralForeground2, colorNeutralForeground2BrandHover, colorNeutralForeground2BrandPressed, colorNeutralForeground2Hover, colorNeutralForeground2Pressed, colorNeutralForegroundDisabled, colorNeutralForegroundOnBrand, fontSizeBase200, fontSizeBase300, fontSizeBase400, fontWeightRegular, lineHeightBase300, lineHeightBase400, spacingHorizontalS, spacingHorizontalSNudge, spacingHorizontalXS, } from '../theme/design-tokens.js';
|
|
4
|
-
import { forcedColorsStylesheetBehavior } from '../utils/index';
|
|
4
|
+
import { forcedColorsStylesheetBehavior } from '../utils/index.js';
|
|
5
5
|
// Need to support icon hover styles
|
|
6
6
|
export const styles = css `
|
|
7
7
|
${ButtonStyles}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"compound-button.styles.js","sourceRoot":"","sources":["../../../src/compound-button/compound-button.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,MAAM,IAAI,YAAY,EAAE,MAAM,4BAA4B,CAAC;AACpE,OAAO,EACL,uBAAuB,EACvB,iCAAiC,EACjC,mCAAmC,EACnC,4BAA4B,EAC5B,8BAA8B,EAC9B,8BAA8B,EAC9B,6BAA6B,EAC7B,eAAe,EACf,eAAe,EACf,eAAe,EACf,iBAAiB,EACjB,iBAAiB,EACjB,iBAAiB,EACjB,kBAAkB,EAClB,uBAAuB,EACvB,mBAAmB,GACpB,MAAM,2BAA2B,CAAC;AACnC,OAAO,EAAE,8BAA8B,EAAE,MAAM,
|
|
1
|
+
{"version":3,"file":"compound-button.styles.js","sourceRoot":"","sources":["../../../src/compound-button/compound-button.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,MAAM,IAAI,YAAY,EAAE,MAAM,4BAA4B,CAAC;AACpE,OAAO,EACL,uBAAuB,EACvB,iCAAiC,EACjC,mCAAmC,EACnC,4BAA4B,EAC5B,8BAA8B,EAC9B,8BAA8B,EAC9B,6BAA6B,EAC7B,eAAe,EACf,eAAe,EACf,eAAe,EACf,iBAAiB,EACjB,iBAAiB,EACjB,iBAAiB,EACjB,kBAAkB,EAClB,uBAAuB,EACvB,mBAAmB,GACpB,MAAM,2BAA2B,CAAC;AACnC,OAAO,EAAE,8BAA8B,EAAE,MAAM,mBAAmB,CAAC;AAEnE,oCAAoC;AACpC,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;IACrB,YAAY;;;;;;;;;iBASC,eAAe;mBACb,iBAAiB;;;;;;;;;;aAUvB,uBAAuB;;iBAEnB,eAAe;mBACb,iBAAiB;;;;;;;;;;;aAWvB,4BAA4B;;;;aAI5B,8BAA8B;;;;aAI9B,6BAA6B;;;;;aAK7B,uBAAuB;;;;aAIvB,iCAAiC;;;;aAIjC,mCAAmC;;;;;aAKnC,8BAA8B;;;;;;;;;;;eAW5B,uBAAuB;;;;;;eAMvB,mBAAmB;;;;;;eAMnB,kBAAkB;;;;;;;iBAOhB,eAAe;mBACb,iBAAiB;;;iBAGnB,eAAe;;CAE/B,CAAC,aAAa,CACb,8BAA8B,CAAC,GAAG,CAAA;;;;;GAKjC,CAAC,CACH,CAAC"}
|
|
@@ -82,10 +82,11 @@ export declare class CounterBadge extends FASTElement {
|
|
|
82
82
|
*/
|
|
83
83
|
dot: boolean;
|
|
84
84
|
/**
|
|
85
|
-
* @internal
|
|
86
85
|
* Function to set the count
|
|
87
86
|
* This is the default slotted content for the counter badge
|
|
88
87
|
* If children are slotted, that will override the value returned
|
|
88
|
+
*
|
|
89
|
+
* @internal
|
|
89
90
|
*/
|
|
90
91
|
setCount(): string | void;
|
|
91
92
|
}
|
|
@@ -58,10 +58,11 @@ export class CounterBadge extends FASTElement {
|
|
|
58
58
|
this.setCount();
|
|
59
59
|
}
|
|
60
60
|
/**
|
|
61
|
-
* @internal
|
|
62
61
|
* Function to set the count
|
|
63
62
|
* This is the default slotted content for the counter badge
|
|
64
63
|
* If children are slotted, that will override the value returned
|
|
64
|
+
*
|
|
65
|
+
* @internal
|
|
65
66
|
*/
|
|
66
67
|
setCount() {
|
|
67
68
|
const count = this.count ?? 0;
|