@fluentui/web-components 3.0.0-beta.15 → 3.0.0-beta.17

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 (70) hide show
  1. package/CHANGELOG.md +185 -103
  2. package/dist/dts/index.d.ts +1 -1
  3. package/dist/dts/menu-item/menu-item.options.d.ts +1 -1
  4. package/dist/dts/spinner/index.d.ts +1 -1
  5. package/dist/dts/spinner/spinner.d.ts +9 -10
  6. package/dist/dts/spinner/spinner.template.d.ts +2 -4
  7. package/dist/dts/theme/design-tokens.d.ts +53 -1
  8. package/dist/esm/anchor-button/anchor-button.js.map +1 -1
  9. package/dist/esm/anchor-button/anchor-button.styles.js +13 -12
  10. package/dist/esm/anchor-button/anchor-button.styles.js.map +1 -1
  11. package/dist/esm/avatar/avatar.js.map +1 -1
  12. package/dist/esm/button/button.styles.js +12 -12
  13. package/dist/esm/index.js.map +1 -1
  14. package/dist/esm/menu-list/menu-list.js.map +1 -1
  15. package/dist/esm/spinner/index.js.map +1 -1
  16. package/dist/esm/spinner/spinner.js +12 -3
  17. package/dist/esm/spinner/spinner.js.map +1 -1
  18. package/dist/esm/spinner/spinner.styles.js +2 -16
  19. package/dist/esm/spinner/spinner.styles.js.map +1 -1
  20. package/dist/esm/spinner/spinner.template.js +8 -47
  21. package/dist/esm/spinner/spinner.template.js.map +1 -1
  22. package/dist/esm/theme/design-tokens.js +53 -1
  23. package/dist/esm/theme/design-tokens.js.map +1 -1
  24. package/dist/esm/utils/get-initials.js.map +1 -1
  25. package/dist/fluent-web-components.api.json +1567 -239
  26. package/dist/web-components.d.ts +115 -11
  27. package/dist/web-components.js +1145 -173
  28. package/dist/web-components.min.js +337 -283
  29. package/docs/api-report.md +163 -8
  30. package/package.json +5 -10
  31. package/project.json +6 -0
  32. package/dist/storybook/108.78b731e00015540915a8.manager.bundle.js +0 -1
  33. package/dist/storybook/108.b31ec3a1.iframe.bundle.js +0 -1
  34. package/dist/storybook/289.703b1698.iframe.bundle.js +0 -2
  35. package/dist/storybook/289.703b1698.iframe.bundle.js.LICENSE.txt +0 -51
  36. package/dist/storybook/316.bc4aabd3.iframe.bundle.js +0 -2
  37. package/dist/storybook/316.bc4aabd3.iframe.bundle.js.LICENSE.txt +0 -17
  38. package/dist/storybook/401.7edec720.iframe.bundle.js +0 -2
  39. package/dist/storybook/401.7edec720.iframe.bundle.js.LICENSE.txt +0 -12
  40. package/dist/storybook/401.c9bdfaf0dda8b194127f.manager.bundle.js +0 -2
  41. package/dist/storybook/401.c9bdfaf0dda8b194127f.manager.bundle.js.LICENSE.txt +0 -12
  42. package/dist/storybook/491.77b24750.iframe.bundle.js +0 -1
  43. package/dist/storybook/591.f5bf0d78d2f203de19f5.manager.bundle.js +0 -2
  44. package/dist/storybook/591.f5bf0d78d2f203de19f5.manager.bundle.js.LICENSE.txt +0 -94
  45. package/dist/storybook/709.22096ad4.iframe.bundle.js +0 -2
  46. package/dist/storybook/709.22096ad4.iframe.bundle.js.LICENSE.txt +0 -8
  47. package/dist/storybook/709.b131e33993a6b94d7ad8.manager.bundle.js +0 -2
  48. package/dist/storybook/709.b131e33993a6b94d7ad8.manager.bundle.js.LICENSE.txt +0 -8
  49. package/dist/storybook/721.46fa9f53.iframe.bundle.js +0 -2
  50. package/dist/storybook/721.46fa9f53.iframe.bundle.js.LICENSE.txt +0 -31
  51. package/dist/storybook/721.c225c101a0a55a8f98eb.manager.bundle.js +0 -2
  52. package/dist/storybook/721.c225c101a0a55a8f98eb.manager.bundle.js.LICENSE.txt +0 -31
  53. package/dist/storybook/858.da40ed98.iframe.bundle.js +0 -1
  54. package/dist/storybook/858.e08e25a6901d2e21e9d8.manager.bundle.js +0 -1
  55. package/dist/storybook/950.674e7934b4a26a022608.manager.bundle.js +0 -1
  56. package/dist/storybook/954.630c5748.iframe.bundle.js +0 -1
  57. package/dist/storybook/954.7f985e2fdf9f15a7748b.manager.bundle.js +0 -1
  58. package/dist/storybook/SegoeUI-VF.ttf +0 -0
  59. package/dist/storybook/favicon.ico +0 -0
  60. package/dist/storybook/favicon.png +0 -0
  61. package/dist/storybook/iframe.html +0 -364
  62. package/dist/storybook/index.html +0 -165
  63. package/dist/storybook/main.5d7b916dc1e37293b1d8.manager.bundle.js +0 -1
  64. package/dist/storybook/main.6c75b8cb.iframe.bundle.js +0 -2
  65. package/dist/storybook/main.6c75b8cb.iframe.bundle.js.LICENSE.txt +0 -1
  66. package/dist/storybook/project.json +0 -1
  67. package/dist/storybook/runtime~main.5d918fe7.iframe.bundle.js +0 -1
  68. package/dist/storybook/runtime~main.dbf00b470fe610082919.manager.bundle.js +0 -1
  69. package/dist/storybook/shell.css +0 -83
  70. package/dist/storybook/theme-switch.ts +0 -13
