@fluentui/web-components 3.0.0-beta.10 → 3.0.0-beta.12

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 (109) hide show
  1. package/CHANGELOG.md +20 -2
  2. package/dist/dts/button/button.d.ts +173 -90
  3. package/dist/dts/button/button.definition.d.ts +3 -1
  4. package/dist/dts/button/button.options.d.ts +16 -1
  5. package/dist/dts/button/button.styles.d.ts +5 -0
  6. package/dist/dts/button/button.template.d.ts +7 -1
  7. package/dist/dts/form-associated/form-associated.d.ts +0 -74
  8. package/dist/dts/index.d.ts +3 -0
  9. package/dist/dts/toggle-button/toggle-button.d.ts +29 -26
  10. package/dist/dts/toggle-button/toggle-button.styles.d.ts +7 -0
  11. package/dist/dts/utils/behaviors/match-media-stylesheet-behavior.d.ts +124 -0
  12. package/dist/dts/utils/display.d.ts +17 -0
  13. package/dist/dts/utils/index.d.ts +2 -0
  14. package/dist/esm/accordion/accordion.styles.js +1 -1
  15. package/dist/esm/accordion/accordion.styles.js.map +1 -1
  16. package/dist/esm/accordion-item/accordion-item.styles.js +1 -1
  17. package/dist/esm/accordion-item/accordion-item.styles.js.map +1 -1
  18. package/dist/esm/anchor-button/anchor-button.styles.js +254 -3
  19. package/dist/esm/anchor-button/anchor-button.styles.js.map +1 -1
  20. package/dist/esm/avatar/avatar.styles.js +1 -1
  21. package/dist/esm/avatar/avatar.styles.js.map +1 -1
  22. package/dist/esm/button/button.definition.js +3 -4
  23. package/dist/esm/button/button.definition.js.map +1 -1
  24. package/dist/esm/button/button.js +233 -126
  25. package/dist/esm/button/button.js.map +1 -1
  26. package/dist/esm/button/button.options.js +10 -0
  27. package/dist/esm/button/button.options.js.map +1 -1
  28. package/dist/esm/button/button.styles.js +52 -55
  29. package/dist/esm/button/button.styles.js.map +1 -1
  30. package/dist/esm/button/button.template.js +13 -39
  31. package/dist/esm/button/button.template.js.map +1 -1
  32. package/dist/esm/checkbox/checkbox.styles.js +1 -1
  33. package/dist/esm/checkbox/checkbox.styles.js.map +1 -1
  34. package/dist/esm/compound-button/compound-button.definition.js +0 -3
  35. package/dist/esm/compound-button/compound-button.definition.js.map +1 -1
  36. package/dist/esm/compound-button/compound-button.styles.js +7 -7
  37. package/dist/esm/compound-button/compound-button.template.js +3 -39
  38. package/dist/esm/compound-button/compound-button.template.js.map +1 -1
  39. package/dist/esm/dialog/dialog.styles.js +1 -1
  40. package/dist/esm/dialog/dialog.styles.js.map +1 -1
  41. package/dist/esm/divider/divider.styles.js +1 -1
  42. package/dist/esm/divider/divider.styles.js.map +1 -1
  43. package/dist/esm/form-associated/form-associated.js.map +1 -1
  44. package/dist/esm/index.js +3 -0
  45. package/dist/esm/index.js.map +1 -1
  46. package/dist/esm/label/label.styles.js +1 -1
  47. package/dist/esm/label/label.styles.js.map +1 -1
  48. package/dist/esm/menu-button/menu-button.definition.js +0 -3
  49. package/dist/esm/menu-button/menu-button.definition.js.map +1 -1
  50. package/dist/esm/menu-button/menu-button.template.js +5 -1
  51. package/dist/esm/menu-button/menu-button.template.js.map +1 -1
  52. package/dist/esm/menu-item/menu-item.styles.js +1 -1
  53. package/dist/esm/menu-item/menu-item.styles.js.map +1 -1
  54. package/dist/esm/menu-list/menu-list.styles.js +1 -1
  55. package/dist/esm/menu-list/menu-list.styles.js.map +1 -1
  56. package/dist/esm/progress-bar/progress-bar.styles.js +1 -1
  57. package/dist/esm/progress-bar/progress-bar.styles.js.map +1 -1
  58. package/dist/esm/radio/radio.styles.js +1 -1
  59. package/dist/esm/radio/radio.styles.js.map +1 -1
  60. package/dist/esm/radio-group/radio-group.styles.js +1 -1
  61. package/dist/esm/radio-group/radio-group.styles.js.map +1 -1
  62. package/dist/esm/slider/slider.styles.js +1 -1
  63. package/dist/esm/slider/slider.styles.js.map +1 -1
  64. package/dist/esm/spinner/spinner.styles.js +1 -1
  65. package/dist/esm/spinner/spinner.styles.js.map +1 -1
  66. package/dist/esm/styles/partials/badge.partials.js +1 -1
  67. package/dist/esm/styles/partials/badge.partials.js.map +1 -1
  68. package/dist/esm/switch/switch.styles.js +1 -1
  69. package/dist/esm/switch/switch.styles.js.map +1 -1
  70. package/dist/esm/tab/tab.styles.js +1 -1
  71. package/dist/esm/tab/tab.styles.js.map +1 -1
  72. package/dist/esm/tab-panel/tab-panel.styles.js +1 -1
  73. package/dist/esm/tab-panel/tab-panel.styles.js.map +1 -1
  74. package/dist/esm/tabs/tabs.styles.js +1 -1
  75. package/dist/esm/tabs/tabs.styles.js.map +1 -1
  76. package/dist/esm/text/text.styles.js +1 -1
  77. package/dist/esm/text/text.styles.js.map +1 -1
  78. package/dist/esm/text-input/text-input.styles.js +1 -1
  79. package/dist/esm/text-input/text-input.styles.js.map +1 -1
  80. package/dist/esm/toggle-button/toggle-button.definition.js +0 -3
  81. package/dist/esm/toggle-button/toggle-button.definition.js.map +1 -1
  82. package/dist/esm/toggle-button/toggle-button.js +42 -85
  83. package/dist/esm/toggle-button/toggle-button.js.map +1 -1
  84. package/dist/esm/toggle-button/toggle-button.styles.js +31 -26
  85. package/dist/esm/toggle-button/toggle-button.styles.js.map +1 -1
  86. package/dist/esm/utils/behaviors/match-media-stylesheet-behavior.js +142 -0
  87. package/dist/esm/utils/behaviors/match-media-stylesheet-behavior.js.map +1 -0
  88. package/dist/esm/utils/display.js +15 -0
  89. package/dist/esm/utils/display.js.map +1 -0
  90. package/dist/esm/utils/index.js +2 -0
  91. package/dist/esm/utils/index.js.map +1 -1
  92. package/dist/fluent-web-components.api.json +1213 -771
  93. package/dist/storybook/{284.0946b1fb.iframe.bundle.js → 289.703b1698.iframe.bundle.js} +2 -2
  94. package/dist/storybook/{284.0946b1fb.iframe.bundle.js.LICENSE.txt → 289.703b1698.iframe.bundle.js.LICENSE.txt} +1 -1
  95. package/dist/storybook/iframe.html +1 -1
  96. package/dist/storybook/main.d55b693e.iframe.bundle.js +2 -0
  97. package/dist/storybook/project.json +1 -1
  98. package/dist/web-components.d.ts +407 -219
  99. package/dist/web-components.js +807 -671
  100. package/dist/web-components.min.js +140 -139
  101. package/docs/api-report.md +107 -77
  102. package/package.json +4 -3
  103. package/playwright.config.ts +2 -3
  104. package/tensile.config.js +0 -2
  105. package/dist/dts/button/button.form-associated.d.ts +0 -14
  106. package/dist/esm/button/button.form-associated.js +0 -14
  107. package/dist/esm/button/button.form-associated.js.map +0 -1
  108. package/dist/storybook/main.b9de79ac.iframe.bundle.js +0 -2
  109. /package/dist/storybook/{main.b9de79ac.iframe.bundle.js.LICENSE.txt → main.d55b693e.iframe.bundle.js.LICENSE.txt} +0 -0
