@fluentui/web-components 3.0.0-alpha.12 → 3.0.0-alpha.14

package/docs/api-report.md

@@ -4,6 +4,7 @@
 
 ```ts
 
+import { ButtonOptions } from '@microsoft/fast-foundation';
 import { CSSDesignToken } from '@microsoft/fast-foundation';
 import { DividerOrientation } from '@microsoft/fast-foundation';
 import { DividerRole } from '@microsoft/fast-foundation';
@@ -11,6 +12,7 @@ import { ElementStyles } from '@microsoft/fast-element';
 import { ElementViewTemplate } from '@microsoft/fast-element';
 import { FASTAccordion } from '@microsoft/fast-foundation';
 import { FASTAccordionItem } from '@microsoft/fast-foundation';
+import { FASTButton } from '@microsoft/fast-foundation';
 import { FASTDivider } from '@microsoft/fast-foundation';
 import { FASTElement } from '@microsoft/fast-element';
 import { FASTElementDefinition } from '@microsoft/fast-element';
@@ -18,10 +20,14 @@ import { FASTProgress } from '@microsoft/fast-foundation';
 import { FASTProgressRing } from '@microsoft/fast-foundation';
 import { FASTSlider } from '@microsoft/fast-foundation';
 import { FASTSwitch } from '@microsoft/fast-foundation';
+import { FASTTab } from '@microsoft/fast-foundation';
+import { FASTTabPanel } from '@microsoft/fast-foundation';
+import { FASTTabs } from '@microsoft/fast-foundation';
 import { SliderOrientation } from '@microsoft/fast-foundation';
 import { StartEnd } from '@microsoft/fast-foundation';
 import { StartEndOptions } from '@microsoft/fast-foundation';
 import { StaticallyComposableHTML } from '@microsoft/fast-foundation';
+import { TabsOrientation } from '@microsoft/fast-foundation';
 import type { Theme } from '@fluentui/tokens';
 import { ValuesOf } from '@microsoft/fast-foundation';
 
@@ -332,6 +338,62 @@ export const borderRadiusSmall: CSSDesignToken<string>;
 // @public (undocumented)
 export const borderRadiusXLarge: CSSDesignToken<string>;
 
+// @public
+export class Button extends FASTButton {
+    appearance?: ButtonAppearance | undefined;
+    // (undocumented)
+    connectedCallback(): void;
+    disabledFocusable?: boolean;
+    // (undocumented)
+    protected disabledFocusableChanged(prev: boolean, next: boolean): void;
+    // (undocumented)
+    disconnectedCallback(): void;
+    iconOnly: boolean;
+    shape?: ButtonShape | undefined;
+    size?: ButtonSize;
+}
+
+// @public
+export const ButtonAppearance: {
+    readonly primary: "primary";
+    readonly outline: "outline";
+    readonly subtle: "subtle";
+    readonly secondary: "secondary";
+    readonly transparent: "transparent";
+};
+
+// @public
+export type ButtonAppearance = ValuesOf<typeof ButtonAppearance>;
+
+// @public
+export const ButtonDefinition: FASTElementDefinition<typeof Button>;
+
+export { ButtonOptions }
+export { ButtonOptions as MenuButtonOptions }
+
+// @public
+export const ButtonShape: {
+    readonly circular: "circular";
+    readonly rounded: "rounded";
+    readonly square: "square";
+};
+
+// @public
+export type ButtonShape = ValuesOf<typeof ButtonShape>;
+
+// @public
+export const ButtonSize: {
+    readonly small: "small";
+    readonly medium: "medium";
+    readonly large: "large";
+};
+
+// @public
+export type ButtonSize = ValuesOf<typeof ButtonSize>;
+
+// @public
+export const ButtonTemplate: ElementViewTemplate<Button>;
+
 // @public (undocumented)
 export const colorBackgroundOverlay: CSSDesignToken<string>;
 
@@ -1521,6 +1583,48 @@ export const lineHeightHero800: CSSDesignToken<string>;
 // @public (undocumented)
 export const lineHeightHero900: CSSDesignToken<string>;
 
+// @public
+export class MenuButton extends Button {
+}
+
+// @public
+export const MenuButtonAppearance: {
+    readonly primary: "primary";
+    readonly outline: "outline";
+    readonly subtle: "subtle";
+    readonly secondary: "secondary";
+    readonly transparent: "transparent";
+};
+
+// @public
+export type MenuButtonAppearance = ValuesOf<typeof MenuButtonAppearance>;
+
+// @public
+export const MenuButtonDefinition: FASTElementDefinition<typeof MenuButton>;
+
+// @public
+export const MenuButtonShape: {
+    readonly circular: "circular";
+    readonly rounded: "rounded";
+    readonly square: "square";
+};
+
+// @public
+export type MenuButtonShape = ValuesOf<typeof MenuButtonShape>;
+
+// @public
+export const MenuButtonSize: {
+    readonly small: "small";
+    readonly medium: "medium";
+    readonly large: "large";
+};
+
+// @public
+export type MenuButtonSize = ValuesOf<typeof MenuButtonSize>;
+
+// @public
+export const MenuButtonTemplate: ElementViewTemplate<MenuButton>;
+
 // @public
 class ProgressBar_2 extends FASTProgress {
     shape?: ProgressBarShape;
@@ -1752,6 +1856,11 @@ export const strokeWidthThickest: CSSDesignToken<string>;
 // @public (undocumented)
 export const strokeWidthThin: CSSDesignToken<string>;
 
+// @public (undocumented)
+const styles: ElementStyles;
+export { styles as ButtonStyles }
+export { styles as MenuButtonStyles }
+
 // @public (undocumented)
 export class Switch extends FASTSwitch {
     labelPosition: SwitchLabelPosition | undefined;
@@ -1773,6 +1882,75 @@ export const switchStyles: ElementStyles;
 // @public (undocumented)
 export const switchTemplate: ElementViewTemplate<Switch>;
 
+// @public
+export class Tab extends FASTTab {
+    // (undocumented)
+    connectedCallback(): void;
+}
+
+// @public (undocumented)
+export const TabDefinition: FASTElementDefinition<typeof Tab>;
+
+// @public (undocumented)
+export class TabPanel extends FASTTabPanel {
+}
+
+// @public (undocumented)
+export const TabPanelDefinition: FASTElementDefinition<typeof TabPanel>;
+
+// @public (undocumented)
+export const TabPanelStyles: ElementStyles;
+
+// @public (undocumented)
+export const TabPanelTemplate: ElementViewTemplate<FASTTabPanel, any>;
+
+// @public
+export class Tabs extends FASTTabs {
+    // (undocumented)
+    activeidChanged(oldValue: string, newValue: string): void;
+    appearance?: TabsAppearance;
+    disabled?: boolean;
+    size?: TabsSize;
+    // (undocumented)
+    tabsChanged(): void;
+}
+
+// @public (undocumented)
+export const TabsAppearance: {
+    readonly subtle: "subtle";
+    readonly transparent: "transparent";
+};
+
+// @public (undocumented)
+export type TabsAppearance = ValuesOf<typeof TabsAppearance>;
+
+// @public (undocumented)
+export const TabsDefinition: FASTElementDefinition<typeof Tabs>;
+
+export { TabsOrientation }
+
+// @public (undocumented)
+export const TabsSize: {
+    readonly small: "small";
+    readonly medium: "medium";
+    readonly large: "large";
+};
+
+// @public (undocumented)
+export type TabsSize = ValuesOf<typeof TabsSize>;
+
+// @public (undocumented)
+export const TabsStyles: ElementStyles;
+
+// @public (undocumented)
+export const TabsTemplate: ElementViewTemplate<FASTTabs, any>;
+
+// @public (undocumented)
+export const TabStyles: ElementStyles;
+
+// @public (undocumented)
+export const TabTemplate: ElementViewTemplate<FASTTab, any>;
+
 // @public
 class Text_2 extends FASTElement {
     align?: TextAlign;

package/package.json

@@ -2,7 +2,7 @@
   "name": "@fluentui/web-components",
   "description": "A library of Fluent Web Components",
   "sideEffects": false,
-  "version": "3.0.0-alpha.12",
+  "version": "3.0.0-alpha.14",
   "author": {
     "name": "Microsoft",
     "url": "https://discord.gg/FcSNfg4"
@@ -40,6 +40,10 @@
       "types": "./dist/esm/badge/define.d.ts",
       "default": "./dist/esm/badge/define.js"
     },
+    "./button": {
+      "types": "./dist/esm/button/define.d.ts",
+      "default": "./dist/esm/button/define.js"
+    },
     "./counter-badge": {
       "types": "./dist/esm/counter-badge/define.d.ts",
       "default": "./dist/esm/counter-badge/define.js"
@@ -52,9 +56,9 @@
       "types": "./dist/esm/image/define.d.ts",
       "default": "./dist/esm/image/define.js"
     },
-    "./text": {
-      "types": "./dist/esm/text/define.d.ts",
-      "default": "./dist/esm/text/define.js"
+    "./menu-button": {
+      "types": "./dist/esm/menu-button/define.d.ts",
+      "default": "./dist/esm/menu-button/define.js"
     },
     "./progress-bar": {
       "types": "./dist/esm/progress-bar/define.d.ts",
@@ -71,6 +75,10 @@
     "./switch": {
       "types": "./dist/esm/switch/define.d.ts",
       "default": "./dist/esm/switch/define.js"
+    },
+    "./text": {
+      "types": "./dist/esm/text/define.d.ts",
+      "default": "./dist/esm/text/define.js"
     }
   },
   "scripts": {
@@ -129,8 +137,8 @@
     "typescript": "4.7.4"
   },
   "dependencies": {
-    "@microsoft/fast-element": "^2.0.0-beta.22",
-    "@microsoft/fast-foundation": "^3.0.0-alpha.26",
+    "@microsoft/fast-element": "^2.0.0-beta.23",
+    "@microsoft/fast-foundation": "^3.0.0-alpha.27",
     "@microsoft/fast-web-utilities": "^6.0.0",
     "@fluentui/tokens": "1.0.0-alpha.2",
     "tslib": "^2.1.0"