package/dist/web-components.d.ts CHANGED
@@ -11,6 +11,7 @@ import { HTMLDirective } from '@microsoft/fast-element';
11
11
  import { Orientation } from '@microsoft/fast-web-utilities';
12
12
  import type { SyntheticViewTemplate } from '@microsoft/fast-element';
13
13
  import type { Theme } from '@fluentui/tokens';
14
+ import { ViewTemplate } from '@microsoft/fast-element';
14
15
 
15
16
  /**
16
17
  * An Accordion Custom HTML Element
@@ -1756,6 +1757,14 @@ export declare const colorBrandBackground = "var(--colorBrandBackground)";
1756
1757
 
1757
1758
  export declare const colorBrandBackground2 = "var(--colorBrandBackground2)";
1758
1759
 
1760
+ export declare const colorBrandBackground2Hover = "var(--colorBrandBackground2Hover)";
1761
+
1762
+ export declare const colorBrandBackground2Pressed = "var(--colorBrandBackground2Pressed)";
1763
+
1764
+ export declare const colorBrandBackground3Static = "var(--colorBrandBackground3Static)";
1765
+
1766
+ export declare const colorBrandBackground4Static = "var(--colorBrandBackground4Static)";
1767
+
1759
1768
  export declare const colorBrandBackgroundHover = "var(--colorBrandBackgroundHover)";
1760
1769
 
1761
1770
  export declare const colorBrandBackgroundInverted = "var(--colorBrandBackgroundInverted)";
@@ -1776,6 +1785,10 @@ export declare const colorBrandForeground1 = "var(--colorBrandForeground1)";
1776
1785
 
1777
1786
  export declare const colorBrandForeground2 = "var(--colorBrandForeground2)";
1778
1787
 
1788
+ export declare const colorBrandForeground2Hover = "var(--colorBrandForeground2Hover)";
1789
+
1790
+ export declare const colorBrandForeground2Pressed = "var(--colorBrandForeground2Pressed)";
1791
+
1779
1792
  export declare const colorBrandForegroundInverted = "var(--colorBrandForegroundInverted)";
1780
1793
 
1781
1794
  export declare const colorBrandForegroundInvertedHover = "var(--colorBrandForegroundInvertedHover)";
@@ -1806,6 +1819,12 @@ export declare const colorBrandStroke1 = "var(--colorBrandStroke1)";
1806
1819
 
1807
1820
  export declare const colorBrandStroke2 = "var(--colorBrandStroke2)";
1808
1821
 
1822
+ export declare const colorBrandStroke2Contrast = "var(--colorBrandStroke2Contrast)";
1823
+
1824
+ export declare const colorBrandStroke2Hover = "var(--colorBrandStroke2Hover)";
1825
+
1826
+ export declare const colorBrandStroke2Pressed = "var(--colorBrandStroke2Pressed)";
1827
+
1809
1828
  export declare const colorCompoundBrandBackground = "var(--colorCompoundBrandBackground)";
1810
1829
 
1811
1830
  export declare const colorCompoundBrandBackgroundHover = "var(--colorCompoundBrandBackgroundHover)";
@@ -1866,6 +1885,10 @@ export declare const colorNeutralBackground5Selected = "var(--colorNeutralBackgr
1866
1885
 
1867
1886
  export declare const colorNeutralBackground6 = "var(--colorNeutralBackground6)";
1868
1887
 
1888
+ export declare const colorNeutralBackgroundAlpha = "var(--colorNeutralBackgroundAlpha)";
1889
+
1890
+ export declare const colorNeutralBackgroundAlpha2 = "var(--colorNeutralBackgroundAlpha2)";
1891
+
1869
1892
  export declare const colorNeutralBackgroundDisabled = "var(--colorNeutralBackgroundDisabled)";
1870
1893
 
1871
1894
  export declare const colorNeutralBackgroundInverted = "var(--colorNeutralBackgroundInverted)";
@@ -1874,6 +1897,16 @@ export declare const colorNeutralBackgroundInvertedDisabled = "var(--colorNeutra
1874
1897
 
1875
1898
  export declare const colorNeutralBackgroundStatic = "var(--colorNeutralBackgroundStatic)";
1876
1899
 
1900
+ export declare const colorNeutralCardBackground = "var(--colorNeutralCardBackground)";
1901
+
1902
+ export declare const colorNeutralCardBackgroundDisabled = "var(--colorNeutralCardBackgroundDisabled)";
1903
+
1904
+ export declare const colorNeutralCardBackgroundHover = "var(--colorNeutralCardBackgroundHover)";
1905
+
1906
+ export declare const colorNeutralCardBackgroundPressed = "var(--colorNeutralCardBackgroundPressed)";
1907
+
1908
+ export declare const colorNeutralCardBackgroundSelected = "var(--colorNeutralCardBackgroundSelected)";
1909
+
1877
1910
  export declare const colorNeutralForeground1 = "var(--colorNeutralForeground1)";
1878
1911
 
1879
1912
  export declare const colorNeutralForeground1Hover = "var(--colorNeutralForeground1Hover)";
@@ -1988,6 +2021,10 @@ export declare const colorNeutralStrokeAccessiblePressed = "var(--colorNeutralSt
1988
2021
 
1989
2022
  export declare const colorNeutralStrokeAccessibleSelected = "var(--colorNeutralStrokeAccessibleSelected)";
1990
2023
 
2024
+ export declare const colorNeutralStrokeAlpha = "var(--colorNeutralStrokeAlpha)";
2025
+
2026
+ export declare const colorNeutralStrokeAlpha2 = "var(--colorNeutralStrokeAlpha2)";
2027
+
1991
2028
  export declare const colorNeutralStrokeDisabled = "var(--colorNeutralStrokeDisabled)";
1992
2029
 
1993
2030
  export declare const colorNeutralStrokeInvertedDisabled = "var(--colorNeutralStrokeInvertedDisabled)";
@@ -2002,6 +2039,8 @@ export declare const colorNeutralStrokeOnBrand2Pressed = "var(--colorNeutralStro
2002
2039
 
2003
2040
  export declare const colorNeutralStrokeOnBrand2Selected = "var(--colorNeutralStrokeOnBrand2Selected)";
2004
2041
 
2042
+ export declare const colorNeutralStrokeSubtle = "var(--colorNeutralStrokeSubtle)";
2043
+
2005
2044
  export declare const colorPaletteAnchorBackground2 = "var(--colorPaletteAnchorBackground2)";
2006
2045
 
2007
2046
  export declare const colorPaletteAnchorBorderActive = "var(--colorPaletteAnchorBorderActive)";
@@ -2304,6 +2343,70 @@ export declare const colorPaletteYellowForegroundInverted = "var(--colorPaletteY
2304
2343
 
2305
2344
  export declare const colorScrollbarOverlay = "var(--colorScrollbarOverlay)";
2306
2345
 
2346
+ export declare const colorStatusDangerBackground1 = "var(--colorStatusDangerBackground1)";
2347
+
2348
+ export declare const colorStatusDangerBackground2 = "var(--colorStatusDangerBackground2)";
2349
+
2350
+ export declare const colorStatusDangerBackground3 = "var(--colorStatusDangerBackground3)";
2351
+
2352
+ export declare const colorStatusDangerBackground3Hover = "var(--colorStatusDangerBackground3Hover)";
2353
+
2354
+ export declare const colorStatusDangerBackground3Pressed = "var(--colorStatusDangerBackground3Pressed)";
2355
+
2356
+ export declare const colorStatusDangerBorder1 = "var(--colorStatusDangerBorder1)";
2357
+
2358
+ export declare const colorStatusDangerBorder2 = "var(--colorStatusDangerBorder2)";
2359
+
2360
+ export declare const colorStatusDangerBorderActive = "var(--colorStatusDangerBorderActive)";
2361
+
2362
+ export declare const colorStatusDangerForeground1 = "var(--colorStatusDangerForeground1)";
2363
+
2364
+ export declare const colorStatusDangerForeground2 = "var(--colorStatusDangerForeground2)";
2365
+
2366
+ export declare const colorStatusDangerForeground3 = "var(--colorStatusDangerForeground3)";
2367
+
2368
+ export declare const colorStatusDangerForegroundInverted = "var(--colorStatusDangerForegroundInverted)";
2369
+
2370
+ export declare const colorStatusSuccessBackground1 = "var(--colorStatusSuccessBackground1)";
2371
+
2372
+ export declare const colorStatusSuccessBackground2 = "var(--colorStatusSuccessBackground2)";
2373
+
2374
+ export declare const colorStatusSuccessBackground3 = "var(--colorStatusSuccessBackground3)";
2375
+
2376
+ export declare const colorStatusSuccessBorder1 = "var(--colorStatusSuccessBorder1)";
2377
+
2378
+ export declare const colorStatusSuccessBorder2 = "var(--colorStatusSuccessBorder2)";
2379
+
2380
+ export declare const colorStatusSuccessBorderActive = "var(--colorStatusSuccessBorderActive)";
2381
+
2382
+ export declare const colorStatusSuccessForeground1 = "var(--colorStatusSuccessForeground1)";
2383
+
2384
+ export declare const colorStatusSuccessForeground2 = "var(--colorStatusSuccessForeground2)";
2385
+
2386
+ export declare const colorStatusSuccessForeground3 = "var(--colorStatusSuccessForeground3)";
2387
+
2388
+ export declare const colorStatusSuccessForegroundInverted = "var(--colorStatusSuccessForegroundInverted)";
2389
+
2390
+ export declare const colorStatusWarningBackground1 = "var(--colorStatusWarningBackground1)";
2391
+
2392
+ export declare const colorStatusWarningBackground2 = "var(--colorStatusWarningBackground2)";
2393
+
2394
+ export declare const colorStatusWarningBackground3 = "var(--colorStatusWarningBackground3)";
2395
+
2396
+ export declare const colorStatusWarningBorder1 = "var(--colorStatusWarningBorder1)";
2397
+
2398
+ export declare const colorStatusWarningBorder2 = "var(--colorStatusWarningBorder2)";
2399
+
2400
+ export declare const colorStatusWarningBorderActive = "var(--colorStatusWarningBorderActive)";
2401
+
2402
+ export declare const colorStatusWarningForeground1 = "var(--colorStatusWarningForeground1)";
2403
+
2404
+ export declare const colorStatusWarningForeground2 = "var(--colorStatusWarningForeground2)";
2405
+
2406
+ export declare const colorStatusWarningForeground3 = "var(--colorStatusWarningForeground3)";
2407
+
2408
+ export declare const colorStatusWarningForegroundInverted = "var(--colorStatusWarningForegroundInverted)";
2409
+
2307
2410
  export declare const colorStrokeFocus1 = "var(--colorStrokeFocus1)";
2308
2411
 
2309
2412
  export declare const colorStrokeFocus2 = "var(--colorStrokeFocus2)";
@@ -3041,6 +3144,8 @@ export declare const durationFast = "var(--durationFast)";
3041
3144
 
3042
3145
  export declare const durationFaster = "var(--durationFaster)";
3043
3146
 
3147
+ export declare const durationGentle = "var(--durationGentle)";
3148
+
3044
3149
  export declare const durationNormal = "var(--durationNormal)";
3045
3150
 
3046
3151
  export declare const durationSlow = "var(--durationSlow)";
@@ -4429,7 +4534,7 @@ export declare const RadioTemplate: ElementViewTemplate<Radio>;
4429
4534
  * @internal
4430
4535
  */
