@fluentui/web-components 3.0.0-beta.5 → 3.0.0-beta.6

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.
Files changed (39) hide show
  1. package/CHANGELOG.md +11 -2
  2. package/dist/dts/dialog/define.d.ts +1 -0
  3. package/dist/dts/dialog/dialog.d.ts +192 -0
  4. package/dist/dts/dialog/dialog.definition.d.ts +9 -0
  5. package/dist/dts/dialog/dialog.options.d.ts +11 -0
  6. package/dist/dts/dialog/dialog.styles.d.ts +4 -0
  7. package/dist/dts/dialog/dialog.template.d.ts +7 -0
  8. package/dist/dts/dialog/index.d.ts +4 -0
  9. package/dist/dts/index.d.ts +1 -0
  10. package/dist/esm/dialog/define.js +4 -0
  11. package/dist/esm/dialog/define.js.map +1 -0
  12. package/dist/esm/dialog/dialog.definition.js +17 -0
  13. package/dist/esm/dialog/dialog.definition.js.map +1 -0
  14. package/dist/esm/dialog/dialog.js +370 -0
  15. package/dist/esm/dialog/dialog.js.map +1 -0
  16. package/dist/esm/dialog/dialog.options.js +10 -0
  17. package/dist/esm/dialog/dialog.options.js.map +1 -0
  18. package/dist/esm/dialog/dialog.styles.js +102 -0
  19. package/dist/esm/dialog/dialog.styles.js.map +1 -0
  20. package/dist/esm/dialog/dialog.template.js +61 -0
  21. package/dist/esm/dialog/dialog.template.js.map +1 -0
  22. package/dist/esm/dialog/index.js +5 -0
  23. package/dist/esm/dialog/index.js.map +1 -0
  24. package/dist/esm/index.js +1 -0
  25. package/dist/esm/index.js.map +1 -1
  26. package/dist/fluent-web-components.api.json +813 -0
  27. package/dist/storybook/{677.939f187f.iframe.bundle.js → 350.e4be85c2.iframe.bundle.js} +3 -3
  28. package/dist/storybook/{677.939f187f.iframe.bundle.js.LICENSE.txt → 350.e4be85c2.iframe.bundle.js.LICENSE.txt} +5 -0
  29. package/dist/storybook/{677.939f187f.iframe.bundle.js.map → 350.e4be85c2.iframe.bundle.js.map} +1 -1
  30. package/dist/storybook/iframe.html +1 -1
  31. package/dist/storybook/main.c651bad5.iframe.bundle.js +2 -0
  32. package/dist/storybook/project.json +1 -1
  33. package/dist/web-components.d.ts +222 -0
  34. package/dist/web-components.js +1973 -1592
  35. package/dist/web-components.min.js +103 -95
  36. package/docs/api-report.md +33 -0
  37. package/package.json +6 -1
  38. package/dist/storybook/main.49f4b1e6.iframe.bundle.js +0 -2
  39. /package/dist/storybook/{main.49f4b1e6.iframe.bundle.js.LICENSE.txt → main.c651bad5.iframe.bundle.js.LICENSE.txt} +0 -0
package/CHANGELOG.md CHANGED
@@ -1,12 +1,21 @@
1
1
  # Change Log - @fluentui/web-components
2
2
 
3
- This log was last generated on Thu, 19 Oct 2023 04:17:59 GMT and should not be manually modified.
3
+ This log was last generated on Thu, 26 Oct 2023 04:16:19 GMT and should not be manually modified.
4
4
 
5
5
  <!-- Start content -->
6
6
 
