first commit

node_modules/@fluentui/react/lib-commonjs/components/FloatingPicker/Suggestions/Suggestions.types.d.ts

@@ -0,0 +1,97 @@
+import * as React from 'react';
+import type { ISuggestionModel, ISuggestionItemProps } from '../../../Pickers';
+import type { IPersonaProps } from '../../../Persona';
+import type { IRefObject } from '../../../Utilities';
+import type { JSXElement } from '@fluentui/utilities';
+export interface ISuggestionsCoreProps<T> extends React.ClassAttributes<any> {
+    /**
+     * Gets the component ref.
+     */
+    componentRef?: IRefObject<{}>;
+    /**
+     * How the suggestion should look in the suggestion list.
+     */
+    onRenderSuggestion?: (props: T, suggestionItemProps: ISuggestionItemProps<T>) => JSXElement;
+    /**
+     * What should occur when a suggestion is clicked
+     */
+    onSuggestionClick: (ev?: React.MouseEvent<HTMLElement>, item?: any, index?: number) => void;
+    /**
+     * The list of Suggestions that will be displayed
+     */
+    suggestions: ISuggestionModel<T>[];
+    /**
+     * Function to fire when one of the optional remove buttons on a suggestion is clicked.
+     */
+    onSuggestionRemove?: (ev?: React.MouseEvent<HTMLElement>, item?: IPersonaProps, index?: number) => void;
+    /**
+     * Screen reader message to read when there are suggestions available.
+     */
+    suggestionsAvailableAlertText?: string;
+    /**
+     * An ARIA label for the container that is the parent of the suggestions.
+     */
+    suggestionsContainerAriaLabel?: string;
+    /**
+     * the classname of the suggestion item.
+     */
+    suggestionsItemClassName?: string;
+    /**
+     * Maximum number of suggestions to show in the full suggestion list.
+     */
+    resultsMaximumNumber?: number;
+    /**
+     * Indicates whether to show a button with each suggestion to remove that suggestion.
+     */
+    showRemoveButtons?: boolean;
+    /**
+     * Indicates whether to loop around to the top or bottom of the suggestions
+     * on calling nextSuggestion and previousSuggestion, respectively
+     */
+    shouldLoopSelection: boolean;
+}
+export interface ISuggestionsControlProps<T> extends React.ClassAttributes<any>, ISuggestionsCoreProps<T> {
+    /**
+     * An ARIA label for the container that is the parent of the suggestions header items.
+     */
+    suggestionsHeaderContainerAriaLabel?: string;
+    /**
+     * An ARIA label for the container that is the parent of the suggestions footer items.
+     */
+    suggestionsFooterContainerAriaLabel?: string;
+    /**
+     * The header items props
+     */
+    headerItemsProps?: ISuggestionsHeaderFooterProps[];
+    /**
+     * The footer items props
+     */
+    footerItemsProps?: ISuggestionsHeaderFooterProps[];
+    /**
+     * Whether or not the first selectable item in the suggestions list should be selected
+     */
+    shouldSelectFirstItem?: () => boolean;
+    /**
+     * The CSS classname of the suggestions list.
+     */
+    className?: string;
+    /**
+     * Completes the suggestion
+     */
+    completeSuggestion: () => void;
+}
+export interface ISuggestionsHeaderFooterProps {
+    renderItem: () => JSXElement;
+    onExecute?: () => void;
+    className?: string;
+    ariaLabel?: string;
+    shouldShow: () => boolean;
+}
+export interface ISuggestionsHeaderFooterItemProps {
+    componentRef?: IRefObject<{}>;
+    renderItem: () => JSXElement;
+    onExecute?: () => void;
+    isSelected: boolean;
+    id: string;
+    className: string | undefined;
+}

node_modules/@fluentui/react/lib-commonjs/components/FloatingPicker/Suggestions/Suggestions.types.js

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

node_modules/@fluentui/react/lib-commonjs/components/FloatingPicker/Suggestions/Suggestions.types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Suggestions.types.js","sourceRoot":"../src/","sources":["components/FloatingPicker/Suggestions/Suggestions.types.ts"],"names":[],"mappings":"","sourcesContent":["import * as React from 'react';\nimport type { ISuggestionModel, ISuggestionItemProps } from '../../../Pickers';\nimport type { IPersonaProps } from '../../../Persona';\nimport type { IRefObject } from '../../../Utilities';\n\nimport type { JSXElement } from '@fluentui/utilities';\n\nexport interface ISuggestionsCoreProps<T> extends React.ClassAttributes<any> {\n  /**\n   * Gets the component ref.\n   */\n  componentRef?: IRefObject<{}>;\n  /**\n   * How the suggestion should look in the suggestion list.\n   */\n\n  onRenderSuggestion?: (props: T, suggestionItemProps: ISuggestionItemProps<T>) => JSXElement;\n\n  /**\n   * What should occur when a suggestion is clicked\n   */\n  onSuggestionClick: (ev?: React.MouseEvent<HTMLElement>, item?: any, index?: number) => void;\n  /**\n   * The list of Suggestions that will be displayed\n   */\n  suggestions: ISuggestionModel<T>[];\n  /**\n   * Function to fire when one of the optional remove buttons on a suggestion is clicked.\n   */\n  onSuggestionRemove?: (ev?: React.MouseEvent<HTMLElement>, item?: IPersonaProps, index?: number) => void;\n  /**\n   * Screen reader message to read when there are suggestions available.\n   */\n  suggestionsAvailableAlertText?: string;\n  /**\n   * An ARIA label for the container that is the parent of the suggestions.\n   */\n  suggestionsContainerAriaLabel?: string;\n  /**\n   * the classname of the suggestion item.\n   */\n  suggestionsItemClassName?: string;\n  /**\n   * Maximum number of suggestions to show in the full suggestion list.\n   */\n  resultsMaximumNumber?: number;\n  /**\n   * Indicates whether to show a button with each suggestion to remove that suggestion.\n   */\n  showRemoveButtons?: boolean;\n  /**\n   * Indicates whether to loop around to the top or bottom of the suggestions\n   * on calling nextSuggestion and previousSuggestion, respectively\n   */\n  shouldLoopSelection: boolean;\n}\n\nexport interface ISuggestionsControlProps<T> extends React.ClassAttributes<any>, ISuggestionsCoreProps<T> {\n  /**\n   * An ARIA label for the container that is the parent of the suggestions header items.\n   */\n  suggestionsHeaderContainerAriaLabel?: string;\n  /**\n   * An ARIA label for the container that is the parent of the suggestions footer items.\n   */\n  suggestionsFooterContainerAriaLabel?: string;\n  /**\n   * The header items props\n   */\n  headerItemsProps?: ISuggestionsHeaderFooterProps[];\n  /**\n   * The footer items props\n   */\n  footerItemsProps?: ISuggestionsHeaderFooterProps[];\n  /**\n   * Whether or not the first selectable item in the suggestions list should be selected\n   */\n  shouldSelectFirstItem?: () => boolean;\n  /**\n   * The CSS classname of the suggestions list.\n   */\n  className?: string;\n  /**\n   * Completes the suggestion\n   */\n  completeSuggestion: () => void;\n}\n\nexport interface ISuggestionsHeaderFooterProps {\n  renderItem: () => JSXElement;\n  onExecute?: () => void;\n  className?: string;\n  ariaLabel?: string;\n  shouldShow: () => boolean;\n}\n\nexport interface ISuggestionsHeaderFooterItemProps {\n  componentRef?: IRefObject<{}>;\n\n  renderItem: () => JSXElement;\n  onExecute?: () => void;\n  isSelected: boolean;\n  id: string;\n  className: string | undefined;\n}\n"]}

node_modules/@fluentui/react/lib-commonjs/components/FloatingPicker/Suggestions/SuggestionsControl.d.ts

