first commit

node_modules/@fluentui/react/lib-commonjs/utilities/ButtonGrid/ButtonGrid.base.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+import type { IButtonGridProps } from './ButtonGrid.types';
+export declare const ButtonGridBase: React.FunctionComponent<IButtonGridProps>;

node_modules/@fluentui/react/lib-commonjs/utilities/ButtonGrid/ButtonGrid.base.js

@@ -0,0 +1,39 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ButtonGridBase = void 0;
+var tslib_1 = require("tslib");
+var React = require("react");
+var Utilities_1 = require("../../Utilities");
+var FocusZone_1 = require("../../FocusZone");
+var react_hooks_1 = require("@fluentui/react-hooks");
+var getClassNames = (0, Utilities_1.classNamesFunction)();
+exports.ButtonGridBase = React.forwardRef(function (props, forwardedRef) {
+    var id = (0, react_hooks_1.useId)(undefined, props.id);
+    var items = props.items, columnCount = props.columnCount, onRenderItem = props.onRenderItem, isSemanticRadio = props.isSemanticRadio, 
+    // eslint-disable-next-line @typescript-eslint/no-deprecated
+    _a = props.ariaPosInSet, 
+    // eslint-disable-next-line @typescript-eslint/no-deprecated
+    ariaPosInSet = _a === void 0 ? props.positionInSet : _a, 
+    // eslint-disable-next-line @typescript-eslint/no-deprecated
+    _b = props.ariaSetSize, 
+    // eslint-disable-next-line @typescript-eslint/no-deprecated
+    ariaSetSize = _b === void 0 ? props.setSize : _b, styles = props.styles, doNotContainWithinFocusZone = props.doNotContainWithinFocusZone;
+    var htmlProps = (0, Utilities_1.getNativeProps)(props, Utilities_1.htmlElementProperties, 
+    // avoid applying onBlur on the table if it's being used in the FocusZone
+    doNotContainWithinFocusZone ? [] : ['onBlur']);
+    var classNames = getClassNames(styles, { theme: props.theme });
+    // Array to store the cells in the correct row index
+    var rowsOfItems = (0, Utilities_1.toMatrix)(items, columnCount);
+    var content = (React.createElement("table", tslib_1.__assign({ "aria-posinset": ariaPosInSet, "aria-setsize": ariaSetSize, id: id, role: isSemanticRadio ? 'radiogroup' : 'grid' }, htmlProps, { className: classNames.root }),
+        React.createElement("tbody", { role: isSemanticRadio ? 'presentation' : 'rowgroup' }, rowsOfItems.map(function (rows, rowIndex) {
+            return (React.createElement("tr", { role: isSemanticRadio ? 'presentation' : 'row', key: rowIndex }, rows.map(function (cell, cellIndex) {
+                return (React.createElement("td", { role: "presentation", key: cellIndex + '-cell', className: classNames.tableCell }, onRenderItem(cell, cellIndex)));
+            })));
+        }))));
+    return doNotContainWithinFocusZone ? (content) : (React.createElement(FocusZone_1.FocusZone
+    // eslint-disable-next-line @typescript-eslint/no-deprecated
+    , { 
+        // eslint-disable-next-line @typescript-eslint/no-deprecated
+        elementRef: forwardedRef, isCircularNavigation: props.shouldFocusCircularNavigate, className: classNames.focusedContainer, onBlur: props.onBlur }, content));
+});
+//# sourceMappingURL=ButtonGrid.base.js.map