7
+ ## [3.0.0-beta.6](https://github.com/microsoft/fluentui/tree/@fluentui/web-components_v3.0.0-beta.6)
8
+
9
+ Thu, 26 Oct 2023 04:16:19 GMT
10
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/web-components_v3.0.0-beta.5..@fluentui/web-components_v3.0.0-beta.6)
11
+
12
+ ### Changes
13
+
14
+ - feat(dialog): add dialog web component ([PR #28569](https://github.com/microsoft/fluentui/pull/28569) by brian.christopher.brady@gmail.com)
15
+
7
16
  ## [3.0.0-beta.5](https://github.com/microsoft/fluentui/tree/@fluentui/web-components_v3.0.0-beta.5)
8
17
 
9
- Thu, 19 Oct 2023 04:17:59 GMT
18
+ Thu, 19 Oct 2023 04:18:07 GMT
10
19
  [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/web-components_v3.0.0-beta.4..@fluentui/web-components_v3.0.0-beta.5)
11
20
 
12
21
  ### Changes
@@ -0,0 +1 @@
1
+ export {};
@@ -0,0 +1,192 @@
1
+ import { FASTElement } from '@microsoft/fast-element';
2
+ import { Button as FluentButton } from '../button/button.js';
3
+ import { DialogModalType } from './dialog.options.js';
4
+ /**
5
+ * Dialog component that extends the FASTElement class.
6
+ *
7
+ * @public
8
+ * @extends FASTElement
9
+ */
10
+ export declare class Dialog extends FASTElement {
11
+ /**
12
+ * @private
13
+ * Indicates whether focus is being trapped within the dialog
14
+ */
15
+ private isTrappingFocus;
16
+ /**
17
+ * @public
18
+ * Lifecycle method called when the element is connected to the DOM
19
+ */
20
+ connectedCallback(): void;
21
+ /**
22
+ * @public
23
+ * Lifecycle method called when the element is disconnected from the DOM
24
+ */
25
+ disconnectedCallback(): void;
26
+ /**
27
+ * @public
28
+ * The dialog element
29
+ */
30
+ dialog: HTMLDialogElement;
31
+ /**
32
+ * @public
33
+ * The title action elements
34
+ */
35
+ titleAction: HTMLElement[];
36
+ /**
37
+ * @public
38
+ * The default title action button
39
+ */
40
+ defaultTitleAction?: FluentButton;
41
+ /**
42
+ * @public
43
+ * The ID of the element that describes the dialog
44
+ */
45
+ ariaDescribedby?: string;
46
+ /**
47
+ * @public
48
+ * The ID of the element that labels the dialog
49
+ */
50
+ ariaLabelledby?: string;
51
+ /**
52
+ * @public
53
+ * The type of the dialog modal
54
+ */
55
+ modalType: DialogModalType;
56
+ /**
57
+ * @public
58
+ * Indicates whether the dialog is open
59
+ */
60
+ open: boolean;
61
+ /**
62
+ * @public
63
+ * Indicates whether the dialog has a title action
64
+ */
65
+ noTitleAction: boolean;
66
+ /**
67
+ * @private
68
+ * Indicates whether focus should be trapped within the dialog
69
+ */
70
+ private trapFocus;
71
+ /**
72
+ * @public
73
+ * Method called when the 'open' attribute changes
74
+ */
75
+ openChanged(oldValue: boolean, newValue: boolean): void;
76
+ /**
77
+ * @public
78
+ * Method called when the 'modalType' attribute changes
79
+ */
80
+ modalTypeChanged(oldValue: DialogModalType, newValue: DialogModalType): void;
81
+ /**
82
+ * @public
83
+ * Method to set the component's state based on its attributes
84
+ */
85
+ setComponent(): void;
86
+ /**
87
+ * @public
88
+ * Method to emit an event when the dialog's open state changes
89
+ * @param dismissed - Indicates whether the dialog was dismissed
90
+ */
91
+ onOpenChangeEvent: (dismissed?: boolean) => void;
92
+ /**
93
+ * @public
94
+ * Method to show the dialog
95
+ */
96
+ show(): void;
97
+ /**
98
+ * @public
99
+ * Method to hide the dialog
100
+ * @param dismissed - Indicates whether the dialog was dismissed
101
+ */
102
+ hide(dismissed?: boolean): void;
103
+ /**
104
+ * @public
105
+ * Method to dismiss the dialog
106
+ */
107
+ dismiss(): void;
108
+ /**
109
+ * @public
110
+ * Handles click events on the dialog
111
+ * @param event - The click event
112
+ * @returns boolean
113
+ */
114
+ handleClick(event: Event): boolean;
115
+ /**
116
+ * @public
117
+ * Handles keydown events on the dialog
118
+ * @param e - The keydown event
119
+ * @returns boolean | void
120
+ */
121
+ handleKeydown: (e: KeyboardEvent) => boolean | void;
122
+ /**
123
+ * @private
124
+ * Handles keydown events on the document
125
+ * @param e - The keydown event
126
+ */
127
+ private handleDocumentKeydown;
128
+ /**
129
+ * @private
130
+ * Handles tab keydown events
131
+ * @param e - The keydown event
132
+ */
133
+ private handleTabKeyDown;
134
+ /**
135
+ * @private
136
+ * Gets the bounds of the tab queue
137
+ * @returns (HTMLElement | SVGElement)[]
138
+ */
139
+ private getTabQueueBounds;
140
+ /**
141
+ * @private
142
+ * Focuses the first element in the tab queue
143
+ */
144
+ private focusFirstElement;
145
+ /**
146
+ * @private
147
+ * Determines if focus should be forced
148
+ * @param currentFocusElement - The currently focused element
149
+ * @returns boolean
150
+ */
151
+ private shouldForceFocus;
152
+ /**
153
+ * @private
154
+ * Determines if focus should be trapped
155
+ * @returns boolean
156
+ */
157
+ private shouldTrapFocus;
158
+ /**
159
+ * @private
160
+ * Handles focus events on the document
161
+ * @param e - The focus event
162
+ */
163
+ private handleDocumentFocus;
164
+ /**
165
+ * @private
166
+ * Updates the state of focus trapping
167
+ * @param shouldTrapFocusOverride - Optional override for whether focus should be trapped
168
+ */
169
+ private updateTrapFocus;
170
+ /**
171
+ * @private
172
+ * Reduces the list of tabbable items
173
+ * @param elements - The current list of elements
174
+ * @param element - The element to consider adding to the list
175
+ * @returns HTMLElement[]
176
+ */
177
+ private static reduceTabbableItems;
178
+ /**
179
+ * @private
180
+ * Determines if an element is a focusable FASTElement
181
+ * @param element - The element to check
182
+ * @returns boolean
183
+ */
184
+ private static isFocusableFastElement;
185
+ /**
186
+ * @private
187
+ * Determines if an element has a tabbable shadow
188
+ * @param element - The element to check
189
+ * @returns boolean
190
+ */
191
+ private static hasTabbableShadow;
192
+ }
@@ -0,0 +1,9 @@
1
+ import { Dialog } from './dialog.js';
2
+ /**
3
+ * The Fluent Dialog Element
4
+ *
5
+ * @public
6
+ * @remarks
7
+ * HTML Element: \<fluent-dialog\>
8
+ */
9
+ export declare const definition: import("@microsoft/fast-element").FASTElementDefinition<typeof Dialog>;
@@ -0,0 +1,11 @@
1
+ import type { ValuesOf } from '@microsoft/fast-foundation/utilities.js';
2
+ /**
3
+ * Dialog modal type
4
+ * @public
5
+ */
6
+ export declare const DialogModalType: {
7
+ readonly modal: "modal";
8
+ readonly nonModal: "non-modal";
9
+ readonly alert: "alert";
10
+ };
11
+ export declare type DialogModalType = ValuesOf<typeof DialogModalType>;
@@ -0,0 +1,4 @@
1
+ /** Dialog styles
2
+ * @public
3
+ */
4
+ export declare const styles: import("@microsoft/fast-element").ElementStyles;
@@ -0,0 +1,7 @@
1
+ import { ElementViewTemplate } from '@microsoft/fast-element';
2
+ import type { Dialog } from './dialog.js';
3
+ /**
4
+ * Template for the Dialog component
5
+ * @public
6
+ */
7
+ export declare const template: ElementViewTemplate<Dialog>;
@@ -0,0 +1,4 @@
1
+ export * from './dialog.js';
2
+ export { definition as DialogDefinition } from './dialog.definition.js';
3
+ export { template as DialogTemplate } from './dialog.template.js';
4
+ export { styles as DialogStyles } from './dialog.styles.js';
@@ -7,6 +7,7 @@ export * from './button/index.js';
7
7
  export * from './checkbox/index.js';
8
8
  export * from './compound-button/index.js';
9
9
  export * from './counter-badge/index.js';
10
+ export * from './dialog/index.js';
10
11
  export * from './divider/index.js';
11
12
  export * from './image/index.js';
12
13
  export * from './label/index.js';
@@ -0,0 +1,4 @@
1
+ import { FluentDesignSystem } from '../fluent-design-system.js';
2
+ import { definition } from './dialog.definition.js';
3
+ definition.define(FluentDesignSystem.registry);
4
+ //# sourceMappingURL=define.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"define.js","sourceRoot":"","sources":["../../../src/dialog/define.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,UAAU,EAAE,MAAM,wBAAwB,CAAC;AAEpD,UAAU,CAAC,MAAM,CAAC,kBAAkB,CAAC,QAAQ,CAAC,CAAC"}
@@ -0,0 +1,17 @@
1
+ import { FluentDesignSystem } from '../fluent-design-system.js';
2
+ import { Dialog } from './dialog.js';
3
+ import { template } from './dialog.template.js';
4
+ import { styles } from './dialog.styles.js';
5
+ /**
6
+ * The Fluent Dialog Element
7
+ *
8
+ * @public
9
+ * @remarks
10
+ * HTML Element: \<fluent-dialog\>
11
+ */
12
+ export const definition = Dialog.compose({
13
+ name: `${FluentDesignSystem.prefix}-dialog`,
14
+ template,
15
+ styles,
16
+ });
17
+ //# sourceMappingURL=dialog.definition.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"dialog.definition.js","sourceRoot":"","sources":["../../../src/dialog/dialog.definition.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrC,OAAO,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AAChD,OAAO,EAAE,MAAM,EAAE,MAAM,oBAAoB,CAAC;AAE5C;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,UAAU,GAAG,MAAM,CAAC,OAAO,CAAC;IACvC,IAAI,EAAE,GAAG,kBAAkB,CAAC,MAAM,SAAS;IAC3C,QAAQ;IACR,MAAM;CACP,CAAC,CAAC"}
@@ -0,0 +1,370 @@
1
+ var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
2
+ var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
3
+ if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
4
+ else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
5
+ return c > 3 && r && Object.defineProperty(target, key, r), r;
6
+ };
7
+ import { attr, FASTElement, observable, Updates } from '@microsoft/fast-element';
8
+ import { isTabbable } from 'tabbable';
9
+ import { keyEscape, keyTab } from '@microsoft/fast-web-utilities';
10
+ import { DialogModalType } from './dialog.options.js';
11
+ /**
12
+ * Dialog component that extends the FASTElement class.
13
+ *
14
+ * @public
15
+ * @extends FASTElement
16
+ */
17
+ export class Dialog extends FASTElement {
18
+ constructor() {
19
+ super(...arguments);
20
+ /**
21
+ * @private
22
+ * Indicates whether focus is being trapped within the dialog
23
+ */
24
+ this.isTrappingFocus = false;
25
+ /**
26
+ * @public
27
+ * The title action elements
28
+ */
29
+ this.titleAction = [];
30
+ /**
31
+ * @public
32
+ * The type of the dialog modal
33
+ */
34
+ this.modalType = DialogModalType.modal;
35
+ /**
36
+ * @public
37
+ * Indicates whether the dialog is open
38
+ */
39
+ this.open = false;
40
+ /**
41
+ * @public
42
+ * Indicates whether the dialog has a title action
43
+ */
44
+ this.noTitleAction = false;
45
+ /**
46
+ * @private
47
+ * Indicates whether focus should be trapped within the dialog
48
+ */
49
+ this.trapFocus = false;
50
+ /**
51
+ * @public
52
+ * Method to emit an event when the dialog's open state changes
53
+ * @param dismissed - Indicates whether the dialog was dismissed
54
+ */
55
+ this.onOpenChangeEvent = (dismissed = false) => {
56
+ this.$emit('onOpenChange', { open: this.dialog.open, dismissed: dismissed });
57
+ };
58
+ /**
59
+ * @public
60
+ * Handles keydown events on the dialog
61
+ * @param e - The keydown event
62
+ * @returns boolean | void
63
+ */
64
+ this.handleKeydown = (e) => {
65
+ if (e.defaultPrevented) {
66
+ return;
67
+ }
68
+ switch (e.key) {
69
+ case keyEscape:
70
+ if (this.modalType !== DialogModalType.alert) {
71
+ this.hide(true);
72
+ this.$emit('dismiss');
73
+ }
74
+ break;
75
+ default:
76
+ return true;
77
+ }
78
+ };
79
+ /**
80
+ * @private
81
+ * Handles keydown events on the document
82
+ * @param e - The keydown event
83
+ */
84
+ this.handleDocumentKeydown = (e) => {
85
+ if (!e.defaultPrevented && this.dialog.open) {
86
+ switch (e.key) {
87
+ case keyTab:
88
+ this.handleTabKeyDown(e);
89
+ break;
90
+ }
91
+ }
92
+ };
93
+ /**
94
+ * @private
95
+ * Handles tab keydown events
96
+ * @param e - The keydown event
97
+ */
98
+ this.handleTabKeyDown = (e) => {
99
+ if (!this.trapFocus || !this.dialog.open) {
100
+ return;
101
+ }
102
+ const bounds = this.getTabQueueBounds();
103
+ if (bounds.length === 1) {
104
+ bounds[0].focus();
105
+ e.preventDefault();
106
+ return;
107
+ }
108
+ if (e.shiftKey && e.target === bounds[0]) {
109
+ bounds[bounds.length - 1].focus();
110
+ e.preventDefault();
111
+ }
112
+ else if (!e.shiftKey && e.target === bounds[bounds.length - 1]) {
113
+ bounds[0].focus();
114
+ e.preventDefault();
115
+ }
116
+ return;
117
+ };
118
+ /**
119
+ * @private
120
+ * Gets the bounds of the tab queue
121
+ * @returns (HTMLElement | SVGElement)[]
122
+ */
123
+ this.getTabQueueBounds = () => {
124
+ const bounds = [];
125
+ return Dialog.reduceTabbableItems(bounds, this);
126
+ };
127
+ /**
128
+ * @private
129
+ * Focuses the first element in the tab queue
130
+ */
131
+ this.focusFirstElement = () => {
132
+ const bounds = this.getTabQueueBounds();
133
+ if (bounds.length > 0) {
134
+ bounds[0].focus();
135
+ }
136
+ else {
137
+ if (this.dialog instanceof HTMLElement) {
138
+ this.dialog.focus();
139
+ }
140
+ }
141
+ };
142
+ /**
143
+ * @private
144
+ * Determines if focus should be forced
145
+ * @param currentFocusElement - The currently focused element
146
+ * @returns boolean
147
+ */
148
+ this.shouldForceFocus = (currentFocusElement) => {
149
+ return this.isTrappingFocus && !this.contains(currentFocusElement);
150
+ };
151
+ /**
152
+ * @private
153
+ * Determines if focus should be trapped
154
+ * @returns boolean
155
+ */
156
+ this.shouldTrapFocus = () => {
157
+ return this.trapFocus && this.dialog.open;
158
+ };
159
+ /**
160
+ * @private
161
+ * Handles focus events on the document
162
+ * @param e - The focus event
163
+ */
164
+ this.handleDocumentFocus = (e) => {
165
+ if (!e.defaultPrevented && this.shouldForceFocus(e.target)) {
166
+ this.focusFirstElement();
167
+ e.preventDefault();
168
+ }
169
+ };
170
+ /**
171
+ * @private
172
+ * Updates the state of focus trapping
173
+ * @param shouldTrapFocusOverride - Optional override for whether focus should be trapped
174
+ */
175
+ this.updateTrapFocus = (shouldTrapFocusOverride) => {
176
+ const shouldTrapFocus = shouldTrapFocusOverride === undefined ? this.shouldTrapFocus() : shouldTrapFocusOverride;
177
+ if (shouldTrapFocus && !this.isTrappingFocus) {
178
+ this.isTrappingFocus = true;
179
+ // Add an event listener for focusin events if we are trapping focus
180
+ document.addEventListener('focusin', this.handleDocumentFocus);
181
+ Updates.enqueue(() => {
182
+ if (this.shouldForceFocus(document.activeElement)) {
183
+ this.focusFirstElement();
184
+ }
185
+ });
186
+ }
187
+ else if (!shouldTrapFocus && this.isTrappingFocus) {
188
+ this.isTrappingFocus = false;
189
+ // remove event listener if we are not trapping focus
190
+ document.removeEventListener('focusin', this.handleDocumentFocus);
191
+ }
192
+ };
193
+ }
194
+ /**
195
+ * @public
196
+ * Lifecycle method called when the element is connected to the DOM
197
+ */
198
+ connectedCallback() {
199
+ super.connectedCallback();
200
+ document.addEventListener('keydown', this.handleDocumentKeydown);
201
+ Updates.enqueue(() => {
202
+ this.updateTrapFocus();
203
+ this.setComponent();
204
+ });
205
+ }
206
+ /**
207
+ * @public
208
+ * Lifecycle method called when the element is disconnected from the DOM
209
+ */
210
+ disconnectedCallback() {
211
+ super.disconnectedCallback();
212
+ document.removeEventListener('keydown', this.handleDocumentKeydown);
213
+ this.updateTrapFocus(false);
214
+ }
215
+ /**
216
+ * @public
217
+ * Method called when the 'open' attribute changes
218
+ */
219
+ openChanged(oldValue, newValue) {
220
+ if (newValue !== oldValue) {
221
+ if (newValue && !oldValue) {
222
+ this.show();
223
+ }
224
+ else if (!newValue && oldValue) {
225
+ this.hide();
226
+ }
227
+ }
228
+ }
229
+ /**
230
+ * @public
231
+ * Method called when the 'modalType' attribute changes
232
+ */
233
+ modalTypeChanged(oldValue, newValue) {
234
+ if (newValue !== oldValue) {
235
+ if (newValue == DialogModalType.alert || newValue == DialogModalType.modal) {
236
+ this.trapFocus = true;
237
+ }
238
+ else {
239
+ this.trapFocus = false;
240
+ }
241
+ }
242
+ }
243
+ /**
244
+ * @public
245
+ * Method to set the component's state based on its attributes
246
+ */
247
+ setComponent() {
248
+ if (this.modalType == DialogModalType.modal || this.modalType == DialogModalType.alert) {
249
+ this.trapFocus = true;
250
+ }
251
+ else {
252
+ this.trapFocus = false;
253
+ }
254
+ }
255
+ /**
256
+ * @public
257
+ * Method to show the dialog
258
+ */
259
+ show() {
260
+ Updates.enqueue(() => {
261
+ if (this.modalType === DialogModalType.alert || this.modalType === DialogModalType.modal) {
262
+ this.dialog.showModal();
263
+ this.open = true;
264
+ this.updateTrapFocus(true);
265
+ }
266
+ else if (this.modalType === DialogModalType.nonModal) {
267
+ this.dialog.show();
268
+ this.open = true;
269
+ }
270
+ this.onOpenChangeEvent();
271
+ });
272
+ }
273
+ /**
274
+ * @public
275
+ * Method to hide the dialog
276
+ * @param dismissed - Indicates whether the dialog was dismissed
277
+ */
278
+ hide(dismissed = false) {
279
+ this.dialog.close();
280
+ this.open = false;
281
+ this.onOpenChangeEvent(dismissed);
282
+ }
283
+ /**
284
+ * @public
285
+ * Method to dismiss the dialog
286
+ */
287
+ dismiss() {
288
+ if (this.modalType === DialogModalType.alert) {
289
+ return;
290
+ }
291
+ this.hide(true);
292
+ }
293
+ /**
294
+ * @public
295
+ * Handles click events on the dialog
296
+ * @param event - The click event
297
+ * @returns boolean
298
+ */
299
+ handleClick(event) {
300
+ event.preventDefault();
301
+ if (this.dialog.open && this.modalType !== DialogModalType.alert && event.target === this.dialog) {
302
+ this.dismiss();
303
+ }
304
+ return true;
305
+ }
306
+ /**
307
+ * @private
308
+ * Reduces the list of tabbable items
309
+ * @param elements - The current list of elements
310
+ * @param element - The element to consider adding to the list
311
+ * @returns HTMLElement[]
312
+ */
313
+ static reduceTabbableItems(elements, element) {
314
+ if (element.getAttribute('tabindex') === '-1') {
315
+ return elements;
316
+ }
317
+ if (isTabbable(element) || (Dialog.isFocusableFastElement(element) && Dialog.hasTabbableShadow(element))) {
318
+ elements.push(element);
319
+ return elements;
320
+ }
321
+ return Array.from(element.children).reduce((elements, currentElement) => Dialog.reduceTabbableItems(elements, currentElement), elements);
322
+ }
323
+ /**
324
+ * @private
325
+ * Determines if an element is a focusable FASTElement
326
+ * @param element - The element to check
327
+ * @returns boolean
328
+ */
329
+ static isFocusableFastElement(element) {
330
+ var _a, _b;
331
+ return !!((_b = (_a = element.$fastController) === null || _a === void 0 ? void 0 : _a.definition.shadowOptions) === null || _b === void 0 ? void 0 : _b.delegatesFocus);
332
+ }
333
+ /**
334
+ * @private
335
+ * Determines if an element has a tabbable shadow
336
+ * @param element - The element to check
337
+ * @returns boolean
338
+ */
339
+ static hasTabbableShadow(element) {
340
+ var _a, _b;
341
+ return Array.from((_b = (_a = element.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelectorAll('*')) !== null && _b !== void 0 ? _b : []).some(x => {
342
+ return isTabbable(x);
343
+ });
344
+ }
345
+ }
346
+ __decorate([
347
+ observable
348
+ ], Dialog.prototype, "dialog", void 0);
349
+ __decorate([
350
+ observable
351
+ ], Dialog.prototype, "titleAction", void 0);
352
+ __decorate([
353
+ observable
354
+ ], Dialog.prototype, "defaultTitleAction", void 0);
355
+ __decorate([
356
+ attr({ attribute: 'aria-describedby' })
357
+ ], Dialog.prototype, "ariaDescribedby", void 0);
358
+ __decorate([
359
+ attr({ attribute: 'aria-labelledby' })
360
+ ], Dialog.prototype, "ariaLabelledby", void 0);
361
+ __decorate([
362
+ attr({ attribute: 'modal-type' })
363
+ ], Dialog.prototype, "modalType", void 0);
364
+ __decorate([
365
+ attr({ mode: 'boolean' })
366
+ ], Dialog.prototype, "open", void 0);
367
+ __decorate([
368
+ attr({ mode: 'boolean', attribute: 'no-title-action' })
369
+ ], Dialog.prototype, "noTitleAction", void 0);
370
+ //# sourceMappingURL=dialog.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"dialog.js","sourceRoot":"","sources":["../../../src/dialog/dialog.ts"],"names":[],"mappings":"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"}