@@ -0,0 +1,88 @@
+import * as React from 'react';
+import { SuggestionsCore } from './SuggestionsCore';
+import type { IButton } from '../../../Button';
+import type { ISuggestionModel } from '../../../Pickers';
+import type { ISuggestionsHeaderFooterItemProps, ISuggestionsControlProps } from './Suggestions.types';
+import type { JSXElement } from '@fluentui/utilities';
+export declare enum SuggestionItemType {
+    header = 0,
+    suggestion = 1,
+    footer = 2
+}
+export interface ISuggestionsControlState<T> {
+    selectedHeaderIndex: number;
+    selectedFooterIndex: number;
+    suggestions: ISuggestionModel<T>[];
+}
+export declare class SuggestionsHeaderFooterItem extends React.Component<ISuggestionsHeaderFooterItemProps, {}> {
+    constructor(props: ISuggestionsHeaderFooterItemProps);
+    render(): JSXElement;
+}
+/**
+ * Class when used with SuggestionsStore, renders a suggestions control with customizable headers and footers
+ */
+export declare class SuggestionsControl<T extends {}> extends React.Component<ISuggestionsControlProps<T>, ISuggestionsControlState<T>> {
+    protected _forceResolveButton: IButton;
+    protected _searchForMoreButton: IButton;
+    protected _selectedElement: React.RefObject<HTMLDivElement | null>;
+    protected _suggestions: React.RefObject<SuggestionsCore<T> | null>;
+    private SuggestionsOfProperType;
+    constructor(suggestionsProps: ISuggestionsControlProps<T>);
+    componentDidMount(): void;
+    componentDidUpdate(oldProps: ISuggestionsControlProps<T>): void;
+    componentWillUnmount(): void;
+    render(): JSXElement;
+    get currentSuggestion(): ISuggestionModel<T> | undefined;
+    get currentSuggestionIndex(): number;
+    get selectedElement(): HTMLDivElement | undefined;
+    hasSuggestionSelected(): boolean;
+    hasSelection(): boolean;
+    executeSelectedAction(): void;
+    removeSuggestion(index?: number): void;
+    /**
+     * Handles the key down, returns true, if the event was handled, false otherwise
+     * @param keyCode - The keyCode to handle
+     */
+    handleKeyDown(keyCode: number): boolean;
+    scrollSelected(): void;
+    protected renderHeaderItems(): JSXElement | null;
+    protected renderFooterItems(): JSXElement | null;
+    protected _renderSuggestions(): JSXElement;
+    /**
+     * Selects the next selectable item
+     */
+    protected selectNextItem(itemType: SuggestionItemType, originalItemType?: SuggestionItemType): void;
+    /**
+     * Selects the previous selectable item
+     */
+    protected selectPreviousItem(itemType: SuggestionItemType, originalItemType?: SuggestionItemType): void;
+    /**
+     * Resets the selected state and selects the first selectable item
+     */
+    protected resetSelectedItem(): void;
+    /**
+     * Selects the first item
+     */
+    protected selectFirstItem(): void;
+    /**
+     * Selects the last item
+     */
+    protected selectLastItem(): void;
+    /**
+     * Selects the next item in the suggestion item type group, given the current index
+     * If none is able to be selected, returns false, otherwise returns true
+     * @param itemType - The suggestion item type
+     * @param currentIndex - The current index, default is -1
+     */
+    private _selectNextItemOfItemType;
+    /**
+     * Selects the previous item in the suggestion item type group, given the current index
+     * If none is able to be selected, returns false, otherwise returns true
+     * @param itemType - The suggestion item type
+     * @param currentIndex - The current index. If none is provided, the default is the items length of specified type
+     */
+    private _selectPreviousItemOfItemType;
+    private _getCurrentIndexForType;
+    private _getNextItemSectionType;
+    private _getPreviousItemSectionType;
+}

node_modules/@fluentui/react/lib-commonjs/components/FloatingPicker/Suggestions/SuggestionsControl.js