@@ -0,0 +1,124 @@
1
+ import type { ElementStyles, HostBehavior, HostController } from '@microsoft/fast-element';
2
+ /**
3
+ * An event listener fired by a {@link https://developer.mozilla.org/en-US/docs/Web/API/MediaQueryList | MediaQueryList }.
4
+ * @public
5
+ */
6
+ export declare type MediaQueryListListener = (this: MediaQueryList, ev?: MediaQueryListEvent) => void;
7
+ /**
8
+ * An abstract behavior to react to media queries. Implementations should implement
9
+ * the `constructListener` method to perform some action based on media query changes.
10
+ *
11
+ * @public
12
+ */
13
+ export declare abstract class MatchMediaBehavior implements HostBehavior {
14
+ /**
15
+ * The behavior needs to operate on element instances but elements might share a behavior instance.
16
+ * To ensure proper attachment / detachment per instance, we construct a listener for
17
+ * each bind invocation and cache the listeners by element reference.
18
+ */
19
+ private listenerCache;
20
+ /**
21
+ * The media query that the behavior operates on.
22
+ */
23
+ readonly query: MediaQueryList;
24
+ /**
25
+ *
26
+ * @param query - The media query to operate from.
27
+ */
28
+ constructor(query: MediaQueryList);
29
+ /**
30
+ * Constructs a function that will be invoked with the MediaQueryList context
31
+ * @param controller - The host controller orchestrating this behavior.
32
+ */
33
+ protected abstract constructListener(controller: HostController): MediaQueryListListener;
34
+ /**
35
+ * Binds the behavior to the element.
36
+ * @param controller - The host controller orchestrating this behavior.
37
+ */
38
+ connectedCallback(controller: HostController): void;
39
+ /**
40
+ * Unbinds the behavior from the element.
41
+ * @param controller - The host controller orchestrating this behavior.
42
+ */
43
+ disconnectedCallback(controller: HostController): void;
44
+ }
45
+ /**
46
+ * A behavior to add or remove a stylesheet from an element based on a media query. The behavior ensures that
47
+ * styles are applied while the a query matches the environment and that styles are not applied if the query does
48
+ * not match the environment.
49
+ *
50
+ * @public
51
+ */
52
+ export declare class MatchMediaStyleSheetBehavior extends MatchMediaBehavior {
53
+ /**
54
+ * The media query that the behavior operates on.
55
+ */
56
+ readonly query: MediaQueryList;
57
+ /**
58
+ * The styles object to be managed by the behavior.
59
+ */
60
+ readonly styles: ElementStyles;
61
+ /**
62
+ * Constructs a {@link MatchMediaStyleSheetBehavior} instance.
63
+ * @param query - The media query to operate from.
64
+ * @param styles - The styles to coordinate with the query.
65
+ */
66
+ constructor(query: MediaQueryList, styles: ElementStyles);
67
+ /**
68
+ * Defines a function to construct {@link MatchMediaStyleSheetBehavior | MatchMediaStyleSheetBehaviors} for
69
+ * a provided query.
70
+ * @param query - The media query to operate from.
71
+ *
72
+ * @public
73
+ * @example
74
+ *
75
+ * ```ts
76
+ * import { css } from "@microsoft/fast-element";
77
+ * import { MatchMediaStyleSheetBehavior } from "@fluentui/web-components";
78
+ *
79
+ * const landscapeBehavior = MatchMediaStyleSheetBehavior.with(
80
+ * window.matchMedia("(orientation: landscape)")
81
+ * );
82
+ *
83
+ * const styles = css`
84
+ * :host {
85
+ * width: 200px;
86
+ * height: 400px;
87
+ * }
88
+ * `
89
+ * .withBehaviors(landscapeBehavior(css`
90
+ * :host {
91
+ * width: 400px;
92
+ * height: 200px;
93
+ * }
94
+ * `))
95
+ * ```
96
+ */
97
+ static with(query: MediaQueryList): (styles: ElementStyles) => MatchMediaStyleSheetBehavior;
98
+ /**
99
+ * Constructs a match-media listener for a provided element.
100
+ * @param source - the element for which to attach or detach styles.
101
+ */
102
+ protected constructListener(controller: HostController): MediaQueryListListener;
103
+ /**
104
+ * Unbinds the behavior from the element.
105
+ * @param controller - The host controller orchestrating this behavior.
106
+ * @internal
107
+ */
108
+ removedCallback(controller: HostController<any>): void;
109
+ }
110
+ /**
111
+ * This can be used to construct a behavior to apply a forced-colors only stylesheet.
112
+ * @public
113
+ */
114
+ export declare const forcedColorsStylesheetBehavior: (styles: ElementStyles) => MatchMediaStyleSheetBehavior;
115
+ /**
116
+ * This can be used to construct a behavior to apply a prefers color scheme: dark only stylesheet.
117
+ * @public
118
+ */
119
+ export declare const darkModeStylesheetBehavior: (styles: ElementStyles) => MatchMediaStyleSheetBehavior;
120
+ /**
121
+ * This can be used to construct a behavior to apply a prefers color scheme: light only stylesheet.
122
+ * @public
123
+ */
124
+ export declare const lightModeStylesheetBehavior: (styles: ElementStyles) => MatchMediaStyleSheetBehavior;
@@ -0,0 +1,17 @@
1
+ /**
2
+ * Define all possible CSS display values.
3
+ * @public
4
+ */
5
+ export declare type CSSDisplayPropertyValue = 'block' | 'contents' | 'flex' | 'grid' | 'inherit' | 'initial' | 'inline' | 'inline-block' | 'inline-flex' | 'inline-grid' | 'inline-table' | 'list-item' | 'none' | 'run-in' | 'table' | 'table-caption' | 'table-cell' | 'table-column' | 'table-column-group' | 'table-footer-group' | 'table-header-group' | 'table-row' | 'table-row-group';
6
+ /**
7
+ * A CSS fragment to set `display: none;` when the host is hidden using the [hidden] attribute.
8
+ * @public
9
+ */
10
+ export declare const hidden = ":host([hidden]){display:none}";
11
+ /**
12
+ * Applies a CSS display property.
13
+ * Also adds CSS rules to not display the element when the [hidden] attribute is applied to the element.
14
+ * @param display - The CSS display property value
15
+ * @public
16
+ */
17
+ export declare function display(displayValue: CSSDisplayPropertyValue): string;
@@ -2,3 +2,5 @@ export * from './direction.js';
2
2
  export * from './typings.js';