node_modules/@fluentui/react/lib-commonjs/utilities/ButtonGrid/ButtonGrid.base.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonGrid.base.js","sourceRoot":"../src/","sources":["utilities/ButtonGrid/ButtonGrid.base.tsx"],"names":[],"mappings":";;;;AAAA,6BAA+B;AAC/B,6CAAsG;AACtG,6CAA4C;AAC5C,qDAA8C;AAG9C,IAAM,aAAa,GAAG,IAAA,8BAAkB,GAA4C,CAAC;AAExE,QAAA,cAAc,GAA8C,KAAK,CAAC,UAAU,CAGvF,UAAC,KAAK,EAAE,YAAY;IACpB,IAAM,EAAE,GAAG,IAAA,mBAAK,EAAC,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,CAAC;IAGpC,IAAA,KAAK,GAUH,KAAK,MAVF,EACL,WAAW,GAST,KAAK,YATI,EACX,YAAY,GAQV,KAAK,aARK,EACZ,eAAe,GAOb,KAAK,gBAPQ;IACf,4DAA4D;IAC5D,KAKE,KAAK,aAL2B;IADlC,4DAA4D;IAC5D,YAAY,mBAAG,KAAK,CAAC,aAAa,KAAA;IAClC,4DAA4D;IAC5D,KAGE,KAAK,YAHoB;IAD3B,4DAA4D;IAC5D,WAAW,mBAAG,KAAK,CAAC,OAAO,KAAA,EAC3B,MAAM,GAEJ,KAAK,OAFD,EACN,2BAA2B,GACzB,KAAK,4BADoB,CACnB;IAEV,IAAM,SAAS,GAAG,IAAA,0BAAc,EAC9B,KAAK,EACL,iCAAqB;IACrB,yEAAyE;IACzE,2BAA2B,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,CAC9C,CAAC;IAEF,IAAM,UAAU,GAAG,aAAa,CAAC,MAAO,EAAE,EAAE,KAAK,EAAE,KAAK,CAAC,KAAM,EAAE,CAAC,CAAC;IAEnE,oDAAoD;IACpD,IAAM,WAAW,GAAY,IAAA,oBAAQ,EAAC,KAAK,EAAE,WAAW,CAAC,CAAC;IAE1D,IAAM,OAAO,GAAG,CACd,iEACiB,YAAY,kBACb,WAAW,EACzB,EAAE,EAAE,EAAE,EACN,IAAI,EAAE,eAAe,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,MAAM,IACzC,SAAS,IACb,SAAS,EAAE,UAAU,CAAC,IAAI;QAE1B,+BAAO,IAAI,EAAE,eAAe,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,UAAU,IACvD,WAAW,CAAC,GAAG,CAAC,UAAC,IAAI,EAAE,QAAQ;YAC9B,OAAO,CACL,4BAAI,IAAI,EAAE,eAAe,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,KAAK,EAAE,GAAG,EAAE,QAAQ,IAC9D,IAAI,CAAC,GAAG,CAAC,UAAC,IAAI,EAAE,SAAiB;gBAChC,OAAO,CACL,4BAAI,IAAI,EAAC,cAAc,EAAC,GAAG,EAAE,SAAS,GAAG,OAAO,EAAE,SAAS,EAAE,UAAU,CAAC,SAAS,IAC9E,YAAY,CAAC,IAAI,EAAE,SAAS,CAAC,CAC3B,CACN,CAAC;YACJ,CAAC,CAAC,CACC,CACN,CAAC;QACJ,CAAC,CAAC,CACI,CACF,CACT,CAAC;IAEF,OAAO,2BAA2B,CAAC,CAAC,CAAC,CACnC,OAAO,CACR,CAAC,CAAC,CAAC,CACF,oBAAC,qBAAS;IACR,4DAA4D;;QAA5D,4DAA4D;QAC5D,UAAU,EAAE,YAAY,EACxB,oBAAoB,EAAE,KAAK,CAAC,2BAA2B,EACvD,SAAS,EAAE,UAAU,CAAC,gBAAgB,EACtC,MAAM,EAAE,KAAK,CAAC,MAAM,IAEnB,OAAO,CACE,CACb,CAAC;AACJ,CAAC,CAAC,CAAC","sourcesContent":["import * as React from 'react';\nimport { toMatrix, classNamesFunction, getNativeProps, htmlElementProperties } from '../../Utilities';\nimport { FocusZone } from '../../FocusZone';\nimport { useId } from '@fluentui/react-hooks';\nimport type { IButtonGridProps, IButtonGridStyleProps, IButtonGridStyles } from './ButtonGrid.types';\n\nconst getClassNames = classNamesFunction<IButtonGridStyleProps, IButtonGridStyles>();\n\nexport const ButtonGridBase: React.FunctionComponent<IButtonGridProps> = React.forwardRef<\n  HTMLElement,\n  IButtonGridProps\n>((props, forwardedRef) => {\n  const id = useId(undefined, props.id);\n\n  const {\n    items,\n    columnCount,\n    onRenderItem,\n    isSemanticRadio,\n    // eslint-disable-next-line @typescript-eslint/no-deprecated\n    ariaPosInSet = props.positionInSet,\n    // eslint-disable-next-line @typescript-eslint/no-deprecated\n    ariaSetSize = props.setSize,\n    styles,\n    doNotContainWithinFocusZone,\n  } = props;\n\n  const htmlProps = getNativeProps<React.HTMLAttributes<HTMLTableElement>>(\n    props,\n    htmlElementProperties,\n    // avoid applying onBlur on the table if it's being used in the FocusZone\n    doNotContainWithinFocusZone ? [] : ['onBlur'],\n  );\n\n  const classNames = getClassNames(styles!, { theme: props.theme! });\n\n  // Array to store the cells in the correct row index\n  const rowsOfItems: any[][] = toMatrix(items, columnCount);\n\n  const content = (\n    <table\n      aria-posinset={ariaPosInSet}\n      aria-setsize={ariaSetSize}\n      id={id}\n      role={isSemanticRadio ? 'radiogroup' : 'grid'}\n      {...htmlProps}\n      className={classNames.root}\n    >\n      <tbody role={isSemanticRadio ? 'presentation' : 'rowgroup'}>\n        {rowsOfItems.map((rows, rowIndex) => {\n          return (\n            <tr role={isSemanticRadio ? 'presentation' : 'row'} key={rowIndex}>\n              {rows.map((cell, cellIndex: number) => {\n                return (\n                  <td role=\"presentation\" key={cellIndex + '-cell'} className={classNames.tableCell}>\n                    {onRenderItem(cell, cellIndex)}\n                  </td>\n                );\n              })}\n            </tr>\n          );\n        })}\n      </tbody>\n    </table>\n  );\n\n  return doNotContainWithinFocusZone ? (\n    content\n  ) : (\n    <FocusZone\n      // eslint-disable-next-line @typescript-eslint/no-deprecated\n      elementRef={forwardedRef}\n      isCircularNavigation={props.shouldFocusCircularNavigate}\n      className={classNames.focusedContainer}\n      onBlur={props.onBlur}\n    >\n      {content}\n    </FocusZone>\n  );\n});\n"]}

node_modules/@fluentui/react/lib-commonjs/utilities/ButtonGrid/ButtonGrid.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+import type { IButtonGridProps } from './ButtonGrid.types';
+export declare const ButtonGrid: React.FunctionComponent<IButtonGridProps>;

node_modules/@fluentui/react/lib-commonjs/utilities/ButtonGrid/ButtonGrid.js

@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ButtonGrid = void 0;
+var Utilities_1 = require("../../Utilities");
+var ButtonGrid_base_1 = require("./ButtonGrid.base");
+var ButtonGrid_styles_1 = require("./ButtonGrid.styles");
+exports.ButtonGrid = (0, Utilities_1.styled)(ButtonGrid_base_1.ButtonGridBase, ButtonGrid_styles_1.getStyles);
+exports.ButtonGrid.displayName = 'ButtonGrid';
+//# sourceMappingURL=ButtonGrid.js.map

node_modules/@fluentui/react/lib-commonjs/utilities/ButtonGrid/ButtonGrid.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonGrid.js","sourceRoot":"../src/","sources":["utilities/ButtonGrid/ButtonGrid.tsx"],"names":[],"mappings":";;;AACA,6CAAyC;AACzC,qDAAmD;AACnD,yDAAgD;AAGnC,QAAA,UAAU,GAA8C,IAAA,kBAAM,EAKzE,gCAAc,EAAE,6BAAS,CAAC,CAAC;AAC7B,kBAAU,CAAC,WAAW,GAAG,YAAY,CAAC","sourcesContent":["import * as React from 'react';\nimport { styled } from '../../Utilities';\nimport { ButtonGridBase } from './ButtonGrid.base';\nimport { getStyles } from './ButtonGrid.styles';\nimport type { IButtonGridProps, IButtonGridStyleProps, IButtonGridStyles } from './ButtonGrid.types';\n\nexport const ButtonGrid: React.FunctionComponent<IButtonGridProps> = styled<\n  IButtonGridProps,\n  IButtonGridStyleProps,\n  IButtonGridStyles,\n  HTMLElement\n>(ButtonGridBase, getStyles);\nButtonGrid.displayName = 'ButtonGrid';\n"]}

node_modules/@fluentui/react/lib-commonjs/utilities/ButtonGrid/ButtonGrid.styles.d.ts

@@ -0,0 +1,2 @@
+import type { IButtonGridStyleProps, IButtonGridStyles } from './ButtonGrid.types';
+export declare const getStyles: (props: IButtonGridStyleProps) => IButtonGridStyles;

node_modules/@fluentui/react/lib-commonjs/utilities/ButtonGrid/ButtonGrid.styles.js

@@ -0,0 +1,16 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getStyles = void 0;
+var getStyles = function (props) {
+    return {
+        root: {
+            padding: 2,
+            outline: 'none',
+        },
+        tableCell: {
+            padding: 0,
+        },
+    };
+};
+exports.getStyles = getStyles;
+//# sourceMappingURL=ButtonGrid.styles.js.map

node_modules/@fluentui/react/lib-commonjs/utilities/ButtonGrid/ButtonGrid.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonGrid.styles.js","sourceRoot":"../src/","sources":["utilities/ButtonGrid/ButtonGrid.styles.ts"],"names":[],"mappings":";;;AAEO,IAAM,SAAS,GAAG,UAAC,KAA4B;IACpD,OAAO;QACL,IAAI,EAAE;YACJ,OAAO,EAAE,CAAC;YACV,OAAO,EAAE,MAAM;SAChB;QACD,SAAS,EAAE;YACT,OAAO,EAAE,CAAC;SACX;KACF,CAAC;AACJ,CAAC,CAAC;AAVW,QAAA,SAAS,aAUpB","sourcesContent":["import type { IButtonGridStyleProps, IButtonGridStyles } from './ButtonGrid.types';\n\nexport const getStyles = (props: IButtonGridStyleProps): IButtonGridStyles => {\n  return {\n    root: {\n      padding: 2,\n      outline: 'none',\n    },\n    tableCell: {\n      padding: 0,\n    },\n  };\n};\n"]}

node_modules/@fluentui/react/lib-commonjs/utilities/ButtonGrid/ButtonGrid.types.d.ts

@@ -0,0 +1,102 @@
+import * as React from 'react';
+import type { IStyle, ITheme } from '../../Styling';
+import type { IRefObject, IStyleFunctionOrObject } from '../../Utilities';
+import type { JSXElement } from '@fluentui/utilities';
+export interface IButtonGrid {
+}
+export interface IButtonGridProps extends React.TableHTMLAttributes<HTMLTableElement>, React.RefAttributes<HTMLElement> {
+    /**
+     * Gets the component ref.
+     */
+    componentRef?: IRefObject<IButtonGrid>;
+    /**
+     * Items to display in a ButtonGrid with the specified number of columns
+     */
+    items: any[];
+    /**
+     * The number of columns
+     */
+    columnCount: number;
+    /**
+     * Custom renderer for the individual items
+     */
+    onRenderItem: (item: any, index: number) => JSXElement;
+    /**
+     * Whether focus should cycle back to the beginning once the user navigates past the end (and vice versa).
+     * Only relevant if `doNotContainWithinFocusZone` is not true.
+     */
+    shouldFocusCircularNavigate?: boolean;
+    /**
+     * If false (the default), the ButtonGrid is contained inside a FocusZone.
+     * If true, a FocusZone is not used.
+     * @default false
+     */
+    doNotContainWithinFocusZone?: boolean;
+    /**
+     * Class name for the FocusZone container for the ButtonGrid.
+     * @deprecated Use `styles.focusedContainer` to define styling for the focus zone container
+     */
+    containerClassName?: string;
+    /**
+     * Handler for when focus leaves the ButtonGrid.
+     */
+    onBlur?: () => void;
+    /**
+     * If true, uses radiogroup semantics for the ButtonGrid.
+     * This should be set to true for single-row grids, for two reasons:
+     *   1. Radios are a more simple and understandable control,
+     *      and a better fit for a single-dimensional selection control
+     *   2. Multiple browsers use heuristics to strip table and grid roles from single-row tables with no column headers.
+     */
+    isSemanticRadio?: boolean;
+    /**
+     * Position this ButtonGrid is in the parent set (index in a parent menu, for example)
+     */
+    ariaPosInSet?: number;
+    /**
+     * @deprecated Use `ariaPosInSet`
+     */
+    positionInSet?: number;
+    /**
+     * Size of the parent set (size of parent menu, for example)
+     */
+    ariaSetSize?: number;
+    /**
+     * @deprecated Use `ariaSetSize`
+     */
+    setSize?: number;
+    /**
+     * Theme to apply to the component.
+     */
+    theme?: ITheme;
+    /**
+     * Optional styles for the component.
+     */
+    styles?: IStyleFunctionOrObject<IButtonGridStyleProps, IButtonGridStyles>;
+}
+/**
+ * Properties required to build the styles for the ButtonGrid component.
+ */
+export interface IButtonGridStyleProps {
+    /**
+     * Theme to apply to the ButtonGrid
+     */
+    theme: ITheme;
+}
+/**
+ * Styles for the ButtonGrid Component.
+ */
+export interface IButtonGridStyles {
+    /**
+     * Style for the table container of a ButtonGrid.
+     */
+    root: IStyle;
+    /**
+     * Style for the table cells of the ButtonGrid.
+     */
+    tableCell: IStyle;
+    /**
+     * Style for the FocusZone container for the ButtonGrid.
+     */
+    focusedContainer?: IStyle;
+}

node_modules/@fluentui/react/lib-commonjs/utilities/ButtonGrid/ButtonGrid.types.js

@@ -0,0 +1,3 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+//# sourceMappingURL=ButtonGrid.types.js.map

node_modules/@fluentui/react/lib-commonjs/utilities/ButtonGrid/ButtonGrid.types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonGrid.types.js","sourceRoot":"../src/","sources":["utilities/ButtonGrid/ButtonGrid.types.ts"],"names":[],"mappings":"","sourcesContent":["import * as React from 'react';\nimport type { IStyle, ITheme } from '../../Styling';\nimport type { IRefObject, IStyleFunctionOrObject } from '../../Utilities';\n\nimport type { JSXElement } from '@fluentui/utilities';\n\nexport interface IButtonGrid {}\n\nexport interface IButtonGridProps\n  extends React.TableHTMLAttributes<HTMLTableElement>,\n    React.RefAttributes<HTMLElement> {\n  /**\n   * Gets the component ref.\n   */\n  componentRef?: IRefObject<IButtonGrid>;\n\n  /**\n   * Items to display in a ButtonGrid with the specified number of columns\n   */\n  items: any[];\n\n  /**\n   * The number of columns\n   */\n  columnCount: number;\n\n  /**\n   * Custom renderer for the individual items\n   */\n\n  onRenderItem: (item: any, index: number) => JSXElement;\n\n  /**\n   * Whether focus should cycle back to the beginning once the user navigates past the end (and vice versa).\n   * Only relevant if `doNotContainWithinFocusZone` is not true.\n   */\n  shouldFocusCircularNavigate?: boolean;\n\n  /**\n   * If false (the default), the ButtonGrid is contained inside a FocusZone.\n   * If true, a FocusZone is not used.\n   * @default false\n   */\n  doNotContainWithinFocusZone?: boolean;\n\n  /**\n   * Class name for the FocusZone container for the ButtonGrid.\n   * @deprecated Use `styles.focusedContainer` to define styling for the focus zone container\n   */\n  containerClassName?: string;\n\n  /**\n   * Handler for when focus leaves the ButtonGrid.\n   */\n  onBlur?: () => void;\n\n  /**\n   * If true, uses radiogroup semantics for the ButtonGrid.\n   * This should be set to true for single-row grids, for two reasons:\n   *   1. Radios are a more simple and understandable control,\n   *      and a better fit for a single-dimensional selection control\n   *   2. Multiple browsers use heuristics to strip table and grid roles from single-row tables with no column headers.\n   */\n  isSemanticRadio?: boolean;\n\n  /**\n   * Position this ButtonGrid is in the parent set (index in a parent menu, for example)\n   */\n  ariaPosInSet?: number;\n\n  /**\n   * @deprecated Use `ariaPosInSet`\n   */\n  positionInSet?: number;\n\n  /**\n   * Size of the parent set (size of parent menu, for example)\n   */\n  ariaSetSize?: number;\n\n  /**\n   * @deprecated Use `ariaSetSize`\n   */\n  setSize?: number;\n\n  /**\n   * Theme to apply to the component.\n   */\n  theme?: ITheme;\n\n  /**\n   * Optional styles for the component.\n   */\n  styles?: IStyleFunctionOrObject<IButtonGridStyleProps, IButtonGridStyles>;\n}\n\n/**\n * Properties required to build the styles for the ButtonGrid component.\n */\nexport interface IButtonGridStyleProps {\n  /**\n   * Theme to apply to the ButtonGrid\n   */\n  theme: ITheme;\n}\n\n/**\n * Styles for the ButtonGrid Component.\n */\nexport interface IButtonGridStyles {\n  /**\n   * Style for the table container of a ButtonGrid.\n   */\n  root: IStyle;\n\n  /**\n   * Style for the table cells of the ButtonGrid.\n   */\n  tableCell: IStyle;\n\n  /**\n   * Style for the FocusZone container for the ButtonGrid.\n   */\n  focusedContainer?: IStyle;\n}\n"]}

node_modules/@fluentui/react/lib-commonjs/utilities/ButtonGrid/ButtonGridCell.d.ts

@@ -0,0 +1,3 @@
+import type { IButtonGridCellProps } from './ButtonGridCell.types';
+import type { JSXElement } from '@fluentui/utilities';
+export declare const ButtonGridCell: <T, P extends IButtonGridCellProps<T>>(props: IButtonGridCellProps<T>) => JSXElement;

node_modules/@fluentui/react/lib-commonjs/utilities/ButtonGrid/ButtonGridCell.js

@@ -0,0 +1,48 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ButtonGridCell = void 0;
+var tslib_1 = require("tslib");
+var React = require("react");
+var Utilities_1 = require("../../Utilities");
+var Button_1 = require("../../Button");
+var react_hooks_1 = require("@fluentui/react-hooks");
+var ButtonGridCell = function (props) {
+    var _a;
+    var defaultId = (0, react_hooks_1.useId)('gridCell');
+    var item = props.item, _b = props.id, id = _b === void 0 ? defaultId : _b, className = props.className, selected = props.selected, _c = props.disabled, disabled = _c === void 0 ? false : _c, onRenderItem = props.onRenderItem, cellDisabledStyle = props.cellDisabledStyle, cellIsSelectedStyle = props.cellIsSelectedStyle, index = props.index, label = props.label, getClassNames = props.getClassNames, onClick = props.onClick, onHover = props.onHover, onMouseMove = props.onMouseMove, onMouseLeave = props.onMouseLeave, onMouseEnter = props.onMouseEnter, onFocus = props.onFocus;
+    var buttonProps = (0, Utilities_1.getNativeProps)(props, Utilities_1.buttonProperties);
+    var handleClick = React.useCallback(function (event) {
+        if (onClick && !disabled) {
+            onClick(item, event);
+        }
+    }, [disabled, item, onClick]);
+    var handleMouseEnter = React.useCallback(function (ev) {
+        var didUpdateOnEnter = onMouseEnter && onMouseEnter(ev);
+        if (!didUpdateOnEnter && onHover && !disabled) {
+            onHover(item, ev);
+        }
+    }, [disabled, item, onHover, onMouseEnter]);
+    var handleMouseMove = React.useCallback(function (ev) {
+        var didUpdateOnMove = onMouseMove && onMouseMove(ev);
+        if (!didUpdateOnMove && onHover && !disabled) {
+            onHover(item, ev);
+        }
+    }, [disabled, item, onHover, onMouseMove]);
+    var handleMouseLeave = React.useCallback(function (ev) {
+        var didUpdateOnLeave = onMouseLeave && onMouseLeave(ev);
+        if (!didUpdateOnLeave && onHover && !disabled) {
+            onHover(undefined, ev);
+        }
+    }, [disabled, onHover, onMouseLeave]);
+    var handleFocus = React.useCallback(function (event) {
+        if (onFocus && !disabled) {
+            onFocus(item, event);
+        }
+    }, [disabled, item, onFocus]);
+    return (React.createElement(Button_1.CommandButton, tslib_1.__assign({ id: id, "data-index": index, "data-is-focusable": true, "aria-selected": selected, ariaLabel: label, title: label }, buttonProps, { className: (0, Utilities_1.css)(className, (_a = {},
+            _a['' + cellIsSelectedStyle] = selected,
+            _a['' + cellDisabledStyle] = disabled,
+            _a)), onClick: handleClick, onMouseEnter: handleMouseEnter, onMouseMove: handleMouseMove, onMouseLeave: handleMouseLeave, onFocus: handleFocus, getClassNames: getClassNames }), onRenderItem(item)));
+};
+exports.ButtonGridCell = ButtonGridCell;
+//# sourceMappingURL=ButtonGridCell.js.map

node_modules/@fluentui/react/lib-commonjs/utilities/ButtonGrid/ButtonGridCell.types.d.ts

@@ -0,0 +1,63 @@
+import * as React from 'react';
+import type { IButtonClassNames } from '../../components/Button/BaseButton.classNames';
+import type { ITheme } from '../../Styling';
+import type { JSXElement } from '@fluentui/utilities';
+export interface IButtonGridCellProps<T> {
+    /**
+     * The option that will be made available to the user
+     */
+    item: T;
+    /**
+     * Arbitrary unique string associated with this option
+     */
+    id: string;
+    /**
+     * If the this option should be disabled
+     */
+    disabled?: boolean;
+    /**
+     * If the cell is currently selected
+     */
+    selected?: boolean;
+    onClick?: (item: T, event?: React.MouseEvent<HTMLButtonElement>) => void;
+    /**
+     * The render callback to handle rendering the item
+     */
+    onRenderItem: (item: T) => JSXElement;
+    onHover?: (item?: T, event?: React.MouseEvent<HTMLButtonElement>) => void;
+    onFocus?: (item: T, event?: React.FocusEvent<HTMLButtonElement>) => void;
+    /**
+     * The accessible role for this option
+     */
+    role?: string;
+    /**
+     * className(s) to apply
+     */
+    className?: string;
+    /**
+     * CSS classes to apply when the cell is disabled
+     */
+    cellDisabledStyle?: string[];
+    /**
+     * CSS classes to apply when the cell is selected
+     */
+    cellIsSelectedStyle?: string[];
+    /**
+     * Index for this option
+     */
+    index?: number;
+    /**
+     * The label for this item.
+     */
+    label?: string;
+    /**
+     * Method to provide the classnames to style a button.
+     * The default value for this prop is `getClassnames` defined in `BaseButton.classNames`.
+     */
+    getClassNames?: (theme: ITheme, className: string, variantClassName: string, iconClassName: string | undefined, menuIconClassName: string | undefined, disabled: boolean, checked: boolean, expanded: boolean, isSplit: boolean | undefined) => IButtonClassNames;
+    onMouseEnter?: (ev: React.MouseEvent<HTMLButtonElement>) => boolean;
+    onMouseMove?: (ev: React.MouseEvent<HTMLButtonElement>) => boolean;
+    onMouseLeave?: (ev: React.MouseEvent<HTMLButtonElement>) => void;
+    onWheel?: (ev: React.MouseEvent<HTMLButtonElement>) => void;
+    onKeyDown?: (ev: React.KeyboardEvent<HTMLButtonElement>) => void;
+}

node_modules/@fluentui/react/lib-commonjs/utilities/ButtonGrid/ButtonGridCell.types.js

@@ -0,0 +1,3 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+//# sourceMappingURL=ButtonGridCell.types.js.map

node_modules/@fluentui/react/lib-commonjs/utilities/ButtonGrid/ButtonGridCell.types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonGridCell.types.js","sourceRoot":"../src/","sources":["utilities/ButtonGrid/ButtonGridCell.types.ts"],"names":[],"mappings":"","sourcesContent":["import * as React from 'react';\nimport type { IButtonClassNames } from '../../components/Button/BaseButton.classNames';\nimport type { ITheme } from '../../Styling';\n\nimport type { JSXElement } from '@fluentui/utilities';\n\nexport interface IButtonGridCellProps<T> {\n  /**\n   * The option that will be made available to the user\n   */\n  item: T;\n\n  /**\n   * Arbitrary unique string associated with this option\n   */\n  id: string;\n\n  /**\n   * If the this option should be disabled\n   */\n  disabled?: boolean;\n\n  /**\n   * If the cell is currently selected\n   */\n  selected?: boolean;\n\n  onClick?: (item: T, event?: React.MouseEvent<HTMLButtonElement>) => void;\n\n  /**\n   * The render callback to handle rendering the item\n   */\n  onRenderItem: (item: T) => JSXElement;\n\n  onHover?: (item?: T, event?: React.MouseEvent<HTMLButtonElement>) => void;\n\n  onFocus?: (item: T, event?: React.FocusEvent<HTMLButtonElement>) => void;\n\n  /**\n   * The accessible role for this option\n   */\n  role?: string;\n\n  /**\n   * className(s) to apply\n   */\n  className?: string;\n\n  /**\n   * CSS classes to apply when the cell is disabled\n   */\n  cellDisabledStyle?: string[];\n\n  /**\n   * CSS classes to apply when the cell is selected\n   */\n  cellIsSelectedStyle?: string[];\n\n  /**\n   * Index for this option\n   */\n  index?: number;\n\n  /**\n   * The label for this item.\n   */\n  label?: string;\n\n  /**\n   * Method to provide the classnames to style a button.\n   * The default value for this prop is `getClassnames` defined in `BaseButton.classNames`.\n   */\n  getClassNames?: (\n    theme: ITheme,\n    className: string,\n    variantClassName: string,\n    iconClassName: string | undefined,\n    menuIconClassName: string | undefined,\n    disabled: boolean,\n    checked: boolean,\n    expanded: boolean,\n    isSplit: boolean | undefined,\n  ) => IButtonClassNames;\n\n  onMouseEnter?: (ev: React.MouseEvent<HTMLButtonElement>) => boolean;\n\n  onMouseMove?: (ev: React.MouseEvent<HTMLButtonElement>) => boolean;\n\n  onMouseLeave?: (ev: React.MouseEvent<HTMLButtonElement>) => void;\n\n  onWheel?: (ev: React.MouseEvent<HTMLButtonElement>) => void;\n\n  onKeyDown?: (ev: React.KeyboardEvent<HTMLButtonElement>) => void;\n}\n"]}

node_modules/@fluentui/react/lib-commonjs/utilities/ButtonGrid/index.d.ts

@@ -0,0 +1,4 @@
+export * from './ButtonGrid';
+export * from './ButtonGrid.types';
+export * from './ButtonGridCell';
+export * from './ButtonGridCell.types';

node_modules/@fluentui/react/lib-commonjs/utilities/ButtonGrid/index.js

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./ButtonGrid"), exports);
+tslib_1.__exportStar(require("./ButtonGrid.types"), exports);
+tslib_1.__exportStar(require("./ButtonGridCell"), exports);
+tslib_1.__exportStar(require("./ButtonGridCell.types"), exports);
+//# sourceMappingURL=index.js.map

node_modules/@fluentui/react/lib-commonjs/utilities/ButtonGrid/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"../src/","sources":["utilities/ButtonGrid/index.ts"],"names":[],"mappings":";;;AAAA,uDAA6B;AAC7B,6DAAmC;AACnC,2DAAiC;AACjC,iEAAuC","sourcesContent":["export * from './ButtonGrid';\nexport * from './ButtonGrid.types';\nexport * from './ButtonGridCell';\nexport * from './ButtonGridCell.types';\n"]}