@@ -0,0 +1,394 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SuggestionsControl = exports.SuggestionsHeaderFooterItem = exports.SuggestionItemType = void 0;
+var tslib_1 = require("tslib");
+var React = require("react");
+var Utilities_1 = require("../../../Utilities");
+var SuggestionsCore_1 = require("./SuggestionsCore");
+var stylesImport = require("./SuggestionsControl.scss");
+var Styling_1 = require("../../../Styling");
+var styles = stylesImport;
+var SuggestionItemType;
+(function (SuggestionItemType) {
+    SuggestionItemType[SuggestionItemType["header"] = 0] = "header";
+    SuggestionItemType[SuggestionItemType["suggestion"] = 1] = "suggestion";
+    SuggestionItemType[SuggestionItemType["footer"] = 2] = "footer";
+})(SuggestionItemType || (exports.SuggestionItemType = SuggestionItemType = {}));
+var SuggestionsHeaderFooterItem = /** @class */ (function (_super) {
+    tslib_1.__extends(SuggestionsHeaderFooterItem, _super);
+    function SuggestionsHeaderFooterItem(props) {
+        var _this = _super.call(this, props) || this;
+        (0, Utilities_1.initializeComponentRef)(_this);
+        return _this;
+    }
+    SuggestionsHeaderFooterItem.prototype.render = function () {
+        var _a;
+        var _b = this.props, renderItem = _b.renderItem, onExecute = _b.onExecute, isSelected = _b.isSelected, id = _b.id, className = _b.className;
+        return onExecute ? (React.createElement("div", { id: id, onClick: onExecute, className: (0, Utilities_1.css)('ms-Suggestions-sectionButton', className, styles.actionButton, (_a = {},
+                _a['is-selected ' + styles.buttonSelected] = isSelected,
+                _a)) }, renderItem())) : (React.createElement("div", { id: id, className: (0, Utilities_1.css)('ms-Suggestions-section', className, styles.suggestionsTitle) }, renderItem()));
+    };
+    return SuggestionsHeaderFooterItem;
+}(React.Component));
+exports.SuggestionsHeaderFooterItem = SuggestionsHeaderFooterItem;
+/**
+ * Class when used with SuggestionsStore, renders a suggestions control with customizable headers and footers
+ */
+var SuggestionsControl = /** @class */ (function (_super) {
+    tslib_1.__extends(SuggestionsControl, _super);
+    function SuggestionsControl(suggestionsProps) {
+        var _this = _super.call(this, suggestionsProps) || this;
+        _this._selectedElement = React.createRef();
+        _this._suggestions = React.createRef();
+        _this.SuggestionsOfProperType = SuggestionsCore_1.SuggestionsCore;
+        (0, Utilities_1.initializeComponentRef)(_this);
+        _this.state = {
+            selectedHeaderIndex: -1,
+            selectedFooterIndex: -1,
+            suggestions: suggestionsProps.suggestions,
+        };
+        return _this;
+    }
+    SuggestionsControl.prototype.componentDidMount = function () {
+        this.resetSelectedItem();
+    };
+    SuggestionsControl.prototype.componentDidUpdate = function (oldProps) {
+        var _this = this;
+        this.scrollSelected();
+        if (oldProps.suggestions && oldProps.suggestions !== this.props.suggestions) {
+            this.setState({ suggestions: this.props.suggestions }, function () {
+                _this.resetSelectedItem();
+            });
+        }
+    };
+    SuggestionsControl.prototype.componentWillUnmount = function () {
+        var _a;
+        (_a = this._suggestions.current) === null || _a === void 0 ? void 0 : _a.deselectAllSuggestions();
+    };
+    SuggestionsControl.prototype.render = function () {
+        var _a = this.props, className = _a.className, headerItemsProps = _a.headerItemsProps, footerItemsProps = _a.footerItemsProps, suggestionsAvailableAlertText = _a.suggestionsAvailableAlertText;
+        var screenReaderTextStyles = (0, Styling_1.mergeStyles)(Styling_1.hiddenContentStyle);
+        var shouldAlertSuggestionsAvailableText = this.state.suggestions && this.state.suggestions.length > 0 && suggestionsAvailableAlertText;
+        return (React.createElement("div", { className: (0, Utilities_1.css)('ms-Suggestions', className ? className : '', styles.root) },
+            headerItemsProps && this.renderHeaderItems(),
+            this._renderSuggestions(),
+            footerItemsProps && this.renderFooterItems(),
+            shouldAlertSuggestionsAvailableText ? (React.createElement("span", { role: "alert", "aria-live": "polite", className: screenReaderTextStyles }, suggestionsAvailableAlertText)) : null));
+    };
+    Object.defineProperty(SuggestionsControl.prototype, "currentSuggestion", {
+        get: function () {
+            var _a;
+            return ((_a = this._suggestions.current) === null || _a === void 0 ? void 0 : _a.getCurrentItem()) || undefined;
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(SuggestionsControl.prototype, "currentSuggestionIndex", {
+        get: function () {
+            return this._suggestions.current ? this._suggestions.current.currentIndex : -1;
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(SuggestionsControl.prototype, "selectedElement", {
+        get: function () {
+            var _a;
+            return this._selectedElement.current ? this._selectedElement.current : (_a = this._suggestions.current) === null || _a === void 0 ? void 0 : _a.selectedElement;
+        },
+        enumerable: false,
+        configurable: true
+    });
+    SuggestionsControl.prototype.hasSuggestionSelected = function () {
+        var _a;
+        return ((_a = this._suggestions.current) === null || _a === void 0 ? void 0 : _a.hasSuggestionSelected()) || false;
+    };
+    SuggestionsControl.prototype.hasSelection = function () {
+        var _a = this.state, selectedHeaderIndex = _a.selectedHeaderIndex, selectedFooterIndex = _a.selectedFooterIndex;
+        return selectedHeaderIndex !== -1 || this.hasSuggestionSelected() || selectedFooterIndex !== -1;
+    };
+    SuggestionsControl.prototype.executeSelectedAction = function () {
+        var _a;
+        var _b = this.props, headerItemsProps = _b.headerItemsProps, footerItemsProps = _b.footerItemsProps;
+        var _c = this.state, selectedHeaderIndex = _c.selectedHeaderIndex, selectedFooterIndex = _c.selectedFooterIndex;
+        if (headerItemsProps && selectedHeaderIndex !== -1 && selectedHeaderIndex < headerItemsProps.length) {
+            var selectedHeaderItem = headerItemsProps[selectedHeaderIndex];
+            if (selectedHeaderItem.onExecute) {
+                selectedHeaderItem.onExecute();
+            }
+        }
+        else if ((_a = this._suggestions.current) === null || _a === void 0 ? void 0 : _a.hasSuggestionSelected()) {
+            this.props.completeSuggestion();
+        }
+        else if (footerItemsProps && selectedFooterIndex !== -1 && selectedFooterIndex < footerItemsProps.length) {
+            var selectedFooterItem = footerItemsProps[selectedFooterIndex];
+            if (selectedFooterItem.onExecute) {
+                selectedFooterItem.onExecute();
+            }
+        }
+    };
+    SuggestionsControl.prototype.removeSuggestion = function (index) {
+        var _a, _b;
+        (_a = this._suggestions.current) === null || _a === void 0 ? void 0 : _a.removeSuggestion(index ? index : (_b = this._suggestions.current) === null || _b === void 0 ? void 0 : _b.currentIndex);
+    };
+    /**
+     * Handles the key down, returns true, if the event was handled, false otherwise
+     * @param keyCode - The keyCode to handle
+     */
+    SuggestionsControl.prototype.handleKeyDown = function (keyCode) {
+        var _a, _b, _c, _d;
+        var _e = this.state, selectedHeaderIndex = _e.selectedHeaderIndex, selectedFooterIndex = _e.selectedFooterIndex;
+        var isKeyDownHandled = false;
+        if (keyCode === Utilities_1.KeyCodes.down) {
+            if (selectedHeaderIndex === -1 &&
+                !((_a = this._suggestions.current) === null || _a === void 0 ? void 0 : _a.hasSuggestionSelected()) &&
+                selectedFooterIndex === -1) {
+                this.selectFirstItem();
+            }
+            else if (selectedHeaderIndex !== -1) {
+                this.selectNextItem(SuggestionItemType.header);
+                isKeyDownHandled = true;
+            }
+            else if ((_b = this._suggestions.current) === null || _b === void 0 ? void 0 : _b.hasSuggestionSelected()) {
+                this.selectNextItem(SuggestionItemType.suggestion);
+                isKeyDownHandled = true;
+            }
+            else if (selectedFooterIndex !== -1) {
+                this.selectNextItem(SuggestionItemType.footer);
+                isKeyDownHandled = true;
+            }
+        }
+        else if (keyCode === Utilities_1.KeyCodes.up) {
+            if (selectedHeaderIndex === -1 &&
+                !((_c = this._suggestions.current) === null || _c === void 0 ? void 0 : _c.hasSuggestionSelected()) &&
+                selectedFooterIndex === -1) {
+                this.selectLastItem();
+            }
+            else if (selectedHeaderIndex !== -1) {
+                this.selectPreviousItem(SuggestionItemType.header);
+                isKeyDownHandled = true;
+            }
+            else if ((_d = this._suggestions.current) === null || _d === void 0 ? void 0 : _d.hasSuggestionSelected()) {
+                this.selectPreviousItem(SuggestionItemType.suggestion);
+                isKeyDownHandled = true;
+            }
+            else if (selectedFooterIndex !== -1) {
+                this.selectPreviousItem(SuggestionItemType.footer);
+                isKeyDownHandled = true;
+            }
+        }
+        else if (keyCode === Utilities_1.KeyCodes.enter || keyCode === Utilities_1.KeyCodes.tab) {
+            if (this.hasSelection()) {
+                this.executeSelectedAction();
+                isKeyDownHandled = true;
+            }
+        }
+        return isKeyDownHandled;
+    };
+    // TODO get the element to scroll into view properly regardless of direction.
+    SuggestionsControl.prototype.scrollSelected = function () {
+        if (this._selectedElement.current) {
+            this._selectedElement.current.scrollIntoView(false);
+        }
+    };
+    SuggestionsControl.prototype.renderHeaderItems = function () {
+        var _this = this;
+        var _a = this.props, headerItemsProps = _a.headerItemsProps, suggestionsHeaderContainerAriaLabel = _a.suggestionsHeaderContainerAriaLabel;
+        var selectedHeaderIndex = this.state.selectedHeaderIndex;
+        return headerItemsProps ? (React.createElement("div", { className: (0, Utilities_1.css)('ms-Suggestions-headerContainer', styles.suggestionsContainer), id: "suggestionHeader-list", role: "list", "aria-label": suggestionsHeaderContainerAriaLabel }, headerItemsProps.map(function (headerItemProps, index) {
+            var isSelected = selectedHeaderIndex !== -1 && selectedHeaderIndex === index;
+            return headerItemProps.shouldShow() ? (React.createElement("div", { ref: isSelected ? _this._selectedElement : undefined, id: 'sug-header' + index, key: 'sug-header' + index, role: "listitem", "aria-label": headerItemProps.ariaLabel },
+                React.createElement(SuggestionsHeaderFooterItem, { id: 'sug-header-item' + index, isSelected: isSelected, renderItem: headerItemProps.renderItem, onExecute: headerItemProps.onExecute, className: headerItemProps.className }))) : null;
+        }))) : null;
+    };
+    SuggestionsControl.prototype.renderFooterItems = function () {
+        var _this = this;
+        var _a = this.props, footerItemsProps = _a.footerItemsProps, suggestionsFooterContainerAriaLabel = _a.suggestionsFooterContainerAriaLabel;
+        var selectedFooterIndex = this.state.selectedFooterIndex;
+        return footerItemsProps ? (React.createElement("div", { className: (0, Utilities_1.css)('ms-Suggestions-footerContainer', styles.suggestionsContainer), id: "suggestionFooter-list", role: "list", "aria-label": suggestionsFooterContainerAriaLabel }, footerItemsProps.map(function (footerItemProps, index) {
+            var isSelected = selectedFooterIndex !== -1 && selectedFooterIndex === index;
+            return footerItemProps.shouldShow() ? (React.createElement("div", { ref: isSelected ? _this._selectedElement : undefined, id: 'sug-footer' + index, key: 'sug-footer' + index, role: "listitem", "aria-label": footerItemProps.ariaLabel },
+                React.createElement(SuggestionsHeaderFooterItem, { id: 'sug-footer-item' + index, isSelected: isSelected, renderItem: footerItemProps.renderItem, onExecute: footerItemProps.onExecute, className: footerItemProps.className }))) : null;
+        }))) : null;
+    };
+    SuggestionsControl.prototype._renderSuggestions = function () {
+        var TypedSuggestions = this.SuggestionsOfProperType;
+        return React.createElement(TypedSuggestions, tslib_1.__assign({ ref: this._suggestions }, this.props, { suggestions: this.state.suggestions }));
+    };
+    /**
+     * Selects the next selectable item
+     */
+    SuggestionsControl.prototype.selectNextItem = function (itemType, originalItemType) {
+        // If the recursive calling has not found a selectable item in the other suggestion item type groups
+        // And the method is being called again with the original item type,
+        // Select the first selectable item of this suggestion item type group (could be the currently selected item)
+        if (itemType === originalItemType) {
+            this._selectNextItemOfItemType(itemType);
+            return;
+        }
+        var startedItemType = originalItemType !== undefined ? originalItemType : itemType;
+        // Try to set the selection to the next selectable item, of the same suggestion item type group
+        // If this is the original item type, use the current index
+        var selectionChanged = this._selectNextItemOfItemType(itemType, startedItemType === itemType ? this._getCurrentIndexForType(itemType) : undefined);
+        // If the selection did not change, try to select from the next suggestion type group
+        if (!selectionChanged) {
+            this.selectNextItem(this._getNextItemSectionType(itemType), startedItemType);
+        }
+    };
+    /**
+     * Selects the previous selectable item
+     */
+    SuggestionsControl.prototype.selectPreviousItem = function (itemType, originalItemType) {
+        // If the recursive calling has not found a selectable item in the other suggestion item type groups
+        // And the method is being called again with the original item type,
+        // Select the last selectable item of this suggestion item type group (could be the currently selected item)
+        if (itemType === originalItemType) {
+            this._selectPreviousItemOfItemType(itemType);
+            return;
+        }
+        var startedItemType = originalItemType !== undefined ? originalItemType : itemType;
+        // Try to set the selection to the previous selectable item, of the same suggestion item type group
+        var selectionChanged = this._selectPreviousItemOfItemType(itemType, startedItemType === itemType ? this._getCurrentIndexForType(itemType) : undefined);
+        // If the selection did not change, try to select from the previous suggestion type group
+        if (!selectionChanged) {
+            this.selectPreviousItem(this._getPreviousItemSectionType(itemType), startedItemType);
+        }
+    };
+    /**
+     * Resets the selected state and selects the first selectable item
+     */
+    SuggestionsControl.prototype.resetSelectedItem = function () {
+        var _a;
+        this.setState({ selectedHeaderIndex: -1, selectedFooterIndex: -1 });
+        (_a = this._suggestions.current) === null || _a === void 0 ? void 0 : _a.deselectAllSuggestions();
+        // Select the first item if the shouldSelectFirstItem prop is not set or it is set and it returns true
+        if (this.props.shouldSelectFirstItem === undefined || this.props.shouldSelectFirstItem()) {
+            this.selectFirstItem();
+        }
+    };
+    /**
+     * Selects the first item
+     */
+    SuggestionsControl.prototype.selectFirstItem = function () {
+        if (this._selectNextItemOfItemType(SuggestionItemType.header)) {
+            return;
+        }
+        if (this._selectNextItemOfItemType(SuggestionItemType.suggestion)) {
+            return;
+        }
+        this._selectNextItemOfItemType(SuggestionItemType.footer);
+    };
+    /**
+     * Selects the last item
+     */
+    SuggestionsControl.prototype.selectLastItem = function () {
+        if (this._selectPreviousItemOfItemType(SuggestionItemType.footer)) {
+            return;
+        }
+        if (this._selectPreviousItemOfItemType(SuggestionItemType.suggestion)) {
+            return;
+        }
+        this._selectPreviousItemOfItemType(SuggestionItemType.header);
+    };
+    /**
+     * Selects the next item in the suggestion item type group, given the current index
+     * If none is able to be selected, returns false, otherwise returns true
+     * @param itemType - The suggestion item type
+     * @param currentIndex - The current index, default is -1
+     */
+    SuggestionsControl.prototype._selectNextItemOfItemType = function (itemType, currentIndex) {
+        var _a, _b;
+        if (currentIndex === void 0) { currentIndex = -1; }
+        if (itemType === SuggestionItemType.suggestion) {
+            if (this.state.suggestions.length > currentIndex + 1) {
+                (_a = this._suggestions.current) === null || _a === void 0 ? void 0 : _a.setSelectedSuggestion(currentIndex + 1);
+                this.setState({ selectedHeaderIndex: -1, selectedFooterIndex: -1 });
+                return true;
+            }
+        }
+        else {
+            var isHeader = itemType === SuggestionItemType.header;
+            var itemProps = isHeader ? this.props.headerItemsProps : this.props.footerItemsProps;
+            if (itemProps && itemProps.length > currentIndex + 1) {
+                for (var i = currentIndex + 1; i < itemProps.length; i++) {
+                    var item = itemProps[i];
+                    if (item.onExecute && item.shouldShow()) {
+                        this.setState({ selectedHeaderIndex: isHeader ? i : -1 });
+                        this.setState({ selectedFooterIndex: isHeader ? -1 : i });
+                        (_b = this._suggestions.current) === null || _b === void 0 ? void 0 : _b.deselectAllSuggestions();
+                        return true;
+                    }
+                }
+            }
+        }
+        return false;
+    };
+    /**
+     * Selects the previous item in the suggestion item type group, given the current index
+     * If none is able to be selected, returns false, otherwise returns true
+     * @param itemType - The suggestion item type
+     * @param currentIndex - The current index. If none is provided, the default is the items length of specified type
+     */
+    SuggestionsControl.prototype._selectPreviousItemOfItemType = function (itemType, currentIndex) {
+        var _a, _b;
+        if (itemType === SuggestionItemType.suggestion) {
+            var index = currentIndex !== undefined ? currentIndex : this.state.suggestions.length;
+            if (index > 0) {
+                (_a = this._suggestions.current) === null || _a === void 0 ? void 0 : _a.setSelectedSuggestion(index - 1);
+                this.setState({ selectedHeaderIndex: -1, selectedFooterIndex: -1 });
+                return true;
+            }
+        }
+        else {
+            var isHeader = itemType === SuggestionItemType.header;
+            var itemProps = isHeader ? this.props.headerItemsProps : this.props.footerItemsProps;
+            if (itemProps) {
+                var index = currentIndex !== undefined ? currentIndex : itemProps.length;
+                if (index > 0) {
+                    for (var i = index - 1; i >= 0; i--) {
+                        var item = itemProps[i];
+                        if (item.onExecute && item.shouldShow()) {
+                            this.setState({ selectedHeaderIndex: isHeader ? i : -1 });
+                            this.setState({ selectedFooterIndex: isHeader ? -1 : i });
+                            (_b = this._suggestions.current) === null || _b === void 0 ? void 0 : _b.deselectAllSuggestions();
+                            return true;
+                        }
+                    }
+                }
+            }
+        }
+        return false;
+    };
+    SuggestionsControl.prototype._getCurrentIndexForType = function (itemType) {
+        switch (itemType) {
+            case SuggestionItemType.header:
+                return this.state.selectedHeaderIndex;
+            case SuggestionItemType.suggestion:
+                return this._suggestions.current.currentIndex;
+            case SuggestionItemType.footer:
+                return this.state.selectedFooterIndex;
+        }
+    };
+    SuggestionsControl.prototype._getNextItemSectionType = function (itemType) {
+        switch (itemType) {
+            case SuggestionItemType.header:
+                return SuggestionItemType.suggestion;
+            case SuggestionItemType.suggestion:
+                return SuggestionItemType.footer;
+            case SuggestionItemType.footer:
+                return SuggestionItemType.header;
+        }
+    };
+    SuggestionsControl.prototype._getPreviousItemSectionType = function (itemType) {
+        switch (itemType) {
+            case SuggestionItemType.header:
+                return SuggestionItemType.footer;
+            case SuggestionItemType.suggestion:
+                return SuggestionItemType.header;
+            case SuggestionItemType.footer:
+                return SuggestionItemType.suggestion;
+        }
+    };
+    return SuggestionsControl;
+}(React.Component));
+exports.SuggestionsControl = SuggestionsControl;
+//# sourceMappingURL=SuggestionsControl.js.map

node_modules/@fluentui/react/lib-commonjs/components/FloatingPicker/Suggestions/SuggestionsControl.scss.d.ts

@@ -0,0 +1,7 @@
+export declare const root = "root_ade399af";
+export declare const actionButton = "actionButton_ade399af";
+export declare const buttonSelected = "buttonSelected_ade399af";
+export declare const suggestionsTitle = "suggestionsTitle_ade399af";
+export declare const suggestionsSpinner = "suggestionsSpinner_ade399af";
+export declare const itemButton = "itemButton_ade399af";
+export declare const screenReaderOnly = "screenReaderOnly_ade399af";

node_modules/@fluentui/react/lib-commonjs/components/FloatingPicker/Suggestions/SuggestionsControl.scss.js

@@ -0,0 +1,14 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.screenReaderOnly = exports.itemButton = exports.suggestionsSpinner = exports.suggestionsTitle = exports.buttonSelected = exports.actionButton = exports.root = void 0;
+/* eslint-disable */
+var load_themed_styles_1 = require("@microsoft/load-themed-styles");
+(0, load_themed_styles_1.loadStyles)([{ "rawString": ".root_ade399af{min-width:260px}.actionButton_ade399af{background:0 0;background-color:transparent;border:0;cursor:pointer;margin:0;padding:0;position:relative;width:100%;font-size:12px}html[dir=ltr] .actionButton_ade399af{text-align:left}html[dir=rtl] .actionButton_ade399af{text-align:right}.actionButton_ade399af:hover{background-color:" }, { "theme": "neutralLighter", "defaultValue": "#f3f2f1" }, { "rawString": ";cursor:pointer}.actionButton_ade399af:active,.actionButton_ade399af:focus{background-color:" }, { "theme": "themeLight", "defaultValue": "#c7e0f4" }, { "rawString": "}.actionButton_ade399af .ms-Button-icon{font-size:16px;width:25px}.actionButton_ade399af .ms-Button-label{margin:0 4px 0 9px}html[dir=rtl] .actionButton_ade399af .ms-Button-label{margin:0 9px 0 4px}.buttonSelected_ade399af{background-color:" }, { "theme": "themeLighter", "defaultValue": "#deecf9" }, { "rawString": "}.buttonSelected_ade399af:hover{background-color:" }, { "theme": "themeLight", "defaultValue": "#c7e0f4" }, { "rawString": ";cursor:pointer}@media screen and (-ms-high-contrast:active),screen and (forced-colors:active){.buttonSelected_ade399af:hover{background-color:Highlight;color:HighlightText}}@media screen and (-ms-high-contrast:active),screen and (forced-colors:active){.buttonSelected_ade399af{background-color:Highlight;color:HighlightText;-ms-high-contrast-adjust:none}}.suggestionsTitle_ade399af{font-size:12px}.suggestionsSpinner_ade399af{margin:5px 0;white-space:nowrap;line-height:20px;font-size:12px}html[dir=ltr] .suggestionsSpinner_ade399af{padding-left:14px}html[dir=rtl] .suggestionsSpinner_ade399af{padding-right:14px}html[dir=ltr] .suggestionsSpinner_ade399af{text-align:left}html[dir=rtl] .suggestionsSpinner_ade399af{text-align:right}.suggestionsSpinner_ade399af .ms-Spinner-circle{display:inline-block;vertical-align:middle}.suggestionsSpinner_ade399af .ms-Spinner-label{display:inline-block;margin:0 10px 0 16px;vertical-align:middle}html[dir=rtl] .suggestionsSpinner_ade399af .ms-Spinner-label{margin:0 16px 0 10px}.itemButton_ade399af{height:100%;width:100%;padding:7px 12px}@media screen and (-ms-high-contrast:active),screen and (forced-colors:active){.itemButton_ade399af{color:WindowText}}.screenReaderOnly_ade399af{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}" }]);
+exports.root = "root_ade399af";
+exports.actionButton = "actionButton_ade399af";
+exports.buttonSelected = "buttonSelected_ade399af";
+exports.suggestionsTitle = "suggestionsTitle_ade399af";
+exports.suggestionsSpinner = "suggestionsSpinner_ade399af";
+exports.itemButton = "itemButton_ade399af";
+exports.screenReaderOnly = "screenReaderOnly_ade399af";
+//# sourceMappingURL=SuggestionsControl.scss.js.map

node_modules/@fluentui/react/lib-commonjs/components/FloatingPicker/Suggestions/SuggestionsControl.scss.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SuggestionsControl.scss.js","sourceRoot":"../src/","sources":["components/FloatingPicker/Suggestions/SuggestionsControl.scss.ts"],"names":[],"mappings":";;;AAAA,oBAAoB;AACpB,oEAA2D;AAC3D,IAAA,+BAAU,EAAC,CAAC,EAAC,WAAW,EAAC,oVAAoV,EAAC,EAAC,EAAC,OAAO,EAAC,gBAAgB,EAAC,cAAc,EAAC,SAAS,EAAC,EAAC,EAAC,WAAW,EAAC,8FAA8F,EAAC,EAAC,EAAC,OAAO,EAAC,YAAY,EAAC,cAAc,EAAC,SAAS,EAAC,EAAC,EAAC,WAAW,EAAC,kPAAkP,EAAC,EAAC,EAAC,OAAO,EAAC,cAAc,EAAC,cAAc,EAAC,SAAS,EAAC,EAAC,EAAC,WAAW,EAAC,mDAAmD,EAAC,EAAC,EAAC,OAAO,EAAC,YAAY,EAAC,cAAc,EAAC,SAAS,EAAC,EAAC,EAAC,WAAW,EAAC,kzCAAkzC,EAAC,CAAC,CAAC,CAAC;AAC3xE,QAAA,IAAI,GAAG,eAAe,CAAC;AACvB,QAAA,YAAY,GAAG,uBAAuB,CAAC;AACvC,QAAA,cAAc,GAAG,yBAAyB,CAAC;AAC3C,QAAA,gBAAgB,GAAG,2BAA2B,CAAC;AAC/C,QAAA,kBAAkB,GAAG,6BAA6B,CAAC;AACnD,QAAA,UAAU,GAAG,qBAAqB,CAAC;AACnC,QAAA,gBAAgB,GAAG,2BAA2B,CAAC","sourcesContent":["/* eslint-disable */\nimport { loadStyles } from '@microsoft/load-themed-styles';\nloadStyles([{\"rawString\":\".root_ade399af{min-width:260px}.actionButton_ade399af{background:0 0;background-color:transparent;border:0;cursor:pointer;margin:0;padding:0;position:relative;width:100%;font-size:12px}html[dir=ltr] .actionButton_ade399af{text-align:left}html[dir=rtl] .actionButton_ade399af{text-align:right}.actionButton_ade399af:hover{background-color:\"},{\"theme\":\"neutralLighter\",\"defaultValue\":\"#f3f2f1\"},{\"rawString\":\";cursor:pointer}.actionButton_ade399af:active,.actionButton_ade399af:focus{background-color:\"},{\"theme\":\"themeLight\",\"defaultValue\":\"#c7e0f4\"},{\"rawString\":\"}.actionButton_ade399af .ms-Button-icon{font-size:16px;width:25px}.actionButton_ade399af .ms-Button-label{margin:0 4px 0 9px}html[dir=rtl] .actionButton_ade399af .ms-Button-label{margin:0 9px 0 4px}.buttonSelected_ade399af{background-color:\"},{\"theme\":\"themeLighter\",\"defaultValue\":\"#deecf9\"},{\"rawString\":\"}.buttonSelected_ade399af:hover{background-color:\"},{\"theme\":\"themeLight\",\"defaultValue\":\"#c7e0f4\"},{\"rawString\":\";cursor:pointer}@media screen and (-ms-high-contrast:active),screen and (forced-colors:active){.buttonSelected_ade399af:hover{background-color:Highlight;color:HighlightText}}@media screen and (-ms-high-contrast:active),screen and (forced-colors:active){.buttonSelected_ade399af{background-color:Highlight;color:HighlightText;-ms-high-contrast-adjust:none}}.suggestionsTitle_ade399af{font-size:12px}.suggestionsSpinner_ade399af{margin:5px 0;white-space:nowrap;line-height:20px;font-size:12px}html[dir=ltr] .suggestionsSpinner_ade399af{padding-left:14px}html[dir=rtl] .suggestionsSpinner_ade399af{padding-right:14px}html[dir=ltr] .suggestionsSpinner_ade399af{text-align:left}html[dir=rtl] .suggestionsSpinner_ade399af{text-align:right}.suggestionsSpinner_ade399af .ms-Spinner-circle{display:inline-block;vertical-align:middle}.suggestionsSpinner_ade399af .ms-Spinner-label{display:inline-block;margin:0 10px 0 16px;vertical-align:middle}html[dir=rtl] .suggestionsSpinner_ade399af .ms-Spinner-label{margin:0 16px 0 10px}.itemButton_ade399af{height:100%;width:100%;padding:7px 12px}@media screen and (-ms-high-contrast:active),screen and (forced-colors:active){.itemButton_ade399af{color:WindowText}}.screenReaderOnly_ade399af{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}\"}]);\nexport const root = \"root_ade399af\";\nexport const actionButton = \"actionButton_ade399af\";\nexport const buttonSelected = \"buttonSelected_ade399af\";\nexport const suggestionsTitle = \"suggestionsTitle_ade399af\";\nexport const suggestionsSpinner = \"suggestionsSpinner_ade399af\";\nexport const itemButton = \"itemButton_ade399af\";\nexport const screenReaderOnly = \"screenReaderOnly_ade399af\";"]}

node_modules/@fluentui/react/lib-commonjs/components/FloatingPicker/Suggestions/SuggestionsCore.d.ts

@@ -0,0 +1,34 @@
+import * as React from 'react';
+import type { ISuggestionModel } from '../../../Pickers';
+import type { ISuggestionsCoreProps } from './Suggestions.types';
+import type { JSXElement } from '@fluentui/utilities';
+/**
+ * Class when used with SuggestionsStore, renders a basic suggestions control
+ */
+export declare class SuggestionsCore<T extends {}> extends React.Component<ISuggestionsCoreProps<T>, {}> {
+    currentIndex: number;
+    currentSuggestion: ISuggestionModel<T> | undefined;
+    protected _selectedElement: React.RefObject<HTMLDivElement | null>;
+    private SuggestionsItemOfProperType;
+    constructor(suggestionsProps: ISuggestionsCoreProps<T>);
+    /**
+     * Increments the selected suggestion index
+     */
+    nextSuggestion(): boolean;
+    /**
+     * Decrements the selected suggestion index
+     */
+    previousSuggestion(): boolean;
+    get selectedElement(): HTMLDivElement | undefined;
+    getCurrentItem(): ISuggestionModel<T>;
+    getSuggestionAtIndex(index: number): ISuggestionModel<T>;
+    hasSuggestionSelected(): boolean;
+    removeSuggestion(index: number): void;
+    deselectAllSuggestions(): void;
+    setSelectedSuggestion(index: number): void;
+    componentDidUpdate(): void;
+    render(): JSXElement;
+    scrollSelected(): void;
+    private _onClickTypedSuggestionsItem;
+    private _onRemoveTypedSuggestionsItem;
+}

node_modules/@fluentui/react/lib-commonjs/components/FloatingPicker/Suggestions/SuggestionsCore.js

@@ -0,0 +1,145 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SuggestionsCore = void 0;
+var tslib_1 = require("tslib");
+var React = require("react");
+var Utilities_1 = require("../../../Utilities");
+var Pickers_1 = require("../../../Pickers");
+var stylesImport = require("./SuggestionsCore.scss");
+var styles = stylesImport;
+/**
+ * Class when used with SuggestionsStore, renders a basic suggestions control
+ */
+var SuggestionsCore = /** @class */ (function (_super) {
+    tslib_1.__extends(SuggestionsCore, _super);
+    function SuggestionsCore(suggestionsProps) {
+        var _this = _super.call(this, suggestionsProps) || this;
+        _this._selectedElement = React.createRef();
+        _this.SuggestionsItemOfProperType = Pickers_1.SuggestionsItem;
+        _this._onClickTypedSuggestionsItem = function (item, index) {
+            return function (ev) {
+                _this.props.onSuggestionClick(ev, item, index);
+            };
+        };
+        _this._onRemoveTypedSuggestionsItem = function (item, index) {
+            return function (ev) {
+                var onSuggestionRemove = _this.props.onSuggestionRemove;
+                onSuggestionRemove(ev, item, index);
+                ev.stopPropagation();
+            };
+        };
+        (0, Utilities_1.initializeComponentRef)(_this);
+        _this.currentIndex = -1;
+        return _this;
+    }
+    /**
+     * Increments the selected suggestion index
+     */
+    SuggestionsCore.prototype.nextSuggestion = function () {
+        var suggestions = this.props.suggestions;
+        if (suggestions && suggestions.length > 0) {
+            if (this.currentIndex === -1) {
+                this.setSelectedSuggestion(0);
+                return true;
+            }
+            else if (this.currentIndex < suggestions.length - 1) {
+                this.setSelectedSuggestion(this.currentIndex + 1);
+                return true;
+            }
+            else if (this.props.shouldLoopSelection && this.currentIndex === suggestions.length - 1) {
+                this.setSelectedSuggestion(0);
+                return true;
+            }
+        }
+        return false;
+    };
+    /**
+     * Decrements the selected suggestion index
+     */
+    SuggestionsCore.prototype.previousSuggestion = function () {
+        var suggestions = this.props.suggestions;
+        if (suggestions && suggestions.length > 0) {
+            if (this.currentIndex === -1) {
+                this.setSelectedSuggestion(suggestions.length - 1);
+                return true;
+            }
+            else if (this.currentIndex > 0) {
+                this.setSelectedSuggestion(this.currentIndex - 1);
+                return true;
+            }
+            else if (this.props.shouldLoopSelection && this.currentIndex === 0) {
+                this.setSelectedSuggestion(suggestions.length - 1);
+                return true;
+            }
+        }
+        return false;
+    };
+    Object.defineProperty(SuggestionsCore.prototype, "selectedElement", {
+        get: function () {
+            return this._selectedElement.current || undefined;
+        },
+        enumerable: false,
+        configurable: true
+    });
+    SuggestionsCore.prototype.getCurrentItem = function () {
+        return this.props.suggestions[this.currentIndex];
+    };
+    SuggestionsCore.prototype.getSuggestionAtIndex = function (index) {
+        return this.props.suggestions[index];
+    };
+    SuggestionsCore.prototype.hasSuggestionSelected = function () {
+        return this.currentIndex !== -1 && this.currentIndex < this.props.suggestions.length;
+    };
+    SuggestionsCore.prototype.removeSuggestion = function (index) {
+        this.props.suggestions.splice(index, 1);
+    };
+    SuggestionsCore.prototype.deselectAllSuggestions = function () {
+        if (this.currentIndex > -1 && this.props.suggestions[this.currentIndex]) {
+            this.props.suggestions[this.currentIndex].selected = false;
+            this.currentIndex = -1;
+            this.forceUpdate();
+        }
+    };
+    SuggestionsCore.prototype.setSelectedSuggestion = function (index) {
+        var suggestions = this.props.suggestions;
+        if (index > suggestions.length - 1 || index < 0) {
+            this.currentIndex = 0;
+            this.currentSuggestion.selected = false;
+            this.currentSuggestion = suggestions[0];
+            this.currentSuggestion.selected = true;
+        }
+        else {
+            if (this.currentIndex > -1 && suggestions[this.currentIndex]) {
+                suggestions[this.currentIndex].selected = false;
+            }
+            suggestions[index].selected = true;
+            this.currentIndex = index;
+            this.currentSuggestion = suggestions[index];
+        }
+        this.forceUpdate();
+    };
+    SuggestionsCore.prototype.componentDidUpdate = function () {
+        this.scrollSelected();
+    };
+    SuggestionsCore.prototype.render = function () {
+        var _this = this;
+        var _a = this.props, onRenderSuggestion = _a.onRenderSuggestion, suggestionsItemClassName = _a.suggestionsItemClassName, resultsMaximumNumber = _a.resultsMaximumNumber, showRemoveButtons = _a.showRemoveButtons, suggestionsContainerAriaLabel = _a.suggestionsContainerAriaLabel;
+        var TypedSuggestionsItem = this.SuggestionsItemOfProperType;
+        var suggestions = this.props.suggestions;
+        if (resultsMaximumNumber) {
+            suggestions = suggestions.slice(0, resultsMaximumNumber);
+        }
+        return (React.createElement("div", { className: (0, Utilities_1.css)('ms-Suggestions-container', styles.suggestionsContainer), id: "suggestion-list", role: "listbox", "aria-label": suggestionsContainerAriaLabel }, suggestions.map(function (suggestion, index) { return (React.createElement("div", { ref: suggestion.selected || index === _this.currentIndex ? _this._selectedElement : undefined, key: suggestion.item.key ? suggestion.item.key : index, id: 'sug-' + index },
+            React.createElement(TypedSuggestionsItem, { id: 'sug-item' + index, suggestionModel: suggestion, RenderSuggestion: onRenderSuggestion, onClick: _this._onClickTypedSuggestionsItem(suggestion.item, index), className: suggestionsItemClassName, showRemoveButton: showRemoveButtons, onRemoveItem: _this._onRemoveTypedSuggestionsItem(suggestion.item, index), isSelectedOverride: index === _this.currentIndex }))); })));
+    };
+    // TODO get the element to scroll into view properly regardless of direction.
+    SuggestionsCore.prototype.scrollSelected = function () {
+        var _a;
+        if (((_a = this._selectedElement.current) === null || _a === void 0 ? void 0 : _a.scrollIntoView) !== undefined) {
+            this._selectedElement.current.scrollIntoView(false);
+        }
+    };
+    return SuggestionsCore;
+}(React.Component));
+exports.SuggestionsCore = SuggestionsCore;
+//# sourceMappingURL=SuggestionsCore.js.map

node_modules/@fluentui/react/lib-commonjs/components/FloatingPicker/Suggestions/SuggestionsCore.scss.d.ts

@@ -0,0 +1 @@
+export declare const suggestionsContainer = "suggestionsContainer_44c59fda";

node_modules/@fluentui/react/lib-commonjs/components/FloatingPicker/Suggestions/SuggestionsCore.scss.js

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.suggestionsContainer = void 0;
+/* eslint-disable */
+var load_themed_styles_1 = require("@microsoft/load-themed-styles");
+(0, load_themed_styles_1.loadStyles)([{ "rawString": ".suggestionsContainer_44c59fda{overflow-y:auto;overflow-x:hidden;max-height:300px}.suggestionsContainer_44c59fda .ms-Suggestion-item:hover{background-color:" }, { "theme": "neutralLighter", "defaultValue": "#f3f2f1" }, { "rawString": ";cursor:pointer}.suggestionsContainer_44c59fda .is-suggested{background-color:" }, { "theme": "themeLighter", "defaultValue": "#deecf9" }, { "rawString": "}.suggestionsContainer_44c59fda .is-suggested:hover{background-color:" }, { "theme": "themeLight", "defaultValue": "#c7e0f4" }, { "rawString": ";cursor:pointer}" }]);
+exports.suggestionsContainer = "suggestionsContainer_44c59fda";
+//# sourceMappingURL=SuggestionsCore.scss.js.map

node_modules/@fluentui/react/lib-commonjs/components/FloatingPicker/Suggestions/SuggestionsCore.scss.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SuggestionsCore.scss.js","sourceRoot":"../src/","sources":["components/FloatingPicker/Suggestions/SuggestionsCore.scss.ts"],"names":[],"mappings":";;;AAAA,oBAAoB;AACpB,oEAA2D;AAC3D,IAAA,+BAAU,EAAC,CAAC,EAAC,WAAW,EAAC,8JAA8J,EAAC,EAAC,EAAC,OAAO,EAAC,gBAAgB,EAAC,cAAc,EAAC,SAAS,EAAC,EAAC,EAAC,WAAW,EAAC,gFAAgF,EAAC,EAAC,EAAC,OAAO,EAAC,cAAc,EAAC,cAAc,EAAC,SAAS,EAAC,EAAC,EAAC,WAAW,EAAC,uEAAuE,EAAC,EAAC,EAAC,OAAO,EAAC,YAAY,EAAC,cAAc,EAAC,SAAS,EAAC,EAAC,EAAC,WAAW,EAAC,kBAAkB,EAAC,CAAC,CAAC,CAAC;AAC1hB,QAAA,oBAAoB,GAAG,+BAA+B,CAAC","sourcesContent":["/* eslint-disable */\nimport { loadStyles } from '@microsoft/load-themed-styles';\nloadStyles([{\"rawString\":\".suggestionsContainer_44c59fda{overflow-y:auto;overflow-x:hidden;max-height:300px}.suggestionsContainer_44c59fda .ms-Suggestion-item:hover{background-color:\"},{\"theme\":\"neutralLighter\",\"defaultValue\":\"#f3f2f1\"},{\"rawString\":\";cursor:pointer}.suggestionsContainer_44c59fda .is-suggested{background-color:\"},{\"theme\":\"themeLighter\",\"defaultValue\":\"#deecf9\"},{\"rawString\":\"}.suggestionsContainer_44c59fda .is-suggested:hover{background-color:\"},{\"theme\":\"themeLight\",\"defaultValue\":\"#c7e0f4\"},{\"rawString\":\";cursor:pointer}\"}]);\nexport const suggestionsContainer = \"suggestionsContainer_44c59fda\";"]}

node_modules/@fluentui/react/lib-commonjs/components/FloatingPicker/Suggestions/SuggestionsStore.d.ts

@@ -0,0 +1,16 @@
+import type { ISuggestionModel } from '../../../Pickers';
+export type SuggestionsStoreOptions<T> = {
+    getAriaLabel?: (item: T) => string;
+};
+export declare class SuggestionsStore<T> {
+    suggestions: ISuggestionModel<T>[];
+    private getAriaLabel?;
+    constructor(options?: SuggestionsStoreOptions<T>);
+    updateSuggestions(newSuggestions: T[]): void;
+    getSuggestions(): ISuggestionModel<T>[];
+    getSuggestionAtIndex(index: number): ISuggestionModel<T>;
+    removeSuggestion(index: number): void;
+    convertSuggestionsToSuggestionItems(suggestions: Array<ISuggestionModel<T> | T>): ISuggestionModel<T>[];
+    private _isSuggestionModel;
+    private _ensureSuggestionModel;
+}

node_modules/@fluentui/react/lib-commonjs/components/FloatingPicker/Suggestions/SuggestionsStore.js

@@ -0,0 +1,53 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SuggestionsStore = void 0;
+var SuggestionsStore = /** @class */ (function () {
+    function SuggestionsStore(options) {
+        var _this = this;
+        this._isSuggestionModel = function (value) {
+            return value.item !== undefined;
+        };
+        this._ensureSuggestionModel = function (suggestion) {
+            if (_this._isSuggestionModel(suggestion)) {
+                return suggestion;
+            }
+            else {
+                return {
+                    item: suggestion,
+                    selected: false,
+                    ariaLabel: _this.getAriaLabel !== undefined
+                        ? _this.getAriaLabel(suggestion)
+                        : suggestion.name ||
+                            suggestion.text ||
+                            // eslint-disable-next-line @typescript-eslint/no-deprecated
+                            suggestion.primaryText,
+                };
+            }
+        };
+        this.suggestions = [];
+        this.getAriaLabel = options && options.getAriaLabel;
+    }
+    SuggestionsStore.prototype.updateSuggestions = function (newSuggestions) {
+        if (newSuggestions && newSuggestions.length > 0) {
+            this.suggestions = this.convertSuggestionsToSuggestionItems(newSuggestions);
+        }
+        else {
+            this.suggestions = [];
+        }
+    };
+    SuggestionsStore.prototype.getSuggestions = function () {
+        return this.suggestions;
+    };
+    SuggestionsStore.prototype.getSuggestionAtIndex = function (index) {
+        return this.suggestions[index];
+    };
+    SuggestionsStore.prototype.removeSuggestion = function (index) {
+        this.suggestions.splice(index, 1);
+    };
+    SuggestionsStore.prototype.convertSuggestionsToSuggestionItems = function (suggestions) {
+        return Array.isArray(suggestions) ? suggestions.map(this._ensureSuggestionModel) : [];
+    };
+    return SuggestionsStore;
+}());
+exports.SuggestionsStore = SuggestionsStore;
+//# sourceMappingURL=SuggestionsStore.js.map

node_modules/@fluentui/react/lib-commonjs/components/FloatingPicker/Suggestions/SuggestionsStore.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SuggestionsStore.js","sourceRoot":"../src/","sources":["components/FloatingPicker/Suggestions/SuggestionsStore.ts"],"names":[],"mappings":";;;AAOA;IAIE,0BAAY,OAAoC;QAAhD,iBAGC;QA0BO,uBAAkB,GAAG,UAAC,KAA8B;YAC1D,OAA6B,KAAM,CAAC,IAAI,KAAK,SAAS,CAAC;QACzD,CAAC,CAAC;QAEM,2BAAsB,GAAG,UAAC,UAAmC;YACnE,IAAI,KAAI,CAAC,kBAAkB,CAAC,UAAU,CAAC,EAAE,CAAC;gBACxC,OAAO,UAAU,CAAC;YACpB,CAAC;iBAAM,CAAC;gBACN,OAAO;oBACL,IAAI,EAAE,UAAU;oBAChB,QAAQ,EAAE,KAAK;oBACf,SAAS,EACP,KAAI,CAAC,YAAY,KAAK,SAAS;wBAC7B,CAAC,CAAC,KAAI,CAAC,YAAY,CAAC,UAAU,CAAC;wBAC/B,CAAC,CAAE,UAA0B,CAAC,IAAI;4BAChB,UAAW,CAAC,IAAI;4BAChC,4DAA4D;4BAC5C,UAAW,CAAC,WAAW;iBAC9C,CAAC;YACJ,CAAC;QACH,CAAC,CAAC;QAhDA,IAAI,CAAC,WAAW,GAAG,EAAE,CAAC;QACtB,IAAI,CAAC,YAAY,GAAG,OAAO,IAAI,OAAO,CAAC,YAAY,CAAC;IACtD,CAAC;IAEM,4CAAiB,GAAxB,UAAyB,cAAmB;QAC1C,IAAI,cAAc,IAAI,cAAc,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;YAChD,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,mCAAmC,CAAC,cAAc,CAAC,CAAC;QAC9E,CAAC;aAAM,CAAC;YACN,IAAI,CAAC,WAAW,GAAG,EAAE,CAAC;QACxB,CAAC;IACH,CAAC;IAEM,yCAAc,GAArB;QACE,OAAO,IAAI,CAAC,WAAW,CAAC;IAC1B,CAAC;IAEM,+CAAoB,GAA3B,UAA4B,KAAa;QACvC,OAAO,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;IACjC,CAAC;IAEM,2CAAgB,GAAvB,UAAwB,KAAa;QACnC,IAAI,CAAC,WAAW,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC;IACpC,CAAC;IAEM,8DAAmC,GAA1C,UAA2C,WAA2C;QACpF,OAAO,KAAK,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,GAAG,CAAC,IAAI,CAAC,sBAAsB,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;IACxF,CAAC;IAuBH,uBAAC;AAAD,CAAC,AAtDD,IAsDC;AAtDY,4CAAgB","sourcesContent":["import type { ISuggestionModel, ITag } from '../../../Pickers';\nimport type { IPersonaProps } from '../../../Persona';\n\nexport type SuggestionsStoreOptions<T> = {\n  getAriaLabel?: (item: T) => string;\n};\n\nexport class SuggestionsStore<T> {\n  public suggestions: ISuggestionModel<T>[];\n  private getAriaLabel?: (item: T) => string;\n\n  constructor(options?: SuggestionsStoreOptions<T>) {\n    this.suggestions = [];\n    this.getAriaLabel = options && options.getAriaLabel;\n  }\n\n  public updateSuggestions(newSuggestions: T[]): void {\n    if (newSuggestions && newSuggestions.length > 0) {\n      this.suggestions = this.convertSuggestionsToSuggestionItems(newSuggestions);\n    } else {\n      this.suggestions = [];\n    }\n  }\n\n  public getSuggestions(): ISuggestionModel<T>[] {\n    return this.suggestions;\n  }\n\n  public getSuggestionAtIndex(index: number): ISuggestionModel<T> {\n    return this.suggestions[index];\n  }\n\n  public removeSuggestion(index: number): void {\n    this.suggestions.splice(index, 1);\n  }\n\n  public convertSuggestionsToSuggestionItems(suggestions: Array<ISuggestionModel<T> | T>): ISuggestionModel<T>[] {\n    return Array.isArray(suggestions) ? suggestions.map(this._ensureSuggestionModel) : [];\n  }\n\n  private _isSuggestionModel = (value: ISuggestionModel<T> | T): value is ISuggestionModel<T> => {\n    return (<ISuggestionModel<T>>value).item !== undefined;\n  };\n\n  private _ensureSuggestionModel = (suggestion: ISuggestionModel<T> | T): ISuggestionModel<T> => {\n    if (this._isSuggestionModel(suggestion)) {\n      return suggestion;\n    } else {\n      return {\n        item: suggestion,\n        selected: false,\n        ariaLabel:\n          this.getAriaLabel !== undefined\n            ? this.getAriaLabel(suggestion)\n            : (suggestion as any as ITag).name ||\n              (<IPersonaProps>suggestion).text ||\n              // eslint-disable-next-line @typescript-eslint/no-deprecated\n              (<IPersonaProps>suggestion).primaryText,\n      };\n    }\n  };\n}\n"]}