4431
4536
  export declare const roleForMenuItem: {
4432
- [value in keyof typeof MenuItemRole]: typeof MenuItemRole[value];
4537
+ [value in keyof typeof MenuItemRole]: (typeof MenuItemRole)[value];
4433
4538
  };
4434
4539
 
4435
4540
  /**
@@ -4808,7 +4913,13 @@ export declare const spacingVerticalXXXL = "var(--spacingVerticalXXXL)";
4808
4913
  * The base class used for constructing a fluent-spinner custom element
4809
4914
  * @public
4810
4915
  */
4811
- export declare class Spinner extends BaseProgress {
4916
+ export declare class Spinner extends FASTElement {
4917
+ /**
4918
+ * The internal {@link https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals | `ElementInternals`} instance for the component.
4919
+ *
4920
+ * @internal
4921
+ */
4922
+ protected elementInternals: ElementInternals;
4812
4923
  /**
4813
4924
  * The size of the spinner
4814
4925
  *
@@ -4826,6 +4937,7 @@ export declare class Spinner extends BaseProgress {
4826
4937
  * HTML Attribute: appearance
4827
4938
  */
4828
4939
  appearance?: SpinnerAppearance;
4940
+ constructor();
4829
4941
  }
4830
4942
 
4831
4943
  /**
@@ -4850,14 +4962,6 @@ export declare type SpinnerAppearance = ValuesOf<typeof SpinnerAppearance>;
4850
4962
  */
4851
4963
  export declare const SpinnerDefinition: FASTElementDefinition<typeof Spinner>;
4852
4964
 
4853
- /**
4854
- * Progress configuration options
4855
- * @public
4856
- */
4857
- export declare type SpinnerOptions = {
4858
- indeterminateIndicator?: StaticallyComposableHTML<Spinner>;
4859
- };
4860
-
4861
4965
  /**
4862
4966
  * SpinnerSize constants
4863
4967
  * @public
@@ -4880,7 +4984,7 @@ export declare type SpinnerSize = ValuesOf<typeof SpinnerSize>;
4880
4984
 
4881
4985
  export declare const SpinnerStyles: ElementStyles;
4882
4986
 
4883
- export declare const SpinnerTemplate: ElementViewTemplate<Spinner>;
4987
+ export declare const SpinnerTemplate: ViewTemplate<Spinner, any>;
4884
4988
 
4885
4989
  /**
4886
4990
  * A mixin class implementing start and end slots.