@fluentui/react-button 1.0.0-beta.8 → 9.0.0-alpha.100

package/lib-commonjs/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"../src/","sources":["index.ts"],"names":[],"mappings":";;;AAAA,qBAAmB;AAEnB,mDAAyB;AACzB,2DAAiC;AACjC,uDAA6B;AAC7B,wDAA8B;AAC9B,yDAA+B","sourcesContent":["import './version';\n\nexport * from './Button';\nexport * from './CompoundButton';\nexport * from './MenuButton';\nexport * from './SplitButton';\nexport * from './ToggleButton';\n"]}
+{"version":3,"sources":["../src/index.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,UAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,kBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,cAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,eAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,gBAAA,CAAA,EAAA,OAAA","sourceRoot":""}

package/package.json

@@ -1,13 +1,11 @@
 {
   "name": "@fluentui/react-button",
-  "version": "1.0.0-beta.8",
+  "version": "9.0.0-alpha.100",
   "description": "Fluent UI React Button component.",
   "main": "lib-commonjs/index.js",
   "module": "lib/index.js",
   "typings": "lib/index.d.ts",
-  "sideEffects": [
-    "lib/version.js"
-  ],
+  "sideEffects": false,
   "repository": {
     "type": "git",
     "url": "https://github.com/microsoft/fluentui"
@@ -15,54 +13,58 @@
   "license": "MIT",
   "scripts": {
     "build": "just-scripts build",
-    "bundle": "just-scripts bundle",
+    "bundle-size": "bundle-size measure",
     "clean": "just-scripts clean",
     "code-style": "just-scripts code-style",
     "just": "just-scripts",
     "lint": "just-scripts lint",
-    "start": "just-scripts dev:storybook",
-    "start:legacy": "just-scripts dev",
-    "start-test": "just-scripts jest-watch",
-    "test": "just-scripts test",
-    "update-api": "just-scripts update-api",
-    "update-snapshots": "just-scripts jest -u"
+    "start": "yarn storybook",
+    "test": "jest",
+    "docs": "api-extractor run --config=config/api-extractor.local.json --local",
+    "build:local": "tsc -p . --module esnext --emitDeclarationOnly && node ../../scripts/typescript/normalize-import --output dist/packages/react-button/src && yarn docs",
+    "storybook": "start-storybook"
   },
   "devDependencies": {
-    "@fluentui/common-styles": "^1.0.0-beta.5",
-    "@fluentui/eslint-plugin": "^1.0.0-beta.0",
-    "@fluentui/react-conformance": "^1.0.0",
+    "@fluentui/a11y-testing": "^0.1.0",
+    "@fluentui/babel-make-styles": "9.0.0-alpha.59",
+    "@fluentui/eslint-plugin": "*",
+    "@fluentui/jest-serializer-make-styles": "9.0.0-alpha.52",
+    "@fluentui/react-conformance": "*",
+    "@fluentui/react-conformance-make-styles": "9.0.0-alpha.21",
+    "@fluentui/react-menu": "9.0.0-alpha.91",
+    "@fluentui/scripts": "^1.0.0",
     "@types/enzyme": "3.10.3",
     "@types/enzyme-adapter-react-16": "1.0.3",
-    "@types/jest": "~24.9.0",
-    "@types/react": "16.8.25",
-    "@types/react-dom": "16.8.4",
+    "@types/react": "16.9.42",
+    "@types/react-dom": "16.9.10",
     "@types/react-test-renderer": "^16.0.0",
-    "@types/webpack-env": "1.15.1",
-    "@fluentui/scripts": "^1.0.0",
     "enzyme": "~3.10.0",
     "enzyme-adapter-react-16": "^1.15.0",
     "react": "16.8.6",
-    "react-app-polyfill": "~1.0.1",
     "react-dom": "16.8.6",
     "react-test-renderer": "^16.3.0"
   },
   "dependencies": {
-    "@fluentui/react-compose": "^1.0.0-beta.5",
-    "@fluentui/keyboard-key": "^0.2.12",
-    "@fluentui/react-icons-mdl2": "^1.0.0-beta.5",
-    "@fluentui/react-theme-provider": "^1.0.0-beta.6",
-    "@fluentui/theme": "^2.0.0-beta.5",
-    "@microsoft/load-themed-styles": "^1.10.26",
-    "@fluentui/react-hooks": "^8.0.0-beta.5",
-    "@fluentui/set-version": "^8.0.0-beta.0",
-    "@fluentui/style-utilities": "^8.0.0-beta.5",
-    "@fluentui/utilities": "^8.0.0-beta.5",
-    "tslib": "^1.10.0"
+    "@fluentui/keyboard-keys": "9.0.0-alpha.5",
+    "@fluentui/react-aria": "9.0.0-alpha.44",
+    "@fluentui/react-icons": "^1.1.140",
+    "@fluentui/react-make-styles": "9.0.0-alpha.77",
+    "@fluentui/react-tabster": "9.0.0-alpha.72",
+    "@fluentui/react-utilities": "9.0.0-alpha.56",
+    "tslib": "^2.1.0"
   },
   "peerDependencies": {
-    "@types/react": ">=16.8.0 <17.0.0",
-    "@types/react-dom": ">=16.8.0 <17.0.0",
-    "react": ">=16.8.0 <17.0.0",
-    "react-dom": ">=16.8.0 <17.0.0"
+    "@types/react": ">=16.8.0 <18.0.0",
+    "@types/react-dom": ">=16.8.0 <18.0.0",
+    "react": ">=16.8.0 <18.0.0",
+    "react-dom": ">=16.8.0 <18.0.0"
+  },
+  "beachball": {
+    "tag": "alpha",
+    "disallowedChangeTypes": [
+      "major",
+      "minor",
+      "patch"
+    ]
   }
 }

package/config/api-extractor.json

@@ -1,3 +0,0 @@
-{
-  "extends": "@fluentui/scripts/api-extractor/api-extractor.common.json"
-}

package/config/pre-copy.json

@@ -1,9 +0,0 @@
-{
-  "copyTo": {
-    "dist/demo": [
-      "@fluentui/react-docsite-components/index.html",
-      "react/umd/react.development.js",
-      "react-dom/umd/react-dom.development.js"
-    ]
-  }
-}

package/config/tests.js

@@ -1,11 +0,0 @@
-/** Jest test setup file. */
-const { configure } = require('enzyme');
-const Adapter = require('enzyme-adapter-react-16');
-
-// Mock requestAnimationFrame for React 16+.
-global.requestAnimationFrame = callback => {
-  setTimeout(callback, 0);
-};
-
-// Configure enzyme.
-configure({ adapter: new Adapter() });

package/etc/react-button.api.md

@@ -1,335 +0,0 @@
-## API Report File for "@fluentui/react-button"
-
-> Do not edit this file. It is a report generated by [API Extractor](https://api-extractor.com/).
-
-```ts
-
-import { ColorTokens } from '@fluentui/theme';
-import { ComponentProps } from '@fluentui/react-compose/lib/next/index';
-import { FontTokens } from '@fluentui/theme';
-import * as React from 'react';
-import { RecursivePartial } from '@fluentui/theme';
-import { ShorthandProps } from '@fluentui/react-compose/lib/next/index';
-import { SizeValue } from '@fluentui/theme';
-import { Theme } from '@fluentui/react-theme-provider';
-
-// @public
-export const Button: React.ForwardRefExoticComponent<Pick<ButtonProps, string | number> & React.RefAttributes<HTMLElement>>;
-
-// @public (undocumented)
-export type ButtonProps = ComponentProps & React.HTMLAttributes<HTMLElement> & {
-    icon?: ShorthandProps;
-    loader?: ShorthandProps;
-    content?: ShorthandProps;
-    href?: string;
-    target?: string;
-    circular?: boolean;
-    disabled?: boolean;
-    block?: boolean;
-    iconOnly?: boolean;
-    iconPosition?: 'before' | 'after';
-    inverted?: boolean;
-    variant?: string;
-    loading?: boolean;
-    primary?: boolean;
-    secondary?: boolean;
-    ghost?: boolean;
-    transparent?: boolean;
-    size?: SizeValue;
-    tokens?: RecursivePartial<ButtonTokens>;
-};
-
-// @public
-export const buttonShorthandProps: string[];
-
-// @public (undocumented)
-export const ButtonSizeVariants: {
-    size_smallest: {
-        height: string;
-        minHeight: string;
-    };
-    size_smaller: {
-        height: string;
-        minHeight: string;
-    };
-    size_small: {
-        height: string;
-        minHeight: string;
-    };
-    size_large: {
-        height: string;
-        minHeight: string;
-    };
-    size_larger: {
-        height: string;
-        minHeight: string;
-    };
-    size_largest: {
-        height: string;
-        minHeight: string;
-    };
-};
-
-// @public (undocumented)
-export interface ButtonState extends ButtonProps {
-    // (undocumented)
-    buttonRef?: React.RefObject<HTMLButtonElement>;
-}
-
-// @public (undocumented)
-export type ButtonTokens = ColorTokens & FontTokens & {
-    paddingLeft?: string;
-    paddingRight?: string;
-    paddingTop?: string;
-    paddingBottom?: string;
-    margin?: string;
-    height?: string;
-    minWidth?: string;
-    maxWidth?: string;
-    minHeight?: string;
-    contentGap?: string;
-    iconSize?: string;
-    borderRadius?: string;
-    borderTopLeftRadius?: string;
-    borderTopRightRadius?: string;
-    borderBottomLeftRadius?: string;
-    borderBottomRightRadius?: string;
-    borderWidth?: string;
-    boxShadow?: string;
-    width?: string;
-    forcedColorAdjust?: string;
-    transform?: string;
-    transition?: string;
-    size?: {
-        smallest?: string;
-        smaller?: string;
-        small?: string;
-        regular?: string;
-        large?: string;
-        larger?: string;
-        largest?: string;
-    };
-    pressed?: {
-        transform?: string;
-        transition?: string;
-    };
-};
-
-// @public (undocumented)
-export type ButtonVariants<TTokens = ButtonTokens> = {
-    root?: TTokens;
-    block?: TTokens;
-    circular?: TTokens;
-    iconOnly?: TTokens;
-    ghost?: TTokens;
-    primary?: TTokens;
-    transparent?: TTokens;
-};
-
-// @public (undocumented)
-export interface CheckedState {
-    // (undocumented)
-    'aria-checked'?: React.AriaAttributes['aria-pressed'];
-    // (undocumented)
-    'aria-pressed'?: React.AriaAttributes['aria-pressed'];
-    // (undocumented)
-    checked?: boolean;
-    // (undocumented)
-    defaultChecked?: boolean;
-    // (undocumented)
-    onClick?: React.DOMAttributes<HTMLElement>['onClick'];
-    // (undocumented)
-    role?: string;
-}
-
-// @public
-export const CompoundButton: React.ForwardRefExoticComponent<Pick<CompoundButtonProps, string | number> & React.RefAttributes<HTMLElement>>;
-
-// @public (undocumented)
-export interface CompoundButtonProps extends ButtonProps {
-    contentContainer?: ShorthandProps;
-    secondaryContent?: ShorthandProps;
-}
-
-// @public
-export const compoundButtonShorthandProps: string[];
-
-// @public (undocumented)
-export interface CompoundButtonState extends CompoundButtonProps {
-}
-
-// @public (undocumented)
-export type CompoundButtonTokens = ButtonTokens & {
-    secondaryContentColor?: string;
-    secondaryContentFontSize?: string;
-    secondaryContentFontWeight?: string;
-    secondaryContentGap?: string;
-};
-
-// @public (undocumented)
-export type CompoundButtonVariants = ButtonVariants<CompoundButtonTokens>;
-
-// @public (undocumented)
-export type ExpandedState = {
-    ref?: React.Ref<unknown>;
-    expanded?: boolean;
-    defaultExpanded?: boolean;
-    onClick?: (ev: React.MouseEvent) => void;
-    onMenuDismiss?: () => void;
-    onKeyDown?: (ev: React.KeyboardEvent) => void;
-    'aria-expanded'?: React.HTMLAttributes<HTMLElement>['aria-expanded'];
-    'aria-haspopup'?: React.HTMLAttributes<HTMLElement>['aria-haspopup'];
-    menu?: MenuButtonState['menu'];
-};
-
-// @public
-export const MenuButton: React.ForwardRefExoticComponent<Pick<MenuButtonProps, string | number> & React.RefAttributes<HTMLElement>>;
-
-// @public (undocumented)
-export type MenuButtonProps = Omit<ButtonProps, 'iconPosition' | 'loader'> & {
-    menu?: ShorthandProps;
-    menuIcon?: ShorthandProps;
-    defaultExpanded?: boolean;
-    expanded?: boolean;
-    onMenuDismiss?: () => void;
-};
-
-// @public (undocumented)
-export const menuButtonShorthandProps: string[];
-
-// @public (undocumented)
-export interface MenuButtonState extends Omit<MenuButtonProps, 'menu'>, Omit<ButtonState, 'iconPosition' | 'loader'> {
-    // (undocumented)
-    menu?: React.PropsWithChildren<MinimalMenuProps>;
-}
-
-// @public (undocumented)
-export type MenuButtonTokens = ButtonTokens & {
-    menuIconColor?: string;
-    menuIconSize?: string;
-};
-
-// @public (undocumented)
-export type MenuButtonVariants = ButtonVariants<MenuButtonTokens>;
-
-// @public (undocumented)
-export type MinimalMenuProps = {
-    hidden?: boolean;
-    onDismiss?: () => void;
-    target?: React.Ref<HTMLElement | undefined>;
-};
-
-// @public
-export const SplitButton: React.ForwardRefExoticComponent<Pick<SplitButtonProps, string | number> & React.RefAttributes<HTMLElement>>;
-
-// @public (undocumented)
-export interface SplitButtonProps extends ButtonProps, MenuButtonProps {
-    button?: ShorthandProps;
-    divider?: ShorthandProps;
-    menuButton?: ShorthandProps;
-}
-
-// @public (undocumented)
-export const splitButtonShorthandProps: string[];
-
-// @public (undocumented)
-export interface SplitButtonState extends Omit<SplitButtonProps, 'menu'>, MenuButtonState {
-    // (undocumented)
-    menuButtonRef?: React.RefObject<HTMLButtonElement>;
-}
-
-// @public (undocumented)
-export type SplitButtonTokens = MenuButtonTokens & {
-    dividerColor?: string;
-    dividerThickness?: string;
-};
-
-// @public (undocumented)
-export type SplitButtonVariants = ButtonVariants<SplitButtonTokens>;
-
-// @public
-export const ToggleButton: React.ForwardRefExoticComponent<Pick<ToggleButtonProps, string | number> & React.RefAttributes<HTMLElement>>;
-
-// @public (undocumented)
-export interface ToggleButtonProps extends ButtonProps {
-    checked?: boolean;
-    defaultChecked?: boolean;
-}
-
-// @public (undocumented)
-export interface ToggleButtonState extends ToggleButtonProps {
-}
-
-// @public (undocumented)
-export type ToggleButtonTokens = ButtonTokens;
-
-// @public (undocumented)
-export type ToggleButtonVariants = ButtonVariants<ToggleButtonTokens>;
-
-// @public
-export const useButton: (props: ButtonProps, ref: React.Ref<HTMLElement>, defaultProps?: ButtonProps | undefined) => {
-    state: Record<string, any>;
-    render: (state: import("./Button.types").ButtonState) => JSX.Element;
-};
-
-// @public (undocumented)
-export const useButtonClasses: (state: ButtonState, theme?: Theme | undefined, renderer?: import("@fluentui/react-theme-provider").StyleRenderer | undefined) => void;
-
-// @public
-export const useButtonState: (draftState: ButtonState) => void;
-
-// @public
-export const useChecked: <TDraftState extends CheckedState>(draftState: TDraftState) => void;
-
-// @public (undocumented)
-export const useClasses: (state: CompoundButtonState, theme?: Theme | undefined, renderer?: import("@fluentui/react-theme-provider").StyleRenderer | undefined) => void;
-
-// @public
-export const useCompoundButton: (props: CompoundButtonProps, ref: React.Ref<HTMLElement>, defaultProps?: CompoundButtonProps | undefined) => {
-    state: Record<string, any>;
-    render: (state: import("./CompoundButton.types").CompoundButtonState) => JSX.Element;
-};
-
-// @public (undocumented)
-export const useCompoundButtonClasses: (state: CompoundButtonState) => void;
-
-// @public (undocumented)
-export const useExpanded: <TDraftState extends ExpandedState>(draftState: TDraftState) => void;
-
-// @public
-export const useMenuButton: (props: MenuButtonProps, ref: React.Ref<HTMLElement>, defaultProps?: MenuButtonProps | undefined) => {
-    state: MenuButtonState;
-    render: (state: MenuButtonState) => JSX.Element;
-};
-
-// @public (undocumented)
-export const useMenuButtonClasses: (state: MenuButtonState, theme?: Theme | undefined, renderer?: import("@fluentui/react-theme-provider").StyleRenderer | undefined) => void;
-
-// @public (undocumented)
-export const useMenuButtonState: (state: MenuButtonState) => void;
-
-// @public (undocumented)
-export const useMenuContext: () => MinimalMenuProps;
-
-// @public
-export const useSplitButton: (props: SplitButtonProps, ref: React.Ref<HTMLElement>, defaultProps?: SplitButtonProps | undefined) => {
-    state: SplitButtonState;
-    render: (state: SplitButtonState) => JSX.Element;
-};
-
-// @public (undocumented)
-export const useSplitButtonClasses: (state: SplitButtonState, theme?: Theme | undefined, renderer?: import("@fluentui/react-theme-provider").StyleRenderer | undefined) => void;
-
-// @public (undocumented)
-export const useToggleButton: (props: ToggleButtonProps, ref: React.Ref<HTMLElement>, defaultProps?: ToggleButtonProps | undefined) => {
-    state: Record<string, any>;
-    render: (state: import("../Button").ButtonState) => JSX.Element;
-};
-
-// @public (undocumented)
-export const useToggleButtonClasses: (state: ToggleButtonState, theme?: Theme | undefined, renderer?: import("@fluentui/react-theme-provider").StyleRenderer | undefined) => void;
-
-
-// (No @packageDocumentation comment for this package)
-
-```

package/just.config.ts

@@ -1,3 +0,0 @@
-import { preset } from '@fluentui/scripts';
-
-preset();

package/lib/components/Button/useButtonClasses.d.ts

@@ -1,29 +0,0 @@
-import { Theme } from '@fluentui/react-theme-provider';
-import { ButtonState } from './Button.types';
-export declare const ButtonSizeVariants: {
-    size_smallest: {
-        height: string;
-        minHeight: string;
-    };
-    size_smaller: {
-        height: string;
-        minHeight: string;
-    };
-    size_small: {
-        height: string;
-        minHeight: string;
-    };
-    size_large: {
-        height: string;
-        minHeight: string;
-    };
-    size_larger: {
-        height: string;
-        minHeight: string;
-    };
-    size_largest: {
-        height: string;
-        minHeight: string;
-    };
-};
-export declare const useButtonClasses: (state: ButtonState, theme?: Theme | undefined, renderer?: import("@fluentui/react-theme-provider").StyleRenderer | undefined) => void;