@fluentui/web-components 3.0.0-beta.25 → 3.0.0-beta.27

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 (24) hide show
  1. package/CHANGELOG.md +23 -2
  2. package/dist/dts/checkbox/checkbox.d.ts +19 -17
  3. package/dist/dts/divider/divider.d.ts +24 -1
  4. package/dist/dts/switch/switch.d.ts +2 -39
  5. package/dist/esm/checkbox/checkbox.js +12 -10
  6. package/dist/esm/checkbox/checkbox.js.map +1 -1
  7. package/dist/esm/dialog-body/dialog-body.template.js +1 -1
  8. package/dist/esm/dialog-body/dialog-body.template.js.map +1 -1
  9. package/dist/esm/divider/divider.js +38 -13
  10. package/dist/esm/divider/divider.js.map +1 -1
  11. package/dist/esm/divider/divider.template.js +1 -9
  12. package/dist/esm/divider/divider.template.js.map +1 -1
  13. package/dist/esm/switch/switch.js +2 -52
  14. package/dist/esm/switch/switch.js.map +1 -1
  15. package/dist/esm/switch/switch.styles.js +34 -55
  16. package/dist/esm/switch/switch.styles.js.map +1 -1
  17. package/dist/esm/switch/switch.template.js +6 -16
  18. package/dist/esm/switch/switch.template.js.map +1 -1
  19. package/dist/esm/theme/set-theme.js +10 -5
  20. package/dist/esm/theme/set-theme.js.map +1 -1
  21. package/dist/web-components.d.ts +553 -578
  22. package/dist/web-components.js +342 -366
  23. package/dist/web-components.min.js +156 -156
  24. package/package.json +1 -1
package/CHANGELOG.md CHANGED
@@ -1,12 +1,33 @@
1
1
  # Change Log - @fluentui/web-components
2
2
 
3
- This log was last generated on Fri, 07 Jun 2024 04:06:23 GMT and should not be manually modified.
3
+ This log was last generated on Tue, 11 Jun 2024 04:06:16 GMT and should not be manually modified.
4
4
 
5
5
  <!-- Start content -->
6
6
 