3
3
  export * from './template-helpers.js';
4
4
  export * from './whitespace-filter.js';
5
+ export * from './display.js';
6
+ export * from './behaviors/match-media-stylesheet-behavior.js';
@@ -1,5 +1,5 @@
1
1
  import { css } from '@microsoft/fast-element';
2
- import { display } from '@microsoft/fast-foundation/utilities.js';
2
+ import { display } from '../utils/index.js';
3
3
  export const styles = css `
4
4
  ${display('flex')}
5
5
 
@@ -1 +1 @@
1
- {"version":3,"file":"accordion.styles.js","sourceRoot":"","sources":["../../../src/accordion/accordion.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,MAAM,yCAAyC,CAAC;AAElE,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;IACrB,OAAO,CAAC,MAAM,CAAC;;;;;;;CAOlB,CAAC"}
1
+ {"version":3,"file":"accordion.styles.js","sourceRoot":"","sources":["../../../src/accordion/accordion.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,MAAM,mBAAmB,CAAC;AAE5C,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;IACrB,OAAO,CAAC,MAAM,CAAC;;;;;;;CAOlB,CAAC"}
@@ -1,5 +1,5 @@
1
1
  import { css } from '@microsoft/fast-element';
2
- import { display } from '@microsoft/fast-foundation/utilities.js';
2
+ import { display } from '../utils/index.js';
3
3
  import { borderRadiusMedium, borderRadiusSmall, colorNeutralForeground1, colorNeutralForegroundDisabled, colorStrokeFocus1, colorStrokeFocus2, colorTransparentBackground, fontFamilyBase, fontSizeBase200, fontSizeBase300, fontSizeBase400, fontSizeBase500, fontWeightRegular, lineHeightBase200, lineHeightBase300, lineHeightBase400, lineHeightBase500, spacingHorizontalM, spacingHorizontalMNudge, spacingHorizontalS, } from '../theme/design-tokens.js';
4
4
  export const styles = css `