7
+ ## [3.0.0-beta.27](https://github.com/microsoft/fluentui/tree/@fluentui/web-components_v3.0.0-beta.27)
8
+
9
+ Tue, 11 Jun 2024 04:06:16 GMT
10
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/web-components_v3.0.0-beta.26..@fluentui/web-components_v3.0.0-beta.27)
11
+
12
+ ### Changes
13
+
14
+ - feat: update divider to leverage ElementInternals ([PR #31627](https://github.com/microsoft/fluentui/pull/31627) by 13071055+chrisdholt@users.noreply.github.com)
15
+ - fix: show default title action in dialog-body for modal dialogs ([PR #31648](https://github.com/microsoft/fluentui/pull/31648) by 13071055+chrisdholt@users.noreply.github.com)
16
+
17
+ ## [3.0.0-beta.26](https://github.com/microsoft/fluentui/tree/@fluentui/web-components_v3.0.0-beta.26)
18
+
19
+ Mon, 10 Jun 2024 04:07:58 GMT
20
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/web-components_v3.0.0-beta.25..@fluentui/web-components_v3.0.0-beta.26)
21
+
22
+ ### Changes
23
+
24
+ - feat: refactor Switch to use ElementInternals by extending BaseCheckbox ([PR #31613](https://github.com/microsoft/fluentui/pull/31613) by 13071055+chrisdholt@users.noreply.github.com)
25
+ - fixes the border-color for switch when in the checked state on rest ([PR #31628](https://github.com/microsoft/fluentui/pull/31628) by 13071055+chrisdholt@users.noreply.github.com)
26
+ - add try-catch block to ensure that registered properties can be updated dynamically ([PR #31629](https://github.com/microsoft/fluentui/pull/31629) by 13071055+chrisdholt@users.noreply.github.com)
27
+
7
28
  ## [3.0.0-beta.25](https://github.com/microsoft/fluentui/tree/@fluentui/web-components_v3.0.0-beta.25)
8
29
 
9
- Fri, 07 Jun 2024 04:06:23 GMT
30
+ Fri, 07 Jun 2024 04:06:31 GMT
10
31
  [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/web-components_v3.0.0-beta.24..@fluentui/web-components_v3.0.0-beta.25)
11
32
 
12
33
  ### Changes
package/dist/dts/checkbox/checkbox.d.ts CHANGED
@@ -11,7 +11,7 @@ import { CheckboxShape, CheckboxSize } from './checkbox.options.js';
11
11
  *
12
12
  * @public
13
13
  */
14
- export declare class Checkbox extends FASTElement {
14
+ export declare class BaseCheckbox extends FASTElement {
15
15
  /**
16
16
  * Indicates that the element should get focus after the page finishes loading.
17
17
  * @see The {@link https://developer.mozilla.org/docs/Web/HTML/Element/input#autofocus | `autofocus`} attribute
@@ -110,22 +110,6 @@ export declare class Checkbox extends FASTElement {
110
110
  * @internal
111
111
  */
112
112
  requiredChanged(prev: boolean, next: boolean): void;
113
- /**
114
- * Indicates the shape of the checkbox.
115
- *
116
- * @public
117
- * @remarks
118
- * HTML Attribute: `shape`
119
- */
120
- shape: CheckboxShape;
121
- /**
122
- * Indicates the size of the checkbox.
123
- *
124
- * @public
125
- * @remarks
126
- * HTML Attribute: `size`
127
- */
128
- size?: CheckboxSize;
129
113
  /**
130
114
  * The internal checked state of the control.
131
115
  *
@@ -297,3 +281,21 @@ export declare class Checkbox extends FASTElement {
297
281
  */
298
282
  private toggleChecked;
299
283
  }
284
+ export declare class Checkbox extends BaseCheckbox {
285
+ /**
286
+ * Indicates the shape of the checkbox.
287
+ *
288
+ * @public
289
+ * @remarks
290
+ * HTML Attribute: `shape`
291
+ */
292
+ shape: CheckboxShape;
293
+ /**
294
+ * Indicates the size of the checkbox.
295
+ *
296
+ * @public
297
+ * @remarks
298
+ * HTML Attribute: `size`
299
+ */
300
+ size?: CheckboxSize;
301
+ }
package/dist/dts/divider/divider.d.ts CHANGED
@@ -7,6 +7,12 @@ import { DividerAlignContent, DividerAppearance, DividerOrientation, DividerRole
7
7
  * A divider groups sections of content to create visual rhythm and hierarchy. Use dividers along with spacing and headers to organize content in your layout.
8
8
  */
9
9
  export declare class Divider extends FASTElement {
10
+ /**
11
+ * The internal {@link https://developer.mozilla.org/docs/Web/API/ElementInternals | `ElementInternals`} instance for the component.
12
+ *
13
+ * @internal
14
+ */
15
+ elementInternals: ElementInternals;
10
16
  /**
11
17
  * The role of the element.
12
18
  *
@@ -22,7 +28,7 @@ export declare class Divider extends FASTElement {
22
28
  * @remarks
23
29
  * HTML Attribute: orientation
24
30
  */
25
- orientation: DividerOrientation;
31
+ orientation?: DividerOrientation;
26
32
  /**
27
33
  * @public
28
34
  * @remarks
@@ -41,4 +47,21 @@ export declare class Divider extends FASTElement {
41
47
  * Adds padding to the beginning and end of the divider.
42
48
  */
43
49
  inset?: boolean;
50
+ connectedCallback(): void;
51
+ /**
52
+ * Sets the element's internal role when the role attribute changes.
53
+ *
54
+ * @param previous - the previous role value
55
+ * @param next - the current role value
56
+ * @internal
57
+ */
58
+ roleChanged(previous: string | null, next: string | null): void;
59
+ /**
60
+ * Sets the element's internal orientation when the orientation attribute changes.
61
+ *
62
+ * @param previous - the previous orientation value
63
+ * @param next - the current orientation value
64
+ * @internal
65
+ */
66
+ orientationChanged(previous: string | null, next: string | null): void;
44
67
  }
package/dist/dts/switch/switch.d.ts CHANGED
@@ -1,44 +1,7 @@
1
1
  import type { StaticallyComposableHTML } from '../utils/index.js';
2
- import { SwitchLabelPosition } from './switch.options.js';
3
- import { FormAssociatedSwitch } from './switch.form-associated.js';
2
+ import { BaseCheckbox } from '../checkbox/checkbox.js';
4
3
  export type SwitchOptions = {
5
4
  switch?: StaticallyComposableHTML<Switch>;
6
5
  };
7
- export declare class Switch extends FormAssociatedSwitch {
8
- /**
9
- * The label position of the switch
10
- *
11
- * @public
12
- * @remarks
13
- * HTML Attribute: labelposition
14
- */
15
- labelPosition: SwitchLabelPosition | undefined;
16
- /**
17
- * When true, the control will be immutable by user interaction. See {@link https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/readonly | readonly HTML attribute} for more information.
18
- * @public
19
- * @remarks
20
- * HTML Attribute: readonly
21
- */
22
- readOnly: boolean;
23
- protected readOnlyChanged(): void;
24
- /**
25
- * The element's value to be included in form submission when checked.
26
- * Default to "on" to reach parity with input[type="checkbox"]
27
- *
28
- * @internal
29
- */
30
- initialValue: string;
31
- /**
32
- * @internal
33
- */
34
- defaultSlottedNodes: Node[];
35
- constructor();
36
- /**
37
- * @internal
38
- */
39
- keypressHandler: (e: KeyboardEvent) => void;
40
- /**
41
- * @internal
42
- */
43
- clickHandler: (e: MouseEvent) => void;
6
+ export declare class Switch extends BaseCheckbox {
44
7
  }
package/dist/esm/checkbox/checkbox.js CHANGED
@@ -12,7 +12,7 @@ import { toggleState } from '../utils/element-internals.js';
12
12
  *
13
13
  * @public
14
14
  */
15
- export class Checkbox extends FASTElement {
15
+ export class BaseCheckbox extends FASTElement {
16
16
  /**
17
17
  * The element's current checked state.
18
18
  *
@@ -346,31 +346,33 @@ export class Checkbox extends FASTElement {
346
346
  *
347
347
  * @public
348
348
  */
349
- Checkbox.formAssociated = true;
349
+ BaseCheckbox.formAssociated = true;
350
350
  __decorate([
351
351
  attr({ mode: 'boolean' })
352
- ], Checkbox.prototype, "autofocus", void 0);
352
+ ], BaseCheckbox.prototype, "autofocus", void 0);
353
353
  __decorate([
354
354
  attr({ mode: 'boolean' })
355
- ], Checkbox.prototype, "disabled", void 0);
355
+ ], BaseCheckbox.prototype, "disabled", void 0);
356
356
  __decorate([
357
357
  attr({ attribute: 'form' })
358
- ], Checkbox.prototype, "formAttribute", void 0);
358
+ ], BaseCheckbox.prototype, "formAttribute", void 0);
359
359
  __decorate([
360
360
  observable
361
- ], Checkbox.prototype, "indeterminate", void 0);
361
+ ], BaseCheckbox.prototype, "indeterminate", void 0);
362
362
  __decorate([
363
363
  attr({ attribute: 'checked', mode: 'boolean' })
364
- ], Checkbox.prototype, "initialChecked", void 0);
364
+ ], BaseCheckbox.prototype, "initialChecked", void 0);
365
365
  __decorate([
366
366
  attr({ attribute: 'value', mode: 'fromView' })
367
- ], Checkbox.prototype, "initialValue", void 0);
367
+ ], BaseCheckbox.prototype, "initialValue", void 0);
368
368
  __decorate([
369
369
  attr
370
- ], Checkbox.prototype, "name", void 0);
370
+ ], BaseCheckbox.prototype, "name", void 0);
371
371
  __decorate([
372
372
  attr({ mode: 'boolean' })
373
- ], Checkbox.prototype, "required", void 0);
373
+ ], BaseCheckbox.prototype, "required", void 0);
374
+ export class Checkbox extends BaseCheckbox {
375
+ }
374
376
  __decorate([
375
377
  attr
376
378
  ], Checkbox.prototype, "shape", void 0);
package/dist/esm/checkbox/checkbox.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"checkbox.js","sourceRoot":"","sources":["../../../src/checkbox/checkbox.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"checkbox.js","sourceRoot":"","sources":["../../../src/checkbox/checkbox.ts"],"names":[],"mappings":"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"}
package/dist/esm/dialog-body/dialog-body.template.js CHANGED
@@ -23,7 +23,7 @@ export const template = html `
23
23
  <slot name="title"></slot>
24
24
  <slot name="title-action">
25
25
  <fluent-button
26
- ?hidden=${x => { var _a; return x.noTitleAction || ((_a = x.parentNode) === null || _a === void 0 ? void 0 : _a.type) !== DialogType.nonModal; }}
26
+ ?hidden=${x => { var _a; return x.noTitleAction || ((_a = x.parentNode) === null || _a === void 0 ? void 0 : _a.type) === DialogType.alert; }}
27
27
  tabindex="0"
28
28
  part="title-action"
29
29
  class="title-action"
package/dist/esm/dialog-body/dialog-body.template.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"dialog-body.template.js","sourceRoot":"","sources":["../../../src/dialog-body/dialog-body.template.ts"],"names":[],"mappings":"AAAA,OAAO,EAAuB,IAAI,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AACzE,OAAO,EAAE,UAAU,EAAE,MAAM,6BAA6B,CAAC;AAEzD,MAAM,kBAAkB,GAAG,IAAI,CAAC,OAAO,CAAC;;;;;;;;;;;;;SAa/B,CAAC,CAAC;AAEX;;;GAGG;AACH,MAAM,CAAC,MAAM,QAAQ,GAAwB,IAAI,CAAA;;;;;kBAK/B,CAAC,CAAC,EAAE,WAAC,OAAA,CAAC,CAAC,aAAa,IAAI,CAAA,MAAA,CAAC,CAAC,UAAU,0CAAE,IAAI,MAAK,UAAU,CAAC,QAAQ,CAAA,EAAA;;;;;;iBAMnE,CAAC,CAAC,EAAE,WAAC,OAAA,MAAA,CAAC,CAAC,UAAU,0CAAE,IAAI,EAAE,CAAA,EAAA;UAChC,GAAG,CAAC,oBAAoB,CAAC;;UAEzB,kBAAkB;;;;;;CAM3B,CAAC"}
1
+ {"version":3,"file":"dialog-body.template.js","sourceRoot":"","sources":["../../../src/dialog-body/dialog-body.template.ts"],"names":[],"mappings":"AAAA,OAAO,EAAuB,IAAI,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AACzE,OAAO,EAAE,UAAU,EAAE,MAAM,6BAA6B,CAAC;AAEzD,MAAM,kBAAkB,GAAG,IAAI,CAAC,OAAO,CAAC;;;;;;;;;;;;;SAa/B,CAAC,CAAC;AAEX;;;GAGG;AACH,MAAM,CAAC,MAAM,QAAQ,GAAwB,IAAI,CAAA;;;;;kBAK/B,CAAC,CAAC,EAAE,WAAC,OAAA,CAAC,CAAC,aAAa,IAAI,CAAA,MAAA,CAAC,CAAC,UAAU,0CAAE,IAAI,MAAK,UAAU,CAAC,KAAK,CAAA,EAAA;;;;;;iBAMhE,CAAC,CAAC,EAAE,WAAC,OAAA,MAAA,CAAC,CAAC,UAAU,0CAAE,IAAI,EAAE,CAAA,EAAA;UAChC,GAAG,CAAC,oBAAoB,CAAC;;UAEzB,kBAAkB;;;;;;CAM3B,CAAC"}
package/dist/esm/divider/divider.js CHANGED
@@ -11,21 +11,46 @@ export class Divider extends FASTElement {
11
11
  constructor() {
12
12
  super(...arguments);
13
13
  /**
14
- * The role of the element.
14
+ * The internal {@link https://developer.mozilla.org/docs/Web/API/ElementInternals | `ElementInternals`} instance for the component.
15
15
  *
16
- * @public
17
- * @remarks
18
- * HTML Attribute: role
16
+ * @internal
19
17
  */
20
- this.role = DividerRole.separator;
21
- /**
22
- * The orientation of the divider.
23
- *
24
- * @public
25
- * @remarks
26
- * HTML Attribute: orientation
27
- */
28
- this.orientation = DividerOrientation.horizontal;
18
+ this.elementInternals = this.attachInternals();
19
+ }
20
+ connectedCallback() {
21
+ var _a, _b;
22
+ super.connectedCallback();
23
+ this.elementInternals.role = (_a = this.role) !== null && _a !== void 0 ? _a : DividerRole.separator;
24
+ if (this.role !== DividerRole.presentation) {
25
+ this.elementInternals.ariaOrientation = (_b = this.orientation) !== null && _b !== void 0 ? _b : DividerOrientation.horizontal;
26
+ }
27
+ }
28
+ /**
29
+ * Sets the element's internal role when the role attribute changes.
30
+ *
31
+ * @param previous - the previous role value
32
+ * @param next - the current role value
33
+ * @internal
34
+ */
35
+ roleChanged(previous, next) {
36
+ if (this.$fastController.isConnected) {
37
+ this.elementInternals.role = `${next !== null && next !== void 0 ? next : DividerRole.separator}`;
38
+ }
39
+ if (next === DividerRole.presentation) {
40
+ this.elementInternals.ariaOrientation = null;
41
+ }
42
+ }
43
+ /**
44
+ * Sets the element's internal orientation when the orientation attribute changes.
45
+ *
46
+ * @param previous - the previous orientation value
47
+ * @param next - the current orientation value
48
+ * @internal
49
+ */
50
+ orientationChanged(previous, next) {
51
+ if (this.$fastController.isConnected) {
52
+ this.elementInternals.ariaOrientation = this.role !== DividerRole.presentation ? next : null;
53
+ }
29
54
  }
30
55
  }
31
56
  __decorate([
package/dist/esm/divider/divider.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"divider.js","sourceRoot":"","sources":["../../../src/divider/divider.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAC5D,OAAO,EAA0C,kBAAkB,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAE/G;;;;;GAKG;AACH,MAAM,OAAO,OAAQ,SAAQ,WAAW;IAAxC;;QACE;;;;;;WAMG;QAEI,SAAI,GAAgB,WAAW,CAAC,SAAS,CAAC;QAEjD;;;;;;WAMG;QAEI,gBAAW,GAAuB,kBAAkB,CAAC,UAAU,CAAC;IAyBzE,CAAC;CAAA;AAnCC;IADC,IAAI;qCAC4C;AAUjD;IADC,IAAI;4CACkE;AAQvE;IADC,IAAI,CAAC,EAAE,SAAS,EAAE,eAAe,EAAE,CAAC;6CACK;AAQ1C;IADC,IAAI;2CACiC;AAQtC;IADC,IAAI,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC;sCACH"}
1
+ {"version":3,"file":"divider.js","sourceRoot":"","sources":["../../../src/divider/divider.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAC5D,OAAO,EAA0C,kBAAkB,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAE/G;;;;;GAKG;AACH,MAAM,OAAO,OAAQ,SAAQ,WAAW;IAAxC;;QACE;;;;WAIG;QACI,qBAAgB,GAAqB,IAAI,CAAC,eAAe,EAAE,CAAC;IAqFrE,CAAC;IAvCQ,iBAAiB;;QACtB,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAE1B,IAAI,CAAC,gBAAgB,CAAC,IAAI,GAAG,MAAA,IAAI,CAAC,IAAI,mCAAI,WAAW,CAAC,SAAS,CAAC;QAEhE,IAAI,IAAI,CAAC,IAAI,KAAK,WAAW,CAAC,YAAY,EAAE;YAC1C,IAAI,CAAC,gBAAgB,CAAC,eAAe,GAAG,MAAA,IAAI,CAAC,WAAW,mCAAI,kBAAkB,CAAC,UAAU,CAAC;SAC3F;IACH,CAAC;IAED;;;;;;OAMG;IACI,WAAW,CAAC,QAAuB,EAAE,IAAmB;QAC7D,IAAI,IAAI,CAAC,eAAe,CAAC,WAAW,EAAE;YACpC,IAAI,CAAC,gBAAgB,CAAC,IAAI,GAAG,GAAG,IAAI,aAAJ,IAAI,cAAJ,IAAI,GAAI,WAAW,CAAC,SAAS,EAAE,CAAC;SACjE;QAED,IAAI,IAAI,KAAK,WAAW,CAAC,YAAY,EAAE;YACrC,IAAI,CAAC,gBAAgB,CAAC,eAAe,GAAG,IAAI,CAAC;SAC9C;IACH,CAAC;IAED;;;;;;OAMG;IACI,kBAAkB,CAAC,QAAuB,EAAE,IAAmB;QACpE,IAAI,IAAI,CAAC,eAAe,CAAC,WAAW,EAAE;YACpC,IAAI,CAAC,gBAAgB,CAAC,eAAe,GAAG,IAAI,CAAC,IAAI,KAAK,WAAW,CAAC,YAAY,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC;SAC9F;IACH,CAAC;CACF;AA3EC;IADC,IAAI;qCACqB;AAU1B;IADC,IAAI;4CACmC;AAQxC;IADC,IAAI,CAAC,EAAE,SAAS,EAAE,eAAe,EAAE,CAAC;6CACK;AAQ1C;IADC,IAAI;2CACiC;AAQtC;IADC,IAAI,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC;sCACH"}
package/dist/esm/divider/divider.template.js CHANGED
@@ -1,14 +1,6 @@
1
1
  import { html } from '@microsoft/fast-element';
2
- import { DividerRole } from './divider.options.js';
3
2
  export function dividerTemplate() {
4
- return html `
5
- <template
6
- role="${x => x.role}"
7
- aria-orientation="${x => (x.role !== DividerRole.presentation ? x.orientation : void 0)}"
8
- >
9
- <slot></slot>
10
- </template>
11
- `;
3
+ return html `<slot></slot>`;
12
4
  }
13
5
  /**
14
6
  * Template for the Divider component
package/dist/esm/divider/divider.template.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"divider.template.js","sourceRoot":"","sources":["../../../src/divider/divider.template.ts"],"names":[],"mappings":"AAAA,OAAO,EAAuB,IAAI,EAAE,MAAM,yBAAyB,CAAC;AAEpE,OAAO,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAEnD,MAAM,UAAU,eAAe;IAC7B,OAAO,IAAI,CAAG;;cAEF,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI;0BACC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,IAAI,KAAK,WAAW,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC;;;;GAI1F,CAAC;AACJ,CAAC;AAED;;;GAGG;AACH,MAAM,CAAC,MAAM,QAAQ,GAAiC,eAAe,EAAE,CAAC"}
1
+ {"version":3,"file":"divider.template.js","sourceRoot":"","sources":["../../../src/divider/divider.template.ts"],"names":[],"mappings":"AAAA,OAAO,EAAuB,IAAI,EAAE,MAAM,yBAAyB,CAAC;AAGpE,MAAM,UAAU,eAAe;IAC7B,OAAO,IAAI,CAAG,eAAe,CAAC;AAChC,CAAC;AAED;;;GAGG;AACH,MAAM,CAAC,MAAM,QAAQ,GAAiC,eAAe,EAAE,CAAC"}
package/dist/esm/switch/switch.js CHANGED
@@ -1,54 +1,4 @@
1
- import { __decorate } from "tslib";
2
- import { attr, observable } from '@microsoft/fast-element';
3
- import { keyEnter, keySpace } from '@microsoft/fast-web-utilities';
4
- import { FormAssociatedSwitch } from './switch.form-associated.js';
5
- export class Switch extends FormAssociatedSwitch {
6
- readOnlyChanged() {
7
- if (this.proxy instanceof HTMLInputElement) {
8
- this.proxy.readOnly = this.readOnly;
9
- }
10
- }
11
- constructor() {
12
- super();
13
- /**
14
- * The element's value to be included in form submission when checked.
15
- * Default to "on" to reach parity with input[type="checkbox"]
16
- *
17
- * @internal
18
- */
19
- this.initialValue = 'on';
20
- /**
21
- * @internal
22
- */
23
- this.keypressHandler = (e) => {
24
- if (this.readOnly) {
25
- return;
26
- }
27
- switch (e.key) {
28
- case keyEnter:
29
- case keySpace:
30
- this.checked = !this.checked;
31
- break;
32
- }
33
- };
34
- /**
35
- * @internal
36
- */
37
- this.clickHandler = (e) => {
38
- if (!this.disabled && !this.readOnly) {
39
- this.checked = !this.checked;
40
- }
41
- };
42
- this.proxy.setAttribute('type', 'checkbox');
43
- }
1
+ import { BaseCheckbox } from '../checkbox/checkbox.js';
2
+ export class Switch extends BaseCheckbox {
44
3
  }
45
- __decorate([
46
- attr({ attribute: 'label-position' })
47
- ], Switch.prototype, "labelPosition", void 0);
48
- __decorate([
49
- attr({ attribute: 'readonly', mode: 'boolean' })
50
- ], Switch.prototype, "readOnly", void 0);
51
- __decorate([
52
- observable
53
- ], Switch.prototype, "defaultSlottedNodes", void 0);
54
4
  //# sourceMappingURL=switch.js.map
package/dist/esm/switch/switch.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"switch.js","sourceRoot":"","sources":["../../../src/switch/switch.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAC3D,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAE,MAAM,+BAA+B,CAAC;AAGnE,OAAO,EAAE,oBAAoB,EAAE,MAAM,6BAA6B,CAAC;AAMnE,MAAM,OAAO,MAAO,SAAQ,oBAAoB;IAmBpC,eAAe;QACvB,IAAI,IAAI,CAAC,KAAK,YAAY,gBAAgB,EAAE;YAC1C,IAAI,CAAC,KAAK,CAAC,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC;SACrC;IACH,CAAC;IAgBD;QACE,KAAK,EAAE,CAAC;QAfV;;;;;WAKG;QACI,iBAAY,GAAW,IAAI,CAAC;QAcnC;;WAEG;QACI,oBAAe,GAAG,CAAC,CAAgB,EAAE,EAAE;YAC5C,IAAI,IAAI,CAAC,QAAQ,EAAE;gBACjB,OAAO;aACR;YAED,QAAQ,CAAC,CAAC,GAAG,EAAE;gBACb,KAAK,QAAQ,CAAC;gBACd,KAAK,QAAQ;oBACX,IAAI,CAAC,OAAO,GAAG,CAAC,IAAI,CAAC,OAAO,CAAC;oBAC7B,MAAM;aACT;QACH,CAAC,CAAC;QAEF;;WAEG;QACI,iBAAY,GAAG,CAAC,CAAa,EAAE,EAAE;YACtC,IAAI,CAAC,IAAI,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;gBACpC,IAAI,CAAC,OAAO,GAAG,CAAC,IAAI,CAAC,OAAO,CAAC;aAC9B;QACH,CAAC,CAAC;QA1BA,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,MAAM,EAAE,UAAU,CAAC,CAAC;IAC9C,CAAC;CA0BF;AA5DC;IADC,IAAI,CAAC,EAAE,SAAS,EAAE,gBAAgB,EAAE,CAAC;6CACgB;AAStD;IADC,IAAI,CAAC,EAAE,SAAS,EAAE,UAAU,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC;wCACvB;AAmB1B;IADC,UAAU;mDACyB"}
1
+ {"version":3,"file":"switch.js","sourceRoot":"","sources":["../../../src/switch/switch.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAC;AAMvD,MAAM,OAAO,MAAO,SAAQ,YAAY;CAAG"}
package/dist/esm/switch/switch.styles.js CHANGED
@@ -1,81 +1,56 @@
1
1
  import { css } from '@microsoft/fast-element';
2
2
  import { display, forcedColorsStylesheetBehavior } from '../utils/index.js';
3
- import { borderRadiusCircular, colorCompoundBrandBackground, colorCompoundBrandBackgroundHover, colorCompoundBrandBackgroundPressed, colorNeutralBackgroundDisabled, colorNeutralForeground1, colorNeutralForeground3, colorNeutralForeground3Hover, colorNeutralForeground3Pressed, colorNeutralForegroundDisabled, colorNeutralForegroundInverted, colorNeutralForegroundInvertedHover, colorNeutralForegroundInvertedPressed, colorNeutralStrokeAccessible, colorNeutralStrokeAccessibleHover, colorNeutralStrokeAccessiblePressed, colorNeutralStrokeDisabled, colorStrokeFocus2, colorTransparentBackground, colorTransparentStroke, curveEasyEase, durationNormal, fontFamilyBase, fontSizeBase300, fontWeightRegular, lineHeightBase300, shadow4, spacingHorizontalS, spacingHorizontalXS, spacingHorizontalXXS, spacingVerticalS, spacingVerticalXS, strokeWidthThick, } from '../theme/design-tokens.js';
3
+ import { borderRadiusCircular, colorCompoundBrandBackground, colorCompoundBrandBackgroundHover, colorCompoundBrandBackgroundPressed, colorNeutralBackgroundDisabled, colorNeutralForeground3, colorNeutralForeground3Hover, colorNeutralForeground3Pressed, colorNeutralForegroundDisabled, colorNeutralForegroundInverted, colorNeutralForegroundInvertedHover, colorNeutralForegroundInvertedPressed, colorNeutralStrokeAccessible, colorNeutralStrokeAccessibleHover, colorNeutralStrokeAccessiblePressed, colorNeutralStrokeDisabled, colorStrokeFocus2, colorTransparentBackground, colorTransparentStroke, curveEasyEase, durationNormal, shadow4, spacingHorizontalXXS, strokeWidthThick, } from '../theme/design-tokens.js';
4
+ /**
5
+ * Selector for the `checked` state.
6
+ * @public
7
+ */
8
+ const checkedState = css.partial `:is([state--checked], :state(checked))`;
4
9
  export const styles = css `
5
10
  ${display('inline-flex')}
6
11
 
7
12
  :host {
13
+ box-sizing: border-box;
8
14
  align-items: center;
9
- flex-direction: row-reverse;
15
+ flex-direction: row;
10
16
  outline: none;
11
17
  user-select: none;
12
18
  contain: content;
13
- }
14
- :host([label-position='before']) {
15
- flex-direction: row;
16
- }
17
- :host([label-position='above']) {
18
- flex-direction: column;
19
- align-items: flex-start;
20
- }
21
- :host([disabled]) .label,
22
- :host([readonly]) .label,
23
- :host([readonly]) .switch,
24
- :host([disabled]) .switch {
25
- cursor: not-allowed;
26
- }
27
- .label {
28
- position: relative;
29
- color: ${colorNeutralForeground1};
30
- line-height: ${lineHeightBase300};
31
- font-size: ${fontSizeBase300};
32
- font-weight: ${fontWeightRegular};
33
- font-family: ${fontFamilyBase};
34
- padding: ${spacingVerticalXS} ${spacingHorizontalXS};
35
- cursor: pointer;
36
- }
37
- .label__hidden {
38
- display: none;
39
- }
40
- .switch {
41
- display: flex;
42
- align-items: center;
43
19
  padding: 0 ${spacingHorizontalXXS};
44
- box-sizing: border-box;
45
20
  width: 40px;
46
21
  height: 20px;
47
22
  background-color: ${colorTransparentBackground};
48
23
  border: 1px solid ${colorNeutralStrokeAccessible};
49
24
  border-radius: ${borderRadiusCircular};
50
- outline: none;
51
25
  cursor: pointer;
52
- margin: ${spacingVerticalS} ${spacingHorizontalS};
53
26
  }
54
- :host(:hover) .switch {
27
+
28
+ :host(:hover) {
55
29
  background: none;
56
30
  border-color: ${colorNeutralStrokeAccessibleHover};
57
31
  }
58
- :host(:active) .switch {
32
+ :host(:active) {
59
33
  border-color: ${colorNeutralStrokeAccessiblePressed};
60
34
  }
61
- :host([disabled]) .switch,
62
- :host([readonly]) .switch {
35
+ :host(:disabled),
36
+ :host([readonly]) {
63
37
  border: 1px solid ${colorNeutralStrokeDisabled};
64
38
  background-color: none;
65
39
  pointer: default;
66
40
  }
67
- :host([aria-checked='true']) .switch {
41
+ :host(${checkedState}) {
68
42
  background: ${colorCompoundBrandBackground};
43
+ border-color: ${colorCompoundBrandBackground};
69
44
  }
70
- :host([aria-checked='true']:hover) .switch {
45
+ :host(${checkedState}:hover) {
71
46
  background: ${colorCompoundBrandBackgroundHover};
72
47
  border-color: ${colorCompoundBrandBackgroundHover};
73
48
  }
74
- :host([aria-checked='true']:active) .switch {
49
+ :host(${checkedState}:active) {
75
50
  background: ${colorCompoundBrandBackgroundPressed};
76
51
  border-color: ${colorCompoundBrandBackgroundPressed};
77
52
  }
78
- :host([aria-checked='true'][disabled]) .switch {
53
+ :host(${checkedState}:disabled) {
79
54
  background: ${colorNeutralBackgroundDisabled};
80
55
  border-color: ${colorNeutralStrokeDisabled};
81
56
  }
@@ -89,14 +64,14 @@ export const styles = css `
89
64
  transition-timing-function: ${curveEasyEase};
90
65
  transition-property: margin-inline-start;
91
66
  }
92
- :host([aria-checked='true']) .checked-indicator {
67
+ :host(${checkedState}) .checked-indicator {
93
68
  background-color: ${colorNeutralForegroundInverted};
94
69
  margin-inline-start: calc(100% - 14px);
95
70
  }
96
- :host([aria-checked='true']:hover) .checked-indicator {
71
+ :host(${checkedState}:hover) .checked-indicator {
97
72
  background: ${colorNeutralForegroundInvertedHover};
98
73
  }
99
- :host([aria-checked='true']:active) .checked-indicator {
74
+ :host(${checkedState}:active) .checked-indicator {
100
75
  background: ${colorNeutralForegroundInvertedPressed};
101
76
  }
102
77
  :host(:hover) .checked-indicator {
@@ -105,26 +80,30 @@ export const styles = css `
105
80
  :host(:active) .checked-indicator {
106
81
  background-color: ${colorNeutralForeground3Pressed};
107
82
  }
108
- :host([disabled]) .checked-indicator,
83
+ :host(:disabled) .checked-indicator,
109
84
  :host([readonly]) .checked-indicator {
110
85
  background: ${colorNeutralForegroundDisabled};
111
86
  }
112
- :host([aria-checked='true'][disabled]) .checked-indicator {
87
+ :host(${checkedState}:disabled) .checked-indicator {
113
88
  background: ${colorNeutralForegroundDisabled};
114
89
  }
115
90
 
116
91
  :host(:focus-visible) {
92
+ outline: none;
93
+ }
94
+
95
+ :host(:not([slot='input']):focus-visible) {
117
96
  border-color: ${colorTransparentStroke};
118
97
  outline: ${strokeWidthThick} solid ${colorTransparentStroke};
119
98
  box-shadow: ${shadow4}, 0 0 0 2px ${colorStrokeFocus2};
120
99
  }
121
100
  `.withBehaviors(forcedColorsStylesheetBehavior(css `
122
- .switch {
101
+ :host {
123
102
  border-color: InactiveBorder;
124
103
  }
125
- :host([aria-checked='true']) .switch,
126
- :host([aria-checked='true']:active) .switch,
127
- :host([aria-checked='true']:hover) .switch {
104
+ :host(${checkedState}),
105
+ :host(${checkedState}:active),
106
+ :host(${checkedState}:hover) {
128
107
  background: Highlight;
129
108
  border-color: Highlight;
130
109
  }
@@ -133,9 +112,9 @@ export const styles = css `
133
112
  :host(:active) .checked-indicator {
134
113
  background-color: ActiveCaption;
135
114
  }
136
- :host([aria-checked='true']) .checked-indicator,
137
- :host([aria-checked='true']:hover) .checked-indicator,
138
- :host([aria-checked='true']:active) .checked-indicator {
115
+ :host(${checkedState}) .checked-indicator,
116
+ :host(${checkedState}:hover) .checked-indicator,
117
+ :host(${checkedState}:active) .checked-indicator {
139
118
  background-color: ButtonFace;
140
119
  }
141
120
  `));
package/dist/esm/switch/switch.styles.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"switch.styles.js","sourceRoot":"","sources":["../../../src/switch/switch.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,4BAA4B,EAC5B,iCAAiC,EACjC,mCAAmC,EACnC,8BAA8B,EAC9B,uBAAuB,EACvB,uBAAuB,EACvB,4BAA4B,EAC5B,8BAA8B,EAC9B,8BAA8B,EAC9B,8BAA8B,EAC9B,mCAAmC,EACnC,qCAAqC,EACrC,4BAA4B,EAC5B,iCAAiC,EACjC,mCAAmC,EACnC,0BAA0B,EAC1B,iBAAiB,EACjB,0BAA0B,EAC1B,sBAAsB,EACtB,aAAa,EACb,cAAc,EACd,cAAc,EACd,eAAe,EACf,iBAAiB,EACjB,iBAAiB,EACjB,OAAO,EACP,kBAAkB,EAClB,mBAAmB,EACnB,oBAAoB,EACpB,gBAAgB,EAChB,iBAAiB,EACjB,gBAAgB,GACjB,MAAM,2BAA2B,CAAC;AAEnC,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;IACrB,OAAO,CAAC,aAAa,CAAC;;;;;;;;;;;;;;;;;;;;;;;;aAwBb,uBAAuB;mBACjB,iBAAiB;iBACnB,eAAe;mBACb,iBAAiB;mBACjB,cAAc;eAClB,iBAAiB,IAAI,mBAAmB;;;;;;;;;iBAStC,oBAAoB;;;;wBAIb,0BAA0B;wBAC1B,4BAA4B;qBAC/B,oBAAoB;;;cAG3B,gBAAgB,IAAI,kBAAkB;;;;oBAIhC,iCAAiC;;;oBAGjC,mCAAmC;;;;wBAI/B,0BAA0B;;;;;kBAKhC,4BAA4B;;;kBAG5B,iCAAiC;oBAC/B,iCAAiC;;;kBAGnC,mCAAmC;oBACjC,mCAAmC;;;kBAGrC,8BAA8B;oBAC5B,0BAA0B;;;;;;;wBAOtB,uBAAuB;2BACpB,cAAc;kCACP,aAAa;;;;wBAIvB,8BAA8B;;;;kBAIpC,mCAAmC;;;kBAGnC,qCAAqC;;;wBAG/B,4BAA4B;;;wBAG5B,8BAA8B;;;;kBAIpC,8BAA8B;;;kBAG9B,8BAA8B;;;;oBAI5B,sBAAsB;eAC3B,gBAAgB,UAAU,sBAAsB;kBAC7C,OAAO,eAAe,iBAAiB;;CAExD,CAAC,aAAa,CACb,8BAA8B,CAAC,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;GAoBjC,CAAC,CACH,CAAC"}
1
+ {"version":3,"file":"switch.styles.js","sourceRoot":"","sources":["../../../src/switch/switch.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,4BAA4B,EAC5B,iCAAiC,EACjC,mCAAmC,EACnC,8BAA8B,EAC9B,uBAAuB,EACvB,4BAA4B,EAC5B,8BAA8B,EAC9B,8BAA8B,EAC9B,8BAA8B,EAC9B,mCAAmC,EACnC,qCAAqC,EACrC,4BAA4B,EAC5B,iCAAiC,EACjC,mCAAmC,EACnC,0BAA0B,EAC1B,iBAAiB,EACjB,0BAA0B,EAC1B,sBAAsB,EACtB,aAAa,EACb,cAAc,EACd,OAAO,EACP,oBAAoB,EACpB,gBAAgB,GACjB,MAAM,2BAA2B,CAAC;AAEnC;;;GAGG;AACH,MAAM,YAAY,GAAG,GAAG,CAAC,OAAO,CAAA,wCAAwC,CAAC;AAEzE,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;IACrB,OAAO,CAAC,aAAa,CAAC;;;;;;;;;iBAST,oBAAoB;;;wBAGb,0BAA0B;wBAC1B,4BAA4B;qBAC/B,oBAAoB;;;;;;oBAMrB,iCAAiC;;;oBAGjC,mCAAmC;;;;wBAI/B,0BAA0B;;;;UAIxC,YAAY;kBACJ,4BAA4B;oBAC1B,4BAA4B;;UAEtC,YAAY;kBACJ,iCAAiC;oBAC/B,iCAAiC;;UAE3C,YAAY;kBACJ,mCAAmC;oBACjC,mCAAmC;;UAE7C,YAAY;kBACJ,8BAA8B;oBAC5B,0BAA0B;;;;;;;wBAOtB,uBAAuB;2BACpB,cAAc;kCACP,aAAa;;;UAGrC,YAAY;wBACE,8BAA8B;;;UAG5C,YAAY;kBACJ,mCAAmC;;UAE3C,YAAY;kBACJ,qCAAqC;;;wBAG/B,4BAA4B;;;wBAG5B,8BAA8B;;;;kBAIpC,8BAA8B;;UAEtC,YAAY;kBACJ,8BAA8B;;;;;;;;oBAQ5B,sBAAsB;eAC3B,gBAAgB,UAAU,sBAAsB;kBAC7C,OAAO,eAAe,iBAAiB;;CAExD,CAAC,aAAa,CACb,8BAA8B,CAAC,GAAG,CAAA;;;;YAIxB,YAAY;YACZ,YAAY;YACZ,YAAY;;;;;;;;;YASZ,YAAY;YACZ,YAAY;YACZ,YAAY;;;GAGrB,CAAC,CACH,CAAC"}
package/dist/esm/switch/switch.template.js CHANGED
@@ -1,25 +1,15 @@
1
- import { html, slotted } from '@microsoft/fast-element';
1
+ import { html } from '@microsoft/fast-element';
2
2
  import { staticallyCompose } from '../utils/index.js';
3
3
  export function switchTemplate(options = {}) {
4
4
  return html `
5
5
  <template
6
- role="switch"
7
- aria-checked="${x => x.checked}"
8
- aria-disabled="${x => x.disabled}"
9
- aria-readonly="${x => x.readOnly}"
10
- tabindex="${x => (x.disabled ? null : 0)}"
11
- @keypress="${(x, c) => x.keypressHandler(c.event)}"
6
+ tabindex="${x => (!x.disabled ? 0 : void 0)}"
12
7
  @click="${(x, c) => x.clickHandler(c.event)}"
8
+ @input="${(x, c) => x.inputHandler(c.event)}"
9
+ @keydown="${(x, c) => x.keydownHandler(c.event)}"
10
+ @keyup="${(x, c) => x.keyupHandler(c.event)}"
13
11
  >
14
- <label
15
- part="label"
16
- class="${x => (x.defaultSlottedNodes && x.defaultSlottedNodes.length ? 'label' : 'label label__hidden')}"
17
- >
18
- <slot ${slotted('defaultSlottedNodes')}></slot>
19
- </label>
20
- <div part="switch" class="switch">
21
- <slot name="switch">${staticallyCompose(options.switch)}</slot>
22
- </div>
12
+ <slot name="switch">${staticallyCompose(options.switch)}</slot>
23
13
  </template>
24
14
  `;
25
15
  }