5
5
  ${display('block')}
@@ -1 +1 @@
1
- {"version":3,"file":"accordion-item.styles.js","sourceRoot":"","sources":["../../../src/accordion-item/accordion-item.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,MAAM,yCAAyC,CAAC;AAClE,OAAO,EACL,kBAAkB,EAClB,iBAAiB,EACjB,uBAAuB,EACvB,8BAA8B,EAC9B,iBAAiB,EACjB,iBAAiB,EACjB,0BAA0B,EAC1B,cAAc,EACd,eAAe,EACf,eAAe,EACf,eAAe,EACf,eAAe,EACf,iBAAiB,EACjB,iBAAiB,EACjB,iBAAiB,EACjB,iBAAiB,EACjB,iBAAiB,EACjB,kBAAkB,EAClB,uBAAuB,EACvB,kBAAkB,GACnB,MAAM,2BAA2B,CAAC;AAEnC,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;IACrB,OAAO,CAAC,OAAO,CAAC;;;;;;;;;;;;sBAYE,kBAAkB,IAAI,uBAAuB;qBAC9C,kBAAkB;mBACpB,cAAc;iBAChB,eAAe;mBACb,iBAAiB;mBACjB,iBAAiB;;;;;;;;;;;;;;;;;;;aAmBvB,uBAAuB;kBAClB,0BAA0B;mBACzB,iBAAiB;;;;;;;;;;;;;qBAaf,iBAAiB;;;;;;;;;;qBAUjB,kBAAkB;;;;;;gBAMvB,kBAAkB;;;;;;;qBAOb,kBAAkB;;;;;;;;;;qBAUlB,iBAAiB;;wBAEd,iBAAiB;kCACP,iBAAiB;;;;;;aAMtC,8BAA8B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iBAgC1B,eAAe;mBACb,iBAAiB;;;;iBAInB,eAAe;mBACb,iBAAiB;;;;iBAInB,eAAe;mBACb,iBAAiB;;;;iBAInB,eAAe;mBACb,iBAAiB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAmDnC,CAAC"}
1
+ {"version":3,"file":"accordion-item.styles.js","sourceRoot":"","sources":["../../../src/accordion-item/accordion-item.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,MAAM,mBAAmB,CAAC;AAC5C,OAAO,EACL,kBAAkB,EAClB,iBAAiB,EACjB,uBAAuB,EACvB,8BAA8B,EAC9B,iBAAiB,EACjB,iBAAiB,EACjB,0BAA0B,EAC1B,cAAc,EACd,eAAe,EACf,eAAe,EACf,eAAe,EACf,eAAe,EACf,iBAAiB,EACjB,iBAAiB,EACjB,iBAAiB,EACjB,iBAAiB,EACjB,iBAAiB,EACjB,kBAAkB,EAClB,uBAAuB,EACvB,kBAAkB,GACnB,MAAM,2BAA2B,CAAC;AAEnC,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;IACrB,OAAO,CAAC,OAAO,CAAC;;;;;;;;;;;;sBAYE,kBAAkB,IAAI,uBAAuB;qBAC9C,kBAAkB;mBACpB,cAAc;iBAChB,eAAe;mBACb,iBAAiB;mBACjB,iBAAiB;;;;;;;;;;;;;;;;;;;aAmBvB,uBAAuB;kBAClB,0BAA0B;mBACzB,iBAAiB;;;;;;;;;;;;;qBAaf,iBAAiB;;;;;;;;;;qBAUjB,kBAAkB;;;;;;gBAMvB,kBAAkB;;;;;;;qBAOb,kBAAkB;;;;;;;;;;qBAUlB,iBAAiB;;wBAEd,iBAAiB;kCACP,iBAAiB;;;;;;aAMtC,8BAA8B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iBAgC1B,eAAe;mBACb,iBAAiB;;;;iBAInB,eAAe;mBACb,iBAAiB;;;;iBAInB,eAAe;mBACb,iBAAiB;;;;iBAInB,eAAe;mBACb,iBAAiB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAmDnC,CAAC"}
@@ -1,11 +1,262 @@
1
1
  import { css } from '@microsoft/fast-element';
2
- import { styles as ButtonStyles } from '../button/button.styles.js';
2
+ import { borderRadiusCircular, borderRadiusLarge, borderRadiusMedium, borderRadiusNone, borderRadiusSmall, colorBrandBackground, colorBrandBackgroundHover, colorBrandBackgroundPressed, colorNeutralBackground1, colorNeutralBackground1Hover, colorNeutralBackground1Pressed, colorNeutralBackgroundDisabled, colorNeutralForeground1, colorNeutralForeground1Hover, colorNeutralForeground1Pressed, colorNeutralForeground2, colorNeutralForeground2BrandHover, colorNeutralForeground2BrandPressed, colorNeutralForeground2Hover, colorNeutralForeground2Pressed, colorNeutralForegroundDisabled, colorNeutralForegroundOnBrand, colorNeutralStroke1, colorNeutralStroke1Hover, colorNeutralStroke1Pressed, colorNeutralStrokeDisabled, colorStrokeFocus2, colorSubtleBackground, colorSubtleBackgroundHover, colorSubtleBackgroundPressed, colorTransparentBackground, colorTransparentBackgroundHover, colorTransparentBackgroundPressed, colorTransparentStroke, curveEasyEase, durationFaster, fontFamilyBase, fontSizeBase200, fontSizeBase300, fontSizeBase400, fontWeightRegular, fontWeightSemibold, lineHeightBase200, lineHeightBase300, lineHeightBase400, shadow2, shadow4, spacingHorizontalL, spacingHorizontalM, spacingHorizontalS, spacingHorizontalSNudge, spacingHorizontalXS, strokeWidthThick, strokeWidthThin, } from '../theme/design-tokens.js';
3
+ import { forcedColorsStylesheetBehavior } from '../utils/behaviors/match-media-stylesheet-behavior.js';
4
+ import { display } from '../utils/display.js';
3
5
  // Need to support icon hover styles
4
6
  export const styles = css `
5
- ${ButtonStyles}
7
+ ${display('inline-flex')}
8
+
9
+ :host {
10
+ --icon-spacing: ${spacingHorizontalSNudge};
11
+ contain: layout style;
12
+ vertical-align: middle;
13
+ }
14
+
15
+ :host .control {
16
+ display: inline-flex;
17
+ align-items: center;
18
+ box-sizing: border-box;
19
+ justify-content: center;
20
+ text-decoration-line: none;
21
+ margin: 0;
22
+ min-height: 32px;
23
+ outline-style: none;
24
+ background-color: ${colorNeutralBackground1};
25
+ color: ${colorNeutralForeground1};
26
+ border: ${strokeWidthThin} solid ${colorNeutralStroke1};
27
+ padding: 0 ${spacingHorizontalM};
28
+ min-width: 96px;
29
+ border-radius: ${borderRadiusMedium};
30
+ font-size: ${fontSizeBase300};
31
+ font-family: ${fontFamilyBase};
32
+ font-weight: ${fontWeightSemibold};
33
+ line-height: ${lineHeightBase300};
34
+ transition-duration: ${durationFaster};
35
+ transition-property: background, border, color;
36
+ transition-timing-function: ${curveEasyEase};
37
+ cursor: pointer;
38
+ }
6
39
 
7
40
  .content {
41
+ display: inherit;
8
42
  text-align: center;
9
43
  }
10
- `;
44
+
45
+ :host(:hover) .control {
46
+ background-color: ${colorNeutralBackground1Hover};
47
+ color: ${colorNeutralForeground1Hover};
48
+ border-color: ${colorNeutralStroke1Hover};
49
+ }
50
+
51
+ :host(:hover:active) .control {
52
+ background-color: ${colorNeutralBackground1Pressed};
53
+ border-color: ${colorNeutralStroke1Pressed};
54
+ color: ${colorNeutralForeground1Pressed};
55
+ outline-style: none;
56
+ }
57
+
58
+ :host .control:focus-visible {
59
+ border-color: ${colorTransparentStroke};
60
+ outline: ${strokeWidthThick}) solid ${colorTransparentStroke};
61
+ box-shadow: ${shadow4}, 0 0 0 2px ${colorStrokeFocus2};
62
+ }
63
+
64
+ @media screen and (prefers-reduced-motion: reduce) {
65
+ transition-duration: 0.01ms;
66
+ }
67
+
68
+ ::slotted(svg) {
69
+ font-size: 20px;
70
+ height: 20px;
71
+ width: 20px;
72
+ fill: currentColor;
73
+ }
74
+
75
+ [slot='start'],
76
+ ::slotted([slot='start']) {
77
+ margin-inline-end: var(--icon-spacing);
78
+ }
79
+
80
+ [slot='end'],
81
+ ::slotted([slot='end']) {
82
+ margin-inline-start: var(--icon-spacing);
83
+ }
84
+
85
+ :host([icon-only]) .control {
86
+ min-width: 32px;
87
+ max-width: 32px;
88
+ }
89
+
90
+ :host([size='small']) {
91
+ --icon-spacing: ${spacingHorizontalXS};
92
+ }
93
+
94
+ :host([size='small']) .control {
95
+ min-height: 24px;
96
+ min-width: 64px;
97
+ padding: 0 ${spacingHorizontalS};
98
+ border-radius: ${borderRadiusSmall};
99
+ font-size: ${fontSizeBase200};
100
+ line-height: ${lineHeightBase200};
101
+ font-weight: ${fontWeightRegular};
102
+ }
103
+
104
+ :host([size='small'][icon-only]) .control {
105
+ min-width: 24px;
106
+ max-width: 24px;
107
+ }
108
+
109
+ :host([size='large']) .control {
110
+ min-height: 40px;
111
+ border-radius: ${borderRadiusLarge};
112
+ padding: 0 ${spacingHorizontalL};
113
+ font-size: ${fontSizeBase400};
114
+ line-height: ${lineHeightBase400};
115
+ }
116
+
117
+ :host([size='large'][icon-only]) .control {
118
+ min-width: 40px;
119
+ max-width: 40px;
120
+ }
121
+
122
+ :host([size='large']) ::slotted(svg) {
123
+ font-size: 24px;
124
+ height: 24px;
125
+ width: 24px;
126
+ }
127
+
128
+ :host([shape='circular']) .control,
129
+ :host([shape='circular']) .control:focus-visible {
130
+ border-radius: ${borderRadiusCircular};
131
+ }
132
+
133
+ :host([shape='square']) .control,
134
+ :host([shape='square']) .control:focus-visible {
135
+ border-radius: ${borderRadiusNone};
136
+ }
137
+
138
+ :host([appearance='primary']) .control {
139
+ background-color: ${colorBrandBackground};
140
+ color: ${colorNeutralForegroundOnBrand};
141
+ border-color: transparent;
142
+ }
143
+
144
+ :host([appearance='primary']:hover) .control {
145
+ background-color: ${colorBrandBackgroundHover};
146
+ }
147
+
148
+ :host([appearance='primary']:hover) .control,
149
+ :host([appearance='primary']:hover:active) .control {
150
+ border-color: transparent;
151
+ color: ${colorNeutralForegroundOnBrand};
152
+ }
153
+
154
+ :host([appearance='primary']:hover:active) .control {
155
+ background-color: ${colorBrandBackgroundPressed};
156
+ }
157
+
158
+ :host([appearance='primary']) .control:focus-visible {
159
+ border-color: ${colorNeutralForegroundOnBrand};
160
+ box-shadow: ${shadow2}, 0 0 0 2px ${colorStrokeFocus2};
161
+ }
162
+
163
+ :host(is:([disabled][appearance='primary'], [disabled-focusabale][appearance="primary"])) .control,
164
+ :host(is:([disabled][appearance='primary'], [disabled-focusabale][appearance="primary"]):hover) .control,
165
+ :host(is:([disabled][appearance='primary'], [disabled-focusabale][appearance="primary"]):hover:active) .control {
166
+ border-color: transparent;
167
+ }
168
+
169
+ :host([appearance='outline']) .control {
170
+ background-color: ${colorTransparentBackground};
171
+ }
172
+
173
+ :host([appearance='outline']:hover) .control {
174
+ background-color: ${colorTransparentBackgroundHover};
175
+ }
176
+
177
+ :host([appearance='outline']:hover:active) .control {
178
+ background-color: ${colorTransparentBackgroundPressed};
179
+ }
180
+
181
+ :host(is:([disabled][appearance='outline'], [disabled-focusabale][appearance="outline"])) .control,
182
+ :host(is:([disabled][appearance='outline'], [disabled-focusabale][appearance="outline"]):hover) .control,
183
+ :host(is:([disabled][appearance='outline'], [disabled-focusabale][appearance="outline"]):hover:active) .control {
184
+ background-color: ${colorTransparentBackground};
185
+ }
186
+
187
+ :host([appearance='subtle']) .control {
188
+ background-color: ${colorSubtleBackground};
189
+ color: ${colorNeutralForeground2};
190
+ border-color: transparent;
191
+ }
192
+
193
+ :host([appearance='subtle']:hover) .control {
194
+ background-color: ${colorSubtleBackgroundHover};
195
+ color: ${colorNeutralForeground2Hover};
196
+ border-color: transparent;
197
+ }
198
+
199
+ :host([appearance='subtle']:hover:active) .control {
200
+ background-color: ${colorSubtleBackgroundPressed};
201
+ color: ${colorNeutralForeground2Pressed};
202
+ border-color: transparent;
203
+ }
204
+
205
+ :host(is:([disabled][appearance='subtle'], [disabled-focusabale][appearance="subtle"])) .control,
206
+ :host(is:([disabled][appearance='subtle'], [disabled-focusabale][appearance="subtle"]):hover) .control,
207
+ :host(is:([disabled][appearance='subtle'], [disabled-focusabale][appearance="subtle"]):hover:active) .control {
208
+ background-color: ${colorTransparentBackground};
209
+ border-color: transparent;
210
+ }
211
+
212
+ :host([appearance='subtle']:hover) ::slotted(svg) {
213
+ fill: ${colorNeutralForeground2BrandHover};
214
+ }
215
+
216
+ :host([appearance='subtle']:hover:active) ::slotted(svg) {
217
+ fill: ${colorNeutralForeground2BrandPressed};
218
+ }
219
+
220
+ :host([appearance='transparent']) .control {
221
+ background-color: ${colorTransparentBackground};
222
+ color: ${colorNeutralForeground2};
223
+ }
224
+
225
+ :host([appearance='transparent']:hover) .control {
226
+ background-color: ${colorTransparentBackgroundHover};
227
+ color: ${colorNeutralForeground2BrandHover};
228
+ }
229
+
230
+ :host([appearance='transparent']:hover:active) .control {
231
+ background-color: ${colorTransparentBackgroundPressed};
232
+ color: ${colorNeutralForeground2BrandPressed};
233
+ }
234
+
235
+ :host([appearance='transparent']) .control,
236
+ :host([appearance='transparent']:hover) .control,
237
+ :host([appearance='transparent']:hover:active) .control {
238
+ border-color: transparent;
239
+ }
240
+
241
+ :host(is:([disabled][appearance='transparent'], [disabled-focusabale][appearance="transparent"])) .control,
242
+ :host(is:([disabled][appearance='transparent'], [disabled-focusabale][appearance="transparent"]):hover) .control,
243
+ :host(is:([disabled][appearance='transparent'], [disabled-focusabale][appearance="transparent"]):hover:active) .control {
244
+ border-color: transparent;
245
+ background-color: ${colorTransparentBackground};
246
+ }
247
+
248
+ :host(:is([disabled], [disabled-focusable], [appearance][disabled], [appearance][disabled-focusable])) .control,
249
+ :host(:is([disabled], [disabled-focusable], [appearance][disabled], [appearance][disabled-focusable]):hover) .control,
250
+ :host(:is([disabled], [disabled-focusable], [appearance][disabled], [appearance][disabled-focusable]):hover:active)
251
+ .control {
252
+ background-color: ${colorNeutralBackgroundDisabled};
253
+ border-color: ${colorNeutralStrokeDisabled};
254
+ color: ${colorNeutralForegroundDisabled};
255
+ cursor: not-allowed;
256
+ }
257
+ `.withBehaviors(forcedColorsStylesheetBehavior(css `
258
+ :host([appearance='transparent']:hover) .control {
259
+ border-color: Highlight;
260
+ }
261
+ `));
11
262
  //# sourceMappingURL=anchor-button.styles.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"anchor-button.styles.js","sourceRoot":"","sources":["../../../src/anchor-button/anchor-button.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,MAAM,IAAI,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAEpE,oCAAoC;AACpC,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;IACrB,YAAY;;;;;CAKf,CAAC"}
1
+ {"version":3,"file":"anchor-button.styles.js","sourceRoot":"","sources":["../../../src/anchor-button/anchor-button.styles.ts"],"names":[],"mappings":"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"}
@@ -1,5 +1,5 @@
1
1
  import { css } from '@microsoft/fast-element';
2
- import { display } from '@microsoft/fast-foundation/utilities.js';
2
+ import { display } from '../utils/index.js';
3
3
  import { borderRadiusCircular, borderRadiusLarge, borderRadiusMedium, borderRadiusSmall, borderRadiusXLarge, colorBrandBackgroundStatic, colorNeutralBackground1, colorNeutralBackground6, colorNeutralForeground3, colorNeutralForegroundStaticInverted, colorPaletteAnchorBackground2, colorPaletteAnchorForeground2, colorPaletteBeigeBackground2, colorPaletteBeigeForeground2, colorPaletteBlueBackground2, colorPaletteBlueForeground2, colorPaletteBrassBackground2, colorPaletteBrassForeground2, colorPaletteBrownBackground2, colorPaletteBrownForeground2, colorPaletteCornflowerBackground2, colorPaletteCornflowerForeground2, colorPaletteCranberryBackground2, colorPaletteCranberryForeground2, colorPaletteDarkGreenBackground2, colorPaletteDarkGreenForeground2, colorPaletteDarkRedBackground2, colorPaletteDarkRedForeground2, colorPaletteForestBackground2, colorPaletteForestForeground2, colorPaletteGoldBackground2, colorPaletteGoldForeground2, colorPaletteGrapeBackground2, colorPaletteGrapeForeground2, colorPaletteLavenderBackground2, colorPaletteLavenderForeground2, colorPaletteLightTealBackground2, colorPaletteLightTealForeground2, colorPaletteLilacBackground2, colorPaletteLilacForeground2, colorPaletteMagentaBackground2, colorPaletteMagentaForeground2, colorPaletteMarigoldBackground2, colorPaletteMarigoldForeground2, colorPaletteMinkBackground2, colorPaletteMinkForeground2, colorPaletteNavyBackground2, colorPaletteNavyForeground2, colorPalettePeachBackground2, colorPalettePeachForeground2, colorPalettePinkBackground2, colorPalettePinkForeground2, colorPalettePlatinumBackground2, colorPalettePlatinumForeground2, colorPalettePlumBackground2, colorPalettePlumForeground2, colorPalettePumpkinBackground2, colorPalettePumpkinForeground2, colorPalettePurpleBackground2, colorPalettePurpleForeground2, colorPaletteRedBackground2, colorPaletteRedForeground2, colorPaletteRoyalBlueBackground2, colorPaletteRoyalBlueForeground2, colorPaletteSeafoamBackground2, colorPaletteSeafoamForeground2, colorPaletteSteelBackground2, colorPaletteSteelForeground2, colorPaletteTealBackground2, colorPaletteTealForeground2, curveAccelerateMax, curveAccelerateMid, curveAccelerateMin, curveDecelerateMax, curveDecelerateMid, curveDecelerateMin, curveEasyEase, curveEasyEaseMax, curveLinear, durationFaster, durationSlower, durationUltraSlow, fontFamilyBase, fontSizeBase100, fontSizeBase200, fontSizeBase300, fontSizeBase400, fontSizeBase500, fontSizeBase600, fontWeightRegular, fontWeightSemibold, shadow16, shadow28, shadow4, shadow8, strokeWidthThick, strokeWidthThicker, strokeWidthThickest, strokeWidthThin, } from '../theme/design-tokens.js';
4
4
  const animations = {
5
5
  fastOutSlowInMax: curveDecelerateMax,
@@ -1 +1 @@
1
- {"version":3,"file":"avatar.styles.js","sourceRoot":"","sources":["../../../src/avatar/avatar.styles.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"avatar.styles.js","sourceRoot":"","sources":["../../../src/avatar/avatar.styles.ts"],"names":[],"mappings":"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"}
@@ -3,16 +3,15 @@ import { Button } from './button.js';
3
3
  import { styles } from './button.styles.js';
4
4
  import { template } from './button.template.js';
5
5
  /**
6
+ * The definition for the Fluent Button component.
7
+ *
6
8
  * @public
7
9
  * @remarks
8
- * HTML Element: \<fluent-button\>
10
+ * HTML Element: `<fluent-button>`
9
11
  */
10
12
  export const definition = Button.compose({
11
13
  name: `${FluentDesignSystem.prefix}-button`,
12
14
  template,
13
15
  styles,
14
- shadowOptions: {
15
- delegatesFocus: true,
16
- },
17
16
  });
18
17
  //# sourceMappingURL=button.definition.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"button.definition.js","sourceRoot":"","sources":["../../../src/button/button.definition.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrC,OAAO,EAAE,MAAM,EAAE,MAAM,oBAAoB,CAAC;AAC5C,OAAO,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AAEhD;;;;GAIG;AACH,MAAM,CAAC,MAAM,UAAU,GAAG,MAAM,CAAC,OAAO,CAAC;IACvC,IAAI,EAAE,GAAG,kBAAkB,CAAC,MAAM,SAAS;IAC3C,QAAQ;IACR,MAAM;IACN,aAAa,EAAE;QACb,cAAc,EAAE,IAAI;KACrB;CACF,CAAC,CAAC"}
1
+ {"version":3,"file":"button.definition.js","sourceRoot":"","sources":["../../../src/button/button.definition.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrC,OAAO,EAAE,MAAM,EAAE,MAAM,oBAAoB,CAAC;AAC5C,OAAO,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AAEhD;;;;;;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"}