{"version":3,"file":"vendors.86b999da913c0cbd.js","sources":["webpack://storefronts/./node_modules/@fluentui/dom-utilities/lib/elementContains.js","webpack://storefronts/./node_modules/@fluentui/dom-utilities/lib/elementContainsAttribute.js","webpack://storefronts/./node_modules/@fluentui/dom-utilities/lib/findElementRecursive.js","webpack://storefronts/./node_modules/@fluentui/dom-utilities/lib/getParent.js","webpack://storefronts/./node_modules/@fluentui/dom-utilities/lib/getVirtualParent.js","webpack://storefronts/./node_modules/@fluentui/dom-utilities/lib/isVirtualElement.js","webpack://storefronts/./node_modules/@fluentui/dom-utilities/lib/portalContainsElement.js","webpack://storefronts/./node_modules/@fluentui/dom-utilities/lib/setPortalAttribute.js","webpack://storefronts/./node_modules/@fluentui/dom-utilities/lib/setVirtualParent.js","webpack://storefronts/./node_modules/@fluentui/font-icons-mdl2/lib/fabric-icons.js","webpack://storefronts/./node_modules/@fluentui/font-icons-mdl2/lib/fabric-icons-0.js","webpack://storefronts/./node_modules/@fluentui/font-icons-mdl2/lib/fabric-icons-1.js","webpack://storefronts/./node_modules/@fluentui/font-icons-mdl2/lib/fabric-icons-2.js","webpack://storefronts/./node_modules/@fluentui/font-icons-mdl2/lib/fabric-icons-3.js","webpack://storefronts/./node_modules/@fluentui/font-icons-mdl2/lib/fabric-icons-4.js","webpack://storefronts/./node_modules/@fluentui/font-icons-mdl2/lib/fabric-icons-5.js","webpack://storefronts/./node_modules/@fluentui/font-icons-mdl2/lib/fabric-icons-6.js","webpack://storefronts/./node_modules/@fluentui/font-icons-mdl2/lib/fabric-icons-7.js","webpack://storefronts/./node_modules/@fluentui/font-icons-mdl2/lib/fabric-icons-8.js","webpack://storefronts/./node_modules/@fluentui/font-icons-mdl2/lib/fabric-icons-9.js","webpack://storefronts/./node_modules/@fluentui/font-icons-mdl2/lib/fabric-icons-10.js","webpack://storefronts/./node_modules/@fluentui/font-icons-mdl2/lib/fabric-icons-11.js","webpack://storefronts/./node_modules/@fluentui/font-icons-mdl2/lib/fabric-icons-12.js","webpack://storefronts/./node_modules/@fluentui/font-icons-mdl2/lib/fabric-icons-13.js","webpack://storefronts/./node_modules/@fluentui/font-icons-mdl2/lib/fabric-icons-14.js","webpack://storefronts/./node_modules/@fluentui/font-icons-mdl2/lib/fabric-icons-15.js","webpack://storefronts/./node_modules/@fluentui/font-icons-mdl2/lib/fabric-icons-16.js","webpack://storefronts/./node_modules/@fluentui/font-icons-mdl2/lib/fabric-icons-17.js","webpack://storefronts/./node_modules/@fluentui/font-icons-mdl2/lib/iconAliases.js","webpack://storefronts/./node_modules/@fluentui/font-icons-mdl2/lib/version.js","webpack://storefronts/./node_modules/@fluentui/font-icons-mdl2/lib/index.js","webpack://storefronts/./node_modules/@fluentui/foundation-legacy/lib/createComponent.js","webpack://storefronts/./node_modules/@fluentui/foundation-legacy/lib/slots.js","webpack://storefronts/./node_modules/@fluentui/foundation-legacy/lib/utilities.js","webpack://storefronts/./node_modules/@fluentui/merge-styles/lib/shadowConfig.js","webpack://storefronts/./node_modules/@fluentui/merge-styles/lib/StyleOptionsState.js","webpack://storefronts/./node_modules/@fluentui/merge-styles/lib/Stylesheet.js","webpack://storefronts/./node_modules/@fluentui/merge-styles/lib/getVendorSettings.js","webpack://storefronts/./node_modules/@fluentui/merge-styles/lib/transforms/rtlifyRules.js","webpack://storefronts/./node_modules/@fluentui/merge-styles/lib/ShadowDomStylesheet.js","webpack://storefronts/./node_modules/@fluentui/merge-styles/lib/extractStyleParts.js","webpack://storefronts/./node_modules/@fluentui/merge-styles/lib/transforms/kebabRules.js","webpack://storefronts/./node_modules/@fluentui/merge-styles/lib/transforms/prefixRules.js","webpack://storefronts/./node_modules/@fluentui/merge-styles/lib/transforms/provideUnits.js","webpack://storefronts/./node_modules/@fluentui/merge-styles/lib/styleToClassName.js","webpack://storefronts/./node_modules/@fluentui/merge-styles/lib/tokenizeWithParentheses.js","webpack://storefronts/./node_modules/@fluentui/merge-styles/lib/mergeStyles.js","webpack://storefronts/./node_modules/@fluentui/merge-styles/lib/concatStyleSets.js","webpack://storefronts/./node_modules/@fluentui/merge-styles/lib/mergeStyleSets.js","webpack://storefronts/./node_modules/@fluentui/merge-styles/lib/concatStyleSetsWithProps.js","webpack://storefronts/./node_modules/@fluentui/merge-styles/lib/fontFace.js","webpack://storefronts/./node_modules/@fluentui/merge-styles/lib/keyframes.js","webpack://storefronts/./node_modules/@fluentui/merge-styles/lib/cloneCSSStyleSheet.js","webpack://storefronts/./node_modules/@fluentui/merge-styles/lib/version.js","webpack://storefronts/./node_modules/@fluentui/react-focus/lib/components/FocusZone/FocusZone.js","webpack://storefronts/./node_modules/@fluentui/react-focus/lib/components/FocusZone/FocusZone.types.js","webpack://storefronts/./node_modules/@fluentui/react-hooks/lib/version.js","webpack://storefronts/./node_modules/@fluentui/react-hooks/lib/useAsync.js","webpack://storefronts/./node_modules/@fluentui/react-hooks/lib/useConst.js","webpack://storefronts/./node_modules/@fluentui/react-hooks/lib/useBoolean.js","webpack://storefronts/./node_modules/@fluentui/react-hooks/lib/useConstCallback.js","webpack://storefronts/./node_modules/@fluentui/react-hooks/lib/useControllableValue.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/useIsomorphicLayoutEffect.js","webpack://storefronts/./node_modules/@fluentui/react-hooks/lib/useEventCallback.js","webpack://storefronts/./node_modules/@fluentui/react-hooks/lib/useForceUpdate.js","webpack://storefronts/./node_modules/@fluentui/react-hooks/lib/useId.js","webpack://storefronts/./node_modules/@fluentui/react-hooks/lib/useMergedRefs.js","webpack://storefronts/./node_modules/@fluentui/react-hooks/lib/useMount.js","webpack://storefronts/./node_modules/@fluentui/react-hooks/lib/useMountSync.js","webpack://storefronts/./node_modules/@fluentui/react-hooks/lib/useOnEvent.js","webpack://storefronts/./node_modules/@fluentui/react-hooks/lib/usePrevious.js","webpack://storefronts/./node_modules/@fluentui/react-hooks/lib/useRefEffect.js","webpack://storefronts/./node_modules/@fluentui/react-hooks/lib/useSetInterval.js","webpack://storefronts/./node_modules/@fluentui/react-hooks/lib/useSetTimeout.js","webpack://storefronts/./node_modules/@fluentui/react-hooks/lib/useTarget.js","webpack://storefronts/./node_modules/@fluentui/react-hooks/lib/useUnmount.js","webpack://storefronts/./node_modules/@fluentui/react-hooks/lib/useWarnings.js","webpack://storefronts/./node_modules/@fluentui/react-window-provider/lib/WindowProvider.js","webpack://storefronts/./node_modules/@fluentui/react-window-provider/lib/version.js","webpack://storefronts/./node_modules/@fluentui/react/lib/common/DirectionalHint.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Button/ActionButton/ActionButton.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Button/ActionButton/ActionButton.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Button/BaseButton.classNames.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Button/BaseButton.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Button/BaseButton.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Button/ButtonThemes.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Button/CommandButton/CommandButton.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Button/DefaultButton/DefaultButton.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Button/DefaultButton/DefaultButton.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Button/IconButton/IconButton.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Button/IconButton/IconButton.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Button/PrimaryButton/PrimaryButton.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Button/SplitButton/SplitButton.classNames.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Button/SplitButton/SplitButton.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Callout/Callout.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Callout/CalloutContent.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Callout/CalloutContent.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Callout/CalloutContent.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Check/Check.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Check/Check.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Check/Check.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Checkbox/Checkbox.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Checkbox/Checkbox.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Checkbox/Checkbox.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/ChoiceGroup/ChoiceGroup.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/ChoiceGroup/ChoiceGroup.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/ChoiceGroup/ChoiceGroup.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/ChoiceGroup/ChoiceGroupOption/ChoiceGroupOption.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/ChoiceGroup/ChoiceGroupOption/ChoiceGroupOption.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/ChoiceGroup/ChoiceGroupOption/ChoiceGroupOption.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/ContextualMenu/ContextualMenuItemWrapper/ContextualMenuItemWrapper.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/ContextualMenu/ContextualMenuItemWrapper/ContextualMenuAnchor.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/ContextualMenu/ContextualMenuItemWrapper/ContextualMenuSplitButton.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/ContextualMenu/ContextualMenuItemWrapper/ContextualMenuButton.js","webpack://storefronts/./node_modules/@fluentui/react/lib/utilities/MenuContext/MenuContext.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/ContextualMenu/ContextualMenu.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Divider/VerticalDivider.classNames.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/ContextualMenu/ContextualMenu.classNames.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/ContextualMenu/ContextualMenu.cnstyles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/ContextualMenu/ContextualMenu.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/ContextualMenu/ContextualMenu.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/ContextualMenu/ContextualMenu.types.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/ContextualMenu/ContextualMenuItem.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/ContextualMenu/ContextualMenuItem.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/DetailsList/DetailsColumn.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/DetailsList/DetailsColumn.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/DetailsList/DetailsColumn.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/DetailsList/DetailsHeader.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/DetailsList/DetailsHeader.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/DetailsList/DetailsHeader.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/DetailsList/DetailsHeader.types.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/DetailsList/DetailsList.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/DetailsList/DetailsList.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/DetailsList/DetailsList.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/DetailsList/DetailsList.types.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/DetailsList/DetailsRow.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/DetailsList/DetailsRow.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/DetailsList/DetailsRow.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/DetailsList/DetailsRowCheck.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/DetailsList/DetailsRowCheck.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/DetailsList/DetailsRowFields.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Divider/VerticalDivider.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Divider/VerticalDivider.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Divider/VerticalDivider.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Dropdown/utilities/DropdownSizePosCache.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Dropdown/Dropdown.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Dropdown/Dropdown.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Dropdown/Dropdown.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Fabric/Fabric.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Fabric/Fabric.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Fabric/Fabric.js","webpack://storefronts/./node_modules/@fluentui/dom-utilities/lib/getActiveElement.js","webpack://storefronts/./node_modules/@fluentui/dom-utilities/lib/getEventTarget.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/FocusTrapZone/FocusTrapZone.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/GroupedList/GroupFooter.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/GroupedList/GroupFooter.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/GroupedList/GroupFooter.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/GroupedList/GroupHeader.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/GroupedList/GroupHeader.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/GroupedList/GroupHeader.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/GroupedList/GroupShowAll.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/GroupedList/GroupShowAll.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/GroupedList/GroupShowAll.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/GroupedList/GroupSpacer.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/GroupedList/GroupedList.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/GroupedList/GroupedList.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/GroupedList/GroupedList.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/GroupedList/GroupedList.types.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/GroupedList/GroupedListSection.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Icon/FontIcon.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Icon/Icon.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Icon/Icon.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Icon/Icon.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Icon/Icon.types.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Icon/ImageIcon.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Image/Image.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Image/Image.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Image/Image.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Image/Image.types.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/KeytipData/KeytipData.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/KeytipData/useKeytipData.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Label/Label.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Label/Label.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Label/Label.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Layer/Layer.base.js","webpack://storefronts/./node_modules/@fluentui/react-portal-compat-context/lib/PortalCompatContext.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Layer/Layer.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Layer/Layer.notification.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Layer/Layer.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Link/useLink.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Link/Link.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Link/Link.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Link/Link.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/List/utils/scroll.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/List/List.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/List/List.types.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/MessageBar/MessageBar.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/MessageBar/MessageBar.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/MessageBar/MessageBar.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/MessageBar/MessageBar.types.js","webpack://storefronts/./node_modules/@fluentui/react/lib/utilities/DraggableZone/DraggableZone.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/utilities/DraggableZone/DraggableZone.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Modal/Modal.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Modal/Modal.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Modal/Modal.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Overlay/Overlay.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Overlay/Overlay.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Overlay/Overlay.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Panel/Panel.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Panel/Panel.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Panel/Panel.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Panel/Panel.types.js","webpack://storefronts/./node_modules/@fluentui/react/lib/utilities/observeResize.js","webpack://storefronts/./node_modules/@fluentui/react/lib/utilities/useOverflow.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Pivot/Pivot.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Pivot/Pivot.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Pivot/Pivot.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Pivot/PivotItem.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Popup/Popup.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Separator/Separator.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Separator/Separator.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Separator/Separator.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Shimmer/Shimmer.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Shimmer/Shimmer.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Shimmer/Shimmer.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Shimmer/Shimmer.types.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Shimmer/ShimmerCircle/ShimmerCircle.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Shimmer/ShimmerCircle/ShimmerCircle.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Shimmer/ShimmerCircle/ShimmerCircle.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Shimmer/ShimmerElementsGroup/ShimmerElementsGroup.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Shimmer/ShimmerElementsGroup/ShimmerElementsGroup.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Shimmer/ShimmerElementsGroup/ShimmerElementsGroup.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Shimmer/ShimmerGap/ShimmerGap.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Shimmer/ShimmerGap/ShimmerGap.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Shimmer/ShimmerGap/ShimmerGap.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Shimmer/ShimmerLine/ShimmerLine.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Shimmer/ShimmerLine/ShimmerLine.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Shimmer/ShimmerLine/ShimmerLine.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/SpinButton/SpinButton.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/SpinButton/SpinButton.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/SpinButton/SpinButton.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/SpinButton/SpinButton.types.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Spinner/Spinner.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Spinner/Spinner.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Spinner/Spinner.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Spinner/Spinner.types.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Stack/StackUtils.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Stack/Stack.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Stack/Stack.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Stack/StackItem/StackItem.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Stack/StackItem/StackItem.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Text/Text.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Text/Text.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Text/Text.view.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/TextField/TextField.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/TextField/TextField.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/TextField/TextField.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Tooltip/Tooltip.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Tooltip/Tooltip.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Tooltip/Tooltip.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Tooltip/Tooltip.types.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Tooltip/TooltipHost.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Tooltip/TooltipHost.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Tooltip/TooltipHost.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Tooltip/TooltipHost.types.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Persona/Persona.types.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Persona/PersonaConsts.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/ResizeGroup/ResizeGroup.types.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Button/Button.types.js","webpack://storefronts/./node_modules/@fluentui/date-time-utilities/lib/dateValues/dateValues.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Calendar/Calendar.types.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Calendar/CalendarYear/CalendarYear.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/utilities/color/shades.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/ComboBox/ComboBox.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Dialog/DialogContent.types.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/DocumentCard/DocumentCard.types.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Facepile/Facepile.types.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/FloatingPicker/Suggestions/SuggestionsControl.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/HoverCard/HoverCard.types.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/HoverCard/ExpandingCard.types.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/pickers/Suggestions/Suggestions.types.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/pickers/BasePicker.types.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Pivot/Pivot.types.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Rating/Rating.types.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Sticky/Sticky.types.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/ThemeGenerator/ThemeRulesStandard.js","webpack://storefronts/./node_modules/@fluentui/theme/lib/motion/FluentMotion.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Coachmark/PositioningContainer/PositioningContainer.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/ComboBox/ComboBox.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Nav/Nav.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/ActivityItem/ActivityItem.classNames.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/ActivityItem/ActivityItem.styles.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/initials.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Persona/PersonaPresence/PersonaPresence.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Persona/PersonaPresence/PersonaPresence.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Persona/PersonaPresence/PersonaPresence.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Persona/PersonaInitialsColor.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Persona/PersonaCoin/PersonaCoin.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Persona/PersonaCoin/PersonaCoin.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Persona/PersonaCoin/PersonaCoin.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/ActivityItem/ActivityItem.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Autofill/Autofill.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Announced/Announced.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Announced/Announced.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Announced/Announced.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/ResizeGroup/ResizeGroup.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/ResizeGroup/ResizeGroup.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Breadcrumb/Breadcrumb.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Breadcrumb/Breadcrumb.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Breadcrumb/Breadcrumb.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Button/CompoundButton/CompoundButton.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Button/CompoundButton/CompoundButton.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Button/Button.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Button/CommandBarButton/CommandBarButton.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Button/CommandBarButton/CommandBarButton.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Button/MessageBarButton/MessageBarButton.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Button/MessageBarButton/MessageBarButton.js","webpack://storefronts/./node_modules/@fluentui/react/lib/utilities/ButtonGrid/ButtonGridCell.js","webpack://storefronts/./node_modules/@fluentui/react/lib/utilities/ButtonGrid/ButtonGrid.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/utilities/ButtonGrid/ButtonGrid.js","webpack://storefronts/./node_modules/@fluentui/react/lib/utilities/ButtonGrid/ButtonGrid.styles.js","webpack://storefronts/./node_modules/@fluentui/date-time-utilities/lib/dateFormatting/dateFormatting.defaults.js","webpack://storefronts/./node_modules/@fluentui/date-time-utilities/lib/dateValues/timeConstants.js","webpack://storefronts/./node_modules/@fluentui/date-time-utilities/lib/dateMath/dateMath.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/string.js","webpack://storefronts/./node_modules/@fluentui/date-time-utilities/lib/dateGrid/isContiguous.js","webpack://storefronts/./node_modules/@fluentui/date-time-utilities/lib/dateGrid/getBoundedDateRange.js","webpack://storefronts/./node_modules/@fluentui/date-time-utilities/lib/dateGrid/isBeforeMinDate.js","webpack://storefronts/./node_modules/@fluentui/date-time-utilities/lib/dateGrid/isAfterMaxDate.js","webpack://storefronts/./node_modules/@fluentui/date-time-utilities/lib/dateGrid/isRestrictedDate.js","webpack://storefronts/./node_modules/@fluentui/date-time-utilities/lib/dateGrid/getDayGrid.js","webpack://storefronts/./node_modules/@fluentui/date-time-utilities/lib/dateGrid/getDateRangeTypeToUse.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/CalendarDayGrid/CalendarMonthHeaderRow.js","webpack://storefronts/./node_modules/@fluentui/date-time-utilities/lib/dateGrid/findAvailableDate.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/CalendarDayGrid/CalendarGridDayCell.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/CalendarDayGrid/CalendarGridRow.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/CalendarDayGrid/CalendarDayGrid.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/CalendarDayGrid/CalendarDayGrid.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/CalendarDayGrid/CalendarDayGrid.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Calendar/CalendarDay/CalendarDay.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Calendar/CalendarDay/CalendarDay.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Calendar/CalendarDay/CalendarDay.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Calendar/CalendarPicker/CalendarPicker.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Calendar/CalendarMonth/CalendarMonth.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Calendar/defaults.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Calendar/CalendarYear/CalendarYear.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Calendar/CalendarYear/CalendarYear.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Calendar/CalendarMonth/CalendarMonth.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Calendar/CalendarMonth/CalendarMonth.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Calendar/Calendar.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Calendar/Calendar.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Calendar/Calendar.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Callout/FocusTrapCallout.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Coachmark/Coachmark.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Coachmark/PositioningContainer/PositioningContainer.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Coachmark/Beak/Beak.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Coachmark/Beak/Beak.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Coachmark/Coachmark.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Coachmark/Coachmark.js","webpack://storefronts/./node_modules/@fluentui/react/lib/utilities/color/consts.js","webpack://storefronts/./node_modules/@fluentui/react/lib/utilities/color/clamp.js","webpack://storefronts/./node_modules/@fluentui/react/lib/utilities/color/correctRGB.js","webpack://storefronts/./node_modules/@fluentui/react/lib/utilities/color/rgb2hsv.js","webpack://storefronts/./node_modules/@fluentui/react/lib/utilities/color/rgb2hex.js","webpack://storefronts/./node_modules/@fluentui/react/lib/utilities/color/_rgbaOrHexString.js","webpack://storefronts/./node_modules/@fluentui/react/lib/utilities/color/getColorFromRGBA.js","webpack://storefronts/./node_modules/@fluentui/react/lib/utilities/color/hsv2hsl.js","webpack://storefronts/./node_modules/@fluentui/react/lib/utilities/color/hsv2rgb.js","webpack://storefronts/./node_modules/@fluentui/react/lib/utilities/color/updateA.js","webpack://storefronts/./node_modules/@fluentui/react/lib/utilities/color/correctHex.js","webpack://storefronts/./node_modules/@fluentui/react/lib/utilities/color/hsl2hsv.js","webpack://storefronts/./node_modules/@fluentui/react/lib/utilities/color/hsl2rgb.js","webpack://storefronts/./node_modules/@fluentui/react/lib/utilities/color/cssColor.js","webpack://storefronts/./node_modules/@fluentui/react/lib/utilities/color/getColorFromString.js","webpack://storefronts/./node_modules/@fluentui/react/lib/utilities/color/hsv2hex.js","webpack://storefronts/./node_modules/@fluentui/react/lib/utilities/color/correctHSV.js","webpack://storefronts/./node_modules/@fluentui/react/lib/utilities/color/updateT.js","webpack://storefronts/./node_modules/@fluentui/react/lib/utilities/color/getColorFromHSV.js","webpack://storefronts/./node_modules/@fluentui/react/lib/utilities/color/updateSV.js","webpack://storefronts/./node_modules/@fluentui/react/lib/utilities/color/updateRGB.js","webpack://storefronts/./node_modules/@fluentui/react/lib/utilities/color/getFullColorString.js","webpack://storefronts/./node_modules/@fluentui/react/lib/utilities/color/updateH.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/ColorPicker/ColorRectangle/ColorRectangle.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/ColorPicker/ColorRectangle/ColorRectangle.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/ColorPicker/ColorRectangle/ColorRectangle.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/ColorPicker/ColorSlider/ColorSlider.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/ColorPicker/ColorSlider/ColorSlider.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/ColorPicker/ColorSlider/ColorSlider.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/ColorPicker/ColorPicker.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/ColorPicker/ColorPicker.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/ColorPicker/ColorPicker.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/ComboBox/ComboBox.classNames.js","webpack://storefronts/./node_modules/@fluentui/dom-utilities/lib/getChildren.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/ComboBox/VirtualizedComboBox.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/OverflowSet/OverflowButton.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/OverflowSet/OverflowSet.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/OverflowSet/OverflowSet.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/OverflowSet/OverflowSet.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/CommandBar/CommandBar.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/CommandBar/CommandBar.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/CommandBar/CommandBar.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/DatePicker/defaults.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/DatePicker/DatePicker.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/DatePicker/DatePicker.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/DatePicker/DatePicker.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Dialog/DialogFooter.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Dialog/DialogFooter.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Dialog/DialogFooter.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Dialog/DialogContent.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Dialog/DialogContent.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Dialog/DialogContent.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Dialog/Dialog.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Dialog/Dialog.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Dialog/Dialog.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/DocumentCard/DocumentCardDetails.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/DocumentCard/DocumentCardDetails.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/DocumentCard/DocumentCardDetails.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/DocumentCard/DocumentCard.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/DocumentCard/DocumentCardTitle.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/DocumentCard/DocumentCardTitle.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/DocumentCard/DocumentCardTitle.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/DocumentCard/DocumentCardActivity.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/DocumentCard/DocumentCardActivity.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/DocumentCard/DocumentCardActivity.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/DocumentCard/DocumentCardStatus.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/DocumentCard/DocumentCardStatus.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/DocumentCard/DocumentCardStatus.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/DocumentCard/DocumentCardActions.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/DocumentCard/DocumentCardActions.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/DocumentCard/DocumentCardActions.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/DocumentCard/DocumentCardPreview.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/DocumentCard/DocumentCardPreview.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/DocumentCard/DocumentCardPreview.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/DocumentCard/DocumentCardLocation.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/DocumentCard/DocumentCard.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/DocumentCard/DocumentCard.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/DocumentCard/DocumentCardLogo.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/DocumentCard/DocumentCardLogo.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/DocumentCard/DocumentCardLogo.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/DocumentCard/DocumentCardLocation.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/DocumentCard/DocumentCardLocation.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/DocumentCard/DocumentCardImage.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/DocumentCard/DocumentCardImage.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/DocumentCard/DocumentCardImage.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/ExtendedPicker/PeoplePicker/ExtendedPeoplePicker.scss.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/ExtendedPicker/BaseExtendedPicker.scss.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/ExtendedPicker/BaseExtendedPicker.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/ExtendedPicker/PeoplePicker/ExtendedPeoplePicker.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Facepile/FacepileButton.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Facepile/FacepileButton.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Persona/Persona.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Persona/Persona.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Persona/Persona.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Facepile/Facepile.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Facepile/Facepile.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Facepile/Facepile.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/pickers/Suggestions/Suggestions.scss.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/pickers/Suggestions/SuggestionsItem.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/FloatingPicker/Suggestions/SuggestionsCore.scss.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/FloatingPicker/Suggestions/SuggestionsCore.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/FloatingPicker/Suggestions/SuggestionsControl.scss.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/FloatingPicker/BaseFloatingPicker.scss.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/FloatingPicker/BaseFloatingPicker.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/FloatingPicker/PeoplePicker/PeoplePicker.scss.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/FloatingPicker/PeoplePicker/FloatingPeoplePicker.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/FloatingPicker/PeoplePicker/PeoplePickerItems/SuggestionItemDefault.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/FloatingPicker/Suggestions/SuggestionsStore.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/GroupedList/GroupedListV2.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/GroupedList/GroupedListV2.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/HoverCard/HoverCard.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/HoverCard/ExpandingCard.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/HoverCard/CardCallout/CardCallout.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/HoverCard/ExpandingCard.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/HoverCard/ExpandingCard.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/HoverCard/PlainCard/PlainCard.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/HoverCard/PlainCard/PlainCard.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/HoverCard/PlainCard/PlainCard.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/HoverCard/HoverCard.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/HoverCard/HoverCard.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/KeytipLayer/KeytipLayer.styles.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/dom/getFirstVisibleElementFromSelector.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Keytip/KeytipContent.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Keytip/Keytip.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Keytip/KeytipContent.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Keytip/Keytip.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/KeytipLayer/KeytipTree.js","webpack://storefronts/./node_modules/@fluentui/react/lib/utilities/keytips/IKeytipTransitionKey.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/KeytipLayer/KeytipLayer.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/KeytipLayer/KeytipLayer.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/KeytipData/useKeytipRef.js","webpack://storefronts/./node_modules/@fluentui/react/lib/utilities/keytips/KeytipConfig.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Layer/LayerHost.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/AutoScroll.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/MarqueeSelection/MarqueeSelection.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/MarqueeSelection/MarqueeSelection.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/MarqueeSelection/MarqueeSelection.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Nav/Nav.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Nav/Nav.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/pickers/Suggestions/SuggestionsItem.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/pickers/Suggestions/Suggestions.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/pickers/Suggestions/Suggestions.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/pickers/Suggestions/SuggestionsController.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/pickers/BasePicker.scss.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/pickers/BasePicker.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/pickers/PeoplePicker/PeoplePickerItems/PeoplePickerItem.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/pickers/PeoplePicker/PeoplePickerItems/PeoplePickerItem.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/pickers/PeoplePicker/PeoplePickerItems/PeoplePickerItemSuggestion.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/pickers/PeoplePicker/PeoplePickerItems/PeoplePickerItemSuggestion.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/pickers/BasePicker.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/pickers/PeoplePicker/PeoplePicker.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/pickers/TagPicker/TagItem.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/pickers/TagPicker/TagItem.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/pickers/TagPicker/TagItemSuggestion.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/pickers/TagPicker/TagItemSuggestion.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/pickers/TagPicker/TagPicker.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/ProgressIndicator/ProgressIndicator.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/ProgressIndicator/ProgressIndicator.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/ProgressIndicator/ProgressIndicator.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Rating/Rating.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Rating/Rating.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Rating/Rating.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/ScrollablePane/ScrollablePane.types.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/ScrollablePane/ScrollablePane.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/ScrollablePane/ScrollablePane.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/ScrollablePane/ScrollablePane.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/SearchBox/SearchBox.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/SearchBox/SearchBox.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/SearchBox/SearchBox.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/SelectedItemsList/BaseSelectedItemsList.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/SelectedItemsList/SelectedPeopleList/Items/ExtendedSelectedItem.scss.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/SelectedItemsList/SelectedPeopleList/Items/ExtendedSelectedItem.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/SelectedItemsList/SelectedPeopleList/Items/SelectedItemWithContextMenu.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/SelectedItemsList/SelectedPeopleList/Items/EditingItem.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/SelectedItemsList/SelectedPeopleList/Items/EditingItem.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/SelectedItemsList/SelectedPeopleList/SelectedPeopleList.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/DetailsList/ShimmeredDetailsList.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/DetailsList/ShimmeredDetailsList.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/DetailsList/ShimmeredDetailsList.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Slider/useSlider.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Slider/Slider.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Slider/Slider.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Slider/Slider.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Sticky/util/scroll.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Sticky/util/comparison.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Sticky/Sticky.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/SwatchColorPicker/ColorPickerGridCell.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/SwatchColorPicker/ColorPickerGridCell.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/SwatchColorPicker/ColorPickerGridCell.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/SwatchColorPicker/SwatchColorPicker.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/SwatchColorPicker/SwatchColorPicker.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/SwatchColorPicker/SwatchColorPicker.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/TeachingBubble/TeachingBubbleContent.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/TeachingBubble/TeachingBubble.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/TeachingBubble/TeachingBubbleContent.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/TeachingBubble/TeachingBubble.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/TeachingBubble/TeachingBubble.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/TextField/MaskedTextField/inputMask.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/TextField/MaskedTextField/MaskedTextField.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/ThemeGenerator/ThemeGenerator.js","webpack://storefronts/./node_modules/@fluentui/date-time-utilities/lib/timeMath/timeMath.js","webpack://storefronts/./node_modules/@fluentui/date-time-utilities/lib/timeFormatting/index.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/TimePicker/TimePicker.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Toggle/Toggle.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Toggle/Toggle.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/Toggle/Toggle.styles.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/shadowDom/hooks/useMergeStylesRootStylesheets.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/shadowDom/hooks/useAdoptedStylesheet.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/assertNever.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/resources.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/dom/setSSR.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/asAsync.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/initializeFocusRects.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/shadowDom/hooks/useShadowConfig.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/shadowDom/hooks/useStyled.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/shadowDom/contexts/MergeStylesRootContext.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/safeSetTimeout.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/FabricPerformance.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/dom/raiseClick.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/WeeklyDayPicker/defaults.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/WeeklyDayPicker/WeeklyDayPicker.base.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/WeeklyDayPicker/WeeklyDayPicker.styles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/components/WeeklyDayPicker/WeeklyDayPicker.js","webpack://storefronts/./node_modules/@fluentui/react/lib/utilities/ThemeProvider/ThemeContext.js","webpack://storefronts/./node_modules/@fluentui/react/lib/utilities/ThemeProvider/useTheme.js","webpack://storefronts/./node_modules/@fluentui/react/lib/utilities/ThemeProvider/styleRenderers/mergeStylesRenderer.js","webpack://storefronts/./node_modules/@fluentui/react/lib/utilities/ThemeProvider/makeStyles.js","webpack://storefronts/./node_modules/@fluentui/react/lib/utilities/ThemeProvider/useThemeProviderClasses.js","webpack://storefronts/./node_modules/@fluentui/react/lib/utilities/ThemeProvider/renderThemeProvider.js","webpack://storefronts/./node_modules/@fluentui/react/lib/utilities/ThemeProvider/useThemeProviderState.js","webpack://storefronts/./node_modules/@fluentui/react/lib/utilities/ThemeProvider/useThemeProvider.js","webpack://storefronts/./node_modules/@fluentui/react/lib/utilities/ThemeProvider/ThemeProvider.js","webpack://storefronts/./node_modules/@fluentui/theme/lib/FluentTheme.js","webpack://storefronts/./node_modules/@fluentui/react/lib/version.js","webpack://storefronts/./node_modules/@fluentui/react/lib/utilities/contextualMenu/contextualMenuUtility.js","webpack://storefronts/./node_modules/@fluentui/react/lib/utilities/decorators/BaseDecorator.js","webpack://storefronts/./node_modules/@fluentui/react/lib/utilities/decorators/withResponsiveMode.js","webpack://storefronts/./node_modules/@fluentui/react/lib/utilities/decorators/withViewport.js","webpack://storefronts/./node_modules/@fluentui/react/lib/utilities/dom.js","webpack://storefronts/./node_modules/@fluentui/react/lib/utilities/dragdrop/DragDropHelper.js","webpack://storefronts/./node_modules/@fluentui/react/lib/utilities/groupedList/GroupedListUtility.js","webpack://storefronts/./node_modules/@fluentui/react/lib/utilities/hooks/useResponsiveMode.js","webpack://storefronts/./node_modules/@fluentui/react/lib/utilities/keytips/KeytipConstants.js","webpack://storefronts/./node_modules/@fluentui/react/lib/utilities/keytips/KeytipManager.js","webpack://storefronts/./node_modules/@fluentui/react/lib/utilities/keytips/KeytipUtils.js","webpack://storefronts/./node_modules/@fluentui/react/lib/utilities/positioning/positioning.js","webpack://storefronts/./node_modules/@fluentui/react/lib/utilities/positioning/positioning.types.js","webpack://storefronts/./node_modules/@fluentui/react/lib/utilities/selectableOption/SelectableOption.js","webpack://storefronts/./node_modules/@fluentui/react/lib/utilities/selectableOption/SelectableOption.types.js","webpack://storefronts/./node_modules/@fluentui/react/lib/utilities/selection/SelectionZone.js","webpack://storefronts/./node_modules/@fluentui/set-version/lib/setVersion.js","webpack://storefronts/./node_modules/@fluentui/set-version/lib/index.js","webpack://storefronts/./node_modules/@fluentui/style-utilities/lib/styles/zIndexes.js","webpack://storefronts/./node_modules/@fluentui/style-utilities/lib/styles/theme.js","webpack://storefronts/./node_modules/@fluentui/style-utilities/lib/classNames/ColorClassNames.js","webpack://storefronts/./node_modules/@fluentui/style-utilities/lib/utilities/buildClassMap.js","webpack://storefronts/./node_modules/@fluentui/style-utilities/lib/classNames/FontClassNames.js","webpack://storefronts/./node_modules/@fluentui/theme/lib/motion/AnimationStyles.js","webpack://storefronts/./node_modules/@fluentui/style-utilities/lib/classNames/AnimationClassNames.js","webpack://storefronts/./node_modules/@fluentui/style-utilities/lib/styles/CommonStyles.js","webpack://storefronts/./node_modules/@fluentui/style-utilities/lib/styles/GeneralStyles.js","webpack://storefronts/./node_modules/@fluentui/style-utilities/lib/styles/hiddenContentStyle.js","webpack://storefronts/./node_modules/@fluentui/style-utilities/lib/styles/getFocusStyle.js","webpack://storefronts/./node_modules/@fluentui/style-utilities/lib/styles/scheme.js","webpack://storefronts/./node_modules/@fluentui/style-utilities/lib/styles/getPlaceholderStyles.js","webpack://storefronts/./node_modules/@fluentui/style-utilities/lib/styles/getGlobalClassNames.js","webpack://storefronts/./node_modules/@fluentui/style-utilities/lib/styles/getFadedOverflowStyle.js","webpack://storefronts/./node_modules/@fluentui/style-utilities/lib/styles/PulsingBeaconAnimationStyles.js","webpack://storefronts/./node_modules/@fluentui/style-utilities/lib/utilities/icons.js","webpack://storefronts/./node_modules/@fluentui/style-utilities/lib/utilities/getIconClassName.js","webpack://storefronts/./node_modules/@fluentui/style-utilities/lib/cdn.js","webpack://storefronts/./node_modules/@fluentui/style-utilities/lib/version.js","webpack://storefronts/./node_modules/@fluentui/style-utilities/lib/index.js","webpack://storefronts/./node_modules/@fluentui/theme/lib/colors/DefaultPalette.js","webpack://storefronts/./node_modules/@fluentui/theme/lib/colors/FluentColors.js","webpack://storefronts/./node_modules/@fluentui/theme/lib/createTheme.js","webpack://storefronts/./node_modules/@fluentui/theme/lib/effects/DefaultEffects.js","webpack://storefronts/./node_modules/@fluentui/theme/lib/effects/FluentDepths.js","webpack://storefronts/./node_modules/@fluentui/theme/lib/fonts/DefaultFontStyles.js","webpack://storefronts/./node_modules/@fluentui/theme/lib/fonts/FluentFonts.js","webpack://storefronts/./node_modules/@fluentui/theme/lib/fonts/createFontStyles.js","webpack://storefronts/./node_modules/@fluentui/theme/lib/mergeThemes.js","webpack://storefronts/./node_modules/@fluentui/theme/lib/spacing/DefaultSpacing.js","webpack://storefronts/./node_modules/@fluentui/theme/lib/utilities/makeSemanticColors.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/Async.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/BaseComponent.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/DelayedRender.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/EventGroup.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/FocusRectsProvider.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/GlobalSettings.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/KeyCodes.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/Rectangle.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/appendFunction.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/aria.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/array.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/classNamesFunction.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/componentAs/composeComponentAs.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/controlled.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/createMergedRef.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/css.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/customizations/Customizations.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/customizations/Customizer.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/customizations/CustomizerContext.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/shadowDom/contexts/MergeStylesShadowRootConsumer.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/customizations/customizable.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/customizations/mergeCustomizations.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/customizations/mergeSettings.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/customizations/useCustomizationSettings.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/dom/canUseDOM.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/dom/getDocument.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/dom/getRect.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/dom/getWindow.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/dom/on.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/extendComponent.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/focus.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/getId.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/getNativeElementProps.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/getPropsWithDefaults.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/hoist.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/hoistStatics.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/ie11Detector.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/initializeComponentRef.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/keyboard.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/language.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/localStorage.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/math.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/memoize.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/merge.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/mobileDetector.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/modalize.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/object.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/osDetector.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/overflow.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/properties.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/renderFunction/composeRenderFunction.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/rtl.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/safeRequestAnimationFrame.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/scroll.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/selection/Selection.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/selection/Selection.types.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/sessionStorage.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/setFocusVisibility.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/shadowDom/contexts/MergeStylesDefaultContext.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/shadowDom/contexts/MergeStylesShadowRootContext.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/shadowDom/hooks/useMergeStylesHooks.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/shadowDom/hooks/useMergeStylesShadowRoot.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/styled.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/useFocusRects.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/warn/warn.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/warn/warnConditionallyRequiredProps.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/warn/warnControlledUsage.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/warn/warnDeprecations.js","webpack://storefronts/./node_modules/@fluentui/utilities/lib/warn/warnMutuallyExclusive.js","webpack://storefronts/./node_modules/@microsoft/1ds-analytics-web-js/dist-esm/src/ApplicationInsights.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-core-js/dist-esm/JavaScriptSDK.Enums/LoggingEnums.js","webpack://storefronts/./node_modules/@microsoft/1ds-core-js/dist-esm/src/Enums.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-core-js/dist-esm/JavaScriptSDK.Interfaces/IChannelControls.js","webpack://storefronts/./node_modules/@microsoft/1ds-analytics-web-js/dist-esm/src/Index.js","webpack://storefronts/./node_modules/@microsoft/1ds-auth-js/dist-esm/src/RequestHandler.js","webpack://storefronts/./node_modules/@microsoft/1ds-auth-js/dist-esm/src/WebAuthHandler.js","webpack://storefronts/./node_modules/@microsoft/1ds-auth-js/dist-esm/src/AuthPlugin.js","webpack://storefronts/./node_modules/@microsoft/1ds-auth-js/dist-esm/src/Enums.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-core-js/dist-esm/JavaScriptSDK/ChannelController.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-core-js/dist-esm/JavaScriptSDK/TelemetryInitializerPlugin.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-core-js/dist-esm/JavaScriptSDK/BaseCore.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-core-js/dist-esm/JavaScriptSDK/AppInsightsCore.js","webpack://storefronts/./node_modules/@microsoft/1ds-core-js/dist-esm/src/AppInsightsCore.js","webpack://storefronts/./node_modules/@microsoft/1ds-core-js/dist-esm/src/InternalConstants.js","webpack://storefronts/./node_modules/@microsoft/1ds-core-js/dist-esm/src/Utils.js","webpack://storefronts/./node_modules/@microsoft/1ds-cv-js/dist-esm/src/CorrelationVectorPlugin.js","webpack://storefronts/./node_modules/@microsoft/1ds-cv-js/dist-esm/src/Cv.js","webpack://storefronts/./node_modules/@microsoft/1ds-post-js/dist-esm/src/DataModels.js","webpack://storefronts/./node_modules/@microsoft/1ds-post-js/dist-esm/src/HttpManager.js","webpack://storefronts/./node_modules/@microsoft/1ds-post-js/dist-esm/src/InternalConstants.js","webpack://storefronts/./node_modules/@microsoft/1ds-post-js/dist-esm/src/EventBatch.js","webpack://storefronts/./node_modules/@microsoft/1ds-post-js/dist-esm/src/ClockSkewManager.js","webpack://storefronts/./node_modules/@microsoft/1ds-post-js/dist-esm/src/KillSwitch.js","webpack://storefronts/./node_modules/@microsoft/1ds-post-js/dist-esm/src/RetryPolicy.js","webpack://storefronts/./node_modules/@microsoft/1ds-post-js/dist-esm/src/Serializer.js","webpack://storefronts/./node_modules/@microsoft/1ds-post-js/dist-esm/src/TimeoutOverrideWrapper.js","webpack://storefronts/./node_modules/@microsoft/1ds-post-js/dist-esm/src/PostChannel.js","webpack://storefronts/./node_modules/@microsoft/1ds-properties-js/dist-esm/src/Utils.js","webpack://storefronts/./node_modules/@microsoft/1ds-properties-js/dist-esm/src/InternalConstants.js","webpack://storefronts/./node_modules/@microsoft/1ds-properties-js/dist-esm/src/ExtensionKeys.js","webpack://storefronts/./node_modules/@microsoft/1ds-properties-js/dist-esm/src/context/Session.js","webpack://storefronts/./node_modules/@microsoft/1ds-properties-js/dist-esm/src/SessionManager.js","webpack://storefronts/./node_modules/@microsoft/1ds-properties-js/dist-esm/src/context/Application.js","webpack://storefronts/./node_modules/@microsoft/1ds-properties-js/dist-esm/src/context/Cloud.js","webpack://storefronts/./node_modules/@microsoft/1ds-properties-js/dist-esm/src/context/Device.js","webpack://storefronts/./node_modules/@microsoft/1ds-properties-js/dist-esm/src/context/IntWeb.js","webpack://storefronts/./node_modules/@microsoft/1ds-properties-js/dist-esm/src/context/Loc.js","webpack://storefronts/./node_modules/@microsoft/1ds-properties-js/dist-esm/src/context/OperatingSystem.js","webpack://storefronts/./node_modules/@microsoft/1ds-properties-js/dist-esm/src/context/Sdk.js","webpack://storefronts/./node_modules/@microsoft/1ds-properties-js/dist-esm/src/context/Trace.js","webpack://storefronts/./node_modules/@microsoft/1ds-properties-js/dist-esm/src/context/User.js","webpack://storefronts/./node_modules/@microsoft/1ds-properties-js/dist-esm/src/context/Utc.js","webpack://storefronts/./node_modules/@microsoft/1ds-properties-js/dist-esm/src/context/Web.js","webpack://storefronts/./node_modules/@microsoft/1ds-properties-js/dist-esm/src/TelemetryContext.js","webpack://storefronts/./node_modules/@microsoft/1ds-properties-js/dist-esm/src/PropertiesPlugin.js","webpack://storefronts/./node_modules/@microsoft/1ds-qos-js/dist-esm/src/Id.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-common/dist-esm/Interfaces/Contracts/ContextTagKeys.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-common/dist-esm/Interfaces/PartAExtensions.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-dependencies-js/dist-esm/InternalConstants.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-dependencies-js/dist-esm/__DynamicConstants.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-dependencies-js/dist-esm/ajaxRecord.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-dependencies-js/dist-esm/ajax.js","webpack://storefronts/./node_modules/@microsoft/1ds-qos-js/dist-esm/src/common/DataCollector.js","webpack://storefronts/./node_modules/@microsoft/1ds-qos-js/dist-esm/src/common/Utils.js","webpack://storefronts/./node_modules/@microsoft/1ds-qos-js/dist-esm/src/events/QosEvent.js","webpack://storefronts/./node_modules/@microsoft/1ds-qos-js/dist-esm/src/events/IncomingQosEvent.js","webpack://storefronts/./node_modules/@microsoft/1ds-qos-js/dist-esm/src/events/OutgoingQosEvent.js","webpack://storefronts/./node_modules/@microsoft/1ds-qos-js/dist-esm/src/QosPlugin.js","webpack://storefronts/./node_modules/@microsoft/1ds-wa-js/dist-esm/src/Behaviors.js","webpack://storefronts/./node_modules/@microsoft/1ds-wa-js/dist-esm/src/DataCollector.js","webpack://storefronts/./node_modules/@microsoft/1ds-wa-js/dist-esm/src/Enums.js","webpack://storefronts/./node_modules/@microsoft/1ds-wa-js/dist-esm/src/Id.js","webpack://storefronts/./node_modules/@microsoft/1ds-wa-js/dist-esm/src/Timespan.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-common/dist-esm/Enums.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-common/dist-esm/StorageHelperFuncs.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-common/dist-esm/Telemetry/Event.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-common/dist-esm/Telemetry/Trace.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-common/dist-esm/Telemetry/Common/DataPoint.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-common/dist-esm/Telemetry/Metric.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-common/dist-esm/Telemetry/PageView.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-common/dist-esm/Telemetry/PageViewPerformance.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-common/dist-esm/Telemetry/Exception.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-common/dist-esm/DomHelperFuncs.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-analytics-js/dist-esm/__DynamicConstants.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-analytics-js/dist-esm/JavaScriptSDK/Telemetry/PageViewManager.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-analytics-js/dist-esm/JavaScriptSDK/Telemetry/PageViewPerformanceManager.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-analytics-js/dist-esm/JavaScriptSDK/Telemetry/PageVisitTimeManager.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-analytics-js/dist-esm/JavaScriptSDK/Timing.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-analytics-js/dist-esm/JavaScriptSDK/AnalyticsPlugin.js","webpack://storefronts/./node_modules/@microsoft/1ds-wa-js/dist-esm/src/events/WebEvent.js","webpack://storefronts/./node_modules/@microsoft/1ds-wa-js/dist-esm/src/common/Constants.js","webpack://storefronts/./node_modules/@microsoft/1ds-wa-js/dist-esm/src/events/ContentUpdate.js","webpack://storefronts/./node_modules/@microsoft/1ds-wa-js/dist-esm/src/events/PageAction.js","webpack://storefronts/./node_modules/@microsoft/1ds-wa-js/dist-esm/src/events/PageUnload.js","webpack://storefronts/./node_modules/@microsoft/1ds-wa-js/dist-esm/src/events/PageView.js","webpack://storefronts/./node_modules/@microsoft/1ds-wa-js/dist-esm/src/events/PageViewPerformance.js","webpack://storefronts/./node_modules/@microsoft/1ds-wa-js/dist-esm/src/handlers/DomContentHandler.js","webpack://storefronts/./node_modules/@microsoft/1ds-wa-js/dist-esm/src/WebAnalyticsPlugin.js","webpack://storefronts/./node_modules/@microsoft/1ds-wa-js/dist-esm/src/common/Utils.js","webpack://storefronts/./node_modules/@microsoft/1ds-wa-js/dist-esm/src/handlers/AutoCaptureHandler.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-common/dist-esm/Constants.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-common/dist-esm/HelperFuncs.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-common/dist-esm/RequestResponseHeaders.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-common/dist-esm/Telemetry/Common/DataSanitizer.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-common/dist-esm/Telemetry/RemoteDependencyData.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-common/dist-esm/TelemetryItemCreator.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-common/dist-esm/UrlHelperFuncs.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-common/dist-esm/Util.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-common/dist-esm/__DynamicConstants.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-common/dist-esm/applicationinsights-common.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-core-js/dist-esm/JavaScriptSDK.Enums/EnumHelperFuncs.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-core-js/dist-esm/JavaScriptSDK.Enums/EventsDiscardedReason.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-core-js/dist-esm/JavaScriptSDK/BaseTelemetryPlugin.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-core-js/dist-esm/JavaScriptSDK/CookieMgr.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-core-js/dist-esm/JavaScriptSDK/CoreUtils.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-core-js/dist-esm/JavaScriptSDK/DataCacheHelper.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-core-js/dist-esm/JavaScriptSDK/DbgExtensionUtils.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-core-js/dist-esm/JavaScriptSDK/DiagnosticLogger.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-core-js/dist-esm/JavaScriptSDK/EnvUtils.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-core-js/dist-esm/JavaScriptSDK/EventHelpers.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-core-js/dist-esm/JavaScriptSDK/HelperFuncs.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-core-js/dist-esm/JavaScriptSDK/InstrumentHooks.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-core-js/dist-esm/JavaScriptSDK/InternalConstants.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-core-js/dist-esm/JavaScriptSDK/NotificationManager.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-core-js/dist-esm/JavaScriptSDK/PerfManager.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-core-js/dist-esm/JavaScriptSDK/ProcessTelemetryContext.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-core-js/dist-esm/JavaScriptSDK/RandomHelper.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-core-js/dist-esm/JavaScriptSDK/TelemetryHelpers.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-core-js/dist-esm/JavaScriptSDK/UnloadHandlerContainer.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-core-js/dist-esm/JavaScriptSDK/W3cTraceParent.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-core-js/dist-esm/__DynamicConstants.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-shims/dist-esm/Constants.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-shims/dist-esm/Helpers.js","webpack://storefronts/./node_modules/@microsoft/applicationinsights-shims/dist-esm/TsLibShims.js","webpack://storefronts/./node_modules/@microsoft/dynamicproto-js/lib/dist/esm/dynamicproto-js.js","webpack://storefronts/./node_modules/@microsoft/load-themed-styles/lib-es6/index.js","webpack://storefronts/./node_modules/superagent/lib/agent-base.js","webpack://storefronts/./node_modules/superagent/lib/client.js","webpack://storefronts/./node_modules/superagent/lib/request-base.js","webpack://storefronts/./node_modules/superagent/lib/response-base.js","webpack://storefronts/./node_modules/superagent/lib/utils.js","webpack://storefronts/./node_modules/i18next/dist/esm/i18next.js","webpack://storefronts/./node_modules/lodash-es/_assocIndexOf.js","webpack://storefronts/./node_modules/lodash-es/_listCacheDelete.js","webpack://storefronts/./node_modules/lodash-es/_ListCache.js","webpack://storefronts/./node_modules/lodash-es/_listCacheClear.js","webpack://storefronts/./node_modules/lodash-es/_listCacheGet.js","webpack://storefronts/./node_modules/lodash-es/_listCacheHas.js","webpack://storefronts/./node_modules/lodash-es/_listCacheSet.js","webpack://storefronts/./node_modules/lodash-es/_Map.js","webpack://storefronts/./node_modules/lodash-es/_nativeCreate.js","webpack://storefronts/./node_modules/lodash-es/_hashGet.js","webpack://storefronts/./node_modules/lodash-es/_hashHas.js","webpack://storefronts/./node_modules/lodash-es/_Hash.js","webpack://storefronts/./node_modules/lodash-es/_hashClear.js","webpack://storefronts/./node_modules/lodash-es/_hashDelete.js","webpack://storefronts/./node_modules/lodash-es/_hashSet.js","webpack://storefronts/./node_modules/lodash-es/_isKeyable.js","webpack://storefronts/./node_modules/lodash-es/_getMapData.js","webpack://storefronts/./node_modules/lodash-es/_MapCache.js","webpack://storefronts/./node_modules/lodash-es/_mapCacheClear.js","webpack://storefronts/./node_modules/lodash-es/_mapCacheDelete.js","webpack://storefronts/./node_modules/lodash-es/_mapCacheGet.js","webpack://storefronts/./node_modules/lodash-es/_mapCacheHas.js","webpack://storefronts/./node_modules/lodash-es/_mapCacheSet.js","webpack://storefronts/./node_modules/lodash-es/_SetCache.js","webpack://storefronts/./node_modules/lodash-es/_setCacheAdd.js","webpack://storefronts/./node_modules/lodash-es/_setCacheHas.js","webpack://storefronts/./node_modules/lodash-es/_Stack.js","webpack://storefronts/./node_modules/lodash-es/_stackClear.js","webpack://storefronts/./node_modules/lodash-es/_stackDelete.js","webpack://storefronts/./node_modules/lodash-es/_stackGet.js","webpack://storefronts/./node_modules/lodash-es/_stackHas.js","webpack://storefronts/./node_modules/lodash-es/_stackSet.js","webpack://storefronts/./node_modules/lodash-es/_Symbol.js","webpack://storefronts/./node_modules/lodash-es/_Uint8Array.js","webpack://storefronts/./node_modules/lodash-es/_arrayEach.js","webpack://storefronts/./node_modules/lodash-es/_baseTimes.js","webpack://storefronts/./node_modules/lodash-es/_arrayLikeKeys.js","webpack://storefronts/./node_modules/lodash-es/_arrayMap.js","webpack://storefronts/./node_modules/lodash-es/_arrayPush.js","webpack://storefronts/./node_modules/lodash-es/_arrayReduce.js","webpack://storefronts/./node_modules/lodash-es/_assignValue.js","webpack://storefronts/./node_modules/lodash-es/_baseAssignValue.js","webpack://storefronts/./node_modules/lodash-es/_cloneBuffer.js","webpack://storefronts/./node_modules/lodash-es/_copyArray.js","webpack://storefronts/./node_modules/lodash-es/_initCloneArray.js","webpack://storefronts/./node_modules/lodash-es/_cloneArrayBuffer.js","webpack://storefronts/./node_modules/lodash-es/_cloneDataView.js","webpack://storefronts/./node_modules/lodash-es/_cloneRegExp.js","webpack://storefronts/./node_modules/lodash-es/_cloneSymbol.js","webpack://storefronts/./node_modules/lodash-es/_cloneTypedArray.js","webpack://storefronts/./node_modules/lodash-es/_initCloneByTag.js","webpack://storefronts/./node_modules/lodash-es/_baseCreate.js","webpack://storefronts/./node_modules/lodash-es/isMap.js","webpack://storefronts/./node_modules/lodash-es/_baseIsMap.js","webpack://storefronts/./node_modules/lodash-es/isSet.js","webpack://storefronts/./node_modules/lodash-es/_baseIsSet.js","webpack://storefronts/./node_modules/lodash-es/_baseClone.js","webpack://storefronts/./node_modules/lodash-es/_baseAssignIn.js","webpack://storefronts/./node_modules/lodash-es/_copySymbolsIn.js","webpack://storefronts/./node_modules/lodash-es/_baseAssign.js","webpack://storefronts/./node_modules/lodash-es/_copySymbols.js","webpack://storefronts/./node_modules/lodash-es/_initCloneObject.js","webpack://storefronts/./node_modules/lodash-es/_baseFindIndex.js","webpack://storefronts/./node_modules/lodash-es/_baseIsNaN.js","webpack://storefronts/./node_modules/lodash-es/_strictIndexOf.js","webpack://storefronts/./node_modules/lodash-es/_arrayIncludes.js","webpack://storefronts/./node_modules/lodash-es/_baseIndexOf.js","webpack://storefronts/./node_modules/lodash-es/_arrayIncludesWith.js","webpack://storefronts/./node_modules/lodash-es/_baseDifference.js","webpack://storefronts/./node_modules/lodash-es/_createBaseEach.js","webpack://storefronts/./node_modules/lodash-es/_baseEach.js","webpack://storefronts/./node_modules/lodash-es/_isFlattenable.js","webpack://storefronts/./node_modules/lodash-es/_baseFlatten.js","webpack://storefronts/./node_modules/lodash-es/_baseFor.js","webpack://storefronts/./node_modules/lodash-es/_createBaseFor.js","webpack://storefronts/./node_modules/lodash-es/_baseForOwn.js","webpack://storefronts/./node_modules/lodash-es/_baseGet.js","webpack://storefronts/./node_modules/lodash-es/_baseGetAllKeys.js","webpack://storefronts/./node_modules/lodash-es/_getRawTag.js","webpack://storefronts/./node_modules/lodash-es/_objectToString.js","webpack://storefronts/./node_modules/lodash-es/_baseGetTag.js","webpack://storefronts/./node_modules/lodash-es/_arraySome.js","webpack://storefronts/./node_modules/lodash-es/_equalArrays.js","webpack://storefronts/./node_modules/lodash-es/_mapToArray.js","webpack://storefronts/./node_modules/lodash-es/_setToArray.js","webpack://storefronts/./node_modules/lodash-es/_equalByTag.js","webpack://storefronts/./node_modules/lodash-es/_equalObjects.js","webpack://storefronts/./node_modules/lodash-es/_baseIsEqualDeep.js","webpack://storefronts/./node_modules/lodash-es/_baseIsEqual.js","webpack://storefronts/./node_modules/lodash-es/_baseIsMatch.js","webpack://storefronts/./node_modules/lodash-es/_isStrictComparable.js","webpack://storefronts/./node_modules/lodash-es/_getMatchData.js","webpack://storefronts/./node_modules/lodash-es/_matchesStrictComparable.js","webpack://storefronts/./node_modules/lodash-es/_baseMatches.js","webpack://storefronts/./node_modules/lodash-es/get.js","webpack://storefronts/./node_modules/lodash-es/property.js","webpack://storefronts/./node_modules/lodash-es/_baseProperty.js","webpack://storefronts/./node_modules/lodash-es/_basePropertyDeep.js","webpack://storefronts/./node_modules/lodash-es/_baseIteratee.js","webpack://storefronts/./node_modules/lodash-es/_baseMatchesProperty.js","webpack://storefronts/./node_modules/lodash-es/_nativeKeys.js","webpack://storefronts/./node_modules/lodash-es/_baseKeys.js","webpack://storefronts/./node_modules/lodash-es/_baseRest.js","webpack://storefronts/./node_modules/lodash-es/_baseSlice.js","webpack://storefronts/./node_modules/lodash-es/_baseUnary.js","webpack://storefronts/./node_modules/lodash-es/_cacheHas.js","webpack://storefronts/./node_modules/lodash-es/_memoizeCapped.js","webpack://storefronts/./node_modules/lodash-es/memoize.js","webpack://storefronts/./node_modules/lodash-es/_stringToPath.js","webpack://storefronts/./node_modules/lodash-es/_castPath.js","webpack://storefronts/./node_modules/lodash-es/_copyObject.js","webpack://storefronts/./node_modules/lodash-es/_basePropertyOf.js","webpack://storefronts/./node_modules/lodash-es/_deburrLetter.js","webpack://storefronts/./node_modules/lodash-es/deburr.js","webpack://storefronts/./node_modules/lodash-es/_asciiWords.js","webpack://storefronts/./node_modules/lodash-es/_hasUnicodeWord.js","webpack://storefronts/./node_modules/lodash-es/_unicodeWords.js","webpack://storefronts/./node_modules/lodash-es/words.js","webpack://storefronts/./node_modules/lodash-es/_createCompounder.js","webpack://storefronts/./node_modules/lodash-es/_defineProperty.js","webpack://storefronts/./node_modules/lodash-es/flatten.js","webpack://storefronts/./node_modules/lodash-es/_flatRest.js","webpack://storefronts/./node_modules/lodash-es/_freeGlobal.js","webpack://storefronts/./node_modules/lodash-es/_getAllKeys.js","webpack://storefronts/./node_modules/lodash-es/_getAllKeysIn.js","webpack://storefronts/./node_modules/lodash-es/_isMasked.js","webpack://storefronts/./node_modules/lodash-es/_coreJsData.js","webpack://storefronts/./node_modules/lodash-es/_baseIsNative.js","webpack://storefronts/./node_modules/lodash-es/_getNative.js","webpack://storefronts/./node_modules/lodash-es/_getValue.js","webpack://storefronts/./node_modules/lodash-es/_getPrototype.js","webpack://storefronts/./node_modules/lodash-es/_arrayFilter.js","webpack://storefronts/./node_modules/lodash-es/_getSymbols.js","webpack://storefronts/./node_modules/lodash-es/_getSymbolsIn.js","webpack://storefronts/./node_modules/lodash-es/_DataView.js","webpack://storefronts/./node_modules/lodash-es/_Promise.js","webpack://storefronts/./node_modules/lodash-es/_Set.js","webpack://storefronts/./node_modules/lodash-es/_WeakMap.js","webpack://storefronts/./node_modules/lodash-es/_getTag.js","webpack://storefronts/./node_modules/lodash-es/_isIndex.js","webpack://storefronts/./node_modules/lodash-es/_isKey.js","webpack://storefronts/./node_modules/lodash-es/_isPrototype.js","webpack://storefronts/./node_modules/lodash-es/_nodeUtil.js","webpack://storefronts/./node_modules/lodash-es/_overArg.js","webpack://storefronts/./node_modules/lodash-es/_apply.js","webpack://storefronts/./node_modules/lodash-es/_overRest.js","webpack://storefronts/./node_modules/lodash-es/_root.js","webpack://storefronts/./node_modules/lodash-es/_shortOut.js","webpack://storefronts/./node_modules/lodash-es/_baseSetToString.js","webpack://storefronts/./node_modules/lodash-es/constant.js","webpack://storefronts/./node_modules/lodash-es/_setToString.js","webpack://storefronts/./node_modules/lodash-es/_toKey.js","webpack://storefronts/./node_modules/lodash-es/_toSource.js","webpack://storefronts/./node_modules/lodash-es/camelCase.js","webpack://storefronts/./node_modules/lodash-es/capitalize.js","webpack://storefronts/./node_modules/lodash-es/cloneDeep.js","webpack://storefronts/./node_modules/lodash-es/now.js","webpack://storefronts/./node_modules/lodash-es/debounce.js","webpack://storefronts/./node_modules/lodash-es/differenceBy.js","webpack://storefronts/./node_modules/lodash-es/differenceWith.js","webpack://storefronts/./node_modules/lodash-es/eq.js","webpack://storefronts/./node_modules/lodash-es/forEach.js","webpack://storefronts/./node_modules/lodash-es/_castFunction.js","webpack://storefronts/./node_modules/lodash-es/_baseHasIn.js","webpack://storefronts/./node_modules/lodash-es/_hasPath.js","webpack://storefronts/./node_modules/lodash-es/hasIn.js","webpack://storefronts/./node_modules/lodash-es/identity.js","webpack://storefronts/./node_modules/lodash-es/_baseIsArguments.js","webpack://storefronts/./node_modules/lodash-es/isArguments.js","webpack://storefronts/./node_modules/lodash-es/isArray.js","webpack://storefronts/./node_modules/lodash-es/isArrayLike.js","webpack://storefronts/./node_modules/lodash-es/isArrayLikeObject.js","webpack://storefronts/./node_modules/lodash-es/isBuffer.js","webpack://storefronts/./node_modules/lodash-es/stubFalse.js","webpack://storefronts/./node_modules/lodash-es/isEmpty.js","webpack://storefronts/./node_modules/lodash-es/isEqual.js","webpack://storefronts/./node_modules/lodash-es/isEqualWith.js","webpack://storefronts/./node_modules/lodash-es/isFunction.js","webpack://storefronts/./node_modules/lodash-es/isLength.js","webpack://storefronts/./node_modules/lodash-es/isNil.js","webpack://storefronts/./node_modules/lodash-es/isObject.js","webpack://storefronts/./node_modules/lodash-es/isObjectLike.js","webpack://storefronts/./node_modules/lodash-es/isSymbol.js","webpack://storefronts/./node_modules/lodash-es/_baseIsTypedArray.js","webpack://storefronts/./node_modules/lodash-es/isTypedArray.js","webpack://storefronts/./node_modules/lodash-es/_createAggregator.js","webpack://storefronts/./node_modules/lodash-es/_arrayAggregator.js","webpack://storefronts/./node_modules/lodash-es/_baseAggregator.js","webpack://storefronts/./node_modules/lodash-es/keyBy.js","webpack://storefronts/./node_modules/lodash-es/keys.js","webpack://storefronts/./node_modules/lodash-es/_nativeKeysIn.js","webpack://storefronts/./node_modules/lodash-es/_baseKeysIn.js","webpack://storefronts/./node_modules/lodash-es/keysIn.js","webpack://storefronts/./node_modules/lodash-es/last.js","webpack://storefronts/./node_modules/lodash-es/_baseMap.js","webpack://storefronts/./node_modules/lodash-es/map.js","webpack://storefronts/./node_modules/lodash-es/mapKeys.js","webpack://storefronts/./node_modules/lodash-es/noop.js","webpack://storefronts/./node_modules/lodash-es/_baseUnset.js","webpack://storefronts/./node_modules/lodash-es/_parent.js","webpack://storefronts/./node_modules/lodash-es/isPlainObject.js","webpack://storefronts/./node_modules/lodash-es/_customOmitClone.js","webpack://storefronts/./node_modules/lodash-es/omit.js","webpack://storefronts/./node_modules/lodash-es/_baseSet.js","webpack://storefronts/./node_modules/lodash-es/_basePickBy.js","webpack://storefronts/./node_modules/lodash-es/pick.js","webpack://storefronts/./node_modules/lodash-es/_basePick.js","webpack://storefronts/./node_modules/lodash-es/_baseReduce.js","webpack://storefronts/./node_modules/lodash-es/reduce.js","webpack://storefronts/./node_modules/lodash-es/startCase.js","webpack://storefronts/./node_modules/lodash-es/stubArray.js","webpack://storefronts/./node_modules/lodash-es/toFinite.js","webpack://storefronts/./node_modules/lodash-es/toInteger.js","webpack://storefronts/./node_modules/lodash-es/take.js","webpack://storefronts/./node_modules/lodash-es/_trimmedEndIndex.js","webpack://storefronts/./node_modules/lodash-es/_baseTrim.js","webpack://storefronts/./node_modules/lodash-es/toNumber.js","webpack://storefronts/./node_modules/lodash-es/_baseToString.js","webpack://storefronts/./node_modules/lodash-es/toString.js","webpack://storefronts/./node_modules/lodash-es/uniqueId.js","webpack://storefronts/./node_modules/lodash-es/_castSlice.js","webpack://storefronts/./node_modules/lodash-es/_hasUnicode.js","webpack://storefronts/./node_modules/lodash-es/_unicodeToArray.js","webpack://storefronts/./node_modules/lodash-es/upperFirst.js","webpack://storefronts/./node_modules/lodash-es/_createCaseFirst.js","webpack://storefronts/./node_modules/lodash-es/_stringToArray.js","webpack://storefronts/./node_modules/lodash-es/_asciiToArray.js","webpack://storefronts/./node_modules/lodash-es/values.js","webpack://storefronts/./node_modules/lodash-es/_baseValues.js","webpack://storefronts/./node_modules/react-i18next/dist/es/i18nInstance.js","webpack://storefronts/./node_modules/html-parse-stringify/dist/html-parse-stringify.module.js","webpack://storefronts/./node_modules/react-i18next/dist/es/utils.js","webpack://storefronts/./node_modules/react-i18next/dist/es/unescape.js","webpack://storefronts/./node_modules/react-i18next/dist/es/defaults.js","webpack://storefronts/./node_modules/react-i18next/dist/es/TransWithoutContext.js","webpack://storefronts/./node_modules/react-i18next/dist/es/initReactI18next.js","webpack://storefronts/./node_modules/react-i18next/dist/es/context.js","webpack://storefronts/./node_modules/react-i18next/dist/es/Trans.js","webpack://storefronts/./node_modules/react-i18next/dist/es/useTranslation.js","webpack://storefronts/./node_modules/react-i18next/dist/es/withTranslation.js","webpack://storefronts/./node_modules/react-i18next/dist/es/Translation.js","webpack://storefronts/./node_modules/react-i18next/dist/es/I18nextProvider.js","webpack://storefronts/./node_modules/react-i18next/dist/es/useSSR.js","webpack://storefronts/./node_modules/react-i18next/dist/es/withSSR.js","webpack://storefronts/./node_modules/react-i18next/dist/es/index.js"],"sourcesContent":["import { getParent } from './getParent';\n/**\n * Determines whether or not a parent element contains a given child element.\n * If `allowVirtualParents` is true, this method may return `true` if the child\n * has the parent in its virtual element hierarchy.\n *\n * @public\n */\nexport function elementContains(parent, child, allowVirtualParents) {\n if (allowVirtualParents === void 0) { allowVirtualParents = true; }\n var isContained = false;\n if (parent && child) {\n if (allowVirtualParents) {\n if (parent === child) {\n isContained = true;\n }\n else {\n isContained = false;\n while (child) {\n var nextParent = getParent(child);\n if (nextParent === parent) {\n isContained = true;\n break;\n }\n child = nextParent;\n }\n }\n }\n else if (parent.contains) {\n isContained = parent.contains(child);\n }\n }\n return isContained;\n}\n//# sourceMappingURL=elementContains.js.map","import { findElementRecursive } from './findElementRecursive';\n/**\n * Determines if an element, or any of its ancestors, contain the given attribute\n * @param element - element to start searching at\n * @param attribute - the attribute to search for\n * @returns the value of the first instance found\n */\nexport function elementContainsAttribute(element, attribute, doc) {\n var elementMatch = findElementRecursive(element, function (testElement) { return testElement.hasAttribute(attribute); }, doc);\n return elementMatch && elementMatch.getAttribute(attribute);\n}\n//# sourceMappingURL=elementContainsAttribute.js.map","import { getParent } from './getParent';\n/**\n * Finds the first parent element where the matchFunction returns true\n * @param element - element to start searching at\n * @param matchFunction - the function that determines if the element is a match\n * @returns the matched element or null no match was found\n */\nexport function findElementRecursive(element, matchFunction, doc) {\n // eslint-disable-next-line no-restricted-globals\n doc !== null && doc !== void 0 ? doc : (doc = document);\n if (!element || element === doc.body || element instanceof Document) {\n return null;\n }\n return matchFunction(element) ? element : findElementRecursive(getParent(element), matchFunction);\n}\n//# sourceMappingURL=findElementRecursive.js.map","import { getVirtualParent } from './getVirtualParent';\n/**\n * Gets the element which is the parent of a given element.\n * If `allowVirtuaParents` is `true`, this method prefers the virtual parent over\n * real DOM parent when present.\n *\n * @public\n */\nexport function getParent(child, allowVirtualParents) {\n var _a, _b;\n if (allowVirtualParents === void 0) { allowVirtualParents = true; }\n if (!child) {\n return null;\n }\n var parent = allowVirtualParents && getVirtualParent(child);\n if (parent) {\n return parent;\n }\n // Support looking for parents in shadow DOM\n if (typeof child.assignedElements !== 'function' && ((_a = child.assignedSlot) === null || _a === void 0 ? void 0 : _a.parentNode)) {\n // Element is slotted\n return child.assignedSlot;\n }\n else if (((_b = child.parentNode) === null || _b === void 0 ? void 0 : _b.nodeType) === 11) {\n // nodeType 11 is DOCUMENT_FRAGMENT\n // Element is in shadow root\n return child.parentNode.host;\n }\n else {\n return child.parentNode;\n }\n}\n//# sourceMappingURL=getParent.js.map","import { isVirtualElement } from './isVirtualElement';\n/**\n * Gets the virtual parent given the child element, if it exists.\n *\n * @public\n */\nexport function getVirtualParent(child) {\n var parent;\n if (child && isVirtualElement(child)) {\n parent = child._virtual.parent;\n }\n return parent;\n}\n//# sourceMappingURL=getVirtualParent.js.map","/**\n * Determines whether or not an element has the virtual hierarchy extension.\n *\n * @public\n */\nexport function isVirtualElement(element) {\n return element && !!element._virtual;\n}\n//# sourceMappingURL=isVirtualElement.js.map","import { findElementRecursive } from './findElementRecursive';\nimport { DATA_PORTAL_ATTRIBUTE } from './setPortalAttribute';\n/**\n * Determine whether a target is within a portal from perspective of root or optional parent.\n * This function only works against portal components that use the setPortalAttribute function.\n * If both parent and child are within the same portal this function will return false.\n * @param target - Element to query portal containment status of.\n * @param parent - Optional parent perspective. Search for containing portal stops at parent\n * (or root if parent is undefined or invalid.)\n */\nexport function portalContainsElement(target, parent, doc) {\n var _a;\n var elementMatch = findElementRecursive(target, function (testElement) { var _a; return parent === testElement || !!((_a = testElement.hasAttribute) === null || _a === void 0 ? void 0 : _a.call(testElement, DATA_PORTAL_ATTRIBUTE)); }, doc);\n return elementMatch !== null && !!((_a = elementMatch.hasAttribute) === null || _a === void 0 ? void 0 : _a.call(elementMatch, DATA_PORTAL_ATTRIBUTE));\n}\n//# sourceMappingURL=portalContainsElement.js.map","export var DATA_PORTAL_ATTRIBUTE = 'data-portal-element';\n/**\n * Identify element as a portal by setting an attribute.\n * @param element - Element to mark as a portal.\n */\nexport function setPortalAttribute(element) {\n element.setAttribute(DATA_PORTAL_ATTRIBUTE, 'true');\n}\n//# sourceMappingURL=setPortalAttribute.js.map","/**\n * Sets the virtual parent of an element.\n * Pass `undefined` as the `parent` to clear the virtual parent.\n *\n * @public\n */\nexport function setVirtualParent(child, parent) {\n var virtualChild = child;\n var virtualParent = parent;\n if (!virtualChild._virtual) {\n virtualChild._virtual = {\n children: [],\n };\n }\n var oldParent = virtualChild._virtual.parent;\n if (oldParent && oldParent !== parent) {\n // Remove the child from its old parent.\n var index = oldParent._virtual.children.indexOf(virtualChild);\n if (index > -1) {\n oldParent._virtual.children.splice(index, 1);\n }\n }\n virtualChild._virtual.parent = virtualParent || undefined;\n if (virtualParent) {\n if (!virtualParent._virtual) {\n virtualParent._virtual = {\n children: [],\n };\n }\n virtualParent._virtual.children.push(virtualChild);\n }\n}\n//# sourceMappingURL=setVirtualParent.js.map","// Your use of the content in the files referenced here is subject to the terms of the license at https://aka.ms/fluentui-assets-license\nimport { registerIcons } from '@fluentui/style-utilities';\nexport function initializeIcons(baseUrl, options) {\n if (baseUrl === void 0) { baseUrl = ''; }\n var subset = {\n style: {\n MozOsxFontSmoothing: 'grayscale',\n WebkitFontSmoothing: 'antialiased',\n fontStyle: 'normal',\n fontWeight: 'normal',\n speak: 'none',\n },\n fontFace: {\n fontFamily: \"\\\"FabricMDL2Icons\\\"\",\n src: \"url('\".concat(baseUrl, \"fabric-icons-a13498cf.woff') format('woff')\"),\n },\n icons: {\n GlobalNavButton: '\\uE700',\n ChevronDown: '\\uE70D',\n ChevronUp: '\\uE70E',\n Edit: '\\uE70F',\n Add: '\\uE710',\n Cancel: '\\uE711',\n More: '\\uE712',\n Settings: '\\uE713',\n Mail: '\\uE715',\n Filter: '\\uE71C',\n Search: '\\uE721',\n Share: '\\uE72D',\n BlockedSite: '\\uE72F',\n FavoriteStar: '\\uE734',\n FavoriteStarFill: '\\uE735',\n CheckMark: '\\uE73E',\n Delete: '\\uE74D',\n ChevronLeft: '\\uE76B',\n ChevronRight: '\\uE76C',\n Calendar: '\\uE787',\n Megaphone: '\\uE789',\n Undo: '\\uE7A7',\n Flag: '\\uE7C1',\n Page: '\\uE7C3',\n Pinned: '\\uE840',\n View: '\\uE890',\n Clear: '\\uE894',\n Download: '\\uE896',\n Upload: '\\uE898',\n Folder: '\\uE8B7',\n Sort: '\\uE8CB',\n AlignRight: '\\uE8E2',\n AlignLeft: '\\uE8E4',\n Tag: '\\uE8EC',\n AddFriend: '\\uE8FA',\n Info: '\\uE946',\n SortLines: '\\uE9D0',\n List: '\\uEA37',\n CircleRing: '\\uEA3A',\n Heart: '\\uEB51',\n HeartFill: '\\uEB52',\n Tiles: '\\uECA5',\n Embed: '\\uECCE',\n Glimmer: '\\uECF4',\n Ascending: '\\uEDC0',\n Descending: '\\uEDC1',\n SortUp: '\\uEE68',\n SortDown: '\\uEE69',\n SyncToPC: '\\uEE6E',\n LargeGrid: '\\uEECB',\n SkypeCheck: '\\uEF80',\n SkypeClock: '\\uEF81',\n SkypeMinus: '\\uEF82',\n ClearFilter: '\\uEF8F',\n Flow: '\\uEF90',\n StatusCircleCheckmark: '\\uF13E',\n MoreVertical: '\\uF2BC',\n },\n };\n registerIcons(subset, options);\n}\n//# sourceMappingURL=fabric-icons.js.map","// Your use of the content in the files referenced here is subject to the terms of the license at https://aka.ms/fluentui-assets-license\nimport { registerIcons } from '@fluentui/style-utilities';\nexport function initializeIcons(baseUrl, options) {\n if (baseUrl === void 0) { baseUrl = ''; }\n var subset = {\n style: {\n MozOsxFontSmoothing: 'grayscale',\n WebkitFontSmoothing: 'antialiased',\n fontStyle: 'normal',\n fontWeight: 'normal',\n speak: 'none'\n },\n fontFace: {\n fontFamily: \"\\\"FabricMDL2Icons-0\\\"\",\n src: \"url('\".concat(baseUrl, \"fabric-icons-0-467ee27f.woff') format('woff')\")\n },\n icons: {\n 'PageLink': '\\uE302',\n 'CommentSolid': '\\uE30E',\n 'ChangeEntitlements': '\\uE310',\n 'Installation': '\\uE311',\n 'WebAppBuilderModule': '\\uE313',\n 'WebAppBuilderFragment': '\\uE314',\n 'WebAppBuilderSlot': '\\uE315',\n 'BullseyeTargetEdit': '\\uE319',\n 'WebAppBuilderFragmentCreate': '\\uE31B',\n 'PageData': '\\uE31C',\n 'PageHeaderEdit': '\\uE31D',\n 'ProductList': '\\uE31E',\n 'UnpublishContent': '\\uE31F',\n 'DependencyAdd': '\\uE344',\n 'DependencyRemove': '\\uE345',\n 'EntitlementPolicy': '\\uE346',\n 'EntitlementRedemption': '\\uE347',\n 'SchoolDataSyncLogo': '\\uE34C',\n 'PinSolid12': '\\uE352',\n 'PinSolidOff12': '\\uE353',\n 'AddLink': '\\uE35E',\n 'SharepointAppIcon16': '\\uE365',\n 'DataflowsLink': '\\uE366',\n 'TimePicker': '\\uE367',\n 'UserWarning': '\\uE368',\n 'ComplianceAudit': '\\uE369',\n 'InternetSharing': '\\uE704',\n 'Brightness': '\\uE706',\n 'MapPin': '\\uE707',\n 'Airplane': '\\uE709',\n 'Tablet': '\\uE70A',\n 'QuickNote': '\\uE70B',\n 'Video': '\\uE714',\n 'People': '\\uE716',\n 'Phone': '\\uE717',\n 'Pin': '\\uE718',\n 'Shop': '\\uE719',\n 'Stop': '\\uE71A',\n 'Link': '\\uE71B',\n 'AllApps': '\\uE71D',\n 'Zoom': '\\uE71E',\n 'ZoomOut': '\\uE71F',\n 'Microphone': '\\uE720',\n 'Camera': '\\uE722',\n 'Attach': '\\uE723',\n 'Send': '\\uE724',\n 'FavoriteList': '\\uE728',\n 'PageSolid': '\\uE729',\n 'Forward': '\\uE72A',\n 'Back': '\\uE72B',\n 'Refresh': '\\uE72C',\n 'Lock': '\\uE72E',\n 'ReportHacked': '\\uE730',\n 'EMI': '\\uE731',\n 'MiniLink': '\\uE732',\n 'Blocked': '\\uE733',\n 'ReadingMode': '\\uE736',\n 'Favicon': '\\uE737',\n 'Remove': '\\uE738',\n 'Checkbox': '\\uE739',\n 'CheckboxComposite': '\\uE73A',\n 'CheckboxFill': '\\uE73B',\n 'CheckboxIndeterminate': '\\uE73C',\n 'CheckboxCompositeReversed': '\\uE73D',\n 'BackToWindow': '\\uE73F',\n 'FullScreen': '\\uE740',\n 'Print': '\\uE749',\n 'Up': '\\uE74A',\n 'Down': '\\uE74B',\n 'OEM': '\\uE74C',\n 'Save': '\\uE74E',\n 'ReturnKey': '\\uE751',\n 'Cloud': '\\uE753',\n 'Flashlight': '\\uE754',\n 'CommandPrompt': '\\uE756',\n 'Sad': '\\uE757',\n 'RealEstate': '\\uE758',\n 'SIPMove': '\\uE759',\n 'EraseTool': '\\uE75C',\n 'GripperTool': '\\uE75E',\n 'Dialpad': '\\uE75F',\n 'PageLeft': '\\uE760',\n 'PageRight': '\\uE761',\n 'MultiSelect': '\\uE762',\n 'KeyboardClassic': '\\uE765',\n 'Play': '\\uE768',\n 'Pause': '\\uE769',\n 'InkingTool': '\\uE76D',\n 'Emoji2': '\\uE76E',\n 'GripperBarHorizontal': '\\uE76F',\n 'System': '\\uE770',\n 'Personalize': '\\uE771',\n 'SearchAndApps': '\\uE773',\n 'Globe': '\\uE774',\n 'EaseOfAccess': '\\uE776',\n 'ContactInfo': '\\uE779',\n 'Unpin': '\\uE77A',\n 'Contact': '\\uE77B',\n 'Memo': '\\uE77C',\n 'IncomingCall': '\\uE77E'\n }\n };\n registerIcons(subset, options);\n}\n//# sourceMappingURL=fabric-icons-0.js.map","// Your use of the content in the files referenced here is subject to the terms of the license at https://aka.ms/fluentui-assets-license\nimport { registerIcons } from '@fluentui/style-utilities';\nexport function initializeIcons(baseUrl, options) {\n if (baseUrl === void 0) { baseUrl = ''; }\n var subset = {\n style: {\n MozOsxFontSmoothing: 'grayscale',\n WebkitFontSmoothing: 'antialiased',\n fontStyle: 'normal',\n fontWeight: 'normal',\n speak: 'none'\n },\n fontFace: {\n fontFamily: \"\\\"FabricMDL2Icons-1\\\"\",\n src: \"url('\".concat(baseUrl, \"fabric-icons-1-4d521695.woff') format('woff')\")\n },\n icons: {\n 'Paste': '\\uE77F',\n 'WindowsLogo': '\\uE782',\n 'Error': '\\uE783',\n 'GripperBarVertical': '\\uE784',\n 'Unlock': '\\uE785',\n 'Slideshow': '\\uE786',\n 'Trim': '\\uE78A',\n 'AutoEnhanceOn': '\\uE78D',\n 'AutoEnhanceOff': '\\uE78E',\n 'Color': '\\uE790',\n 'SaveAs': '\\uE792',\n 'Light': '\\uE793',\n 'Filters': '\\uE795',\n 'AspectRatio': '\\uE799',\n 'Contrast': '\\uE7A1',\n 'Redo': '\\uE7A6',\n 'Crop': '\\uE7A8',\n 'PhotoCollection': '\\uE7AA',\n 'Album': '\\uE7AB',\n 'Rotate': '\\uE7AD',\n 'PanoIndicator': '\\uE7B0',\n 'Translate': '\\uE7B2',\n 'RedEye': '\\uE7B3',\n 'ViewOriginal': '\\uE7B4',\n 'ThumbnailView': '\\uE7B6',\n 'Package': '\\uE7B8',\n 'Telemarketer': '\\uE7B9',\n 'Warning': '\\uE7BA',\n 'Financial': '\\uE7BB',\n 'Education': '\\uE7BE',\n 'ShoppingCart': '\\uE7BF',\n 'Train': '\\uE7C0',\n 'Move': '\\uE7C2',\n 'TouchPointer': '\\uE7C9',\n 'Merge': '\\uE7D5',\n 'TurnRight': '\\uE7DB',\n 'Ferry': '\\uE7E3',\n 'Highlight': '\\uE7E6',\n 'PowerButton': '\\uE7E8',\n 'Tab': '\\uE7E9',\n 'Admin': '\\uE7EF',\n 'TVMonitor': '\\uE7F4',\n 'Speakers': '\\uE7F5',\n 'Game': '\\uE7FC',\n 'HorizontalTabKey': '\\uE7FD',\n 'UnstackSelected': '\\uE7FE',\n 'StackIndicator': '\\uE7FF',\n 'Nav2DMapView': '\\uE800',\n 'StreetsideSplitMinimize': '\\uE802',\n 'Car': '\\uE804',\n 'Bus': '\\uE806',\n 'EatDrink': '\\uE807',\n 'SeeDo': '\\uE808',\n 'LocationCircle': '\\uE80E',\n 'Home': '\\uE80F',\n 'SwitcherStartEnd': '\\uE810',\n 'ParkingLocation': '\\uE811',\n 'IncidentTriangle': '\\uE814',\n 'Touch': '\\uE815',\n 'MapDirections': '\\uE816',\n 'CaretHollow': '\\uE817',\n 'CaretSolid': '\\uE818',\n 'History': '\\uE81C',\n 'Location': '\\uE81D',\n 'MapLayers': '\\uE81E',\n 'SearchNearby': '\\uE820',\n 'Work': '\\uE821',\n 'Recent': '\\uE823',\n 'Hotel': '\\uE824',\n 'Bank': '\\uE825',\n 'LocationDot': '\\uE827',\n 'Dictionary': '\\uE82D',\n 'ChromeBack': '\\uE830',\n 'FolderOpen': '\\uE838',\n 'PinnedFill': '\\uE842',\n 'RevToggleKey': '\\uE845',\n 'USB': '\\uE88E',\n 'Previous': '\\uE892',\n 'Next': '\\uE893',\n 'Sync': '\\uE895',\n 'Help': '\\uE897',\n 'Emoji': '\\uE899',\n 'MailForward': '\\uE89C',\n 'ClosePane': '\\uE89F',\n 'OpenPane': '\\uE8A0',\n 'PreviewLink': '\\uE8A1',\n 'ZoomIn': '\\uE8A3',\n 'Bookmarks': '\\uE8A4',\n 'Document': '\\uE8A5',\n 'ProtectedDocument': '\\uE8A6',\n 'OpenInNewWindow': '\\uE8A7',\n 'MailFill': '\\uE8A8',\n 'ViewAll': '\\uE8A9',\n 'Switch': '\\uE8AB',\n 'Rename': '\\uE8AC',\n 'Go': '\\uE8AD',\n 'Remote': '\\uE8AF',\n 'SelectAll': '\\uE8B3',\n 'Orientation': '\\uE8B4',\n 'Import': '\\uE8B5'\n }\n };\n registerIcons(subset, options);\n}\n//# sourceMappingURL=fabric-icons-1.js.map","// Your use of the content in the files referenced here is subject to the terms of the license at https://aka.ms/fluentui-assets-license\nimport { registerIcons } from '@fluentui/style-utilities';\nexport function initializeIcons(baseUrl, options) {\n if (baseUrl === void 0) { baseUrl = ''; }\n var subset = {\n style: {\n MozOsxFontSmoothing: 'grayscale',\n WebkitFontSmoothing: 'antialiased',\n fontStyle: 'normal',\n fontWeight: 'normal',\n speak: 'none'\n },\n fontFace: {\n fontFamily: \"\\\"FabricMDL2Icons-2\\\"\",\n src: \"url('\".concat(baseUrl, \"fabric-icons-2-63c99abf.woff') format('woff')\")\n },\n icons: {\n 'Picture': '\\uE8B9',\n 'ChromeClose': '\\uE8BB',\n 'ShowResults': '\\uE8BC',\n 'Message': '\\uE8BD',\n 'CalendarDay': '\\uE8BF',\n 'CalendarWeek': '\\uE8C0',\n 'MailReplyAll': '\\uE8C2',\n 'Read': '\\uE8C3',\n 'Cut': '\\uE8C6',\n 'PaymentCard': '\\uE8C7',\n 'Copy': '\\uE8C8',\n 'Important': '\\uE8C9',\n 'MailReply': '\\uE8CA',\n 'GotoToday': '\\uE8D1',\n 'Font': '\\uE8D2',\n 'FontColor': '\\uE8D3',\n 'FolderFill': '\\uE8D5',\n 'Permissions': '\\uE8D7',\n 'DisableUpdates': '\\uE8D8',\n 'Unfavorite': '\\uE8D9',\n 'Italic': '\\uE8DB',\n 'Underline': '\\uE8DC',\n 'Bold': '\\uE8DD',\n 'MoveToFolder': '\\uE8DE',\n 'Dislike': '\\uE8E0',\n 'Like': '\\uE8E1',\n 'AlignCenter': '\\uE8E3',\n 'OpenFile': '\\uE8E5',\n 'ClearSelection': '\\uE8E6',\n 'FontDecrease': '\\uE8E7',\n 'FontIncrease': '\\uE8E8',\n 'FontSize': '\\uE8E9',\n 'CellPhone': '\\uE8EA',\n 'RepeatOne': '\\uE8ED',\n 'RepeatAll': '\\uE8EE',\n 'Calculator': '\\uE8EF',\n 'Library': '\\uE8F1',\n 'PostUpdate': '\\uE8F3',\n 'NewFolder': '\\uE8F4',\n 'CalendarReply': '\\uE8F5',\n 'UnsyncFolder': '\\uE8F6',\n 'SyncFolder': '\\uE8F7',\n 'BlockContact': '\\uE8F8',\n 'Accept': '\\uE8FB',\n 'BulletedList': '\\uE8FD',\n 'Preview': '\\uE8FF',\n 'News': '\\uE900',\n 'Chat': '\\uE901',\n 'Group': '\\uE902',\n 'World': '\\uE909',\n 'Comment': '\\uE90A',\n 'DockLeft': '\\uE90C',\n 'DockRight': '\\uE90D',\n 'Repair': '\\uE90F',\n 'Accounts': '\\uE910',\n 'Street': '\\uE913',\n 'RadioBullet': '\\uE915',\n 'Stopwatch': '\\uE916',\n 'Clock': '\\uE917',\n 'WorldClock': '\\uE918',\n 'AlarmClock': '\\uE919',\n 'Photo': '\\uE91B',\n 'ActionCenter': '\\uE91C',\n 'Hospital': '\\uE91D',\n 'Timer': '\\uE91E',\n 'FullCircleMask': '\\uE91F',\n 'LocationFill': '\\uE920',\n 'ChromeMinimize': '\\uE921',\n 'ChromeRestore': '\\uE923',\n 'Annotation': '\\uE924',\n 'Fingerprint': '\\uE928',\n 'Handwriting': '\\uE929',\n 'ChromeFullScreen': '\\uE92D',\n 'Completed': '\\uE930',\n 'Label': '\\uE932',\n 'FlickDown': '\\uE935',\n 'FlickUp': '\\uE936',\n 'FlickLeft': '\\uE937',\n 'FlickRight': '\\uE938',\n 'MiniExpand': '\\uE93A',\n 'MiniContract': '\\uE93B',\n 'Streaming': '\\uE93E',\n 'MusicInCollection': '\\uE940',\n 'OneDriveLogo': '\\uE941',\n 'CompassNW': '\\uE942',\n 'Code': '\\uE943',\n 'LightningBolt': '\\uE945',\n 'CalculatorMultiply': '\\uE947',\n 'CalculatorAddition': '\\uE948',\n 'CalculatorSubtract': '\\uE949',\n 'CalculatorPercentage': '\\uE94C',\n 'CalculatorEqualTo': '\\uE94E',\n 'PrintfaxPrinterFile': '\\uE956',\n 'StorageOptical': '\\uE958',\n 'Communications': '\\uE95A',\n 'Headset': '\\uE95B',\n 'Health': '\\uE95E',\n 'Webcam2': '\\uE960',\n 'FrontCamera': '\\uE96B',\n 'ChevronUpSmall': '\\uE96D'\n }\n };\n registerIcons(subset, options);\n}\n//# sourceMappingURL=fabric-icons-2.js.map","// Your use of the content in the files referenced here is subject to the terms of the license at https://aka.ms/fluentui-assets-license\nimport { registerIcons } from '@fluentui/style-utilities';\nexport function initializeIcons(baseUrl, options) {\n if (baseUrl === void 0) { baseUrl = ''; }\n var subset = {\n style: {\n MozOsxFontSmoothing: 'grayscale',\n WebkitFontSmoothing: 'antialiased',\n fontStyle: 'normal',\n fontWeight: 'normal',\n speak: 'none'\n },\n fontFace: {\n fontFamily: \"\\\"FabricMDL2Icons-3\\\"\",\n src: \"url('\".concat(baseUrl, \"fabric-icons-3-089e217a.woff') format('woff')\")\n },\n icons: {\n 'ChevronDownSmall': '\\uE96E',\n 'ChevronLeftSmall': '\\uE96F',\n 'ChevronRightSmall': '\\uE970',\n 'ChevronUpMed': '\\uE971',\n 'ChevronDownMed': '\\uE972',\n 'ChevronLeftMed': '\\uE973',\n 'ChevronRightMed': '\\uE974',\n 'Devices2': '\\uE975',\n 'PC1': '\\uE977',\n 'PresenceChickletVideo': '\\uE979',\n 'Reply': '\\uE97A',\n 'HalfAlpha': '\\uE97E',\n 'ConstructionCone': '\\uE98F',\n 'DoubleChevronLeftMed': '\\uE991',\n 'Volume0': '\\uE992',\n 'Volume1': '\\uE993',\n 'Volume2': '\\uE994',\n 'Volume3': '\\uE995',\n 'Chart': '\\uE999',\n 'Robot': '\\uE99A',\n 'Manufacturing': '\\uE99C',\n 'LockSolid': '\\uE9A2',\n 'FitPage': '\\uE9A6',\n 'FitWidth': '\\uE9A7',\n 'BidiLtr': '\\uE9AA',\n 'BidiRtl': '\\uE9AB',\n 'RightDoubleQuote': '\\uE9B1',\n 'Sunny': '\\uE9BD',\n 'CloudWeather': '\\uE9BE',\n 'Cloudy': '\\uE9BF',\n 'PartlyCloudyDay': '\\uE9C0',\n 'PartlyCloudyNight': '\\uE9C1',\n 'ClearNight': '\\uE9C2',\n 'RainShowersDay': '\\uE9C3',\n 'Rain': '\\uE9C4',\n 'Thunderstorms': '\\uE9C6',\n 'RainSnow': '\\uE9C7',\n 'Snow': '\\uE9C8',\n 'BlowingSnow': '\\uE9C9',\n 'Frigid': '\\uE9CA',\n 'Fog': '\\uE9CB',\n 'Squalls': '\\uE9CC',\n 'Duststorm': '\\uE9CD',\n 'Unknown': '\\uE9CE',\n 'Precipitation': '\\uE9CF',\n 'Ribbon': '\\uE9D1',\n 'AreaChart': '\\uE9D2',\n 'Assign': '\\uE9D3',\n 'FlowChart': '\\uE9D4',\n 'CheckList': '\\uE9D5',\n 'Diagnostic': '\\uE9D9',\n 'Generate': '\\uE9DA',\n 'LineChart': '\\uE9E6',\n 'Equalizer': '\\uE9E9',\n 'BarChartHorizontal': '\\uE9EB',\n 'BarChartVertical': '\\uE9EC',\n 'Freezing': '\\uE9EF',\n 'FunnelChart': '\\uE9F1',\n 'Processing': '\\uE9F5',\n 'Quantity': '\\uE9F8',\n 'ReportDocument': '\\uE9F9',\n 'StackColumnChart': '\\uE9FC',\n 'SnowShowerDay': '\\uE9FD',\n 'HailDay': '\\uEA00',\n 'WorkFlow': '\\uEA01',\n 'HourGlass': '\\uEA03',\n 'StoreLogoMed20': '\\uEA04',\n 'TimeSheet': '\\uEA05',\n 'TriangleSolid': '\\uEA08',\n 'UpgradeAnalysis': '\\uEA0B',\n 'VideoSolid': '\\uEA0C',\n 'RainShowersNight': '\\uEA0F',\n 'SnowShowerNight': '\\uEA11',\n 'Teamwork': '\\uEA12',\n 'HailNight': '\\uEA13',\n 'PeopleAdd': '\\uEA15',\n 'Glasses': '\\uEA16',\n 'DateTime2': '\\uEA17',\n 'Shield': '\\uEA18',\n 'Header1': '\\uEA19',\n 'PageAdd': '\\uEA1A',\n 'NumberedList': '\\uEA1C',\n 'PowerBILogo': '\\uEA1E',\n 'Info2': '\\uEA1F',\n 'MusicInCollectionFill': '\\uEA36',\n 'Asterisk': '\\uEA38',\n 'ErrorBadge': '\\uEA39',\n 'CircleFill': '\\uEA3B',\n 'Record2': '\\uEA3F',\n 'AllAppsMirrored': '\\uEA40',\n 'BookmarksMirrored': '\\uEA41',\n 'BulletedListMirrored': '\\uEA42',\n 'CaretHollowMirrored': '\\uEA45',\n 'CaretSolidMirrored': '\\uEA46',\n 'ChromeBackMirrored': '\\uEA47',\n 'ClearSelectionMirrored': '\\uEA48',\n 'ClosePaneMirrored': '\\uEA49',\n 'DockLeftMirrored': '\\uEA4C',\n 'DoubleChevronLeftMedMirrored': '\\uEA4D',\n 'GoMirrored': '\\uEA4F'\n }\n };\n registerIcons(subset, options);\n}\n//# sourceMappingURL=fabric-icons-3.js.map","// Your use of the content in the files referenced here is subject to the terms of the license at https://aka.ms/fluentui-assets-license\nimport { registerIcons } from '@fluentui/style-utilities';\nexport function initializeIcons(baseUrl, options) {\n if (baseUrl === void 0) { baseUrl = ''; }\n var subset = {\n style: {\n MozOsxFontSmoothing: 'grayscale',\n WebkitFontSmoothing: 'antialiased',\n fontStyle: 'normal',\n fontWeight: 'normal',\n speak: 'none'\n },\n fontFace: {\n fontFamily: \"\\\"FabricMDL2Icons-4\\\"\",\n src: \"url('\".concat(baseUrl, \"fabric-icons-4-a656cc0a.woff') format('woff')\")\n },\n icons: {\n 'HelpMirrored': '\\uEA51',\n 'ImportMirrored': '\\uEA52',\n 'ImportAllMirrored': '\\uEA53',\n 'ListMirrored': '\\uEA55',\n 'MailForwardMirrored': '\\uEA56',\n 'MailReplyMirrored': '\\uEA57',\n 'MailReplyAllMirrored': '\\uEA58',\n 'MiniContractMirrored': '\\uEA59',\n 'MiniExpandMirrored': '\\uEA5A',\n 'OpenPaneMirrored': '\\uEA5B',\n 'ParkingLocationMirrored': '\\uEA5E',\n 'SendMirrored': '\\uEA63',\n 'ShowResultsMirrored': '\\uEA65',\n 'ThumbnailViewMirrored': '\\uEA67',\n 'Media': '\\uEA69',\n 'Devices3': '\\uEA6C',\n 'Focus': '\\uEA6F',\n 'VideoLightOff': '\\uEA74',\n 'Lightbulb': '\\uEA80',\n 'StatusTriangle': '\\uEA82',\n 'VolumeDisabled': '\\uEA85',\n 'Puzzle': '\\uEA86',\n 'EmojiNeutral': '\\uEA87',\n 'EmojiDisappointed': '\\uEA88',\n 'HomeSolid': '\\uEA8A',\n 'Ringer': '\\uEA8F',\n 'PDF': '\\uEA90',\n 'HeartBroken': '\\uEA92',\n 'StoreLogo16': '\\uEA96',\n 'MultiSelectMirrored': '\\uEA98',\n 'Broom': '\\uEA99',\n 'AddToShoppingList': '\\uEA9A',\n 'Cocktails': '\\uEA9D',\n 'Wines': '\\uEABF',\n 'Articles': '\\uEAC1',\n 'Cycling': '\\uEAC7',\n 'DietPlanNotebook': '\\uEAC8',\n 'Pill': '\\uEACB',\n 'ExerciseTracker': '\\uEACC',\n 'HandsFree': '\\uEAD0',\n 'Medical': '\\uEAD4',\n 'Running': '\\uEADA',\n 'Weights': '\\uEADB',\n 'Trackers': '\\uEADF',\n 'AddNotes': '\\uEAE3',\n 'AllCurrency': '\\uEAE4',\n 'BarChart4': '\\uEAE7',\n 'CirclePlus': '\\uEAEE',\n 'Coffee': '\\uEAEF',\n 'Cotton': '\\uEAF3',\n 'Market': '\\uEAFC',\n 'Money': '\\uEAFD',\n 'PieDouble': '\\uEB04',\n 'PieSingle': '\\uEB05',\n 'RemoveFilter': '\\uEB08',\n 'Savings': '\\uEB0B',\n 'Sell': '\\uEB0C',\n 'StockDown': '\\uEB0F',\n 'StockUp': '\\uEB11',\n 'Lamp': '\\uEB19',\n 'Source': '\\uEB1B',\n 'MSNVideos': '\\uEB1C',\n 'Cricket': '\\uEB1E',\n 'Golf': '\\uEB1F',\n 'Baseball': '\\uEB20',\n 'Soccer': '\\uEB21',\n 'MoreSports': '\\uEB22',\n 'AutoRacing': '\\uEB24',\n 'CollegeHoops': '\\uEB25',\n 'CollegeFootball': '\\uEB26',\n 'ProFootball': '\\uEB27',\n 'ProHockey': '\\uEB28',\n 'Rugby': '\\uEB2D',\n 'SubstitutionsIn': '\\uEB31',\n 'Tennis': '\\uEB33',\n 'Arrivals': '\\uEB34',\n 'Design': '\\uEB3C',\n 'Website': '\\uEB41',\n 'Drop': '\\uEB42',\n 'HistoricalWeather': '\\uEB43',\n 'SkiResorts': '\\uEB45',\n 'Snowflake': '\\uEB46',\n 'BusSolid': '\\uEB47',\n 'FerrySolid': '\\uEB48',\n 'AirplaneSolid': '\\uEB4C',\n 'TrainSolid': '\\uEB4D',\n 'Ticket': '\\uEB54',\n 'WifiWarning4': '\\uEB63',\n 'Devices4': '\\uEB66',\n 'AzureLogo': '\\uEB6A',\n 'BingLogo': '\\uEB6B',\n 'MSNLogo': '\\uEB6C',\n 'OutlookLogoInverse': '\\uEB6D',\n 'OfficeLogo': '\\uEB6E',\n 'SkypeLogo': '\\uEB6F',\n 'Door': '\\uEB75',\n 'EditMirrored': '\\uEB7E',\n 'GiftCard': '\\uEB8E',\n 'DoubleBookmark': '\\uEB8F',\n 'StatusErrorFull': '\\uEB90'\n }\n };\n registerIcons(subset, options);\n}\n//# sourceMappingURL=fabric-icons-4.js.map","// Your use of the content in the files referenced here is subject to the terms of the license at https://aka.ms/fluentui-assets-license\nimport { registerIcons } from '@fluentui/style-utilities';\nexport function initializeIcons(baseUrl, options) {\n if (baseUrl === void 0) { baseUrl = ''; }\n var subset = {\n style: {\n MozOsxFontSmoothing: 'grayscale',\n WebkitFontSmoothing: 'antialiased',\n fontStyle: 'normal',\n fontWeight: 'normal',\n speak: 'none'\n },\n fontFace: {\n fontFamily: \"\\\"FabricMDL2Icons-5\\\"\",\n src: \"url('\".concat(baseUrl, \"fabric-icons-5-f95ba260.woff') format('woff')\")\n },\n icons: {\n 'Certificate': '\\uEB95',\n 'FastForward': '\\uEB9D',\n 'Rewind': '\\uEB9E',\n 'Photo2': '\\uEB9F',\n 'OpenSource': '\\uEBC2',\n 'Movers': '\\uEBCD',\n 'CloudDownload': '\\uEBD3',\n 'Family': '\\uEBDA',\n 'WindDirection': '\\uEBE6',\n 'Bug': '\\uEBE8',\n 'SiteScan': '\\uEBEC',\n 'BrowserScreenShot': '\\uEBED',\n 'F12DevTools': '\\uEBEE',\n 'CSS': '\\uEBEF',\n 'JS': '\\uEBF0',\n 'DeliveryTruck': '\\uEBF4',\n 'ReminderPerson': '\\uEBF7',\n 'ReminderGroup': '\\uEBF8',\n 'ReminderTime': '\\uEBF9',\n 'TabletMode': '\\uEBFC',\n 'Umbrella': '\\uEC04',\n 'NetworkTower': '\\uEC05',\n 'CityNext': '\\uEC06',\n 'CityNext2': '\\uEC07',\n 'Section': '\\uEC0C',\n 'OneNoteLogoInverse': '\\uEC0D',\n 'ToggleFilled': '\\uEC11',\n 'ToggleBorder': '\\uEC12',\n 'SliderThumb': '\\uEC13',\n 'ToggleThumb': '\\uEC14',\n 'Documentation': '\\uEC17',\n 'Badge': '\\uEC1B',\n 'Giftbox': '\\uEC1F',\n 'VisualStudioLogo': '\\uEC22',\n 'HomeGroup': '\\uEC26',\n 'ExcelLogoInverse': '\\uEC28',\n 'WordLogoInverse': '\\uEC29',\n 'PowerPointLogoInverse': '\\uEC2A',\n 'Cafe': '\\uEC32',\n 'SpeedHigh': '\\uEC4A',\n 'Commitments': '\\uEC4D',\n 'ThisPC': '\\uEC4E',\n 'MusicNote': '\\uEC4F',\n 'MicOff': '\\uEC54',\n 'PlaybackRate1x': '\\uEC57',\n 'EdgeLogo': '\\uEC60',\n 'CompletedSolid': '\\uEC61',\n 'AlbumRemove': '\\uEC62',\n 'MessageFill': '\\uEC70',\n 'TabletSelected': '\\uEC74',\n 'MobileSelected': '\\uEC75',\n 'LaptopSelected': '\\uEC76',\n 'TVMonitorSelected': '\\uEC77',\n 'DeveloperTools': '\\uEC7A',\n 'Shapes': '\\uEC7C',\n 'InsertTextBox': '\\uEC7D',\n 'LowerBrightness': '\\uEC8A',\n 'WebComponents': '\\uEC8B',\n 'OfflineStorage': '\\uEC8C',\n 'DOM': '\\uEC8D',\n 'CloudUpload': '\\uEC8E',\n 'ScrollUpDown': '\\uEC8F',\n 'DateTime': '\\uEC92',\n 'Event': '\\uECA3',\n 'Cake': '\\uECA4',\n 'Org': '\\uECA6',\n 'PartyLeader': '\\uECA7',\n 'DRM': '\\uECA8',\n 'CloudAdd': '\\uECA9',\n 'AppIconDefault': '\\uECAA',\n 'Photo2Add': '\\uECAB',\n 'Photo2Remove': '\\uECAC',\n 'Calories': '\\uECAD',\n 'POI': '\\uECAF',\n 'AddTo': '\\uECC8',\n 'RadioBtnOff': '\\uECCA',\n 'RadioBtnOn': '\\uECCB',\n 'ExploreContent': '\\uECCD',\n 'Product': '\\uECDC',\n 'ProgressLoopInner': '\\uECDE',\n 'ProgressLoopOuter': '\\uECDF',\n 'Blocked2': '\\uECE4',\n 'FangBody': '\\uECEB',\n 'Toolbox': '\\uECED',\n 'PageHeader': '\\uECEE',\n 'ChatInviteFriend': '\\uECFE',\n 'Brush': '\\uECFF',\n 'Shirt': '\\uED00',\n 'Crown': '\\uED01',\n 'Diamond': '\\uED02',\n 'ScaleUp': '\\uED09',\n 'QRCode': '\\uED14',\n 'Feedback': '\\uED15',\n 'SharepointLogoInverse': '\\uED18',\n 'YammerLogo': '\\uED19',\n 'Hide': '\\uED1A',\n 'Uneditable': '\\uED1D',\n 'ReturnToSession': '\\uED24',\n 'OpenFolderHorizontal': '\\uED25',\n 'CalendarMirrored': '\\uED28'\n }\n };\n registerIcons(subset, options);\n}\n//# sourceMappingURL=fabric-icons-5.js.map","// Your use of the content in the files referenced here is subject to the terms of the license at https://aka.ms/fluentui-assets-license\nimport { registerIcons } from '@fluentui/style-utilities';\nexport function initializeIcons(baseUrl, options) {\n if (baseUrl === void 0) { baseUrl = ''; }\n var subset = {\n style: {\n MozOsxFontSmoothing: 'grayscale',\n WebkitFontSmoothing: 'antialiased',\n fontStyle: 'normal',\n fontWeight: 'normal',\n speak: 'none'\n },\n fontFace: {\n fontFamily: \"\\\"FabricMDL2Icons-6\\\"\",\n src: \"url('\".concat(baseUrl, \"fabric-icons-6-ef6fd590.woff') format('woff')\")\n },\n icons: {\n 'SwayLogoInverse': '\\uED29',\n 'OutOfOffice': '\\uED34',\n 'Trophy': '\\uED3F',\n 'ReopenPages': '\\uED50',\n 'EmojiTabSymbols': '\\uED58',\n 'AADLogo': '\\uED68',\n 'AccessLogo': '\\uED69',\n 'AdminALogoInverse32': '\\uED6A',\n 'AdminCLogoInverse32': '\\uED6B',\n 'AdminDLogoInverse32': '\\uED6C',\n 'AdminELogoInverse32': '\\uED6D',\n 'AdminLLogoInverse32': '\\uED6E',\n 'AdminMLogoInverse32': '\\uED6F',\n 'AdminOLogoInverse32': '\\uED70',\n 'AdminPLogoInverse32': '\\uED71',\n 'AdminSLogoInverse32': '\\uED72',\n 'AdminYLogoInverse32': '\\uED73',\n 'DelveLogoInverse': '\\uED76',\n 'ExchangeLogoInverse': '\\uED78',\n 'LyncLogo': '\\uED79',\n 'OfficeVideoLogoInverse': '\\uED7A',\n 'SocialListeningLogo': '\\uED7C',\n 'VisioLogoInverse': '\\uED7D',\n 'Balloons': '\\uED7E',\n 'Cat': '\\uED7F',\n 'MailAlert': '\\uED80',\n 'MailCheck': '\\uED81',\n 'MailLowImportance': '\\uED82',\n 'MailPause': '\\uED83',\n 'MailRepeat': '\\uED84',\n 'SecurityGroup': '\\uED85',\n 'Table': '\\uED86',\n 'VoicemailForward': '\\uED87',\n 'VoicemailReply': '\\uED88',\n 'Waffle': '\\uED89',\n 'RemoveEvent': '\\uED8A',\n 'EventInfo': '\\uED8B',\n 'ForwardEvent': '\\uED8C',\n 'WipePhone': '\\uED8D',\n 'AddOnlineMeeting': '\\uED8E',\n 'JoinOnlineMeeting': '\\uED8F',\n 'RemoveLink': '\\uED90',\n 'PeopleBlock': '\\uED91',\n 'PeopleRepeat': '\\uED92',\n 'PeopleAlert': '\\uED93',\n 'PeoplePause': '\\uED94',\n 'TransferCall': '\\uED95',\n 'AddPhone': '\\uED96',\n 'UnknownCall': '\\uED97',\n 'NoteReply': '\\uED98',\n 'NoteForward': '\\uED99',\n 'NotePinned': '\\uED9A',\n 'RemoveOccurrence': '\\uED9B',\n 'Timeline': '\\uED9C',\n 'EditNote': '\\uED9D',\n 'CircleHalfFull': '\\uED9E',\n 'Room': '\\uED9F',\n 'Unsubscribe': '\\uEDA0',\n 'Subscribe': '\\uEDA1',\n 'HardDrive': '\\uEDA2',\n 'RecurringTask': '\\uEDB2',\n 'TaskManager': '\\uEDB7',\n 'TaskManagerMirrored': '\\uEDB8',\n 'Combine': '\\uEDBB',\n 'Split': '\\uEDBC',\n 'DoubleChevronUp': '\\uEDBD',\n 'DoubleChevronLeft': '\\uEDBE',\n 'DoubleChevronRight': '\\uEDBF',\n 'TextBox': '\\uEDC2',\n 'TextField': '\\uEDC3',\n 'NumberField': '\\uEDC4',\n 'Dropdown': '\\uEDC5',\n 'PenWorkspace': '\\uEDC6',\n 'BookingsLogo': '\\uEDC7',\n 'ClassNotebookLogoInverse': '\\uEDC8',\n 'DelveAnalyticsLogo': '\\uEDCA',\n 'DocsLogoInverse': '\\uEDCB',\n 'Dynamics365Logo': '\\uEDCC',\n 'DynamicSMBLogo': '\\uEDCD',\n 'OfficeAssistantLogo': '\\uEDCE',\n 'OfficeStoreLogo': '\\uEDCF',\n 'OneNoteEduLogoInverse': '\\uEDD0',\n 'PlannerLogo': '\\uEDD1',\n 'PowerApps': '\\uEDD2',\n 'Suitcase': '\\uEDD3',\n 'ProjectLogoInverse': '\\uEDD4',\n 'CaretLeft8': '\\uEDD5',\n 'CaretRight8': '\\uEDD6',\n 'CaretUp8': '\\uEDD7',\n 'CaretDown8': '\\uEDD8',\n 'CaretLeftSolid8': '\\uEDD9',\n 'CaretRightSolid8': '\\uEDDA',\n 'CaretUpSolid8': '\\uEDDB',\n 'CaretDownSolid8': '\\uEDDC',\n 'ClearFormatting': '\\uEDDD',\n 'Superscript': '\\uEDDE',\n 'Subscript': '\\uEDDF',\n 'Strikethrough': '\\uEDE0',\n 'Export': '\\uEDE1',\n 'ExportMirrored': '\\uEDE2'\n }\n };\n registerIcons(subset, options);\n}\n//# sourceMappingURL=fabric-icons-6.js.map","// Your use of the content in the files referenced here is subject to the terms of the license at https://aka.ms/fluentui-assets-license\nimport { registerIcons } from '@fluentui/style-utilities';\nexport function initializeIcons(baseUrl, options) {\n if (baseUrl === void 0) { baseUrl = ''; }\n var subset = {\n style: {\n MozOsxFontSmoothing: 'grayscale',\n WebkitFontSmoothing: 'antialiased',\n fontStyle: 'normal',\n fontWeight: 'normal',\n speak: 'none'\n },\n fontFace: {\n fontFamily: \"\\\"FabricMDL2Icons-7\\\"\",\n src: \"url('\".concat(baseUrl, \"fabric-icons-7-2b97bb99.woff') format('woff')\")\n },\n icons: {\n 'SingleBookmark': '\\uEDFF',\n 'SingleBookmarkSolid': '\\uEE00',\n 'DoubleChevronDown': '\\uEE04',\n 'FollowUser': '\\uEE05',\n 'ReplyAll': '\\uEE0A',\n 'WorkforceManagement': '\\uEE0F',\n 'RecruitmentManagement': '\\uEE12',\n 'Questionnaire': '\\uEE19',\n 'ManagerSelfService': '\\uEE23',\n 'ProductionFloorManagement': '\\uEE29',\n 'ProductRelease': '\\uEE2E',\n 'ProductVariant': '\\uEE30',\n 'ReplyMirrored': '\\uEE35',\n 'ReplyAllMirrored': '\\uEE36',\n 'Medal': '\\uEE38',\n 'AddGroup': '\\uEE3D',\n 'QuestionnaireMirrored': '\\uEE4B',\n 'CloudImportExport': '\\uEE55',\n 'TemporaryUser': '\\uEE58',\n 'CaretSolid16': '\\uEE62',\n 'GroupedDescending': '\\uEE66',\n 'GroupedAscending': '\\uEE67',\n 'AwayStatus': '\\uEE6A',\n 'MyMoviesTV': '\\uEE6C',\n 'GenericScan': '\\uEE6F',\n 'AustralianRules': '\\uEE70',\n 'WifiEthernet': '\\uEE77',\n 'TrackersMirrored': '\\uEE92',\n 'DateTimeMirrored': '\\uEE93',\n 'StopSolid': '\\uEE95',\n 'DoubleChevronUp12': '\\uEE96',\n 'DoubleChevronDown12': '\\uEE97',\n 'DoubleChevronLeft12': '\\uEE98',\n 'DoubleChevronRight12': '\\uEE99',\n 'CalendarAgenda': '\\uEE9A',\n 'ConnectVirtualMachine': '\\uEE9D',\n 'AddEvent': '\\uEEB5',\n 'AssetLibrary': '\\uEEB6',\n 'DataConnectionLibrary': '\\uEEB7',\n 'DocLibrary': '\\uEEB8',\n 'FormLibrary': '\\uEEB9',\n 'FormLibraryMirrored': '\\uEEBA',\n 'ReportLibrary': '\\uEEBB',\n 'ReportLibraryMirrored': '\\uEEBC',\n 'ContactCard': '\\uEEBD',\n 'CustomList': '\\uEEBE',\n 'CustomListMirrored': '\\uEEBF',\n 'IssueTracking': '\\uEEC0',\n 'IssueTrackingMirrored': '\\uEEC1',\n 'PictureLibrary': '\\uEEC2',\n 'OfficeAddinsLogo': '\\uEEC7',\n 'OfflineOneDriveParachute': '\\uEEC8',\n 'OfflineOneDriveParachuteDisabled': '\\uEEC9',\n 'TriangleSolidUp12': '\\uEECC',\n 'TriangleSolidDown12': '\\uEECD',\n 'TriangleSolidLeft12': '\\uEECE',\n 'TriangleSolidRight12': '\\uEECF',\n 'TriangleUp12': '\\uEED0',\n 'TriangleDown12': '\\uEED1',\n 'TriangleLeft12': '\\uEED2',\n 'TriangleRight12': '\\uEED3',\n 'ArrowUpRight8': '\\uEED4',\n 'ArrowDownRight8': '\\uEED5',\n 'DocumentSet': '\\uEED6',\n 'GoToDashboard': '\\uEEED',\n 'DelveAnalytics': '\\uEEEE',\n 'ArrowUpRightMirrored8': '\\uEEEF',\n 'ArrowDownRightMirrored8': '\\uEEF0',\n 'CompanyDirectory': '\\uEF0D',\n 'OpenEnrollment': '\\uEF1C',\n 'CompanyDirectoryMirrored': '\\uEF2B',\n 'OneDriveAdd': '\\uEF32',\n 'ProfileSearch': '\\uEF35',\n 'Header2': '\\uEF36',\n 'Header3': '\\uEF37',\n 'Header4': '\\uEF38',\n 'RingerSolid': '\\uEF3A',\n 'Eyedropper': '\\uEF3C',\n 'MarketDown': '\\uEF42',\n 'CalendarWorkWeek': '\\uEF51',\n 'SidePanel': '\\uEF52',\n 'GlobeFavorite': '\\uEF53',\n 'CaretTopLeftSolid8': '\\uEF54',\n 'CaretTopRightSolid8': '\\uEF55',\n 'ViewAll2': '\\uEF56',\n 'DocumentReply': '\\uEF57',\n 'PlayerSettings': '\\uEF58',\n 'ReceiptForward': '\\uEF59',\n 'ReceiptReply': '\\uEF5A',\n 'ReceiptCheck': '\\uEF5B',\n 'Fax': '\\uEF5C',\n 'RecurringEvent': '\\uEF5D',\n 'ReplyAlt': '\\uEF5E',\n 'ReplyAllAlt': '\\uEF5F',\n 'EditStyle': '\\uEF60',\n 'EditMail': '\\uEF61',\n 'Lifesaver': '\\uEF62',\n 'LifesaverLock': '\\uEF63',\n 'InboxCheck': '\\uEF64',\n 'FolderSearch': '\\uEF65'\n }\n };\n registerIcons(subset, options);\n}\n//# sourceMappingURL=fabric-icons-7.js.map","// Your use of the content in the files referenced here is subject to the terms of the license at https://aka.ms/fluentui-assets-license\nimport { registerIcons } from '@fluentui/style-utilities';\nexport function initializeIcons(baseUrl, options) {\n if (baseUrl === void 0) { baseUrl = ''; }\n var subset = {\n style: {\n MozOsxFontSmoothing: 'grayscale',\n WebkitFontSmoothing: 'antialiased',\n fontStyle: 'normal',\n fontWeight: 'normal',\n speak: 'none'\n },\n fontFace: {\n fontFamily: \"\\\"FabricMDL2Icons-8\\\"\",\n src: \"url('\".concat(baseUrl, \"fabric-icons-8-6fdf1528.woff') format('woff')\")\n },\n icons: {\n 'CollapseMenu': '\\uEF66',\n 'ExpandMenu': '\\uEF67',\n 'Boards': '\\uEF68',\n 'SunAdd': '\\uEF69',\n 'SunQuestionMark': '\\uEF6A',\n 'LandscapeOrientation': '\\uEF6B',\n 'DocumentSearch': '\\uEF6C',\n 'PublicCalendar': '\\uEF6D',\n 'PublicContactCard': '\\uEF6E',\n 'PublicEmail': '\\uEF6F',\n 'PublicFolder': '\\uEF70',\n 'WordDocument': '\\uEF71',\n 'PowerPointDocument': '\\uEF72',\n 'ExcelDocument': '\\uEF73',\n 'GroupedList': '\\uEF74',\n 'ClassroomLogo': '\\uEF75',\n 'Sections': '\\uEF76',\n 'EditPhoto': '\\uEF77',\n 'Starburst': '\\uEF78',\n 'ShareiOS': '\\uEF79',\n 'AirTickets': '\\uEF7A',\n 'PencilReply': '\\uEF7B',\n 'Tiles2': '\\uEF7C',\n 'SkypeCircleCheck': '\\uEF7D',\n 'SkypeCircleClock': '\\uEF7E',\n 'SkypeCircleMinus': '\\uEF7F',\n 'SkypeMessage': '\\uEF83',\n 'ClosedCaption': '\\uEF84',\n 'ATPLogo': '\\uEF85',\n 'OfficeFormsLogoInverse': '\\uEF86',\n 'RecycleBin': '\\uEF87',\n 'EmptyRecycleBin': '\\uEF88',\n 'Hide2': '\\uEF89',\n 'Breadcrumb': '\\uEF8C',\n 'BirthdayCake': '\\uEF8D',\n 'TimeEntry': '\\uEF95',\n 'CRMProcesses': '\\uEFB1',\n 'PageEdit': '\\uEFB6',\n 'PageArrowRight': '\\uEFB8',\n 'PageRemove': '\\uEFBA',\n 'Database': '\\uEFC7',\n 'DataManagementSettings': '\\uEFC8',\n 'CRMServices': '\\uEFD2',\n 'EditContact': '\\uEFD3',\n 'ConnectContacts': '\\uEFD4',\n 'AppIconDefaultAdd': '\\uEFDA',\n 'AppIconDefaultList': '\\uEFDE',\n 'ActivateOrders': '\\uEFE0',\n 'DeactivateOrders': '\\uEFE1',\n 'ProductCatalog': '\\uEFE8',\n 'ScatterChart': '\\uEFEB',\n 'AccountActivity': '\\uEFF4',\n 'DocumentManagement': '\\uEFFC',\n 'CRMReport': '\\uEFFE',\n 'KnowledgeArticle': '\\uF000',\n 'Relationship': '\\uF003',\n 'HomeVerify': '\\uF00E',\n 'ZipFolder': '\\uF012',\n 'SurveyQuestions': '\\uF01B',\n 'TextDocument': '\\uF029',\n 'TextDocumentShared': '\\uF02B',\n 'PageCheckedOut': '\\uF02C',\n 'PageShared': '\\uF02D',\n 'SaveAndClose': '\\uF038',\n 'Script': '\\uF03A',\n 'Archive': '\\uF03F',\n 'ActivityFeed': '\\uF056',\n 'Compare': '\\uF057',\n 'EventDate': '\\uF059',\n 'ArrowUpRight': '\\uF069',\n 'CaretRight': '\\uF06B',\n 'SetAction': '\\uF071',\n 'ChatBot': '\\uF08B',\n 'CaretSolidLeft': '\\uF08D',\n 'CaretSolidDown': '\\uF08E',\n 'CaretSolidRight': '\\uF08F',\n 'CaretSolidUp': '\\uF090',\n 'PowerAppsLogo': '\\uF091',\n 'PowerApps2Logo': '\\uF092',\n 'SearchIssue': '\\uF09A',\n 'SearchIssueMirrored': '\\uF09B',\n 'FabricAssetLibrary': '\\uF09C',\n 'FabricDataConnectionLibrary': '\\uF09D',\n 'FabricDocLibrary': '\\uF09E',\n 'FabricFormLibrary': '\\uF09F',\n 'FabricFormLibraryMirrored': '\\uF0A0',\n 'FabricReportLibrary': '\\uF0A1',\n 'FabricReportLibraryMirrored': '\\uF0A2',\n 'FabricPublicFolder': '\\uF0A3',\n 'FabricFolderSearch': '\\uF0A4',\n 'FabricMovetoFolder': '\\uF0A5',\n 'FabricUnsyncFolder': '\\uF0A6',\n 'FabricSyncFolder': '\\uF0A7',\n 'FabricOpenFolderHorizontal': '\\uF0A8',\n 'FabricFolder': '\\uF0A9',\n 'FabricFolderFill': '\\uF0AA',\n 'FabricNewFolder': '\\uF0AB',\n 'FabricPictureLibrary': '\\uF0AC',\n 'PhotoVideoMedia': '\\uF0B1',\n 'AddFavorite': '\\uF0C8'\n }\n };\n registerIcons(subset, options);\n}\n//# sourceMappingURL=fabric-icons-8.js.map","// Your use of the content in the files referenced here is subject to the terms of the license at https://aka.ms/fluentui-assets-license\nimport { registerIcons } from '@fluentui/style-utilities';\nexport function initializeIcons(baseUrl, options) {\n if (baseUrl === void 0) { baseUrl = ''; }\n var subset = {\n style: {\n MozOsxFontSmoothing: 'grayscale',\n WebkitFontSmoothing: 'antialiased',\n fontStyle: 'normal',\n fontWeight: 'normal',\n speak: 'none'\n },\n fontFace: {\n fontFamily: \"\\\"FabricMDL2Icons-9\\\"\",\n src: \"url('\".concat(baseUrl, \"fabric-icons-9-c6162b42.woff') format('woff')\")\n },\n icons: {\n 'AddFavoriteFill': '\\uF0C9',\n 'BufferTimeBefore': '\\uF0CF',\n 'BufferTimeAfter': '\\uF0D0',\n 'BufferTimeBoth': '\\uF0D1',\n 'PublishContent': '\\uF0D4',\n 'ClipboardList': '\\uF0E3',\n 'ClipboardListMirrored': '\\uF0E4',\n 'CannedChat': '\\uF0F2',\n 'SkypeForBusinessLogo': '\\uF0FC',\n 'TabCenter': '\\uF100',\n 'PageCheckedin': '\\uF104',\n 'PageList': '\\uF106',\n 'ReadOutLoud': '\\uF112',\n 'CaretBottomLeftSolid8': '\\uF121',\n 'CaretBottomRightSolid8': '\\uF122',\n 'FolderHorizontal': '\\uF12B',\n 'MicrosoftStaffhubLogo': '\\uF130',\n 'GiftboxOpen': '\\uF133',\n 'StatusCircleOuter': '\\uF136',\n 'StatusCircleInner': '\\uF137',\n 'StatusCircleRing': '\\uF138',\n 'StatusTriangleOuter': '\\uF139',\n 'StatusTriangleInner': '\\uF13A',\n 'StatusTriangleExclamation': '\\uF13B',\n 'StatusCircleExclamation': '\\uF13C',\n 'StatusCircleErrorX': '\\uF13D',\n 'StatusCircleInfo': '\\uF13F',\n 'StatusCircleBlock': '\\uF140',\n 'StatusCircleBlock2': '\\uF141',\n 'StatusCircleQuestionMark': '\\uF142',\n 'StatusCircleSync': '\\uF143',\n 'Toll': '\\uF160',\n 'ExploreContentSingle': '\\uF164',\n 'CollapseContent': '\\uF165',\n 'CollapseContentSingle': '\\uF166',\n 'InfoSolid': '\\uF167',\n 'GroupList': '\\uF168',\n 'ProgressRingDots': '\\uF16A',\n 'CaloriesAdd': '\\uF172',\n 'BranchFork': '\\uF173',\n 'MuteChat': '\\uF17A',\n 'AddHome': '\\uF17B',\n 'AddWork': '\\uF17C',\n 'MobileReport': '\\uF18A',\n 'ScaleVolume': '\\uF18C',\n 'HardDriveGroup': '\\uF18F',\n 'FastMode': '\\uF19A',\n 'ToggleLeft': '\\uF19E',\n 'ToggleRight': '\\uF19F',\n 'TriangleShape': '\\uF1A7',\n 'RectangleShape': '\\uF1A9',\n 'CubeShape': '\\uF1AA',\n 'Trophy2': '\\uF1AE',\n 'BucketColor': '\\uF1B6',\n 'BucketColorFill': '\\uF1B7',\n 'Taskboard': '\\uF1C2',\n 'SingleColumn': '\\uF1D3',\n 'DoubleColumn': '\\uF1D4',\n 'TripleColumn': '\\uF1D5',\n 'ColumnLeftTwoThirds': '\\uF1D6',\n 'ColumnRightTwoThirds': '\\uF1D7',\n 'AccessLogoFill': '\\uF1DB',\n 'AnalyticsLogo': '\\uF1DE',\n 'AnalyticsQuery': '\\uF1DF',\n 'NewAnalyticsQuery': '\\uF1E0',\n 'AnalyticsReport': '\\uF1E1',\n 'WordLogo': '\\uF1E3',\n 'WordLogoFill': '\\uF1E4',\n 'ExcelLogo': '\\uF1E5',\n 'ExcelLogoFill': '\\uF1E6',\n 'OneNoteLogo': '\\uF1E7',\n 'OneNoteLogoFill': '\\uF1E8',\n 'OutlookLogo': '\\uF1E9',\n 'OutlookLogoFill': '\\uF1EA',\n 'PowerPointLogo': '\\uF1EB',\n 'PowerPointLogoFill': '\\uF1EC',\n 'PublisherLogo': '\\uF1ED',\n 'PublisherLogoFill': '\\uF1EE',\n 'ScheduleEventAction': '\\uF1EF',\n 'FlameSolid': '\\uF1F3',\n 'ServerProcesses': '\\uF1FE',\n 'Server': '\\uF201',\n 'SaveAll': '\\uF203',\n 'LinkedInLogo': '\\uF20A',\n 'Decimals': '\\uF218',\n 'SidePanelMirrored': '\\uF221',\n 'ProtectRestrict': '\\uF22A',\n 'Blog': '\\uF22B',\n 'UnknownMirrored': '\\uF22E',\n 'PublicContactCardMirrored': '\\uF230',\n 'GridViewSmall': '\\uF232',\n 'GridViewMedium': '\\uF233',\n 'GridViewLarge': '\\uF234',\n 'Step': '\\uF241',\n 'StepInsert': '\\uF242',\n 'StepShared': '\\uF243',\n 'StepSharedAdd': '\\uF244',\n 'StepSharedInsert': '\\uF245',\n 'ViewDashboard': '\\uF246',\n 'ViewList': '\\uF247'\n }\n };\n registerIcons(subset, options);\n}\n//# sourceMappingURL=fabric-icons-9.js.map","// Your use of the content in the files referenced here is subject to the terms of the license at https://aka.ms/fluentui-assets-license\nimport { registerIcons } from '@fluentui/style-utilities';\nexport function initializeIcons(baseUrl, options) {\n if (baseUrl === void 0) { baseUrl = ''; }\n var subset = {\n style: {\n MozOsxFontSmoothing: 'grayscale',\n WebkitFontSmoothing: 'antialiased',\n fontStyle: 'normal',\n fontWeight: 'normal',\n speak: 'none'\n },\n fontFace: {\n fontFamily: \"\\\"FabricMDL2Icons-10\\\"\",\n src: \"url('\".concat(baseUrl, \"fabric-icons-10-c4ded8e4.woff') format('woff')\")\n },\n icons: {\n 'ViewListGroup': '\\uF248',\n 'ViewListTree': '\\uF249',\n 'TriggerAuto': '\\uF24A',\n 'TriggerUser': '\\uF24B',\n 'PivotChart': '\\uF24C',\n 'StackedBarChart': '\\uF24D',\n 'StackedLineChart': '\\uF24E',\n 'BuildQueue': '\\uF24F',\n 'BuildQueueNew': '\\uF250',\n 'UserFollowed': '\\uF25C',\n 'ContactLink': '\\uF25F',\n 'Stack': '\\uF26F',\n 'Bullseye': '\\uF272',\n 'VennDiagram': '\\uF273',\n 'FiveTileGrid': '\\uF274',\n 'FocalPoint': '\\uF277',\n 'Insert': '\\uF278',\n 'RingerRemove': '\\uF279',\n 'TeamsLogoInverse': '\\uF27A',\n 'TeamsLogo': '\\uF27B',\n 'TeamsLogoFill': '\\uF27C',\n 'SkypeForBusinessLogoFill': '\\uF27D',\n 'SharepointLogo': '\\uF27E',\n 'SharepointLogoFill': '\\uF27F',\n 'DelveLogo': '\\uF280',\n 'DelveLogoFill': '\\uF281',\n 'OfficeVideoLogo': '\\uF282',\n 'OfficeVideoLogoFill': '\\uF283',\n 'ExchangeLogo': '\\uF284',\n 'ExchangeLogoFill': '\\uF285',\n 'Signin': '\\uF286',\n 'DocumentApproval': '\\uF28B',\n 'CloneToDesktop': '\\uF28C',\n 'InstallToDrive': '\\uF28D',\n 'Blur': '\\uF28E',\n 'Build': '\\uF28F',\n 'ProcessMetaTask': '\\uF290',\n 'BranchFork2': '\\uF291',\n 'BranchLocked': '\\uF292',\n 'BranchCommit': '\\uF293',\n 'BranchCompare': '\\uF294',\n 'BranchMerge': '\\uF295',\n 'BranchPullRequest': '\\uF296',\n 'BranchSearch': '\\uF297',\n 'BranchShelveset': '\\uF298',\n 'RawSource': '\\uF299',\n 'MergeDuplicate': '\\uF29A',\n 'RowsGroup': '\\uF29B',\n 'RowsChild': '\\uF29C',\n 'Deploy': '\\uF29D',\n 'Redeploy': '\\uF29E',\n 'ServerEnviroment': '\\uF29F',\n 'VisioDiagram': '\\uF2A0',\n 'HighlightMappedShapes': '\\uF2A1',\n 'TextCallout': '\\uF2A2',\n 'IconSetsFlag': '\\uF2A4',\n 'VisioLogo': '\\uF2A7',\n 'VisioLogoFill': '\\uF2A8',\n 'VisioDocument': '\\uF2A9',\n 'TimelineProgress': '\\uF2AA',\n 'TimelineDelivery': '\\uF2AB',\n 'Backlog': '\\uF2AC',\n 'TeamFavorite': '\\uF2AD',\n 'TaskGroup': '\\uF2AE',\n 'TaskGroupMirrored': '\\uF2AF',\n 'ScopeTemplate': '\\uF2B0',\n 'AssessmentGroupTemplate': '\\uF2B1',\n 'NewTeamProject': '\\uF2B2',\n 'CommentAdd': '\\uF2B3',\n 'CommentNext': '\\uF2B4',\n 'CommentPrevious': '\\uF2B5',\n 'ShopServer': '\\uF2B6',\n 'LocaleLanguage': '\\uF2B7',\n 'QueryList': '\\uF2B8',\n 'UserSync': '\\uF2B9',\n 'UserPause': '\\uF2BA',\n 'StreamingOff': '\\uF2BB',\n 'ArrowTallUpLeft': '\\uF2BD',\n 'ArrowTallUpRight': '\\uF2BE',\n 'ArrowTallDownLeft': '\\uF2BF',\n 'ArrowTallDownRight': '\\uF2C0',\n 'FieldEmpty': '\\uF2C1',\n 'FieldFilled': '\\uF2C2',\n 'FieldChanged': '\\uF2C3',\n 'FieldNotChanged': '\\uF2C4',\n 'RingerOff': '\\uF2C5',\n 'PlayResume': '\\uF2C6',\n 'BulletedList2': '\\uF2C7',\n 'BulletedList2Mirrored': '\\uF2C8',\n 'ImageCrosshair': '\\uF2C9',\n 'GitGraph': '\\uF2CA',\n 'Repo': '\\uF2CB',\n 'RepoSolid': '\\uF2CC',\n 'FolderQuery': '\\uF2CD',\n 'FolderList': '\\uF2CE',\n 'FolderListMirrored': '\\uF2CF',\n 'LocationOutline': '\\uF2D0',\n 'POISolid': '\\uF2D1',\n 'CalculatorNotEqualTo': '\\uF2D2',\n 'BoxSubtractSolid': '\\uF2D3'\n }\n };\n registerIcons(subset, options);\n}\n//# sourceMappingURL=fabric-icons-10.js.map","// Your use of the content in the files referenced here is subject to the terms of the license at https://aka.ms/fluentui-assets-license\nimport { registerIcons } from '@fluentui/style-utilities';\nexport function initializeIcons(baseUrl, options) {\n if (baseUrl === void 0) { baseUrl = ''; }\n var subset = {\n style: {\n MozOsxFontSmoothing: 'grayscale',\n WebkitFontSmoothing: 'antialiased',\n fontStyle: 'normal',\n fontWeight: 'normal',\n speak: 'none'\n },\n fontFace: {\n fontFamily: \"\\\"FabricMDL2Icons-11\\\"\",\n src: \"url('\".concat(baseUrl, \"fabric-icons-11-2a8393d6.woff') format('woff')\")\n },\n icons: {\n 'BoxAdditionSolid': '\\uF2D4',\n 'BoxMultiplySolid': '\\uF2D5',\n 'BoxPlaySolid': '\\uF2D6',\n 'BoxCheckmarkSolid': '\\uF2D7',\n 'CirclePauseSolid': '\\uF2D8',\n 'CirclePause': '\\uF2D9',\n 'MSNVideosSolid': '\\uF2DA',\n 'CircleStopSolid': '\\uF2DB',\n 'CircleStop': '\\uF2DC',\n 'NavigateBack': '\\uF2DD',\n 'NavigateBackMirrored': '\\uF2DE',\n 'NavigateForward': '\\uF2DF',\n 'NavigateForwardMirrored': '\\uF2E0',\n 'UnknownSolid': '\\uF2E1',\n 'UnknownMirroredSolid': '\\uF2E2',\n 'CircleAddition': '\\uF2E3',\n 'CircleAdditionSolid': '\\uF2E4',\n 'FilePDB': '\\uF2E5',\n 'FileTemplate': '\\uF2E6',\n 'FileSQL': '\\uF2E7',\n 'FileJAVA': '\\uF2E8',\n 'FileASPX': '\\uF2E9',\n 'FileCSS': '\\uF2EA',\n 'FileSass': '\\uF2EB',\n 'FileLess': '\\uF2EC',\n 'FileHTML': '\\uF2ED',\n 'JavaScriptLanguage': '\\uF2EE',\n 'CSharpLanguage': '\\uF2EF',\n 'CSharp': '\\uF2F0',\n 'VisualBasicLanguage': '\\uF2F1',\n 'VB': '\\uF2F2',\n 'CPlusPlusLanguage': '\\uF2F3',\n 'CPlusPlus': '\\uF2F4',\n 'FSharpLanguage': '\\uF2F5',\n 'FSharp': '\\uF2F6',\n 'TypeScriptLanguage': '\\uF2F7',\n 'PythonLanguage': '\\uF2F8',\n 'PY': '\\uF2F9',\n 'CoffeeScript': '\\uF2FA',\n 'MarkDownLanguage': '\\uF2FB',\n 'FullWidth': '\\uF2FE',\n 'FullWidthEdit': '\\uF2FF',\n 'Plug': '\\uF300',\n 'PlugSolid': '\\uF301',\n 'PlugConnected': '\\uF302',\n 'PlugDisconnected': '\\uF303',\n 'UnlockSolid': '\\uF304',\n 'Variable': '\\uF305',\n 'Parameter': '\\uF306',\n 'CommentUrgent': '\\uF307',\n 'Storyboard': '\\uF308',\n 'DiffInline': '\\uF309',\n 'DiffSideBySide': '\\uF30A',\n 'ImageDiff': '\\uF30B',\n 'ImagePixel': '\\uF30C',\n 'FileBug': '\\uF30D',\n 'FileCode': '\\uF30E',\n 'FileComment': '\\uF30F',\n 'BusinessHoursSign': '\\uF310',\n 'FileImage': '\\uF311',\n 'FileSymlink': '\\uF312',\n 'AutoFillTemplate': '\\uF313',\n 'WorkItem': '\\uF314',\n 'WorkItemBug': '\\uF315',\n 'LogRemove': '\\uF316',\n 'ColumnOptions': '\\uF317',\n 'Packages': '\\uF318',\n 'BuildIssue': '\\uF319',\n 'AssessmentGroup': '\\uF31A',\n 'VariableGroup': '\\uF31B',\n 'FullHistory': '\\uF31C',\n 'Wheelchair': '\\uF31F',\n 'SingleColumnEdit': '\\uF321',\n 'DoubleColumnEdit': '\\uF322',\n 'TripleColumnEdit': '\\uF323',\n 'ColumnLeftTwoThirdsEdit': '\\uF324',\n 'ColumnRightTwoThirdsEdit': '\\uF325',\n 'StreamLogo': '\\uF329',\n 'PassiveAuthentication': '\\uF32A',\n 'AlertSolid': '\\uF331',\n 'MegaphoneSolid': '\\uF332',\n 'TaskSolid': '\\uF333',\n 'ConfigurationSolid': '\\uF334',\n 'BugSolid': '\\uF335',\n 'CrownSolid': '\\uF336',\n 'Trophy2Solid': '\\uF337',\n 'QuickNoteSolid': '\\uF338',\n 'ConstructionConeSolid': '\\uF339',\n 'PageListSolid': '\\uF33A',\n 'PageListMirroredSolid': '\\uF33B',\n 'StarburstSolid': '\\uF33C',\n 'ReadingModeSolid': '\\uF33D',\n 'SadSolid': '\\uF33E',\n 'HealthSolid': '\\uF33F',\n 'ShieldSolid': '\\uF340',\n 'GiftBoxSolid': '\\uF341',\n 'ShoppingCartSolid': '\\uF342',\n 'MailSolid': '\\uF343',\n 'ChatSolid': '\\uF344',\n 'RibbonSolid': '\\uF345'\n }\n };\n registerIcons(subset, options);\n}\n//# sourceMappingURL=fabric-icons-11.js.map","// Your use of the content in the files referenced here is subject to the terms of the license at https://aka.ms/fluentui-assets-license\nimport { registerIcons } from '@fluentui/style-utilities';\nexport function initializeIcons(baseUrl, options) {\n if (baseUrl === void 0) { baseUrl = ''; }\n var subset = {\n style: {\n MozOsxFontSmoothing: 'grayscale',\n WebkitFontSmoothing: 'antialiased',\n fontStyle: 'normal',\n fontWeight: 'normal',\n speak: 'none'\n },\n fontFace: {\n fontFamily: \"\\\"FabricMDL2Icons-12\\\"\",\n src: \"url('\".concat(baseUrl, \"fabric-icons-12-7e945a1e.woff') format('woff')\")\n },\n icons: {\n 'FinancialSolid': '\\uF346',\n 'FinancialMirroredSolid': '\\uF347',\n 'HeadsetSolid': '\\uF348',\n 'PermissionsSolid': '\\uF349',\n 'ParkingSolid': '\\uF34A',\n 'ParkingMirroredSolid': '\\uF34B',\n 'DiamondSolid': '\\uF34C',\n 'AsteriskSolid': '\\uF34D',\n 'OfflineStorageSolid': '\\uF34E',\n 'BankSolid': '\\uF34F',\n 'DecisionSolid': '\\uF350',\n 'Parachute': '\\uF351',\n 'ParachuteSolid': '\\uF352',\n 'FiltersSolid': '\\uF353',\n 'ColorSolid': '\\uF354',\n 'ReviewSolid': '\\uF355',\n 'ReviewRequestSolid': '\\uF356',\n 'ReviewRequestMirroredSolid': '\\uF357',\n 'ReviewResponseSolid': '\\uF358',\n 'FeedbackRequestSolid': '\\uF359',\n 'FeedbackRequestMirroredSolid': '\\uF35A',\n 'FeedbackResponseSolid': '\\uF35B',\n 'WorkItemBar': '\\uF35C',\n 'WorkItemBarSolid': '\\uF35D',\n 'Separator': '\\uF35E',\n 'NavigateExternalInline': '\\uF35F',\n 'PlanView': '\\uF360',\n 'TimelineMatrixView': '\\uF361',\n 'EngineeringGroup': '\\uF362',\n 'ProjectCollection': '\\uF363',\n 'CaretBottomRightCenter8': '\\uF364',\n 'CaretBottomLeftCenter8': '\\uF365',\n 'CaretTopRightCenter8': '\\uF366',\n 'CaretTopLeftCenter8': '\\uF367',\n 'DonutChart': '\\uF368',\n 'ChevronUnfold10': '\\uF369',\n 'ChevronFold10': '\\uF36A',\n 'DoubleChevronDown8': '\\uF36B',\n 'DoubleChevronUp8': '\\uF36C',\n 'DoubleChevronLeft8': '\\uF36D',\n 'DoubleChevronRight8': '\\uF36E',\n 'ChevronDownEnd6': '\\uF36F',\n 'ChevronUpEnd6': '\\uF370',\n 'ChevronLeftEnd6': '\\uF371',\n 'ChevronRightEnd6': '\\uF372',\n 'ContextMenu': '\\uF37C',\n 'AzureAPIManagement': '\\uF37F',\n 'AzureServiceEndpoint': '\\uF380',\n 'VSTSLogo': '\\uF381',\n 'VSTSAltLogo1': '\\uF382',\n 'VSTSAltLogo2': '\\uF383',\n 'FileTypeSolution': '\\uF387',\n 'WordLogoInverse16': '\\uF390',\n 'WordLogo16': '\\uF391',\n 'WordLogoFill16': '\\uF392',\n 'PowerPointLogoInverse16': '\\uF393',\n 'PowerPointLogo16': '\\uF394',\n 'PowerPointLogoFill16': '\\uF395',\n 'ExcelLogoInverse16': '\\uF396',\n 'ExcelLogo16': '\\uF397',\n 'ExcelLogoFill16': '\\uF398',\n 'OneNoteLogoInverse16': '\\uF399',\n 'OneNoteLogo16': '\\uF39A',\n 'OneNoteLogoFill16': '\\uF39B',\n 'OutlookLogoInverse16': '\\uF39C',\n 'OutlookLogo16': '\\uF39D',\n 'OutlookLogoFill16': '\\uF39E',\n 'PublisherLogoInverse16': '\\uF39F',\n 'PublisherLogo16': '\\uF3A0',\n 'PublisherLogoFill16': '\\uF3A1',\n 'VisioLogoInverse16': '\\uF3A2',\n 'VisioLogo16': '\\uF3A3',\n 'VisioLogoFill16': '\\uF3A4',\n 'TestBeaker': '\\uF3A5',\n 'TestBeakerSolid': '\\uF3A6',\n 'TestExploreSolid': '\\uF3A7',\n 'TestAutoSolid': '\\uF3A8',\n 'TestUserSolid': '\\uF3A9',\n 'TestImpactSolid': '\\uF3AA',\n 'TestPlan': '\\uF3AB',\n 'TestStep': '\\uF3AC',\n 'TestParameter': '\\uF3AD',\n 'TestSuite': '\\uF3AE',\n 'TestCase': '\\uF3AF',\n 'Sprint': '\\uF3B0',\n 'SignOut': '\\uF3B1',\n 'TriggerApproval': '\\uF3B2',\n 'Rocket': '\\uF3B3',\n 'AzureKeyVault': '\\uF3B4',\n 'Onboarding': '\\uF3BA',\n 'Transition': '\\uF3BC',\n 'LikeSolid': '\\uF3BF',\n 'DislikeSolid': '\\uF3C0',\n 'CRMCustomerInsightsApp': '\\uF3C8',\n 'EditCreate': '\\uF3C9',\n 'PlayReverseResume': '\\uF3E4',\n 'PlayReverse': '\\uF3E5',\n 'SearchData': '\\uF3F1',\n 'UnSetColor': '\\uF3F9',\n 'DeclineCall': '\\uF405'\n }\n };\n registerIcons(subset, options);\n}\n//# sourceMappingURL=fabric-icons-12.js.map","// Your use of the content in the files referenced here is subject to the terms of the license at https://aka.ms/fluentui-assets-license\nimport { registerIcons } from '@fluentui/style-utilities';\nexport function initializeIcons(baseUrl, options) {\n if (baseUrl === void 0) { baseUrl = ''; }\n var subset = {\n style: {\n MozOsxFontSmoothing: 'grayscale',\n WebkitFontSmoothing: 'antialiased',\n fontStyle: 'normal',\n fontWeight: 'normal',\n speak: 'none'\n },\n fontFace: {\n fontFamily: \"\\\"FabricMDL2Icons-13\\\"\",\n src: \"url('\".concat(baseUrl, \"fabric-icons-13-c3989a02.woff') format('woff')\")\n },\n icons: {\n 'RectangularClipping': '\\uF407',\n 'TeamsLogo16': '\\uF40A',\n 'TeamsLogoFill16': '\\uF40B',\n 'Spacer': '\\uF40D',\n 'SkypeLogo16': '\\uF40E',\n 'SkypeForBusinessLogo16': '\\uF40F',\n 'SkypeForBusinessLogoFill16': '\\uF410',\n 'FilterSolid': '\\uF412',\n 'MailUndelivered': '\\uF415',\n 'MailTentative': '\\uF416',\n 'MailTentativeMirrored': '\\uF417',\n 'MailReminder': '\\uF418',\n 'ReceiptUndelivered': '\\uF419',\n 'ReceiptTentative': '\\uF41A',\n 'ReceiptTentativeMirrored': '\\uF41B',\n 'Inbox': '\\uF41C',\n 'IRMReply': '\\uF41D',\n 'IRMReplyMirrored': '\\uF41E',\n 'IRMForward': '\\uF41F',\n 'IRMForwardMirrored': '\\uF420',\n 'VoicemailIRM': '\\uF421',\n 'EventAccepted': '\\uF422',\n 'EventTentative': '\\uF423',\n 'EventTentativeMirrored': '\\uF424',\n 'EventDeclined': '\\uF425',\n 'IDBadge': '\\uF427',\n 'BackgroundColor': '\\uF42B',\n 'OfficeFormsLogoInverse16': '\\uF433',\n 'OfficeFormsLogo': '\\uF434',\n 'OfficeFormsLogoFill': '\\uF435',\n 'OfficeFormsLogo16': '\\uF436',\n 'OfficeFormsLogoFill16': '\\uF437',\n 'OfficeFormsLogoInverse24': '\\uF43A',\n 'OfficeFormsLogo24': '\\uF43B',\n 'OfficeFormsLogoFill24': '\\uF43C',\n 'PageLock': '\\uF43F',\n 'NotExecuted': '\\uF440',\n 'NotImpactedSolid': '\\uF441',\n 'FieldReadOnly': '\\uF442',\n 'FieldRequired': '\\uF443',\n 'BacklogBoard': '\\uF444',\n 'ExternalBuild': '\\uF445',\n 'ExternalTFVC': '\\uF446',\n 'ExternalXAML': '\\uF447',\n 'IssueSolid': '\\uF448',\n 'DefectSolid': '\\uF449',\n 'LadybugSolid': '\\uF44A',\n 'NugetLogo': '\\uF44C',\n 'TFVCLogo': '\\uF44D',\n 'ProjectLogo32': '\\uF47E',\n 'ProjectLogoFill32': '\\uF47F',\n 'ProjectLogo16': '\\uF480',\n 'ProjectLogoFill16': '\\uF481',\n 'SwayLogo32': '\\uF482',\n 'SwayLogoFill32': '\\uF483',\n 'SwayLogo16': '\\uF484',\n 'SwayLogoFill16': '\\uF485',\n 'ClassNotebookLogo32': '\\uF486',\n 'ClassNotebookLogoFill32': '\\uF487',\n 'ClassNotebookLogo16': '\\uF488',\n 'ClassNotebookLogoFill16': '\\uF489',\n 'ClassNotebookLogoInverse32': '\\uF48A',\n 'ClassNotebookLogoInverse16': '\\uF48B',\n 'StaffNotebookLogo32': '\\uF48C',\n 'StaffNotebookLogoFill32': '\\uF48D',\n 'StaffNotebookLogo16': '\\uF48E',\n 'StaffNotebookLogoFill16': '\\uF48F',\n 'StaffNotebookLogoInverted32': '\\uF490',\n 'StaffNotebookLogoInverted16': '\\uF491',\n 'KaizalaLogo': '\\uF492',\n 'TaskLogo': '\\uF493',\n 'ProtectionCenterLogo32': '\\uF494',\n 'GallatinLogo': '\\uF496',\n 'Globe2': '\\uF49A',\n 'Guitar': '\\uF49B',\n 'Breakfast': '\\uF49C',\n 'Brunch': '\\uF49D',\n 'BeerMug': '\\uF49E',\n 'Vacation': '\\uF49F',\n 'Teeth': '\\uF4A0',\n 'Taxi': '\\uF4A1',\n 'Chopsticks': '\\uF4A2',\n 'SyncOccurence': '\\uF4A3',\n 'UnsyncOccurence': '\\uF4A4',\n 'GIF': '\\uF4A9',\n 'PrimaryCalendar': '\\uF4AE',\n 'SearchCalendar': '\\uF4AF',\n 'VideoOff': '\\uF4B0',\n 'MicrosoftFlowLogo': '\\uF4B1',\n 'BusinessCenterLogo': '\\uF4B2',\n 'ToDoLogoBottom': '\\uF4B3',\n 'ToDoLogoTop': '\\uF4B4',\n 'EditSolid12': '\\uF4B5',\n 'EditSolidMirrored12': '\\uF4B6',\n 'UneditableSolid12': '\\uF4B7',\n 'UneditableSolidMirrored12': '\\uF4B8',\n 'UneditableMirrored': '\\uF4B9',\n 'AdminALogo32': '\\uF4BA',\n 'AdminALogoFill32': '\\uF4BB',\n 'ToDoLogoInverse': '\\uF4BC'\n }\n };\n registerIcons(subset, options);\n}\n//# sourceMappingURL=fabric-icons-13.js.map","// Your use of the content in the files referenced here is subject to the terms of the license at https://aka.ms/fluentui-assets-license\nimport { registerIcons } from '@fluentui/style-utilities';\nexport function initializeIcons(baseUrl, options) {\n if (baseUrl === void 0) { baseUrl = ''; }\n var subset = {\n style: {\n MozOsxFontSmoothing: 'grayscale',\n WebkitFontSmoothing: 'antialiased',\n fontStyle: 'normal',\n fontWeight: 'normal',\n speak: 'none'\n },\n fontFace: {\n fontFamily: \"\\\"FabricMDL2Icons-14\\\"\",\n src: \"url('\".concat(baseUrl, \"fabric-icons-14-5cf58db8.woff') format('woff')\")\n },\n icons: {\n 'Snooze': '\\uF4BD',\n 'WaffleOffice365': '\\uF4E0',\n 'ImageSearch': '\\uF4E8',\n 'NewsSearch': '\\uF4E9',\n 'VideoSearch': '\\uF4EA',\n 'R': '\\uF4EB',\n 'FontColorA': '\\uF4EC',\n 'FontColorSwatch': '\\uF4ED',\n 'LightWeight': '\\uF4EE',\n 'NormalWeight': '\\uF4EF',\n 'SemiboldWeight': '\\uF4F0',\n 'GroupObject': '\\uF4F1',\n 'UngroupObject': '\\uF4F2',\n 'AlignHorizontalLeft': '\\uF4F3',\n 'AlignHorizontalCenter': '\\uF4F4',\n 'AlignHorizontalRight': '\\uF4F5',\n 'AlignVerticalTop': '\\uF4F6',\n 'AlignVerticalCenter': '\\uF4F7',\n 'AlignVerticalBottom': '\\uF4F8',\n 'HorizontalDistributeCenter': '\\uF4F9',\n 'VerticalDistributeCenter': '\\uF4FA',\n 'Ellipse': '\\uF4FB',\n 'Line': '\\uF4FC',\n 'Octagon': '\\uF4FD',\n 'Hexagon': '\\uF4FE',\n 'Pentagon': '\\uF4FF',\n 'RightTriangle': '\\uF500',\n 'HalfCircle': '\\uF501',\n 'QuarterCircle': '\\uF502',\n 'ThreeQuarterCircle': '\\uF503',\n '6PointStar': '\\uF504',\n '12PointStar': '\\uF505',\n 'ArrangeBringToFront': '\\uF506',\n 'ArrangeSendToBack': '\\uF507',\n 'ArrangeSendBackward': '\\uF508',\n 'ArrangeBringForward': '\\uF509',\n 'BorderDash': '\\uF50A',\n 'BorderDot': '\\uF50B',\n 'LineStyle': '\\uF50C',\n 'LineThickness': '\\uF50D',\n 'WindowEdit': '\\uF50E',\n 'HintText': '\\uF50F',\n 'MediaAdd': '\\uF510',\n 'AnchorLock': '\\uF511',\n 'AutoHeight': '\\uF512',\n 'ChartSeries': '\\uF513',\n 'ChartXAngle': '\\uF514',\n 'ChartYAngle': '\\uF515',\n 'Combobox': '\\uF516',\n 'LineSpacing': '\\uF517',\n 'Padding': '\\uF518',\n 'PaddingTop': '\\uF519',\n 'PaddingBottom': '\\uF51A',\n 'PaddingLeft': '\\uF51B',\n 'PaddingRight': '\\uF51C',\n 'NavigationFlipper': '\\uF51D',\n 'AlignJustify': '\\uF51E',\n 'TextOverflow': '\\uF51F',\n 'VisualsFolder': '\\uF520',\n 'VisualsStore': '\\uF521',\n 'PictureCenter': '\\uF522',\n 'PictureFill': '\\uF523',\n 'PicturePosition': '\\uF524',\n 'PictureStretch': '\\uF525',\n 'PictureTile': '\\uF526',\n 'Slider': '\\uF527',\n 'SliderHandleSize': '\\uF528',\n 'DefaultRatio': '\\uF529',\n 'NumberSequence': '\\uF52A',\n 'GUID': '\\uF52B',\n 'ReportAdd': '\\uF52C',\n 'DashboardAdd': '\\uF52D',\n 'MapPinSolid': '\\uF52E',\n 'WebPublish': '\\uF52F',\n 'PieSingleSolid': '\\uF530',\n 'BlockedSolid': '\\uF531',\n 'DrillDown': '\\uF532',\n 'DrillDownSolid': '\\uF533',\n 'DrillExpand': '\\uF534',\n 'DrillShow': '\\uF535',\n 'SpecialEvent': '\\uF536',\n 'OneDriveFolder16': '\\uF53B',\n 'FunctionalManagerDashboard': '\\uF542',\n 'BIDashboard': '\\uF543',\n 'CodeEdit': '\\uF544',\n 'RenewalCurrent': '\\uF545',\n 'RenewalFuture': '\\uF546',\n 'SplitObject': '\\uF547',\n 'BulkUpload': '\\uF548',\n 'DownloadDocument': '\\uF549',\n 'GreetingCard': '\\uF54B',\n 'Flower': '\\uF54E',\n 'WaitlistConfirm': '\\uF550',\n 'WaitlistConfirmMirrored': '\\uF551',\n 'LaptopSecure': '\\uF552',\n 'DragObject': '\\uF553',\n 'EntryView': '\\uF554',\n 'EntryDecline': '\\uF555',\n 'ContactCardSettings': '\\uF556',\n 'ContactCardSettingsMirrored': '\\uF557'\n }\n };\n registerIcons(subset, options);\n}\n//# sourceMappingURL=fabric-icons-14.js.map","// Your use of the content in the files referenced here is subject to the terms of the license at https://aka.ms/fluentui-assets-license\nimport { registerIcons } from '@fluentui/style-utilities';\nexport function initializeIcons(baseUrl, options) {\n if (baseUrl === void 0) { baseUrl = ''; }\n var subset = {\n style: {\n MozOsxFontSmoothing: 'grayscale',\n WebkitFontSmoothing: 'antialiased',\n fontStyle: 'normal',\n fontWeight: 'normal',\n speak: 'none'\n },\n fontFace: {\n fontFamily: \"\\\"FabricMDL2Icons-15\\\"\",\n src: \"url('\".concat(baseUrl, \"fabric-icons-15-3807251b.woff') format('woff')\")\n },\n icons: {\n 'CalendarSettings': '\\uF558',\n 'CalendarSettingsMirrored': '\\uF559',\n 'HardDriveLock': '\\uF55A',\n 'HardDriveUnlock': '\\uF55B',\n 'AccountManagement': '\\uF55C',\n 'ReportWarning': '\\uF569',\n 'TransitionPop': '\\uF5B2',\n 'TransitionPush': '\\uF5B3',\n 'TransitionEffect': '\\uF5B4',\n 'LookupEntities': '\\uF5B5',\n 'ExploreData': '\\uF5B6',\n 'AddBookmark': '\\uF5B7',\n 'SearchBookmark': '\\uF5B8',\n 'DrillThrough': '\\uF5B9',\n 'MasterDatabase': '\\uF5BA',\n 'CertifiedDatabase': '\\uF5BB',\n 'MaximumValue': '\\uF5BC',\n 'MinimumValue': '\\uF5BD',\n 'VisualStudioIDELogo32': '\\uF5D0',\n 'PasteAsText': '\\uF5D5',\n 'PasteAsCode': '\\uF5D6',\n 'BrowserTab': '\\uF5D7',\n 'BrowserTabScreenshot': '\\uF5D8',\n 'DesktopScreenshot': '\\uF5D9',\n 'FileYML': '\\uF5DA',\n 'ClipboardSolid': '\\uF5DC',\n 'FabricUserFolder': '\\uF5E5',\n 'FabricNetworkFolder': '\\uF5E6',\n 'BullseyeTarget': '\\uF5F0',\n 'AnalyticsView': '\\uF5F1',\n 'Video360Generic': '\\uF609',\n 'Untag': '\\uF60B',\n 'Leave': '\\uF627',\n 'Trending12': '\\uF62D',\n 'Blocked12': '\\uF62E',\n 'Warning12': '\\uF62F',\n 'CheckedOutByOther12': '\\uF630',\n 'CheckedOutByYou12': '\\uF631',\n 'CircleShapeSolid': '\\uF63C',\n 'SquareShapeSolid': '\\uF63D',\n 'TriangleShapeSolid': '\\uF63E',\n 'DropShapeSolid': '\\uF63F',\n 'RectangleShapeSolid': '\\uF640',\n 'ZoomToFit': '\\uF649',\n 'InsertColumnsLeft': '\\uF64A',\n 'InsertColumnsRight': '\\uF64B',\n 'InsertRowsAbove': '\\uF64C',\n 'InsertRowsBelow': '\\uF64D',\n 'DeleteColumns': '\\uF64E',\n 'DeleteRows': '\\uF64F',\n 'DeleteRowsMirrored': '\\uF650',\n 'DeleteTable': '\\uF651',\n 'AccountBrowser': '\\uF652',\n 'VersionControlPush': '\\uF664',\n 'StackedColumnChart2': '\\uF666',\n 'TripleColumnWide': '\\uF66E',\n 'QuadColumn': '\\uF66F',\n 'WhiteBoardApp16': '\\uF673',\n 'WhiteBoardApp32': '\\uF674',\n 'PinnedSolid': '\\uF676',\n 'InsertSignatureLine': '\\uF677',\n 'ArrangeByFrom': '\\uF678',\n 'Phishing': '\\uF679',\n 'CreateMailRule': '\\uF67A',\n 'PublishCourse': '\\uF699',\n 'DictionaryRemove': '\\uF69A',\n 'UserRemove': '\\uF69B',\n 'UserEvent': '\\uF69C',\n 'Encryption': '\\uF69D',\n 'PasswordField': '\\uF6AA',\n 'OpenInNewTab': '\\uF6AB',\n 'Hide3': '\\uF6AC',\n 'VerifiedBrandSolid': '\\uF6AD',\n 'MarkAsProtected': '\\uF6AE',\n 'AuthenticatorApp': '\\uF6B1',\n 'WebTemplate': '\\uF6B2',\n 'DefenderTVM': '\\uF6B3',\n 'MedalSolid': '\\uF6B9',\n 'D365TalentLearn': '\\uF6BB',\n 'D365TalentInsight': '\\uF6BC',\n 'D365TalentHRCore': '\\uF6BD',\n 'BacklogList': '\\uF6BF',\n 'ButtonControl': '\\uF6C0',\n 'TableGroup': '\\uF6D9',\n 'MountainClimbing': '\\uF6DB',\n 'TagUnknown': '\\uF6DF',\n 'TagUnknownMirror': '\\uF6E0',\n 'TagUnknown12': '\\uF6E1',\n 'TagUnknown12Mirror': '\\uF6E2',\n 'Link12': '\\uF6E3',\n 'Presentation': '\\uF6E4',\n 'Presentation12': '\\uF6E5',\n 'Lock12': '\\uF6E6',\n 'BuildDefinition': '\\uF6E9',\n 'ReleaseDefinition': '\\uF6EA',\n 'SaveTemplate': '\\uF6EC',\n 'UserGauge': '\\uF6ED',\n 'BlockedSiteSolid12': '\\uF70A',\n 'TagSolid': '\\uF70E',\n 'OfficeChat': '\\uF70F'\n }\n };\n registerIcons(subset, options);\n}\n//# sourceMappingURL=fabric-icons-15.js.map","// Your use of the content in the files referenced here is subject to the terms of the license at https://aka.ms/fluentui-assets-license\nimport { registerIcons } from '@fluentui/style-utilities';\nexport function initializeIcons(baseUrl, options) {\n if (baseUrl === void 0) { baseUrl = ''; }\n var subset = {\n style: {\n MozOsxFontSmoothing: 'grayscale',\n WebkitFontSmoothing: 'antialiased',\n fontStyle: 'normal',\n fontWeight: 'normal',\n speak: 'none'\n },\n fontFace: {\n fontFamily: \"\\\"FabricMDL2Icons-16\\\"\",\n src: \"url('\".concat(baseUrl, \"fabric-icons-16-9cf93f3b.woff') format('woff')\")\n },\n icons: {\n 'OfficeChatSolid': '\\uF710',\n 'MailSchedule': '\\uF72E',\n 'WarningSolid': '\\uF736',\n 'Blocked2Solid': '\\uF737',\n 'SkypeCircleArrow': '\\uF747',\n 'SkypeArrow': '\\uF748',\n 'SyncStatus': '\\uF751',\n 'SyncStatusSolid': '\\uF752',\n 'ProjectDocument': '\\uF759',\n 'ToDoLogoOutline': '\\uF75B',\n 'VisioOnlineLogoFill32': '\\uF75F',\n 'VisioOnlineLogo32': '\\uF760',\n 'VisioOnlineLogoCloud32': '\\uF761',\n 'VisioDiagramSync': '\\uF762',\n 'Event12': '\\uF763',\n 'EventDateMissed12': '\\uF764',\n 'UserOptional': '\\uF767',\n 'ResponsesMenu': '\\uF768',\n 'DoubleDownArrow': '\\uF769',\n 'DistributeDown': '\\uF76A',\n 'BookmarkReport': '\\uF76B',\n 'FilterSettings': '\\uF76C',\n 'GripperDotsVertical': '\\uF772',\n 'MailAttached': '\\uF774',\n 'AddIn': '\\uF775',\n 'LinkedDatabase': '\\uF779',\n 'TableLink': '\\uF77A',\n 'PromotedDatabase': '\\uF77D',\n 'BarChartVerticalFilter': '\\uF77E',\n 'BarChartVerticalFilterSolid': '\\uF77F',\n 'MicOff2': '\\uF781',\n 'MicrosoftTranslatorLogo': '\\uF782',\n 'ShowTimeAs': '\\uF787',\n 'FileRequest': '\\uF789',\n 'WorkItemAlert': '\\uF78F',\n 'PowerBILogo16': '\\uF790',\n 'PowerBILogoBackplate16': '\\uF791',\n 'BulletedListText': '\\uF792',\n 'BulletedListBullet': '\\uF793',\n 'BulletedListTextMirrored': '\\uF794',\n 'BulletedListBulletMirrored': '\\uF795',\n 'NumberedListText': '\\uF796',\n 'NumberedListNumber': '\\uF797',\n 'NumberedListTextMirrored': '\\uF798',\n 'NumberedListNumberMirrored': '\\uF799',\n 'RemoveLinkChain': '\\uF79A',\n 'RemoveLinkX': '\\uF79B',\n 'FabricTextHighlight': '\\uF79C',\n 'ClearFormattingA': '\\uF79D',\n 'ClearFormattingEraser': '\\uF79E',\n 'Photo2Fill': '\\uF79F',\n 'IncreaseIndentText': '\\uF7A0',\n 'IncreaseIndentArrow': '\\uF7A1',\n 'DecreaseIndentText': '\\uF7A2',\n 'DecreaseIndentArrow': '\\uF7A3',\n 'IncreaseIndentTextMirrored': '\\uF7A4',\n 'IncreaseIndentArrowMirrored': '\\uF7A5',\n 'DecreaseIndentTextMirrored': '\\uF7A6',\n 'DecreaseIndentArrowMirrored': '\\uF7A7',\n 'CheckListText': '\\uF7A8',\n 'CheckListCheck': '\\uF7A9',\n 'CheckListTextMirrored': '\\uF7AA',\n 'CheckListCheckMirrored': '\\uF7AB',\n 'NumberSymbol': '\\uF7AC',\n 'Coupon': '\\uF7BC',\n 'VerifiedBrand': '\\uF7BD',\n 'ReleaseGate': '\\uF7BE',\n 'ReleaseGateCheck': '\\uF7BF',\n 'ReleaseGateError': '\\uF7C0',\n 'M365InvoicingLogo': '\\uF7C1',\n 'RemoveFromShoppingList': '\\uF7D5',\n 'ShieldAlert': '\\uF7D7',\n 'FabricTextHighlightComposite': '\\uF7DA',\n 'Dataflows': '\\uF7DD',\n 'GenericScanFilled': '\\uF7DE',\n 'DiagnosticDataBarTooltip': '\\uF7DF',\n 'SaveToMobile': '\\uF7E0',\n 'Orientation2': '\\uF7E1',\n 'ScreenCast': '\\uF7E2',\n 'ShowGrid': '\\uF7E3',\n 'SnapToGrid': '\\uF7E4',\n 'ContactList': '\\uF7E5',\n 'NewMail': '\\uF7EA',\n 'EyeShadow': '\\uF7EB',\n 'FabricFolderConfirm': '\\uF7FF',\n 'InformationBarriers': '\\uF803',\n 'CommentActive': '\\uF804',\n 'ColumnVerticalSectionEdit': '\\uF806',\n 'WavingHand': '\\uF807',\n 'ShakeDevice': '\\uF80A',\n 'SmartGlassRemote': '\\uF80B',\n 'Rotate90Clockwise': '\\uF80D',\n 'Rotate90CounterClockwise': '\\uF80E',\n 'CampaignTemplate': '\\uF811',\n 'ChartTemplate': '\\uF812',\n 'PageListFilter': '\\uF813',\n 'SecondaryNav': '\\uF814',\n 'ColumnVerticalSection': '\\uF81E',\n 'SkypeCircleSlash': '\\uF825',\n 'SkypeSlash': '\\uF826'\n }\n };\n registerIcons(subset, options);\n}\n//# sourceMappingURL=fabric-icons-16.js.map","// Your use of the content in the files referenced here is subject to the terms of the license at https://aka.ms/fluentui-assets-license\nimport { registerIcons } from '@fluentui/style-utilities';\nexport function initializeIcons(baseUrl, options) {\n if (baseUrl === void 0) { baseUrl = ''; }\n var subset = {\n style: {\n MozOsxFontSmoothing: 'grayscale',\n WebkitFontSmoothing: 'antialiased',\n fontStyle: 'normal',\n fontWeight: 'normal',\n speak: 'none'\n },\n fontFace: {\n fontFamily: \"\\\"FabricMDL2Icons-17\\\"\",\n src: \"url('\".concat(baseUrl, \"fabric-icons-17-0c4ed701.woff') format('woff')\")\n },\n icons: {\n 'CustomizeToolbar': '\\uF828',\n 'DuplicateRow': '\\uF82A',\n 'RemoveFromTrash': '\\uF82B',\n 'MailOptions': '\\uF82C',\n 'Childof': '\\uF82D',\n 'Footer': '\\uF82E',\n 'Header': '\\uF82F',\n 'BarChartVerticalFill': '\\uF830',\n 'StackedColumnChart2Fill': '\\uF831',\n 'PlainText': '\\uF834',\n 'AccessibiltyChecker': '\\uF835',\n 'DatabaseSync': '\\uF842',\n 'ReservationOrders': '\\uF845',\n 'TabOneColumn': '\\uF849',\n 'TabTwoColumn': '\\uF84A',\n 'TabThreeColumn': '\\uF84B',\n 'BulletedTreeList': '\\uF84C',\n 'MicrosoftTranslatorLogoGreen': '\\uF852',\n 'MicrosoftTranslatorLogoBlue': '\\uF853',\n 'InternalInvestigation': '\\uF854',\n 'AddReaction': '\\uF85D',\n 'ContactHeart': '\\uF862',\n 'VisuallyImpaired': '\\uF866',\n 'EventToDoLogo': '\\uF869',\n 'Variable2': '\\uF86D',\n 'ModelingView': '\\uF871',\n 'DisconnectVirtualMachine': '\\uF873',\n 'ReportLock': '\\uF875',\n 'Uneditable2': '\\uF876',\n 'Uneditable2Mirrored': '\\uF877',\n 'BarChartVerticalEdit': '\\uF89D',\n 'GlobalNavButtonActive': '\\uF89F',\n 'PollResults': '\\uF8A0',\n 'Rerun': '\\uF8A1',\n 'QandA': '\\uF8A2',\n 'QandAMirror': '\\uF8A3',\n 'BookAnswers': '\\uF8A4',\n 'AlertSettings': '\\uF8B6',\n 'TrimStart': '\\uF8BB',\n 'TrimEnd': '\\uF8BC',\n 'TableComputed': '\\uF8F5',\n 'DecreaseIndentLegacy': '\\uE290',\n 'IncreaseIndentLegacy': '\\uE291',\n 'SizeLegacy': '\\uE2B2'\n }\n };\n registerIcons(subset, options);\n}\n//# sourceMappingURL=fabric-icons-17.js.map","import { registerIconAlias } from '@fluentui/style-utilities';\nexport var registerIconAliases = function () {\n registerIconAlias('trash', 'delete');\n registerIconAlias('onedrive', 'onedrivelogo');\n registerIconAlias('alertsolid12', 'eventdatemissed12');\n registerIconAlias('sixpointstar', '6pointstar');\n registerIconAlias('twelvepointstar', '12pointstar');\n registerIconAlias('toggleon', 'toggleleft');\n registerIconAlias('toggleoff', 'toggleright');\n};\nexport default registerIconAliases;\n//# sourceMappingURL=iconAliases.js.map","// Do not modify this file; it is generated as part of publish.\n// The checked in version is a placeholder only and will not be updated.\nimport { setVersion } from '@fluentui/set-version';\nsetVersion('@fluentui/font-icons-mdl2', '8.5.58');\n//# sourceMappingURL=version.js.map","import { initializeIcons as i } from './fabric-icons';\nimport { initializeIcons as i0 } from './fabric-icons-0';\nimport { initializeIcons as i1 } from './fabric-icons-1';\nimport { initializeIcons as i2 } from './fabric-icons-2';\nimport { initializeIcons as i3 } from './fabric-icons-3';\nimport { initializeIcons as i4 } from './fabric-icons-4';\nimport { initializeIcons as i5 } from './fabric-icons-5';\nimport { initializeIcons as i6 } from './fabric-icons-6';\nimport { initializeIcons as i7 } from './fabric-icons-7';\nimport { initializeIcons as i8 } from './fabric-icons-8';\nimport { initializeIcons as i9 } from './fabric-icons-9';\nimport { initializeIcons as i10 } from './fabric-icons-10';\nimport { initializeIcons as i11 } from './fabric-icons-11';\nimport { initializeIcons as i12 } from './fabric-icons-12';\nimport { initializeIcons as i13 } from './fabric-icons-13';\nimport { initializeIcons as i14 } from './fabric-icons-14';\nimport { initializeIcons as i15 } from './fabric-icons-15';\nimport { initializeIcons as i16 } from './fabric-icons-16';\nimport { initializeIcons as i17 } from './fabric-icons-17';\nimport { FLUENT_CDN_BASE_URL } from '@fluentui/style-utilities';\nimport { registerIconAliases } from './iconAliases';\nimport { getWindow } from '@fluentui/utilities';\nvar DEFAULT_BASE_URL = \"\".concat(FLUENT_CDN_BASE_URL, \"/assets/icons/\");\nvar win = getWindow();\nexport function initializeIcons(baseUrl, options) {\n var _a, _b;\n if (baseUrl === void 0) { baseUrl = ((_a = win === null || win === void 0 ? void 0 : win.FabricConfig) === null || _a === void 0 ? void 0 : _a.iconBaseUrl) || ((_b = win === null || win === void 0 ? void 0 : win.FabricConfig) === null || _b === void 0 ? void 0 : _b.fontBaseUrl) || DEFAULT_BASE_URL; }\n [i, i0, i1, i2, i3, i4, i5, i6, i7, i8, i9, i10, i11, i12, i13, i14, i15, i16, i17].forEach(function (initialize) { return initialize(baseUrl, options); });\n registerIconAliases();\n}\n/* eslint-enable @typescript-eslint/no-deprecated */\nimport './version';\n//# sourceMappingURL=index.js.map","import { __assign, __spreadArray } from \"tslib\";\nimport * as React from 'react';\nimport { concatStyleSets } from '@fluentui/style-utilities';\nimport { Customizations, CustomizerContext } from '@fluentui/utilities';\nimport { createFactory } from './slots';\nimport { assign } from './utilities';\n/**\n * Assembles a higher order component based on the following: styles, theme, view, and state.\n * Imposes a separation of concern and centralizes styling processing to increase ease of use and robustness\n * in how components use and apply styling and theming.\n *\n * Automatically merges and applies themes and styles with theme / styleprops having the highest priority.\n * State component, if provided, is passed in props for processing. Props from state / user are automatically processed\n * and styled before finally being passed to view.\n *\n * State components should contain all stateful behavior and should not generate any JSX, but rather simply call\n * the view prop.\n *\n * Views should simply be stateless pure functions that receive all props needed for rendering their output.\n *\n * State component is optional. If state is not provided, created component is essentially a functional\n * stateless component.\n *\n * @param options - component Component options. See IComponentOptions for more detail.\n */\nexport function createComponent(view, options) {\n if (options === void 0) { options = {}; }\n var _a = options.factoryOptions, factoryOptions = _a === void 0 ? {} : _a;\n var defaultProp = factoryOptions.defaultProp;\n var ResultComponent = function (componentProps) {\n var settings = _getCustomizations(options.displayName, React.useContext(CustomizerContext), options.fields);\n var stateReducer = options.state;\n if (stateReducer) {\n // Don't assume state will return all props, so spread useState result over component props.\n componentProps = __assign(__assign({}, componentProps), stateReducer(componentProps));\n }\n var theme = componentProps.theme || settings.theme;\n var tokens = _resolveTokens(componentProps, theme, options.tokens, settings.tokens, componentProps.tokens);\n var styles = _resolveStyles(componentProps, theme, tokens, options.styles, settings.styles, componentProps.styles);\n var viewProps = __assign(__assign({}, componentProps), { styles: styles, tokens: tokens, _defaultStyles: styles, theme: theme });\n return view(viewProps);\n };\n ResultComponent.displayName = options.displayName || view.name;\n // If a shorthand prop is defined, create a factory for the component.\n // TODO: This shouldn't be a concern of createComponent.. factoryOptions should just be forwarded.\n // Need to weigh creating default factories on component creation vs. memoizing them on use in slots.tsx.\n if (defaultProp) {\n ResultComponent.create = createFactory(ResultComponent, { defaultProp: defaultProp });\n }\n assign(ResultComponent, options.statics);\n // Later versions of TypeSript should allow us to merge objects in a type safe way and avoid this cast.\n return ResultComponent;\n}\n/**\n * Resolve all styles functions with both props and tokens and flatten results along with all styles objects.\n */\nfunction _resolveStyles(props, theme, tokens) {\n var allStyles = [];\n for (var _i = 3; _i < arguments.length; _i++) {\n allStyles[_i - 3] = arguments[_i];\n }\n return concatStyleSets.apply(void 0, allStyles.map(function (styles) {\n return typeof styles === 'function' ? styles(props, theme, tokens) : styles;\n }));\n}\n/**\n * Resolve all tokens functions with props flatten results along with all tokens objects.\n */\nfunction _resolveTokens(props, theme) {\n var allTokens = [];\n for (var _i = 2; _i < arguments.length; _i++) {\n allTokens[_i - 2] = arguments[_i];\n }\n var tokens = {};\n for (var _a = 0, allTokens_1 = allTokens; _a < allTokens_1.length; _a++) {\n var currentTokens = allTokens_1[_a];\n if (currentTokens) {\n // TODO: why is this cast needed? TS seems to think there is a (TToken | Function) union from somewhere.\n currentTokens =\n typeof currentTokens === 'function'\n ? currentTokens(props, theme)\n : currentTokens;\n if (Array.isArray(currentTokens)) {\n currentTokens = _resolveTokens.apply(void 0, __spreadArray([props, theme], currentTokens, false));\n }\n assign(tokens, currentTokens);\n }\n }\n return tokens;\n}\n/**\n * Helper function for calling Customizations.getSettings falling back to default fields.\n *\n * @param displayName Displayable name for component.\n * @param context React context passed to component containing contextual settings.\n * @param fields Optional list of properties to grab from global store and context.\n */\nfunction _getCustomizations(displayName, context, fields) {\n // TODO: do we want field props? should fields be part of IComponent and used here?\n // TODO: should we centrally define DefaultFields? (not exported from styling)\n // TODO: tie this array to ICustomizationProps, such that each array element is keyof ICustomizationProps\n var DefaultFields = ['theme', 'styles', 'tokens'];\n return Customizations.getSettings(fields || DefaultFields, displayName, context.customizations);\n}\n//# sourceMappingURL=createComponent.js.map","import { __assign, __spreadArray } from \"tslib\";\nimport * as React from 'react';\nimport { mergeCss } from '@fluentui/merge-styles';\nimport { getRTL, memoizeFunction } from '@fluentui/utilities';\nimport { assign } from './utilities';\n/**\n * This function is required for any module that uses slots.\n *\n * This function is a slot resolver that automatically evaluates slot functions to generate React elements.\n * A byproduct of this resolver is that it removes slots from the React hierarchy by bypassing React.createElement.\n *\n * To use this function on a per-file basis, use the jsx directive targeting withSlots.\n * This directive must be the FIRST LINE in the file to work correctly.\n * Usage of this pragma also requires withSlots import statement.\n *\n * See React.createElement\n */\n// Can't use typeof on React.createElement since it's overloaded. Approximate createElement's signature for now\n// and widen as needed.\nexport function withSlots(type, props) {\n var children = [];\n for (var _i = 2; _i < arguments.length; _i++) {\n children[_i - 2] = arguments[_i];\n }\n var slotType = type;\n if (slotType.isSlot) {\n // Since we are bypassing createElement, use React.Children.toArray to make sure children are\n // properly assigned keys.\n // TODO: should this be mutating? does React mutate children subprop with createElement?\n // TODO: will toArray clobber existing keys?\n // TODO: React generates warnings because it doesn't detect hidden member _store that is set in createElement.\n // Even children passed to createElement without keys don't generate this warning.\n // Is there a better way to prevent slots from appearing in hierarchy? toArray doesn't address root issue.\n children = React.Children.toArray(children);\n // TODO: There is something weird going on here with children embedded in props vs. rest args.\n // Comment out these lines to see. Make sure this function is doing the right things.\n if (children.length === 0) {\n return slotType(props);\n }\n return slotType(__assign(__assign({}, props), { children: children }));\n }\n else {\n // TODO: Are there some cases where children should NOT be spread? Also, spreading reraises perf question.\n // Children had to be spread to avoid breaking KeytipData in Toggle.view:\n // react-dom.development.js:18931 Uncaught TypeError: children is not a function\n // Without spread, function child is a child array of one element\n // TODO: is there a reason this can't be:\n // return React.createElement.apply(this, arguments);\n return React.createElement.apply(React, __spreadArray([type, props], children, false));\n }\n}\n/**\n * This function creates factories that render ouput depending on the user ISlotProp props passed in.\n * @param DefaultComponent - Base component to render when not overridden by user props.\n * @param options - Factory options, including defaultProp value for shorthand prop mapping.\n * @returns ISlotFactory function used for rendering slots.\n */\nexport function createFactory(DefaultComponent, options) {\n if (options === void 0) { options = {}; }\n var _a = options.defaultProp, defaultProp = _a === void 0 ? 'children' : _a;\n var result = function (componentProps, userProps, userSlotOptions, defaultStyles, theme) {\n // If they passed in raw JSX, just return that.\n if (React.isValidElement(userProps)) {\n return userProps;\n }\n var flattenedUserProps = _translateShorthand(defaultProp, userProps);\n var finalProps = _constructFinalProps(defaultStyles, theme, componentProps, flattenedUserProps);\n if (userSlotOptions) {\n if (userSlotOptions.component) {\n // TODO: Remove cast if possible. This cast is needed because TS errors on the intrinsic portion of ReactType.\n // return ;\n var UserComponent = userSlotOptions.component;\n return React.createElement(UserComponent, __assign({}, finalProps));\n }\n if (userSlotOptions.render) {\n return userSlotOptions.render(finalProps, DefaultComponent);\n }\n }\n return React.createElement(DefaultComponent, __assign({}, finalProps));\n };\n return result;\n}\n/**\n * Default factory for components without explicit factories.\n */\nvar defaultFactory = memoizeFunction(function (type) { return createFactory(type); });\n/**\n * This function generates slots that can be used in JSX given a definition of slots and their corresponding types.\n * @param userProps - Props as pass to component.\n * @param slots - Slot definition object defining the default slot component for each slot.\n * @returns A set of created slots that components can render in JSX.\n */\nexport function getSlots(userProps, slots) {\n var result = {};\n // userProps already has default props mixed in by createComponent. Recast here to gain typing for this function.\n var mixedProps = userProps;\n var _loop_1 = function (name_1) {\n if (slots.hasOwnProperty(name_1)) {\n // This closure method requires the use of withSlots to prevent unnecessary rerenders. This is because React\n // detects each closure as a different component (since it is a new instance) from the previous one and then\n // forces a rerender of the entire slot subtree. For now, the only way to avoid this is to use withSlots, which\n // bypasses the call to React.createElement.\n var slot = function (componentProps) {\n var args = [];\n for (var _i = 1; _i < arguments.length; _i++) {\n args[_i - 1] = arguments[_i];\n }\n if (args.length > 0) {\n // If React.createElement is being incorrectly used with slots, there will be additional arguments.\n // We can detect these additional arguments and error on their presence.\n throw new Error('Any module using getSlots must use withSlots. Please see withSlots javadoc for more info.');\n }\n // TODO: having TS infer types here seems to cause infinite loop.\n // use explicit types or casting to preserve typing if possible.\n // TODO: this should be a lookup on TProps property instead of being TProps directly, which is probably\n // causing the infinite loop\n return _renderSlot(slots[name_1], \n // TODO: this cast to any is hiding a relationship issue between the first two args\n componentProps, mixedProps[name_1], mixedProps.slots && mixedProps.slots[name_1], \n // _defaultStyles should always be present, but a check for existence is added to make view tests\n // easier to use.\n mixedProps._defaultStyles && mixedProps._defaultStyles[name_1], mixedProps.theme);\n };\n slot.isSlot = true;\n result[name_1] = slot;\n }\n };\n for (var name_1 in slots) {\n _loop_1(name_1);\n }\n return result;\n}\n/**\n * Helper function that translates shorthand as needed.\n * @param defaultProp\n * @param slotProps\n */\nfunction _translateShorthand(defaultProp, slotProps) {\n var _a;\n var transformedProps;\n if (typeof slotProps === 'string' || typeof slotProps === 'number' || typeof slotProps === 'boolean') {\n transformedProps = (_a = {},\n _a[defaultProp] = slotProps,\n _a);\n }\n else {\n transformedProps = slotProps;\n }\n return transformedProps;\n}\n/**\n * Helper function that constructs final styles and props given a series of props ordered by increasing priority.\n */\nfunction _constructFinalProps(defaultStyles, theme) {\n var allProps = [];\n for (var _i = 2; _i < arguments.length; _i++) {\n allProps[_i - 2] = arguments[_i];\n }\n var finalProps = {};\n var classNames = [];\n for (var _a = 0, allProps_1 = allProps; _a < allProps_1.length; _a++) {\n var props = allProps_1[_a];\n classNames.push(props && props.className);\n assign(finalProps, props);\n }\n finalProps.className = mergeCss([defaultStyles, classNames], { rtl: getRTL(theme) });\n return finalProps;\n}\n/**\n * Render a slot given component and user props. Uses component factory if available, otherwise falls back\n * to default factory.\n * @param ComponentType Factory component type.\n * @param componentProps The properties passed into slot from within the component.\n * @param userProps The user properties passed in from outside of the component.\n */\nfunction _renderSlot(ComponentType, componentProps, userProps, slotOptions, defaultStyles, theme) {\n if (ComponentType.create !== undefined) {\n return ComponentType.create(componentProps, userProps, slotOptions, defaultStyles);\n }\n else {\n // TODO: need to resolve typing / generic issues passing through memoizeFunction. for now, cast to 'unknown'\n return defaultFactory(ComponentType)(componentProps, userProps, slotOptions, defaultStyles, theme);\n }\n}\n//# sourceMappingURL=slots.js.map","import { __assign } from 'tslib';\nexport var assign = __assign;\n//# sourceMappingURL=utilities.js.map","export var GLOBAL_STYLESHEET_KEY = '__global__';\nexport var SHADOW_DOM_STYLESHEET_SETTING = '__shadow_dom_stylesheet__';\nexport var DEFAULT_SHADOW_CONFIG = {\n stylesheetKey: GLOBAL_STYLESHEET_KEY,\n inShadow: false,\n window: undefined,\n __isShadowConfig__: true,\n};\nexport var makeShadowConfig = function (stylesheetKey, inShadow, window) {\n return {\n stylesheetKey: stylesheetKey,\n inShadow: inShadow,\n window: window,\n __isShadowConfig__: true,\n };\n};\nexport var isShadowConfig = function (value) {\n if (!(value && isRecord(value))) {\n return false;\n }\n return value.__isShadowConfig__ === true;\n};\nfunction isRecord(value) {\n return value !== null && typeof value === 'object' && !Array.isArray(value);\n}\n//# sourceMappingURL=shadowConfig.js.map","import { DEFAULT_SHADOW_CONFIG } from './shadowConfig';\n/**\n * Sets the current RTL value.\n */\nexport function setRTL(isRTL) {\n if (_rtl !== isRTL) {\n _rtl = isRTL;\n }\n}\n/**\n * Gets the current RTL value.\n */\nexport function getRTL() {\n if (_rtl === undefined) {\n _rtl =\n // eslint-disable-next-line no-restricted-globals\n typeof document !== 'undefined' &&\n // eslint-disable-next-line no-restricted-globals\n !!document.documentElement &&\n // eslint-disable-next-line no-restricted-globals\n document.documentElement.getAttribute('dir') === 'rtl';\n }\n return _rtl;\n}\n// This has been split into 2 lines because it was working in Fabric due to the code being transpiled to es5, so this\n// was converted to var while not working in Fluent that uses babel to transpile the code to be es6-like. Splitting the\n// logic into two lines, however, allows it to work in both scenarios.\nvar _rtl;\n_rtl = getRTL();\nexport function getStyleOptions() {\n return {\n rtl: getRTL(),\n shadowConfig: DEFAULT_SHADOW_CONFIG,\n };\n}\n//# sourceMappingURL=StyleOptionsState.js.map","import { __assign } from \"tslib\";\nimport { GLOBAL_STYLESHEET_KEY, SHADOW_DOM_STYLESHEET_SETTING } from './shadowConfig';\nexport var InjectionMode = {\n /**\n * Avoids style injection, use getRules() to read the styles.\n */\n none: 0,\n /**\n * Inserts rules using the insertRule api.\n */\n insertNode: 1,\n /**\n * Appends rules using appendChild.\n */\n appendChild: 2,\n};\nexport var STYLESHEET_SETTING = '__stylesheet__';\n/**\n * MSIE 11 doesn't cascade styles based on DOM ordering, but rather on the order that each style node\n * is created. As such, to maintain consistent priority, IE11 should reuse a single style node.\n */\nvar REUSE_STYLE_NODE = typeof navigator !== 'undefined' && /rv:11.0/.test(navigator.userAgent);\nvar _global = {};\n// Grab window.\ntry {\n // Why the cast?\n // if compiled/type checked in same program with `@fluentui/font-icons-mdl2` which extends `Window` on global\n // ( check packages/font-icons-mdl2/src/index.ts ) the definitions don't match! Thus the need of this extra assertion\n _global = (window || {});\n}\ncatch (_a) {\n /* leave as blank object */\n}\nvar _stylesheet;\n/**\n * Represents the state of styles registered in the page. Abstracts\n * the surface for adding styles to the stylesheet, exposes helpers\n * for reading the styles registered in server rendered scenarios.\n *\n * @public\n */\nvar Stylesheet = /** @class */ (function () {\n function Stylesheet(config, serializedStylesheet) {\n var _a, _b, _c, _d, _e, _f;\n this._rules = [];\n this._preservedRules = [];\n this._counter = 0;\n this._keyToClassName = {};\n this._onInsertRuleCallbacks = [];\n this._onResetCallbacks = [];\n this._classNameToArgs = {};\n // If there is no document we won't have an element to inject into.\n this._config = __assign({ injectionMode: typeof document === 'undefined' ? InjectionMode.none : InjectionMode.insertNode, defaultPrefix: 'css', namespace: undefined, cspSettings: undefined }, config);\n this._classNameToArgs = (_a = serializedStylesheet === null || serializedStylesheet === void 0 ? void 0 : serializedStylesheet.classNameToArgs) !== null && _a !== void 0 ? _a : this._classNameToArgs;\n this._counter = (_b = serializedStylesheet === null || serializedStylesheet === void 0 ? void 0 : serializedStylesheet.counter) !== null && _b !== void 0 ? _b : this._counter;\n this._keyToClassName = (_d = (_c = this._config.classNameCache) !== null && _c !== void 0 ? _c : serializedStylesheet === null || serializedStylesheet === void 0 ? void 0 : serializedStylesheet.keyToClassName) !== null && _d !== void 0 ? _d : this._keyToClassName;\n this._preservedRules = (_e = serializedStylesheet === null || serializedStylesheet === void 0 ? void 0 : serializedStylesheet.preservedRules) !== null && _e !== void 0 ? _e : this._preservedRules;\n this._rules = (_f = serializedStylesheet === null || serializedStylesheet === void 0 ? void 0 : serializedStylesheet.rules) !== null && _f !== void 0 ? _f : this._rules;\n }\n /**\n * Gets the singleton instance.\n */\n Stylesheet.getInstance = function (shadowConfig) {\n _stylesheet = _global[STYLESHEET_SETTING];\n if (_global[SHADOW_DOM_STYLESHEET_SETTING]) {\n return _global[SHADOW_DOM_STYLESHEET_SETTING].getInstance(shadowConfig);\n }\n if (!_stylesheet || (_stylesheet._lastStyleElement && _stylesheet._lastStyleElement.ownerDocument !== document)) {\n var fabricConfig = (_global === null || _global === void 0 ? void 0 : _global.FabricConfig) || {};\n var stylesheet = new Stylesheet(fabricConfig.mergeStyles, fabricConfig.serializedStylesheet);\n _stylesheet = stylesheet;\n _global[STYLESHEET_SETTING] = stylesheet;\n }\n return _stylesheet;\n };\n /**\n * Serializes the Stylesheet instance into a format which allows rehydration on creation.\n * @returns string representation of `ISerializedStylesheet` interface.\n */\n Stylesheet.prototype.serialize = function () {\n return JSON.stringify({\n classNameToArgs: this._classNameToArgs,\n counter: this._counter,\n keyToClassName: this._keyToClassName,\n preservedRules: this._preservedRules,\n rules: this._rules,\n });\n };\n /**\n * Configures the stylesheet.\n */\n Stylesheet.prototype.setConfig = function (config) {\n this._config = __assign(__assign({}, this._config), config);\n };\n /**\n * Configures a reset callback.\n *\n * @param callback - A callback which will be called when the Stylesheet is reset.\n * @returns function which when called un-registers provided callback.\n */\n Stylesheet.prototype.onReset = function (callback) {\n var _this = this;\n this._onResetCallbacks.push(callback);\n return function () {\n _this._onResetCallbacks = _this._onResetCallbacks.filter(function (cb) { return cb !== callback; });\n };\n };\n /**\n * Configures an insert rule callback.\n *\n * @param callback - A callback which will be called when a rule is inserted.\n * @returns function which when called un-registers provided callback.\n */\n Stylesheet.prototype.onInsertRule = function (callback) {\n var _this = this;\n this._onInsertRuleCallbacks.push(callback);\n return function () {\n _this._onInsertRuleCallbacks = _this._onInsertRuleCallbacks.filter(function (cb) { return cb !== callback; });\n };\n };\n /**\n * Generates a unique classname.\n *\n * @param displayName - Optional value to use as a prefix.\n */\n Stylesheet.prototype.getClassName = function (displayName) {\n var namespace = this._config.namespace;\n var prefix = displayName || this._config.defaultPrefix;\n return \"\".concat(namespace ? namespace + '-' : '').concat(prefix, \"-\").concat(this._counter++);\n };\n /**\n * Used internally to cache information about a class which was\n * registered with the stylesheet.\n */\n Stylesheet.prototype.cacheClassName = function (className, key, args, rules) {\n this._keyToClassName[this._getCacheKey(key)] = className;\n this._classNameToArgs[className] = {\n args: args,\n rules: rules,\n };\n };\n /**\n * Gets the appropriate classname given a key which was previously\n * registered using cacheClassName.\n */\n Stylesheet.prototype.classNameFromKey = function (key) {\n return this._keyToClassName[this._getCacheKey(key)];\n };\n /**\n * Gets all classnames cache with the stylesheet.\n */\n Stylesheet.prototype.getClassNameCache = function () {\n return this._keyToClassName;\n };\n /**\n * Gets the arguments associated with a given classname which was\n * previously registered using cacheClassName.\n */\n Stylesheet.prototype.argsFromClassName = function (className) {\n var entry = this._classNameToArgs[className];\n return entry && entry.args;\n };\n /**\n * Gets the rules associated with a given classname which was\n * previously registered using cacheClassName.\n */\n Stylesheet.prototype.insertedRulesFromClassName = function (className) {\n var entry = this._classNameToArgs[className];\n return entry && entry.rules;\n };\n /**\n * Inserts a css rule into the stylesheet.\n * @param preserve - Preserves the rule beyond a reset boundary.\n */\n Stylesheet.prototype.insertRule = function (rule, preserve, stylesheetKey) {\n if (stylesheetKey === void 0) { stylesheetKey = GLOBAL_STYLESHEET_KEY; }\n var injectionMode = this._config.injectionMode;\n var element = injectionMode !== InjectionMode.none ? this._getStyleElement() : undefined;\n if (preserve) {\n this._preservedRules.push(rule);\n }\n if (element) {\n switch (injectionMode) {\n case InjectionMode.insertNode:\n this._insertRuleIntoSheet(element.sheet, rule);\n break;\n case InjectionMode.appendChild:\n element.appendChild(document.createTextNode(rule));\n break;\n }\n }\n else {\n this._rules.push(rule);\n }\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n if (this._config.onInsertRule) {\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n this._config.onInsertRule(rule);\n }\n this._onInsertRuleCallbacks.forEach(function (callback) {\n return callback({ key: stylesheetKey, sheet: (element ? element.sheet : undefined), rule: rule });\n });\n };\n /**\n * Gets all rules registered with the stylesheet; only valid when\n * using InsertionMode.none.\n */\n Stylesheet.prototype.getRules = function (includePreservedRules) {\n return (includePreservedRules ? this._preservedRules.join('') : '') + this._rules.join('');\n };\n /**\n * Resets the internal state of the stylesheet. Only used in server\n * rendered scenarios where we're using InsertionMode.none.\n */\n Stylesheet.prototype.reset = function () {\n this._rules = [];\n this._counter = 0;\n this._classNameToArgs = {};\n this._keyToClassName = {};\n this._onResetCallbacks.forEach(function (callback) { return callback(); });\n };\n // Forces the regeneration of incoming styles without totally resetting the stylesheet.\n Stylesheet.prototype.resetKeys = function () {\n this._keyToClassName = {};\n };\n Stylesheet.prototype._createStyleElement = function () {\n var _a;\n var doc = ((_a = this._config.window) === null || _a === void 0 ? void 0 : _a.document) || document;\n var head = doc.head;\n var styleElement = doc.createElement('style');\n var nodeToInsertBefore = null;\n styleElement.setAttribute('data-merge-styles', 'true');\n var cspSettings = this._config.cspSettings;\n if (cspSettings) {\n if (cspSettings.nonce) {\n styleElement.setAttribute('nonce', cspSettings.nonce);\n }\n }\n if (this._lastStyleElement) {\n // If the `nextElementSibling` is null, then the insertBefore will act as a regular append.\n // https://developer.mozilla.org/en-US/docs/Web/API/Node/insertBefore#Syntax\n nodeToInsertBefore = this._lastStyleElement.nextElementSibling;\n }\n else {\n var placeholderStyleTag = this._findPlaceholderStyleTag();\n if (placeholderStyleTag) {\n nodeToInsertBefore = placeholderStyleTag.nextElementSibling;\n }\n else {\n nodeToInsertBefore = head.childNodes[0];\n }\n }\n head.insertBefore(styleElement, head.contains(nodeToInsertBefore) ? nodeToInsertBefore : null);\n this._lastStyleElement = styleElement;\n return styleElement;\n };\n Stylesheet.prototype._insertRuleIntoSheet = function (sheet, rule) {\n if (!sheet) {\n return false;\n }\n try {\n sheet.insertRule(rule, sheet.cssRules.length);\n return true;\n }\n catch (e) {\n // The browser will throw exceptions on unsupported rules (such as a moz prefix in webkit.)\n // We need to swallow the exceptions for this scenario, otherwise we'd need to filter\n // which could be slower and bulkier.\n }\n return false;\n };\n Stylesheet.prototype._getCacheKey = function (key) {\n return key;\n };\n Stylesheet.prototype._getStyleElement = function () {\n var _this = this;\n if (!this._styleElement) {\n this._styleElement = this._createStyleElement();\n if (!REUSE_STYLE_NODE) {\n // Reset the style element on the next frame.\n var win = this._config.window || window;\n win.requestAnimationFrame(function () {\n _this._styleElement = undefined;\n });\n }\n }\n return this._styleElement;\n };\n Stylesheet.prototype._findPlaceholderStyleTag = function () {\n var head = document.head;\n if (head) {\n return head.querySelector('style[data-merge-styles]');\n }\n return null;\n };\n return Stylesheet;\n}());\nexport { Stylesheet };\n//# sourceMappingURL=Stylesheet.js.map","var _vendorSettings;\nexport function getVendorSettings() {\n var _a;\n if (!_vendorSettings) {\n // eslint-disable-next-line no-restricted-globals\n var doc = typeof document !== 'undefined' ? document : undefined;\n var nav = typeof navigator !== 'undefined' ? navigator : undefined;\n var userAgent = (_a = nav === null || nav === void 0 ? void 0 : nav.userAgent) === null || _a === void 0 ? void 0 : _a.toLowerCase();\n if (!doc) {\n _vendorSettings = {\n isWebkit: true,\n isMoz: true,\n isOpera: true,\n isMs: true,\n };\n }\n else {\n _vendorSettings = {\n isWebkit: !!(doc && 'WebkitAppearance' in doc.documentElement.style),\n isMoz: !!(userAgent && userAgent.indexOf('firefox') > -1),\n isOpera: !!(userAgent && userAgent.indexOf('opera') > -1),\n isMs: !!(nav && (/rv:11.0/i.test(nav.userAgent) || /Edge\\/\\d./i.test(navigator.userAgent))),\n };\n }\n }\n return _vendorSettings;\n}\n/**\n * Sets the vendor settings for prefixing and vendor specific operations.\n */\nexport function setVendorSettings(vendorSettings) {\n _vendorSettings = vendorSettings;\n}\n//# sourceMappingURL=getVendorSettings.js.map","var _a;\nvar LEFT = 'left';\nvar RIGHT = 'right';\nvar NO_FLIP = '@noflip';\nvar NAME_REPLACEMENTS = (_a = {},\n _a[LEFT] = RIGHT,\n _a[RIGHT] = LEFT,\n _a);\nvar VALUE_REPLACEMENTS = {\n 'w-resize': 'e-resize',\n 'sw-resize': 'se-resize',\n 'nw-resize': 'ne-resize',\n};\n/**\n * RTLifies the rulePair in the array at the current index. This mutates the array for performance\n * reasons.\n */\nexport function rtlifyRules(options, rulePairs, index) {\n if (options.rtl) {\n var name_1 = rulePairs[index];\n if (!name_1) {\n return;\n }\n var value = rulePairs[index + 1];\n if (typeof value === 'string' && value.indexOf(NO_FLIP) >= 0) {\n rulePairs[index + 1] = value.replace(/\\s*(?:\\/\\*\\s*)?\\@noflip\\b(?:\\s*\\*\\/)?\\s*?/g, '');\n }\n else if (name_1.indexOf(LEFT) >= 0) {\n rulePairs[index] = name_1.replace(LEFT, RIGHT);\n }\n else if (name_1.indexOf(RIGHT) >= 0) {\n rulePairs[index] = name_1.replace(RIGHT, LEFT);\n }\n else if (String(value).indexOf(LEFT) >= 0) {\n rulePairs[index + 1] = value.replace(LEFT, RIGHT);\n }\n else if (String(value).indexOf(RIGHT) >= 0) {\n rulePairs[index + 1] = value.replace(RIGHT, LEFT);\n }\n else if (NAME_REPLACEMENTS[name_1]) {\n rulePairs[index] = NAME_REPLACEMENTS[name_1];\n }\n else if (VALUE_REPLACEMENTS[value]) {\n rulePairs[index + 1] = VALUE_REPLACEMENTS[value];\n }\n else {\n switch (name_1) {\n case 'margin':\n case 'padding':\n rulePairs[index + 1] = flipQuad(value);\n break;\n case 'box-shadow':\n rulePairs[index + 1] = negateNum(value, 0);\n break;\n }\n }\n }\n}\n/**\n * Given a string value in a space delimited format (e.g. \"1 2 3 4\"), negates a particular value.\n */\nfunction negateNum(value, partIndex) {\n var parts = value.split(' ');\n var numberVal = parseInt(parts[partIndex], 10);\n parts[0] = parts[0].replace(String(numberVal), String(numberVal * -1));\n return parts.join(' ');\n}\n/**\n * Given a string quad, flips the left and right values.\n */\nfunction flipQuad(value) {\n if (typeof value === 'string') {\n var parts = value.split(' ');\n if (parts.length === 4) {\n return \"\".concat(parts[0], \" \").concat(parts[3], \" \").concat(parts[2], \" \").concat(parts[1]);\n }\n }\n return value;\n}\n//# sourceMappingURL=rtlifyRules.js.map","import { __assign, __extends } from \"tslib\";\n/* eslint no-restricted-globals: 0 */\nimport { InjectionMode, STYLESHEET_SETTING, Stylesheet } from './Stylesheet';\nimport { DEFAULT_SHADOW_CONFIG, GLOBAL_STYLESHEET_KEY, SHADOW_DOM_STYLESHEET_SETTING } from './shadowConfig';\nexport var SUPPORTS_CONSTRUCTABLE_STYLESHEETS = typeof document !== 'undefined' && Array.isArray(document.adoptedStyleSheets) && 'replace' in CSSStyleSheet.prototype;\nvar supportsModifyingAdoptedStyleSheets = false;\nif (SUPPORTS_CONSTRUCTABLE_STYLESHEETS) {\n try {\n document.adoptedStyleSheets.push();\n supportsModifyingAdoptedStyleSheets = true;\n }\n catch (e) {\n supportsModifyingAdoptedStyleSheets = false;\n }\n}\nexport var SUPPORTS_MODIFYING_ADOPTED_STYLESHEETS = supportsModifyingAdoptedStyleSheets;\nvar _stylesheet;\nvar _global = {};\n// Grab window.\ntry {\n // Why the cast?\n // if compiled/type checked in same program with `@fluentui/font-icons-mdl2` which extends `Window` on global\n // ( check packages/font-icons-mdl2/src/index.ts ) the definitions don't match! Thus the need of this extra assertion\n _global = (window || {});\n}\ncatch (_a) {\n /* leave as blank object */\n}\nvar copyOldGlobalRules = function (stylesheet, inShadow, win, doc) {\n var _a;\n if (inShadow === void 0) { inShadow = false; }\n if (!doc) {\n // SSR\n return;\n }\n var oldGlobalRules = doc.querySelectorAll('[data-merge-styles]');\n if (oldGlobalRules) {\n stylesheet.setConfig({\n window: win,\n inShadow: inShadow,\n stylesheetKey: GLOBAL_STYLESHEET_KEY,\n });\n for (var i = 0; i < oldGlobalRules.length; i++) {\n var styleElem = oldGlobalRules[i];\n styleElem.setAttribute('data-merge-styles-global', 'true');\n var cssRules = ((_a = styleElem.sheet) === null || _a === void 0 ? void 0 : _a.cssRules) || [];\n for (var j = 0; j < cssRules.length; j++) {\n var rule = cssRules[j];\n stylesheet.insertRule(rule.cssText);\n }\n }\n }\n};\nvar ShadowDomStylesheet = /** @class */ (function (_super) {\n __extends(ShadowDomStylesheet, _super);\n function ShadowDomStylesheet(config, serializedStylesheet) {\n var _this = _super.call(this, config, serializedStylesheet) || this;\n _this._onAddSheetCallbacks = [];\n _this._sheetCounter = 0;\n _this._adoptableSheets = new Map();\n _global[SHADOW_DOM_STYLESHEET_SETTING] = ShadowDomStylesheet;\n return _this;\n }\n ShadowDomStylesheet.getInstance = function (shadowConfig) {\n var sConfig = shadowConfig || DEFAULT_SHADOW_CONFIG;\n var stylesheetKey = sConfig.stylesheetKey || GLOBAL_STYLESHEET_KEY;\n var inShadow = sConfig.inShadow;\n var win = sConfig.window || (typeof window !== 'undefined' ? window : undefined);\n var global = (win || _global);\n var doc = win ? win.document : typeof document !== 'undefined' ? document : undefined;\n _stylesheet = global[STYLESHEET_SETTING];\n // When an app has multiple versions of Fluent v8 it is possible\n // that an older version of Stylesheet is initialized before\n // the version that supports shadow DOM. We check for this case\n // and re-initialize the stylesheet in that case.\n var oldStylesheetInitializedFirst = _stylesheet && !_stylesheet.getAdoptedSheets;\n if (!_stylesheet ||\n oldStylesheetInitializedFirst ||\n (_stylesheet._lastStyleElement && _stylesheet._lastStyleElement.ownerDocument !== doc)) {\n var fabricConfig = (global === null || global === void 0 ? void 0 : global.FabricConfig) || {};\n var defaultMergeStyles = {\n window: win,\n inShadow: inShadow,\n stylesheetKey: stylesheetKey,\n };\n fabricConfig.mergeStyles = fabricConfig.mergeStyles || {};\n fabricConfig.mergeStyles = __assign(__assign({}, defaultMergeStyles), fabricConfig.mergeStyles);\n var stylesheet = void 0;\n if (oldStylesheetInitializedFirst) {\n stylesheet = new ShadowDomStylesheet(fabricConfig.mergeStyles, JSON.parse(_stylesheet.serialize()));\n copyOldGlobalRules(stylesheet, inShadow, win, doc);\n }\n else {\n stylesheet = new ShadowDomStylesheet(fabricConfig.mergeStyles, fabricConfig.serializedStylesheet);\n }\n _stylesheet = stylesheet;\n global[STYLESHEET_SETTING] = _stylesheet;\n }\n else {\n _stylesheet.setConfig({\n window: win,\n inShadow: inShadow,\n stylesheetKey: stylesheetKey,\n });\n }\n if (win) {\n _stylesheet._getAdoptableStyleSheet(stylesheetKey);\n }\n return _stylesheet;\n };\n ShadowDomStylesheet.prototype.getAdoptedSheets = function () {\n return this._adoptableSheets;\n };\n ShadowDomStylesheet.prototype.onAddSheet = function (callback) {\n var _this = this;\n this._onAddSheetCallbacks.push(callback);\n return function () {\n _this._onAddSheetCallbacks = _this._onAddSheetCallbacks.filter(function (cb) { return cb !== callback; });\n };\n };\n ShadowDomStylesheet.prototype.insertRule = function (rule, preserve) {\n var _a = this._config, injectionMode = _a.injectionMode, _b = _a.stylesheetKey, stylesheetKey = _b === void 0 ? GLOBAL_STYLESHEET_KEY : _b;\n var injectStyles = injectionMode !== InjectionMode.none;\n var addToConstructableStylesheet = stylesheetKey === GLOBAL_STYLESHEET_KEY || !!this._adoptableSheets.has(stylesheetKey);\n var constructableSheet = undefined;\n if (injectStyles && addToConstructableStylesheet) {\n constructableSheet = this._getAdoptableStyleSheet(stylesheetKey);\n }\n if (constructableSheet) {\n this._insertRuleIntoSheet(constructableSheet, rule);\n }\n _super.prototype.insertRule.call(this, rule, preserve, stylesheetKey);\n };\n ShadowDomStylesheet.prototype._getCacheKey = function (key) {\n var _a = this._config, _b = _a.inShadow, inShadow = _b === void 0 ? false : _b, _c = _a.stylesheetKey, currentStylesheetKey = _c === void 0 ? GLOBAL_STYLESHEET_KEY : _c;\n if (inShadow) {\n return \"__\".concat(currentStylesheetKey, \"__\").concat(key);\n }\n return _super.prototype._getCacheKey.call(this, key);\n };\n ShadowDomStylesheet.prototype._createStyleElement = function () {\n var styleElement = _super.prototype._createStyleElement.call(this);\n if (this._config.stylesheetKey === GLOBAL_STYLESHEET_KEY) {\n styleElement.setAttribute('data-merge-styles-global', 'true');\n }\n return styleElement;\n };\n ShadowDomStylesheet.prototype._makeCSSStyleSheet = function () {\n var win = this._config.window || window;\n var sheet = undefined;\n if (!SUPPORTS_CONSTRUCTABLE_STYLESHEETS) {\n var style = this._createStyleElement();\n sheet = style.sheet;\n }\n else {\n sheet = new win.CSSStyleSheet();\n }\n if (sheet) {\n sheet.bucketName = 'merge-styles';\n sheet.metadata = {\n stylesheetKey: this._config.stylesheetKey || GLOBAL_STYLESHEET_KEY,\n sortOrder: this._sheetCounter++,\n };\n }\n return sheet;\n };\n ShadowDomStylesheet.prototype._addAdoptableStyleSheet = function (key, sheet, queue) {\n var _this = this;\n if (queue === void 0) { queue = true; }\n if (!this._adoptableSheets.has(key)) {\n this._adoptableSheets.set(key, sheet);\n var win = this._config.window;\n if (queue && win) {\n win.queueMicrotask(function () {\n _this._onAddSheetCallbacks.forEach(function (callback) { return callback({ key: key, sheet: sheet }); });\n });\n }\n }\n };\n ShadowDomStylesheet.prototype._getAdoptableStyleSheet = function (key) {\n var sheet = this._adoptableSheets.get(key);\n if (!sheet) {\n sheet = this._makeCSSStyleSheet();\n this._addAdoptableStyleSheet(key, sheet);\n }\n return sheet;\n };\n return ShadowDomStylesheet;\n}(Stylesheet));\nexport { ShadowDomStylesheet };\n//# sourceMappingURL=ShadowDomStylesheet.js.map","import { isShadowConfig } from './shadowConfig';\n/**\n * Separates the classes and style objects. Any classes that are pre-registered\n * args are auto expanded into objects.\n */\nexport function extractStyleParts(sheet) {\n var args = [];\n for (var _i = 1; _i < arguments.length; _i++) {\n args[_i - 1] = arguments[_i];\n }\n var classes = [];\n var objects = [];\n var stylesheet = sheet;\n function _processArgs(argsList) {\n for (var _i = 0, argsList_1 = argsList; _i < argsList_1.length; _i++) {\n var arg = argsList_1[_i];\n if (arg && !isShadowConfig(arg)) {\n if (typeof arg === 'string') {\n if (arg.indexOf(' ') >= 0) {\n _processArgs(arg.split(' '));\n }\n else {\n var translatedArgs = stylesheet.argsFromClassName(arg);\n if (translatedArgs) {\n _processArgs(translatedArgs);\n }\n else {\n // Avoid adding the same class twice.\n if (classes.indexOf(arg) === -1) {\n classes.push(arg);\n }\n }\n }\n }\n else if (Array.isArray(arg)) {\n _processArgs(arg);\n }\n else if (typeof arg === 'object') {\n objects.push(arg);\n }\n }\n }\n }\n _processArgs(args);\n return {\n classes: classes,\n objects: objects,\n };\n}\n//# sourceMappingURL=extractStyleParts.js.map","var rules = {};\nexport function kebabRules(rulePairs, index) {\n var rule = rulePairs[index];\n if (rule.charAt(0) !== '-') {\n rulePairs[index] = rules[rule] = rules[rule] || rule.replace(/([A-Z])/g, '-$1').toLowerCase();\n }\n}\n//# sourceMappingURL=kebabRules.js.map","import { getVendorSettings } from '../getVendorSettings';\nvar autoPrefixNames = {\n 'user-select': 1,\n};\nexport function prefixRules(rulePairs, index) {\n var vendorSettings = getVendorSettings();\n var name = rulePairs[index];\n if (autoPrefixNames[name]) {\n var value = rulePairs[index + 1];\n if (autoPrefixNames[name]) {\n if (vendorSettings.isWebkit) {\n rulePairs.push('-webkit-' + name, value);\n }\n if (vendorSettings.isMoz) {\n rulePairs.push('-moz-' + name, value);\n }\n if (vendorSettings.isMs) {\n rulePairs.push('-ms-' + name, value);\n }\n if (vendorSettings.isOpera) {\n rulePairs.push('-o-' + name, value);\n }\n }\n }\n}\n//# sourceMappingURL=prefixRules.js.map","var NON_PIXEL_NUMBER_PROPS = [\n 'column-count',\n 'font-weight',\n 'flex',\n 'flex-grow',\n 'flex-shrink',\n 'fill-opacity',\n 'opacity',\n 'order',\n 'z-index',\n 'zoom',\n];\nexport function provideUnits(rulePairs, index) {\n var name = rulePairs[index];\n var value = rulePairs[index + 1];\n if (typeof value === 'number') {\n var isNonPixelProp = NON_PIXEL_NUMBER_PROPS.indexOf(name) > -1;\n var isVariableOrPrefixed = name.indexOf('--') > -1;\n var unit = isNonPixelProp || isVariableOrPrefixed ? '' : 'px';\n rulePairs[index + 1] = \"\".concat(value).concat(unit);\n }\n}\n//# sourceMappingURL=provideUnits.js.map","import { __spreadArray } from \"tslib\";\nimport { Stylesheet } from './Stylesheet';\nimport { kebabRules } from './transforms/kebabRules';\nimport { prefixRules } from './transforms/prefixRules';\nimport { provideUnits } from './transforms/provideUnits';\nimport { rtlifyRules } from './transforms/rtlifyRules';\nimport { tokenizeWithParentheses } from './tokenizeWithParentheses';\nvar DISPLAY_NAME = 'displayName';\nfunction getDisplayName(rules) {\n var rootStyle = rules && rules['&'];\n return rootStyle ? rootStyle.displayName : undefined;\n}\nvar globalSelectorRegExp = /\\:global\\((.+?)\\)/g;\n/**\n * Finds comma separated selectors in a :global() e.g. \":global(.class1, .class2, .class3)\"\n * and wraps them each in their own global \":global(.class1), :global(.class2), :global(.class3)\"\n *\n * @param selectorWithGlobals The selector to process\n * @returns The updated selector\n */\nfunction expandCommaSeparatedGlobals(selectorWithGlobals) {\n // We the selector does not have a :global() we can shortcut\n if (!globalSelectorRegExp.test(selectorWithGlobals)) {\n return selectorWithGlobals;\n }\n var replacementInfo = [];\n var findGlobal = /\\:global\\((.+?)\\)/g;\n var match = null;\n // Create a result list for global selectors so we can replace them.\n while ((match = findGlobal.exec(selectorWithGlobals))) {\n // Only if the found selector is a comma separated list we'll process it.\n if (match[1].indexOf(',') > -1) {\n replacementInfo.push([\n match.index,\n match.index + match[0].length,\n // Wrap each of the found selectors in :global()\n match[1]\n .split(',')\n .map(function (v) { return \":global(\".concat(v.trim(), \")\"); })\n .join(', '),\n ]);\n }\n }\n // Replace the found selectors with their wrapped variants in reverse order\n return replacementInfo\n .reverse()\n .reduce(function (selector, _a) {\n var matchIndex = _a[0], matchEndIndex = _a[1], replacement = _a[2];\n var prefix = selector.slice(0, matchIndex);\n var suffix = selector.slice(matchEndIndex);\n return prefix + replacement + suffix;\n }, selectorWithGlobals);\n}\nfunction isSelector(potentialSelector) {\n return potentialSelector.indexOf(':global(') >= 0 || potentialSelector.indexOf(':') === 0;\n}\nfunction expandSelector(newSelector, currentSelector) {\n if (newSelector.indexOf(':global(') >= 0) {\n return newSelector.replace(globalSelectorRegExp, '$1');\n }\n else if (newSelector.indexOf(':host(') === 0) {\n return newSelector;\n }\n else if (newSelector.indexOf(':') === 0) {\n return currentSelector + newSelector;\n }\n else if (newSelector.indexOf('&') < 0) {\n return currentSelector + ' ' + newSelector;\n }\n return newSelector;\n}\nfunction extractSelector(currentSelector, rules, selector, value, stylesheet) {\n if (rules === void 0) { rules = { __order: [] }; }\n if (selector.indexOf('@') === 0) {\n selector = selector + '{' + currentSelector;\n extractRules([value], rules, selector, stylesheet);\n }\n else if (selector.indexOf(',') > -1) {\n expandCommaSeparatedGlobals(selector)\n .split(',')\n .map(function (s) { return s.trim(); })\n .forEach(function (separatedSelector) {\n return extractRules([value], rules, expandSelector(separatedSelector, currentSelector), stylesheet);\n });\n }\n else {\n extractRules([value], rules, expandSelector(selector, currentSelector), stylesheet);\n }\n}\nfunction extractRules(args, rules, currentSelector, stylesheet) {\n if (rules === void 0) { rules = { __order: [] }; }\n if (currentSelector === void 0) { currentSelector = '&'; }\n var currentRules = rules[currentSelector];\n if (!currentRules) {\n currentRules = {};\n rules[currentSelector] = currentRules;\n rules.__order.push(currentSelector);\n }\n for (var _i = 0, args_1 = args; _i < args_1.length; _i++) {\n var arg = args_1[_i];\n // If the arg is a string, we need to look up the class map and merge.\n if (typeof arg === 'string') {\n var expandedRules = stylesheet.argsFromClassName(arg);\n if (expandedRules) {\n extractRules(expandedRules, rules, currentSelector, stylesheet);\n }\n // Else if the arg is an array, we need to recurse in.\n }\n else if (Array.isArray(arg)) {\n extractRules(arg, rules, currentSelector, stylesheet);\n }\n else {\n for (var prop in arg) {\n if (arg.hasOwnProperty(prop)) {\n var propValue = arg[prop];\n if (prop === 'selectors') {\n // every child is a selector.\n var selectors = arg.selectors;\n for (var newSelector in selectors) {\n if (selectors.hasOwnProperty(newSelector)) {\n extractSelector(currentSelector, rules, newSelector, selectors[newSelector], stylesheet);\n }\n }\n }\n else if (typeof propValue === 'object' || isSelector(prop)) {\n // prop is a selector.\n if (propValue !== null && propValue !== undefined) {\n extractSelector(currentSelector, rules, prop, propValue, stylesheet);\n }\n }\n else {\n if (propValue !== undefined) {\n // Else, add the rule to the currentSelector.\n if (prop === 'margin' || prop === 'padding') {\n expandQuads(currentRules, prop, propValue);\n }\n else {\n currentRules[prop] = propValue;\n }\n }\n }\n }\n }\n }\n }\n return rules;\n}\nfunction expandQuads(currentRules, name, value) {\n var parts = typeof value === 'string' ? tokenizeWithParentheses(value) : [value];\n if (parts.length === 0) {\n parts.push(value);\n }\n if (parts[parts.length - 1] === '!important') {\n // Remove !important from parts, and append it to each part individually\n parts = parts.slice(0, -1).map(function (p) { return p + ' !important'; });\n }\n currentRules[name + 'Top'] = parts[0];\n currentRules[name + 'Right'] = parts[1] || parts[0];\n currentRules[name + 'Bottom'] = parts[2] || parts[0];\n currentRules[name + 'Left'] = parts[3] || parts[1] || parts[0];\n}\nfunction getKeyForRules(options, rules) {\n var serialized = [options.rtl ? 'rtl' : 'ltr'];\n var hasProps = false;\n for (var _i = 0, _a = rules.__order; _i < _a.length; _i++) {\n var selector = _a[_i];\n serialized.push(selector);\n var rulesForSelector = rules[selector];\n for (var propName in rulesForSelector) {\n if (rulesForSelector.hasOwnProperty(propName) && rulesForSelector[propName] !== undefined) {\n hasProps = true;\n serialized.push(propName, rulesForSelector[propName]);\n }\n }\n }\n return hasProps ? serialized.join('') : undefined;\n}\nfunction repeatString(target, count) {\n if (count <= 0) {\n return '';\n }\n if (count === 1) {\n return target;\n }\n return target + repeatString(target, count - 1);\n}\nexport function serializeRuleEntries(options, ruleEntries) {\n if (!ruleEntries) {\n return '';\n }\n var allEntries = [];\n for (var entry in ruleEntries) {\n if (ruleEntries.hasOwnProperty(entry) && entry !== DISPLAY_NAME && ruleEntries[entry] !== undefined) {\n allEntries.push(entry, ruleEntries[entry]);\n }\n }\n // Apply transforms.\n for (var i = 0; i < allEntries.length; i += 2) {\n kebabRules(allEntries, i);\n provideUnits(allEntries, i);\n rtlifyRules(options, allEntries, i);\n prefixRules(allEntries, i);\n }\n // Apply punctuation.\n for (var i = 1; i < allEntries.length; i += 4) {\n allEntries.splice(i, 1, ':', allEntries[i], ';');\n }\n return allEntries.join('');\n}\nexport function styleToRegistration(options) {\n var _a;\n var args = [];\n for (var _i = 1; _i < arguments.length; _i++) {\n args[_i - 1] = arguments[_i];\n }\n var stylesheet = (_a = options.stylesheet) !== null && _a !== void 0 ? _a : Stylesheet.getInstance(options.shadowConfig);\n var rules = extractRules(args, undefined, undefined, stylesheet);\n var key = getKeyForRules(options, rules);\n if (key) {\n var registration = {\n className: stylesheet.classNameFromKey(key),\n key: key,\n args: args,\n };\n if (!registration.className) {\n registration.className = stylesheet.getClassName(getDisplayName(rules));\n var rulesToInsert = [];\n for (var _b = 0, _c = rules.__order; _b < _c.length; _b++) {\n var selector = _c[_b];\n rulesToInsert.push(selector, serializeRuleEntries(options, rules[selector]));\n }\n registration.rulesToInsert = rulesToInsert;\n }\n return registration;\n }\n return undefined;\n}\n/**\n * Insert style to stylesheet.\n * @param registration Style registration.\n * @param specificityMultiplier Number of times classname selector is repeated in the css rule.\n * This is to increase css specificity in case it's needed. Default to 1.\n */\nexport function applyRegistration(registration, specificityMultiplier, shadowConfig, sheet) {\n if (specificityMultiplier === void 0) { specificityMultiplier = 1; }\n var stylesheet = sheet !== null && sheet !== void 0 ? sheet : Stylesheet.getInstance(shadowConfig);\n var className = registration.className, key = registration.key, args = registration.args, rulesToInsert = registration.rulesToInsert;\n if (rulesToInsert) {\n // rulesToInsert is an ordered array of selector/rule pairs.\n for (var i = 0; i < rulesToInsert.length; i += 2) {\n var rules = rulesToInsert[i + 1];\n if (rules) {\n var selector = rulesToInsert[i];\n selector = selector.replace(/&/g, repeatString(\".\".concat(registration.className), specificityMultiplier));\n // Insert. Note if a media query, we must close the query with a final bracket.\n var processedRule = \"\".concat(selector, \"{\").concat(rules, \"}\").concat(selector.indexOf('@') === 0 ? '}' : '');\n stylesheet.insertRule(processedRule);\n }\n }\n stylesheet.cacheClassName(className, key, args, rulesToInsert);\n }\n}\nexport function styleToClassName(options) {\n var args = [];\n for (var _i = 1; _i < arguments.length; _i++) {\n args[_i - 1] = arguments[_i];\n }\n var registration = styleToRegistration.apply(void 0, __spreadArray([options], args, false));\n if (registration) {\n applyRegistration(registration, options.specificityMultiplier, options.shadowConfig, options.stylesheet);\n return registration.className;\n }\n return '';\n}\n//# sourceMappingURL=styleToClassName.js.map","/**\n * Split a string into tokens separated by whitespace, except all text within parentheses\n * is treated as a single token (whitespace is ignored within parentheses).\n *\n * Unlike String.split(' '), multiple consecutive space characters are collapsed and\n * removed from the returned array (including leading and trailing spaces).\n *\n * For example:\n * `tokenizeWithParentheses(\"3px calc(var(--x) / 2) 9px 0 \")`\n * => `[\"3px\", \"calc(var(--x) / 2)\", \"9px\", \"0\"]`\n *\n * @returns The array of tokens. Returns an empty array if the string was empty or contained only whitespace.\n */\nexport function tokenizeWithParentheses(value) {\n var parts = [];\n var partStart = 0;\n var parens = 0;\n for (var i = 0; i < value.length; i++) {\n switch (value[i]) {\n case '(':\n parens++;\n break;\n case ')':\n if (parens) {\n parens--;\n }\n break;\n case '\\t':\n case ' ':\n if (!parens) {\n // Add the new part if it's not an empty string\n if (i > partStart) {\n parts.push(value.substring(partStart, i));\n }\n partStart = i + 1;\n }\n break;\n }\n }\n // Add the last part\n if (partStart < value.length) {\n parts.push(value.substring(partStart));\n }\n return parts;\n}\n//# sourceMappingURL=tokenizeWithParentheses.js.map","import { extractStyleParts } from './extractStyleParts';\nimport { isShadowConfig } from './shadowConfig';\nimport { getStyleOptions } from './StyleOptionsState';\nimport { Stylesheet } from './Stylesheet';\nimport { styleToClassName } from './styleToClassName';\n/**\n * Concatenation helper, which can merge class names together. Skips over falsey values.\n *\n * @public\n */\nexport function mergeStyles() {\n var args = [];\n for (var _i = 0; _i < arguments.length; _i++) {\n args[_i] = arguments[_i];\n }\n return mergeCss(args, getStyleOptions());\n}\n/**\n * Concatenation helper, which can merge class names together. Skips over falsey values.\n * Accepts a set of options that will be used when calculating styles.\n *\n * @public\n */\nexport function mergeCss(args, options) {\n var styleArgs = args instanceof Array ? args : [args];\n var opts = options || {};\n var hasShadowConfig = isShadowConfig(styleArgs[0]);\n if (hasShadowConfig) {\n opts.shadowConfig = styleArgs[0];\n }\n opts.stylesheet = Stylesheet.getInstance(opts.shadowConfig);\n var _a = extractStyleParts(opts.stylesheet, styleArgs), classes = _a.classes, objects = _a.objects;\n if (objects.length) {\n classes.push(styleToClassName(opts, objects));\n }\n return classes.join(' ');\n}\n//# sourceMappingURL=mergeStyles.js.map","import { __spreadArray } from \"tslib\";\nimport { isShadowConfig } from './shadowConfig';\n/**\n * Combine a set of styles together (but does not register css classes).\n * @param styleSets - One or more stylesets to be merged (each param can also be falsy).\n */\nexport function concatStyleSets() {\n var styleSets = [];\n for (var _i = 0; _i < arguments.length; _i++) {\n styleSets[_i] = arguments[_i];\n }\n if (styleSets &&\n styleSets.length === 1 &&\n styleSets[0] &&\n !styleSets[0].subComponentStyles &&\n !isShadowConfig(styleSets[0])) {\n return styleSets[0];\n }\n var mergedSet = {};\n // We process sub component styles in two phases. First we collect them, then we combine them into 1 style function.\n var workingSubcomponentStyles = {};\n for (var _a = 0, styleSets_1 = styleSets; _a < styleSets_1.length; _a++) {\n var currentSet = styleSets_1[_a];\n if (currentSet && !isShadowConfig(currentSet)) {\n for (var prop in currentSet) {\n if (currentSet.hasOwnProperty(prop)) {\n if (prop === 'subComponentStyles' && currentSet.subComponentStyles !== undefined) {\n // subcomponent styles - style functions or objects\n var currentComponentStyles = currentSet.subComponentStyles;\n for (var subCompProp in currentComponentStyles) {\n if (currentComponentStyles.hasOwnProperty(subCompProp)) {\n if (workingSubcomponentStyles.hasOwnProperty(subCompProp)) {\n workingSubcomponentStyles[subCompProp].push(currentComponentStyles[subCompProp]);\n }\n else {\n workingSubcomponentStyles[subCompProp] = [currentComponentStyles[subCompProp]];\n }\n }\n }\n continue;\n }\n // the as any casts below is a workaround for ts 2.8.\n // todo: remove cast to any in ts 2.9.\n var mergedValue = mergedSet[prop];\n var currentValue = currentSet[prop];\n if (mergedValue === undefined) {\n mergedSet[prop] = currentValue;\n }\n else {\n mergedSet[prop] = __spreadArray(__spreadArray([], (Array.isArray(mergedValue) ? mergedValue : [mergedValue]), true), (Array.isArray(currentValue) ? currentValue : [currentValue]), true);\n }\n }\n }\n }\n }\n if (Object.keys(workingSubcomponentStyles).length > 0) {\n mergedSet.subComponentStyles = {};\n var mergedSubStyles = mergedSet.subComponentStyles;\n var _loop_1 = function (subCompProp) {\n if (workingSubcomponentStyles.hasOwnProperty(subCompProp)) {\n var workingSet_1 = workingSubcomponentStyles[subCompProp];\n mergedSubStyles[subCompProp] = function (styleProps) {\n return concatStyleSets.apply(void 0, workingSet_1.map(function (styleFunctionOrObject) {\n return typeof styleFunctionOrObject === 'function' ? styleFunctionOrObject(styleProps) : styleFunctionOrObject;\n }));\n };\n }\n };\n // now we process the subcomponent styles if there are any\n for (var subCompProp in workingSubcomponentStyles) {\n _loop_1(subCompProp);\n }\n }\n return mergedSet;\n}\n//# sourceMappingURL=concatStyleSets.js.map","import { __assign } from \"tslib\";\nimport { concatStyleSets } from './concatStyleSets';\nimport { extractStyleParts } from './extractStyleParts';\nimport { getStyleOptions } from './StyleOptionsState';\nimport { applyRegistration, styleToRegistration } from './styleToClassName';\nimport { isShadowConfig } from './shadowConfig';\nimport { Stylesheet } from './Stylesheet';\n/**\n * Takes in one or more style set objects, each consisting of a set of areas,\n * each which will produce a class name. Using this is analogous to calling\n * `mergeStyles` for each property in the object, but ensures we maintain the\n * set ordering when multiple style sets are merged.\n *\n * @param styleSets - One or more style sets to be merged.\n */\nexport function mergeStyleSets() {\n var styleSets = [];\n for (var _i = 0; _i < arguments.length; _i++) {\n styleSets[_i] = arguments[_i];\n }\n return mergeCssSets(styleSets, getStyleOptions());\n}\n/**\n * Takes in one or more style set objects, each1consisting of a set of areas,\n * each which will produce a class name. Using this is analogous to calling\n * `mergeCss` for each property in the object, but ensures the\n * set ordering when multiple style sets are merged.\n *\n * @param styleSets - One or more style sets to be merged.\n * @param options - (optional) Options to use when creating rules.\n */\nexport function mergeCssSets(styleSets, options) {\n var classNameSet = { subComponentStyles: {} };\n var shadowConfig = undefined;\n var styleSet;\n if (isShadowConfig(styleSets[0])) {\n shadowConfig = styleSets[0];\n styleSet = styleSets[1];\n }\n else {\n styleSet = styleSets[0];\n }\n shadowConfig !== null && shadowConfig !== void 0 ? shadowConfig : (shadowConfig = options === null || options === void 0 ? void 0 : options.shadowConfig);\n var opts = __assign(__assign({}, options), { shadowConfig: shadowConfig });\n if (!styleSet && styleSets.length <= 1) {\n return { subComponentStyles: {} };\n }\n var sheet = Stylesheet.getInstance(shadowConfig);\n opts.stylesheet = sheet;\n var concatenatedStyleSet = concatStyleSets.apply(void 0, styleSets);\n var registrations = [];\n for (var styleSetArea in concatenatedStyleSet) {\n if (concatenatedStyleSet.hasOwnProperty(styleSetArea)) {\n if (styleSetArea === 'subComponentStyles') {\n classNameSet.subComponentStyles = concatenatedStyleSet.subComponentStyles || {};\n continue;\n }\n else if (styleSetArea === '__shadowConfig__') {\n continue;\n }\n var styles = concatenatedStyleSet[styleSetArea];\n var _a = extractStyleParts(sheet, styles), classes = _a.classes, objects = _a.objects;\n if (objects === null || objects === void 0 ? void 0 : objects.length) {\n var registration = styleToRegistration(opts || {}, { displayName: styleSetArea }, objects);\n if (registration) {\n registrations.push(registration);\n classNameSet[styleSetArea] = classes.concat([registration.className]).join(' ');\n }\n }\n else {\n classNameSet[styleSetArea] = classes.join(' ');\n }\n }\n }\n for (var _i = 0, registrations_1 = registrations; _i < registrations_1.length; _i++) {\n var registration = registrations_1[_i];\n if (registration) {\n applyRegistration(registration, options === null || options === void 0 ? void 0 : options.specificityMultiplier, shadowConfig);\n }\n }\n return classNameSet;\n}\n//# sourceMappingURL=mergeStyleSets.js.map","import { concatStyleSets } from './concatStyleSets';\n/**\n * Concatenates style sets into one, but resolves functional sets using the given props.\n * @param styleProps - Props used to resolve functional sets.\n * @param allStyles - Style sets, which can be functions or objects.\n */\nexport function concatStyleSetsWithProps(styleProps) {\n var allStyles = [];\n for (var _i = 1; _i < arguments.length; _i++) {\n allStyles[_i - 1] = arguments[_i];\n }\n var result = [];\n for (var _a = 0, allStyles_1 = allStyles; _a < allStyles_1.length; _a++) {\n var styles = allStyles_1[_a];\n if (styles) {\n result.push(typeof styles === 'function' ? styles(styleProps) : styles);\n }\n }\n if (result.length === 1) {\n return result[0];\n }\n else if (result.length) {\n // cliffkoh: I cannot figure out how to avoid the cast to any here.\n // It is something to do with the use of Omit in IStyleSet.\n // It might not be necessary once Omit becomes part of lib.d.ts (when we remove our own Omit and rely on\n // the official version).\n return concatStyleSets.apply(void 0, result);\n }\n return {};\n}\n//# sourceMappingURL=concatStyleSetsWithProps.js.map","import { getStyleOptions } from './StyleOptionsState';\nimport { Stylesheet } from './Stylesheet';\nimport { serializeRuleEntries } from './styleToClassName';\n/**\n * Registers a font face.\n * @public\n */\nexport function fontFace(font) {\n var stylesheet = Stylesheet.getInstance();\n var rule = serializeRuleEntries(getStyleOptions(), font);\n var className = stylesheet.classNameFromKey(rule);\n if (className) {\n return;\n }\n var name = stylesheet.getClassName();\n stylesheet.insertRule(\"@font-face{\".concat(rule, \"}\"), true);\n stylesheet.cacheClassName(name, rule, [], ['font-face', rule]);\n}\n//# sourceMappingURL=fontFace.js.map","import { getStyleOptions } from './StyleOptionsState';\nimport { Stylesheet } from './Stylesheet';\nimport { serializeRuleEntries } from './styleToClassName';\n/**\n * Registers keyframe definitions.\n *\n * @public\n */\nexport function keyframes(timeline) {\n var stylesheet = Stylesheet.getInstance();\n var rulesArray = [];\n for (var prop in timeline) {\n if (timeline.hasOwnProperty(prop)) {\n rulesArray.push(prop, '{', serializeRuleEntries(getStyleOptions(), timeline[prop]), '}');\n }\n }\n var rules = rulesArray.join('');\n var className = stylesheet.classNameFromKey(rules);\n if (className) {\n return className;\n }\n var name = stylesheet.getClassName();\n stylesheet.insertRule(\"@keyframes \".concat(name, \"{\").concat(rules, \"}\"), true);\n stylesheet.cacheClassName(name, rules, [], ['keyframes', rules]);\n return name;\n}\n//# sourceMappingURL=keyframes.js.map","export var cloneCSSStyleSheet = function (srcSheet, targetSheet) {\n for (var i = 0; i < srcSheet.cssRules.length; i++) {\n targetSheet.insertRule(srcSheet.cssRules[i].cssText, i);\n }\n return targetSheet;\n};\nexport var cloneExtendedCSSStyleSheet = function (srcSheet, targetSheet) {\n var clone = cloneCSSStyleSheet(srcSheet, targetSheet);\n clone.bucketName = srcSheet.bucketName;\n for (var _i = 0, _a = Object.keys(srcSheet.metadata); _i < _a.length; _i++) {\n var key = _a[_i];\n clone.metadata[key] = srcSheet.metadata[key];\n }\n return clone;\n};\n//# sourceMappingURL=cloneCSSStyleSheet.js.map","// Do not modify this file; it is generated as part of publish.\n// The checked in version is a placeholder only and will not be updated.\nimport { setVersion } from '@fluentui/set-version';\nsetVersion('@fluentui/merge-styles', '8.6.14');\n//# sourceMappingURL=version.js.map","import { __assign, __extends } from \"tslib\";\nimport * as React from 'react';\nimport { FocusZoneDirection, FocusZoneTabbableElements } from './FocusZone.types';\nimport { KeyCodes, css, elementContains, getDocument, getElementIndexPath, getFocusableByIndexPath, getId, getNativeProps, getNextElement, getParent, getPreviousElement, getRTL, htmlElementProperties, initializeComponentRef, isElementFocusSubZone, isElementFocusZone, isElementTabbable, shouldWrapFocus, warnDeprecations, portalContainsElement, findScrollableParent, createMergedRef, isElementVisibleAndNotHidden, MergeStylesShadowRootContext, } from '@fluentui/utilities';\nimport { mergeStyles } from '@fluentui/merge-styles';\nimport { getTheme } from '@fluentui/style-utilities';\nvar IS_FOCUSABLE_ATTRIBUTE = 'data-is-focusable';\nvar IS_ENTER_DISABLED_ATTRIBUTE = 'data-disable-click-on-enter';\nvar FOCUSZONE_ID_ATTRIBUTE = 'data-focuszone-id';\nvar TABINDEX = 'tabindex';\nvar NO_VERTICAL_WRAP = 'data-no-vertical-wrap';\nvar NO_HORIZONTAL_WRAP = 'data-no-horizontal-wrap';\nvar LARGE_DISTANCE_FROM_CENTER = 999999999;\nvar LARGE_NEGATIVE_DISTANCE_FROM_CENTER = -999999999;\nvar focusZoneStyles;\nvar focusZoneClass = 'ms-FocusZone';\n/**\n * Raises a click on a target element based on a keyboard event.\n */\nfunction raiseClickFromKeyboardEvent(target, ev) {\n var event;\n if (typeof MouseEvent === 'function') {\n event = new MouseEvent('click', {\n ctrlKey: ev === null || ev === void 0 ? void 0 : ev.ctrlKey,\n metaKey: ev === null || ev === void 0 ? void 0 : ev.metaKey,\n shiftKey: ev === null || ev === void 0 ? void 0 : ev.shiftKey,\n altKey: ev === null || ev === void 0 ? void 0 : ev.altKey,\n bubbles: ev === null || ev === void 0 ? void 0 : ev.bubbles,\n cancelable: ev === null || ev === void 0 ? void 0 : ev.cancelable,\n });\n }\n else {\n // eslint-disable-next-line no-restricted-globals\n event = document.createEvent('MouseEvents');\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n event.initMouseEvent('click', ev ? ev.bubbles : false, ev ? ev.cancelable : false, \n // eslint-disable-next-line no-restricted-globals\n window, // not using getWindow() since this can only be run client side\n 0, // detail\n 0, // screen x\n 0, // screen y\n 0, // client x\n 0, // client y\n ev ? ev.ctrlKey : false, ev ? ev.altKey : false, ev ? ev.shiftKey : false, ev ? ev.metaKey : false, 0, // button\n null);\n }\n target.dispatchEvent(event);\n}\n// Helper function that will return a class for when the root is focused\nfunction getRootClass() {\n if (!focusZoneStyles) {\n focusZoneStyles = mergeStyles({\n selectors: {\n ':focus': {\n outline: 'none',\n },\n },\n }, focusZoneClass);\n }\n return focusZoneStyles;\n}\nvar _allInstances = {};\nvar _outerZones = new Set();\nvar ALLOWED_INPUT_TYPES = ['text', 'number', 'password', 'email', 'tel', 'url', 'search', 'textarea'];\nvar ALLOW_VIRTUAL_ELEMENTS = false;\nvar FocusZone = /** @class */ (function (_super) {\n __extends(FocusZone, _super);\n function FocusZone(props) {\n var _a, _b, _c, _d;\n var _this = _super.call(this, props) || this;\n _this._root = React.createRef();\n _this._mergedRef = createMergedRef();\n _this._onFocus = function (ev) {\n if (_this._portalContainsElement(ev.target)) {\n // If the event target is inside a portal do not process the event.\n return;\n }\n var _a = _this.props, onActiveElementChanged = _a.onActiveElementChanged, \n // eslint-disable-next-line @typescript-eslint/no-deprecated\n doNotAllowFocusEventToPropagate = _a.doNotAllowFocusEventToPropagate, stopFocusPropagation = _a.stopFocusPropagation, \n // eslint-disable-next-line @typescript-eslint/no-deprecated\n onFocusNotification = _a.onFocusNotification, onFocus = _a.onFocus, shouldFocusInnerElementWhenReceivedFocus = _a.shouldFocusInnerElementWhenReceivedFocus, defaultTabbableElement = _a.defaultTabbableElement;\n var isImmediateDescendant = _this._isImmediateDescendantOfZone(ev.target);\n var newActiveElement;\n if (isImmediateDescendant) {\n newActiveElement = ev.target;\n }\n else {\n var parentElement = ev.target;\n while (parentElement && parentElement !== _this._root.current) {\n if (isElementTabbable(parentElement, undefined, _this._inShadowRoot) &&\n _this._isImmediateDescendantOfZone(parentElement)) {\n newActiveElement = parentElement;\n break;\n }\n parentElement = getParent(parentElement, ALLOW_VIRTUAL_ELEMENTS);\n }\n }\n // If an inner focusable element should be focused when FocusZone container receives focus\n if (shouldFocusInnerElementWhenReceivedFocus && ev.target === _this._root.current) {\n var maybeElementToFocus = defaultTabbableElement &&\n typeof defaultTabbableElement === 'function' &&\n _this._root.current &&\n defaultTabbableElement(_this._root.current);\n // try to focus defaultTabbable element\n if (maybeElementToFocus && isElementTabbable(maybeElementToFocus, undefined, _this._inShadowRoot)) {\n newActiveElement = maybeElementToFocus;\n maybeElementToFocus.focus();\n }\n else {\n // force focus on first focusable element\n _this.focus(true);\n if (_this._activeElement) {\n // set to null as new active element was handled in method above\n newActiveElement = null;\n }\n }\n }\n var initialElementFocused = !_this._activeElement;\n // If the new active element is a child of this zone and received focus,\n // update alignment an immediate descendant\n if (newActiveElement && newActiveElement !== _this._activeElement) {\n if (isImmediateDescendant || initialElementFocused) {\n _this._setFocusAlignment(newActiveElement, true, true);\n }\n _this._activeElement = newActiveElement;\n if (initialElementFocused) {\n _this._updateTabIndexes();\n }\n }\n if (onActiveElementChanged) {\n onActiveElementChanged(_this._activeElement, ev);\n }\n if (stopFocusPropagation || doNotAllowFocusEventToPropagate) {\n ev.stopPropagation();\n }\n if (onFocus) {\n onFocus(ev);\n }\n else if (onFocusNotification) {\n onFocusNotification();\n }\n };\n _this._onBlur = function () {\n _this._setParkedFocus(false);\n };\n _this._onMouseDown = function (ev) {\n if (_this._portalContainsElement(ev.target)) {\n // If the event target is inside a portal do not process the event.\n return;\n }\n var disabled = _this.props.disabled;\n if (disabled) {\n return;\n }\n var target = ev.target;\n var path = [];\n while (target && target !== _this._root.current) {\n path.push(target);\n target = getParent(target, ALLOW_VIRTUAL_ELEMENTS);\n }\n while (path.length) {\n target = path.pop();\n if (target && isElementTabbable(target, undefined, _this._inShadowRoot)) {\n _this._setActiveElement(target, true);\n }\n if (isElementFocusZone(target)) {\n // Stop here since the focus zone will take care of its own children.\n break;\n }\n }\n };\n /**\n * Handle the keystrokes.\n */\n _this._onKeyDown = function (ev, theme) {\n if (_this._portalContainsElement(ev.target)) {\n // If the event target is inside a portal do not process the event.\n return;\n }\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n var _a = _this.props, direction = _a.direction, disabled = _a.disabled, isInnerZoneKeystroke = _a.isInnerZoneKeystroke, pagingSupportDisabled = _a.pagingSupportDisabled, shouldEnterInnerZone = _a.shouldEnterInnerZone;\n if (disabled) {\n return;\n }\n if (_this.props.onKeyDown) {\n _this.props.onKeyDown(ev);\n }\n // If the default has been prevented, do not process keyboard events.\n if (ev.isDefaultPrevented()) {\n return;\n }\n if (_this._getDocument().activeElement === _this._root.current && _this._isInnerZone) {\n // If this element has focus, it is being controlled by a parent.\n // Ignore the keystroke.\n return;\n }\n if (((shouldEnterInnerZone && shouldEnterInnerZone(ev)) || (isInnerZoneKeystroke && isInnerZoneKeystroke(ev))) &&\n _this._isImmediateDescendantOfZone(ev.target)) {\n // Try to focus\n var innerZone = _this._getFirstInnerZone();\n if (innerZone) {\n if (!innerZone.focus(true)) {\n return;\n }\n }\n else if (isElementFocusSubZone(ev.target)) {\n if (!_this.focusElement(getNextElement(ev.target, ev.target.firstChild, true))) {\n return;\n }\n }\n else {\n return;\n }\n }\n else if (ev.altKey) {\n return;\n }\n else {\n // eslint-disable-next-line @fluentui/deprecated-keyboard-event-props, @typescript-eslint/no-deprecated\n switch (ev.which) {\n case KeyCodes.space:\n if (_this._shouldRaiseClicksOnSpace && _this._tryInvokeClickForFocusable(ev.target, ev)) {\n break;\n }\n return;\n case KeyCodes.left:\n if (direction !== FocusZoneDirection.vertical) {\n _this._preventDefaultWhenHandled(ev);\n if (_this._moveFocusLeft(theme)) {\n break;\n }\n }\n return;\n case KeyCodes.right:\n if (direction !== FocusZoneDirection.vertical) {\n _this._preventDefaultWhenHandled(ev);\n if (_this._moveFocusRight(theme)) {\n break;\n }\n }\n return;\n case KeyCodes.up:\n if (direction !== FocusZoneDirection.horizontal) {\n _this._preventDefaultWhenHandled(ev);\n if (_this._moveFocusUp()) {\n break;\n }\n }\n return;\n case KeyCodes.down:\n if (direction !== FocusZoneDirection.horizontal) {\n _this._preventDefaultWhenHandled(ev);\n if (_this._moveFocusDown()) {\n break;\n }\n }\n return;\n case KeyCodes.pageDown:\n if (!pagingSupportDisabled && _this._moveFocusPaging(true)) {\n break;\n }\n return;\n case KeyCodes.pageUp:\n if (!pagingSupportDisabled && _this._moveFocusPaging(false)) {\n break;\n }\n return;\n case KeyCodes.tab:\n if (\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n _this.props.allowTabKey ||\n _this.props.handleTabKey === FocusZoneTabbableElements.all ||\n (_this.props.handleTabKey === FocusZoneTabbableElements.inputOnly &&\n _this._isElementInput(ev.target))) {\n var focusChanged = false;\n _this._processingTabKey = true;\n if (direction === FocusZoneDirection.vertical ||\n !_this._shouldWrapFocus(_this._activeElement, NO_HORIZONTAL_WRAP)) {\n focusChanged = ev.shiftKey ? _this._moveFocusUp() : _this._moveFocusDown();\n }\n else {\n var tabWithDirection = getRTL(theme) ? !ev.shiftKey : ev.shiftKey;\n focusChanged = tabWithDirection ? _this._moveFocusLeft(theme) : _this._moveFocusRight(theme);\n }\n _this._processingTabKey = false;\n if (focusChanged) {\n break;\n }\n else if (_this.props.shouldResetActiveElementWhenTabFromZone) {\n _this._activeElement = null;\n }\n }\n return;\n case KeyCodes.home:\n if (_this._isContentEditableElement(ev.target) ||\n (_this._isElementInput(ev.target) &&\n !_this._shouldInputLoseFocus(ev.target, false))) {\n return false;\n }\n var firstChild = _this._root.current && _this._root.current.firstChild;\n if (_this._root.current &&\n firstChild &&\n _this.focusElement(getNextElement(_this._root.current, firstChild, true))) {\n break;\n }\n return;\n case KeyCodes.end:\n if (_this._isContentEditableElement(ev.target) ||\n (_this._isElementInput(ev.target) &&\n !_this._shouldInputLoseFocus(ev.target, true))) {\n return false;\n }\n var lastChild = _this._root.current && _this._root.current.lastChild;\n if (_this._root.current &&\n _this.focusElement(getPreviousElement(_this._root.current, lastChild, true, true, true))) {\n break;\n }\n return;\n case KeyCodes.enter:\n if (_this._shouldRaiseClicksOnEnter && _this._tryInvokeClickForFocusable(ev.target, ev)) {\n break;\n }\n return;\n default:\n return;\n }\n }\n ev.preventDefault();\n ev.stopPropagation();\n };\n _this._getHorizontalDistanceFromCenter = function (isForward, \n // eslint-disable-next-line @typescript-eslint/no-deprecated\n activeRect, \n // eslint-disable-next-line @typescript-eslint/no-deprecated\n targetRect) {\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n var leftAlignment = _this._focusAlignment.left || _this._focusAlignment.x || 0;\n // ClientRect values can be floats that differ by very small fractions of a decimal.\n // If the difference between top and bottom are within a pixel then we should treat\n // them as equivalent by using Math.floor. For instance 5.2222 and 5.222221 should be equivalent,\n // but without Math.Floor they will be handled incorrectly.\n var targetRectTop = Math.floor(targetRect.top);\n var activeRectBottom = Math.floor(activeRect.bottom);\n var targetRectBottom = Math.floor(targetRect.bottom);\n var activeRectTop = Math.floor(activeRect.top);\n var isValidCandidateOnpagingDown = isForward && targetRectTop > activeRectBottom;\n var isValidCandidateOnpagingUp = !isForward && targetRectBottom < activeRectTop;\n if (isValidCandidateOnpagingDown || isValidCandidateOnpagingUp) {\n if (leftAlignment >= targetRect.left && leftAlignment <= targetRect.left + targetRect.width) {\n return 0;\n }\n return Math.abs(targetRect.left + targetRect.width / 2 - leftAlignment);\n }\n if (!_this._shouldWrapFocus(_this._activeElement, NO_VERTICAL_WRAP)) {\n return LARGE_NEGATIVE_DISTANCE_FROM_CENTER;\n }\n return LARGE_DISTANCE_FROM_CENTER;\n };\n // Manage componentRef resolution.\n initializeComponentRef(_this);\n if (process.env.NODE_ENV !== 'production') {\n warnDeprecations('FocusZone', props, {\n rootProps: undefined,\n allowTabKey: 'handleTabKey',\n elementType: 'as',\n ariaDescribedBy: 'aria-describedby',\n ariaLabelledBy: 'aria-labelledby',\n });\n }\n _this._id = getId('FocusZone');\n _this._focusAlignment = {\n left: 0,\n top: 0,\n };\n _this._processingTabKey = false;\n var shouldRaiseClicksFallback = (_b = (_a = props.shouldRaiseClicks) !== null && _a !== void 0 ? _a : FocusZone.defaultProps.shouldRaiseClicks) !== null && _b !== void 0 ? _b : true;\n _this._shouldRaiseClicksOnEnter = (_c = props.shouldRaiseClicksOnEnter) !== null && _c !== void 0 ? _c : shouldRaiseClicksFallback;\n _this._shouldRaiseClicksOnSpace = (_d = props.shouldRaiseClicksOnSpace) !== null && _d !== void 0 ? _d : shouldRaiseClicksFallback;\n return _this;\n }\n /** Used for testing purposes only. */\n FocusZone.getOuterZones = function () {\n return _outerZones.size;\n };\n /**\n * Handle global tab presses so that we can patch tabindexes on the fly.\n * HEADS UP: This must not be an arrow function in order to be referentially equal among instances\n * for ref counting to work correctly!\n */\n FocusZone._onKeyDownCapture = function (ev) {\n // eslint-disable-next-line @typescript-eslint/no-deprecated, @fluentui/deprecated-keyboard-event-props\n if (ev.which === KeyCodes.tab) {\n _outerZones.forEach(function (zone) { return zone._updateTabIndexes(); });\n }\n };\n FocusZone.prototype.componentDidMount = function () {\n var _a;\n var root = this._root.current;\n this._inShadowRoot = !!((_a = this.context) === null || _a === void 0 ? void 0 : _a.shadowRoot);\n _allInstances[this._id] = this;\n if (root) {\n var parentElement = getParent(root, ALLOW_VIRTUAL_ELEMENTS);\n while (parentElement && parentElement !== this._getDocument().body && parentElement.nodeType === 1) {\n if (isElementFocusZone(parentElement)) {\n this._isInnerZone = true;\n break;\n }\n parentElement = getParent(parentElement, ALLOW_VIRTUAL_ELEMENTS);\n }\n if (!this._isInnerZone) {\n _outerZones.add(this);\n this._root.current && this._root.current.addEventListener('keydown', FocusZone._onKeyDownCapture, true);\n }\n this._root.current && this._root.current.addEventListener('blur', this._onBlur, true);\n // Assign initial tab indexes so that we can set initial focus as appropriate.\n this._updateTabIndexes();\n if (this.props.defaultTabbableElement && typeof this.props.defaultTabbableElement === 'string') {\n this._activeElement = this._getDocument().querySelector(this.props.defaultTabbableElement);\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n }\n else if (this.props.defaultActiveElement) {\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n this._activeElement = this._getDocument().querySelector(this.props.defaultActiveElement);\n }\n if (this.props.shouldFocusOnMount) {\n this.focus();\n }\n }\n };\n FocusZone.prototype.componentDidUpdate = function () {\n var _a;\n var root = this._root.current;\n var doc = this._getDocument();\n this._inShadowRoot = !!((_a = this.context) === null || _a === void 0 ? void 0 : _a.shadowRoot);\n // If either _activeElement or _defaultFocusElement are no longer contained by _root,\n // reset those variables (and update tab indexes) to avoid memory leaks\n if ((this._activeElement && !elementContains(this._root.current, this._activeElement, ALLOW_VIRTUAL_ELEMENTS)) ||\n (this._defaultFocusElement &&\n !elementContains(this._root.current, this._defaultFocusElement, ALLOW_VIRTUAL_ELEMENTS))) {\n this._activeElement = null;\n this._defaultFocusElement = null;\n this._updateTabIndexes();\n }\n if (!this.props.preventFocusRestoration &&\n doc &&\n this._lastIndexPath &&\n (doc.activeElement === doc.body || doc.activeElement === null || doc.activeElement === root)) {\n // The element has been removed after the render, attempt to restore focus.\n var elementToFocus = getFocusableByIndexPath(root, this._lastIndexPath);\n if (elementToFocus) {\n this._setActiveElement(elementToFocus, true);\n elementToFocus.focus();\n this._setParkedFocus(false);\n }\n else {\n // We had a focus path to restore, but now that path is unresolvable. Park focus\n // on the container until we can try again.\n this._setParkedFocus(true);\n }\n }\n };\n FocusZone.prototype.componentWillUnmount = function () {\n delete _allInstances[this._id];\n if (!this._isInnerZone) {\n _outerZones.delete(this);\n this._root.current && this._root.current.removeEventListener('keydown', FocusZone._onKeyDownCapture, true);\n }\n if (this._root.current) {\n this._root.current.removeEventListener('blur', this._onBlur, true);\n }\n this._activeElement = null;\n this._defaultFocusElement = null;\n };\n FocusZone.prototype.render = function () {\n var _this = this;\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n var _a = this.props, tag = _a.as, elementType = _a.elementType, rootProps = _a.rootProps, ariaDescribedBy = _a.ariaDescribedBy, ariaLabelledBy = _a.ariaLabelledBy, className = _a.className;\n var divProps = getNativeProps(this.props, htmlElementProperties);\n var Tag = tag || elementType || 'div';\n // Note, right before rendering/reconciling proceeds, we need to record if focus\n // was in the zone before the update. This helper will track this and, if focus\n // was actually in the zone, what the index path to the element is at this time.\n // Then, later in componentDidUpdate, we can evaluate if we need to restore it in\n // the case the element was removed.\n this._evaluateFocusBeforeRender();\n // Only support RTL defined in global theme, not contextual theme/RTL.\n var theme = getTheme();\n return (React.createElement(Tag, __assign({ \"aria-labelledby\": ariaLabelledBy, \"aria-describedby\": ariaDescribedBy }, divProps, rootProps, { \n // Once the getClassName correctly memoizes inputs this should\n // be replaced so that className is passed to getRootClass and is included there so\n // the class names will always be in the same order.\n className: css(getRootClass(), className), \n // eslint-disable-next-line @typescript-eslint/no-deprecated\n ref: this._mergedRef(this.props.elementRef, this._root), \"data-focuszone-id\": this._id, \n // eslint-disable-next-line react/jsx-no-bind\n onKeyDown: function (ev) { return _this._onKeyDown(ev, theme); }, onFocus: this._onFocus, onMouseDownCapture: this._onMouseDown }), this.props.children));\n };\n /**\n * Sets focus to the first tabbable item in the zone.\n * @param forceIntoFirstElement - If true, focus will be forced into the first element, even\n * if focus is already in the focus zone.\n * @param bypassHiddenElements - If true, focus will be not be set on hidden elements.\n * @returns True if focus could be set to an active element, false if no operation was taken.\n */\n FocusZone.prototype.focus = function (forceIntoFirstElement, bypassHiddenElements) {\n if (forceIntoFirstElement === void 0) { forceIntoFirstElement = false; }\n if (bypassHiddenElements === void 0) { bypassHiddenElements = false; }\n if (this._root.current) {\n if (!forceIntoFirstElement &&\n this._root.current.getAttribute(IS_FOCUSABLE_ATTRIBUTE) === 'true' &&\n this._isInnerZone) {\n var ownerZoneElement = this._getOwnerZone(this._root.current);\n if (ownerZoneElement !== this._root.current) {\n var ownerZone = _allInstances[ownerZoneElement.getAttribute(FOCUSZONE_ID_ATTRIBUTE)];\n return !!ownerZone && ownerZone.focusElement(this._root.current);\n }\n return false;\n }\n else if (!forceIntoFirstElement &&\n this._activeElement &&\n elementContains(this._root.current, this._activeElement) &&\n isElementTabbable(this._activeElement, undefined, this._inShadowRoot) &&\n (!bypassHiddenElements || isElementVisibleAndNotHidden(this._activeElement))) {\n this._activeElement.focus();\n return true;\n }\n else {\n var firstChild = this._root.current.firstChild;\n return this.focusElement(getNextElement(this._root.current, firstChild, true, undefined, undefined, undefined, undefined, undefined, bypassHiddenElements));\n }\n }\n return false;\n };\n /**\n * Sets focus to the last tabbable item in the zone.\n * @returns True if focus could be set to an active element, false if no operation was taken.\n */\n FocusZone.prototype.focusLast = function () {\n if (this._root.current) {\n var lastChild = this._root.current && this._root.current.lastChild;\n return this.focusElement(getPreviousElement(this._root.current, lastChild, true, true, true));\n }\n return false;\n };\n /**\n * Sets focus to a specific child element within the zone. This can be used in conjunction with\n * shouldReceiveFocus to create delayed focus scenarios (like animate the scroll position to the correct\n * location and then focus.)\n * @param element - The child element within the zone to focus.\n * @param forceAlignment - If true, focus alignment will be set according to the element provided.\n * @returns True if focus could be set to an active element, false if no operation was taken.\n */\n FocusZone.prototype.focusElement = function (element, forceAlignment) {\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n var _a = this.props, onBeforeFocus = _a.onBeforeFocus, shouldReceiveFocus = _a.shouldReceiveFocus;\n if ((shouldReceiveFocus && !shouldReceiveFocus(element)) || (onBeforeFocus && !onBeforeFocus(element))) {\n return false;\n }\n if (element) {\n // when we set focus to a specific child, we should recalculate the alignment depending on its position.\n this._setActiveElement(element, forceAlignment);\n if (this._activeElement) {\n this._activeElement.focus();\n }\n return true;\n }\n return false;\n };\n /**\n * Forces horizontal alignment in the context of vertical arrowing to use specific point as the reference,\n * rather than a center based on the last horizontal motion.\n * @param point - the new reference point.\n */\n FocusZone.prototype.setFocusAlignment = function (point) {\n this._focusAlignment = point;\n };\n Object.defineProperty(FocusZone.prototype, \"defaultFocusElement\", {\n get: function () {\n return this._defaultFocusElement;\n },\n enumerable: false,\n configurable: true\n });\n Object.defineProperty(FocusZone.prototype, \"activeElement\", {\n get: function () {\n return this._activeElement;\n },\n enumerable: false,\n configurable: true\n });\n FocusZone.prototype._evaluateFocusBeforeRender = function () {\n var root = this._root.current;\n var doc = this._getDocument();\n if (doc) {\n var focusedElement = doc.activeElement;\n // Only update the index path if we are not parked on the root.\n if (focusedElement !== root) {\n var shouldRestoreFocus = elementContains(root, focusedElement, false);\n this._lastIndexPath = shouldRestoreFocus ? getElementIndexPath(root, focusedElement) : undefined;\n }\n }\n };\n /**\n * When focus is in the zone at render time but then all focusable elements are removed,\n * we \"park\" focus temporarily on the root. Once we update with focusable children, we restore\n * focus to the closest path from previous. If the user tabs away from the parked container,\n * we restore focusability to the pre-parked state.\n */\n FocusZone.prototype._setParkedFocus = function (isParked) {\n var root = this._root.current;\n if (root && this._isParked !== isParked) {\n this._isParked = isParked;\n if (isParked) {\n if (!this.props.allowFocusRoot) {\n this._parkedTabIndex = root.getAttribute('tabindex');\n root.setAttribute('tabindex', '-1');\n }\n root.focus();\n }\n else if (!this.props.allowFocusRoot) {\n if (this._parkedTabIndex) {\n root.setAttribute('tabindex', this._parkedTabIndex);\n this._parkedTabIndex = undefined;\n }\n else {\n root.removeAttribute('tabindex');\n }\n }\n }\n };\n FocusZone.prototype._setActiveElement = function (element, forceAlignment) {\n var previousActiveElement = this._activeElement;\n this._activeElement = element;\n if (previousActiveElement) {\n if (isElementFocusZone(previousActiveElement)) {\n this._updateTabIndexes(previousActiveElement);\n }\n previousActiveElement.tabIndex = -1;\n }\n if (this._activeElement) {\n if (!this._focusAlignment || forceAlignment) {\n this._setFocusAlignment(element, true, true);\n }\n this._activeElement.tabIndex = 0;\n }\n };\n FocusZone.prototype._preventDefaultWhenHandled = function (ev) {\n this.props.preventDefaultWhenHandled && ev.preventDefault();\n };\n /**\n * Walk up the dom try to find a focusable element.\n */\n FocusZone.prototype._tryInvokeClickForFocusable = function (targetElement, ev) {\n var target = targetElement;\n if (target === this._root.current) {\n return false;\n }\n do {\n if (target.tagName === 'BUTTON' ||\n target.tagName === 'A' ||\n target.tagName === 'INPUT' ||\n target.tagName === 'TEXTAREA' ||\n target.tagName === 'SUMMARY') {\n return false;\n }\n if (this._isImmediateDescendantOfZone(target) &&\n target.getAttribute(IS_FOCUSABLE_ATTRIBUTE) === 'true' &&\n target.getAttribute(IS_ENTER_DISABLED_ATTRIBUTE) !== 'true') {\n raiseClickFromKeyboardEvent(target, ev);\n return true;\n }\n target = getParent(target, ALLOW_VIRTUAL_ELEMENTS);\n } while (target !== this._root.current);\n return false;\n };\n /**\n * Traverse to find first child zone.\n */\n FocusZone.prototype._getFirstInnerZone = function (rootElement) {\n rootElement = rootElement || this._activeElement || this._root.current;\n if (!rootElement) {\n return null;\n }\n if (isElementFocusZone(rootElement)) {\n return _allInstances[rootElement.getAttribute(FOCUSZONE_ID_ATTRIBUTE)];\n }\n var child = rootElement.firstElementChild;\n while (child) {\n if (isElementFocusZone(child)) {\n return _allInstances[child.getAttribute(FOCUSZONE_ID_ATTRIBUTE)];\n }\n var match = this._getFirstInnerZone(child);\n if (match) {\n return match;\n }\n child = child.nextElementSibling;\n }\n return null;\n };\n FocusZone.prototype._moveFocus = function (isForward, \n // eslint-disable-next-line @typescript-eslint/no-deprecated\n getDistanceFromCenter, ev, useDefaultWrap) {\n if (useDefaultWrap === void 0) { useDefaultWrap = true; }\n var element = this._activeElement;\n var candidateDistance = -1;\n var candidateElement = undefined;\n var changedFocus = false;\n var isBidirectional = this.props.direction === FocusZoneDirection.bidirectional;\n if (!element || !this._root.current) {\n return false;\n }\n if (this._isElementInput(element)) {\n if (!this._shouldInputLoseFocus(element, isForward)) {\n return false;\n }\n }\n var activeRect = isBidirectional ? element.getBoundingClientRect() : null;\n do {\n element = (isForward ? getNextElement(this._root.current, element) : getPreviousElement(this._root.current, element));\n if (isBidirectional) {\n if (element) {\n var targetRect = element.getBoundingClientRect();\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n var elementDistance = getDistanceFromCenter(activeRect, targetRect);\n if (elementDistance === -1 && candidateDistance === -1) {\n candidateElement = element;\n break;\n }\n if (elementDistance > -1 && (candidateDistance === -1 || elementDistance < candidateDistance)) {\n candidateDistance = elementDistance;\n candidateElement = element;\n }\n if (candidateDistance >= 0 && elementDistance < 0) {\n break;\n }\n }\n }\n else {\n candidateElement = element;\n break;\n }\n } while (element);\n // Focus the closest candidate\n if (candidateElement && candidateElement !== this._activeElement) {\n changedFocus = true;\n this.focusElement(candidateElement);\n }\n else if (this.props.isCircularNavigation && useDefaultWrap) {\n if (isForward) {\n return this.focusElement(getNextElement(this._root.current, this._root.current.firstElementChild, true));\n }\n else {\n return this.focusElement(getPreviousElement(this._root.current, this._root.current.lastElementChild, true, true, true));\n }\n }\n return changedFocus;\n };\n FocusZone.prototype._moveFocusDown = function () {\n var _this = this;\n var targetTop = -1;\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n var leftAlignment = this._focusAlignment.left || this._focusAlignment.x || 0;\n if (\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n this._moveFocus(true, function (activeRect, targetRect) {\n var distance = -1;\n // ClientRect values can be floats that differ by very small fractions of a decimal.\n // If the difference between top and bottom are within a pixel then we should treat\n // them as equivalent by using Math.floor. For instance 5.2222 and 5.222221 should be equivalent,\n // but without Math.Floor they will be handled incorrectly.\n var targetRectTop = Math.floor(targetRect.top);\n var activeRectBottom = Math.floor(activeRect.bottom);\n if (targetRectTop < activeRectBottom) {\n if (!_this._shouldWrapFocus(_this._activeElement, NO_VERTICAL_WRAP)) {\n return LARGE_NEGATIVE_DISTANCE_FROM_CENTER;\n }\n return LARGE_DISTANCE_FROM_CENTER;\n }\n if ((targetTop === -1 && targetRectTop >= activeRectBottom) || targetRectTop === targetTop) {\n targetTop = targetRectTop;\n if (leftAlignment >= targetRect.left && leftAlignment <= targetRect.left + targetRect.width) {\n distance = 0;\n }\n else {\n distance = Math.abs(targetRect.left + targetRect.width / 2 - leftAlignment);\n }\n }\n return distance;\n })) {\n this._setFocusAlignment(this._activeElement, false, true);\n return true;\n }\n return false;\n };\n FocusZone.prototype._moveFocusUp = function () {\n var _this = this;\n var targetTop = -1;\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n var leftAlignment = this._focusAlignment.left || this._focusAlignment.x || 0;\n if (\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n this._moveFocus(false, function (activeRect, targetRect) {\n var distance = -1;\n // ClientRect values can be floats that differ by very small fractions of a decimal.\n // If the difference between top and bottom are within a pixel then we should treat\n // them as equivalent by using Math.floor. For instance 5.2222 and 5.222221 should be equivalent,\n // but without Math.Floor they will be handled incorrectly.\n var targetRectBottom = Math.floor(targetRect.bottom);\n var targetRectTop = Math.floor(targetRect.top);\n var activeRectTop = Math.floor(activeRect.top);\n if (targetRectBottom > activeRectTop) {\n if (!_this._shouldWrapFocus(_this._activeElement, NO_VERTICAL_WRAP)) {\n return LARGE_NEGATIVE_DISTANCE_FROM_CENTER;\n }\n return LARGE_DISTANCE_FROM_CENTER;\n }\n if ((targetTop === -1 && targetRectBottom <= activeRectTop) || targetRectTop === targetTop) {\n targetTop = targetRectTop;\n if (leftAlignment >= targetRect.left && leftAlignment <= targetRect.left + targetRect.width) {\n distance = 0;\n }\n else {\n distance = Math.abs(targetRect.left + targetRect.width / 2 - leftAlignment);\n }\n }\n return distance;\n })) {\n this._setFocusAlignment(this._activeElement, false, true);\n return true;\n }\n return false;\n };\n FocusZone.prototype._moveFocusLeft = function (theme) {\n var _this = this;\n var shouldWrap = this._shouldWrapFocus(this._activeElement, NO_HORIZONTAL_WRAP);\n if (this._moveFocus(getRTL(theme), \n // eslint-disable-next-line @typescript-eslint/no-deprecated\n function (activeRect, targetRect) {\n var distance = -1;\n var topBottomComparison;\n if (getRTL(theme)) {\n // When in RTL, this comparison should be the same as the one in _moveFocusRight for LTR.\n // Going left at a leftmost rectangle will go down a line instead of up a line like in LTR.\n // This is important, because we want to be comparing the top of the target rect\n // with the bottom of the active rect.\n topBottomComparison = parseFloat(targetRect.top.toFixed(3)) < parseFloat(activeRect.bottom.toFixed(3));\n }\n else {\n topBottomComparison = parseFloat(targetRect.bottom.toFixed(3)) > parseFloat(activeRect.top.toFixed(3));\n }\n if (topBottomComparison &&\n targetRect.right <= activeRect.right &&\n _this.props.direction !== FocusZoneDirection.vertical) {\n distance = activeRect.right - targetRect.right;\n }\n else if (!shouldWrap) {\n distance = LARGE_NEGATIVE_DISTANCE_FROM_CENTER;\n }\n return distance;\n }, undefined /*ev*/, shouldWrap)) {\n this._setFocusAlignment(this._activeElement, true, false);\n return true;\n }\n return false;\n };\n FocusZone.prototype._moveFocusRight = function (theme) {\n var _this = this;\n var shouldWrap = this._shouldWrapFocus(this._activeElement, NO_HORIZONTAL_WRAP);\n if (this._moveFocus(!getRTL(theme), \n // eslint-disable-next-line @typescript-eslint/no-deprecated\n function (activeRect, targetRect) {\n var distance = -1;\n var topBottomComparison;\n if (getRTL(theme)) {\n // When in RTL, this comparison should be the same as the one in _moveFocusLeft for LTR.\n // Going right at a rightmost rectangle will go up a line instead of down a line like in LTR.\n // This is important, because we want to be comparing the bottom of the target rect\n // with the top of the active rect.\n topBottomComparison = parseFloat(targetRect.bottom.toFixed(3)) > parseFloat(activeRect.top.toFixed(3));\n }\n else {\n topBottomComparison = parseFloat(targetRect.top.toFixed(3)) < parseFloat(activeRect.bottom.toFixed(3));\n }\n if (topBottomComparison &&\n targetRect.left >= activeRect.left &&\n _this.props.direction !== FocusZoneDirection.vertical) {\n distance = targetRect.left - activeRect.left;\n }\n else if (!shouldWrap) {\n distance = LARGE_NEGATIVE_DISTANCE_FROM_CENTER;\n }\n return distance;\n }, undefined /*ev*/, shouldWrap)) {\n this._setFocusAlignment(this._activeElement, true, false);\n return true;\n }\n return false;\n };\n FocusZone.prototype._moveFocusPaging = function (isForward, useDefaultWrap) {\n if (useDefaultWrap === void 0) { useDefaultWrap = true; }\n var element = this._activeElement;\n if (!element || !this._root.current) {\n return false;\n }\n if (this._isElementInput(element)) {\n if (!this._shouldInputLoseFocus(element, isForward)) {\n return false;\n }\n }\n var scrollableParent = findScrollableParent(element);\n if (!scrollableParent) {\n return false;\n }\n var candidateDistance = -1;\n var candidateElement = undefined;\n var targetTop = -1;\n var targetBottom = -1;\n var pagesize = scrollableParent.clientHeight;\n var activeRect = element.getBoundingClientRect();\n do {\n element = isForward\n ? getNextElement(this._root.current, element)\n : getPreviousElement(this._root.current, element);\n if (element) {\n var targetRect = element.getBoundingClientRect();\n var targetRectTop = Math.floor(targetRect.top);\n var activeRectBottom = Math.floor(activeRect.bottom);\n var targetRectBottom = Math.floor(targetRect.bottom);\n var activeRectTop = Math.floor(activeRect.top);\n var elementDistance = this._getHorizontalDistanceFromCenter(isForward, activeRect, targetRect);\n var isElementPassedPageSizeOnPagingDown = isForward && targetRectTop > activeRectBottom + pagesize;\n var isElementPassedPageSizeOnPagingUp = !isForward && targetRectBottom < activeRectTop - pagesize;\n if (isElementPassedPageSizeOnPagingDown || isElementPassedPageSizeOnPagingUp) {\n break;\n }\n if (elementDistance > -1) {\n // for paging down\n if (isForward && targetRectTop > targetTop) {\n targetTop = targetRectTop;\n candidateDistance = elementDistance;\n candidateElement = element;\n }\n else if (!isForward && targetRectBottom < targetBottom) {\n // for paging up\n targetBottom = targetRectBottom;\n candidateDistance = elementDistance;\n candidateElement = element;\n }\n else if (candidateDistance === -1 || elementDistance <= candidateDistance) {\n candidateDistance = elementDistance;\n candidateElement = element;\n }\n }\n }\n } while (element);\n var changedFocus = false;\n // Focus the closest candidate\n if (candidateElement && candidateElement !== this._activeElement) {\n changedFocus = true;\n this.focusElement(candidateElement);\n this._setFocusAlignment(candidateElement, false, true);\n }\n else if (this.props.isCircularNavigation && useDefaultWrap) {\n if (isForward) {\n return this.focusElement(getNextElement(this._root.current, this._root.current.firstElementChild, true));\n }\n return this.focusElement(getPreviousElement(this._root.current, this._root.current.lastElementChild, true, true, true));\n }\n return changedFocus;\n };\n FocusZone.prototype._setFocusAlignment = function (element, isHorizontal, isVertical) {\n if (this.props.direction === FocusZoneDirection.bidirectional &&\n (!this._focusAlignment || isHorizontal || isVertical)) {\n var rect = element.getBoundingClientRect();\n var left = rect.left + rect.width / 2;\n var top_1 = rect.top + rect.height / 2;\n if (!this._focusAlignment) {\n this._focusAlignment = { left: left, top: top_1 };\n }\n if (isHorizontal) {\n this._focusAlignment.left = left;\n }\n if (isVertical) {\n this._focusAlignment.top = top_1;\n }\n }\n };\n FocusZone.prototype._isImmediateDescendantOfZone = function (element) {\n return this._getOwnerZone(element) === this._root.current;\n };\n FocusZone.prototype._getOwnerZone = function (element) {\n var parentElement = getParent(element, ALLOW_VIRTUAL_ELEMENTS);\n while (parentElement && parentElement !== this._root.current && parentElement !== this._getDocument().body) {\n if (isElementFocusZone(parentElement)) {\n return parentElement;\n }\n parentElement = getParent(parentElement, ALLOW_VIRTUAL_ELEMENTS);\n }\n return parentElement;\n };\n FocusZone.prototype._updateTabIndexes = function (element) {\n if (!this._activeElement &&\n this.props.defaultTabbableElement &&\n typeof this.props.defaultTabbableElement === 'function') {\n this._activeElement = this.props.defaultTabbableElement(this._root.current);\n }\n if (!element && this._root.current) {\n this._defaultFocusElement = null;\n element = this._root.current;\n if (this._activeElement && !elementContains(element, this._activeElement)) {\n this._activeElement = null;\n }\n }\n // If active element changes state to disabled, set it to null.\n // Otherwise, we lose keyboard accessibility to other elements in focus zone.\n if (this._activeElement && !isElementTabbable(this._activeElement, undefined, this._inShadowRoot)) {\n this._activeElement = null;\n }\n var childNodes = element && element.children;\n for (var childIndex = 0; childNodes && childIndex < childNodes.length; childIndex++) {\n var child = childNodes[childIndex];\n if (!isElementFocusZone(child)) {\n // If the item is explicitly set to not be focusable then TABINDEX needs to be set to -1.\n if (child.getAttribute && child.getAttribute(IS_FOCUSABLE_ATTRIBUTE) === 'false') {\n child.setAttribute(TABINDEX, '-1');\n }\n if (isElementTabbable(child, undefined, this._inShadowRoot)) {\n if (this.props.disabled) {\n child.setAttribute(TABINDEX, '-1');\n }\n else if (!this._isInnerZone &&\n ((!this._activeElement && !this._defaultFocusElement) || this._activeElement === child)) {\n this._defaultFocusElement = child;\n if (child.getAttribute(TABINDEX) !== '0') {\n child.setAttribute(TABINDEX, '0');\n }\n }\n else if (child.getAttribute(TABINDEX) !== '-1') {\n child.setAttribute(TABINDEX, '-1');\n }\n }\n else if (child.tagName === 'svg' && child.getAttribute('focusable') !== 'false') {\n // Disgusting IE hack. Sad face.\n child.setAttribute('focusable', 'false');\n }\n }\n else if (child.getAttribute(IS_FOCUSABLE_ATTRIBUTE) === 'true') {\n if (!this._isInnerZone &&\n ((!this._activeElement && !this._defaultFocusElement) || this._activeElement === child)) {\n this._defaultFocusElement = child;\n if (child.getAttribute(TABINDEX) !== '0') {\n child.setAttribute(TABINDEX, '0');\n }\n }\n else if (child.getAttribute(TABINDEX) !== '-1') {\n child.setAttribute(TABINDEX, '-1');\n }\n }\n this._updateTabIndexes(child);\n }\n };\n FocusZone.prototype._isContentEditableElement = function (element) {\n return element && element.getAttribute('contenteditable') === 'true';\n };\n FocusZone.prototype._isElementInput = function (element) {\n if (element &&\n element.tagName &&\n (element.tagName.toLowerCase() === 'input' || element.tagName.toLowerCase() === 'textarea')) {\n return true;\n }\n return false;\n };\n FocusZone.prototype._shouldInputLoseFocus = function (element, isForward) {\n // If a tab was used, we want to focus on the next element.\n if (!this._processingTabKey &&\n element &&\n element.type &&\n ALLOWED_INPUT_TYPES.indexOf(element.type.toLowerCase()) > -1) {\n var selectionStart = element.selectionStart;\n var selectionEnd = element.selectionEnd;\n var isRangeSelected = selectionStart !== selectionEnd;\n var inputValue = element.value;\n var isReadonly = element.readOnly;\n // We shouldn't lose focus in the following cases:\n // 1. There is range selected.\n // 2. When selection start is larger than 0 and it is backward and not readOnly.\n // 3. when selection start is not the end of length, it is forward and not readOnly.\n // 4. We press any of the arrow keys when our handleTabKey isn't none or undefined (only losing focus if we hit\n // tab) and if shouldInputLoseFocusOnArrowKey is defined, if scenario prefers to not loose the focus which is\n // determined by calling the callback shouldInputLoseFocusOnArrowKey\n if (isRangeSelected ||\n (selectionStart > 0 && !isForward && !isReadonly) ||\n (selectionStart !== inputValue.length && isForward && !isReadonly) ||\n (!!this.props.handleTabKey &&\n !(this.props.shouldInputLoseFocusOnArrowKey && this.props.shouldInputLoseFocusOnArrowKey(element)))) {\n return false;\n }\n }\n return true;\n };\n FocusZone.prototype._shouldWrapFocus = function (element, noWrapDataAttribute) {\n return this.props.checkForNoWrap ? shouldWrapFocus(element, noWrapDataAttribute) : true;\n };\n /**\n * Returns true if the element is a descendant of the FocusZone through a React portal.\n */\n FocusZone.prototype._portalContainsElement = function (element) {\n return element && !!this._root.current && portalContainsElement(element, this._root.current);\n };\n FocusZone.prototype._getDocument = function () {\n return getDocument(this._root.current);\n };\n FocusZone.contextType = MergeStylesShadowRootContext;\n FocusZone.defaultProps = {\n isCircularNavigation: false,\n direction: FocusZoneDirection.bidirectional,\n shouldRaiseClicks: true,\n // Hardcoding uncontrolled flag for proper interop with FluentUI V9.\n 'data-tabster': '{\"uncontrolled\": {}}',\n };\n return FocusZone;\n}(React.Component));\nexport { FocusZone };\n//# sourceMappingURL=FocusZone.js.map","/**\n * {@docCategory FocusZone}\n */\nexport var FocusZoneTabbableElements = {\n /** Tabbing is not allowed */\n none: 0,\n /** All tabbing action is allowed */\n all: 1,\n /** Tabbing is allowed only on input elements */\n inputOnly: 2,\n};\n/**\n * {@docCategory FocusZone}\n */\nexport var FocusZoneDirection;\n(function (FocusZoneDirection) {\n /** Only react to up/down arrows. */\n FocusZoneDirection[FocusZoneDirection[\"vertical\"] = 0] = \"vertical\";\n /** Only react to left/right arrows. */\n FocusZoneDirection[FocusZoneDirection[\"horizontal\"] = 1] = \"horizontal\";\n /** React to all arrows. */\n FocusZoneDirection[FocusZoneDirection[\"bidirectional\"] = 2] = \"bidirectional\";\n /**\n * React to all arrows. Navigate next item in DOM on right/down arrow keys and previous - left/up arrow keys.\n * Right and Left arrow keys are swapped in RTL mode.\n */\n FocusZoneDirection[FocusZoneDirection[\"domOrder\"] = 3] = \"domOrder\";\n})(FocusZoneDirection || (FocusZoneDirection = {}));\n//# sourceMappingURL=FocusZone.types.js.map","// Do not modify this file; it is generated as part of publish.\n// The checked in version is a placeholder only and will not be updated.\nimport { setVersion } from '@fluentui/set-version';\nsetVersion('@fluentui/react-hooks', '8.8.17');\n//# sourceMappingURL=version.js.map","import { Async } from '@fluentui/utilities';\nimport * as React from 'react';\n/**\n * Hook to provide an Async instance that is automatically cleaned up on dismount.\n */\nexport function useAsync() {\n var asyncRef = React.useRef();\n if (!asyncRef.current) {\n asyncRef.current = new Async();\n }\n React.useEffect(function () {\n return function () {\n var _a;\n (_a = asyncRef.current) === null || _a === void 0 ? void 0 : _a.dispose();\n asyncRef.current = undefined;\n };\n }, []);\n return asyncRef.current;\n}\n//# sourceMappingURL=useAsync.js.map","import * as React from 'react';\n/**\n * Hook to initialize and return a constant value. Unlike `React.useMemo`, this is guaranteed to\n * always return the same value (and if the initializer is a function, only call it once).\n * This is similar to setting a private member in a class constructor.\n *\n * If the value should ever change based on dependencies, use `React.useMemo` instead.\n *\n * @param initialValue - Initial value, or function to get the initial value. Similar to `useState`,\n * only the value/function passed in the first time this is called is respected.\n * @returns The value. The identity of this value will always be the same.\n */\nexport function useConst(initialValue) {\n // Use useRef to store the value because it's the least expensive built-in hook that works here\n // (we could also use `const [value] = React.useState(initialValue)` but that's more expensive\n // internally due to reducer handling which we don't need)\n var ref = React.useRef();\n if (ref.current === undefined) {\n // Box the value in an object so we can tell if it's initialized even if the initializer\n // returns/is undefined\n ref.current = {\n value: typeof initialValue === 'function' ? initialValue() : initialValue,\n };\n }\n return ref.current.value;\n}\n//# sourceMappingURL=useConst.js.map","import * as React from 'react';\nimport { useConst } from './useConst';\n/**\n * Hook to store a value and generate callbacks for setting the value to true or false.\n * The identity of the callbacks will always stay the same.\n *\n * @param initialState - Initial value\n * @returns Array with the current value and an object containing the updater callbacks.\n */\nexport function useBoolean(initialState) {\n var _a = React.useState(initialState), value = _a[0], setValue = _a[1];\n var setTrue = useConst(function () { return function () {\n setValue(true);\n }; });\n var setFalse = useConst(function () { return function () {\n setValue(false);\n }; });\n var toggle = useConst(function () { return function () {\n setValue(function (currentValue) { return !currentValue; });\n }; });\n return [value, { setTrue: setTrue, setFalse: setFalse, toggle: toggle }];\n}\n//# sourceMappingURL=useBoolean.js.map","import * as React from 'react';\n/**\n * @deprecated Deprecated due to potential for misuse. Generally, use `React.useCallback` instead.\n * If you need a callback reference that never changes, consider `useEventCallback`.\n *\n * This hook was intended for creating callbacks which have no dependencies, and therefore never\n * need to change. It works fine if everyone using it is extremely mindful of how closures work,\n * but that's not a safe assumption--so in practice, usage of this hook tends to result in bugs\n * like unintentionally capturing the first value of a prop and not respecting updates (when\n * updates should be respected).\n */\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nexport function useConstCallback(callback) {\n var ref = React.useRef();\n if (!ref.current) {\n ref.current = callback;\n }\n return ref.current;\n}\n//# sourceMappingURL=useConstCallback.js.map","import * as React from 'react';\nimport { useConst } from './useConst';\nexport function useControllableValue(controlledValue, defaultUncontrolledValue, onChange) {\n var _a = React.useState(defaultUncontrolledValue), value = _a[0], setValue = _a[1];\n var isControlled = useConst(controlledValue !== undefined);\n var currentValue = isControlled ? controlledValue : value;\n // Duplicate the current value and onChange in refs so they're accessible from\n // setValueOrCallOnChange without creating a new callback every time\n var valueRef = React.useRef(currentValue);\n var onChangeRef = React.useRef(onChange);\n React.useEffect(function () {\n valueRef.current = currentValue;\n onChangeRef.current = onChange;\n });\n // To match the behavior of the setter returned by React.useState, this callback's identity\n // should never change. This means it MUST NOT directly reference variables that can change.\n var setValueOrCallOnChange = useConst(function () { return function (update, ev) {\n // Assuming here that TValue is not a function, because a controllable value will typically\n // be something a user can enter as input\n var newValue = typeof update === 'function' ? update(valueRef.current) : update;\n if (onChangeRef.current) {\n onChangeRef.current(ev, newValue);\n }\n if (!isControlled) {\n setValue(newValue);\n }\n }; });\n return [currentValue, setValueOrCallOnChange];\n}\n//# sourceMappingURL=useControllableValue.js.map","import * as React from 'react';\nimport { canUseDOM } from './dom/canUseDOM';\n/**\n * React currently throws a warning when using `useLayoutEffect` on the server. To get around it,\n * this hook calls `useEffect` on the server (no-op) and `useLayoutEffect` in the browser.\n *\n * Prefer `useEffect` unless you have a specific need to do something after mount and before paint,\n * such as to avoid a render flash for certain operations.\n *\n * Server-side rendering is detected based on `canUseDOM` from `@fluentui/utilities`.\n *\n * https://gist.github.com/gaearon/e7d97cdf38a2907924ea12e4ebdf3c85\n * https://github.com/reduxjs/react-redux/blob/master/src/utils/useIsomorphicLayoutEffect.js\n */\n// eslint-disable-next-line no-restricted-properties\nexport var useIsomorphicLayoutEffect = canUseDOM() ? React.useLayoutEffect : React.useEffect;\n//# sourceMappingURL=useIsomorphicLayoutEffect.js.map","import * as React from 'react';\nimport { useConst } from './useConst';\nimport { useIsomorphicLayoutEffect } from '@fluentui/utilities';\n/**\n * Modified `useCallback` that returns the same function reference every time, but internally calls\n * the most-recently passed callback implementation. Can be useful in situations such as:\n * - Event handler dependencies change too frequently, such as user props which might change on\n * every render, or volatile values such as useState/useDispatch\n * - Callback must be referenced in a captured context (such as a window event handler or unmount\n * handler that's registered once) but needs access to the latest props\n *\n * In general, prefer `useCallback` unless you've encountered one of the problems above.\n *\n * https://reactjs.org/docs/hooks-faq.html#how-to-read-an-often-changing-value-from-usecallback\n *\n * @param fn - The callback function that will be used\n * @returns A function which is referentially stable but internally calls the most recently passed callback\n */\nexport function useEventCallback(fn) {\n var callbackRef = React.useRef(function () {\n throw new Error('Cannot call an event handler while rendering');\n });\n useIsomorphicLayoutEffect(function () {\n callbackRef.current = fn;\n }, [fn]);\n // useConst rather than useCallback to ensure the reference is always stable\n // (useCallback's deps list is an optimization, not a guarantee)\n return useConst(function () { return function () {\n var args = [];\n for (var _i = 0; _i < arguments.length; _i++) {\n args[_i] = arguments[_i];\n }\n var callback = callbackRef.current;\n return callback.apply(void 0, args);\n }; });\n}\n//# sourceMappingURL=useEventCallback.js.map","import * as React from 'react';\nimport { useConst } from './useConst';\n/**\n * Hook to force update a function component by updating a dummy state.\n */\nexport function useForceUpdate() {\n var _a = React.useState(0), setValue = _a[1];\n var forceUpdate = useConst(function () { return function () { return setValue(function (value) { return ++value; }); }; });\n return forceUpdate;\n}\n//# sourceMappingURL=useForceUpdate.js.map","import * as React from 'react';\nimport { getId } from '@fluentui/utilities';\n/**\n * Hook to generate a unique ID in the global scope (spanning across duplicate copies of the same library).\n *\n * @param prefix - Optional prefix for the ID\n * @param providedId - Optional id provided by a parent component. Defaults to the provided value if present,\n * without conditioning the hook call\n * @returns The ID\n */\nexport function useId(prefix, providedId) {\n // getId should only be called once since it updates the global constant for the next ID value.\n // (While an extra update isn't likely to cause problems in practice, it's better to avoid it.)\n var ref = React.useRef(providedId);\n if (!ref.current) {\n ref.current = getId(prefix);\n }\n return ref.current;\n}\n//# sourceMappingURL=useId.js.map","import { __spreadArray } from \"tslib\";\nimport * as React from 'react';\n/**\n * React hook to merge multiple React refs (either MutableRefObjects or ref callbacks) into a single ref callback that\n * updates all provided refs\n * @param refs - Refs to collectively update with one ref value.\n * @returns A function with an attached \"current\" prop, so that it can be treated like a RefObject.\n */\nexport function useMergedRefs() {\n var refs = [];\n for (var _i = 0; _i < arguments.length; _i++) {\n refs[_i] = arguments[_i];\n }\n var mergedCallback = React.useCallback(function (value) {\n // Update the \"current\" prop hanging on the function.\n mergedCallback.current = value;\n for (var _i = 0, refs_1 = refs; _i < refs_1.length; _i++) {\n var ref = refs_1[_i];\n if (typeof ref === 'function') {\n ref(value);\n }\n else if (ref) {\n // work around the immutability of the React.Ref type\n ref.current = value;\n }\n }\n }, __spreadArray([], refs, true));\n return mergedCallback;\n}\n//# sourceMappingURL=useMergedRefs.js.map","import * as React from 'react';\n/**\n * Hook which asynchronously executes a callback once the component has been mounted.\n *\n * @param callback - Function to call before mount.\n */\nexport var useMount = function (callback) {\n var mountRef = React.useRef(callback);\n mountRef.current = callback;\n React.useEffect(function () {\n var _a;\n (_a = mountRef.current) === null || _a === void 0 ? void 0 : _a.call(mountRef);\n }, []);\n};\n//# sourceMappingURL=useMount.js.map","import * as React from 'react';\n/**\n * Hook which synchronously executes a callback once the component has been mounted.\n *\n * `WARNING` This should only be used if you need to perform an action after the component has been mounted and\n * before the browser paints. useMountSync will trigger debug warnings in server-rendered scenarios and should be used\n * sparingly.\n *\n * @deprecated Consider to use React.useEffect() or React.useLayoutEffect() directly based on a use case\n *\n * @param callback - Function to call once the component has been mounted.\n */\nexport var useMountSync = function (callback) {\n var mountRef = React.useRef(callback);\n mountRef.current = callback;\n // eslint-disable-next-line no-restricted-properties\n React.useLayoutEffect(function () {\n var _a;\n (_a = mountRef.current) === null || _a === void 0 ? void 0 : _a.call(mountRef);\n }, []);\n};\n//# sourceMappingURL=useMountSync.js.map","import { on } from '@fluentui/utilities';\nimport * as React from 'react';\n/**\n * Hook to attach an event handler on mount and handle cleanup.\n * @param element - Element (or ref to an element) to attach the event handler to\n * @param eventName - The event to attach a handler for\n * @param callback - The handler for the event\n * @param useCapture - Whether or not to attach the handler for the capture phase\n */\nexport function useOnEvent(element, eventName, callback, useCapture) {\n // Use a ref for the callback to prevent repeatedly attaching/unattaching callbacks that are unstable across renders\n var callbackRef = React.useRef(callback);\n callbackRef.current = callback;\n React.useEffect(function () {\n var actualElement = element && 'current' in element ? element.current : element;\n if (!actualElement || !actualElement.addEventListener) {\n return;\n }\n var dispose = on(actualElement, eventName, function (ev) { return callbackRef.current(ev); }, useCapture);\n return dispose;\n }, [element, eventName, useCapture]);\n}\n//# sourceMappingURL=useOnEvent.js.map","import * as React from 'react';\n/**\n * Hook keeping track of a given value from a previous execution of the component the Hook is used in.\n *\n * See [React Hooks FAQ](https://reactjs.org/docs/hooks-faq.html#how-to-get-the-previous-props-or-state)\n */\nexport function usePrevious(value) {\n var ref = React.useRef();\n React.useEffect(function () {\n ref.current = value;\n });\n return ref.current;\n}\n//# sourceMappingURL=usePrevious.js.map","import * as React from 'react';\n/**\n * Creates a ref, and calls a callback whenever the ref changes to a non-null value. The callback can optionally return\n * a cleanup function that'll be called before the value changes, and when the ref is unmounted.\n *\n * This can be used to work around a limitation that useEffect cannot depend on `ref.current` (see\n * https://github.com/facebook/react/issues/14387#issuecomment-503616820).\n *\n * Usage example:\n * ```ts\n * const myRef = useRefEffect(element => {\n * ...\n * return () => { ... cleanup ... };\n * });\n * ```\n * ```jsx\n *
\n * ```\n *\n * @param callback - Called whenever the ref's value changes to non-null. Can optionally return a cleanup function.\n * @param initial - (Optional) The initial value for the ref.\n *\n * @returns A function that should be called to set the ref's value. The object also has a `.current` member that can be\n * used to access the ref's value (like a normal RefObject). It can be hooked up to an element's `ref` property.\n */\nexport function useRefEffect(callback, initial) {\n if (initial === void 0) { initial = null; }\n var createRefCallback = function () {\n var refCallback = function (value) {\n if (data.ref.current !== value) {\n if (data.cleanup) {\n data.cleanup();\n data.cleanup = undefined;\n }\n data.ref.current = value;\n if (value !== null) {\n data.cleanup = data.callback(value);\n }\n }\n };\n refCallback.current = initial;\n return refCallback;\n };\n var data = React.useRef({\n ref: createRefCallback(),\n callback: callback,\n }).current;\n data.callback = callback;\n return data.ref;\n}\n//# sourceMappingURL=useRefEffect.js.map","import * as React from 'react';\nimport { useConst } from './useConst';\n/**\n * Returns a wrapper function for `setInterval` which automatically handles disposal.\n */\nexport var useSetInterval = function () {\n var intervalIds = useConst({});\n React.useEffect(function () { return function () {\n for (var _i = 0, _a = Object.keys(intervalIds); _i < _a.length; _i++) {\n var id = _a[_i];\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n clearInterval(id);\n }\n }; }, \n // useConst ensures this will never change, but react-hooks/exhaustive-deps doesn't know that\n [intervalIds]);\n return useConst({\n setInterval: function (func, duration) {\n var id = setInterval(func, duration);\n intervalIds[id] = 1;\n return id;\n },\n clearInterval: function (id) {\n delete intervalIds[id];\n clearInterval(id);\n },\n });\n};\n//# sourceMappingURL=useSetInterval.js.map","import * as React from 'react';\nimport { useConst } from './useConst';\n/**\n * Returns a wrapper function for `setTimeout` which automatically handles disposal.\n */\nexport var useSetTimeout = function () {\n var timeoutIds = useConst({});\n // Cleanup function.\n React.useEffect(function () { return function () {\n for (var _i = 0, _a = Object.keys(timeoutIds); _i < _a.length; _i++) {\n var id = _a[_i];\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n clearTimeout(id);\n }\n }; }, \n // useConst ensures this will never change, but react-hooks/exhaustive-deps doesn't know that\n [timeoutIds]);\n // Return wrapper which will auto cleanup.\n return useConst({\n setTimeout: function (func, duration) {\n var id = setTimeout(func, duration);\n timeoutIds[id] = 1;\n return id;\n },\n clearTimeout: function (id) {\n delete timeoutIds[id];\n clearTimeout(id);\n },\n });\n};\n//# sourceMappingURL=useSetTimeout.js.map","import { getDocument } from '@fluentui/utilities';\nimport * as React from 'react';\nimport { useWindow } from '@fluentui/react-window-provider';\n/**\n * Hook to calculate and cache the target element specified by the given target attribute,\n * as well as the target element's (or host element's) parent window\n * @param target- Target selector passed to the component as a property, describing the element that\n * the callout should target\n * @param hostElement- The callout's host element, used for determining the parent window.\n */\nexport function useTarget(target, hostElement) {\n var _a, _b, _c;\n var previousTargetProp = React.useRef();\n var targetRef = React.useRef(null);\n /**\n * Stores an instance of Window, used to check\n * for server side rendering and if focus was lost.\n */\n var targetWindow = useWindow();\n // If the target element changed, find the new one. If we are tracking\n // target with class name, always find element because we do not know if\n // fabric has rendered a new element and disposed the old element.\n if (!target || target !== previousTargetProp.current || typeof target === 'string') {\n var currentElement = hostElement === null || hostElement === void 0 ? void 0 : hostElement.current;\n if (target) {\n if (typeof target === 'string') {\n // If element is part of shadow dom, then querySelector on shadow root, else query on document\n if ((_a = currentElement === null || currentElement === void 0 ? void 0 : currentElement.getRootNode()) === null || _a === void 0 ? void 0 : _a.host) {\n targetRef.current = (_c = (_b = currentElement === null || currentElement === void 0 ? void 0 : currentElement.getRootNode()) === null || _b === void 0 ? void 0 : _b.querySelector(target)) !== null && _c !== void 0 ? _c : null;\n }\n else {\n var currentDoc = getDocument(currentElement);\n targetRef.current = currentDoc ? currentDoc.querySelector(target) : null;\n }\n }\n else if ('stopPropagation' in target) {\n targetRef.current = target;\n }\n else if ('getBoundingClientRect' in target) {\n targetRef.current = target;\n }\n else if ('current' in target) {\n targetRef.current = target.current;\n }\n else {\n targetRef.current = target;\n }\n }\n previousTargetProp.current = target;\n }\n return [targetRef, targetWindow];\n}\n//# sourceMappingURL=useTarget.js.map","import * as React from 'react';\n/**\n * Hook which synchronously executes a callback when the component is about to unmount.\n *\n * @param callback - Function to call during unmount.\n */\nexport var useUnmount = function (callback) {\n var unmountRef = React.useRef(callback);\n unmountRef.current = callback;\n React.useEffect(function () { return function () {\n var _a;\n (_a = unmountRef.current) === null || _a === void 0 ? void 0 : _a.call(unmountRef);\n }; }, []);\n};\n//# sourceMappingURL=useUnmount.js.map","import { __assign } from \"tslib\";\nimport * as React from 'react';\nimport { warn, warnControlledUsage, warnConditionallyRequiredProps, warnDeprecations, warnMutuallyExclusive, } from '@fluentui/utilities';\nimport { usePrevious } from './usePrevious';\nimport { useConst } from './useConst';\nvar warningId = 0;\n/**\n * Only in development mode, display console warnings when certain conditions are met.\n * Note that all warnings except `controlledUsage` will only be shown on first render\n * (new `controlledUsage` warnings may be shown later due to prop changes).\n */\nexport function useWarnings(options) {\n if (process.env.NODE_ENV !== 'production') {\n var name_1 = options.name, props = options.props, _a = options.other, other = _a === void 0 ? [] : _a, conditionallyRequired = options.conditionallyRequired, deprecations = options.deprecations, mutuallyExclusive = options.mutuallyExclusive, controlledUsage = options.controlledUsage;\n /* eslint-disable react-hooks/rules-of-hooks -- build-time conditional */\n var hasWarnedRef = React.useRef(false);\n var componentId = useConst(function () { return \"useWarnings_\".concat(warningId++); });\n var oldProps = usePrevious(props);\n /* eslint-enable react-hooks/rules-of-hooks */\n // Warn synchronously (not in useEffect) on first render to make debugging easier.\n if (!hasWarnedRef.current) {\n hasWarnedRef.current = true;\n for (var _i = 0, other_1 = other; _i < other_1.length; _i++) {\n var warning = other_1[_i];\n warn(warning);\n }\n if (conditionallyRequired) {\n for (var _b = 0, conditionallyRequired_1 = conditionallyRequired; _b < conditionallyRequired_1.length; _b++) {\n var req = conditionallyRequired_1[_b];\n warnConditionallyRequiredProps(name_1, props, req.requiredProps, req.conditionalPropName, req.condition);\n }\n }\n deprecations && warnDeprecations(name_1, props, deprecations);\n mutuallyExclusive && warnMutuallyExclusive(name_1, props, mutuallyExclusive);\n }\n // Controlled usage warnings may be displayed on either first or subsequent renders due to\n // prop changes. Note that it's safe to run this synchronously (not in useEffect) even in\n // concurrent mode because `warnControlledUsage` internally tracks which warnings have been\n // displayed for each component instance (so nothing will be displayed twice).\n controlledUsage && warnControlledUsage(__assign(__assign({}, controlledUsage), { componentId: componentId, props: props, componentName: name_1, oldProps: oldProps }));\n }\n}\n//# sourceMappingURL=useWarnings.js.map","import * as React from 'react';\n/**\n * Context for providing the window.\n */\n// eslint-disable-next-line @fluentui/no-context-default-value\nexport var WindowContext = React.createContext({\n // eslint-disable-next-line no-restricted-globals\n window: typeof window === 'object' ? window : undefined,\n});\n/**\n * Hook to access the window object. This can be overridden contextually using the `WindowProvider`.\n */\nexport var useWindow = function () { return React.useContext(WindowContext).window; };\n/**\n * Hook to access the document object. This can be overridden contextually using the `WindowProvider`.\n */\nexport var useDocument = function () { var _a; return (_a = React.useContext(WindowContext).window) === null || _a === void 0 ? void 0 : _a.document; };\n/**\n * Component to provide the window object contextually. This is useful when rendering content to an element\n * contained within a child window or iframe element, where event handlers and styling must be projected\n * to an alternative window or document.\n */\nexport var WindowProvider = function (props) {\n return React.createElement(WindowContext.Provider, { value: props }, props.children);\n};\n//# sourceMappingURL=WindowProvider.js.map","// Do not modify this file; it is generated as part of publish.\n// The checked in version is a placeholder only and will not be updated.\nimport { setVersion } from '@fluentui/set-version';\nsetVersion('@fluentui/react-window-provider', '2.2.29');\n//# sourceMappingURL=version.js.map","export var DirectionalHint = {\n /**\n * Appear above the target element, with the left edges of the callout and target aligning.\n */\n topLeftEdge: 0,\n /**\n * Appear above the target element, with the centers of the callout and target aligning.\n */\n topCenter: 1,\n /**\n * Appear above the target element, with the right edges of the callout and target aligning.\n */\n topRightEdge: 2,\n /**\n * Appear above the target element, aligning with the target element such that the callout tends toward\n * the center of the screen.\n */\n topAutoEdge: 3,\n /**\n * Appear below the target element, with the left edges of the callout and target aligning.\n */\n bottomLeftEdge: 4,\n /**\n * Appear below the target element, with the centers of the callout and target aligning.\n */\n bottomCenter: 5,\n /**\n * Appear below the target element, with the right edges of the callout and target aligning.\n */\n bottomRightEdge: 6,\n /**\n * Appear below the target element, aligning with the target element such that the callout tends toward\n * the center of the screen.\n */\n bottomAutoEdge: 7,\n /**\n * Appear to the left of the target element, with the top edges of the callout and target aligning.\n */\n leftTopEdge: 8,\n /**\n * Appear to the left of the target element, with the centers of the callout and target aligning.\n */\n leftCenter: 9,\n /**\n * Appear to the left of the target element, with the bottom edges of the callout and target aligning.\n */\n leftBottomEdge: 10,\n /**\n * Appear to the right of the target element, with the top edges of the callout and target aligning.\n */\n rightTopEdge: 11,\n /**\n * Appear to the right of the target element, with the centers of the callout and target aligning.\n */\n rightCenter: 12,\n /**\n * Appear to the right of the target element, with the bottom edges of the callout and target aligning.\n */\n rightBottomEdge: 13,\n};\n//# sourceMappingURL=DirectionalHint.js.map","import { __assign, __decorate, __extends } from \"tslib\";\nimport * as React from 'react';\nimport { BaseButton } from '../BaseButton';\nimport { customizable, nullRender } from '../../../Utilities';\nimport { getStyles } from './ActionButton.styles';\n/**\n * {@docCategory Button}\n */\nvar ActionButton = /** @class */ (function (_super) {\n __extends(ActionButton, _super);\n function ActionButton() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n ActionButton.prototype.render = function () {\n var _a = this.props, styles = _a.styles, theme = _a.theme;\n return (React.createElement(BaseButton, __assign({}, this.props, { variantClassName: \"ms-Button--action ms-Button--command\", styles: getStyles(theme, styles), onRenderDescription: nullRender })));\n };\n ActionButton = __decorate([\n customizable('ActionButton', ['theme', 'styles'], true)\n ], ActionButton);\n return ActionButton;\n}(React.Component));\nexport { ActionButton };\n//# sourceMappingURL=ActionButton.js.map","import { concatStyleSets, HighContrastSelector } from '../../../Styling';\nimport { memoizeFunction } from '../../../Utilities';\nimport { getStyles as getBaseButtonStyles } from '../BaseButton.styles';\nvar DEFAULT_BUTTON_HEIGHT = '40px';\nvar DEFAULT_PADDING = '0 4px';\nexport var getStyles = memoizeFunction(function (theme, customStyles) {\n var _a, _b, _c;\n var baseButtonStyles = getBaseButtonStyles(theme);\n var actionButtonStyles = {\n root: (_a = {\n padding: DEFAULT_PADDING,\n height: DEFAULT_BUTTON_HEIGHT,\n color: theme.palette.neutralPrimary,\n backgroundColor: 'transparent',\n border: '1px solid transparent'\n },\n _a[HighContrastSelector] = {\n borderColor: 'Window',\n },\n _a),\n rootHovered: (_b = {\n color: theme.palette.themePrimary\n },\n _b[HighContrastSelector] = {\n color: 'Highlight',\n },\n _b),\n iconHovered: {\n color: theme.palette.themePrimary,\n },\n rootPressed: {\n color: theme.palette.black,\n },\n rootExpanded: {\n color: theme.palette.themePrimary,\n },\n iconPressed: {\n color: theme.palette.themeDarker,\n },\n rootDisabled: (_c = {\n color: theme.palette.neutralTertiary,\n backgroundColor: 'transparent',\n borderColor: 'transparent'\n },\n _c[HighContrastSelector] = {\n color: 'GrayText',\n },\n _c),\n rootChecked: {\n color: theme.palette.black,\n },\n iconChecked: {\n color: theme.palette.themeDarker,\n },\n flexContainer: {\n justifyContent: 'flex-start',\n },\n icon: {\n color: theme.palette.themeDarkAlt,\n },\n iconDisabled: {\n color: 'inherit',\n },\n menuIcon: {\n color: theme.palette.neutralSecondary,\n },\n textContainer: {\n flexGrow: 0,\n },\n };\n return concatStyleSets(baseButtonStyles, actionButtonStyles, customStyles);\n});\n//# sourceMappingURL=ActionButton.styles.js.map","import { memoizeFunction } from '../../Utilities';\nimport { getGlobalClassNames, mergeStyleSets } from '../../Styling';\nexport var ButtonGlobalClassNames = {\n msButton: 'ms-Button',\n msButtonHasMenu: 'ms-Button--hasMenu',\n msButtonIcon: 'ms-Button-icon',\n msButtonMenuIcon: 'ms-Button-menuIcon',\n msButtonLabel: 'ms-Button-label',\n msButtonDescription: 'ms-Button-description',\n msButtonScreenReaderText: 'ms-Button-screenReaderText',\n msButtonFlexContainer: 'ms-Button-flexContainer',\n msButtonTextContainer: 'ms-Button-textContainer',\n};\nexport var getBaseButtonClassNames = memoizeFunction(function (theme, styles, className, variantClassName, iconClassName, menuIconClassName, disabled, hasMenu, checked, expanded, isSplit) {\n var _a, _b;\n var classNames = getGlobalClassNames(ButtonGlobalClassNames, theme || {});\n var isExpanded = expanded && !isSplit;\n return mergeStyleSets(styles.__shadowConfig__, {\n root: [\n classNames.msButton,\n styles.root,\n variantClassName,\n checked && ['is-checked', styles.rootChecked],\n isExpanded && [\n 'is-expanded',\n styles.rootExpanded,\n (_a = {},\n _a[\":hover .\".concat(classNames.msButtonIcon)] = styles.iconExpandedHovered,\n // menuIcon falls back to rootExpandedHovered to support original behavior\n _a[\":hover .\".concat(classNames.msButtonMenuIcon)] = styles.menuIconExpandedHovered || styles.rootExpandedHovered,\n _a[':hover'] = styles.rootExpandedHovered,\n _a),\n ],\n hasMenu && [ButtonGlobalClassNames.msButtonHasMenu, styles.rootHasMenu],\n disabled && ['is-disabled', styles.rootDisabled],\n !disabled &&\n !isExpanded &&\n !checked && (_b = {\n ':hover': styles.rootHovered\n },\n _b[\":hover .\".concat(classNames.msButtonLabel)] = styles.labelHovered,\n _b[\":hover .\".concat(classNames.msButtonIcon)] = styles.iconHovered,\n _b[\":hover .\".concat(classNames.msButtonDescription)] = styles.descriptionHovered,\n _b[\":hover .\".concat(classNames.msButtonMenuIcon)] = styles.menuIconHovered,\n _b[':focus'] = styles.rootFocused,\n _b[':active'] = styles.rootPressed,\n _b[\":active .\".concat(classNames.msButtonIcon)] = styles.iconPressed,\n _b[\":active .\".concat(classNames.msButtonDescription)] = styles.descriptionPressed,\n _b[\":active .\".concat(classNames.msButtonMenuIcon)] = styles.menuIconPressed,\n _b),\n disabled && checked && [styles.rootCheckedDisabled],\n !disabled &&\n checked && {\n ':hover': styles.rootCheckedHovered,\n ':active': styles.rootCheckedPressed,\n },\n className,\n ],\n flexContainer: [classNames.msButtonFlexContainer, styles.flexContainer],\n textContainer: [classNames.msButtonTextContainer, styles.textContainer],\n icon: [\n classNames.msButtonIcon,\n iconClassName,\n styles.icon,\n isExpanded && styles.iconExpanded,\n checked && styles.iconChecked,\n disabled && styles.iconDisabled,\n ],\n label: [classNames.msButtonLabel, styles.label, checked && styles.labelChecked, disabled && styles.labelDisabled],\n menuIcon: [\n classNames.msButtonMenuIcon,\n menuIconClassName,\n styles.menuIcon,\n checked && styles.menuIconChecked,\n disabled && !isSplit && styles.menuIconDisabled,\n !disabled &&\n !isExpanded &&\n !checked && {\n ':hover': styles.menuIconHovered,\n ':active': styles.menuIconPressed,\n },\n isExpanded && ['is-expanded', styles.menuIconExpanded],\n ],\n description: [\n classNames.msButtonDescription,\n styles.description,\n checked && styles.descriptionChecked,\n disabled && styles.descriptionDisabled,\n ],\n screenReaderText: [classNames.msButtonScreenReaderText, styles.screenReaderText],\n });\n});\n//# sourceMappingURL=BaseButton.classNames.js.map","import { __assign, __extends, __rest } from \"tslib\";\nimport * as React from 'react';\nimport { anchorProperties, assign, buttonProperties, createMergedRef, css, getId, getNativeProps, initializeComponentRef, memoizeFunction, mergeAriaAttributeValues, nullRender, portalContainsElement, setFocusVisibility, warnConditionallyRequiredProps, warnDeprecations, Async, EventGroup, FocusRects, FocusRectsContext, KeyCodes, } from '../../Utilities';\nimport { Icon, FontIcon, ImageIcon } from '../../Icon';\nimport { DirectionalHint } from '../../common/DirectionalHint';\nimport { ContextualMenu } from '../../ContextualMenu';\nimport { getBaseButtonClassNames } from './BaseButton.classNames';\nimport { getSplitButtonClassNames as getBaseSplitButtonClassNames } from './SplitButton/SplitButton.classNames';\nimport { KeytipData } from '../../KeytipData';\nimport { composeComponentAs } from '../../Utilities';\nvar TouchIdleDelay = 500; /* ms */\nvar COMPONENT_NAME = 'BaseButton';\n/**\n * {@docCategory Button}\n */\nvar BaseButton = /** @class */ (function (_super) {\n __extends(BaseButton, _super);\n function BaseButton(props) {\n var _this = _super.call(this, props) || this;\n _this._buttonElement = React.createRef();\n _this._splitButtonContainer = React.createRef();\n _this._mergedRef = createMergedRef();\n _this._renderedVisibleMenu = false;\n _this._getMemoizedMenuButtonKeytipProps = memoizeFunction(function (keytipProps) {\n return __assign(__assign({}, keytipProps), { hasMenu: true });\n });\n _this._onRenderIcon = function (buttonProps, defaultRender) {\n var iconProps = _this.props.iconProps;\n if (iconProps && (iconProps.iconName !== undefined || iconProps.imageProps)) {\n var className = iconProps.className, imageProps = iconProps.imageProps, rest = __rest(iconProps, [\"className\", \"imageProps\"]);\n // If the styles prop is specified as part of iconProps, fall back to regular Icon as FontIcon and ImageIcon\n // do not have this prop.\n if (iconProps.styles) {\n return React.createElement(Icon, __assign({ className: css(_this._classNames.icon, className), imageProps: imageProps }, rest));\n }\n if (iconProps.iconName) {\n return React.createElement(FontIcon, __assign({ className: css(_this._classNames.icon, className) }, rest));\n }\n if (imageProps) {\n return React.createElement(ImageIcon, __assign({ className: css(_this._classNames.icon, className), imageProps: imageProps }, rest));\n }\n }\n return null;\n };\n _this._onRenderTextContents = function () {\n var _a = _this.props, text = _a.text, children = _a.children, \n // eslint-disable-next-line @typescript-eslint/no-deprecated\n _b = _a.secondaryText, \n // eslint-disable-next-line @typescript-eslint/no-deprecated\n secondaryText = _b === void 0 ? _this.props.description : _b, _c = _a.onRenderText, onRenderText = _c === void 0 ? _this._onRenderText : _c, _d = _a.onRenderDescription, onRenderDescription = _d === void 0 ? _this._onRenderDescription : _d;\n if (text || typeof children === 'string' || secondaryText) {\n return (React.createElement(\"span\", { className: _this._classNames.textContainer },\n onRenderText(_this.props, _this._onRenderText),\n onRenderDescription(_this.props, _this._onRenderDescription)));\n }\n return [onRenderText(_this.props, _this._onRenderText), onRenderDescription(_this.props, _this._onRenderDescription)];\n };\n _this._onRenderText = function () {\n var text = _this.props.text;\n var children = _this.props.children;\n // For backwards compat, we should continue to take in the text content from children.\n if (text === undefined && typeof children === 'string') {\n text = children;\n }\n if (_this._hasText()) {\n return (React.createElement(\"span\", { key: _this._labelId, className: _this._classNames.label, id: _this._labelId }, text));\n }\n return null;\n };\n _this._onRenderChildren = function () {\n var children = _this.props.children;\n // If children is just a string, either it or the text will be rendered via onRenderLabel\n // If children is another component, it will be rendered after text\n if (typeof children === 'string') {\n return null;\n }\n return children;\n };\n _this._onRenderDescription = function (props) {\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n var _a = props.secondaryText, secondaryText = _a === void 0 ? _this.props.description : _a;\n // ms-Button-description is only shown when the button type is compound.\n // In other cases it will not be displayed.\n return secondaryText ? (React.createElement(\"span\", { key: _this._descriptionId, className: _this._classNames.description, id: _this._descriptionId }, secondaryText)) : null;\n };\n _this._onRenderAriaDescription = function () {\n var ariaDescription = _this.props.ariaDescription;\n // If ariaDescription is given, descriptionId will be assigned to ariaDescriptionSpan,\n // otherwise it will be assigned to descriptionSpan.\n return ariaDescription ? (React.createElement(\"span\", { className: _this._classNames.screenReaderText, id: _this._ariaDescriptionId }, ariaDescription)) : null;\n };\n _this._onRenderMenuIcon = function (props) {\n var menuIconProps = _this.props.menuIconProps;\n return React.createElement(FontIcon, __assign({ iconName: \"ChevronDown\" }, menuIconProps, { className: _this._classNames.menuIcon }));\n };\n _this._onRenderMenu = function (menuProps) {\n var MenuType = _this.props.menuAs ? composeComponentAs(_this.props.menuAs, ContextualMenu) : ContextualMenu;\n return React.createElement(MenuType, __assign({}, menuProps));\n };\n _this._onDismissMenu = function (ev) {\n var menuProps = _this.props.menuProps;\n if (menuProps && menuProps.onDismiss) {\n menuProps.onDismiss(ev);\n }\n if (!ev || !ev.defaultPrevented) {\n _this._dismissMenu();\n }\n };\n _this._dismissMenu = function () {\n _this._menuShouldFocusOnMount = undefined;\n _this._menuShouldFocusOnContainer = undefined;\n _this.setState({ menuHidden: true });\n };\n _this._openMenu = function (shouldFocusOnContainer, shouldFocusOnMount) {\n if (shouldFocusOnMount === void 0) { shouldFocusOnMount = true; }\n if (_this.props.menuProps) {\n _this._menuShouldFocusOnContainer = shouldFocusOnContainer;\n _this._menuShouldFocusOnMount = shouldFocusOnMount;\n _this._renderedVisibleMenu = true;\n _this.setState({ menuHidden: false });\n }\n };\n _this._onToggleMenu = function (shouldFocusOnContainer) {\n var shouldFocusOnMount = true;\n if (_this.props.menuProps && _this.props.menuProps.shouldFocusOnMount === false) {\n shouldFocusOnMount = false;\n }\n _this.state.menuHidden ? _this._openMenu(shouldFocusOnContainer, shouldFocusOnMount) : _this._dismissMenu();\n };\n _this._onSplitContainerFocusCapture = function (ev) {\n var container = _this._splitButtonContainer.current;\n // If the target is coming from the portal we do not need to set focus on the container.\n if (!container || (ev.target && portalContainsElement(ev.target, container))) {\n return;\n }\n // We should never be able to focus the individual buttons in a split button. Focus\n // should always remain on the container.\n container.focus();\n };\n _this._onSplitButtonPrimaryClick = function (ev) {\n if (!_this.state.menuHidden) {\n _this._dismissMenu();\n }\n // toggle split buttons need two separate targets, even for touch\n var singleTouchTarget = _this._processingTouch && !_this.props.toggle;\n if (!singleTouchTarget && _this.props.onClick) {\n _this.props.onClick(ev);\n }\n else if (singleTouchTarget) {\n _this._onMenuClick(ev);\n }\n };\n _this._onKeyDown = function (ev) {\n // explicity cancelling event so click won't fire after this\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n if (_this.props.disabled && (ev.which === KeyCodes.enter || ev.which === KeyCodes.space)) {\n ev.preventDefault();\n ev.stopPropagation();\n }\n else if (!_this.props.disabled) {\n if (_this.props.menuProps) {\n _this._onMenuKeyDown(ev);\n }\n else if (_this.props.onKeyDown !== undefined) {\n _this.props.onKeyDown(ev); // not cancelling event because it's not disabled\n }\n }\n };\n _this._onKeyUp = function (ev) {\n if (!_this.props.disabled && _this.props.onKeyUp !== undefined) {\n _this.props.onKeyUp(ev); // not cancelling event because it's not disabled\n }\n };\n _this._onKeyPress = function (ev) {\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n if (!_this.props.disabled && _this.props.onKeyPress !== undefined) {\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n _this.props.onKeyPress(ev); // not cancelling event because it's not disabled\n }\n };\n _this._onMouseUp = function (ev) {\n if (!_this.props.disabled && _this.props.onMouseUp !== undefined) {\n _this.props.onMouseUp(ev); // not cancelling event because it's not disabled\n }\n };\n _this._onMouseDown = function (ev) {\n if (!_this.props.disabled && _this.props.onMouseDown !== undefined) {\n _this.props.onMouseDown(ev); // not cancelling event because it's not disabled\n }\n };\n _this._onClick = function (ev) {\n if (!_this.props.disabled) {\n if (_this.props.menuProps) {\n _this._onMenuClick(ev);\n }\n else if (_this.props.onClick !== undefined) {\n _this.props.onClick(ev); // not cancelling event because it's not disabled\n }\n }\n };\n _this._onSplitButtonContainerKeyDown = function (ev) {\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n if (ev.which === KeyCodes.enter || ev.which === KeyCodes.space) {\n if (_this._buttonElement.current) {\n _this._buttonElement.current.click();\n ev.preventDefault();\n ev.stopPropagation();\n }\n }\n else {\n _this._onMenuKeyDown(ev);\n }\n };\n _this._onMenuKeyDown = function (ev) {\n var _a;\n if (_this.props.disabled) {\n return;\n }\n if (_this.props.onKeyDown) {\n _this.props.onKeyDown(ev);\n }\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n var isUp = ev.which === KeyCodes.up;\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n var isDown = ev.which === KeyCodes.down;\n if (!ev.defaultPrevented && _this._isValidMenuOpenKey(ev)) {\n var onMenuClick = _this.props.onMenuClick;\n if (onMenuClick) {\n onMenuClick(ev, _this.props);\n }\n _this._onToggleMenu(false);\n ev.preventDefault();\n ev.stopPropagation();\n }\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n if (ev.which === KeyCodes.enter || ev.which === KeyCodes.space) {\n // We manually set the focus visibility to true if opening via Enter or Space to account for the scenario where\n // a user clicks on the button, closes the menu and then opens it via keyboard. In this scenario our default logic\n // for setting focus visibility is not triggered since there is no keyboard navigation present beforehand.\n setFocusVisibility(true, ev.target, (_a = _this.context) === null || _a === void 0 ? void 0 : _a.registeredProviders);\n }\n if (!(ev.altKey || ev.metaKey) && (isUp || isDown)) {\n // Suppose a menu, with shouldFocusOnMount: false, is open, and user wants to keyboard to the menu items\n // We need to re-render the menu with shouldFocusOnMount as true.\n if (!_this.state.menuHidden && _this.props.menuProps) {\n var currentShouldFocusOnMount = _this._menuShouldFocusOnMount !== undefined\n ? _this._menuShouldFocusOnMount\n : _this.props.menuProps.shouldFocusOnMount;\n if (!currentShouldFocusOnMount) {\n ev.preventDefault();\n ev.stopPropagation();\n _this._menuShouldFocusOnMount = true;\n _this.forceUpdate();\n }\n }\n }\n };\n _this._onTouchStart = function () {\n if (_this._isSplitButton &&\n _this._splitButtonContainer.current &&\n !('onpointerdown' in _this._splitButtonContainer.current)) {\n _this._handleTouchAndPointerEvent();\n }\n };\n _this._onMenuClick = function (ev) {\n var _a = _this.props, onMenuClick = _a.onMenuClick, menuProps = _a.menuProps;\n if (onMenuClick) {\n onMenuClick(ev, _this.props);\n }\n // focus on the container by default when the menu is opened with a click event\n // this differentiates from a keyboard interaction triggering the click event\n var shouldFocusOnContainer = typeof (menuProps === null || menuProps === void 0 ? void 0 : menuProps.shouldFocusOnContainer) === 'boolean'\n ? menuProps.shouldFocusOnContainer\n : ev.nativeEvent.pointerType === 'mouse';\n if (!ev.defaultPrevented) {\n _this._onToggleMenu(shouldFocusOnContainer);\n ev.preventDefault();\n ev.stopPropagation();\n }\n };\n initializeComponentRef(_this);\n _this._async = new Async(_this);\n _this._events = new EventGroup(_this);\n warnConditionallyRequiredProps(COMPONENT_NAME, props, ['menuProps', 'onClick'], 'split', _this.props.split);\n warnDeprecations(COMPONENT_NAME, props, {\n rootProps: undefined,\n description: 'secondaryText',\n toggled: 'checked',\n });\n _this._labelId = getId();\n _this._descriptionId = getId();\n _this._ariaDescriptionId = getId();\n _this.state = {\n menuHidden: true,\n };\n return _this;\n }\n Object.defineProperty(BaseButton.prototype, \"_isSplitButton\", {\n get: function () {\n return !!this.props.menuProps && !!this.props.onClick && this.props.split === true;\n },\n enumerable: false,\n configurable: true\n });\n BaseButton.prototype.render = function () {\n var _a;\n var _b = this.props, ariaDescription = _b.ariaDescription, ariaLabel = _b.ariaLabel, ariaHidden = _b.ariaHidden, className = _b.className, disabled = _b.disabled, allowDisabledFocus = _b.allowDisabledFocus, primaryDisabled = _b.primaryDisabled, \n // eslint-disable-next-line @typescript-eslint/no-deprecated\n _c = _b.secondaryText, \n // eslint-disable-next-line @typescript-eslint/no-deprecated\n secondaryText = _c === void 0 ? this.props.description : _c, href = _b.href, iconProps = _b.iconProps, menuIconProps = _b.menuIconProps, styles = _b.styles, checked = _b.checked, variantClassName = _b.variantClassName, theme = _b.theme, toggle = _b.toggle, getClassNames = _b.getClassNames, role = _b.role;\n var menuHidden = this.state.menuHidden;\n // Button is disabled if the whole button (in case of splitButton is disabled) or if the primary action is disabled\n var isPrimaryButtonDisabled = disabled || primaryDisabled;\n this._classNames = getClassNames\n ? getClassNames(theme, className, variantClassName, iconProps && iconProps.className, menuIconProps && menuIconProps.className, isPrimaryButtonDisabled, checked, !menuHidden, !!this.props.menuProps, this.props.split, !!allowDisabledFocus)\n : getBaseButtonClassNames(theme, styles, className, variantClassName, iconProps && iconProps.className, menuIconProps && menuIconProps.className, isPrimaryButtonDisabled, !!this.props.menuProps, checked, !menuHidden, this.props.split);\n var _d = this, _ariaDescriptionId = _d._ariaDescriptionId, _labelId = _d._labelId, _descriptionId = _d._descriptionId;\n // Anchor tag cannot be disabled hence in disabled state rendering\n // anchor button as normal button\n var renderAsAnchor = !isPrimaryButtonDisabled && !!href;\n var tag = renderAsAnchor ? 'a' : 'button';\n var nativeProps = getNativeProps(\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n assign(renderAsAnchor ? {} : { type: 'button' }, this.props.rootProps, this.props), renderAsAnchor ? anchorProperties : buttonProperties, [\n 'disabled', // let disabled buttons be focused and styled as disabled.\n ]);\n // Check for ariaLabel passed in via Button props, and fall back to aria-label passed in via native props\n var resolvedAriaLabel = ariaLabel || nativeProps['aria-label'];\n // Check for ariaDescription, secondaryText or aria-describedby in the native props to determine source of\n // aria-describedby. Otherwise default to undefined so property does not appear in output.\n var ariaDescribedBy = undefined;\n if (ariaDescription) {\n ariaDescribedBy = _ariaDescriptionId;\n }\n else if (secondaryText && this.props.onRenderDescription !== nullRender) {\n // for buttons like CompoundButton with a valid onRenderDescription, we need to set an ariaDescribedBy\n // for buttons that do not render anything (via nullRender), we should not set an ariaDescribedBy\n ariaDescribedBy = _descriptionId;\n }\n else if (nativeProps['aria-describedby']) {\n ariaDescribedBy = nativeProps['aria-describedby'];\n }\n // If an explicit aria-labelledby is given, use that and we're done.\n // If any kind of description is given (which will end up as an aria-describedby attribute)\n // and no ariaLabel is specified, set the labelledby element.\n // Otherwise, the button is labeled implicitly by the descendent text on the button (if it exists).\n var ariaLabelledBy = undefined;\n if (nativeProps['aria-labelledby']) {\n ariaLabelledBy = nativeProps['aria-labelledby'];\n }\n else if (ariaDescribedBy && !resolvedAriaLabel) {\n ariaLabelledBy = this._hasText() ? _labelId : undefined;\n }\n var dataIsFocusable = this.props['data-is-focusable'] === false || (disabled && !allowDisabledFocus) || this._isSplitButton\n ? false\n : true;\n var isCheckboxTypeRole = role === 'menuitemcheckbox' || role === 'checkbox';\n // if isCheckboxTypeRole, always return a checked value.\n // Otherwise only return checked value if toggle is set to true.\n // This is because role=\"checkbox\" always needs to have an aria-checked value\n // but our checked prop only sets aria-pressed if we mark the button as a toggle=\"true\"\n var checkedOrPressedValue = isCheckboxTypeRole ? !!checked : toggle === true ? !!checked : undefined;\n var buttonProps = assign(nativeProps, (_a = {\n className: this._classNames.root,\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n ref: this._mergedRef(this.props.elementRef, this._buttonElement),\n disabled: isPrimaryButtonDisabled && !allowDisabledFocus,\n onKeyDown: this._onKeyDown,\n onKeyPress: this._onKeyPress,\n onKeyUp: this._onKeyUp,\n onMouseDown: this._onMouseDown,\n onMouseUp: this._onMouseUp,\n onClick: this._onClick,\n 'aria-label': resolvedAriaLabel,\n 'aria-labelledby': ariaLabelledBy,\n 'aria-describedby': ariaDescribedBy,\n 'aria-disabled': isPrimaryButtonDisabled,\n 'data-is-focusable': dataIsFocusable\n },\n // aria-pressed attribute should only be present for toggle buttons\n // aria-checked attribute should only be present for toggle buttons with checkbox type role\n _a[isCheckboxTypeRole ? 'aria-checked' : 'aria-pressed'] = checkedOrPressedValue,\n _a));\n if (ariaHidden) {\n buttonProps['aria-hidden'] = true;\n }\n if (this._isSplitButton) {\n return this._onRenderSplitButtonContent(tag, buttonProps);\n }\n else if (this.props.menuProps) {\n var _e = this.props.menuProps.id, id = _e === void 0 ? \"\".concat(this._labelId, \"-menu\") : _e;\n assign(buttonProps, {\n 'aria-expanded': !menuHidden,\n 'aria-controls': !menuHidden ? id : null,\n 'aria-haspopup': true,\n });\n }\n return this._onRenderContent(tag, buttonProps);\n };\n BaseButton.prototype.componentDidMount = function () {\n // For split buttons, touching anywhere in the button should drop the dropdown, which should contain the\n // primary action. This gives more hit target space for touch environments. We're setting the onpointerdown here,\n // because React does not support Pointer events yet.\n if (this._isSplitButton && this._splitButtonContainer.current) {\n if ('onpointerdown' in this._splitButtonContainer.current) {\n this._events.on(this._splitButtonContainer.current, 'pointerdown', this._onPointerDown, true);\n }\n if ('onpointerup' in this._splitButtonContainer.current && this.props.onPointerUp) {\n this._events.on(this._splitButtonContainer.current, 'pointerup', this.props.onPointerUp, true);\n }\n }\n };\n BaseButton.prototype.componentDidUpdate = function (prevProps, prevState) {\n // If Button's menu was closed, run onAfterMenuDismiss.\n if (this.props.onAfterMenuDismiss && !prevState.menuHidden && this.state.menuHidden) {\n this.props.onAfterMenuDismiss();\n }\n };\n BaseButton.prototype.componentWillUnmount = function () {\n this._async.dispose();\n this._events.dispose();\n };\n BaseButton.prototype.focus = function () {\n var _a, _b;\n if (this._isSplitButton && this._splitButtonContainer.current) {\n setFocusVisibility(true, undefined, (_a = this.context) === null || _a === void 0 ? void 0 : _a.registeredProviders);\n this._splitButtonContainer.current.focus();\n }\n else if (this._buttonElement.current) {\n setFocusVisibility(true, undefined, (_b = this.context) === null || _b === void 0 ? void 0 : _b.registeredProviders);\n this._buttonElement.current.focus();\n }\n };\n BaseButton.prototype.dismissMenu = function () {\n this._dismissMenu();\n };\n BaseButton.prototype.openMenu = function (shouldFocusOnContainer, shouldFocusOnMount) {\n this._openMenu(shouldFocusOnContainer, shouldFocusOnMount);\n };\n BaseButton.prototype._onRenderContent = function (tag, buttonProps) {\n var _this = this;\n var props = this.props;\n var Tag = tag;\n var menuIconProps = props.menuIconProps, menuProps = props.menuProps, _a = props.onRenderIcon, onRenderIcon = _a === void 0 ? this._onRenderIcon : _a, _b = props.onRenderAriaDescription, onRenderAriaDescription = _b === void 0 ? this._onRenderAriaDescription : _b, _c = props.onRenderChildren, onRenderChildren = _c === void 0 ? this._onRenderChildren : _c, \n // eslint-disable-next-line @typescript-eslint/no-deprecated\n _d = props.onRenderMenu, \n // eslint-disable-next-line @typescript-eslint/no-deprecated\n onRenderMenu = _d === void 0 ? this._onRenderMenu : _d, _e = props.onRenderMenuIcon, onRenderMenuIcon = _e === void 0 ? this._onRenderMenuIcon : _e, disabled = props.disabled;\n var keytipProps = props.keytipProps;\n if (keytipProps && menuProps) {\n keytipProps = this._getMemoizedMenuButtonKeytipProps(keytipProps);\n }\n var Button = function (keytipAttributes) { return (React.createElement(Tag, __assign({}, buttonProps, keytipAttributes),\n React.createElement(\"span\", { className: _this._classNames.flexContainer, \"data-automationid\": \"splitbuttonprimary\" },\n onRenderIcon(props, _this._onRenderIcon),\n _this._onRenderTextContents(),\n onRenderAriaDescription(props, _this._onRenderAriaDescription),\n onRenderChildren(props, _this._onRenderChildren),\n !_this._isSplitButton &&\n (menuProps || menuIconProps || _this.props.onRenderMenuIcon) &&\n onRenderMenuIcon(_this.props, _this._onRenderMenuIcon),\n menuProps &&\n !menuProps.doNotLayer &&\n _this._shouldRenderMenu() &&\n onRenderMenu(_this._getMenuProps(menuProps), _this._onRenderMenu)))); };\n var Content = keytipProps ? (\n // If we're making a split button, we won't put the keytip here\n React.createElement(KeytipData, { keytipProps: !this._isSplitButton ? keytipProps : undefined, ariaDescribedBy: buttonProps['aria-describedby'], disabled: disabled }, function (keytipAttributes) { return Button(keytipAttributes); })) : (Button());\n if (menuProps && menuProps.doNotLayer) {\n return (React.createElement(React.Fragment, null,\n Content,\n this._shouldRenderMenu() && onRenderMenu(this._getMenuProps(menuProps), this._onRenderMenu)));\n }\n return (React.createElement(React.Fragment, null,\n Content,\n React.createElement(FocusRects, null)));\n };\n /**\n * Method to help determine if the menu's component tree should\n * be rendered. It takes into account whether the menu is expanded,\n * whether it is a persisted menu and whether it has been shown to the user.\n */\n BaseButton.prototype._shouldRenderMenu = function () {\n var menuHidden = this.state.menuHidden;\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n var _a = this.props, persistMenu = _a.persistMenu, renderPersistedMenuHiddenOnMount = _a.renderPersistedMenuHiddenOnMount;\n if (!menuHidden) {\n // Always should render a menu when it is expanded\n return true;\n }\n else if (persistMenu && (this._renderedVisibleMenu || renderPersistedMenuHiddenOnMount)) {\n // _renderedVisibleMenu ensures that the first rendering of\n // the menu happens on-screen, as edge's scrollbar calculations are off if done while hidden.\n return true;\n }\n return false;\n };\n BaseButton.prototype._hasText = function () {\n // _onRenderTextContents and _onRenderText do not perform the same checks. Below is parity with what _onRenderText\n // used to have before the refactor that introduced this function. _onRenderTextContents does not require props.\n // text to be undefined in order for props.children to be used as a fallback.\n // Purely a code maintainability/reuse issue, but logged as Issue #4979.\n return this.props.text !== null && (this.props.text !== undefined || typeof this.props.children === 'string');\n };\n BaseButton.prototype._getMenuProps = function (menuProps) {\n var persistMenu = this.props.persistMenu;\n var menuHidden = this.state.menuHidden;\n // the accessible menu label (accessible name) has a relationship to the button.\n // If the menu props do not specify an explicit value for aria-label or aria-labelledBy,\n // AND the button has text, we'll set the menu aria-labelledBy to the text element id.\n if (!menuProps.ariaLabel && !menuProps.labelElementId && this._hasText()) {\n menuProps = __assign(__assign({}, menuProps), { labelElementId: this._labelId });\n }\n return __assign(__assign({ id: this._labelId + '-menu', directionalHint: DirectionalHint.bottomLeftEdge }, menuProps), { shouldFocusOnContainer: this._menuShouldFocusOnContainer, shouldFocusOnMount: this._menuShouldFocusOnMount, hidden: persistMenu ? menuHidden : undefined, className: css('ms-BaseButton-menuhost', menuProps.className), target: this._isSplitButton ? this._splitButtonContainer.current : this._buttonElement.current, onDismiss: this._onDismissMenu });\n };\n BaseButton.prototype._onRenderSplitButtonContent = function (tag, buttonProps) {\n var _this = this;\n var _a = this.props, _b = _a.styles, styles = _b === void 0 ? {} : _b, disabled = _a.disabled, allowDisabledFocus = _a.allowDisabledFocus, checked = _a.checked, getSplitButtonClassNames = _a.getSplitButtonClassNames, primaryDisabled = _a.primaryDisabled, menuProps = _a.menuProps, toggle = _a.toggle, role = _a.role, primaryActionButtonProps = _a.primaryActionButtonProps;\n var keytipProps = this.props.keytipProps;\n var menuHidden = this.state.menuHidden;\n var classNames = getSplitButtonClassNames\n ? getSplitButtonClassNames(!!disabled, !menuHidden, !!checked, !!allowDisabledFocus)\n : styles && getBaseSplitButtonClassNames(styles, !!disabled, !menuHidden, !!checked, !!primaryDisabled);\n assign(buttonProps, {\n onClick: undefined,\n onPointerDown: undefined,\n onPointerUp: undefined,\n tabIndex: -1,\n 'data-is-focusable': false,\n });\n if (keytipProps && menuProps) {\n keytipProps = this._getMemoizedMenuButtonKeytipProps(keytipProps);\n }\n var containerProps = getNativeProps(buttonProps, [], ['disabled']);\n // Add additional props to apply on primary action button\n if (primaryActionButtonProps) {\n assign(buttonProps, primaryActionButtonProps);\n }\n var SplitButton = function (keytipAttributes) { return (React.createElement(\"div\", __assign({}, containerProps, { \"data-ktp-target\": keytipAttributes ? keytipAttributes['data-ktp-target'] : undefined, role: role ? role : 'button', \"aria-disabled\": disabled, \"aria-haspopup\": true, \"aria-expanded\": !menuHidden, \"aria-pressed\": toggle ? !!checked : undefined, \"aria-describedby\": mergeAriaAttributeValues(buttonProps['aria-describedby'], keytipAttributes ? keytipAttributes['aria-describedby'] : undefined), className: classNames && classNames.splitButtonContainer, onKeyDown: _this._onSplitButtonContainerKeyDown, onTouchStart: _this._onTouchStart, ref: _this._splitButtonContainer, \"data-is-focusable\": true, onClick: !disabled && !primaryDisabled ? _this._onSplitButtonPrimaryClick : undefined, tabIndex: (!disabled && !primaryDisabled) || allowDisabledFocus ? 0 : undefined, \"aria-roledescription\": buttonProps['aria-roledescription'], onFocusCapture: _this._onSplitContainerFocusCapture }),\n React.createElement(\"span\", { style: { display: 'flex', width: '100%' } },\n _this._onRenderContent(tag, buttonProps),\n _this._onRenderSplitButtonMenuButton(classNames, keytipAttributes),\n _this._onRenderSplitButtonDivider(classNames)))); };\n return keytipProps ? (React.createElement(KeytipData, { keytipProps: keytipProps, disabled: disabled }, function (keytipAttributes) { return SplitButton(keytipAttributes); })) : (SplitButton());\n };\n BaseButton.prototype._onRenderSplitButtonDivider = function (classNames) {\n if (classNames && classNames.divider) {\n var onClick = function (ev) {\n ev.stopPropagation();\n };\n return React.createElement(\"span\", { className: classNames.divider, \"aria-hidden\": true, onClick: onClick });\n }\n return null;\n };\n BaseButton.prototype._onRenderSplitButtonMenuButton = function (classNames, keytipAttributes) {\n var _a = this.props, allowDisabledFocus = _a.allowDisabledFocus, checked = _a.checked, disabled = _a.disabled, splitButtonMenuProps = _a.splitButtonMenuProps, splitButtonAriaLabel = _a.splitButtonAriaLabel, primaryDisabled = _a.primaryDisabled;\n var menuHidden = this.state.menuHidden;\n var menuIconProps = this.props.menuIconProps;\n if (menuIconProps === undefined) {\n menuIconProps = {\n iconName: 'ChevronDown',\n };\n }\n var splitButtonProps = __assign(__assign({}, splitButtonMenuProps), { styles: classNames, checked: checked, disabled: disabled, allowDisabledFocus: allowDisabledFocus, onClick: this._onMenuClick, menuProps: undefined, iconProps: __assign(__assign({}, menuIconProps), { className: this._classNames.menuIcon }), ariaLabel: splitButtonAriaLabel, 'aria-haspopup': true, 'aria-expanded': !menuHidden, 'data-is-focusable': false });\n // Add data-ktp-execute-target to the split button if the keytip is defined\n return (React.createElement(BaseButton, __assign({}, splitButtonProps, { \"data-ktp-execute-target\": keytipAttributes ? keytipAttributes['data-ktp-execute-target'] : keytipAttributes, onMouseDown: this._onMouseDown, tabIndex: primaryDisabled && !allowDisabledFocus ? 0 : -1 })));\n };\n BaseButton.prototype._onPointerDown = function (ev) {\n var onPointerDown = this.props.onPointerDown;\n if (onPointerDown) {\n onPointerDown(ev);\n }\n if (ev.pointerType === 'touch') {\n this._handleTouchAndPointerEvent();\n ev.preventDefault();\n ev.stopImmediatePropagation();\n }\n };\n BaseButton.prototype._handleTouchAndPointerEvent = function () {\n var _this = this;\n // If we already have an existing timeout from a previous touch and pointer event\n // cancel that timeout so we can set a new one.\n if (this._lastTouchTimeoutId !== undefined) {\n this._async.clearTimeout(this._lastTouchTimeoutId);\n this._lastTouchTimeoutId = undefined;\n }\n this._processingTouch = true;\n this._lastTouchTimeoutId = this._async.setTimeout(function () {\n _this._processingTouch = false;\n _this._lastTouchTimeoutId = undefined;\n // Touch and pointer events don't focus the button naturally,\n // so adding an imperative focus call to guarantee this behavior.\n // Only focus the button if a splitbutton menu is not open\n if (_this.state.menuHidden) {\n _this.focus();\n }\n }, TouchIdleDelay);\n };\n /**\n * Returns if the user hits a valid keyboard key to open the menu\n * @param ev - the keyboard event\n * @returns True if user clicks on custom trigger key if enabled or alt + down arrow if not. False otherwise.\n */\n BaseButton.prototype._isValidMenuOpenKey = function (ev) {\n if (this.props.menuTriggerKeyCode) {\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n return ev.which === this.props.menuTriggerKeyCode;\n }\n else if (this.props.menuProps) {\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n return ev.which === KeyCodes.down && (ev.altKey || ev.metaKey);\n }\n // Note: When enter is pressed, we will let the event continue to propagate\n // to trigger the onClick event on the button\n return false;\n };\n BaseButton.defaultProps = {\n baseClassName: 'ms-Button',\n styles: {},\n split: false,\n };\n // needed to access registeredProviders when manually setting focus visibility\n BaseButton.contextType = FocusRectsContext;\n return BaseButton;\n}(React.Component));\nexport { BaseButton };\n//# sourceMappingURL=BaseButton.js.map","import { memoizeFunction } from '../../Utilities';\nimport { HighContrastSelector, getFocusStyle, hiddenContentStyle } from '../../Styling';\nvar noOutline = {\n outline: 0,\n};\nvar iconStyle = function (fontSize) {\n return {\n fontSize: fontSize,\n margin: '0 4px',\n height: '16px',\n lineHeight: '16px',\n textAlign: 'center',\n flexShrink: 0,\n };\n};\n/**\n * Gets the base button styles. Note: because it is a base class to be used with the `mergeRules`\n * helper, it should have values for all class names in the interface. This let `mergeRules` optimize\n * mixing class names together.\n */\nexport var getStyles = memoizeFunction(function (theme) {\n var _a, _b;\n var semanticColors = theme.semanticColors, effects = theme.effects, fonts = theme.fonts;\n var border = semanticColors.buttonBorder;\n var disabledBackground = semanticColors.disabledBackground;\n var disabledText = semanticColors.disabledText;\n var buttonHighContrastFocus = {\n left: -2,\n top: -2,\n bottom: -2,\n right: -2,\n outlineColor: 'ButtonText',\n };\n return {\n root: [\n getFocusStyle(theme, { inset: 1, highContrastStyle: buttonHighContrastFocus, borderColor: 'transparent' }),\n theme.fonts.medium,\n {\n border: '1px solid ' + border,\n borderRadius: effects.roundedCorner2,\n boxSizing: 'border-box',\n cursor: 'pointer',\n display: 'inline-flex',\n alignItems: 'center',\n justifyContent: 'center',\n padding: '0 16px',\n textDecoration: 'none',\n textAlign: 'center',\n userSelect: 'none',\n // IE11 workaround for preventing shift of child elements of a button when active.\n ':active > span': {\n position: 'relative',\n left: 0,\n top: 0,\n },\n },\n ],\n rootDisabled: [\n getFocusStyle(theme, { inset: 1, highContrastStyle: buttonHighContrastFocus, borderColor: 'transparent' }),\n {\n backgroundColor: disabledBackground,\n borderColor: disabledBackground,\n color: disabledText,\n cursor: 'default',\n ':hover': noOutline,\n ':focus': noOutline,\n },\n ],\n iconDisabled: (_a = {\n color: disabledText\n },\n _a[HighContrastSelector] = {\n color: 'GrayText',\n },\n _a),\n menuIconDisabled: (_b = {\n color: disabledText\n },\n _b[HighContrastSelector] = {\n color: 'GrayText',\n },\n _b),\n flexContainer: {\n display: 'flex',\n height: '100%',\n flexWrap: 'nowrap',\n justifyContent: 'center',\n alignItems: 'center',\n },\n description: {\n display: 'block',\n },\n textContainer: {\n flexGrow: 1,\n display: 'block',\n },\n icon: iconStyle(fonts.mediumPlus.fontSize),\n menuIcon: iconStyle(fonts.small.fontSize),\n label: {\n margin: '0 4px',\n lineHeight: '100%',\n display: 'block',\n },\n screenReaderText: hiddenContentStyle,\n };\n});\n//# sourceMappingURL=BaseButton.styles.js.map","import { __assign } from \"tslib\";\nimport { HighContrastSelector, getHighContrastNoAdjustStyle } from '../../Styling';\nimport { IsFocusVisibleClassName } from '../../Utilities';\nvar splitButtonDividerBaseStyles = function () {\n return {\n position: 'absolute',\n width: 1,\n right: 31,\n top: 8,\n bottom: 8,\n };\n};\nexport function standardStyles(theme) {\n var _a, _b, _c, _d, _e;\n var s = theme.semanticColors, p = theme.palette;\n var buttonBackground = s.buttonBackground;\n var buttonBackgroundPressed = s.buttonBackgroundPressed;\n var buttonBackgroundHovered = s.buttonBackgroundHovered;\n var buttonBackgroundDisabled = s.buttonBackgroundDisabled;\n var buttonText = s.buttonText;\n var buttonTextHovered = s.buttonTextHovered;\n var buttonTextDisabled = s.buttonTextDisabled;\n var buttonTextChecked = s.buttonTextChecked;\n var buttonTextCheckedHovered = s.buttonTextCheckedHovered;\n return {\n root: {\n backgroundColor: buttonBackground,\n color: buttonText,\n },\n rootHovered: (_a = {\n backgroundColor: buttonBackgroundHovered,\n color: buttonTextHovered\n },\n _a[HighContrastSelector] = {\n borderColor: 'Highlight',\n color: 'Highlight',\n },\n _a),\n rootPressed: {\n backgroundColor: buttonBackgroundPressed,\n color: buttonTextChecked,\n },\n rootExpanded: {\n backgroundColor: buttonBackgroundPressed,\n color: buttonTextChecked,\n },\n rootChecked: {\n backgroundColor: buttonBackgroundPressed,\n color: buttonTextChecked,\n },\n rootCheckedHovered: {\n backgroundColor: buttonBackgroundPressed,\n color: buttonTextCheckedHovered,\n },\n rootDisabled: (_b = {\n color: buttonTextDisabled,\n backgroundColor: buttonBackgroundDisabled\n },\n _b[HighContrastSelector] = {\n color: 'GrayText',\n borderColor: 'GrayText',\n backgroundColor: 'Window',\n },\n _b),\n // Split button styles\n splitButtonContainer: (_c = {},\n _c[HighContrastSelector] = {\n border: 'none',\n },\n _c),\n splitButtonMenuButton: {\n color: p.white,\n backgroundColor: 'transparent',\n ':hover': (_d = {\n backgroundColor: p.neutralLight\n },\n _d[HighContrastSelector] = {\n color: 'Highlight',\n },\n _d),\n },\n splitButtonMenuButtonDisabled: {\n backgroundColor: s.buttonBackgroundDisabled,\n ':hover': {\n backgroundColor: s.buttonBackgroundDisabled,\n },\n },\n splitButtonDivider: __assign(__assign({}, splitButtonDividerBaseStyles()), (_e = { backgroundColor: p.neutralTertiaryAlt }, _e[HighContrastSelector] = {\n backgroundColor: 'WindowText',\n }, _e)),\n splitButtonDividerDisabled: {\n backgroundColor: theme.palette.neutralTertiaryAlt,\n },\n splitButtonMenuButtonChecked: {\n backgroundColor: p.neutralQuaternaryAlt,\n ':hover': {\n backgroundColor: p.neutralQuaternaryAlt,\n },\n },\n splitButtonMenuButtonExpanded: {\n backgroundColor: p.neutralQuaternaryAlt,\n ':hover': {\n backgroundColor: p.neutralQuaternaryAlt,\n },\n },\n splitButtonMenuIcon: {\n color: s.buttonText,\n },\n splitButtonMenuIconDisabled: {\n color: s.buttonTextDisabled,\n },\n };\n}\nexport function primaryStyles(theme) {\n var _a, _b, _c, _d, _e, _f, _g, _h, _j;\n var p = theme.palette, s = theme.semanticColors;\n return {\n root: (_a = {\n backgroundColor: s.primaryButtonBackground,\n border: \"1px solid \".concat(s.primaryButtonBackground),\n color: s.primaryButtonText\n },\n _a[HighContrastSelector] = __assign({ color: 'Window', backgroundColor: 'WindowText', borderColor: 'WindowText' }, getHighContrastNoAdjustStyle()),\n _a[\".\".concat(IsFocusVisibleClassName, \" &:focus, :host(.\").concat(IsFocusVisibleClassName, \") &:focus\")] = {\n ':after': {\n border: \"none\",\n outlineColor: p.white,\n },\n },\n _a),\n rootHovered: (_b = {\n backgroundColor: s.primaryButtonBackgroundHovered,\n border: \"1px solid \".concat(s.primaryButtonBackgroundHovered),\n color: s.primaryButtonTextHovered\n },\n _b[HighContrastSelector] = {\n color: 'Window',\n backgroundColor: 'Highlight',\n borderColor: 'Highlight',\n },\n _b),\n rootPressed: (_c = {\n backgroundColor: s.primaryButtonBackgroundPressed,\n border: \"1px solid \".concat(s.primaryButtonBackgroundPressed),\n color: s.primaryButtonTextPressed\n },\n _c[HighContrastSelector] = __assign({ color: 'Window', backgroundColor: 'WindowText', borderColor: 'WindowText' }, getHighContrastNoAdjustStyle()),\n _c),\n rootExpanded: {\n backgroundColor: s.primaryButtonBackgroundPressed,\n color: s.primaryButtonTextPressed,\n },\n rootChecked: {\n backgroundColor: s.primaryButtonBackgroundPressed,\n color: s.primaryButtonTextPressed,\n },\n rootCheckedHovered: {\n backgroundColor: s.primaryButtonBackgroundPressed,\n color: s.primaryButtonTextPressed,\n },\n rootDisabled: (_d = {\n color: s.primaryButtonTextDisabled,\n backgroundColor: s.primaryButtonBackgroundDisabled\n },\n _d[HighContrastSelector] = {\n color: 'GrayText',\n borderColor: 'GrayText',\n backgroundColor: 'Window',\n },\n _d),\n // Split button styles\n splitButtonContainer: (_e = {},\n _e[HighContrastSelector] = {\n border: 'none',\n },\n _e),\n splitButtonDivider: __assign(__assign({}, splitButtonDividerBaseStyles()), (_f = { backgroundColor: p.white }, _f[HighContrastSelector] = {\n backgroundColor: 'Window',\n }, _f)),\n splitButtonMenuButton: (_g = {\n backgroundColor: s.primaryButtonBackground,\n color: s.primaryButtonText\n },\n _g[HighContrastSelector] = {\n backgroundColor: 'Canvas',\n },\n _g[':hover'] = (_h = {\n backgroundColor: s.primaryButtonBackgroundHovered\n },\n _h[HighContrastSelector] = {\n color: 'Highlight',\n },\n _h),\n _g),\n splitButtonMenuButtonDisabled: {\n backgroundColor: s.primaryButtonBackgroundDisabled,\n ':hover': {\n backgroundColor: s.primaryButtonBackgroundDisabled,\n },\n },\n splitButtonMenuButtonChecked: {\n backgroundColor: s.primaryButtonBackgroundPressed,\n ':hover': {\n backgroundColor: s.primaryButtonBackgroundPressed,\n },\n },\n splitButtonMenuButtonExpanded: {\n backgroundColor: s.primaryButtonBackgroundPressed,\n ':hover': {\n backgroundColor: s.primaryButtonBackgroundPressed,\n },\n },\n splitButtonMenuIcon: {\n color: s.primaryButtonText,\n },\n splitButtonMenuIconDisabled: (_j = {\n color: p.neutralTertiary\n },\n _j[HighContrastSelector] = {\n color: 'GrayText',\n },\n _j),\n };\n}\n//# sourceMappingURL=ButtonThemes.js.map","import { ActionButton } from '../ActionButton/ActionButton';\n/**\n * {@docCategory Button}\n */\nexport var CommandButton = ActionButton;\n//# sourceMappingURL=CommandButton.js.map","import { concatStyleSets, FontWeights } from '../../../Styling';\nimport { memoizeFunction } from '../../../Utilities';\nimport { getStyles as getBaseButtonStyles } from '../BaseButton.styles';\nimport { getStyles as getSplitButtonStyles } from '../SplitButton/SplitButton.styles';\nimport { primaryStyles, standardStyles } from '../ButtonThemes';\nvar DEFAULT_BUTTON_MIN_HEIGHT = '32px';\nvar DEFAULT_BUTTON_MIN_WIDTH = '80px';\nexport var getStyles = memoizeFunction(function (theme, customStyles, primary) {\n var baseButtonStyles = getBaseButtonStyles(theme);\n var splitButtonStyles = getSplitButtonStyles(theme);\n var defaultButtonStyles = {\n root: {\n minWidth: DEFAULT_BUTTON_MIN_WIDTH,\n minHeight: DEFAULT_BUTTON_MIN_HEIGHT,\n },\n label: {\n fontWeight: FontWeights.semibold,\n },\n };\n return concatStyleSets(baseButtonStyles, defaultButtonStyles, primary ? primaryStyles(theme) : standardStyles(theme), splitButtonStyles, customStyles);\n});\n//# sourceMappingURL=DefaultButton.styles.js.map","import { __assign, __decorate, __extends } from \"tslib\";\nimport * as React from 'react';\nimport { BaseButton } from '../BaseButton';\nimport { customizable, nullRender } from '../../../Utilities';\nimport { getStyles } from './DefaultButton.styles';\n/**\n * {@docCategory Button}\n */\nvar DefaultButton = /** @class */ (function (_super) {\n __extends(DefaultButton, _super);\n function DefaultButton() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n DefaultButton.prototype.render = function () {\n var _a = this.props, _b = _a.primary, primary = _b === void 0 ? false : _b, styles = _a.styles, theme = _a.theme;\n return (React.createElement(BaseButton, __assign({}, this.props, { variantClassName: primary ? 'ms-Button--primary' : 'ms-Button--default', styles: getStyles(theme, styles, primary), onRenderDescription: nullRender })));\n };\n DefaultButton = __decorate([\n customizable('DefaultButton', ['theme', 'styles'], true)\n ], DefaultButton);\n return DefaultButton;\n}(React.Component));\nexport { DefaultButton };\n//# sourceMappingURL=DefaultButton.js.map","import { concatStyleSets, HighContrastSelector } from '../../../Styling';\nimport { memoizeFunction } from '../../../Utilities';\nimport { getStyles as getBaseButtonStyles } from '../BaseButton.styles';\nimport { getStyles as getSplitButtonStyles } from '../SplitButton/SplitButton.styles';\nexport var getStyles = memoizeFunction(function (theme, customStyles) {\n var _a;\n var baseButtonStyles = getBaseButtonStyles(theme);\n var splitButtonStyles = getSplitButtonStyles(theme);\n var palette = theme.palette, semanticColors = theme.semanticColors;\n var iconButtonStyles = {\n root: {\n padding: '0 4px',\n width: '32px',\n height: '32px',\n backgroundColor: 'transparent',\n border: 'none',\n color: semanticColors.link,\n },\n rootHovered: (_a = {\n color: palette.themeDarkAlt,\n backgroundColor: palette.neutralLighter\n },\n _a[HighContrastSelector] = {\n borderColor: 'Highlight',\n color: 'Highlight',\n },\n _a),\n rootHasMenu: {\n width: 'auto',\n },\n rootPressed: {\n color: palette.themeDark,\n backgroundColor: palette.neutralLight,\n },\n rootExpanded: {\n color: palette.themeDark,\n backgroundColor: palette.neutralLight,\n },\n rootChecked: {\n color: palette.themeDark,\n backgroundColor: palette.neutralLight,\n },\n rootCheckedHovered: {\n color: palette.themeDark,\n backgroundColor: palette.neutralQuaternaryAlt,\n },\n rootDisabled: {\n color: palette.neutralTertiaryAlt,\n },\n };\n return concatStyleSets(baseButtonStyles, iconButtonStyles, splitButtonStyles, customStyles);\n});\n//# sourceMappingURL=IconButton.styles.js.map","import { __assign, __decorate, __extends } from \"tslib\";\nimport * as React from 'react';\nimport { BaseButton } from '../BaseButton';\nimport { customizable, nullRender } from '../../../Utilities';\nimport { getStyles } from './IconButton.styles';\n/**\n * {@docCategory Button}\n */\nvar IconButton = /** @class */ (function (_super) {\n __extends(IconButton, _super);\n function IconButton() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n IconButton.prototype.render = function () {\n var _a = this.props, styles = _a.styles, theme = _a.theme;\n return (React.createElement(BaseButton, __assign({}, this.props, { variantClassName: \"ms-Button--icon\", styles: getStyles(theme, styles), onRenderText: nullRender, onRenderDescription: nullRender })));\n };\n IconButton = __decorate([\n customizable('IconButton', ['theme', 'styles'], true)\n ], IconButton);\n return IconButton;\n}(React.Component));\nexport { IconButton };\n//# sourceMappingURL=IconButton.js.map","import { __assign, __decorate, __extends } from \"tslib\";\nimport * as React from 'react';\nimport { customizable, nullRender } from '../../../Utilities';\nimport { DefaultButton } from '../DefaultButton/DefaultButton';\n/**\n * {@docCategory Button}\n */\nvar PrimaryButton = /** @class */ (function (_super) {\n __extends(PrimaryButton, _super);\n function PrimaryButton() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n PrimaryButton.prototype.render = function () {\n return React.createElement(DefaultButton, __assign({}, this.props, { primary: true, onRenderDescription: nullRender }));\n };\n PrimaryButton = __decorate([\n customizable('PrimaryButton', ['theme', 'styles'], true)\n ], PrimaryButton);\n return PrimaryButton;\n}(React.Component));\nexport { PrimaryButton };\n//# sourceMappingURL=PrimaryButton.js.map","import { memoizeFunction } from '../../../Utilities';\nimport { mergeStyles } from '../../../Styling';\nexport var SplitButtonGlobalClassNames = {\n msSplitButtonDivider: 'ms-SplitButton-divider',\n};\nexport var getSplitButtonClassNames = memoizeFunction(function (styles, disabled, expanded, checked, primaryDisabled) {\n return {\n root: mergeStyles(styles.splitButtonMenuButton, expanded && [styles.splitButtonMenuButtonExpanded], disabled && [styles.splitButtonMenuButtonDisabled], checked && !disabled && [styles.splitButtonMenuButtonChecked], primaryDisabled &&\n !disabled && [\n {\n ':focus': styles.splitButtonMenuFocused,\n },\n ]),\n splitButtonContainer: mergeStyles(styles.splitButtonContainer, !disabled &&\n checked && [\n styles.splitButtonContainerChecked,\n {\n ':hover': styles.splitButtonContainerCheckedHovered,\n },\n ], !disabled &&\n !checked && [\n {\n ':hover': styles.splitButtonContainerHovered,\n ':focus': styles.splitButtonContainerFocused,\n },\n ], disabled && styles.splitButtonContainerDisabled),\n icon: mergeStyles(styles.splitButtonMenuIcon, disabled && styles.splitButtonMenuIconDisabled, !disabled && primaryDisabled && styles.splitButtonMenuIcon),\n flexContainer: mergeStyles(styles.splitButtonFlexContainer),\n divider: mergeStyles(SplitButtonGlobalClassNames.msSplitButtonDivider, styles.splitButtonDivider, (primaryDisabled || disabled) && styles.splitButtonDividerDisabled),\n };\n});\n//# sourceMappingURL=SplitButton.classNames.js.map","import { __assign } from \"tslib\";\nimport { HighContrastSelector, concatStyleSets, getFocusStyle, getHighContrastNoAdjustStyle } from '../../../Styling';\nimport { memoizeFunction } from '../../../Utilities';\nexport var getStyles = memoizeFunction(function (theme, customStyles) {\n var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s;\n var effects = theme.effects, palette = theme.palette, semanticColors = theme.semanticColors;\n var buttonHighContrastFocus = {\n left: -2,\n top: -2,\n bottom: -2,\n right: -2,\n border: 'none',\n };\n var splitButtonDividerBaseStyles = {\n position: 'absolute',\n width: 1,\n right: 31,\n top: 8,\n bottom: 8,\n };\n var splitButtonStyles = {\n splitButtonContainer: [\n getFocusStyle(theme, { highContrastStyle: buttonHighContrastFocus, inset: 2, pointerEvents: 'none' }),\n {\n display: 'inline-flex',\n '.ms-Button--default': {\n borderTopRightRadius: '0',\n borderBottomRightRadius: '0',\n borderRight: 'none',\n flexGrow: '1',\n },\n '.ms-Button--primary': (_a = {\n borderTopRightRadius: '0',\n borderBottomRightRadius: '0',\n border: 'none',\n flexGrow: '1',\n ':hover': {\n border: 'none',\n },\n ':active': {\n border: 'none',\n }\n },\n _a[HighContrastSelector] = __assign(__assign({ color: 'WindowText', backgroundColor: 'Window', border: '1px solid WindowText', borderRightWidth: '0' }, getHighContrastNoAdjustStyle()), { ':hover': {\n backgroundColor: 'Highlight',\n border: '1px solid Highlight',\n borderRightWidth: '0',\n color: 'HighlightText',\n }, ':active': {\n border: '1px solid Highlight',\n } }),\n _a),\n '.ms-Button--default + .ms-Button': (_b = {},\n _b[HighContrastSelector] = {\n border: '1px solid WindowText',\n borderLeftWidth: '0',\n ':hover': {\n backgroundColor: 'HighlightText',\n borderColor: 'Highlight',\n color: 'Highlight',\n '.ms-Button-menuIcon': __assign({ backgroundColor: 'HighlightText', color: 'Highlight' }, getHighContrastNoAdjustStyle()),\n },\n },\n _b),\n '.ms-Button--default + .ms-Button[aria-expanded=\"true\"]': (_c = {},\n _c[HighContrastSelector] = {\n backgroundColor: 'HighlightText',\n borderColor: 'Highlight',\n color: 'Highlight',\n '.ms-Button-menuIcon': __assign({ backgroundColor: 'HighlightText', color: 'Highlight' }, getHighContrastNoAdjustStyle()),\n },\n _c),\n '.ms-Button--primary + .ms-Button': (_d = {\n border: 'none'\n },\n _d[HighContrastSelector] = {\n border: '1px solid WindowText',\n borderLeftWidth: '0',\n ':hover': {\n borderLeftWidth: '0',\n backgroundColor: 'Highlight',\n borderColor: 'Highlight',\n color: 'HighlightText',\n '.ms-Button-menuIcon': __assign(__assign({}, getHighContrastNoAdjustStyle()), { color: 'HighlightText' }),\n },\n },\n _d),\n '.ms-Button--primary + .ms-Button[aria-expanded=\"true\"]': (_e = {},\n _e[HighContrastSelector] = __assign(__assign({ backgroundColor: 'Highlight', borderColor: 'Highlight', color: 'HighlightText' }, getHighContrastNoAdjustStyle()), { '.ms-Button-menuIcon': {\n color: 'HighlightText',\n } }),\n _e),\n '.ms-Button.is-disabled': (_f = {},\n _f[HighContrastSelector] = {\n color: 'GrayText',\n borderColor: 'GrayText',\n backgroundColor: 'Window',\n },\n _f),\n },\n ],\n splitButtonContainerHovered: {\n '.ms-Button--default.is-disabled': (_g = {\n backgroundColor: semanticColors.buttonBackgroundDisabled,\n color: semanticColors.buttonTextDisabled\n },\n _g[HighContrastSelector] = {\n color: 'GrayText',\n borderColor: 'GrayText',\n backgroundColor: 'Window',\n },\n _g),\n '.ms-Button--primary.is-disabled': (_h = {\n backgroundColor: semanticColors.primaryButtonBackgroundDisabled,\n color: semanticColors.primaryButtonTextDisabled\n },\n _h[HighContrastSelector] = {\n color: 'GrayText',\n borderColor: 'GrayText',\n backgroundColor: 'Window',\n },\n _h),\n },\n splitButtonContainerChecked: {\n '.ms-Button--primary': (_j = {},\n _j[HighContrastSelector] = __assign({ color: 'Window', backgroundColor: 'WindowText' }, getHighContrastNoAdjustStyle()),\n _j),\n },\n splitButtonContainerCheckedHovered: {\n '.ms-Button--primary': (_k = {},\n _k[HighContrastSelector] = __assign({ color: 'Window', backgroundColor: 'WindowText' }, getHighContrastNoAdjustStyle()),\n _k),\n },\n splitButtonContainerFocused: {\n outline: 'none!important',\n },\n splitButtonMenuButton: (_l = {\n padding: 6,\n height: 'auto',\n boxSizing: 'border-box',\n borderRadius: 0,\n borderTopRightRadius: effects.roundedCorner2,\n borderBottomRightRadius: effects.roundedCorner2,\n border: \"1px solid \".concat(palette.neutralSecondaryAlt),\n borderLeft: 'none',\n outline: 'transparent',\n userSelect: 'none',\n display: 'inline-block',\n textDecoration: 'none',\n textAlign: 'center',\n cursor: 'pointer',\n verticalAlign: 'top',\n width: 32,\n marginLeft: -1,\n marginTop: 0,\n marginRight: 0,\n marginBottom: 0\n },\n _l[HighContrastSelector] = {\n '.ms-Button-menuIcon': {\n color: 'WindowText',\n },\n },\n _l),\n splitButtonDivider: __assign(__assign({}, splitButtonDividerBaseStyles), (_m = {}, _m[HighContrastSelector] = {\n backgroundColor: 'WindowText',\n }, _m)),\n splitButtonDividerDisabled: __assign(__assign({}, splitButtonDividerBaseStyles), (_o = {}, _o[HighContrastSelector] = {\n backgroundColor: 'GrayText',\n }, _o)),\n splitButtonMenuButtonDisabled: (_p = {\n pointerEvents: 'none',\n border: 'none',\n ':hover': {\n cursor: 'default',\n },\n '.ms-Button--primary': (_q = {},\n _q[HighContrastSelector] = {\n color: 'GrayText',\n borderColor: 'GrayText',\n backgroundColor: 'Window',\n },\n _q),\n '.ms-Button-menuIcon': (_r = {},\n _r[HighContrastSelector] = {\n color: 'GrayText',\n },\n _r)\n },\n _p[HighContrastSelector] = {\n color: 'GrayText',\n border: '1px solid GrayText',\n backgroundColor: 'Window',\n },\n _p),\n splitButtonFlexContainer: {\n display: 'flex',\n height: '100%',\n flexWrap: 'nowrap',\n justifyContent: 'center',\n alignItems: 'center',\n },\n splitButtonContainerDisabled: (_s = {\n outline: 'none',\n border: 'none'\n },\n _s[HighContrastSelector] = __assign({ color: 'GrayText', borderColor: 'GrayText', backgroundColor: 'Window' }, getHighContrastNoAdjustStyle()),\n _s),\n splitButtonMenuFocused: __assign({}, getFocusStyle(theme, { highContrastStyle: buttonHighContrastFocus, inset: 2 })),\n };\n return concatStyleSets(splitButtonStyles, customStyles);\n});\n//# sourceMappingURL=SplitButton.styles.js.map","import { __assign, __rest } from \"tslib\";\nimport * as React from 'react';\nimport { CalloutContent } from './CalloutContent';\nimport { Layer } from '../../Layer';\nexport var Callout = React.forwardRef(function (_a, forwardedRef) {\n var layerProps = _a.layerProps, doNotLayer = _a.doNotLayer, rest = __rest(_a, [\"layerProps\", \"doNotLayer\"]);\n var content = React.createElement(CalloutContent, __assign({}, rest, { doNotLayer: doNotLayer, ref: forwardedRef }));\n return doNotLayer ? content : React.createElement(Layer, __assign({}, layerProps), content);\n});\nCallout.displayName = 'Callout';\n//# sourceMappingURL=Callout.js.map","var _a;\nimport { __assign } from \"tslib\";\nimport * as React from 'react';\nimport { DirectionalHint } from '../../common/DirectionalHint';\nimport { css, divProperties, elementContains, focusFirstChild, getNativeProps, on, shallowCompare, getPropsWithDefaults, } from '../../Utilities';\nimport { calculateGapSpace, getRectangleFromTarget } from '../../utilities/positioning/positioning';\nimport { positionCallout, RectangleEdge, positionCard, getBoundsFromTargetWindow } from '../../Positioning';\nimport { Popup } from '../../Popup';\nimport { classNamesFunction } from '../../Utilities';\nimport { AnimationClassNames } from '../../Styling';\nimport { useMergedRefs, useAsync, useConst, useTarget, useOnEvent } from '@fluentui/react-hooks';\nimport { useWindowEx } from '../../utilities/dom';\nvar COMPONENT_NAME = 'CalloutContentBase';\nvar ANIMATIONS = (_a = {},\n _a[RectangleEdge.top] = AnimationClassNames.slideUpIn10,\n _a[RectangleEdge.bottom] = AnimationClassNames.slideDownIn10,\n _a[RectangleEdge.left] = AnimationClassNames.slideLeftIn10,\n _a[RectangleEdge.right] = AnimationClassNames.slideRightIn10,\n _a);\nvar BEAK_ORIGIN_POSITION = { top: 0, left: 0 };\n// Microsoft Edge will overwrite inline styles if there is an animation pertaining to that style.\n// To help ensure that edge will respect the offscreen style opacity\n// filter needs to be added as an additional way to set opacity.\n// Also set pointer-events: none so that the callout will not occlude the element it is\n// going to be positioned against\nvar OFF_SCREEN_STYLE = {\n opacity: 0,\n filter: 'opacity(0)',\n pointerEvents: 'none',\n};\n// role and role description go hand-in-hand. Both would be included by spreading getNativeProps for a basic element\n// This constant array can be used to filter these out of native props spread on callout root and apply them together on\n// calloutMain (the Popup component within the callout)\nvar ARIA_ROLE_ATTRIBUTES = ['role', 'aria-roledescription'];\nvar DEFAULT_PROPS = {\n preventDismissOnLostFocus: false,\n preventDismissOnScroll: false,\n preventDismissOnResize: false,\n isBeakVisible: true,\n beakWidth: 16,\n gapSpace: 0,\n minPagePadding: 8,\n directionalHint: DirectionalHint.bottomAutoEdge,\n};\nvar getClassNames = classNamesFunction({\n disableCaching: true, // disabling caching because stylesProp.position mutates often\n});\n/**\n * (Hook) to return a function to lazily fetch the bounds of the target element for the callout.\n */\nfunction useBounds(_a, targetRef, targetWindow) {\n var bounds = _a.bounds, _b = _a.minPagePadding, minPagePadding = _b === void 0 ? DEFAULT_PROPS.minPagePadding : _b, target = _a.target;\n var _c = React.useState(false), targetWindowResized = _c[0], setTargetWindowResized = _c[1];\n var cachedBounds = React.useRef();\n var getBounds = React.useCallback(function () {\n if (!cachedBounds.current || targetWindowResized) {\n var currentBounds = typeof bounds === 'function' ? (targetWindow ? bounds(target, targetWindow) : undefined) : bounds;\n if (!currentBounds && targetWindow) {\n currentBounds = getBoundsFromTargetWindow(targetRef.current, targetWindow);\n currentBounds = {\n top: currentBounds.top + minPagePadding,\n left: currentBounds.left + minPagePadding,\n right: currentBounds.right - minPagePadding,\n bottom: currentBounds.bottom - minPagePadding,\n width: currentBounds.width - minPagePadding * 2,\n height: currentBounds.height - minPagePadding * 2,\n };\n }\n cachedBounds.current = currentBounds;\n targetWindowResized && setTargetWindowResized(false);\n }\n return cachedBounds.current;\n }, [bounds, minPagePadding, target, targetRef, targetWindow, targetWindowResized]);\n var async = useAsync();\n useOnEvent(targetWindow, 'resize', async.debounce(function () {\n setTargetWindowResized(true);\n }, 500, { leading: true }));\n return getBounds;\n}\n/**\n * (Hook) to return the maximum available height for the Callout to render into.\n */\nfunction useMaxHeight(_a, getBounds, targetRef, positions) {\n var _b;\n var calloutMaxHeight = _a.calloutMaxHeight, finalHeight = _a.finalHeight, directionalHint = _a.directionalHint, directionalHintFixed = _a.directionalHintFixed, hidden = _a.hidden, gapSpace = _a.gapSpace, beakWidth = _a.beakWidth, isBeakVisible = _a.isBeakVisible, coverTarget = _a.coverTarget;\n var _c = React.useState(), maxHeight = _c[0], setMaxHeight = _c[1];\n var _d = (_b = positions === null || positions === void 0 ? void 0 : positions.elementPosition) !== null && _b !== void 0 ? _b : {}, top = _d.top, bottom = _d.bottom;\n var targetRect = (targetRef === null || targetRef === void 0 ? void 0 : targetRef.current) ? getRectangleFromTarget(targetRef.current) : undefined;\n React.useEffect(function () {\n var _a;\n var bounds = (_a = getBounds()) !== null && _a !== void 0 ? _a : {};\n var topBounds = bounds.top;\n var bottomBounds = bounds.bottom;\n var calculatedHeight;\n // If aligned to top edge of target and not covering target, update bottom bounds to the\n // top of the target (accounting for gap space and beak)\n if ((positions === null || positions === void 0 ? void 0 : positions.targetEdge) === RectangleEdge.top && (targetRect === null || targetRect === void 0 ? void 0 : targetRect.top) && !coverTarget) {\n bottomBounds = targetRect.top - calculateGapSpace(isBeakVisible, beakWidth, gapSpace);\n }\n if (typeof top === 'number' && bottomBounds) {\n calculatedHeight = bottomBounds - top;\n }\n else if (typeof bottom === 'number' && typeof topBounds === 'number' && bottomBounds) {\n calculatedHeight = bottomBounds - topBounds - bottom;\n }\n if ((!calloutMaxHeight && !hidden) ||\n (calloutMaxHeight && calculatedHeight && calloutMaxHeight > calculatedHeight)) {\n setMaxHeight(calculatedHeight);\n }\n else if (calloutMaxHeight) {\n setMaxHeight(calloutMaxHeight);\n }\n else {\n setMaxHeight(undefined);\n }\n }, [\n bottom,\n calloutMaxHeight,\n finalHeight,\n directionalHint,\n directionalHintFixed,\n getBounds,\n hidden,\n positions,\n top,\n gapSpace,\n beakWidth,\n isBeakVisible,\n targetRect,\n coverTarget,\n ]);\n return maxHeight;\n}\n/**\n * (Hook) to find the current position of Callout. If Callout is resized then a new position is calculated.\n */\nfunction usePositions(props, hostElement, calloutElement, targetRef, getBounds, popupRef) {\n var _a = React.useState(), positions = _a[0], setPositions = _a[1];\n var positionAttempts = React.useRef(0);\n var previousTarget = React.useRef();\n var async = useAsync();\n var hidden = props.hidden, target = props.target, finalHeight = props.finalHeight, calloutMaxHeight = props.calloutMaxHeight, onPositioned = props.onPositioned, directionalHint = props.directionalHint, hideOverflow = props.hideOverflow, preferScrollResizePositioning = props.preferScrollResizePositioning;\n var win = useWindowEx();\n var localRef = React.useRef();\n var popupStyles;\n if (localRef.current !== popupRef.current) {\n localRef.current = popupRef.current;\n popupStyles = popupRef.current ? win === null || win === void 0 ? void 0 : win.getComputedStyle(popupRef.current) : undefined;\n }\n var popupOverflowY = popupStyles === null || popupStyles === void 0 ? void 0 : popupStyles.overflowY;\n React.useEffect(function () {\n if (!hidden) {\n var timerId_1 = async.requestAnimationFrame(function () {\n var _a, _b;\n if (hostElement.current && calloutElement) {\n var currentProps = __assign(__assign({}, props), { target: targetRef.current, bounds: getBounds() });\n // duplicate calloutElement & remove useMaxHeight's maxHeight for position calc\n var dupeCalloutElement = calloutElement.cloneNode(true);\n dupeCalloutElement.style.maxHeight = calloutMaxHeight ? \"\".concat(calloutMaxHeight) : '';\n dupeCalloutElement.style.visibility = 'hidden';\n (_a = calloutElement.parentElement) === null || _a === void 0 ? void 0 : _a.appendChild(dupeCalloutElement);\n var previousPositions = previousTarget.current === target ? positions : undefined;\n // only account for scroll resizing if styles allow callout to scroll\n // (popup styles determine if callout will scroll)\n var isOverflowYHidden = hideOverflow || popupOverflowY === 'clip' || popupOverflowY === 'hidden';\n var shouldScroll = preferScrollResizePositioning && !isOverflowYHidden;\n // If there is a finalHeight given then we assume that the user knows and will handle\n // additional positioning adjustments so we should call positionCard\n var newPositions = finalHeight\n ? positionCard(currentProps, hostElement.current, dupeCalloutElement, previousPositions, win)\n : positionCallout(currentProps, hostElement.current, dupeCalloutElement, previousPositions, shouldScroll, undefined, win);\n // clean up duplicate calloutElement\n (_b = calloutElement.parentElement) === null || _b === void 0 ? void 0 : _b.removeChild(dupeCalloutElement);\n // Set the new position only when the positions do not exist or one of the new callout positions\n // is different. The position should not change if the position is within 2 decimal places.\n if ((!positions && newPositions) ||\n (positions && newPositions && !arePositionsEqual(positions, newPositions) && positionAttempts.current < 5)) {\n // We should not reposition the callout more than a few times, if it is then the content is likely resizing\n // and we should stop trying to reposition to prevent a stack overflow.\n positionAttempts.current++;\n setPositions(newPositions);\n }\n else if (positionAttempts.current > 0) {\n // Only call the onPositioned callback if the callout has been re-positioned at least once.\n positionAttempts.current = 0;\n onPositioned === null || onPositioned === void 0 ? void 0 : onPositioned(positions);\n }\n }\n }, calloutElement);\n previousTarget.current = target;\n return function () {\n async.cancelAnimationFrame(timerId_1);\n previousTarget.current = undefined;\n };\n }\n else {\n // When the callout is hidden, clear position state so that it is not accidentally used next render.\n setPositions(undefined);\n positionAttempts.current = 0;\n }\n }, [\n hidden,\n directionalHint,\n async,\n calloutElement,\n calloutMaxHeight,\n hostElement,\n targetRef,\n finalHeight,\n getBounds,\n onPositioned,\n positions,\n props,\n target,\n hideOverflow,\n preferScrollResizePositioning,\n popupOverflowY,\n win,\n ]);\n return positions;\n}\n/**\n * (Hook) to set up behavior to automatically focus the callout when it appears, if indicated by props.\n */\nfunction useAutoFocus(_a, positions, calloutElement) {\n var hidden = _a.hidden, setInitialFocus = _a.setInitialFocus;\n var async = useAsync();\n var hasPositions = !!positions;\n React.useEffect(function () {\n if (!hidden && setInitialFocus && hasPositions && calloutElement) {\n var timerId_2 = async.requestAnimationFrame(function () { return focusFirstChild(calloutElement); }, calloutElement);\n return function () { return async.cancelAnimationFrame(timerId_2); };\n }\n }, [hidden, hasPositions, async, calloutElement, setInitialFocus]);\n}\n/**\n * (Hook) to set up various handlers to dismiss the popup when it loses focus or the window scrolls or similar cases.\n */\nfunction useDismissHandlers(_a, positions, hostElement, targetRef, targetWindow) {\n var hidden = _a.hidden, onDismiss = _a.onDismiss, preventDismissOnScroll = _a.preventDismissOnScroll, preventDismissOnResize = _a.preventDismissOnResize, preventDismissOnLostFocus = _a.preventDismissOnLostFocus, dismissOnTargetClick = _a.dismissOnTargetClick, shouldDismissOnWindowFocus = _a.shouldDismissOnWindowFocus, preventDismissOnEvent = _a.preventDismissOnEvent;\n var isMouseDownOnPopup = React.useRef(false);\n var async = useAsync();\n var mouseDownHandlers = useConst([\n function () {\n isMouseDownOnPopup.current = true;\n },\n function () {\n isMouseDownOnPopup.current = false;\n },\n ]);\n var positionsExists = !!positions;\n React.useEffect(function () {\n var dismissOnScroll = function (ev) {\n if (positionsExists && !preventDismissOnScroll) {\n dismissOnClickOrScroll(ev);\n }\n };\n var dismissOnResize = function (ev) {\n if (!preventDismissOnResize && !(preventDismissOnEvent && preventDismissOnEvent(ev))) {\n onDismiss === null || onDismiss === void 0 ? void 0 : onDismiss(ev);\n }\n };\n var dismissOnLostFocus = function (ev) {\n if (!preventDismissOnLostFocus) {\n dismissOnClickOrScroll(ev);\n }\n };\n var dismissOnClickOrScroll = function (ev) {\n var eventPaths = ev.composedPath ? ev.composedPath() : [];\n var target = eventPaths.length > 0 ? eventPaths[0] : ev.target;\n var isEventTargetOutsideCallout = hostElement.current && !elementContains(hostElement.current, target);\n // If mouse is pressed down on callout but moved outside then released, don't dismiss the callout.\n if (isEventTargetOutsideCallout && isMouseDownOnPopup.current) {\n isMouseDownOnPopup.current = false;\n return;\n }\n if ((!targetRef.current && isEventTargetOutsideCallout) ||\n (ev.target !== targetWindow &&\n isEventTargetOutsideCallout &&\n (!targetRef.current ||\n 'stopPropagation' in targetRef.current ||\n dismissOnTargetClick ||\n (target !== targetRef.current && !elementContains(targetRef.current, target))))) {\n if (preventDismissOnEvent && preventDismissOnEvent(ev)) {\n return;\n }\n onDismiss === null || onDismiss === void 0 ? void 0 : onDismiss(ev);\n }\n };\n var dismissOnTargetWindowBlur = function (ev) {\n // Do nothing\n if (!shouldDismissOnWindowFocus) {\n return;\n }\n if (((preventDismissOnEvent && !preventDismissOnEvent(ev)) ||\n (!preventDismissOnEvent && !preventDismissOnLostFocus)) &&\n !(targetWindow === null || targetWindow === void 0 ? void 0 : targetWindow.document.hasFocus()) &&\n ev.relatedTarget === null) {\n onDismiss === null || onDismiss === void 0 ? void 0 : onDismiss(ev);\n }\n };\n // This is added so the callout will dismiss when the window is scrolled\n // but not when something inside the callout is scrolled. The delay seems\n // to be required to avoid React firing an async focus event in IE from\n // the target changing focus quickly prior to rendering the callout.\n var disposablesPromise = new Promise(function (resolve) {\n async.setTimeout(function () {\n if (!hidden && targetWindow) {\n var disposables_1 = [\n on(targetWindow, 'scroll', dismissOnScroll, true),\n on(targetWindow, 'resize', dismissOnResize, true),\n on(targetWindow.document.documentElement, 'focus', dismissOnLostFocus, true),\n on(targetWindow.document.documentElement, 'click', dismissOnLostFocus, true),\n on(targetWindow, 'blur', dismissOnTargetWindowBlur, true),\n ];\n resolve(function () {\n disposables_1.forEach(function (dispose) { return dispose(); });\n });\n }\n }, 0);\n });\n return function () {\n disposablesPromise.then(function (dispose) { return dispose(); });\n };\n }, [\n hidden,\n async,\n hostElement,\n targetRef,\n targetWindow,\n onDismiss,\n shouldDismissOnWindowFocus,\n dismissOnTargetClick,\n preventDismissOnLostFocus,\n preventDismissOnResize,\n preventDismissOnScroll,\n positionsExists,\n preventDismissOnEvent,\n ]);\n return mouseDownHandlers;\n}\nexport var CalloutContentBase = React.memo(React.forwardRef(function (propsWithoutDefaults, forwardedRef) {\n var props = getPropsWithDefaults(DEFAULT_PROPS, propsWithoutDefaults);\n var styles = props.styles, style = props.style, ariaLabel = props.ariaLabel, ariaDescribedBy = props.ariaDescribedBy, ariaLabelledBy = props.ariaLabelledBy, className = props.className, isBeakVisible = props.isBeakVisible, children = props.children, beakWidth = props.beakWidth, calloutWidth = props.calloutWidth, calloutMaxWidth = props.calloutMaxWidth, calloutMinWidth = props.calloutMinWidth, doNotLayer = props.doNotLayer, finalHeight = props.finalHeight, _a = props.hideOverflow, hideOverflow = _a === void 0 ? !!finalHeight : _a, backgroundColor = props.backgroundColor, calloutMaxHeight = props.calloutMaxHeight, onScroll = props.onScroll, \n // eslint-disable-next-line @typescript-eslint/no-deprecated\n _b = props.shouldRestoreFocus, \n // eslint-disable-next-line @typescript-eslint/no-deprecated\n shouldRestoreFocus = _b === void 0 ? true : _b, target = props.target, hidden = props.hidden, onLayerMounted = props.onLayerMounted, popupProps = props.popupProps;\n var hostElement = React.useRef(null);\n var popupRef = React.useRef(null);\n var mergedPopupRefs = useMergedRefs(popupRef, popupProps === null || popupProps === void 0 ? void 0 : popupProps.ref);\n var _c = React.useState(null), calloutElement = _c[0], setCalloutElement = _c[1];\n var calloutCallback = React.useCallback(function (calloutEl) {\n setCalloutElement(calloutEl);\n }, []);\n var rootRef = useMergedRefs(hostElement, forwardedRef);\n var _d = useTarget(props.target, {\n current: calloutElement,\n }), targetRef = _d[0], targetWindow = _d[1];\n var getBounds = useBounds(props, targetRef, targetWindow);\n var positions = usePositions(props, hostElement, calloutElement, targetRef, getBounds, mergedPopupRefs);\n var maxHeight = useMaxHeight(props, getBounds, targetRef, positions);\n var _e = useDismissHandlers(props, positions, hostElement, targetRef, targetWindow), mouseDownOnPopup = _e[0], mouseUpOnPopup = _e[1];\n // do not set both top and bottom css props from positions\n // instead, use maxHeight\n var isForcedInBounds = (positions === null || positions === void 0 ? void 0 : positions.elementPosition.top) && (positions === null || positions === void 0 ? void 0 : positions.elementPosition.bottom);\n var cssPositions = __assign(__assign({}, positions === null || positions === void 0 ? void 0 : positions.elementPosition), { maxHeight: maxHeight });\n if (isForcedInBounds) {\n cssPositions.bottom = undefined;\n }\n useAutoFocus(props, positions, calloutElement);\n React.useEffect(function () {\n if (!hidden) {\n onLayerMounted === null || onLayerMounted === void 0 ? void 0 : onLayerMounted();\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps -- should only run if hidden changes\n }, [hidden]);\n // If there is no target window then we are likely in server side rendering and we should not render anything.\n if (!targetWindow) {\n return null;\n }\n var overflowYHidden = hideOverflow;\n var beakVisible = isBeakVisible && !!target;\n var classNames = getClassNames(styles, {\n theme: props.theme,\n className: className,\n overflowYHidden: overflowYHidden,\n calloutWidth: calloutWidth,\n positions: positions,\n beakWidth: beakWidth,\n backgroundColor: backgroundColor,\n calloutMaxWidth: calloutMaxWidth,\n calloutMinWidth: calloutMinWidth,\n doNotLayer: doNotLayer,\n });\n var overflowStyle = __assign(__assign({ maxHeight: calloutMaxHeight ? calloutMaxHeight : '100%' }, style), (overflowYHidden && { overflowY: 'hidden' }));\n var visibilityStyle = props.hidden ? { visibility: 'hidden' } : undefined;\n // React.CSSProperties does not understand IRawStyle, so the inline animations will need to be cast as any for now.\n return (React.createElement(\"div\", { ref: rootRef, className: classNames.container, style: visibilityStyle },\n React.createElement(\"div\", __assign({}, getNativeProps(props, divProperties, ARIA_ROLE_ATTRIBUTES), { className: css(classNames.root, positions && positions.targetEdge && ANIMATIONS[positions.targetEdge]), style: positions ? __assign({}, cssPositions) : OFF_SCREEN_STYLE, \n // Safari and Firefox on Mac OS requires this to back-stop click events so focus remains in the Callout.\n // See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#Clicking_and_focus\n tabIndex: -1, ref: calloutCallback }),\n beakVisible && React.createElement(\"div\", { className: classNames.beak, style: getBeakPosition(positions) }),\n beakVisible && React.createElement(\"div\", { className: classNames.beakCurtain }),\n React.createElement(Popup\n // don't use getNativeElementProps for role and roledescription because it will also\n // pass through data-* props (resulting in them being used in two places)\n , __assign({ \n // don't use getNativeElementProps for role and roledescription because it will also\n // pass through data-* props (resulting in them being used in two places)\n role: props.role, \"aria-roledescription\": props['aria-roledescription'], ariaDescribedBy: ariaDescribedBy, ariaLabel: ariaLabel, ariaLabelledBy: ariaLabelledBy, className: classNames.calloutMain, onDismiss: props.onDismiss, onMouseDown: mouseDownOnPopup, onMouseUp: mouseUpOnPopup, onRestoreFocus: props.onRestoreFocus, onScroll: onScroll, shouldRestoreFocus: shouldRestoreFocus, style: overflowStyle }, popupProps, { ref: mergedPopupRefs }), children))));\n}), function (previousProps, nextProps) {\n if (!nextProps.shouldUpdateWhenHidden && previousProps.hidden && nextProps.hidden) {\n // Do not update when hidden.\n return true;\n }\n return shallowCompare(previousProps, nextProps);\n});\n/**\n * (Utility) to find and return the current `Callout` Beak position.\n *\n * @param positions\n */\nfunction getBeakPosition(positions) {\n var _a, _b;\n var beakPositionStyle = __assign(__assign({}, (_a = positions === null || positions === void 0 ? void 0 : positions.beakPosition) === null || _a === void 0 ? void 0 : _a.elementPosition), { display: ((_b = positions === null || positions === void 0 ? void 0 : positions.beakPosition) === null || _b === void 0 ? void 0 : _b.hideBeak) ? 'none' : undefined });\n if (!beakPositionStyle.top && !beakPositionStyle.bottom && !beakPositionStyle.left && !beakPositionStyle.right) {\n beakPositionStyle.left = BEAK_ORIGIN_POSITION.left;\n beakPositionStyle.top = BEAK_ORIGIN_POSITION.top;\n }\n return beakPositionStyle;\n}\n/**\n * (Utility) used to compare two different elementPositions to determine whether they are equal.\n *\n * @param prevElementPositions\n * @param newElementPosition\n */\nfunction arePositionsEqual(prevElementPositions, newElementPosition) {\n return (comparePositions(prevElementPositions.elementPosition, newElementPosition.elementPosition) &&\n comparePositions(prevElementPositions.beakPosition.elementPosition, newElementPosition.beakPosition.elementPosition));\n}\n/**\n * (Utility) used in **arePositionsEqual** to compare two different elementPositions.\n *\n * @param prevElementPositions\n * @param newElementPositions\n */\nfunction comparePositions(prevElementPositions, newElementPositions) {\n for (var key in newElementPositions) {\n if (newElementPositions.hasOwnProperty(key)) {\n var oldPositionEdge = prevElementPositions[key];\n var newPositionEdge = newElementPositions[key];\n if (oldPositionEdge !== undefined && newPositionEdge !== undefined) {\n if (oldPositionEdge.toFixed(2) !== newPositionEdge.toFixed(2)) {\n return false;\n }\n }\n else {\n return false;\n }\n }\n }\n return true;\n}\nCalloutContentBase.displayName = COMPONENT_NAME;\n//# sourceMappingURL=CalloutContent.base.js.map","import { HighContrastSelector, focusClear, getGlobalClassNames, ZIndexes } from '../../Styling';\nfunction getBeakStyle(beakWidth) {\n return {\n height: beakWidth,\n width: beakWidth,\n };\n}\nvar GlobalClassNames = {\n container: 'ms-Callout-container',\n root: 'ms-Callout',\n beak: 'ms-Callout-beak',\n beakCurtain: 'ms-Callout-beakCurtain',\n calloutMain: 'ms-Callout-main',\n};\nexport var getStyles = function (props) {\n var _a;\n var theme = props.theme, className = props.className, overflowYHidden = props.overflowYHidden, calloutWidth = props.calloutWidth, beakWidth = props.beakWidth, backgroundColor = props.backgroundColor, calloutMaxWidth = props.calloutMaxWidth, calloutMinWidth = props.calloutMinWidth, doNotLayer = props.doNotLayer;\n var classNames = getGlobalClassNames(GlobalClassNames, theme);\n var semanticColors = theme.semanticColors, effects = theme.effects;\n return {\n container: [\n classNames.container,\n {\n position: 'relative',\n },\n ],\n root: [\n classNames.root,\n theme.fonts.medium,\n {\n position: 'absolute',\n display: 'flex',\n zIndex: doNotLayer ? ZIndexes.Layer : undefined,\n boxSizing: 'border-box',\n borderRadius: effects.roundedCorner2,\n boxShadow: effects.elevation16,\n selectors: (_a = {},\n _a[HighContrastSelector] = {\n borderWidth: 1,\n borderStyle: 'solid',\n borderColor: 'WindowText',\n },\n _a),\n },\n focusClear(),\n className,\n !!calloutWidth && { width: calloutWidth },\n !!calloutMaxWidth && { maxWidth: calloutMaxWidth },\n !!calloutMinWidth && { minWidth: calloutMinWidth },\n ],\n beak: [\n classNames.beak,\n {\n position: 'absolute',\n backgroundColor: semanticColors.menuBackground,\n boxShadow: 'inherit',\n border: 'inherit',\n boxSizing: 'border-box',\n transform: 'rotate(45deg)',\n },\n getBeakStyle(beakWidth),\n backgroundColor && {\n backgroundColor: backgroundColor,\n },\n ],\n beakCurtain: [\n classNames.beakCurtain,\n {\n position: 'absolute',\n top: 0,\n right: 0,\n bottom: 0,\n left: 0,\n backgroundColor: semanticColors.menuBackground,\n borderRadius: effects.roundedCorner2,\n },\n ],\n calloutMain: [\n classNames.calloutMain,\n {\n backgroundColor: semanticColors.menuBackground,\n overflowX: 'hidden',\n overflowY: 'auto',\n position: 'relative',\n width: '100%',\n borderRadius: effects.roundedCorner2,\n },\n overflowYHidden && {\n overflowY: 'hidden',\n },\n backgroundColor && {\n backgroundColor: backgroundColor,\n },\n ],\n };\n};\n//# sourceMappingURL=CalloutContent.styles.js.map","import { styled } from '../../Utilities';\nimport { CalloutContentBase } from './CalloutContent.base';\nimport { getStyles } from './CalloutContent.styles';\nexport var CalloutContent = styled(CalloutContentBase, getStyles, undefined, {\n scope: 'CalloutContent',\n});\n//# sourceMappingURL=CalloutContent.js.map","import * as React from 'react';\nimport { Icon, FontIcon } from '../../Icon';\nimport { classNamesFunction } from '../../Utilities';\nvar getClassNames = classNamesFunction();\nexport var CheckBase = React.forwardRef(function (props, ref) {\n var _a = props.checked, checked = _a === void 0 ? false : _a, className = props.className, theme = props.theme, styles = props.styles, _b = props.useFastIcons, useFastIcons = _b === void 0 ? true : _b;\n var classNames = getClassNames(styles, { theme: theme, className: className, checked: checked });\n var IconComponent = useFastIcons ? FontIcon : Icon;\n return (React.createElement(\"div\", { className: classNames.root, ref: ref },\n React.createElement(IconComponent, { iconName: \"CircleRing\", className: classNames.circle }),\n React.createElement(IconComponent, { iconName: \"StatusCircleCheckmark\", className: classNames.check })));\n});\nCheckBase.displayName = 'CheckBase';\n//# sourceMappingURL=Check.base.js.map","import { styled } from '../../Utilities';\nimport { CheckBase } from './Check.base';\nimport { getStyles } from './Check.styles';\nexport var Check = styled(CheckBase, getStyles, undefined, {\n scope: 'Check',\n}, true);\n//# sourceMappingURL=Check.js.map","import { __assign } from \"tslib\";\nimport { HighContrastSelector, getGlobalClassNames, IconFontSizes, getHighContrastNoAdjustStyle } from '../../Styling';\nimport { getRTL } from '../../Utilities';\nexport var CheckGlobalClassNames = {\n root: 'ms-Check',\n circle: 'ms-Check-circle',\n check: 'ms-Check-check',\n /** Must be manually applied to the parent element of the check. */\n checkHost: 'ms-Check-checkHost',\n};\nexport var getStyles = function (props) {\n var _a, _b, _c, _d, _e;\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n var _f = props.height, height = _f === void 0 ? props.checkBoxHeight || '18px' : _f, checked = props.checked, className = props.className, theme = props.theme;\n var palette = theme.palette, semanticColors = theme.semanticColors, fonts = theme.fonts;\n var isRTL = getRTL(theme);\n var classNames = getGlobalClassNames(CheckGlobalClassNames, theme);\n var sharedCircleCheck = {\n fontSize: height,\n position: 'absolute',\n left: 0,\n top: 0,\n width: height,\n height: height,\n textAlign: 'center',\n // inline-flex prevents the check from shifting with custom line height styles\n display: 'inline-flex',\n alignItems: 'center',\n justifyContent: 'center',\n verticalAlign: 'middle',\n };\n return {\n root: [\n classNames.root,\n fonts.medium,\n {\n // lineHeight currently needs to be a string to output without 'px'\n lineHeight: '1',\n width: height,\n height: height,\n verticalAlign: 'top',\n position: 'relative',\n userSelect: 'none',\n selectors: (_a = {\n ':before': {\n content: '\"\"',\n position: 'absolute',\n top: '1px',\n right: '1px',\n bottom: '1px',\n left: '1px',\n borderRadius: '50%',\n opacity: 1,\n background: semanticColors.bodyBackground,\n }\n },\n _a[\".\".concat(classNames.checkHost, \":hover &, .\").concat(classNames.checkHost, \":focus &, &:hover, &:focus\")] = {\n opacity: 1,\n },\n _a),\n },\n checked && [\n 'is-checked',\n {\n selectors: {\n ':before': {\n background: palette.themePrimary,\n opacity: 1,\n selectors: (_b = {},\n _b[HighContrastSelector] = {\n background: 'Window',\n },\n _b),\n },\n },\n },\n ],\n className,\n ],\n circle: [\n classNames.circle,\n sharedCircleCheck,\n {\n color: palette.neutralSecondary,\n selectors: (_c = {},\n _c[HighContrastSelector] = {\n color: 'WindowText',\n },\n _c),\n },\n checked && {\n color: palette.white,\n },\n ],\n check: [\n classNames.check,\n sharedCircleCheck,\n {\n opacity: 0,\n color: palette.neutralSecondary,\n fontSize: IconFontSizes.medium,\n left: isRTL ? '-0.5px' : '.5px', // for centering the check icon inside the circle.\n top: '-1px', // the check is slightly lower than center compared to the circle.\n selectors: (_d = {\n ':hover': {\n opacity: 1,\n }\n },\n _d[HighContrastSelector] = __assign({}, getHighContrastNoAdjustStyle()),\n _d),\n },\n checked && {\n opacity: 1,\n color: palette.white,\n fontWeight: 900,\n selectors: (_e = {},\n _e[HighContrastSelector] = {\n border: 'none',\n color: 'WindowText',\n },\n _e),\n },\n ],\n checkHost: classNames.checkHost,\n };\n};\n//# sourceMappingURL=Check.styles.js.map","import { __assign } from \"tslib\";\nimport * as React from 'react';\nimport { useControllableValue, useId, useMergedRefs, useWarnings } from '@fluentui/react-hooks';\nimport { useFocusRects, classNamesFunction } from '@fluentui/utilities';\nimport { Icon } from '../Icon/Icon';\nvar getClassNames = classNamesFunction();\nexport var CheckboxBase = React.forwardRef(function (props, forwardedRef) {\n var disabled = props.disabled, required = props.required, inputProps = props.inputProps, name = props.name, ariaLabel = props.ariaLabel, ariaLabelledBy = props.ariaLabelledBy, ariaDescribedBy = props.ariaDescribedBy, ariaPositionInSet = props.ariaPositionInSet, ariaSetSize = props.ariaSetSize, title = props.title, checkmarkIconProps = props.checkmarkIconProps, styles = props.styles, theme = props.theme, className = props.className, _a = props.boxSide, boxSide = _a === void 0 ? 'start' : _a;\n var id = useId('checkbox-', props.id);\n var rootRef = React.useRef(null);\n var mergedRootRefs = useMergedRefs(rootRef, forwardedRef);\n var inputRef = React.useRef(null);\n var _b = useControllableValue(props.checked, props.defaultChecked, props.onChange), isChecked = _b[0], setIsChecked = _b[1];\n var _c = useControllableValue(props.indeterminate, props.defaultIndeterminate), isIndeterminate = _c[0], setIsIndeterminate = _c[1];\n useFocusRects(rootRef);\n useDebugWarning(props);\n var classNames = getClassNames(styles, {\n theme: theme,\n className: className,\n disabled: disabled,\n indeterminate: isIndeterminate,\n checked: isChecked,\n reversed: boxSide !== 'start',\n isUsingCustomLabelRender: !!props.onRenderLabel,\n });\n var onChange = React.useCallback(function (event) {\n if (isIndeterminate) {\n // If indeterminate, clicking the checkbox *only* removes the indeterminate state (or if\n // controlled, lets the consumer know to change it by calling onChange). It doesn't\n // change the checked state.\n setIsChecked(!!isChecked, event);\n setIsIndeterminate(false);\n }\n else {\n setIsChecked(!isChecked, event);\n }\n }, [setIsChecked, setIsIndeterminate, isIndeterminate, isChecked]);\n var defaultLabelRenderer = React.useCallback(function (checkboxProps) {\n if (!checkboxProps) {\n return null;\n }\n return checkboxProps.label ? (React.createElement(\"span\", { className: classNames.text, title: checkboxProps.title }, checkboxProps.label)) : null;\n }, [classNames.text]);\n var setNativeIndeterminate = React.useCallback(function (indeterminate) {\n if (!inputRef.current) {\n return;\n }\n var value = !!indeterminate;\n inputRef.current.indeterminate = value;\n setIsIndeterminate(value);\n }, [setIsIndeterminate]);\n useComponentRef(props, isChecked, isIndeterminate, setNativeIndeterminate, inputRef);\n React.useEffect(function () { return setNativeIndeterminate(isIndeterminate); }, [setNativeIndeterminate, isIndeterminate]);\n var onRenderLabel = props.onRenderLabel || defaultLabelRenderer;\n var ariaChecked = isIndeterminate\n ? 'mixed'\n : undefined;\n var mergedInputProps = __assign(__assign({ className: classNames.input, type: 'checkbox' }, inputProps), { checked: !!isChecked, disabled: disabled, required: required, name: name, id: id, title: title, onChange: onChange, 'aria-disabled': disabled, 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy, 'aria-describedby': ariaDescribedBy, 'aria-posinset': ariaPositionInSet, 'aria-setsize': ariaSetSize, 'aria-checked': ariaChecked });\n return (React.createElement(\"div\", { className: classNames.root, title: title, ref: mergedRootRefs },\n React.createElement(\"input\", __assign({}, mergedInputProps, { ref: inputRef, title: title, \"data-ktp-execute-target\": true })),\n React.createElement(\"label\", { className: classNames.label, htmlFor: id },\n React.createElement(\"div\", { className: classNames.checkbox, \"data-ktp-target\": true },\n React.createElement(Icon, __assign({ iconName: \"CheckMark\" }, checkmarkIconProps, { className: classNames.checkmark }))),\n onRenderLabel(props, defaultLabelRenderer))));\n});\nCheckboxBase.displayName = 'CheckboxBase';\nfunction useDebugWarning(props) {\n if (process.env.NODE_ENV !== 'production') {\n // eslint-disable-next-line react-hooks/rules-of-hooks -- build-time conditional\n useWarnings({\n name: 'Checkbox',\n props: props,\n mutuallyExclusive: {\n checked: 'defaultChecked',\n indeterminate: 'defaultIndeterminate',\n },\n });\n }\n}\nfunction useComponentRef(props, isChecked, isIndeterminate, setIndeterminate, checkBoxRef) {\n React.useImperativeHandle(props.componentRef, function () { return ({\n get checked() {\n return !!isChecked;\n },\n get indeterminate() {\n return !!isIndeterminate;\n },\n set indeterminate(indeterminate) {\n setIndeterminate(indeterminate);\n },\n focus: function () {\n if (checkBoxRef.current) {\n checkBoxRef.current.focus();\n }\n },\n }); }, [checkBoxRef, isChecked, isIndeterminate, setIndeterminate]);\n}\n//# sourceMappingURL=Checkbox.base.js.map","import { __assign } from \"tslib\";\nimport { HighContrastSelector, getGlobalClassNames, getHighContrastNoAdjustStyle } from '@fluentui/style-utilities';\nimport { IsFocusVisibleClassName } from '@fluentui/utilities';\nvar GlobalClassNames = {\n root: 'ms-Checkbox',\n label: 'ms-Checkbox-label',\n checkbox: 'ms-Checkbox-checkbox',\n checkmark: 'ms-Checkbox-checkmark',\n text: 'ms-Checkbox-text',\n};\nvar MS_CHECKBOX_LABEL_SIZE = '20px';\nvar MS_CHECKBOX_TRANSITION_DURATION = '200ms';\nvar MS_CHECKBOX_TRANSITION_TIMING = 'cubic-bezier(.4, 0, .23, 1)';\nexport var getStyles = function (props) {\n var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t;\n var className = props.className, theme = props.theme, reversed = props.reversed, checked = props.checked, disabled = props.disabled, isUsingCustomLabelRender = props.isUsingCustomLabelRender, indeterminate = props.indeterminate;\n var semanticColors = theme.semanticColors, effects = theme.effects, palette = theme.palette, fonts = theme.fonts;\n var classNames = getGlobalClassNames(GlobalClassNames, theme);\n var checkmarkFontColor = semanticColors.inputForegroundChecked;\n // TODO: after updating the semanticColors slots mapping this needs to be semanticColors.inputBorder\n var checkmarkFontColorHovered = palette.neutralSecondary;\n // TODO: after updating the semanticColors slots mapping this needs to be semanticColors.smallInputBorder\n var checkboxBorderColor = palette.neutralPrimary;\n var checkboxBorderIndeterminateColor = semanticColors.inputBackgroundChecked;\n var checkboxBorderColorChecked = semanticColors.inputBackgroundChecked;\n var checkboxBorderColorDisabled = semanticColors.disabledBodySubtext;\n var checkboxBorderHoveredColor = semanticColors.inputBorderHovered;\n var checkboxBorderIndeterminateHoveredColor = semanticColors.inputBackgroundCheckedHovered;\n var checkboxBackgroundChecked = semanticColors.inputBackgroundChecked;\n // TODO: after updating the semanticColors slots mapping the following 2 tokens need to be\n // semanticColors.inputBackgroundCheckedHovered\n var checkboxBackgroundCheckedHovered = semanticColors.inputBackgroundCheckedHovered;\n var checkboxBorderColorCheckedHovered = semanticColors.inputBackgroundCheckedHovered;\n var checkboxHoveredTextColor = semanticColors.inputTextHovered;\n var checkboxBackgroundDisabledChecked = semanticColors.disabledBodySubtext;\n var checkboxTextColor = semanticColors.bodyText;\n var checkboxTextColorDisabled = semanticColors.disabledText;\n var indeterminateDotStyles = [\n (_a = {\n content: '\"\"',\n borderRadius: effects.roundedCorner2,\n position: 'absolute',\n width: 10,\n height: 10,\n top: 4,\n left: 4,\n boxSizing: 'border-box',\n borderWidth: 5,\n borderStyle: 'solid',\n borderColor: disabled ? checkboxBorderColorDisabled : checkboxBorderIndeterminateColor,\n transitionProperty: 'border-width, border, border-color',\n transitionDuration: MS_CHECKBOX_TRANSITION_DURATION,\n transitionTimingFunction: MS_CHECKBOX_TRANSITION_TIMING\n },\n _a[HighContrastSelector] = {\n borderColor: 'WindowText',\n },\n _a),\n ];\n return {\n root: [\n classNames.root,\n {\n position: 'relative',\n display: 'flex',\n },\n reversed && 'reversed',\n checked && 'is-checked',\n !disabled && 'is-enabled',\n disabled && 'is-disabled',\n !disabled && [\n !checked && (_b = {},\n _b[\":hover .\".concat(classNames.checkbox)] = (_c = {\n borderColor: checkboxBorderHoveredColor\n },\n _c[HighContrastSelector] = {\n borderColor: 'Highlight',\n },\n _c),\n _b[\":focus .\".concat(classNames.checkbox)] = { borderColor: checkboxBorderHoveredColor },\n _b[\":hover .\".concat(classNames.checkmark)] = (_d = {\n color: checkmarkFontColorHovered,\n opacity: '1'\n },\n _d[HighContrastSelector] = {\n color: 'Highlight',\n },\n _d),\n _b),\n checked &&\n !indeterminate && (_e = {},\n _e[\":hover .\".concat(classNames.checkbox)] = {\n background: checkboxBackgroundCheckedHovered,\n borderColor: checkboxBorderColorCheckedHovered,\n },\n _e[\":focus .\".concat(classNames.checkbox)] = {\n background: checkboxBackgroundCheckedHovered,\n borderColor: checkboxBorderColorCheckedHovered,\n },\n _e[HighContrastSelector] = (_f = {},\n _f[\":hover .\".concat(classNames.checkbox)] = {\n background: 'Highlight',\n borderColor: 'Highlight',\n },\n _f[\":focus .\".concat(classNames.checkbox)] = {\n background: 'Highlight',\n },\n _f[\":focus:hover .\".concat(classNames.checkbox)] = {\n background: 'Highlight',\n },\n _f[\":focus:hover .\".concat(classNames.checkmark)] = {\n color: 'Window',\n },\n _f[\":hover .\".concat(classNames.checkmark)] = {\n color: 'Window',\n },\n _f),\n _e),\n indeterminate && (_g = {},\n _g[\":hover .\".concat(classNames.checkbox, \", :hover .\").concat(classNames.checkbox, \":after\")] = (_h = {\n borderColor: checkboxBorderIndeterminateHoveredColor\n },\n _h[HighContrastSelector] = {\n borderColor: 'WindowText',\n },\n _h),\n _g[\":focus .\".concat(classNames.checkbox)] = {\n borderColor: checkboxBorderIndeterminateHoveredColor,\n },\n _g[\":hover .\".concat(classNames.checkmark)] = {\n opacity: '0',\n },\n _g),\n (_j = {},\n _j[\":hover .\".concat(classNames.text, \", :focus .\").concat(classNames.text)] = (_k = {\n color: checkboxHoveredTextColor\n },\n _k[HighContrastSelector] = {\n color: disabled ? 'GrayText' : 'WindowText',\n },\n _k),\n _j),\n ],\n className,\n ],\n input: (_l = {\n position: 'absolute',\n background: 'none',\n opacity: 0\n },\n // eslint-disable-next-line @fluentui/max-len\n _l[\".\".concat(IsFocusVisibleClassName, \" &:focus + label::before, :host(.\").concat(IsFocusVisibleClassName, \") &:focus + label::before\")] = (_m = {\n outline: '1px solid ' + theme.palette.neutralSecondary,\n outlineOffset: '2px'\n },\n _m[HighContrastSelector] = {\n outline: '1px solid WindowText',\n },\n _m),\n _l),\n label: [\n classNames.label,\n theme.fonts.medium,\n {\n display: 'flex',\n alignItems: isUsingCustomLabelRender ? 'center' : 'flex-start',\n cursor: disabled ? 'default' : 'pointer',\n position: 'relative',\n userSelect: 'none',\n },\n reversed && {\n flexDirection: 'row-reverse',\n justifyContent: 'flex-end',\n },\n {\n '&::before': {\n position: 'absolute',\n left: 0,\n right: 0,\n top: 0,\n bottom: 0,\n content: '\"\"',\n pointerEvents: 'none',\n },\n },\n ],\n checkbox: [\n classNames.checkbox,\n (_o = {\n position: 'relative',\n display: 'flex',\n flexShrink: 0,\n alignItems: 'center',\n justifyContent: 'center',\n height: MS_CHECKBOX_LABEL_SIZE,\n width: MS_CHECKBOX_LABEL_SIZE,\n border: \"1px solid \".concat(checkboxBorderColor),\n borderRadius: effects.roundedCorner2,\n boxSizing: 'border-box',\n transitionProperty: 'background, border, border-color',\n transitionDuration: MS_CHECKBOX_TRANSITION_DURATION,\n transitionTimingFunction: MS_CHECKBOX_TRANSITION_TIMING,\n /* in case the icon is bigger than the box */\n overflow: 'hidden',\n ':after': indeterminate ? indeterminateDotStyles : null\n },\n _o[HighContrastSelector] = __assign({ borderColor: 'WindowText' }, getHighContrastNoAdjustStyle()),\n _o),\n indeterminate && {\n borderColor: checkboxBorderIndeterminateColor,\n },\n !reversed\n ? // This margin on the checkbox is for backwards compat. Notably it has the effect where a customRender\n // is used, there will be only a 4px margin from checkbox to label. The label by default would have\n // another 4px margin for a total of 8px margin between checkbox and label. We don't combine the two\n // (and move it into the text) to not incur a breaking change for everyone using custom render atm.\n {\n marginRight: 4,\n }\n : {\n marginLeft: 4,\n },\n !disabled &&\n !indeterminate &&\n checked && (_p = {\n background: checkboxBackgroundChecked,\n borderColor: checkboxBorderColorChecked\n },\n _p[HighContrastSelector] = {\n background: 'Highlight',\n borderColor: 'Highlight',\n },\n _p),\n disabled && (_q = {\n borderColor: checkboxBorderColorDisabled\n },\n _q[HighContrastSelector] = {\n borderColor: 'GrayText',\n },\n _q),\n checked &&\n disabled && (_r = {\n background: checkboxBackgroundDisabledChecked,\n borderColor: checkboxBorderColorDisabled\n },\n _r[HighContrastSelector] = {\n background: 'Window',\n },\n _r),\n ],\n checkmark: [\n classNames.checkmark,\n (_s = {\n opacity: checked && !indeterminate ? '1' : '0',\n color: checkmarkFontColor\n },\n _s[HighContrastSelector] = __assign({ color: disabled ? 'GrayText' : 'Window' }, getHighContrastNoAdjustStyle()),\n _s),\n ],\n text: [\n classNames.text,\n (_t = {\n color: disabled ? checkboxTextColorDisabled : checkboxTextColor,\n fontSize: fonts.medium.fontSize,\n lineHeight: '20px'\n },\n _t[HighContrastSelector] = __assign({ color: disabled ? 'GrayText' : 'WindowText' }, getHighContrastNoAdjustStyle()),\n _t),\n !reversed\n ? {\n marginLeft: 4,\n }\n : {\n marginRight: 4,\n },\n ],\n };\n};\n//# sourceMappingURL=Checkbox.styles.js.map","import { styled } from '@fluentui/utilities';\nimport { CheckboxBase } from './Checkbox.base';\nimport { getStyles } from './Checkbox.styles';\nexport var Checkbox = styled(CheckboxBase, getStyles, undefined, { scope: 'Checkbox' });\n//# sourceMappingURL=Checkbox.js.map","import { __assign } from \"tslib\";\nimport * as React from 'react';\nimport { Label } from '../../Label';\nimport { classNamesFunction, find, FocusRectsContext, getNativeProps, divProperties, setFocusVisibility, useFocusRects, } from '../../Utilities';\nimport { ChoiceGroupOption } from './ChoiceGroupOption/index';\nimport { useId, useControllableValue, useMergedRefs, useWarnings } from '@fluentui/react-hooks';\nimport { useDocumentEx } from '../../utilities/dom';\nvar getClassNames = classNamesFunction();\nvar getOptionId = function (option, id) {\n return \"\".concat(id, \"-\").concat(option.key);\n};\nvar findOption = function (options, key) {\n return key === undefined ? undefined : find(options, function (value) { return value.key === key; });\n};\nvar focusSelectedOption = function (options, keyChecked, id, focusProviders, doc) {\n var optionToFocus = findOption(options, keyChecked) || options.filter(function (option) { return !option.disabled; })[0];\n var elementToFocus = optionToFocus && (doc === null || doc === void 0 ? void 0 : doc.getElementById(getOptionId(optionToFocus, id)));\n if (elementToFocus) {\n elementToFocus.focus();\n setFocusVisibility(true, elementToFocus, focusProviders);\n }\n};\nvar focusFromFocusTrapZone = function (evt) {\n return evt.relatedTarget instanceof HTMLElement && evt.relatedTarget.dataset.isFocusTrapZoneBumper === 'true';\n};\nvar useComponentRef = function (options, keyChecked, id, componentRef, focusProviders) {\n var doc = useDocumentEx();\n React.useImperativeHandle(componentRef, function () { return ({\n get checkedOption() {\n return findOption(options, keyChecked);\n },\n focus: function () {\n focusSelectedOption(options, keyChecked, id, focusProviders, doc);\n },\n }); }, [options, keyChecked, id, focusProviders, doc]);\n};\nvar COMPONENT_NAME = 'ChoiceGroup';\nexport var ChoiceGroupBase = React.forwardRef(function (props, forwardedRef) {\n var className = props.className, theme = props.theme, styles = props.styles, _a = props.options, options = _a === void 0 ? [] : _a, label = props.label, required = props.required, disabled = props.disabled, name = props.name, defaultSelectedKey = props.defaultSelectedKey, componentRef = props.componentRef, onChange = props.onChange;\n var id = useId('ChoiceGroup');\n var labelId = useId('ChoiceGroupLabel');\n var divProps = getNativeProps(props, divProperties, [\n 'onChange',\n 'className',\n 'required',\n ]);\n var classNames = getClassNames(styles, {\n theme: theme,\n className: className,\n optionsContainIconOrImage: options.some(function (option) { return !!(option.iconProps || option.imageSrc); }),\n });\n var ariaLabelledBy = props.ariaLabelledBy || (label ? labelId : props['aria-labelledby']);\n var _b = useControllableValue(props.selectedKey, defaultSelectedKey), keyChecked = _b[0], setKeyChecked = _b[1];\n var _c = React.useState(), keyFocused = _c[0], setKeyFocused = _c[1];\n var rootRef = React.useRef(null);\n var mergedRootRefs = useMergedRefs(rootRef, forwardedRef);\n var focusContext = React.useContext(FocusRectsContext);\n useDebugWarnings(props);\n useComponentRef(options, keyChecked, id, componentRef, focusContext === null || focusContext === void 0 ? void 0 : focusContext.registeredProviders);\n useFocusRects(rootRef);\n var onFocus = React.useCallback(function (ev, option) {\n var _a;\n if (option) {\n setKeyFocused(option.itemKey);\n (_a = option.onFocus) === null || _a === void 0 ? void 0 : _a.call(option, ev);\n }\n }, []);\n var onBlur = React.useCallback(function (ev, option) {\n var _a;\n setKeyFocused(undefined);\n (_a = option === null || option === void 0 ? void 0 : option.onBlur) === null || _a === void 0 ? void 0 : _a.call(option, ev);\n }, []);\n var onOptionChange = React.useCallback(function (evt, option) {\n var _a;\n if (!option) {\n return;\n }\n setKeyChecked(option.itemKey);\n (_a = option.onChange) === null || _a === void 0 ? void 0 : _a.call(option, evt);\n onChange === null || onChange === void 0 ? void 0 : onChange(evt, findOption(options, option.itemKey));\n }, [onChange, options, setKeyChecked]);\n var onRadioFocus = React.useCallback(function (evt) {\n // Handles scenarios like this bug: https://github.com/microsoft/fluentui/issues/20173\n if (focusFromFocusTrapZone(evt)) {\n focusSelectedOption(options, keyChecked, id, focusContext === null || focusContext === void 0 ? void 0 : focusContext.registeredProviders);\n }\n }, [options, keyChecked, id, focusContext]);\n return (React.createElement(\"div\", __assign({ className: classNames.root }, divProps, { ref: mergedRootRefs }),\n React.createElement(\"div\", __assign({ role: \"radiogroup\" }, (ariaLabelledBy && { 'aria-labelledby': ariaLabelledBy }), { onFocus: onRadioFocus }),\n label && (React.createElement(Label, { className: classNames.label, required: required, id: labelId, disabled: disabled }, label)),\n React.createElement(\"div\", { className: classNames.flexContainer }, options.map(function (option) {\n return (React.createElement(ChoiceGroupOption, __assign({ itemKey: option.key }, option, { key: option.key, onBlur: onBlur, onFocus: onFocus, onChange: onOptionChange, focused: option.key === keyFocused, checked: option.key === keyChecked, disabled: option.disabled || disabled, id: getOptionId(option, id), labelId: option.labelId || \"\".concat(labelId, \"-\").concat(option.key), name: name || id, required: required })));\n })))));\n});\nChoiceGroupBase.displayName = COMPONENT_NAME;\nfunction useDebugWarnings(props) {\n if (process.env.NODE_ENV !== 'production') {\n // eslint-disable-next-line react-hooks/rules-of-hooks -- build-time conditional\n useWarnings({\n name: COMPONENT_NAME,\n props: props,\n mutuallyExclusive: {\n selectedKey: 'defaultSelectedKey',\n },\n });\n }\n}\n//# sourceMappingURL=ChoiceGroup.base.js.map","import { getGlobalClassNames } from '../../Styling';\nvar GlobalClassNames = {\n root: 'ms-ChoiceFieldGroup',\n flexContainer: 'ms-ChoiceFieldGroup-flexContainer',\n};\nexport var getStyles = function (props) {\n var className = props.className, optionsContainIconOrImage = props.optionsContainIconOrImage, theme = props.theme;\n var classNames = getGlobalClassNames(GlobalClassNames, theme);\n return {\n root: [\n className,\n classNames.root,\n theme.fonts.medium,\n {\n display: 'block',\n },\n ],\n flexContainer: [\n classNames.flexContainer,\n optionsContainIconOrImage && {\n display: 'flex',\n flexDirection: 'row',\n flexWrap: 'wrap',\n },\n ],\n };\n};\n//# sourceMappingURL=ChoiceGroup.styles.js.map","import { styled } from '../../Utilities';\nimport { ChoiceGroupBase } from './ChoiceGroup.base';\nimport { getStyles } from './ChoiceGroup.styles';\nexport var ChoiceGroup = styled(ChoiceGroupBase, getStyles, undefined, { scope: 'ChoiceGroup' });\n//# sourceMappingURL=ChoiceGroup.js.map","import { __assign, __rest } from \"tslib\";\nimport * as React from 'react';\nimport { Image } from '../../../Image';\nimport { Icon } from '../../../Icon';\nimport { classNamesFunction, getNativeProps, inputProperties, css, composeRenderFunction, getPropsWithDefaults, } from '../../../Utilities';\nvar getClassNames = classNamesFunction();\nvar LARGE_IMAGE_SIZE = 71;\nvar DEFAULT_PROPS = {\n // This ensures default imageSize value doesn't mutate. Mutation can cause style re-calcuation.\n imageSize: { width: 32, height: 32 },\n};\nexport var ChoiceGroupOptionBase = function (propsWithoutDefaults) {\n // Mix the `key` prop back in since custom render functions may be expecting it\n // (React uses `key` internally rather than passing it through to the component)\n var props = getPropsWithDefaults(__assign(__assign({}, DEFAULT_PROPS), { key: propsWithoutDefaults.itemKey }), propsWithoutDefaults);\n var ariaLabel = props.ariaLabel, focused = props.focused, required = props.required, theme = props.theme, iconProps = props.iconProps, imageSrc = props.imageSrc, imageSize = props.imageSize, disabled = props.disabled, checked = props.checked, id = props.id, styles = props.styles, name = props.name, rest = __rest(props, [\"ariaLabel\", \"focused\", \"required\", \"theme\", \"iconProps\", \"imageSrc\", \"imageSize\", \"disabled\", \"checked\", \"id\", \"styles\", \"name\"]);\n var classNames = getClassNames(styles, {\n theme: theme,\n hasIcon: !!iconProps,\n hasImage: !!imageSrc,\n checked: checked,\n disabled: disabled,\n imageIsLarge: !!imageSrc && (imageSize.width > LARGE_IMAGE_SIZE || imageSize.height > LARGE_IMAGE_SIZE),\n imageSize: imageSize,\n focused: focused,\n });\n var _a = getNativeProps(rest, inputProperties), className = _a.className, nativeProps = __rest(_a, [\"className\"]);\n var defaultOnRenderLabel = function () {\n return (React.createElement(\"span\", { id: props.labelId, className: \"ms-ChoiceFieldLabel\" }, props.text));\n };\n var defaultOnRenderField = function () {\n var _a = props.imageAlt, imageAlt = _a === void 0 ? '' : _a, selectedImageSrc = props.selectedImageSrc;\n var onRenderLabel = props.onRenderLabel\n ? composeRenderFunction(props.onRenderLabel, defaultOnRenderLabel)\n : defaultOnRenderLabel;\n var label = onRenderLabel(__assign(__assign({}, props), { key: props.itemKey }));\n return (React.createElement(\"label\", { htmlFor: id, className: classNames.field },\n imageSrc && (React.createElement(\"div\", { className: classNames.innerField },\n React.createElement(\"div\", { className: classNames.imageWrapper },\n React.createElement(Image, __assign({ src: imageSrc, alt: imageAlt }, imageSize))),\n React.createElement(\"div\", { className: classNames.selectedImageWrapper },\n React.createElement(Image, __assign({ src: selectedImageSrc, alt: imageAlt }, imageSize))))),\n iconProps && (React.createElement(\"div\", { className: classNames.innerField },\n React.createElement(\"div\", { className: classNames.iconWrapper },\n React.createElement(Icon, __assign({}, iconProps))))),\n imageSrc || iconProps ? React.createElement(\"div\", { className: classNames.labelWrapper }, label) : label));\n };\n var _b = props.onRenderField, onRenderField = _b === void 0 ? defaultOnRenderField : _b;\n var onChange = function (evt) {\n var _a;\n (_a = props.onChange) === null || _a === void 0 ? void 0 : _a.call(props, evt, __assign(__assign({}, props), { key: props.itemKey }));\n };\n var onBlur = function (evt) {\n var _a;\n (_a = props.onBlur) === null || _a === void 0 ? void 0 : _a.call(props, evt);\n };\n var onFocus = function (evt) {\n var _a;\n (_a = props.onFocus) === null || _a === void 0 ? void 0 : _a.call(props, evt, __assign(__assign({}, props), { key: props.itemKey }));\n };\n return (React.createElement(\"div\", { className: classNames.root },\n React.createElement(\"div\", { className: classNames.choiceFieldWrapper },\n React.createElement(\"input\", __assign({ \"aria-label\": ariaLabel, id: id, className: css(classNames.input, className), type: \"radio\", name: name, disabled: disabled, checked: checked, required: required }, nativeProps, { onChange: onChange, onFocus: onFocus, onBlur: onBlur })),\n onRenderField(__assign(__assign({}, props), { key: props.itemKey }), defaultOnRenderField))));\n};\nChoiceGroupOptionBase.displayName = 'ChoiceGroupOption';\n//# sourceMappingURL=ChoiceGroupOption.base.js.map","import { __assign } from \"tslib\";\nimport { HighContrastSelector, getGlobalClassNames, getHighContrastNoAdjustStyle } from '../../../Styling';\nimport { IsFocusVisibleClassName } from '../../../Utilities';\nvar GlobalClassNames = {\n root: 'ms-ChoiceField',\n choiceFieldWrapper: 'ms-ChoiceField-wrapper',\n input: 'ms-ChoiceField-input',\n field: 'ms-ChoiceField-field',\n innerField: 'ms-ChoiceField-innerField',\n imageWrapper: 'ms-ChoiceField-imageWrapper',\n iconWrapper: 'ms-ChoiceField-iconWrapper',\n labelWrapper: 'ms-ChoiceField-labelWrapper',\n checked: 'is-checked',\n};\nvar labelWrapperLineHeight = 15;\nvar labelWrapperHeight = labelWrapperLineHeight * 2 + 2; // adding 2px height to ensure text doesn't get cutoff\nvar iconSize = 32;\nvar choiceFieldSize = 20;\nvar choiceFieldTransitionDuration = '200ms';\nvar choiceFieldTransitionTiming = 'cubic-bezier(.4, 0, .23, 1)';\nvar radioButtonSpacing = 3;\nvar radioButtonInnerSize = 5;\nfunction getChoiceGroupFocusStyle(focusBorderColor, hasIconOrImage) {\n var _a, _b;\n return [\n 'is-inFocus',\n {\n selectors: (_a = {},\n _a[\".\".concat(IsFocusVisibleClassName, \" &, :host(.\").concat(IsFocusVisibleClassName, \") &\")] = {\n position: 'relative',\n outline: 'transparent',\n selectors: {\n '::-moz-focus-inner': {\n border: 0,\n },\n ':after': {\n content: '\"\"',\n top: -2,\n right: -2,\n bottom: -2,\n left: -2,\n pointerEvents: 'none',\n border: \"1px solid \".concat(focusBorderColor),\n position: 'absolute',\n selectors: (_b = {},\n _b[HighContrastSelector] = {\n borderColor: 'WindowText',\n borderWidth: hasIconOrImage ? 1 : 2,\n },\n _b),\n },\n },\n },\n _a),\n },\n ];\n}\nfunction getImageWrapperStyle(isSelectedImageWrapper, className, checked) {\n return [\n className,\n {\n paddingBottom: 2,\n transitionProperty: 'opacity',\n transitionDuration: choiceFieldTransitionDuration,\n transitionTimingFunction: 'ease',\n selectors: {\n '.ms-Image': {\n display: 'inline-block',\n borderStyle: 'none',\n },\n },\n },\n (checked ? !isSelectedImageWrapper : isSelectedImageWrapper) && [\n 'is-hidden',\n {\n position: 'absolute',\n left: 0,\n top: 0,\n width: '100%',\n height: '100%',\n overflow: 'hidden',\n opacity: 0,\n },\n ],\n ];\n}\nexport var getStyles = function (props) {\n var _a, _b, _c, _d, _e;\n var theme = props.theme, hasIcon = props.hasIcon, hasImage = props.hasImage, checked = props.checked, disabled = props.disabled, imageIsLarge = props.imageIsLarge, focused = props.focused, imageSize = props.imageSize;\n var palette = theme.palette, semanticColors = theme.semanticColors, fonts = theme.fonts;\n var classNames = getGlobalClassNames(GlobalClassNames, theme);\n // Tokens\n // TODO: after updating the semanticColors slots mapping this needs to be semanticColors.smallInputBorder\n var circleBorderColor = palette.neutralPrimary;\n var circleHoveredBorderColor = semanticColors.inputBorderHovered;\n var circleCheckedBorderColor = semanticColors.inputBackgroundChecked;\n // TODO: after updating the semanticColors slots mapping this needs to be semanticColors.inputBackgroundCheckedHovered\n var circleCheckedHoveredBorderColor = palette.themeDark;\n var circleDisabledBorderColor = semanticColors.disabledBodySubtext;\n var circleBackgroundColor = semanticColors.bodyBackground;\n var dotUncheckedHoveredColor = palette.neutralSecondary;\n var dotCheckedColor = semanticColors.inputBackgroundChecked;\n // TODO: after updating the semanticColors slots mapping this needs to be semanticColors.inputBackgroundCheckedHovered\n var dotCheckedHoveredColor = palette.themeDark;\n var dotDisabledColor = semanticColors.disabledBodySubtext;\n // TODO: after updating the semanticColors slots mapping this needs to be semanticColors.bodyTextChecked\n var labelHoverFocusColor = palette.neutralDark;\n var focusBorderColor = semanticColors.focusBorder;\n var iconOrImageChoiceBorderUncheckedHoveredColor = semanticColors.inputBorderHovered;\n // TODO: after updating the semanticColors slots mapping this needs to be semanticColors.inputBackgroundCheckedHovered\n var iconOrImageChoiceBorderCheckedColor = semanticColors.inputBackgroundChecked;\n var iconOrImageChoiceBorderCheckedHoveredColor = palette.themeDark;\n var iconOrImageChoiceBackgroundColor = palette.neutralLighter;\n var fieldHoverOrFocusProperties = {\n selectors: {\n '.ms-ChoiceFieldLabel': {\n color: labelHoverFocusColor,\n },\n ':before': {\n borderColor: checked ? circleCheckedHoveredBorderColor : circleHoveredBorderColor,\n },\n ':after': [\n !hasIcon &&\n !hasImage &&\n !checked && {\n content: '\"\"',\n transitionProperty: 'background-color',\n left: 5,\n top: 5,\n width: 10,\n height: 10,\n backgroundColor: dotUncheckedHoveredColor,\n },\n checked && {\n borderColor: dotCheckedHoveredColor,\n background: dotCheckedHoveredColor,\n },\n ],\n },\n };\n var enabledFieldWithImageHoverOrFocusProperties = {\n borderColor: checked ? iconOrImageChoiceBorderCheckedHoveredColor : iconOrImageChoiceBorderUncheckedHoveredColor,\n selectors: {\n ':before': {\n opacity: 1,\n borderColor: checked ? circleCheckedHoveredBorderColor : circleHoveredBorderColor,\n },\n },\n };\n var circleAreaProperties = [\n {\n content: '\"\"',\n display: 'inline-block',\n backgroundColor: circleBackgroundColor,\n borderWidth: 1,\n borderStyle: 'solid',\n borderColor: circleBorderColor,\n width: choiceFieldSize,\n height: choiceFieldSize,\n fontWeight: 'normal',\n position: 'absolute',\n top: 0,\n left: 0,\n boxSizing: 'border-box',\n transitionProperty: 'border-color',\n transitionDuration: choiceFieldTransitionDuration,\n transitionTimingFunction: choiceFieldTransitionTiming,\n borderRadius: '50%',\n },\n disabled && {\n borderColor: circleDisabledBorderColor,\n selectors: (_a = {},\n _a[HighContrastSelector] = __assign({ borderColor: 'GrayText', background: 'Window' }, getHighContrastNoAdjustStyle()),\n _a),\n },\n checked && {\n borderColor: disabled ? circleDisabledBorderColor : circleCheckedBorderColor,\n selectors: (_b = {},\n _b[HighContrastSelector] = {\n borderColor: 'Highlight',\n background: 'Window',\n forcedColorAdjust: 'none',\n },\n _b),\n },\n (hasIcon || hasImage) && {\n top: radioButtonSpacing,\n right: radioButtonSpacing,\n left: 'auto', // To reset the value of 'left' to its default value, so that 'right' works\n opacity: checked ? 1 : 0,\n },\n ];\n var dotAreaProperties = [\n {\n content: '\"\"',\n width: 0,\n height: 0,\n borderRadius: '50%',\n position: 'absolute',\n left: choiceFieldSize / 2,\n right: 0,\n transitionProperty: 'border-width',\n transitionDuration: choiceFieldTransitionDuration,\n transitionTimingFunction: choiceFieldTransitionTiming,\n boxSizing: 'border-box',\n },\n checked && {\n borderWidth: 5,\n borderStyle: 'solid',\n borderColor: disabled ? dotDisabledColor : dotCheckedColor,\n background: dotCheckedColor,\n left: 5,\n top: 5,\n width: 10,\n height: 10,\n selectors: (_c = {},\n _c[HighContrastSelector] = {\n borderColor: 'Highlight',\n forcedColorAdjust: 'none',\n },\n _c),\n },\n checked &&\n (hasIcon || hasImage) && {\n top: radioButtonSpacing + radioButtonInnerSize,\n right: radioButtonSpacing + radioButtonInnerSize,\n left: 'auto', // To reset the value of 'left' to its default value, so that 'right' works\n },\n ];\n return {\n root: [\n classNames.root,\n theme.fonts.medium,\n {\n display: 'flex',\n alignItems: 'center',\n boxSizing: 'border-box',\n color: semanticColors.bodyText,\n minHeight: 26,\n border: 'none',\n position: 'relative',\n marginTop: 8,\n selectors: {\n '.ms-ChoiceFieldLabel': {\n display: 'inline-block',\n },\n },\n },\n !hasIcon &&\n !hasImage && {\n selectors: {\n '.ms-ChoiceFieldLabel': {\n paddingLeft: '26px',\n },\n },\n },\n hasImage && 'ms-ChoiceField--image',\n hasIcon && 'ms-ChoiceField--icon',\n (hasIcon || hasImage) && {\n display: 'inline-flex',\n fontSize: 0,\n margin: '0 4px 4px 0',\n paddingLeft: 0,\n backgroundColor: iconOrImageChoiceBackgroundColor,\n height: '100%',\n },\n ],\n choiceFieldWrapper: [\n classNames.choiceFieldWrapper,\n focused && getChoiceGroupFocusStyle(focusBorderColor, hasIcon || hasImage),\n ],\n // The hidden input\n input: [\n classNames.input,\n {\n position: 'absolute',\n opacity: 0,\n top: 0,\n right: 0,\n width: '100%',\n height: '100%',\n margin: 0,\n },\n disabled && 'is-disabled',\n ],\n field: [\n classNames.field,\n checked && classNames.checked,\n {\n display: 'inline-block',\n cursor: 'pointer',\n marginTop: 0,\n position: 'relative',\n verticalAlign: 'top',\n userSelect: 'none',\n minHeight: 20,\n selectors: {\n ':hover': !disabled && fieldHoverOrFocusProperties,\n ':focus': !disabled && fieldHoverOrFocusProperties,\n // The circle\n ':before': circleAreaProperties,\n // The dot\n ':after': dotAreaProperties,\n },\n },\n hasIcon && 'ms-ChoiceField--icon',\n hasImage && 'ms-ChoiceField-field--image',\n (hasIcon || hasImage) && {\n boxSizing: 'content-box',\n cursor: 'pointer',\n paddingTop: 22,\n margin: 0,\n textAlign: 'center',\n transitionProperty: 'all',\n transitionDuration: choiceFieldTransitionDuration,\n transitionTimingFunction: 'ease',\n border: '1px solid transparent',\n justifyContent: 'center',\n alignItems: 'center',\n display: 'flex',\n flexDirection: 'column',\n },\n checked && {\n borderColor: iconOrImageChoiceBorderCheckedColor,\n },\n (hasIcon || hasImage) &&\n !disabled && {\n selectors: {\n ':hover': enabledFieldWithImageHoverOrFocusProperties,\n ':focus': enabledFieldWithImageHoverOrFocusProperties,\n },\n },\n disabled && {\n cursor: 'default',\n selectors: {\n '.ms-ChoiceFieldLabel': {\n color: semanticColors.disabledBodyText,\n selectors: (_d = {},\n _d[HighContrastSelector] = __assign({ color: 'GrayText' }, getHighContrastNoAdjustStyle()),\n _d),\n },\n },\n },\n checked &&\n disabled && {\n borderColor: iconOrImageChoiceBackgroundColor,\n },\n ],\n innerField: [\n classNames.innerField,\n hasImage && {\n // using non-null assertion because we have a default in `ChoiceGroupOptionBase` class.\n height: imageSize.height,\n width: imageSize.width,\n },\n (hasIcon || hasImage) && {\n position: 'relative',\n display: 'inline-block',\n paddingLeft: 30,\n paddingRight: 30,\n },\n (hasIcon || hasImage) &&\n imageIsLarge && {\n paddingLeft: 24,\n paddingRight: 24,\n },\n (hasIcon || hasImage) &&\n disabled && {\n opacity: 0.25,\n selectors: (_e = {},\n _e[HighContrastSelector] = {\n color: 'GrayText',\n opacity: 1,\n },\n _e),\n },\n ],\n imageWrapper: getImageWrapperStyle(false, classNames.imageWrapper, checked),\n selectedImageWrapper: getImageWrapperStyle(true, classNames.imageWrapper, checked),\n iconWrapper: [\n classNames.iconWrapper,\n {\n fontSize: iconSize,\n lineHeight: iconSize,\n height: iconSize,\n },\n ],\n labelWrapper: [\n classNames.labelWrapper,\n fonts.medium,\n (hasIcon || hasImage) && {\n display: 'block',\n position: 'relative',\n margin: '4px 8px 2px 8px',\n height: labelWrapperHeight,\n lineHeight: labelWrapperLineHeight,\n // using non-null assertion because we have a default in `ChoiceGroupOptionBase` class.\n maxWidth: imageSize.width * 2,\n overflow: 'hidden',\n whiteSpace: 'pre-wrap',\n },\n ],\n };\n};\n//# sourceMappingURL=ChoiceGroupOption.styles.js.map","import { styled } from '../../../Utilities';\nimport { ChoiceGroupOptionBase } from './ChoiceGroupOption.base';\nimport { getStyles } from './ChoiceGroupOption.styles';\nexport var ChoiceGroupOption = styled(ChoiceGroupOptionBase, getStyles, undefined, { scope: 'ChoiceGroupOption' });\n//# sourceMappingURL=ChoiceGroupOption.js.map","import { __extends } from \"tslib\";\nimport * as React from 'react';\nimport { initializeComponentRef, shallowCompare } from '../../../Utilities';\nvar ContextualMenuItemWrapper = /** @class */ (function (_super) {\n __extends(ContextualMenuItemWrapper, _super);\n function ContextualMenuItemWrapper(props) {\n var _this = _super.call(this, props) || this;\n _this._onItemMouseEnter = function (ev) {\n var _a = _this.props, item = _a.item, onItemMouseEnter = _a.onItemMouseEnter;\n if (onItemMouseEnter) {\n onItemMouseEnter(item, ev, ev.currentTarget);\n }\n };\n _this._onItemClick = function (ev) {\n var _a = _this.props, item = _a.item, onItemClickBase = _a.onItemClickBase;\n if (onItemClickBase) {\n onItemClickBase(item, ev, ev.currentTarget);\n }\n };\n _this._onItemMouseLeave = function (ev) {\n var _a = _this.props, item = _a.item, onItemMouseLeave = _a.onItemMouseLeave;\n if (onItemMouseLeave) {\n onItemMouseLeave(item, ev);\n }\n };\n _this._onItemKeyDown = function (ev) {\n var _a = _this.props, item = _a.item, onItemKeyDown = _a.onItemKeyDown;\n if (onItemKeyDown) {\n onItemKeyDown(item, ev);\n }\n };\n _this._onItemMouseMove = function (ev) {\n var _a = _this.props, item = _a.item, onItemMouseMove = _a.onItemMouseMove;\n if (onItemMouseMove) {\n onItemMouseMove(item, ev, ev.currentTarget);\n }\n };\n _this._getSubmenuTarget = function () {\n return undefined;\n };\n initializeComponentRef(_this);\n return _this;\n }\n ContextualMenuItemWrapper.prototype.shouldComponentUpdate = function (newProps) {\n return !shallowCompare(newProps, this.props);\n };\n return ContextualMenuItemWrapper;\n}(React.Component));\nexport { ContextualMenuItemWrapper };\n//# sourceMappingURL=ContextualMenuItemWrapper.js.map","import { __assign, __extends } from \"tslib\";\nimport * as React from 'react';\nimport { anchorProperties, getNativeProps, memoizeFunction, getId, mergeAriaAttributeValues, composeComponentAs, } from '../../../Utilities';\nimport { ContextualMenuItemWrapper } from './ContextualMenuItemWrapper';\nimport { KeytipData } from '../../../KeytipData';\nimport { isItemDisabled, hasSubmenu } from '../../../utilities/contextualMenu/index';\nimport { ContextualMenuItem } from '../ContextualMenuItem';\nvar ContextualMenuAnchor = /** @class */ (function (_super) {\n __extends(ContextualMenuAnchor, _super);\n function ContextualMenuAnchor() {\n var _this = _super !== null && _super.apply(this, arguments) || this;\n _this._anchor = React.createRef();\n _this._getMemoizedMenuButtonKeytipProps = memoizeFunction(function (keytipProps) {\n return __assign(__assign({}, keytipProps), { hasMenu: true });\n });\n _this._getSubmenuTarget = function () {\n return _this._anchor.current ? _this._anchor.current : undefined;\n };\n _this._onItemClick = function (ev) {\n var _a = _this.props, item = _a.item, onItemClick = _a.onItemClick;\n if (onItemClick) {\n onItemClick(item, ev);\n }\n };\n _this._renderAriaDescription = function (ariaDescription, className) {\n // If ariaDescription is given, descriptionId will be assigned to ariaDescriptionSpan\n return ariaDescription ? (React.createElement(\"span\", { id: _this._ariaDescriptionId, className: className }, ariaDescription)) : null;\n };\n return _this;\n }\n ContextualMenuAnchor.prototype.render = function () {\n var _this = this;\n var _a = this.props, item = _a.item, classNames = _a.classNames, index = _a.index, focusableElementIndex = _a.focusableElementIndex, totalItemCount = _a.totalItemCount, hasCheckmarks = _a.hasCheckmarks, hasIcons = _a.hasIcons, expandedMenuItemKey = _a.expandedMenuItemKey, onItemClick = _a.onItemClick, openSubMenu = _a.openSubMenu, dismissSubMenu = _a.dismissSubMenu, dismissMenu = _a.dismissMenu;\n var ChildrenRenderer = ContextualMenuItem;\n if (this.props.item.contextualMenuItemAs) {\n ChildrenRenderer = composeComponentAs(this.props.item.contextualMenuItemAs, ChildrenRenderer);\n }\n if (this.props.contextualMenuItemAs) {\n ChildrenRenderer = composeComponentAs(this.props.contextualMenuItemAs, ChildrenRenderer);\n }\n var anchorRel = item.rel;\n if (item.target && item.target.toLowerCase() === '_blank') {\n anchorRel = anchorRel ? anchorRel : 'nofollow noopener noreferrer'; // Safe default to prevent tabjacking\n }\n var itemHasSubmenu = hasSubmenu(item);\n var nativeProps = getNativeProps(item, anchorProperties);\n var disabled = isItemDisabled(item);\n var itemProps = item.itemProps, ariaDescription = item.ariaDescription;\n var keytipProps = item.keytipProps;\n if (keytipProps && itemHasSubmenu) {\n keytipProps = this._getMemoizedMenuButtonKeytipProps(keytipProps);\n }\n // Check for ariaDescription to set the _ariaDescriptionId and render a hidden span with\n // the description in it to be added to ariaDescribedBy\n if (ariaDescription) {\n this._ariaDescriptionId = getId();\n }\n var ariaDescribedByIds = mergeAriaAttributeValues(item.ariaDescribedBy, ariaDescription ? this._ariaDescriptionId : undefined, nativeProps['aria-describedby']);\n var additionalItemProperties = {\n 'aria-describedby': ariaDescribedByIds,\n };\n return (React.createElement(\"div\", null,\n React.createElement(KeytipData, { keytipProps: item.keytipProps, ariaDescribedBy: ariaDescribedByIds, disabled: disabled }, function (keytipAttributes) { return (React.createElement(\"a\", __assign({}, additionalItemProperties, nativeProps, keytipAttributes, { ref: _this._anchor, href: item.href, target: item.target, rel: anchorRel, className: classNames.root, role: \"menuitem\", \"aria-haspopup\": itemHasSubmenu || undefined, \"aria-expanded\": itemHasSubmenu ? item.key === expandedMenuItemKey : undefined, \"aria-posinset\": focusableElementIndex + 1, \"aria-setsize\": totalItemCount, \"aria-disabled\": isItemDisabled(item), \n // eslint-disable-next-line @typescript-eslint/no-deprecated\n style: item.style, onClick: _this._onItemClick, onMouseEnter: _this._onItemMouseEnter, onMouseLeave: _this._onItemMouseLeave, onMouseMove: _this._onItemMouseMove, onKeyDown: itemHasSubmenu ? _this._onItemKeyDown : undefined }),\n React.createElement(ChildrenRenderer, __assign({ componentRef: item.componentRef, item: item, classNames: classNames, index: index, onCheckmarkClick: hasCheckmarks && onItemClick ? onItemClick : undefined, hasIcons: hasIcons, openSubMenu: openSubMenu, dismissSubMenu: dismissSubMenu, dismissMenu: dismissMenu, getSubmenuTarget: _this._getSubmenuTarget }, itemProps)),\n _this._renderAriaDescription(ariaDescription, classNames.screenReaderText))); })));\n };\n return ContextualMenuAnchor;\n}(ContextualMenuItemWrapper));\nexport { ContextualMenuAnchor };\n//# sourceMappingURL=ContextualMenuAnchor.js.map","import { __assign, __extends } from \"tslib\";\nimport * as React from 'react';\nimport { buttonProperties, getNativeProps, KeyCodes, mergeAriaAttributeValues, memoizeFunction, Async, EventGroup, getId, composeComponentAs, } from '../../../Utilities';\nimport { ContextualMenuItem } from '../ContextualMenuItem';\nimport { getSplitButtonVerticalDividerClassNames } from '../ContextualMenu.classNames';\nimport { KeytipData } from '../../../KeytipData';\nimport { getIsChecked, getMenuItemAriaRole, hasSubmenu, isItemDisabled } from '../../../utilities/contextualMenu/index';\nimport { VerticalDivider } from '../../../Divider';\nimport { ContextualMenuItemWrapper } from './ContextualMenuItemWrapper';\nvar TouchIdleDelay = 500; /* ms */\nvar ContextualMenuSplitButton = /** @class */ (function (_super) {\n __extends(ContextualMenuSplitButton, _super);\n function ContextualMenuSplitButton(props) {\n var _this = _super.call(this, props) || this;\n _this._getMemoizedMenuButtonKeytipProps = memoizeFunction(function (keytipProps) {\n return __assign(__assign({}, keytipProps), { hasMenu: true });\n });\n _this._onItemKeyDown = function (ev) {\n var _a = _this.props, item = _a.item, onItemKeyDown = _a.onItemKeyDown;\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n if (ev.which === KeyCodes.enter) {\n _this._executeItemClick(ev);\n ev.preventDefault();\n ev.stopPropagation();\n }\n else if (onItemKeyDown) {\n onItemKeyDown(item, ev);\n }\n };\n _this._getSubmenuTarget = function () {\n return _this._splitButton;\n };\n _this._renderAriaDescription = function (ariaDescription, className) {\n // If ariaDescription is given, descriptionId will be assigned to ariaDescriptionSpan\n return ariaDescription ? (React.createElement(\"span\", { id: _this._ariaDescriptionId, className: className }, ariaDescription)) : null;\n };\n _this._onItemMouseEnterPrimary = function (ev) {\n var _a = _this.props, item = _a.item, onItemMouseEnter = _a.onItemMouseEnter;\n if (onItemMouseEnter) {\n onItemMouseEnter(__assign(__assign({}, item), { subMenuProps: undefined, items: undefined }), ev, _this._splitButton);\n }\n };\n _this._onItemMouseEnterIcon = function (ev) {\n var _a = _this.props, item = _a.item, onItemMouseEnter = _a.onItemMouseEnter;\n if (onItemMouseEnter) {\n onItemMouseEnter(item, ev, _this._splitButton);\n }\n };\n _this._onItemMouseMovePrimary = function (ev) {\n var _a = _this.props, item = _a.item, onItemMouseMove = _a.onItemMouseMove;\n if (onItemMouseMove) {\n onItemMouseMove(__assign(__assign({}, item), { subMenuProps: undefined, items: undefined }), ev, _this._splitButton);\n }\n };\n _this._onItemMouseMoveIcon = function (ev) {\n var _a = _this.props, item = _a.item, onItemMouseMove = _a.onItemMouseMove;\n if (onItemMouseMove) {\n onItemMouseMove(item, ev, _this._splitButton);\n }\n };\n _this._onIconItemClick = function (ev) {\n var _a = _this.props, item = _a.item, onItemClickBase = _a.onItemClickBase;\n if (onItemClickBase) {\n onItemClickBase(item, ev, (_this._splitButton ? _this._splitButton : ev.currentTarget));\n }\n };\n _this._executeItemClick = function (ev) {\n var _a = _this.props, item = _a.item, executeItemClick = _a.executeItemClick, onItemClick = _a.onItemClick;\n if (item.disabled || item.isDisabled) {\n return;\n }\n if (_this._processingTouch && !item.canCheck && onItemClick) {\n return onItemClick(item, ev);\n }\n if (executeItemClick) {\n executeItemClick(item, ev);\n }\n };\n _this._onTouchStart = function (ev) {\n if (_this._splitButton && !('onpointerdown' in _this._splitButton)) {\n _this._handleTouchAndPointerEvent(ev);\n }\n };\n _this._onPointerDown = function (ev) {\n if (ev.pointerType === 'touch') {\n _this._handleTouchAndPointerEvent(ev);\n ev.preventDefault();\n ev.stopImmediatePropagation();\n }\n };\n _this._async = new Async(_this);\n _this._events = new EventGroup(_this);\n _this._dismissLabelId = getId();\n return _this;\n }\n ContextualMenuSplitButton.prototype.componentDidMount = function () {\n if (this._splitButton && 'onpointerdown' in this._splitButton) {\n this._events.on(this._splitButton, 'pointerdown', this._onPointerDown, true);\n }\n };\n ContextualMenuSplitButton.prototype.componentWillUnmount = function () {\n this._async.dispose();\n this._events.dispose();\n };\n ContextualMenuSplitButton.prototype.render = function () {\n var _this = this;\n var _a;\n var _b = this.props, item = _b.item, classNames = _b.classNames, index = _b.index, focusableElementIndex = _b.focusableElementIndex, totalItemCount = _b.totalItemCount, hasCheckmarks = _b.hasCheckmarks, hasIcons = _b.hasIcons, onItemMouseLeave = _b.onItemMouseLeave, expandedMenuItemKey = _b.expandedMenuItemKey;\n var itemHasSubmenu = hasSubmenu(item);\n var keytipProps = item.keytipProps;\n if (keytipProps) {\n keytipProps = this._getMemoizedMenuButtonKeytipProps(keytipProps);\n }\n // Check for ariaDescription to set the _ariaDescriptionId and render a hidden span with\n // the description in it to be added to ariaDescribedBy\n var ariaDescription = item.ariaDescription;\n if (ariaDescription) {\n this._ariaDescriptionId = getId();\n }\n var ariaChecked = (_a = getIsChecked(item)) !== null && _a !== void 0 ? _a : undefined;\n return (React.createElement(KeytipData, { keytipProps: keytipProps, disabled: isItemDisabled(item) }, function (keytipAttributes) { return (React.createElement(\"div\", { \"data-ktp-target\": keytipAttributes['data-ktp-target'], ref: function (splitButton) { return (_this._splitButton = splitButton); }, role: getMenuItemAriaRole(item), \"aria-label\": item.ariaLabel, className: classNames.splitContainer, \"aria-disabled\": isItemDisabled(item), \"aria-expanded\": itemHasSubmenu ? item.key === expandedMenuItemKey : undefined, \"aria-haspopup\": true, \"aria-describedby\": mergeAriaAttributeValues(item.ariaDescribedBy, ariaDescription ? _this._ariaDescriptionId : undefined, keytipAttributes['aria-describedby']), \"aria-checked\": ariaChecked, \"aria-posinset\": focusableElementIndex + 1, \"aria-setsize\": totalItemCount, onMouseEnter: _this._onItemMouseEnterPrimary, onMouseLeave: onItemMouseLeave ? onItemMouseLeave.bind(_this, __assign(__assign({}, item), { subMenuProps: null, items: null })) : undefined, onMouseMove: _this._onItemMouseMovePrimary, onKeyDown: _this._onItemKeyDown, onClick: _this._executeItemClick, onTouchStart: _this._onTouchStart, tabIndex: 0, \"data-is-focusable\": true, \"aria-roledescription\": item['aria-roledescription'] },\n _this._renderSplitPrimaryButton(item, classNames, index, hasCheckmarks, hasIcons),\n _this._renderSplitDivider(item),\n _this._renderSplitIconButton(item, classNames, index, keytipAttributes),\n _this._renderAriaDescription(ariaDescription, classNames.screenReaderText))); }));\n };\n ContextualMenuSplitButton.prototype._renderSplitPrimaryButton = function (item, \n // eslint-disable-next-line @typescript-eslint/no-deprecated\n classNames, index, hasCheckmarks, hasIcons) {\n var _a = this.props, _b = _a.contextualMenuItemAs, ChildrenRenderer = _b === void 0 ? ContextualMenuItem : _b, onItemClick = _a.onItemClick;\n var itemProps = {\n key: item.key,\n disabled: isItemDisabled(item) || item.primaryDisabled,\n /* eslint-disable @typescript-eslint/no-deprecated */\n name: item.name,\n text: item.text || item.name,\n secondaryText: item.secondaryText,\n /* eslint-enable @typescript-eslint/no-deprecated */\n className: classNames.splitPrimary,\n canCheck: item.canCheck,\n isChecked: item.isChecked,\n checked: item.checked,\n iconProps: item.iconProps,\n id: this._dismissLabelId,\n onClick: item.onClick,\n onRenderIcon: item.onRenderIcon,\n data: item.data,\n 'data-is-focusable': false,\n };\n var itemComponentProps = item.itemProps;\n return (React.createElement(\"button\", __assign({}, getNativeProps(itemProps, buttonProperties)),\n React.createElement(ChildrenRenderer, __assign({ \"data-is-focusable\": false, item: itemProps, classNames: classNames, index: index, onCheckmarkClick: hasCheckmarks && onItemClick ? onItemClick : undefined, hasIcons: hasIcons }, itemComponentProps))));\n };\n ContextualMenuSplitButton.prototype._renderSplitDivider = function (item) {\n var getDividerClassNames = item.getSplitButtonVerticalDividerClassNames || getSplitButtonVerticalDividerClassNames;\n return React.createElement(VerticalDivider, { getClassNames: getDividerClassNames });\n };\n ContextualMenuSplitButton.prototype._renderSplitIconButton = function (item, classNames, // eslint-disable-line @typescript-eslint/no-deprecated\n index, keytipAttributes) {\n var _a = this.props, onItemMouseLeave = _a.onItemMouseLeave, onItemMouseDown = _a.onItemMouseDown, openSubMenu = _a.openSubMenu, dismissSubMenu = _a.dismissSubMenu, dismissMenu = _a.dismissMenu;\n var ChildrenRenderer = ContextualMenuItem;\n if (this.props.item.contextualMenuItemAs) {\n ChildrenRenderer = composeComponentAs(this.props.item.contextualMenuItemAs, ChildrenRenderer);\n }\n if (this.props.contextualMenuItemAs) {\n ChildrenRenderer = composeComponentAs(this.props.contextualMenuItemAs, ChildrenRenderer);\n }\n var itemProps = {\n onClick: this._onIconItemClick,\n disabled: isItemDisabled(item),\n className: classNames.splitMenu,\n subMenuProps: item.subMenuProps,\n submenuIconProps: item.submenuIconProps,\n split: true,\n key: item.key,\n 'aria-labelledby': this._dismissLabelId,\n };\n var buttonProps = __assign(__assign({}, getNativeProps(itemProps, buttonProperties)), {\n onMouseEnter: this._onItemMouseEnterIcon,\n onMouseLeave: onItemMouseLeave ? onItemMouseLeave.bind(this, item) : undefined,\n onMouseDown: function (ev) {\n return onItemMouseDown ? onItemMouseDown(item, ev) : undefined;\n },\n onMouseMove: this._onItemMouseMoveIcon,\n 'data-is-focusable': false,\n 'data-ktp-execute-target': keytipAttributes['data-ktp-execute-target'],\n 'aria-haspopup': true,\n });\n var itemComponentProps = item.itemProps;\n return (React.createElement(\"button\", __assign({}, buttonProps),\n React.createElement(ChildrenRenderer, __assign({ componentRef: item.componentRef, item: itemProps, classNames: classNames, index: index, hasIcons: false, openSubMenu: openSubMenu, dismissSubMenu: dismissSubMenu, dismissMenu: dismissMenu, getSubmenuTarget: this._getSubmenuTarget }, itemComponentProps))));\n };\n ContextualMenuSplitButton.prototype._handleTouchAndPointerEvent = function (ev) {\n var _this = this;\n var onTap = this.props.onTap;\n if (onTap) {\n onTap(ev);\n }\n // If we already have an existing timeout from a previous touch/pointer event\n // cancel that timeout so we can set a new one.\n if (this._lastTouchTimeoutId) {\n this._async.clearTimeout(this._lastTouchTimeoutId);\n this._lastTouchTimeoutId = undefined;\n }\n this._processingTouch = true;\n this._lastTouchTimeoutId = this._async.setTimeout(function () {\n _this._processingTouch = false;\n _this._lastTouchTimeoutId = undefined;\n }, TouchIdleDelay);\n };\n return ContextualMenuSplitButton;\n}(ContextualMenuItemWrapper));\nexport { ContextualMenuSplitButton };\n//# sourceMappingURL=ContextualMenuSplitButton.js.map","import { __assign, __extends } from \"tslib\";\nimport * as React from 'react';\nimport { buttonProperties, getNativeProps, memoizeFunction, getId, mergeAriaAttributeValues, composeComponentAs, } from '../../../Utilities';\nimport { ContextualMenuItemWrapper } from './ContextualMenuItemWrapper';\nimport { KeytipData } from '../../../KeytipData';\nimport { getIsChecked, isItemDisabled, hasSubmenu, getMenuItemAriaRole } from '../../../utilities/contextualMenu/index';\nimport { ContextualMenuItem } from '../ContextualMenuItem';\nvar ContextualMenuButton = /** @class */ (function (_super) {\n __extends(ContextualMenuButton, _super);\n function ContextualMenuButton() {\n var _this = _super !== null && _super.apply(this, arguments) || this;\n _this._btn = React.createRef();\n _this._getMemoizedMenuButtonKeytipProps = memoizeFunction(function (keytipProps) {\n return __assign(__assign({}, keytipProps), { hasMenu: true });\n });\n _this._renderAriaDescription = function (ariaDescription, className) {\n // If ariaDescription is given, descriptionId will be assigned to ariaDescriptionSpan\n return ariaDescription ? (React.createElement(\"span\", { id: _this._ariaDescriptionId, className: className }, ariaDescription)) : null;\n };\n _this._getSubmenuTarget = function () {\n return _this._btn.current ? _this._btn.current : undefined;\n };\n return _this;\n }\n ContextualMenuButton.prototype.render = function () {\n var _this = this;\n var _a = this.props, item = _a.item, classNames = _a.classNames, index = _a.index, focusableElementIndex = _a.focusableElementIndex, totalItemCount = _a.totalItemCount, hasCheckmarks = _a.hasCheckmarks, hasIcons = _a.hasIcons, contextualMenuItemAs = _a.contextualMenuItemAs, expandedMenuItemKey = _a.expandedMenuItemKey, onItemMouseDown = _a.onItemMouseDown, onItemClick = _a.onItemClick, openSubMenu = _a.openSubMenu, dismissSubMenu = _a.dismissSubMenu, dismissMenu = _a.dismissMenu;\n var ChildrenRenderer = ContextualMenuItem;\n if (item.contextualMenuItemAs) {\n ChildrenRenderer = composeComponentAs(item.contextualMenuItemAs, ChildrenRenderer);\n }\n if (contextualMenuItemAs) {\n ChildrenRenderer = composeComponentAs(contextualMenuItemAs, ChildrenRenderer);\n }\n var isChecked = getIsChecked(item);\n var canCheck = isChecked !== null;\n var defaultRole = getMenuItemAriaRole(item);\n var itemHasSubmenu = hasSubmenu(item);\n var itemProps = item.itemProps, ariaLabel = item.ariaLabel, ariaDescription = item.ariaDescription;\n var buttonNativeProperties = getNativeProps(item, buttonProperties);\n // Do not add the disabled attribute to the button so that it is focusable\n delete buttonNativeProperties.disabled;\n var itemRole = item.role || defaultRole;\n // Check for ariaDescription to set the _ariaDescriptionId and render a hidden span with\n // the description in it to be added to ariaDescribedBy\n if (ariaDescription) {\n this._ariaDescriptionId = getId();\n }\n var ariaDescribedByIds = mergeAriaAttributeValues(item.ariaDescribedBy, ariaDescription ? this._ariaDescriptionId : undefined, buttonNativeProperties['aria-describedby']);\n var itemButtonProperties = {\n className: classNames.root,\n onClick: this._onItemClick,\n onKeyDown: itemHasSubmenu ? this._onItemKeyDown : undefined,\n onMouseEnter: this._onItemMouseEnter,\n onMouseLeave: this._onItemMouseLeave,\n onMouseDown: function (ev) {\n return onItemMouseDown ? onItemMouseDown(item, ev) : undefined;\n },\n onMouseMove: this._onItemMouseMove,\n href: item.href,\n title: item.title,\n 'aria-label': ariaLabel,\n 'aria-describedby': ariaDescribedByIds,\n 'aria-haspopup': itemHasSubmenu || undefined,\n 'aria-expanded': itemHasSubmenu ? item.key === expandedMenuItemKey : undefined,\n 'aria-posinset': focusableElementIndex + 1,\n 'aria-setsize': totalItemCount,\n 'aria-disabled': isItemDisabled(item),\n 'aria-checked': (itemRole === 'menuitemcheckbox' || itemRole === 'menuitemradio') && canCheck ? !!isChecked : undefined,\n 'aria-selected': itemRole === 'menuitem' && canCheck ? !!isChecked : undefined,\n role: itemRole,\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n style: item.style,\n };\n var keytipProps = item.keytipProps;\n if (keytipProps && itemHasSubmenu) {\n keytipProps = this._getMemoizedMenuButtonKeytipProps(keytipProps);\n }\n return (React.createElement(KeytipData, { keytipProps: keytipProps, ariaDescribedBy: ariaDescribedByIds, disabled: isItemDisabled(item) }, function (keytipAttributes) { return (React.createElement(\"button\", __assign({ ref: _this._btn }, buttonNativeProperties, itemButtonProperties, keytipAttributes),\n React.createElement(ChildrenRenderer, __assign({ componentRef: item.componentRef, item: item, classNames: classNames, index: index, onCheckmarkClick: hasCheckmarks && onItemClick ? onItemClick : undefined, hasIcons: hasIcons, openSubMenu: openSubMenu, dismissSubMenu: dismissSubMenu, dismissMenu: dismissMenu, getSubmenuTarget: _this._getSubmenuTarget }, itemProps)),\n _this._renderAriaDescription(ariaDescription, classNames.screenReaderText))); }));\n };\n return ContextualMenuButton;\n}(ContextualMenuItemWrapper));\nexport { ContextualMenuButton };\n//# sourceMappingURL=ContextualMenuButton.js.map","import * as React from 'react';\nexport var MenuContext = React.createContext({});\nexport var useMenuContext = function () {\n return React.useContext(MenuContext);\n};\n//# sourceMappingURL=MenuContext.js.map","import { __assign, __rest, __spreadArray } from \"tslib\";\nimport * as React from 'react';\nimport { ContextualMenuItemType } from './ContextualMenu.types';\nimport { DirectionalHint } from '../../common/DirectionalHint';\nimport { FocusZone, FocusZoneDirection, FocusZoneTabbableElements } from '../../FocusZone';\nimport { divProperties, getNativeProps, shallowCompare, assign, classNamesFunction, css, getFirstFocusable, getLastFocusable, getRTL, KeyCodes, shouldWrapFocus, isIOS, isMac, memoizeFunction, getPropsWithDefaults, getDocument, FocusRects, composeComponentAs, } from '../../Utilities';\nimport { hasSubmenu, getIsChecked, isItemDisabled } from '../../utilities/contextualMenu/index';\nimport { Callout } from '../../Callout';\nimport { ContextualMenuItem } from './ContextualMenuItem';\nimport { ContextualMenuSplitButton, ContextualMenuButton, ContextualMenuAnchor, } from './ContextualMenuItemWrapper/index';\nimport { concatStyleSetsWithProps } from '../../Styling';\nimport { getItemStyles } from './ContextualMenu.classNames';\nimport { useTarget, usePrevious, useAsync, useWarnings, useId, useIsomorphicLayoutEffect, } from '@fluentui/react-hooks';\nimport { useResponsiveMode, ResponsiveMode } from '../../ResponsiveMode';\nimport { MenuContext } from '../../utilities/MenuContext/index';\nvar getClassNames = classNamesFunction();\nvar getContextualMenuItemClassNames = classNamesFunction();\n// The default ContextualMenu properties have no items and beak, the default submenu direction is right and top.\nvar DEFAULT_PROPS = {\n items: [],\n shouldFocusOnMount: true,\n gapSpace: 0,\n directionalHint: DirectionalHint.bottomAutoEdge,\n beakWidth: 16,\n};\n/* return number of menu items, excluding headers and dividers */\nfunction getItemCount(items) {\n var totalItemCount = 0;\n for (var _i = 0, items_1 = items; _i < items_1.length; _i++) {\n var item = items_1[_i];\n if (item.itemType !== ContextualMenuItemType.Divider && item.itemType !== ContextualMenuItemType.Header) {\n var itemCount = item.customOnRenderListLength ? item.customOnRenderListLength : 1;\n totalItemCount += itemCount;\n }\n }\n return totalItemCount;\n}\nexport function getSubmenuItems(item, options) {\n var target = options === null || options === void 0 ? void 0 : options.target;\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n var items = item.subMenuProps ? item.subMenuProps.items : item.items;\n if (items) {\n var overrideItems = [];\n for (var _i = 0, items_2 = items; _i < items_2.length; _i++) {\n var subItem = items_2[_i];\n if (subItem.preferMenuTargetAsEventTarget) {\n // For sub-items which need an overridden target, intercept `onClick`\n var onClick = subItem.onClick, contextItem = __rest(subItem, [\"onClick\"]);\n overrideItems.push(__assign(__assign({}, contextItem), { onClick: getOnClickWithOverrideTarget(onClick, target) }));\n }\n else {\n overrideItems.push(subItem);\n }\n }\n return overrideItems;\n }\n}\n/**\n * Returns true if a list of menu items can contain a checkbox\n */\nexport function canAnyMenuItemsCheck(items) {\n return items.some(function (item) {\n if (item.canCheck) {\n return true;\n }\n // If the item is a section, check if any of the items in the section can check.\n if (item.sectionProps && item.sectionProps.items.some(function (submenuItem) { return submenuItem.canCheck === true; })) {\n return true;\n }\n return false;\n });\n}\nvar NavigationIdleDelay = 250; /* ms */\nvar COMPONENT_NAME = 'ContextualMenu';\nvar _getMenuItemStylesFunction = memoizeFunction(function () {\n var styles = [];\n for (var _i = 0; _i < arguments.length; _i++) {\n styles[_i] = arguments[_i];\n }\n return function (styleProps) {\n return concatStyleSetsWithProps.apply(void 0, __spreadArray([styleProps, getItemStyles], styles, false));\n };\n});\n//#region Custom hooks\nfunction useVisibility(props, targetWindow) {\n var _a = props.hidden, hidden = _a === void 0 ? false : _a, onMenuDismissed = props.onMenuDismissed, onMenuOpened = props.onMenuOpened;\n var previousHidden = usePrevious(hidden);\n var onMenuOpenedRef = React.useRef(onMenuOpened);\n var onMenuClosedRef = React.useRef(onMenuDismissed);\n var propsRef = React.useRef(props);\n onMenuOpenedRef.current = onMenuOpened;\n onMenuClosedRef.current = onMenuDismissed;\n propsRef.current = props;\n React.useEffect(function () {\n var _a, _b;\n // Don't issue dismissed callbacks on initial mount\n if (hidden && previousHidden === false) {\n (_a = onMenuClosedRef.current) === null || _a === void 0 ? void 0 : _a.call(onMenuClosedRef, propsRef.current);\n }\n else if (!hidden && previousHidden !== false) {\n (_b = onMenuOpenedRef.current) === null || _b === void 0 ? void 0 : _b.call(onMenuOpenedRef, propsRef.current);\n }\n }, [hidden, previousHidden]);\n // Issue onDismissedCallback on unmount\n React.useEffect(function () { return function () { var _a; return (_a = onMenuClosedRef.current) === null || _a === void 0 ? void 0 : _a.call(onMenuClosedRef, propsRef.current); }; }, []);\n}\nfunction useSubMenuState(_a, dismiss) {\n var hidden = _a.hidden, items = _a.items, theme = _a.theme, className = _a.className, id = _a.id, menuTarget = _a.target;\n var _b = React.useState(), expandedMenuItemKey = _b[0], setExpandedMenuItemKey = _b[1];\n var _c = React.useState(), submenuTarget = _c[0], setSubmenuTarget = _c[1];\n /** True if the menu was expanded by mouse click OR hover (as opposed to by keyboard) */\n var _d = React.useState(), shouldFocusOnContainer = _d[0], setShouldFocusOnContainer = _d[1];\n var subMenuId = useId(COMPONENT_NAME, id);\n var closeSubMenu = React.useCallback(function () {\n setShouldFocusOnContainer(undefined);\n setExpandedMenuItemKey(undefined);\n setSubmenuTarget(undefined);\n }, []);\n var openSubMenu = React.useCallback(function (_a, target, focusContainer) {\n var submenuItemKey = _a.key;\n if (expandedMenuItemKey === submenuItemKey) {\n return;\n }\n target.focus();\n setShouldFocusOnContainer(focusContainer);\n setExpandedMenuItemKey(submenuItemKey);\n setSubmenuTarget(target);\n }, [expandedMenuItemKey]);\n React.useEffect(function () {\n if (hidden) {\n closeSubMenu();\n }\n }, [hidden, closeSubMenu]);\n var onSubMenuDismiss = useOnSubmenuDismiss(dismiss, closeSubMenu);\n var getSubmenuProps = function () {\n var item = findItemByKeyFromItems(expandedMenuItemKey, items);\n var submenuProps = null;\n if (item) {\n submenuProps = {\n items: getSubmenuItems(item, { target: menuTarget }),\n target: submenuTarget,\n onDismiss: onSubMenuDismiss,\n isSubMenu: true,\n id: subMenuId,\n shouldFocusOnMount: true,\n shouldFocusOnContainer: shouldFocusOnContainer,\n directionalHint: getRTL(theme) ? DirectionalHint.leftTopEdge : DirectionalHint.rightTopEdge,\n className: className,\n gapSpace: 0,\n isBeakVisible: false,\n };\n if (item.subMenuProps) {\n assign(submenuProps, item.subMenuProps);\n }\n if (item.preferMenuTargetAsEventTarget) {\n var onItemClick = item.onItemClick;\n submenuProps.onItemClick = getOnClickWithOverrideTarget(onItemClick, menuTarget);\n }\n }\n return submenuProps;\n };\n return [expandedMenuItemKey, openSubMenu, getSubmenuProps, onSubMenuDismiss];\n}\nfunction useShouldUpdateFocusOnMouseMove(_a) {\n var delayUpdateFocusOnHover = _a.delayUpdateFocusOnHover, hidden = _a.hidden;\n var shouldUpdateFocusOnMouseEvent = React.useRef(!delayUpdateFocusOnHover);\n var gotMouseMove = React.useRef(false);\n React.useEffect(function () {\n shouldUpdateFocusOnMouseEvent.current = !delayUpdateFocusOnHover;\n gotMouseMove.current = hidden ? false : !delayUpdateFocusOnHover && gotMouseMove.current;\n }, [delayUpdateFocusOnHover, hidden]);\n var onMenuFocusCapture = React.useCallback(function () {\n if (delayUpdateFocusOnHover) {\n shouldUpdateFocusOnMouseEvent.current = false;\n }\n }, [delayUpdateFocusOnHover]);\n return [shouldUpdateFocusOnMouseEvent, gotMouseMove, onMenuFocusCapture];\n}\nfunction usePreviousActiveElement(_a, targetWindow, hostElement) {\n var hidden = _a.hidden, onRestoreFocus = _a.onRestoreFocus;\n var previousActiveElement = React.useRef();\n var tryFocusPreviousActiveElement = React.useCallback(function (options) {\n var _a, _b;\n if (onRestoreFocus) {\n onRestoreFocus(options);\n }\n else if (options === null || options === void 0 ? void 0 : options.documentContainsFocus) {\n // Make sure that the focus method actually exists\n // In some cases the object might exist but not be a real element.\n // This is primarily for IE 11 and should be removed once IE 11 is no longer in use.\n (_b = (_a = previousActiveElement.current) === null || _a === void 0 ? void 0 : _a.focus) === null || _b === void 0 ? void 0 : _b.call(_a);\n }\n }, [onRestoreFocus]);\n useIsomorphicLayoutEffect(function () {\n var _a, _b;\n if (!hidden) {\n var newElement = targetWindow === null || targetWindow === void 0 ? void 0 : targetWindow.document.activeElement;\n if (!((_a = hostElement.current) === null || _a === void 0 ? void 0 : _a.contains(newElement)) && newElement.tagName !== 'BODY') {\n previousActiveElement.current = newElement;\n }\n }\n else if (previousActiveElement.current) {\n tryFocusPreviousActiveElement({\n originalElement: previousActiveElement.current,\n containsFocus: true,\n documentContainsFocus: ((_b = getDocument()) === null || _b === void 0 ? void 0 : _b.hasFocus()) || false,\n });\n previousActiveElement.current = undefined;\n }\n }, [hidden, targetWindow === null || targetWindow === void 0 ? void 0 : targetWindow.document.activeElement, tryFocusPreviousActiveElement, hostElement]);\n return [tryFocusPreviousActiveElement];\n}\nfunction useKeyHandlers(_a, dismiss, hostElement, openSubMenu) {\n var theme = _a.theme, isSubMenu = _a.isSubMenu, _b = _a.focusZoneProps, _c = _b === void 0 ? {} : _b, checkForNoWrap = _c.checkForNoWrap, _d = _c.direction, focusZoneDirection = _d === void 0 ? FocusZoneDirection.vertical : _d;\n /** True if the most recent keydown event was for alt (option) or meta (command). */\n var lastKeyDownWasAltOrMeta = React.useRef();\n /**\n * Calls `shouldHandleKey` to determine whether the keyboard event should be handled;\n * if so, stops event propagation and dismisses menu(s).\n * @param ev - The keyboard event.\n * @param shouldHandleKey - Returns whether we should handle this keyboard event.\n * @param dismissAllMenus - If true, dismiss all menus. Otherwise, dismiss only the current menu.\n * Only does anything if `shouldHandleKey` returns true.\n * @returns Whether the event was handled.\n */\n var keyHandler = function (ev, shouldHandleKey, dismissAllMenus) {\n var handled = false;\n if (shouldHandleKey(ev)) {\n dismiss(ev, dismissAllMenus);\n ev.preventDefault();\n ev.stopPropagation();\n handled = true;\n }\n return handled;\n };\n /**\n * Checks if the submenu should be closed\n */\n var shouldCloseSubMenu = function (ev) {\n var submenuCloseKey = getRTL(theme) ? KeyCodes.right : KeyCodes.left;\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n if (ev.which !== submenuCloseKey || !isSubMenu) {\n return false;\n }\n return !!(focusZoneDirection === FocusZoneDirection.vertical ||\n (checkForNoWrap && !shouldWrapFocus(ev.target, 'data-no-horizontal-wrap')));\n };\n var shouldHandleKeyDown = function (ev) {\n return (\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n ev.which === KeyCodes.escape ||\n shouldCloseSubMenu(ev) ||\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n (ev.which === KeyCodes.up && (ev.altKey || ev.metaKey)));\n };\n var onKeyDown = function (ev) {\n // Take note if we are processing an alt (option) or meta (command) keydown.\n // See comment in shouldHandleKeyUp for reasoning.\n lastKeyDownWasAltOrMeta.current = isAltOrMeta(ev);\n // On Mac, pressing escape dismisses all levels of native context menus\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n var dismissAllMenus = ev.which === KeyCodes.escape && (isMac() || isIOS());\n return keyHandler(ev, shouldHandleKeyDown, dismissAllMenus);\n };\n /**\n * We close the menu on key up only if ALL of the following are true:\n * - Most recent key down was alt or meta (command)\n * - The alt/meta key down was NOT followed by some other key (such as down/up arrow to\n * expand/collapse the menu)\n * - We're not on a Mac (or iOS)\n *\n * This is because on Windows, pressing alt moves focus to the application menu bar or similar,\n * closing any open context menus. There is not a similar behavior on Macs.\n */\n var shouldHandleKeyUp = function (ev) {\n var keyPressIsAltOrMetaAlone = lastKeyDownWasAltOrMeta.current && isAltOrMeta(ev);\n lastKeyDownWasAltOrMeta.current = false;\n return !!keyPressIsAltOrMetaAlone && !(isIOS() || isMac());\n };\n var onKeyUp = function (ev) {\n return keyHandler(ev, shouldHandleKeyUp, true /* dismissAllMenus */);\n };\n var onMenuKeyDown = function (ev) {\n // Mark as handled if onKeyDown returns true (for handling collapse cases)\n // or if we are attempting to expand a submenu\n var handled = onKeyDown(ev);\n if (handled || !hostElement.current) {\n return;\n }\n // If we have a modifier key being pressed, we do not want to move focus.\n // Otherwise, handle up and down keys.\n var hasModifier = !!(ev.altKey || ev.metaKey);\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n var isUp = ev.which === KeyCodes.up;\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n var isDown = ev.which === KeyCodes.down;\n if (!hasModifier && (isUp || isDown)) {\n var elementToFocus = isUp\n ? getLastFocusable(hostElement.current, hostElement.current.lastChild, true)\n : getFirstFocusable(hostElement.current, hostElement.current.firstChild, true);\n if (elementToFocus) {\n elementToFocus.focus();\n ev.preventDefault();\n ev.stopPropagation();\n }\n }\n };\n var onItemKeyDown = function (item, ev) {\n var openKey = getRTL(theme) ? KeyCodes.left : KeyCodes.right;\n if (!item.disabled &&\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n (ev.which === openKey || ev.which === KeyCodes.enter || (ev.which === KeyCodes.down && (ev.altKey || ev.metaKey)))) {\n openSubMenu(item, ev.currentTarget);\n ev.preventDefault();\n }\n };\n return [onKeyDown, onKeyUp, onMenuKeyDown, onItemKeyDown];\n}\nfunction useScrollHandler(asyncTracker) {\n var isScrollIdle = React.useRef(true);\n var scrollIdleTimeoutId = React.useRef();\n /**\n * Scroll handler for the callout to make sure the mouse events\n * for updating focus are not interacting during scroll\n */\n var onScroll = function () {\n if (!isScrollIdle.current && scrollIdleTimeoutId.current !== undefined) {\n asyncTracker.clearTimeout(scrollIdleTimeoutId.current);\n scrollIdleTimeoutId.current = undefined;\n }\n else {\n isScrollIdle.current = false;\n }\n scrollIdleTimeoutId.current = asyncTracker.setTimeout(function () {\n isScrollIdle.current = true;\n }, NavigationIdleDelay);\n };\n return [onScroll, isScrollIdle];\n}\nfunction useOnSubmenuDismiss(dismiss, closeSubMenu) {\n var isMountedRef = React.useRef(false);\n React.useEffect(function () {\n isMountedRef.current = true;\n return function () {\n isMountedRef.current = false;\n };\n }, []);\n /**\n * This function is called ASYNCHRONOUSLY, and so there is a chance it is called\n * after the component is unmounted. The isMountedRef is added to prevent\n * from calling setState() after unmount. Do NOT copy this pattern in synchronous\n * code.\n */\n var onSubMenuDismiss = function (ev, dismissAll) {\n if (dismissAll) {\n dismiss(ev, dismissAll);\n }\n else if (isMountedRef.current) {\n closeSubMenu();\n }\n };\n return onSubMenuDismiss;\n}\nfunction useSubmenuEnterTimer(_a, asyncTracker) {\n var _b = _a.subMenuHoverDelay, subMenuHoverDelay = _b === void 0 ? NavigationIdleDelay : _b;\n var enterTimerRef = React.useRef(undefined);\n var cancelSubMenuTimer = function () {\n if (enterTimerRef.current !== undefined) {\n asyncTracker.clearTimeout(enterTimerRef.current);\n enterTimerRef.current = undefined;\n }\n };\n var startSubmenuTimer = function (onTimerExpired) {\n enterTimerRef.current = asyncTracker.setTimeout(function () {\n onTimerExpired();\n cancelSubMenuTimer();\n }, subMenuHoverDelay);\n };\n return [cancelSubMenuTimer, startSubmenuTimer, enterTimerRef];\n}\nfunction useMouseHandlers(props, isScrollIdle, subMenuEntryTimer, targetWindow, shouldUpdateFocusOnMouseEvent, gotMouseMove, expandedMenuItemKey, hostElement, startSubmenuTimer, cancelSubMenuTimer, openSubMenu, onSubMenuDismiss, dismiss) {\n var menuTarget = props.target;\n var onItemMouseEnterBase = function (item, ev, target) {\n if (shouldUpdateFocusOnMouseEvent.current) {\n gotMouseMove.current = true;\n }\n if (shouldIgnoreMouseEvent()) {\n return;\n }\n updateFocusOnMouseEvent(item, ev, target);\n };\n var onItemMouseMoveBase = function (item, ev, target) {\n var targetElement = ev.currentTarget;\n // Always do this check to make sure we record a mouseMove if needed (even if we are timed out)\n if (shouldUpdateFocusOnMouseEvent.current) {\n gotMouseMove.current = true;\n }\n else {\n return;\n }\n if (!isScrollIdle.current ||\n subMenuEntryTimer.current !== undefined ||\n targetElement === (targetWindow === null || targetWindow === void 0 ? void 0 : targetWindow.document.activeElement)) {\n return;\n }\n updateFocusOnMouseEvent(item, ev, target);\n };\n var shouldIgnoreMouseEvent = function () {\n return !isScrollIdle.current || !gotMouseMove.current;\n };\n var onMouseItemLeave = function (item, ev) {\n var _a;\n if (shouldIgnoreMouseEvent()) {\n return;\n }\n cancelSubMenuTimer();\n if (expandedMenuItemKey !== undefined) {\n return;\n }\n /**\n * IE11 focus() method forces parents to scroll to top of element.\n * Edge and IE expose a setActive() function for focusable divs that\n * sets the page focus but does not scroll the parent element.\n */\n if (hostElement.current.setActive) {\n try {\n hostElement.current.setActive();\n }\n catch (e) {\n /* no-op */\n }\n }\n else {\n (_a = hostElement.current) === null || _a === void 0 ? void 0 : _a.focus();\n }\n };\n /**\n * Handles updating focus when mouseEnter or mouseMove fire.\n * As part of updating focus, This function will also update\n * the expand/collapse state accordingly.\n */\n var updateFocusOnMouseEvent = function (item, ev, target) {\n var targetElement = target ? target : ev.currentTarget;\n if (item.key === expandedMenuItemKey) {\n return;\n }\n cancelSubMenuTimer();\n // If the menu is not expanded we can update focus without any delay\n if (expandedMenuItemKey === undefined) {\n targetElement.focus();\n }\n // Delay updating expanding/dismissing the submenu\n // and only set focus if we have not already done so\n if (hasSubmenu(item)) {\n ev.stopPropagation();\n startSubmenuTimer(function () {\n targetElement.focus();\n openSubMenu(item, targetElement, true);\n });\n }\n else {\n startSubmenuTimer(function () {\n onSubMenuDismiss(ev);\n targetElement.focus();\n });\n }\n };\n var onItemClick = function (item, ev) {\n onItemClickBase(item, ev, ev.currentTarget);\n };\n var onItemClickBase = function (item, ev, target) {\n var items = getSubmenuItems(item, { target: menuTarget });\n // Cancel an async menu item hover timeout action from being taken and instead\n // just trigger the click event instead.\n cancelSubMenuTimer();\n if (!hasSubmenu(item) && (!items || !items.length)) {\n // This is an item without a menu. Click it.\n executeItemClick(item, ev);\n }\n else {\n if (item.key !== expandedMenuItemKey) {\n // This has a collapsed sub menu. Expand it.\n // focus on the container by default when the menu is opened with a click event\n // this differentiates from a keyboard interaction triggering the click event\n var shouldFocusOnContainer = typeof props.shouldFocusOnContainer === 'boolean'\n ? props.shouldFocusOnContainer\n : ev.nativeEvent.pointerType === 'mouse';\n openSubMenu(item, target, shouldFocusOnContainer);\n }\n }\n ev.stopPropagation();\n ev.preventDefault();\n };\n var onAnchorClick = function (item, ev) {\n executeItemClick(item, ev);\n ev.stopPropagation();\n };\n var executeItemClick = function (item, ev) {\n if (item.disabled || item.isDisabled) {\n return;\n }\n if (item.preferMenuTargetAsEventTarget) {\n overrideTarget(ev, menuTarget);\n }\n var shouldDismiss = false;\n if (item.onClick) {\n shouldDismiss = !!item.onClick(ev, item);\n }\n else if (props.onItemClick) {\n shouldDismiss = !!props.onItemClick(ev, item);\n }\n if (shouldDismiss || !ev.defaultPrevented) {\n dismiss(ev, true);\n }\n };\n return [\n onItemMouseEnterBase,\n onItemMouseMoveBase,\n onMouseItemLeave,\n onItemClick,\n onAnchorClick,\n executeItemClick,\n onItemClickBase,\n ];\n}\n//#endregion\nexport var ContextualMenuBase = React.memo(React.forwardRef(function (propsWithoutDefaults, forwardedRef) {\n var _a;\n var _b = getPropsWithDefaults(DEFAULT_PROPS, propsWithoutDefaults), ref = _b.ref, props = __rest(_b, [\"ref\"]);\n var hostElement = React.useRef(null);\n var asyncTracker = useAsync();\n var menuId = useId(COMPONENT_NAME, props.id);\n useWarnings({\n name: COMPONENT_NAME,\n props: props,\n deprecations: {\n getMenuClassNames: 'styles',\n },\n });\n var dismiss = function (ev, dismissAll) { var _a; return (_a = props.onDismiss) === null || _a === void 0 ? void 0 : _a.call(props, ev, dismissAll); };\n var _c = useTarget(props.target, hostElement), targetRef = _c[0], targetWindow = _c[1];\n var tryFocusPreviousActiveElement = usePreviousActiveElement(props, targetWindow, hostElement)[0];\n var _d = useSubMenuState(props, dismiss), expandedMenuItemKey = _d[0], openSubMenu = _d[1], getSubmenuProps = _d[2], onSubMenuDismiss = _d[3];\n var _e = useShouldUpdateFocusOnMouseMove(props), shouldUpdateFocusOnMouseEvent = _e[0], gotMouseMove = _e[1], onMenuFocusCapture = _e[2];\n var _f = useScrollHandler(asyncTracker), onScroll = _f[0], isScrollIdle = _f[1];\n var _g = useSubmenuEnterTimer(props, asyncTracker), cancelSubMenuTimer = _g[0], startSubmenuTimer = _g[1], subMenuEntryTimer = _g[2];\n var responsiveMode = useResponsiveMode(hostElement, props.responsiveMode);\n useVisibility(props, targetWindow);\n var _h = useKeyHandlers(props, dismiss, hostElement, openSubMenu), onKeyDown = _h[0], onKeyUp = _h[1], onMenuKeyDown = _h[2], onItemKeyDown = _h[3];\n var _j = useMouseHandlers(props, isScrollIdle, subMenuEntryTimer, targetWindow, shouldUpdateFocusOnMouseEvent, gotMouseMove, expandedMenuItemKey, hostElement, startSubmenuTimer, cancelSubMenuTimer, openSubMenu, onSubMenuDismiss, dismiss), onItemMouseEnterBase = _j[0], onItemMouseMoveBase = _j[1], onMouseItemLeave = _j[2], onItemClick = _j[3], onAnchorClick = _j[4], executeItemClick = _j[5], onItemClickBase = _j[6];\n //#region Render helpers\n var onDefaultRenderMenuList = function (menuListProps, \n // eslint-disable-next-line @typescript-eslint/no-deprecated\n menuClassNames, defaultRender) {\n var indexCorrection = 0;\n var items = menuListProps.items, totalItemCount = menuListProps.totalItemCount, hasCheckmarks = menuListProps.hasCheckmarks, hasIcons = menuListProps.hasIcons;\n return (React.createElement(\"ul\", { className: menuClassNames.list, onKeyDown: onKeyDown, onKeyUp: onKeyUp, role: 'presentation' }, items.map(function (item, index) {\n var menuItem = renderMenuItem(item, index, indexCorrection, totalItemCount, hasCheckmarks, hasIcons, menuClassNames);\n if (item.itemType !== ContextualMenuItemType.Divider && item.itemType !== ContextualMenuItemType.Header) {\n var indexIncrease = item.customOnRenderListLength ? item.customOnRenderListLength : 1;\n indexCorrection += indexIncrease;\n }\n return menuItem;\n })));\n };\n var renderFocusZone = function (children, adjustedFocusZoneProps) {\n var _a = props.focusZoneAs, ChildrenRenderer = _a === void 0 ? FocusZone : _a;\n return React.createElement(ChildrenRenderer, __assign({}, adjustedFocusZoneProps), children);\n };\n /**\n * !!!IMPORTANT!!! Avoid mutating `item: IContextualMenuItem` argument. It will\n * cause the menu items to always re-render because the component update is based on shallow comparison.\n */\n var renderMenuItem = function (item, index, focusableElementIndex, totalItemCount, hasCheckmarks, hasIcons, \n // eslint-disable-next-line @typescript-eslint/no-deprecated\n menuClassNames) {\n var _a;\n var renderedItems = [];\n var iconProps = item.iconProps || { iconName: 'None' };\n var getItemClassNames = item.getItemClassNames, // eslint-disable-line @typescript-eslint/no-deprecated\n itemProps = item.itemProps;\n var styles = itemProps ? itemProps.styles : undefined;\n // We only send a dividerClassName when the item to be rendered is a divider.\n // For all other cases, the default divider style is used.\n var dividerClassName = item.itemType === ContextualMenuItemType.Divider ? item.className : undefined;\n var subMenuIconClassName = item.submenuIconProps ? item.submenuIconProps.className : '';\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n var itemClassNames;\n // IContextualMenuItem#getItemClassNames for backwards compatibility\n // otherwise uses mergeStyles for class names.\n if (getItemClassNames) {\n itemClassNames = getItemClassNames(props.theme, isItemDisabled(item), expandedMenuItemKey === item.key, !!getIsChecked(item), !!item.href, iconProps.iconName !== 'None', item.className, dividerClassName, iconProps.className, subMenuIconClassName, item.primaryDisabled);\n }\n else {\n var itemStyleProps = {\n theme: props.theme,\n disabled: isItemDisabled(item),\n expanded: expandedMenuItemKey === item.key,\n checked: !!getIsChecked(item),\n isAnchorLink: !!item.href,\n knownIcon: iconProps.iconName !== 'None',\n itemClassName: item.className,\n dividerClassName: dividerClassName,\n iconClassName: iconProps.className,\n subMenuClassName: subMenuIconClassName,\n primaryDisabled: item.primaryDisabled,\n };\n // We need to generate default styles then override if styles are provided\n // since the ContextualMenu currently handles item classNames.\n itemClassNames = getContextualMenuItemClassNames(_getMenuItemStylesFunction((_a = menuClassNames.subComponentStyles) === null || _a === void 0 ? void 0 : _a.menuItem, styles), itemStyleProps);\n }\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n if (item.text === '-' || item.name === '-') {\n item.itemType = ContextualMenuItemType.Divider;\n }\n switch (item.itemType) {\n case ContextualMenuItemType.Divider:\n renderedItems.push(renderSeparator(index, itemClassNames));\n break;\n case ContextualMenuItemType.Header:\n renderedItems.push(renderSeparator(index, itemClassNames));\n var headerItem = renderHeaderMenuItem(item, itemClassNames, menuClassNames, index, hasCheckmarks, hasIcons);\n renderedItems.push(renderListItem(headerItem, item.key || index, itemClassNames, item.title));\n break;\n case ContextualMenuItemType.Section:\n renderedItems.push(renderSectionItem(item, itemClassNames, menuClassNames, index, hasCheckmarks, hasIcons));\n break;\n default:\n var defaultRenderNormalItem = function () {\n return renderNormalItem(item, itemClassNames, index, focusableElementIndex, totalItemCount, hasCheckmarks, hasIcons);\n };\n var menuItem = props.onRenderContextualMenuItem\n ? props.onRenderContextualMenuItem(item, defaultRenderNormalItem)\n : defaultRenderNormalItem();\n renderedItems.push(renderListItem(menuItem, item.key || index, itemClassNames, item.title));\n break;\n }\n // Since multiple nodes *could* be rendered, wrap them all in a fragment with this item's key.\n // This ensures the reconciler handles multi-item output per-node correctly and does not re-mount content.\n return React.createElement(React.Fragment, { key: item.key }, renderedItems);\n };\n var defaultMenuItemRenderer = function (item, \n // eslint-disable-next-line @typescript-eslint/no-deprecated\n menuClassNames) {\n var index = item.index, focusableElementIndex = item.focusableElementIndex, totalItemCount = item.totalItemCount, hasCheckmarks = item.hasCheckmarks, hasIcons = item.hasIcons;\n return renderMenuItem(item, index, focusableElementIndex, totalItemCount, hasCheckmarks, hasIcons, menuClassNames);\n };\n var renderSectionItem = function (sectionItem, \n // eslint-disable-next-line @typescript-eslint/no-deprecated\n itemClassNames, \n // eslint-disable-next-line @typescript-eslint/no-deprecated\n menuClassNames, index, hasCheckmarks, hasIcons) {\n var sectionProps = sectionItem.sectionProps;\n if (!sectionProps) {\n return;\n }\n var headerItem;\n var groupProps;\n if (sectionProps.title) {\n var headerContextualMenuItem = undefined;\n var ariaLabelledby = '';\n if (typeof sectionProps.title === 'string') {\n // Since title is a user-facing string, it needs to be stripped\n // of whitespace in order to build a valid element ID\n var id_1 = menuId + sectionProps.title.replace(/\\s/g, '');\n headerContextualMenuItem = {\n key: \"section-\".concat(sectionProps.title, \"-title\"),\n itemType: ContextualMenuItemType.Header,\n text: sectionProps.title,\n id: id_1,\n };\n ariaLabelledby = id_1;\n }\n else {\n var id_2 = sectionProps.title.id || menuId + sectionProps.title.key.replace(/\\s/g, '');\n headerContextualMenuItem = __assign(__assign({}, sectionProps.title), { id: id_2 });\n ariaLabelledby = id_2;\n }\n if (headerContextualMenuItem) {\n groupProps = {\n role: 'group',\n 'aria-labelledby': ariaLabelledby,\n };\n headerItem = renderHeaderMenuItem(headerContextualMenuItem, itemClassNames, menuClassNames, index, hasCheckmarks, hasIcons);\n }\n }\n if (sectionProps.items && sectionProps.items.length > 0) {\n var correctedIndex_1 = 0;\n return (React.createElement(\"li\", { role: \"presentation\", key: sectionProps.key || sectionItem.key || \"section-\".concat(index) },\n React.createElement(\"div\", __assign({}, groupProps),\n React.createElement(\"ul\", { className: menuClassNames.list, role: \"presentation\" },\n sectionProps.topDivider && renderSeparator(index, itemClassNames, true, true),\n headerItem && renderListItem(headerItem, sectionItem.key || index, itemClassNames, sectionItem.title),\n sectionProps.items.map(function (contextualMenuItem, itemsIndex) {\n var menuItem = renderMenuItem(contextualMenuItem, itemsIndex, correctedIndex_1, getItemCount(sectionProps.items), hasCheckmarks, hasIcons, menuClassNames);\n if (contextualMenuItem.itemType !== ContextualMenuItemType.Divider &&\n contextualMenuItem.itemType !== ContextualMenuItemType.Header) {\n var indexIncrease = contextualMenuItem.customOnRenderListLength\n ? contextualMenuItem.customOnRenderListLength\n : 1;\n correctedIndex_1 += indexIncrease;\n }\n return menuItem;\n }),\n sectionProps.bottomDivider && renderSeparator(index, itemClassNames, false, true)))));\n }\n };\n var renderListItem = function (content, key, classNames, // eslint-disable-line @typescript-eslint/no-deprecated\n title) {\n return (React.createElement(\"li\", { role: \"presentation\", title: title, key: key, className: classNames.item }, content));\n };\n var renderSeparator = function (index, classNames, // eslint-disable-line @typescript-eslint/no-deprecated\n top, fromSection) {\n if (fromSection || index > 0) {\n return (React.createElement(\"li\", { role: \"separator\", key: 'separator-' + index + (top === undefined ? '' : top ? '-top' : '-bottom'), className: classNames.divider, \"aria-hidden\": \"true\" }));\n }\n return null;\n };\n var renderNormalItem = function (item, classNames, // eslint-disable-line @typescript-eslint/no-deprecated\n index, focusableElementIndex, totalItemCount, hasCheckmarks, hasIcons) {\n if (item.onRender) {\n return item.onRender(__assign({ 'aria-posinset': focusableElementIndex + 1, 'aria-setsize': totalItemCount }, item), dismiss);\n }\n var contextualMenuItemAs = props.contextualMenuItemAs;\n var commonProps = {\n item: item,\n classNames: classNames,\n index: index,\n focusableElementIndex: focusableElementIndex,\n totalItemCount: totalItemCount,\n hasCheckmarks: hasCheckmarks,\n hasIcons: hasIcons,\n contextualMenuItemAs: contextualMenuItemAs,\n onItemMouseEnter: onItemMouseEnterBase,\n onItemMouseLeave: onMouseItemLeave,\n onItemMouseMove: onItemMouseMoveBase,\n onItemMouseDown: onItemMouseDown,\n executeItemClick: executeItemClick,\n onItemKeyDown: onItemKeyDown,\n expandedMenuItemKey: expandedMenuItemKey,\n openSubMenu: openSubMenu,\n dismissSubMenu: onSubMenuDismiss,\n dismissMenu: dismiss,\n };\n if (item.href) {\n var ContextualMenuAnchorAs = ContextualMenuAnchor;\n if (item.contextualMenuItemWrapperAs) {\n ContextualMenuAnchorAs = composeComponentAs(item.contextualMenuItemWrapperAs, ContextualMenuAnchorAs);\n }\n return React.createElement(ContextualMenuAnchorAs, __assign({}, commonProps, { onItemClick: onAnchorClick }));\n }\n if (item.split && hasSubmenu(item)) {\n var ContextualMenuSplitButtonAs = ContextualMenuSplitButton;\n if (item.contextualMenuItemWrapperAs) {\n ContextualMenuSplitButtonAs = composeComponentAs(item.contextualMenuItemWrapperAs, ContextualMenuSplitButtonAs);\n }\n return (React.createElement(ContextualMenuSplitButtonAs, __assign({}, commonProps, { onItemClick: onItemClick, onItemClickBase: onItemClickBase, onTap: cancelSubMenuTimer })));\n }\n var ContextualMenuButtonAs = ContextualMenuButton;\n if (item.contextualMenuItemWrapperAs) {\n ContextualMenuButtonAs = composeComponentAs(item.contextualMenuItemWrapperAs, ContextualMenuButtonAs);\n }\n return React.createElement(ContextualMenuButtonAs, __assign({}, commonProps, { onItemClick: onItemClick, onItemClickBase: onItemClickBase }));\n };\n var renderHeaderMenuItem = function (item, \n // eslint-disable-next-line @typescript-eslint/no-deprecated\n itemClassNames, \n // eslint-disable-next-line @typescript-eslint/no-deprecated\n menuClassNames, index, hasCheckmarks, hasIcons) {\n var ChildrenRenderer = ContextualMenuItem;\n if (item.contextualMenuItemAs) {\n ChildrenRenderer = composeComponentAs(item.contextualMenuItemAs, ChildrenRenderer);\n }\n if (props.contextualMenuItemAs) {\n ChildrenRenderer = composeComponentAs(props.contextualMenuItemAs, ChildrenRenderer);\n }\n var itemProps = item.itemProps, id = item.id;\n var divHtmlProperties = itemProps && getNativeProps(itemProps, divProperties);\n return (\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n React.createElement(\"div\", __assign({ id: id, className: menuClassNames.header }, divHtmlProperties, { style: item.style }),\n React.createElement(ChildrenRenderer, __assign({ item: item, classNames: itemClassNames, index: index, onCheckmarkClick: hasCheckmarks ? onItemClick : undefined, hasIcons: hasIcons }, itemProps))));\n };\n //#endregion\n //#region Main render\n var isBeakVisible = props.isBeakVisible;\n var items = props.items, labelElementId = props.labelElementId, id = props.id, className = props.className, beakWidth = props.beakWidth, directionalHint = props.directionalHint, directionalHintForRTL = props.directionalHintForRTL, alignTargetEdge = props.alignTargetEdge, gapSpace = props.gapSpace, coverTarget = props.coverTarget, ariaLabel = props.ariaLabel, doNotLayer = props.doNotLayer, target = props.target, bounds = props.bounds, useTargetWidth = props.useTargetWidth, useTargetAsMinWidth = props.useTargetAsMinWidth, directionalHintFixed = props.directionalHintFixed, shouldFocusOnMount = props.shouldFocusOnMount, shouldFocusOnContainer = props.shouldFocusOnContainer, title = props.title, styles = props.styles, theme = props.theme, calloutProps = props.calloutProps, _k = props.onRenderSubMenu, onRenderSubMenu = _k === void 0 ? onDefaultRenderSubMenu : _k, _l = props.onRenderMenuList, onRenderMenuList = _l === void 0 ? function (menuListProps, defaultRender) { return onDefaultRenderMenuList(menuListProps, classNames, defaultRender); } : _l, focusZoneProps = props.focusZoneProps, \n // eslint-disable-next-line @typescript-eslint/no-deprecated\n getMenuClassNames = props.getMenuClassNames;\n var classNames = getMenuClassNames\n ? getMenuClassNames(theme, className)\n : getClassNames(styles, {\n theme: theme,\n className: className,\n });\n var hasIcons = itemsHaveIcons(items);\n function itemsHaveIcons(contextualMenuItems) {\n for (var _i = 0, contextualMenuItems_1 = contextualMenuItems; _i < contextualMenuItems_1.length; _i++) {\n var item = contextualMenuItems_1[_i];\n if (item.iconProps) {\n return true;\n }\n if (item.itemType === ContextualMenuItemType.Section &&\n item.sectionProps &&\n itemsHaveIcons(item.sectionProps.items)) {\n return true;\n }\n }\n return false;\n }\n var adjustedFocusZoneProps = __assign(__assign({ direction: FocusZoneDirection.vertical, handleTabKey: FocusZoneTabbableElements.all, isCircularNavigation: true, 'data-tabster': '{\"uncontrolled\": {}, \"focusable\": { \"excludeFromMover\": true }}' }, focusZoneProps), { className: css(classNames.root, (_a = props.focusZoneProps) === null || _a === void 0 ? void 0 : _a.className) });\n var hasCheckmarks = canAnyMenuItemsCheck(items);\n var submenuProps = expandedMenuItemKey && props.hidden !== true ? getSubmenuProps() : null;\n isBeakVisible = isBeakVisible === undefined ? responsiveMode <= ResponsiveMode.medium : isBeakVisible;\n /**\n * When useTargetWidth is true, get the width of the target element and apply it for the context menu container\n */\n var contextMenuStyle;\n var targetAsHtmlElement = targetRef.current;\n if ((useTargetWidth || useTargetAsMinWidth) && targetAsHtmlElement && targetAsHtmlElement.offsetWidth) {\n var targetBoundingRect = targetAsHtmlElement.getBoundingClientRect();\n var targetWidth = targetBoundingRect.width - 2; /* Accounts for 1px border */\n if (useTargetWidth) {\n contextMenuStyle = {\n width: targetWidth,\n };\n }\n else if (useTargetAsMinWidth) {\n contextMenuStyle = {\n minWidth: targetWidth,\n };\n }\n }\n // The menu should only return if items were provided, if no items were provided then it should not appear.\n if (items && items.length > 0) {\n var totalItemCount_1 = getItemCount(items);\n var calloutStyles_1 = classNames.subComponentStyles\n ? classNames.subComponentStyles.callout\n : undefined;\n return (React.createElement(MenuContext.Consumer, null, function (menuContext) { return (React.createElement(Callout, __assign({ styles: calloutStyles_1, onRestoreFocus: tryFocusPreviousActiveElement }, calloutProps, { target: target || menuContext.target, isBeakVisible: isBeakVisible, beakWidth: beakWidth, directionalHint: directionalHint, directionalHintForRTL: directionalHintForRTL, gapSpace: gapSpace, coverTarget: coverTarget, doNotLayer: doNotLayer, className: css('ms-ContextualMenu-Callout', calloutProps && calloutProps.className), setInitialFocus: shouldFocusOnMount, onDismiss: props.onDismiss || menuContext.onDismiss, onScroll: onScroll, bounds: bounds, directionalHintFixed: directionalHintFixed, alignTargetEdge: alignTargetEdge, hidden: props.hidden || menuContext.hidden, ref: forwardedRef }),\n React.createElement(\"div\", { style: contextMenuStyle, ref: hostElement, id: id, className: classNames.container, tabIndex: shouldFocusOnContainer ? 0 : -1, onKeyDown: onMenuKeyDown, onKeyUp: onKeyUp, onFocusCapture: onMenuFocusCapture, \"aria-label\": ariaLabel, \"aria-labelledby\": labelElementId, role: 'menu' },\n title && React.createElement(\"div\", { className: classNames.title },\n \" \",\n title,\n \" \"),\n items && items.length\n ? renderFocusZone(onRenderMenuList({\n ariaLabel: ariaLabel,\n items: items,\n totalItemCount: totalItemCount_1,\n hasCheckmarks: hasCheckmarks,\n hasIcons: hasIcons,\n defaultMenuItemRenderer: function (item) {\n return defaultMenuItemRenderer(item, classNames);\n },\n labelElementId: labelElementId,\n }, function (menuListProps, defaultRender) { return onDefaultRenderMenuList(menuListProps, classNames, defaultRender); }), adjustedFocusZoneProps)\n : null,\n submenuProps && onRenderSubMenu(submenuProps, onDefaultRenderSubMenu)),\n React.createElement(FocusRects, null))); }));\n }\n else {\n return null;\n }\n //#endregion\n}), function (prevProps, newProps) {\n if (!newProps.shouldUpdateWhenHidden && prevProps.hidden && newProps.hidden) {\n // Do not update when hidden.\n return true;\n }\n return shallowCompare(prevProps, newProps);\n});\nContextualMenuBase.displayName = 'ContextualMenuBase';\n/**\n * Returns true if the key for the event is alt (Mac option) or meta (Mac command).\n */\nfunction isAltOrMeta(ev) {\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n return ev.which === KeyCodes.alt || ev.key === 'Meta';\n}\nfunction onItemMouseDown(item, ev) {\n var _a;\n (_a = item.onMouseDown) === null || _a === void 0 ? void 0 : _a.call(item, item, ev);\n}\nfunction onDefaultRenderSubMenu(subMenuProps, defaultRender) {\n throw Error('ContextualMenuBase: onRenderSubMenu callback is null or undefined. ' +\n 'Please ensure to set `onRenderSubMenu` property either manually or with `styled` helper.');\n}\n/**\n * Returns the item that matches a given key if any.\n * @param key - The key of the item to match\n * @param items - The items to look for the key\n */\nfunction findItemByKeyFromItems(key, items) {\n for (var _i = 0, items_3 = items; _i < items_3.length; _i++) {\n var item = items_3[_i];\n if (item.itemType === ContextualMenuItemType.Section && item.sectionProps) {\n var match = findItemByKeyFromItems(key, item.sectionProps.items);\n if (match) {\n return match;\n }\n }\n else if (item.key && item.key === key) {\n return item;\n }\n }\n}\nfunction getOnClickWithOverrideTarget(onClick, target) {\n return onClick\n ? function (ev, item) {\n overrideTarget(ev, target);\n return onClick(ev, item);\n }\n : onClick;\n}\nfunction overrideTarget(ev, target) {\n if (ev && target) {\n ev.persist();\n if (target instanceof Event) {\n ev.target = target.target;\n }\n else if (target instanceof Element) {\n ev.target = target;\n }\n }\n}\n//# sourceMappingURL=ContextualMenu.base.js.map","import { memoizeFunction } from '../../Utilities';\nimport { mergeStyleSets } from '../../Styling';\n/**\n * @deprecated use getStyles exported from VerticalDivider.styles.ts\n */\nexport var getDividerClassNames = memoizeFunction(\n// eslint-disable-next-line @typescript-eslint/no-deprecated\nfunction (theme) {\n return mergeStyleSets({\n wrapper: {\n display: 'inline-flex',\n height: '100%',\n alignItems: 'center',\n },\n divider: {\n width: 1,\n height: '100%',\n backgroundColor: theme.palette.neutralTertiaryAlt,\n },\n });\n});\n//# sourceMappingURL=VerticalDivider.classNames.js.map","import { getDividerClassNames } from '../Divider/VerticalDivider.classNames';\nimport { getMenuItemStyles } from './ContextualMenu.cnstyles';\nimport { mergeStyleSets, getGlobalClassNames, getScreenSelector, ScreenWidthMaxMedium, hiddenContentStyle, } from '../../Styling';\nimport { memoizeFunction, IsFocusVisibleClassName } from '../../Utilities';\nvar CONTEXTUAL_SPLIT_MENU_MINWIDTH = '28px';\nvar MediumScreenSelector = getScreenSelector(0, ScreenWidthMaxMedium);\nexport var getSplitButtonVerticalDividerClassNames = memoizeFunction(\n/* eslint-disable @typescript-eslint/no-deprecated */\nfunction (theme) {\n var _a;\n return mergeStyleSets(getDividerClassNames(theme), {\n /* eslint-enable @typescript-eslint/no-deprecated */\n wrapper: {\n position: 'absolute',\n right: 28, // width of the splitMenu based on the padding plus icon fontSize\n selectors: (_a = {},\n _a[MediumScreenSelector] = {\n right: 32, // fontSize of the icon increased from 12px to 16px\n },\n _a),\n },\n divider: {\n height: 16,\n width: 1,\n },\n });\n});\nvar GlobalClassNames = {\n item: 'ms-ContextualMenu-item',\n divider: 'ms-ContextualMenu-divider',\n root: 'ms-ContextualMenu-link',\n isChecked: 'is-checked',\n isExpanded: 'is-expanded',\n isDisabled: 'is-disabled',\n linkContent: 'ms-ContextualMenu-linkContent',\n linkContentMenu: 'ms-ContextualMenu-linkContent',\n icon: 'ms-ContextualMenu-icon',\n iconColor: 'ms-ContextualMenu-iconColor',\n checkmarkIcon: 'ms-ContextualMenu-checkmarkIcon',\n subMenuIcon: 'ms-ContextualMenu-submenuIcon',\n label: 'ms-ContextualMenu-itemText',\n secondaryText: 'ms-ContextualMenu-secondaryText',\n splitMenu: 'ms-ContextualMenu-splitMenu',\n screenReaderText: 'ms-ContextualMenu-screenReaderText',\n};\n/**\n * @deprecated Will be removed in \\>= 7.0.\n * This is a package-internal method that has been depended on.\n * It is being kept in this form for backwards compatibility.\n * @internal\n */\n// TODO: Audit perf. impact of and potentially remove memoizeFunction.\n// https://github.com/microsoft/fluentui/issues/5534\nexport var getItemClassNames = memoizeFunction(function (theme, disabled, expanded, checked, isAnchorLink, knownIcon, itemClassName, dividerClassName, iconClassName, subMenuClassName, primaryDisabled, className) {\n var _a, _b, _c, _d;\n var styles = getMenuItemStyles(theme);\n var classNames = getGlobalClassNames(GlobalClassNames, theme);\n return mergeStyleSets({\n item: [classNames.item, styles.item, itemClassName],\n divider: [classNames.divider, styles.divider, dividerClassName],\n root: [\n classNames.root,\n styles.root,\n checked && [classNames.isChecked, styles.rootChecked],\n isAnchorLink && styles.anchorLink,\n expanded && [classNames.isExpanded, styles.rootExpanded],\n disabled && [classNames.isDisabled, styles.rootDisabled],\n !disabled &&\n !expanded && [\n {\n selectors: (_a = {\n ':hover': styles.rootHovered,\n ':active': styles.rootPressed\n },\n // eslint-disable-next-line @fluentui/max-len\n _a[\".\".concat(IsFocusVisibleClassName, \" &:focus, .\").concat(IsFocusVisibleClassName, \" &:focus:hover, :host(.\").concat(IsFocusVisibleClassName, \") &:focus, :host(.\").concat(IsFocusVisibleClassName, \") &:focus:hover\")] = styles.rootFocused,\n _a[\".\".concat(IsFocusVisibleClassName, \" &:hover, :host(.\").concat(IsFocusVisibleClassName, \") &:hover\")] = {\n background: 'inherit;',\n },\n _a),\n },\n ],\n className,\n ],\n splitPrimary: [\n styles.root,\n {\n width: \"calc(100% - \".concat(CONTEXTUAL_SPLIT_MENU_MINWIDTH, \")\"),\n },\n checked && ['is-checked', styles.rootChecked],\n (disabled || primaryDisabled) && ['is-disabled', styles.rootDisabled],\n !(disabled || primaryDisabled) &&\n !checked && [\n {\n selectors: (_b = {\n ':hover': styles.rootHovered\n },\n // when hovering over the splitPrimary also affect the splitMenu\n _b[\":hover ~ .\".concat(classNames.splitMenu)] = styles.rootHovered,\n _b[':active'] = styles.rootPressed,\n // eslint-disable-next-line @fluentui/max-len\n _b[\".\".concat(IsFocusVisibleClassName, \" &:focus, .\").concat(IsFocusVisibleClassName, \" &:focus:hover, :host(.\").concat(IsFocusVisibleClassName, \") &:focus, :host(.\").concat(IsFocusVisibleClassName, \") &:focus:hover\")] = styles.rootFocused,\n _b[\".\".concat(IsFocusVisibleClassName, \" &:hover, :host(.\").concat(IsFocusVisibleClassName, \") &:hover\")] = {\n background: 'inherit;',\n },\n _b),\n },\n ],\n ],\n splitMenu: [\n classNames.splitMenu,\n styles.root,\n {\n flexBasis: '0',\n padding: '0 8px',\n minWidth: CONTEXTUAL_SPLIT_MENU_MINWIDTH,\n },\n expanded && ['is-expanded', styles.rootExpanded],\n disabled && ['is-disabled', styles.rootDisabled],\n !disabled &&\n !expanded && [\n {\n selectors: (_c = {\n ':hover': styles.rootHovered,\n ':active': styles.rootPressed\n },\n // eslint-disable-next-line @fluentui/max-len\n _c[\".\".concat(IsFocusVisibleClassName, \" &:focus, .\").concat(IsFocusVisibleClassName, \" &:focus:hover, :host(.\").concat(IsFocusVisibleClassName, \") &:focus, :host(.\").concat(IsFocusVisibleClassName, \") &:focus:hover\")] = styles.rootFocused,\n _c[\".\".concat(IsFocusVisibleClassName, \" &:hover, :host(.\").concat(IsFocusVisibleClassName, \") &:hover\")] = {\n background: 'inherit;',\n },\n _c),\n },\n ],\n ],\n anchorLink: styles.anchorLink,\n linkContent: [classNames.linkContent, styles.linkContent],\n linkContentMenu: [\n classNames.linkContentMenu,\n styles.linkContent,\n {\n justifyContent: 'center',\n },\n ],\n icon: [\n classNames.icon,\n knownIcon && styles.iconColor,\n styles.icon,\n iconClassName,\n disabled && [classNames.isDisabled, styles.iconDisabled],\n ],\n iconColor: styles.iconColor,\n checkmarkIcon: [classNames.checkmarkIcon, knownIcon && styles.checkmarkIcon, styles.icon, iconClassName],\n subMenuIcon: [\n classNames.subMenuIcon,\n styles.subMenuIcon,\n subMenuClassName,\n expanded && { color: theme.palette.neutralPrimary },\n disabled && [styles.iconDisabled],\n ],\n label: [classNames.label, styles.label],\n secondaryText: [classNames.secondaryText, styles.secondaryText],\n splitContainer: [\n styles.splitButtonFlexContainer,\n !disabled &&\n !checked && [\n {\n selectors: (_d = {},\n // eslint-disable-next-line @fluentui/max-len\n _d[\".\".concat(IsFocusVisibleClassName, \" &:focus, .\").concat(IsFocusVisibleClassName, \" &:focus:hover, :host(.\").concat(IsFocusVisibleClassName, \") &:focus, :host(.\").concat(IsFocusVisibleClassName, \") &:focus:hover\")] = styles.rootFocused,\n _d),\n },\n ],\n ],\n screenReaderText: [\n classNames.screenReaderText,\n styles.screenReaderText,\n hiddenContentStyle,\n { visibility: 'hidden' },\n ],\n });\n});\n/**\n * Wrapper function for generating ContextualMenuItem classNames which adheres to\n * the getStyles API, but invokes memoized className generator function with\n * primitive values.\n *\n * @param props - the ContextualMenuItem style props used to generate its styles.\n */\nexport var getItemStyles = function (props) {\n var theme = props.theme, disabled = props.disabled, expanded = props.expanded, checked = props.checked, isAnchorLink = props.isAnchorLink, knownIcon = props.knownIcon, itemClassName = props.itemClassName, dividerClassName = props.dividerClassName, iconClassName = props.iconClassName, subMenuClassName = props.subMenuClassName, primaryDisabled = props.primaryDisabled, className = props.className;\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n return getItemClassNames(theme, disabled, expanded, checked, isAnchorLink, knownIcon, itemClassName, dividerClassName, iconClassName, subMenuClassName, primaryDisabled, className);\n};\n//# sourceMappingURL=ContextualMenu.classNames.js.map","import { __assign } from \"tslib\";\nimport { concatStyleSets, getFocusStyle, HighContrastSelector, getScreenSelector, ScreenWidthMaxMedium, IconFontSizes, getHighContrastNoAdjustStyle, } from '../../Styling';\nimport { memoizeFunction } from '../../Utilities';\nexport var CONTEXTUAL_MENU_ITEM_HEIGHT = 36;\nvar MediumScreenSelector = getScreenSelector(0, ScreenWidthMaxMedium);\nexport var getMenuItemStyles = memoizeFunction(function (theme) {\n var _a, _b, _c, _d, _e;\n var semanticColors = theme.semanticColors, fonts = theme.fonts, palette = theme.palette;\n var ContextualMenuItemBackgroundHoverColor = semanticColors.menuItemBackgroundHovered;\n var ContextualMenuItemTextHoverColor = semanticColors.menuItemTextHovered;\n var ContextualMenuItemBackgroundSelectedColor = semanticColors.menuItemBackgroundPressed;\n var ContextualMenuItemDividerColor = semanticColors.bodyDivider;\n var menuItemStyles = {\n item: [\n fonts.medium,\n {\n color: semanticColors.bodyText,\n position: 'relative',\n boxSizing: 'border-box',\n },\n ],\n divider: {\n display: 'block',\n height: '1px',\n backgroundColor: ContextualMenuItemDividerColor,\n position: 'relative',\n },\n root: [\n getFocusStyle(theme),\n fonts.medium,\n {\n color: semanticColors.bodyText,\n backgroundColor: 'transparent',\n border: 'none',\n width: '100%',\n height: CONTEXTUAL_MENU_ITEM_HEIGHT,\n lineHeight: CONTEXTUAL_MENU_ITEM_HEIGHT,\n display: 'block',\n cursor: 'pointer',\n padding: '0px 8px 0 4px', // inner elements have a margin of 4px (4 + 4 = 8px as on right side)\n textAlign: 'left',\n },\n ],\n rootDisabled: {\n color: semanticColors.disabledBodyText,\n cursor: 'default',\n pointerEvents: 'none',\n selectors: (_a = {},\n _a[HighContrastSelector] = {\n // ensure disabled text looks different than enabled\n color: 'GrayText',\n opacity: 1,\n },\n _a),\n },\n rootHovered: {\n backgroundColor: ContextualMenuItemBackgroundHoverColor,\n color: ContextualMenuItemTextHoverColor,\n selectors: {\n '.ms-ContextualMenu-icon': {\n color: palette.themeDarkAlt,\n },\n '.ms-ContextualMenu-submenuIcon': {\n color: palette.neutralPrimary,\n },\n },\n },\n rootFocused: {\n backgroundColor: palette.white,\n },\n rootChecked: {\n selectors: {\n '.ms-ContextualMenu-checkmarkIcon': {\n color: palette.neutralPrimary,\n },\n },\n },\n rootPressed: {\n backgroundColor: ContextualMenuItemBackgroundSelectedColor,\n selectors: {\n '.ms-ContextualMenu-icon': {\n color: palette.themeDark,\n },\n '.ms-ContextualMenu-submenuIcon': {\n color: palette.neutralPrimary,\n },\n },\n },\n rootExpanded: {\n backgroundColor: ContextualMenuItemBackgroundSelectedColor,\n color: semanticColors.bodyTextChecked,\n selectors: (_b = {\n '.ms-ContextualMenu-submenuIcon': (_c = {},\n _c[HighContrastSelector] = {\n // icons inside of anchor tags are not properly inheriting color in high contrast\n color: 'inherit',\n },\n _c)\n },\n _b[HighContrastSelector] = __assign({}, getHighContrastNoAdjustStyle()),\n _b),\n },\n linkContent: {\n whiteSpace: 'nowrap',\n height: 'inherit',\n display: 'flex',\n alignItems: 'center',\n maxWidth: '100%',\n },\n anchorLink: {\n padding: '0px 8px 0 4px', // inner elements have a margin of 4px (4 + 4 = 8px as on right side)\n textRendering: 'auto',\n color: 'inherit',\n letterSpacing: 'normal',\n wordSpacing: 'normal',\n textTransform: 'none',\n textIndent: '0px',\n textShadow: 'none',\n textDecoration: 'none',\n boxSizing: 'border-box',\n },\n label: {\n margin: '0 4px',\n verticalAlign: 'middle',\n display: 'inline-block',\n flexGrow: '1',\n textOverflow: 'ellipsis',\n whiteSpace: 'nowrap',\n overflow: 'hidden',\n },\n secondaryText: {\n color: theme.palette.neutralSecondary,\n paddingLeft: '20px',\n textAlign: 'right',\n },\n icon: {\n display: 'inline-block',\n minHeight: '1px',\n maxHeight: CONTEXTUAL_MENU_ITEM_HEIGHT,\n fontSize: IconFontSizes.medium,\n width: IconFontSizes.medium,\n margin: '0 4px',\n verticalAlign: 'middle',\n flexShrink: '0',\n selectors: (_d = {},\n _d[MediumScreenSelector] = {\n fontSize: IconFontSizes.large,\n width: IconFontSizes.large,\n },\n _d),\n },\n iconColor: {\n color: semanticColors.menuIcon,\n },\n iconDisabled: {\n color: semanticColors.disabledBodyText,\n },\n checkmarkIcon: {\n color: semanticColors.bodySubtext,\n },\n subMenuIcon: {\n height: CONTEXTUAL_MENU_ITEM_HEIGHT,\n lineHeight: CONTEXTUAL_MENU_ITEM_HEIGHT,\n color: palette.neutralSecondary,\n textAlign: 'center',\n display: 'inline-block',\n verticalAlign: 'middle',\n flexShrink: '0',\n fontSize: IconFontSizes.small, // 12px\n selectors: (_e = {\n ':hover': {\n color: palette.neutralPrimary,\n },\n ':active': {\n color: palette.neutralPrimary,\n }\n },\n _e[MediumScreenSelector] = {\n fontSize: IconFontSizes.medium, // 16px\n },\n _e),\n },\n splitButtonFlexContainer: [\n getFocusStyle(theme),\n {\n display: 'flex',\n height: CONTEXTUAL_MENU_ITEM_HEIGHT,\n flexWrap: 'nowrap',\n justifyContent: 'center',\n alignItems: 'flex-start',\n },\n ],\n };\n return concatStyleSets(menuItemStyles);\n});\n//# sourceMappingURL=ContextualMenu.cnstyles.js.map","import { getGlobalClassNames, FontWeights } from '../../Styling';\nimport { CONTEXTUAL_MENU_ITEM_HEIGHT } from './ContextualMenu.cnstyles';\nvar GlobalClassNames = {\n root: 'ms-ContextualMenu',\n container: 'ms-ContextualMenu-container',\n list: 'ms-ContextualMenu-list',\n header: 'ms-ContextualMenu-header',\n title: 'ms-ContextualMenu-title',\n isopen: 'is-open',\n};\nexport var getStyles = function (props) {\n var className = props.className, theme = props.theme;\n var classNames = getGlobalClassNames(GlobalClassNames, theme);\n var fonts = theme.fonts, semanticColors = theme.semanticColors, effects = theme.effects;\n return {\n root: [\n theme.fonts.medium,\n classNames.root,\n classNames.isopen,\n {\n backgroundColor: semanticColors.menuBackground,\n minWidth: '180px',\n },\n className,\n ],\n container: [\n classNames.container,\n {\n selectors: {\n ':focus': { outline: 0 },\n },\n },\n ],\n list: [\n classNames.list,\n classNames.isopen,\n {\n listStyleType: 'none',\n margin: '0',\n padding: '0',\n },\n ],\n header: [\n classNames.header,\n fonts.small,\n {\n fontWeight: FontWeights.semibold,\n color: semanticColors.menuHeader,\n background: 'none',\n backgroundColor: 'transparent',\n border: 'none',\n height: CONTEXTUAL_MENU_ITEM_HEIGHT,\n lineHeight: CONTEXTUAL_MENU_ITEM_HEIGHT,\n cursor: 'default',\n padding: '0px 6px',\n userSelect: 'none',\n textAlign: 'left',\n },\n ],\n title: [\n classNames.title,\n {\n fontSize: fonts.mediumPlus.fontSize,\n paddingRight: '14px',\n paddingLeft: '14px',\n paddingBottom: '5px',\n paddingTop: '5px',\n backgroundColor: semanticColors.menuItemBackgroundPressed,\n },\n ],\n subComponentStyles: {\n callout: {\n root: {\n boxShadow: effects.elevation8,\n },\n },\n menuItem: {},\n },\n };\n};\n//# sourceMappingURL=ContextualMenu.styles.js.map","import { __assign } from \"tslib\";\nimport * as React from 'react';\nimport { styled, composeRenderFunction } from '../../Utilities';\nimport { ContextualMenuBase } from './ContextualMenu.base';\nimport { getStyles } from './ContextualMenu.styles';\nfunction onRenderSubMenu(subMenuProps) {\n return React.createElement(LocalContextualMenu, __assign({}, subMenuProps));\n}\n// This is to prevent cyclic import with ContextualMenu.base.tsx.\nvar LocalContextualMenu = styled(ContextualMenuBase, getStyles, function (props) { return ({\n onRenderSubMenu: props.onRenderSubMenu\n ? composeRenderFunction(props.onRenderSubMenu, onRenderSubMenu)\n : onRenderSubMenu,\n}); }, { scope: 'ContextualMenu' });\n/**\n * ContextualMenu description\n */\nexport var ContextualMenu = LocalContextualMenu;\nContextualMenu.displayName = 'ContextualMenu';\n//# sourceMappingURL=ContextualMenu.js.map","export { DirectionalHint } from '../../common/DirectionalHint';\n/**\n * {@docCategory ContextualMenu}\n */\nexport var ContextualMenuItemType;\n(function (ContextualMenuItemType) {\n ContextualMenuItemType[ContextualMenuItemType[\"Normal\"] = 0] = \"Normal\";\n ContextualMenuItemType[ContextualMenuItemType[\"Divider\"] = 1] = \"Divider\";\n ContextualMenuItemType[ContextualMenuItemType[\"Header\"] = 2] = \"Header\";\n ContextualMenuItemType[ContextualMenuItemType[\"Section\"] = 3] = \"Section\";\n})(ContextualMenuItemType || (ContextualMenuItemType = {}));\n//# sourceMappingURL=ContextualMenu.types.js.map","import { __assign, __extends } from \"tslib\";\nimport * as React from 'react';\nimport { hasSubmenu, getIsChecked } from '../../utilities/contextualMenu/index';\nimport { getRTL, initializeComponentRef } from '../../Utilities';\nimport { Icon } from '../../Icon';\nvar defaultIconRenderer = function (props) {\n var item = props.item, classNames = props.classNames;\n var iconProps = item.iconProps;\n return React.createElement(Icon, __assign({}, iconProps, { className: classNames.icon }));\n};\nvar renderItemIcon = function (props) {\n var item = props.item, hasIcons = props.hasIcons;\n if (!hasIcons) {\n return null;\n }\n if (item.onRenderIcon) {\n return item.onRenderIcon(props, defaultIconRenderer);\n }\n return defaultIconRenderer(props);\n};\nvar renderCheckMarkIcon = function (_a) {\n var onCheckmarkClick = _a.onCheckmarkClick, item = _a.item, classNames = _a.classNames;\n var isItemChecked = getIsChecked(item);\n if (onCheckmarkClick) {\n // Ensures that the item is passed as the first argument to the checkmark click callback.\n var onClick = function (e) { return onCheckmarkClick(item, e); };\n return (React.createElement(Icon, { iconName: item.canCheck !== false && isItemChecked ? 'CheckMark' : '', className: classNames.checkmarkIcon, \n // eslint-disable-next-line react/jsx-no-bind\n onClick: onClick }));\n }\n return null;\n};\nvar renderItemName = function (_a) {\n var item = _a.item, classNames = _a.classNames;\n /* eslint-disable @typescript-eslint/no-deprecated */\n if (item.text || item.name) {\n return React.createElement(\"span\", { className: classNames.label }, item.text || item.name);\n }\n /* eslint-enable @typescript-eslint/no-deprecated */\n return null;\n};\nvar renderSecondaryText = function (_a) {\n var item = _a.item, classNames = _a.classNames;\n if (item.secondaryText) {\n return React.createElement(\"span\", { className: classNames.secondaryText }, item.secondaryText);\n }\n return null;\n};\nvar renderSubMenuIcon = function (_a) {\n var item = _a.item, classNames = _a.classNames, theme = _a.theme;\n if (hasSubmenu(item)) {\n return (React.createElement(Icon, __assign({ iconName: getRTL(theme) ? 'ChevronLeft' : 'ChevronRight' }, item.submenuIconProps, { className: classNames.subMenuIcon })));\n }\n return null;\n};\nvar ContextualMenuItemBase = /** @class */ (function (_super) {\n __extends(ContextualMenuItemBase, _super);\n function ContextualMenuItemBase(props) {\n var _this = _super.call(this, props) || this;\n _this.openSubMenu = function () {\n var _a = _this.props, item = _a.item, openSubMenu = _a.openSubMenu, getSubmenuTarget = _a.getSubmenuTarget;\n if (getSubmenuTarget) {\n var submenuTarget = getSubmenuTarget();\n if (hasSubmenu(item) && openSubMenu && submenuTarget) {\n openSubMenu(item, submenuTarget);\n }\n }\n };\n _this.dismissSubMenu = function () {\n var _a = _this.props, item = _a.item, dismissSubMenu = _a.dismissSubMenu;\n if (hasSubmenu(item) && dismissSubMenu) {\n dismissSubMenu();\n }\n };\n _this.dismissMenu = function (dismissAll) {\n var dismissMenu = _this.props.dismissMenu;\n if (dismissMenu) {\n dismissMenu(undefined /* ev */, dismissAll);\n }\n };\n initializeComponentRef(_this);\n return _this;\n }\n ContextualMenuItemBase.prototype.render = function () {\n var _a = this.props, item = _a.item, classNames = _a.classNames;\n var renderContent = item.onRenderContent || this._renderLayout;\n return (React.createElement(\"div\", { className: item.split ? classNames.linkContentMenu : classNames.linkContent }, renderContent(this.props, {\n renderCheckMarkIcon: renderCheckMarkIcon,\n renderItemIcon: renderItemIcon,\n renderItemName: renderItemName,\n renderSecondaryText: renderSecondaryText,\n renderSubMenuIcon: renderSubMenuIcon,\n })));\n };\n ContextualMenuItemBase.prototype._renderLayout = function (props, defaultRenders) {\n return (React.createElement(React.Fragment, null,\n defaultRenders.renderCheckMarkIcon(props),\n defaultRenders.renderItemIcon(props),\n defaultRenders.renderItemName(props),\n defaultRenders.renderSecondaryText(props),\n defaultRenders.renderSubMenuIcon(props)));\n };\n return ContextualMenuItemBase;\n}(React.Component));\nexport { ContextualMenuItemBase };\n//# sourceMappingURL=ContextualMenuItem.base.js.map","import { styled } from '../../Utilities';\nimport { ContextualMenuItemBase } from './ContextualMenuItem.base';\nimport { getItemStyles } from './ContextualMenu.classNames';\n/**\n * ContextualMenuItem description\n */\nexport var ContextualMenuItem = styled(ContextualMenuItemBase, getItemStyles, undefined, { scope: 'ContextualMenuItem' });\n//# sourceMappingURL=ContextualMenuItem.js.map","import { __assign, __extends, __rest } from \"tslib\";\nimport * as React from 'react';\nimport { Icon, FontIcon } from '../../Icon';\nimport { initializeComponentRef, EventGroup, Async, classNamesFunction, composeRenderFunction } from '../../Utilities';\nimport { ColumnActionsMode } from './DetailsList.types';\nimport { DEFAULT_CELL_STYLE_PROPS } from './DetailsRow.styles';\nvar MOUSEDOWN_PRIMARY_BUTTON = 0; // for mouse down event we are using ev.button property, 0 means left button\nvar getClassNames = classNamesFunction();\nvar TRANSITION_DURATION_DRAG = 200; // ms\nvar TRANSITION_DURATION_DROP = 1500; // ms\nvar CLASSNAME_ADD_INTERVAL = 20; // ms\nvar defaultOnRenderHeader = function (classNames) {\n return function (props) {\n if (!props) {\n return null;\n }\n if (props.column.isIconOnly) {\n return React.createElement(\"span\", { className: classNames.accessibleLabel }, props.column.name);\n }\n return React.createElement(React.Fragment, null, props.column.name);\n };\n};\n/**\n * Component for rendering columns in a `DetailsList`.\n *\n * {@docCategory DetailsList}\n */\nvar DetailsColumnBase = /** @class */ (function (_super) {\n __extends(DetailsColumnBase, _super);\n function DetailsColumnBase(props) {\n var _this = _super.call(this, props) || this;\n _this._root = React.createRef();\n _this._tooltipRef = React.createRef();\n _this._onRenderFilterIcon = function (classNames) {\n return function (props) {\n var columnProps = props.columnProps, iconProps = __rest(props, [\"columnProps\"]);\n var IconComponent = (columnProps === null || columnProps === void 0 ? void 0 : columnProps.useFastIcons) ? FontIcon : Icon;\n return React.createElement(IconComponent, __assign({}, iconProps));\n };\n };\n _this._onRenderColumnHeaderTooltip = function (tooltipHostProps) {\n return React.createElement(\"span\", { className: tooltipHostProps.hostClassName }, tooltipHostProps.children);\n };\n _this._onColumnClick = function (ev) {\n var _a = _this.props, onColumnClick = _a.onColumnClick, column = _a.column;\n if (column.columnActionsMode === ColumnActionsMode.disabled) {\n return;\n }\n if (column.onColumnClick) {\n column.onColumnClick(ev, column);\n }\n if (onColumnClick) {\n onColumnClick(ev, column);\n }\n };\n _this._onColumnKeyDown = function (ev) {\n var _a = _this.props, onColumnKeyDown = _a.onColumnKeyDown, column = _a.column;\n if (column.onColumnKeyDown) {\n column.onColumnKeyDown(ev, column);\n }\n if (onColumnKeyDown) {\n onColumnKeyDown(ev, column);\n }\n };\n _this._onColumnBlur = function () {\n _this._tooltipRef.current && _this._tooltipRef.current.dismiss();\n };\n _this._onColumnFocus = function () {\n _this._tooltipRef.current && _this._tooltipRef.current.show();\n };\n _this._onDragStart = function (item, itemIndex, selectedItems, event) {\n var classNames = _this._classNames;\n if (itemIndex) {\n _this._updateHeaderDragInfo(itemIndex);\n _this._root.current.classList.add(classNames.borderWhileDragging);\n _this._async.setTimeout(function () {\n if (_this._root.current) {\n _this._root.current.classList.add(classNames.noBorderWhileDragging);\n }\n }, CLASSNAME_ADD_INTERVAL);\n }\n };\n _this._onDragEnd = function (item, event) {\n var classNames = _this._classNames;\n if (event) {\n _this._updateHeaderDragInfo(-1, event);\n }\n _this._root.current.classList.remove(classNames.borderWhileDragging);\n _this._root.current.classList.remove(classNames.noBorderWhileDragging);\n };\n _this._updateHeaderDragInfo = function (itemIndex, event) {\n /* eslint-disable @typescript-eslint/no-deprecated */\n if (_this.props.setDraggedItemIndex) {\n _this.props.setDraggedItemIndex(itemIndex);\n }\n /* eslint-enable @typescript-eslint/no-deprecated */\n if (_this.props.updateDragInfo) {\n _this.props.updateDragInfo({ itemIndex: itemIndex }, event);\n }\n };\n _this._onColumnContextMenu = function (ev) {\n var _a = _this.props, onColumnContextMenu = _a.onColumnContextMenu, column = _a.column;\n if (column.onColumnContextMenu) {\n column.onColumnContextMenu(column, ev);\n ev.preventDefault();\n }\n if (onColumnContextMenu) {\n onColumnContextMenu(column, ev);\n ev.preventDefault();\n }\n };\n _this._onRootMouseDown = function (ev) {\n var isDraggable = _this.props.isDraggable;\n // Ignore anything except the primary button.\n if (isDraggable && ev.button === MOUSEDOWN_PRIMARY_BUTTON) {\n ev.stopPropagation();\n }\n };\n initializeComponentRef(_this);\n _this._async = new Async(_this);\n _this._events = new EventGroup(_this);\n return _this;\n }\n DetailsColumnBase.prototype.render = function () {\n var _a = this.props, column = _a.column, parentId = _a.parentId, isDraggable = _a.isDraggable, styles = _a.styles, theme = _a.theme, _b = _a.cellStyleProps, cellStyleProps = _b === void 0 ? DEFAULT_CELL_STYLE_PROPS : _b, _c = _a.useFastIcons, useFastIcons = _c === void 0 ? true : _c;\n var _d = this.props.onRenderColumnHeaderTooltip, onRenderColumnHeaderTooltip = _d === void 0 ? this._onRenderColumnHeaderTooltip : _d;\n this._classNames = getClassNames(styles, {\n theme: theme,\n headerClassName: column.headerClassName,\n iconClassName: column.iconClassName,\n isActionable: column.columnActionsMode !== ColumnActionsMode.disabled,\n isEmpty: !column.name,\n isIconVisible: column.isSorted || column.isGrouped || column.isFiltered,\n isPadded: column.isPadded,\n isIconOnly: column.isIconOnly,\n cellStyleProps: cellStyleProps,\n transitionDurationDrag: TRANSITION_DURATION_DRAG,\n transitionDurationDrop: TRANSITION_DURATION_DROP,\n });\n var classNames = this._classNames;\n var IconComponent = useFastIcons ? FontIcon : Icon;\n var onRenderFilterIcon = column.onRenderFilterIcon\n ? composeRenderFunction(column.onRenderFilterIcon, this._onRenderFilterIcon(this._classNames))\n : this._onRenderFilterIcon(this._classNames);\n var onRenderHeader = column.onRenderHeader\n ? composeRenderFunction(column.onRenderHeader, defaultOnRenderHeader(this._classNames))\n : defaultOnRenderHeader(this._classNames);\n var hasInnerButton = column.columnActionsMode !== ColumnActionsMode.disabled &&\n (column.onColumnClick !== undefined || this.props.onColumnClick !== undefined);\n // use aria-describedby to point to the tooltip if the tooltip is not using the ariaLabel string\n var shouldAssociateTooltip = this.props.onRenderColumnHeaderTooltip\n ? !column.ariaLabel\n : this._hasAccessibleDescription();\n var accNameDescription = {\n 'aria-label': column.ariaLabel ? column.ariaLabel : column.isIconOnly ? column.name : undefined,\n 'aria-labelledby': column.ariaLabel || column.isIconOnly ? undefined : \"\".concat(parentId, \"-\").concat(column.key, \"-name\"),\n 'aria-describedby': shouldAssociateTooltip ? \"\".concat(parentId, \"-\").concat(column.key, \"-tooltip\") : undefined,\n };\n return (React.createElement(React.Fragment, null,\n React.createElement(\"div\", __assign({ key: column.key, ref: this._root, role: 'columnheader' }, (!hasInnerButton && accNameDescription), { \"aria-sort\": column.isSorted ? (column.isSortedDescending ? 'descending' : 'ascending') : 'none', \"data-is-focusable\": !hasInnerButton && column.columnActionsMode !== ColumnActionsMode.disabled ? 'true' : undefined, className: classNames.root, \"data-is-draggable\": isDraggable, draggable: isDraggable, style: {\n width: (column.calculatedWidth || 0) +\n cellStyleProps.cellLeftPadding +\n cellStyleProps.cellRightPadding +\n (column.isPadded ? cellStyleProps.cellExtraRightPadding : 0),\n }, \"data-automationid\": 'ColumnsHeaderColumn', \"data-item-key\": column.key, onBlur: this._onColumnBlur, onFocus: this._onColumnFocus }),\n isDraggable && (React.createElement(IconComponent, { iconName: \"GripperBarVertical\", className: classNames.gripperBarVerticalStyle })),\n onRenderColumnHeaderTooltip({\n hostClassName: classNames.cellTooltip,\n id: \"\".concat(parentId, \"-\").concat(column.key, \"-tooltip\"),\n setAriaDescribedBy: false,\n column: column,\n componentRef: this._tooltipRef,\n content: column.columnActionsMode !== ColumnActionsMode.disabled ? column.ariaLabel : '',\n children: (React.createElement(\"span\", __assign({ id: \"\".concat(parentId, \"-\").concat(column.key), className: classNames.cellTitle, \"data-is-focusable\": hasInnerButton && column.columnActionsMode !== ColumnActionsMode.disabled ? 'true' : undefined, role: hasInnerButton ? 'button' : undefined }, (hasInnerButton && accNameDescription), { onContextMenu: this._onColumnContextMenu, onClick: this._onColumnClick, onKeyDown: this._onColumnKeyDown, \"aria-haspopup\": column.columnActionsMode === ColumnActionsMode.hasDropdown ? 'menu' : undefined, \"aria-expanded\": column.columnActionsMode === ColumnActionsMode.hasDropdown ? !!column.isMenuOpen : undefined }),\n React.createElement(\"span\", { id: \"\".concat(parentId, \"-\").concat(column.key, \"-name\"), className: classNames.cellName },\n (column.iconName || column.iconClassName) && (React.createElement(IconComponent, { className: classNames.iconClassName, iconName: column.iconName })),\n onRenderHeader(this.props)),\n column.isFiltered && React.createElement(IconComponent, { className: classNames.nearIcon, iconName: \"Filter\" }),\n (column.isSorted || column.showSortIconWhenUnsorted) && (React.createElement(IconComponent, { className: classNames.sortIcon, iconName: column.isSorted ? (column.isSortedDescending ? 'SortDown' : 'SortUp') : 'Sort' })),\n column.isGrouped && React.createElement(IconComponent, { className: classNames.nearIcon, iconName: \"GroupedDescending\" }),\n column.columnActionsMode === ColumnActionsMode.hasDropdown &&\n !column.isIconOnly &&\n onRenderFilterIcon({\n 'aria-hidden': true,\n columnProps: this.props,\n className: classNames.filterChevron,\n iconName: 'ChevronDown',\n }))),\n }, this._onRenderColumnHeaderTooltip)),\n !this.props.onRenderColumnHeaderTooltip ? this._renderAccessibleDescription() : null));\n };\n DetailsColumnBase.prototype.componentDidMount = function () {\n var _this = this;\n if (this.props.dragDropHelper && this.props.isDraggable) {\n this._addDragDropHandling();\n }\n var classNames = this._classNames;\n if (this.props.isDropped) {\n if (this._root.current) {\n this._root.current.classList.add(classNames.borderAfterDropping);\n this._async.setTimeout(function () {\n if (_this._root.current) {\n _this._root.current.classList.add(classNames.noBorderAfterDropping);\n }\n }, CLASSNAME_ADD_INTERVAL);\n }\n this._async.setTimeout(function () {\n if (_this._root.current) {\n _this._root.current.classList.remove(classNames.borderAfterDropping);\n _this._root.current.classList.remove(classNames.noBorderAfterDropping);\n }\n }, TRANSITION_DURATION_DROP + CLASSNAME_ADD_INTERVAL);\n }\n };\n DetailsColumnBase.prototype.componentWillUnmount = function () {\n if (this._dragDropSubscription) {\n this._dragDropSubscription.dispose();\n delete this._dragDropSubscription;\n }\n this._async.dispose();\n this._events.dispose();\n };\n DetailsColumnBase.prototype.componentDidUpdate = function () {\n if (!this._dragDropSubscription && this.props.dragDropHelper && this.props.isDraggable) {\n this._addDragDropHandling();\n }\n if (this._dragDropSubscription && !this.props.isDraggable) {\n this._dragDropSubscription.dispose();\n this._events.off(this._root.current, 'mousedown');\n delete this._dragDropSubscription;\n }\n };\n DetailsColumnBase.prototype._getColumnDragDropOptions = function () {\n var _this = this;\n var columnIndex = this.props.columnIndex;\n var options = {\n selectionIndex: columnIndex,\n context: { data: columnIndex, index: columnIndex },\n canDrag: function () { return _this.props.isDraggable; },\n canDrop: function () { return false; },\n onDragStart: this._onDragStart,\n updateDropState: function () { return undefined; },\n onDrop: function () { return undefined; },\n onDragEnd: this._onDragEnd,\n };\n return options;\n };\n DetailsColumnBase.prototype._hasAccessibleDescription = function () {\n var column = this.props.column;\n return !!(column.filterAriaLabel ||\n column.sortAscendingAriaLabel ||\n column.sortDescendingAriaLabel ||\n column.groupAriaLabel ||\n column.sortableAriaLabel);\n };\n DetailsColumnBase.prototype._renderAccessibleDescription = function () {\n var _a = this.props, column = _a.column, parentId = _a.parentId;\n var classNames = this._classNames;\n return this._hasAccessibleDescription() && !this.props.onRenderColumnHeaderTooltip ? (React.createElement(\"label\", { key: \"\".concat(column.key, \"_label\"), id: \"\".concat(parentId, \"-\").concat(column.key, \"-tooltip\"), className: classNames.accessibleLabel, hidden: true },\n (column.isFiltered && column.filterAriaLabel) || null,\n ((column.isSorted || column.showSortIconWhenUnsorted) &&\n (column.isSorted\n ? column.isSortedDescending\n ? column.sortDescendingAriaLabel\n : column.sortAscendingAriaLabel\n : column.sortableAriaLabel)) ||\n null,\n (column.isGrouped && column.groupAriaLabel) || null)) : null;\n };\n DetailsColumnBase.prototype._addDragDropHandling = function () {\n this._dragDropSubscription = this.props.dragDropHelper.subscribe(this._root.current, this._events, this._getColumnDragDropOptions());\n // We need to use native on this to prevent MarqueeSelection from handling the event before us.\n this._events.on(this._root.current, 'mousedown', this._onRootMouseDown);\n };\n return DetailsColumnBase;\n}(React.Component));\nexport { DetailsColumnBase };\n//# sourceMappingURL=DetailsColumn.base.js.map","import { styled } from '../../Utilities';\nimport { DetailsColumnBase } from './DetailsColumn.base';\nimport { getDetailsColumnStyles } from './DetailsColumn.styles';\nexport var DetailsColumn = styled(DetailsColumnBase, getDetailsColumnStyles, undefined, { scope: 'DetailsColumn' });\n//# sourceMappingURL=DetailsColumn.js.map","import { __assign } from \"tslib\";\nimport { getFocusStyle, getGlobalClassNames, hiddenContentStyle, FontWeights } from '../../Styling';\nimport { DEFAULT_CELL_STYLE_PROPS } from './DetailsRow.styles';\nimport { getCellStyles } from './DetailsHeader.styles';\nvar GlobalClassNames = {\n isActionable: 'is-actionable',\n cellIsCheck: 'ms-DetailsHeader-cellIsCheck',\n collapseButton: 'ms-DetailsHeader-collapseButton',\n isCollapsed: 'is-collapsed',\n isAllSelected: 'is-allSelected',\n isSelectAllHidden: 'is-selectAllHidden',\n isResizingColumn: 'is-resizingColumn',\n isEmpty: 'is-empty',\n isIconVisible: 'is-icon-visible',\n cellSizer: 'ms-DetailsHeader-cellSizer',\n isResizing: 'is-resizing',\n dropHintCircleStyle: 'ms-DetailsHeader-dropHintCircleStyle',\n dropHintLineStyle: 'ms-DetailsHeader-dropHintLineStyle',\n cellTitle: 'ms-DetailsHeader-cellTitle',\n cellName: 'ms-DetailsHeader-cellName',\n filterChevron: 'ms-DetailsHeader-filterChevron',\n gripperBarVerticalStyle: 'ms-DetailsColumn-gripperBar',\n nearIcon: 'ms-DetailsColumn-nearIcon',\n};\nexport var getDetailsColumnStyles = function (props) {\n var _a;\n var theme = props.theme, headerClassName = props.headerClassName, iconClassName = props.iconClassName, isActionable = props.isActionable, isEmpty = props.isEmpty, isIconVisible = props.isIconVisible, isPadded = props.isPadded, isIconOnly = props.isIconOnly, _b = props.cellStyleProps, cellStyleProps = _b === void 0 ? DEFAULT_CELL_STYLE_PROPS : _b, transitionDurationDrag = props.transitionDurationDrag, transitionDurationDrop = props.transitionDurationDrop;\n var semanticColors = theme.semanticColors, palette = theme.palette, fonts = theme.fonts;\n var classNames = getGlobalClassNames(GlobalClassNames, theme);\n var colors = {\n iconForegroundColor: semanticColors.bodySubtext,\n headerForegroundColor: semanticColors.bodyText,\n headerBackgroundColor: semanticColors.bodyBackground,\n dropdownChevronForegroundColor: palette.neutralSecondary,\n resizerColor: palette.neutralTertiaryAlt,\n };\n var nearIconStyle = {\n color: colors.iconForegroundColor,\n opacity: 1,\n paddingLeft: 8,\n };\n var borderWhileDragging = {\n outline: \"1px solid \".concat(palette.themePrimary),\n };\n var borderAfterDragOrDrop = {\n outlineColor: 'transparent',\n };\n return {\n root: [\n getCellStyles(props),\n fonts.small,\n isActionable && [\n classNames.isActionable,\n {\n selectors: {\n ':hover': {\n color: semanticColors.bodyText,\n background: semanticColors.listHeaderBackgroundHovered,\n },\n ':active': {\n background: semanticColors.listHeaderBackgroundPressed,\n },\n },\n },\n ],\n isEmpty && [\n classNames.isEmpty,\n {\n textOverflow: 'clip',\n },\n ],\n isIconVisible && classNames.isIconVisible,\n isPadded && {\n paddingRight: cellStyleProps.cellExtraRightPadding + cellStyleProps.cellRightPadding,\n },\n {\n selectors: {\n ':hover i[data-icon-name=\"GripperBarVertical\"]': {\n display: 'block',\n },\n },\n },\n headerClassName,\n ],\n gripperBarVerticalStyle: {\n display: 'none',\n position: 'absolute',\n textAlign: 'left',\n color: palette.neutralTertiary,\n left: 1,\n },\n nearIcon: [classNames.nearIcon, nearIconStyle],\n sortIcon: [\n nearIconStyle,\n {\n paddingLeft: 4,\n position: 'relative',\n top: 1,\n },\n ],\n iconClassName: [\n {\n color: colors.iconForegroundColor,\n opacity: 1,\n },\n iconClassName,\n ],\n filterChevron: [\n classNames.filterChevron,\n {\n color: colors.dropdownChevronForegroundColor,\n paddingLeft: 6,\n verticalAlign: 'middle',\n fontSize: fonts.small.fontSize,\n },\n ],\n cellTitle: [\n classNames.cellTitle,\n getFocusStyle(theme),\n __assign({ display: 'flex', flexDirection: 'row', justifyContent: 'flex-start', alignItems: 'stretch', boxSizing: 'border-box', overflow: 'hidden', padding: \"0 \".concat(cellStyleProps.cellRightPadding, \"px 0 \").concat(cellStyleProps.cellLeftPadding, \"px\") }, (isIconOnly\n ? {\n alignContent: 'flex-end',\n maxHeight: '100%',\n flexWrap: 'wrap-reverse',\n }\n : {})),\n ],\n cellName: [\n classNames.cellName,\n {\n flex: '0 1 auto',\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n fontWeight: FontWeights.semibold,\n fontSize: fonts.medium.fontSize,\n },\n isIconOnly && {\n selectors: (_a = {},\n _a[\".\".concat(classNames.nearIcon)] = {\n paddingLeft: 0,\n },\n _a),\n },\n ],\n cellTooltip: {\n display: 'block',\n position: 'absolute',\n top: 0,\n left: 0,\n bottom: 0,\n right: 0,\n },\n accessibleLabel: hiddenContentStyle,\n borderWhileDragging: borderWhileDragging,\n noBorderWhileDragging: [borderAfterDragOrDrop, { transition: \"outline \".concat(transitionDurationDrag, \"ms ease\") }],\n borderAfterDropping: borderWhileDragging,\n noBorderAfterDropping: [borderAfterDragOrDrop, { transition: \"outline \".concat(transitionDurationDrop, \"ms ease\") }],\n };\n};\n//# sourceMappingURL=DetailsColumn.styles.js.map","import { __assign, __extends } from \"tslib\";\nimport * as React from 'react';\nimport { initializeComponentRef, EventGroup, css, getRTL, getId, KeyCodes, classNamesFunction } from '../../Utilities';\nimport { ColumnDragEndLocation, CheckboxVisibility } from './DetailsList.types';\nimport { FocusZone, FocusZoneDirection } from '../../FocusZone';\nimport { Icon, FontIcon } from '../../Icon';\nimport { Layer } from '../../Layer';\nimport { GroupSpacer } from '../GroupedList/GroupSpacer';\nimport { CollapseAllVisibility } from '../../GroupedList';\nimport { DetailsRowCheck } from './DetailsRowCheck';\nimport { SelectionMode, SELECTION_CHANGE } from '../../Selection';\nimport { DragDropHelper } from '../../DragDrop';\nimport { DetailsColumn } from '../../components/DetailsList/DetailsColumn';\nimport { SelectAllVisibility } from './DetailsHeader.types';\nvar getClassNames = classNamesFunction();\nvar MOUSEDOWN_PRIMARY_BUTTON = 0; // for mouse down event we are using ev.button property, 0 means left button\nvar MOUSEMOVE_PRIMARY_BUTTON = 1; // for mouse move event we are using ev.buttons property, 1 means left button\nvar NO_COLUMNS = [];\nvar DetailsHeaderBase = /** @class */ (function (_super) {\n __extends(DetailsHeaderBase, _super);\n function DetailsHeaderBase(props) {\n var _this = _super.call(this, props) || this;\n _this._rootElement = React.createRef();\n _this._rootComponent = React.createRef();\n _this._draggedColumnIndex = -1;\n _this._dropHintDetails = {};\n _this._updateDroppingState = function (newValue, event) {\n if (_this._draggedColumnIndex >= 0 && event.type !== 'drop' && !newValue) {\n _this._resetDropHints();\n }\n };\n _this._onDragOver = function (item, event) {\n if (_this._draggedColumnIndex >= 0) {\n event.stopPropagation();\n _this._computeDropHintToBeShown(event.clientX);\n }\n };\n _this._onDrop = function (item, event) {\n // Safe to assume this is defined since we're handling a drop event\n var columnReorderProps = _this._getColumnReorderProps();\n // Target index will not get changed if draggeditem is after target item.\n if (_this._draggedColumnIndex >= 0 && event) {\n var targetIndex = _this._draggedColumnIndex > _this._currentDropHintIndex\n ? _this._currentDropHintIndex\n : _this._currentDropHintIndex - 1;\n var isValidDrop = _this._isValidCurrentDropHintIndex();\n event.stopPropagation();\n if (isValidDrop) {\n _this._onDropIndexInfo.sourceIndex = _this._draggedColumnIndex;\n _this._onDropIndexInfo.targetIndex = targetIndex;\n if (columnReorderProps.onColumnDrop) {\n var dragDropDetails = {\n draggedIndex: _this._draggedColumnIndex,\n targetIndex: targetIndex,\n };\n columnReorderProps.onColumnDrop(dragDropDetails);\n /* eslint-disable @typescript-eslint/no-deprecated */\n }\n else if (columnReorderProps.handleColumnReorder) {\n columnReorderProps.handleColumnReorder(_this._draggedColumnIndex, targetIndex);\n /* eslint-enable @typescript-eslint/no-deprecated */\n }\n }\n }\n _this._resetDropHints();\n _this._dropHintDetails = {};\n _this._draggedColumnIndex = -1;\n };\n _this._computeColumnIndexOffset = function (showCheckbox) {\n var hasGroupExpander = _this.props.groupNestingDepth && _this.props.groupNestingDepth > 0;\n var offset = 1;\n if (showCheckbox) {\n offset += 1;\n }\n if (hasGroupExpander) {\n offset += 1;\n }\n return offset;\n };\n _this._updateDragInfo = function (props, event) {\n // Safe to assume this is defined since we're handling a drag event\n var columnReorderProps = _this._getColumnReorderProps();\n var itemIndex = props.itemIndex;\n if (itemIndex >= 0) {\n // Column index is set based on the checkbox\n _this._draggedColumnIndex = itemIndex - _this._computeColumnIndexOffset(!_this._isCheckboxColumnHidden());\n _this._getDropHintPositions();\n if (columnReorderProps.onColumnDragStart) {\n columnReorderProps.onColumnDragStart(true);\n }\n }\n else if (event && _this._draggedColumnIndex >= 0) {\n _this._resetDropHints();\n _this._draggedColumnIndex = -1;\n _this._dropHintDetails = {};\n if (columnReorderProps.onColumnDragEnd) {\n var columnDragEndLocation = _this._isEventOnHeader(event);\n columnReorderProps.onColumnDragEnd({ dropLocation: columnDragEndLocation }, event);\n }\n }\n };\n _this._getDropHintPositions = function () {\n var _a = _this.props.columns, columns = _a === void 0 ? NO_COLUMNS : _a;\n // Safe to assume this is defined since we're handling a drag/drop event\n var columnReorderProps = _this._getColumnReorderProps();\n var prevX = 0;\n var prevMid = 0;\n var prevRef;\n var frozenColumnCountFromStart = columnReorderProps.frozenColumnCountFromStart || 0;\n var frozenColumnCountFromEnd = columnReorderProps.frozenColumnCountFromEnd || 0;\n for (var i = frozenColumnCountFromStart; i < columns.length - frozenColumnCountFromEnd + 1; i++) {\n if (_this._rootElement.current) {\n var dropHintElement = _this._rootElement.current.querySelectorAll('#columnDropHint_' + i)[0];\n if (dropHintElement) {\n if (i === frozenColumnCountFromStart) {\n prevX = dropHintElement.offsetLeft;\n prevMid = dropHintElement.offsetLeft;\n prevRef = dropHintElement;\n }\n else {\n var newMid = (dropHintElement.offsetLeft + prevX) / 2;\n _this._dropHintDetails[i - 1] = {\n originX: prevX,\n startX: prevMid,\n endX: newMid,\n dropHintElementRef: prevRef,\n };\n prevMid = newMid;\n prevRef = dropHintElement;\n prevX = dropHintElement.offsetLeft;\n if (i === columns.length - frozenColumnCountFromEnd) {\n _this._dropHintDetails[i] = {\n originX: prevX,\n startX: prevMid,\n endX: dropHintElement.offsetLeft,\n dropHintElementRef: prevRef,\n };\n }\n }\n }\n }\n }\n };\n /**\n * Based on the given cursor position, finds the nearest drop hint and updates the state to make it visible\n */\n _this._computeDropHintToBeShown = function (clientX) {\n var isRtl = getRTL(_this.props.theme);\n if (_this._rootElement.current) {\n var clientRect = _this._rootElement.current.getBoundingClientRect();\n var headerOriginX = clientRect.left;\n var eventXRelativePosition = clientX - headerOriginX;\n var currentDropHintIndex = _this._currentDropHintIndex;\n if (_this._isValidCurrentDropHintIndex()) {\n if (_liesBetween(isRtl, eventXRelativePosition, _this._dropHintDetails[currentDropHintIndex].startX, _this._dropHintDetails[currentDropHintIndex].endX)) {\n return;\n }\n }\n var _a = _this.props.columns, columns = _a === void 0 ? NO_COLUMNS : _a;\n // Safe to assume this is defined since we're handling a drag/drop event\n var columnReorderProps = _this._getColumnReorderProps();\n var frozenColumnCountFromStart = columnReorderProps.frozenColumnCountFromStart || 0;\n var frozenColumnCountFromEnd = columnReorderProps.frozenColumnCountFromEnd || 0;\n var currentIndex = frozenColumnCountFromStart;\n var lastValidColumn = columns.length - frozenColumnCountFromEnd;\n var indexToUpdate = -1;\n if (_isBefore(isRtl, eventXRelativePosition, _this._dropHintDetails[currentIndex].endX)) {\n indexToUpdate = currentIndex;\n }\n else if (_isAfter(isRtl, eventXRelativePosition, _this._dropHintDetails[lastValidColumn].startX)) {\n indexToUpdate = lastValidColumn;\n }\n else if (_this._isValidCurrentDropHintIndex()) {\n if (_this._dropHintDetails[currentDropHintIndex + 1] &&\n _liesBetween(isRtl, eventXRelativePosition, _this._dropHintDetails[currentDropHintIndex + 1].startX, _this._dropHintDetails[currentDropHintIndex + 1].endX)) {\n indexToUpdate = currentDropHintIndex + 1;\n }\n else if (_this._dropHintDetails[currentDropHintIndex - 1] &&\n _liesBetween(isRtl, eventXRelativePosition, _this._dropHintDetails[currentDropHintIndex - 1].startX, _this._dropHintDetails[currentDropHintIndex - 1].endX)) {\n indexToUpdate = currentDropHintIndex - 1;\n }\n }\n if (indexToUpdate === -1) {\n var startIndex = frozenColumnCountFromStart;\n var endIndex = lastValidColumn;\n while (startIndex < endIndex) {\n var middleIndex = Math.ceil((endIndex + startIndex) / 2);\n if (_liesBetween(isRtl, eventXRelativePosition, _this._dropHintDetails[middleIndex].startX, _this._dropHintDetails[middleIndex].endX)) {\n indexToUpdate = middleIndex;\n break;\n }\n else if (_isBefore(isRtl, eventXRelativePosition, _this._dropHintDetails[middleIndex].originX)) {\n endIndex = middleIndex;\n }\n else if (_isAfter(isRtl, eventXRelativePosition, _this._dropHintDetails[middleIndex].originX)) {\n startIndex = middleIndex;\n }\n }\n }\n if (indexToUpdate === _this._draggedColumnIndex || indexToUpdate === _this._draggedColumnIndex + 1) {\n if (_this._isValidCurrentDropHintIndex()) {\n _this._resetDropHints();\n }\n }\n else if (currentDropHintIndex !== indexToUpdate && indexToUpdate >= 0) {\n _this._resetDropHints();\n _this._updateDropHintElement(_this._dropHintDetails[indexToUpdate].dropHintElementRef, 'inline-block');\n _this._currentDropHintIndex = indexToUpdate;\n }\n }\n };\n _this._renderColumnSizer = function (_a) {\n var _b;\n var columnIndex = _a.columnIndex;\n var _c = _this.props.columns, columns = _c === void 0 ? NO_COLUMNS : _c;\n var column = columns[columnIndex];\n var columnResizeDetails = _this.state.columnResizeDetails;\n var classNames = _this._classNames;\n return column.isResizable ? (React.createElement(\"div\", { key: \"\".concat(column.key, \"_sizer\"), \"aria-hidden\": true, role: \"button\", \"data-is-focusable\": false, onClick: _stopPropagation, \"data-sizer-index\": columnIndex, onBlur: _this._onSizerBlur, className: css(classNames.cellSizer, columnIndex < columns.length - 1 ? classNames.cellSizerStart : classNames.cellSizerEnd, (_b = {},\n _b[classNames.cellIsResizing] = columnResizeDetails && columnResizeDetails.columnIndex === columnIndex,\n _b)), onDoubleClick: _this._onSizerDoubleClick.bind(_this, columnIndex) })) : null;\n };\n _this._onRenderColumnHeaderTooltip = function (tooltipHostProps) {\n return React.createElement(\"span\", { className: tooltipHostProps.hostClassName }, tooltipHostProps.children);\n };\n /**\n * Called when the select all toggle is clicked.\n */\n _this._onSelectAllClicked = function () {\n var selection = _this.props.selection;\n if (selection) {\n selection.toggleAllSelected();\n }\n };\n _this._onRootMouseDown = function (ev) {\n var columnIndexAttr = ev.target.getAttribute('data-sizer-index');\n var columnIndex = Number(columnIndexAttr);\n var _a = _this.props.columns, columns = _a === void 0 ? NO_COLUMNS : _a;\n if (columnIndexAttr === null || ev.button !== MOUSEDOWN_PRIMARY_BUTTON) {\n // Ignore anything except the primary button.\n return;\n }\n _this.setState({\n columnResizeDetails: {\n columnIndex: columnIndex,\n columnMinWidth: columns[columnIndex].calculatedWidth,\n originX: ev.clientX,\n },\n });\n ev.preventDefault();\n ev.stopPropagation();\n };\n _this._onRootMouseMove = function (ev) {\n var _a = _this.state, columnResizeDetails = _a.columnResizeDetails, isSizing = _a.isSizing;\n if (columnResizeDetails && !isSizing && ev.clientX !== columnResizeDetails.originX) {\n _this.setState({ isSizing: true });\n }\n };\n _this._onRootKeyDown = function (ev) {\n var _a = _this.state, columnResizeDetails = _a.columnResizeDetails, isSizing = _a.isSizing;\n var _b = _this.props, _c = _b.columns, columns = _c === void 0 ? NO_COLUMNS : _c, onColumnResized = _b.onColumnResized;\n var columnIndexAttr = ev.target.getAttribute('data-sizer-index');\n if (!columnIndexAttr || isSizing) {\n return;\n }\n var columnIndex = Number(columnIndexAttr);\n if (!columnResizeDetails) {\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n if (ev.which === KeyCodes.enter) {\n _this.setState({\n columnResizeDetails: {\n columnIndex: columnIndex,\n columnMinWidth: columns[columnIndex].calculatedWidth,\n },\n });\n ev.preventDefault();\n ev.stopPropagation();\n }\n }\n else {\n var increment = void 0;\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n if (ev.which === KeyCodes.enter) {\n _this.setState({\n columnResizeDetails: undefined,\n });\n ev.preventDefault();\n ev.stopPropagation();\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n }\n else if (ev.which === KeyCodes.left) {\n increment = getRTL(_this.props.theme) ? 1 : -1;\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n }\n else if (ev.which === KeyCodes.right) {\n increment = getRTL(_this.props.theme) ? -1 : 1;\n }\n if (increment) {\n if (!ev.shiftKey) {\n increment *= 10;\n }\n _this.setState({\n columnResizeDetails: __assign(__assign({}, columnResizeDetails), { columnMinWidth: columnResizeDetails.columnMinWidth + increment }),\n });\n if (onColumnResized) {\n onColumnResized(columns[columnIndex], columnResizeDetails.columnMinWidth + increment, columnIndex);\n }\n ev.preventDefault();\n ev.stopPropagation();\n }\n }\n };\n /**\n * mouse move event handler in the header\n * it will set isSizing state to true when user clicked on the sizer and move the mouse.\n *\n * @param ev - mouse move event\n */\n _this._onSizerMouseMove = function (ev) {\n var \n // use buttons property here since ev.button in some edge case is not upding well during the move.\n // but firefox doesn't support it, so we set the default value when it is not defined.\n buttons = ev.buttons;\n var _a = _this.props, onColumnIsSizingChanged = _a.onColumnIsSizingChanged, onColumnResized = _a.onColumnResized, _b = _a.columns, columns = _b === void 0 ? NO_COLUMNS : _b;\n var columnResizeDetails = _this.state.columnResizeDetails;\n if (buttons !== undefined && buttons !== MOUSEMOVE_PRIMARY_BUTTON) {\n // cancel mouse down event and return early when the primary button is not pressed\n _this._onSizerMouseUp(ev);\n return;\n }\n if (ev.clientX !== columnResizeDetails.originX) {\n if (onColumnIsSizingChanged) {\n onColumnIsSizingChanged(columns[columnResizeDetails.columnIndex], true);\n }\n }\n if (onColumnResized) {\n var movement = ev.clientX - columnResizeDetails.originX;\n if (getRTL(_this.props.theme)) {\n movement = -movement;\n }\n onColumnResized(columns[columnResizeDetails.columnIndex], columnResizeDetails.columnMinWidth + movement, columnResizeDetails.columnIndex);\n }\n };\n _this._onSizerBlur = function (ev) {\n var columnResizeDetails = _this.state.columnResizeDetails;\n if (columnResizeDetails) {\n _this.setState({\n columnResizeDetails: undefined,\n isSizing: false,\n });\n }\n };\n /**\n * mouse up event handler in the header\n * clear the resize related state.\n * This is to ensure we can catch double click event\n *\n * @param ev - mouse up event\n */\n _this._onSizerMouseUp = function (ev) {\n var _a = _this.props, _b = _a.columns, columns = _b === void 0 ? NO_COLUMNS : _b, onColumnIsSizingChanged = _a.onColumnIsSizingChanged;\n var columnResizeDetails = _this.state.columnResizeDetails;\n _this.setState({\n columnResizeDetails: undefined,\n isSizing: false,\n });\n if (onColumnIsSizingChanged) {\n onColumnIsSizingChanged(columns[columnResizeDetails.columnIndex], false);\n }\n };\n _this._onToggleCollapseAll = function () {\n var onToggleCollapseAll = _this.props.onToggleCollapseAll;\n var newCollapsed = !_this.state.isAllCollapsed;\n _this.setState({\n isAllCollapsed: newCollapsed,\n });\n if (onToggleCollapseAll) {\n onToggleCollapseAll(newCollapsed);\n }\n };\n initializeComponentRef(_this);\n _this._events = new EventGroup(_this);\n _this.state = {\n columnResizeDetails: undefined,\n isAllCollapsed: _this.props.isAllCollapsed,\n isAllSelected: !!_this.props.selection && _this.props.selection.isAllSelected(),\n };\n _this._onDropIndexInfo = {\n sourceIndex: -1,\n targetIndex: -1,\n };\n _this._id = getId('header');\n _this._currentDropHintIndex = -1;\n // The drag drop handler won't do any work until subscribe() is called,\n // so always set it up for convenience\n _this._dragDropHelper = new DragDropHelper({\n selection: {\n getSelection: function () {\n return;\n },\n },\n minimumPixelsForDrag: _this.props.minimumPixelsForDrag,\n });\n return _this;\n }\n DetailsHeaderBase.prototype.componentDidMount = function () {\n var selection = this.props.selection;\n this._events.on(selection, SELECTION_CHANGE, this._onSelectionChanged);\n // this._rootElement.current will be null in tests using react-test-renderer\n if (this._rootElement.current) {\n // We need to use native on this to prevent MarqueeSelection from handling the event before us.\n this._events.on(this._rootElement.current, 'mousedown', this._onRootMouseDown);\n this._events.on(this._rootElement.current, 'keydown', this._onRootKeyDown);\n if (this._getColumnReorderProps()) {\n this._subscriptionObject = this._dragDropHelper.subscribe(this._rootElement.current, this._events, this._getHeaderDragDropOptions());\n }\n }\n };\n DetailsHeaderBase.prototype.componentDidUpdate = function (prevProps) {\n if (this._getColumnReorderProps()) {\n if (!this._subscriptionObject && this._rootElement.current) {\n this._subscriptionObject = this._dragDropHelper.subscribe(this._rootElement.current, this._events, this._getHeaderDragDropOptions());\n }\n }\n else if (this._subscriptionObject) {\n this._subscriptionObject.dispose();\n delete this._subscriptionObject;\n }\n if (this.props !== prevProps && this._onDropIndexInfo.sourceIndex >= 0 && this._onDropIndexInfo.targetIndex >= 0) {\n var _a = prevProps.columns, previousColumns = _a === void 0 ? NO_COLUMNS : _a;\n var _b = this.props.columns, columns = _b === void 0 ? NO_COLUMNS : _b;\n if (previousColumns[this._onDropIndexInfo.sourceIndex].key === columns[this._onDropIndexInfo.targetIndex].key) {\n this._onDropIndexInfo = {\n sourceIndex: -1,\n targetIndex: -1,\n };\n }\n }\n if (this.props.isAllCollapsed !== prevProps.isAllCollapsed) {\n this.setState({ isAllCollapsed: this.props.isAllCollapsed });\n }\n };\n DetailsHeaderBase.prototype.componentWillUnmount = function () {\n if (this._subscriptionObject) {\n this._subscriptionObject.dispose();\n delete this._subscriptionObject;\n }\n this._dragDropHelper.dispose();\n this._events.dispose();\n };\n DetailsHeaderBase.prototype.render = function () {\n var _this = this;\n var _a = this.props, _b = _a.columns, columns = _b === void 0 ? NO_COLUMNS : _b, ariaLabel = _a.ariaLabel, ariaLabelForToggleAllGroupsButton = _a.ariaLabelForToggleAllGroupsButton, ariaLabelForSelectAllCheckbox = _a.ariaLabelForSelectAllCheckbox, selectAllVisibility = _a.selectAllVisibility, ariaLabelForSelectionColumn = _a.ariaLabelForSelectionColumn, indentWidth = _a.indentWidth, onColumnClick = _a.onColumnClick, onColumnContextMenu = _a.onColumnContextMenu, _c = _a.onRenderColumnHeaderTooltip, onRenderColumnHeaderTooltip = _c === void 0 ? this._onRenderColumnHeaderTooltip : _c, styles = _a.styles, selectionMode = _a.selectionMode, theme = _a.theme, onRenderDetailsCheckbox = _a.onRenderDetailsCheckbox, groupNestingDepth = _a.groupNestingDepth, useFastIcons = _a.useFastIcons, checkboxVisibility = _a.checkboxVisibility, className = _a.className;\n var _d = this.state, isAllSelected = _d.isAllSelected, columnResizeDetails = _d.columnResizeDetails, isSizing = _d.isSizing, isAllCollapsed = _d.isAllCollapsed;\n var showCheckbox = selectAllVisibility !== SelectAllVisibility.none;\n var isCheckboxHidden = selectAllVisibility === SelectAllVisibility.hidden;\n var isCheckboxAlwaysVisible = checkboxVisibility === CheckboxVisibility.always;\n var columnReorderProps = this._getColumnReorderProps();\n var frozenColumnCountFromStart = columnReorderProps && columnReorderProps.frozenColumnCountFromStart\n ? columnReorderProps.frozenColumnCountFromStart\n : 0;\n var frozenColumnCountFromEnd = columnReorderProps && columnReorderProps.frozenColumnCountFromEnd\n ? columnReorderProps.frozenColumnCountFromEnd\n : 0;\n this._classNames = getClassNames(styles, {\n theme: theme,\n isAllSelected: isAllSelected,\n isSelectAllHidden: selectAllVisibility === SelectAllVisibility.hidden,\n isResizingColumn: !!columnResizeDetails && isSizing,\n isSizing: isSizing,\n isAllCollapsed: isAllCollapsed,\n isCheckboxHidden: isCheckboxHidden,\n className: className,\n });\n var classNames = this._classNames;\n var IconComponent = useFastIcons ? FontIcon : Icon;\n var hasGroupExpander = groupNestingDepth > 0;\n var showGroupExpander = hasGroupExpander && this.props.collapseAllVisibility === CollapseAllVisibility.visible;\n var columnIndexOffset = this._computeColumnIndexOffset(showCheckbox);\n var isRTL = getRTL(theme);\n return (React.createElement(FocusZone, { role: \"row\", \"aria-label\": ariaLabel, className: classNames.root, componentRef: this._rootComponent, elementRef: this._rootElement, onMouseMove: this._onRootMouseMove, \"data-automationid\": \"DetailsHeader\", direction: FocusZoneDirection.horizontal },\n showCheckbox\n ? [\n React.createElement(\"div\", { key: \"__checkbox\", className: classNames.cellIsCheck, \"aria-labelledby\": \"\".concat(this._id, \"-checkTooltip\"), onClick: !isCheckboxHidden ? this._onSelectAllClicked : undefined, role: 'columnheader' }, onRenderColumnHeaderTooltip({\n hostClassName: classNames.checkTooltip,\n id: \"\".concat(this._id, \"-checkTooltip\"),\n setAriaDescribedBy: false,\n content: ariaLabelForSelectAllCheckbox,\n children: (React.createElement(DetailsRowCheck, { id: \"\".concat(this._id, \"-check\"), \"aria-label\": selectionMode === SelectionMode.multiple\n ? ariaLabelForSelectAllCheckbox\n : ariaLabelForSelectionColumn, \"data-is-focusable\": !isCheckboxHidden || undefined, isHeader: true, selected: isAllSelected, anySelected: false, canSelect: !isCheckboxHidden, className: classNames.check, onRenderDetailsCheckbox: onRenderDetailsCheckbox, useFastIcons: useFastIcons, isVisible: isCheckboxAlwaysVisible })),\n }, this._onRenderColumnHeaderTooltip)),\n !this.props.onRenderColumnHeaderTooltip ? (ariaLabelForSelectAllCheckbox && !isCheckboxHidden ? (React.createElement(\"label\", { key: \"__checkboxLabel\", id: \"\".concat(this._id, \"-checkTooltip\"), className: classNames.accessibleLabel, \"aria-hidden\": true }, ariaLabelForSelectAllCheckbox)) : ariaLabelForSelectionColumn && isCheckboxHidden ? (React.createElement(\"label\", { key: \"__checkboxLabel\", id: \"\".concat(this._id, \"-checkTooltip\"), className: classNames.accessibleLabel, \"aria-hidden\": true }, ariaLabelForSelectionColumn)) : null) : null,\n ]\n : null,\n showGroupExpander ? (React.createElement(\"div\", { className: classNames.cellIsGroupExpander, onClick: this._onToggleCollapseAll, \"data-is-focusable\": true, \"aria-label\": ariaLabelForToggleAllGroupsButton, \"aria-expanded\": !isAllCollapsed, role: \"columnheader\" },\n React.createElement(IconComponent, { className: classNames.collapseButton, iconName: isRTL ? 'ChevronLeftMed' : 'ChevronRightMed' }),\n React.createElement(\"span\", { className: classNames.accessibleLabel }, ariaLabelForToggleAllGroupsButton))) : hasGroupExpander ? (React.createElement(\"div\", { className: classNames.cellIsGroupExpander, \"data-is-focusable\": false, role: \"columnheader\" })) : null,\n React.createElement(GroupSpacer, { indentWidth: indentWidth, role: \"gridcell\", count: groupNestingDepth - 1 }),\n columns.map(function (column, columnIndex) {\n var _isDraggable = columnReorderProps\n ? columnIndex >= frozenColumnCountFromStart && columnIndex < columns.length - frozenColumnCountFromEnd\n : false;\n return [\n columnReorderProps &&\n (_isDraggable || columnIndex === columns.length - frozenColumnCountFromEnd) &&\n _this._renderDropHint(columnIndex),\n React.createElement(DetailsColumn, { column: column, styles: column.styles, key: column.key, columnIndex: columnIndexOffset + columnIndex, parentId: _this._id, isDraggable: _isDraggable, updateDragInfo: _this._updateDragInfo, dragDropHelper: _this._dragDropHelper, onColumnClick: onColumnClick, onColumnContextMenu: onColumnContextMenu, \n // Do not render tooltips by default, but allow for override via props.\n onRenderColumnHeaderTooltip: _this.props.onRenderColumnHeaderTooltip, isDropped: _this._onDropIndexInfo.targetIndex === columnIndex, cellStyleProps: _this.props.cellStyleProps, useFastIcons: useFastIcons }),\n _this._renderColumnDivider(columnIndex),\n ];\n }),\n columnReorderProps && frozenColumnCountFromEnd === 0 && this._renderDropHint(columns.length),\n isSizing && (React.createElement(Layer, null,\n React.createElement(\"div\", { className: classNames.sizingOverlay, onMouseMove: this._onSizerMouseMove, onMouseUp: this._onSizerMouseUp })))));\n };\n /** Set focus to the active thing in the focus area. */\n DetailsHeaderBase.prototype.focus = function () {\n var _a;\n return !!((_a = this._rootComponent.current) === null || _a === void 0 ? void 0 : _a.focus());\n };\n /**\n * Gets column reorder props from this.props. If the calling code is part of setting up or\n * handling drag/drop events, it's safe to assume that this method's return value is defined\n * (because drag/drop handling will only be set up if reorder props are given).\n */\n DetailsHeaderBase.prototype._getColumnReorderProps = function () {\n var _a = this.props, columnReorderOptions = _a.columnReorderOptions, columnReorderProps = _a.columnReorderProps;\n return columnReorderProps || (columnReorderOptions && __assign(__assign({}, columnReorderOptions), { onColumnDragEnd: undefined }));\n };\n DetailsHeaderBase.prototype._getHeaderDragDropOptions = function () {\n var options = {\n selectionIndex: 1,\n context: { data: this, index: 0 },\n canDrag: function () { return false; },\n canDrop: function () { return true; },\n onDragStart: function () { return undefined; },\n updateDropState: this._updateDroppingState,\n onDrop: this._onDrop,\n onDragEnd: function () { return undefined; },\n onDragOver: this._onDragOver,\n };\n return options;\n };\n DetailsHeaderBase.prototype._isValidCurrentDropHintIndex = function () {\n return this._currentDropHintIndex >= 0;\n };\n /**\n * @returns whether or not the \"Select All\" checkbox column is hidden.\n */\n DetailsHeaderBase.prototype._isCheckboxColumnHidden = function () {\n var _a = this.props, selectionMode = _a.selectionMode, checkboxVisibility = _a.checkboxVisibility;\n return selectionMode === SelectionMode.none || checkboxVisibility === CheckboxVisibility.hidden;\n };\n DetailsHeaderBase.prototype._resetDropHints = function () {\n if (this._currentDropHintIndex >= 0) {\n this._updateDropHintElement(this._dropHintDetails[this._currentDropHintIndex].dropHintElementRef, 'none');\n this._currentDropHintIndex = -1;\n }\n };\n DetailsHeaderBase.prototype._updateDropHintElement = function (element, displayProperty) {\n element.childNodes[1].style.display = displayProperty;\n element.childNodes[0].style.display = displayProperty;\n };\n DetailsHeaderBase.prototype._isEventOnHeader = function (event) {\n if (this._rootElement.current) {\n var clientRect = this._rootElement.current.getBoundingClientRect();\n if (event.clientX > clientRect.left &&\n event.clientX < clientRect.right &&\n event.clientY > clientRect.top &&\n event.clientY < clientRect.bottom) {\n return ColumnDragEndLocation.header;\n }\n }\n };\n DetailsHeaderBase.prototype._renderColumnDivider = function (columnIndex) {\n var _a = this.props.columns, columns = _a === void 0 ? NO_COLUMNS : _a;\n var column = columns[columnIndex];\n var onRenderDivider = column.onRenderDivider;\n return onRenderDivider\n ? onRenderDivider({ column: column, columnIndex: columnIndex }, this._renderColumnSizer)\n : this._renderColumnSizer({ column: column, columnIndex: columnIndex });\n };\n DetailsHeaderBase.prototype._renderDropHint = function (dropHintIndex) {\n var classNames = this._classNames;\n var IconComponent = this.props.useFastIcons ? FontIcon : Icon;\n return (React.createElement(\"div\", { key: 'dropHintKey', className: classNames.dropHintStyle, id: \"columnDropHint_\".concat(dropHintIndex), \"aria-hidden\": true },\n React.createElement(\"div\", { role: \"presentation\", key: \"dropHintCircleKey\", className: classNames.dropHintCaretStyle, \"data-is-focusable\": false, \"data-sizer-index\": dropHintIndex, \"aria-hidden\": true },\n React.createElement(IconComponent, { iconName: 'CircleShapeSolid' })),\n React.createElement(\"div\", { key: \"dropHintLineKey\", \"aria-hidden\": true, \"data-is-focusable\": false, \"data-sizer-index\": dropHintIndex, className: classNames.dropHintLineStyle })));\n };\n /**\n * double click on the column sizer will auto ajust column width\n * to fit the longest content among current rendered rows.\n *\n * @param columnIndex - index of the column user double clicked\n * @param ev - mouse double click event\n */\n DetailsHeaderBase.prototype._onSizerDoubleClick = function (columnIndex, ev) {\n var _a = this.props, onColumnAutoResized = _a.onColumnAutoResized, _b = _a.columns, columns = _b === void 0 ? NO_COLUMNS : _b;\n if (onColumnAutoResized) {\n onColumnAutoResized(columns[columnIndex], columnIndex);\n }\n };\n DetailsHeaderBase.prototype._onSelectionChanged = function () {\n var isAllSelected = !!this.props.selection && this.props.selection.isAllSelected();\n if (this.state.isAllSelected !== isAllSelected) {\n this.setState({\n isAllSelected: isAllSelected,\n });\n }\n };\n DetailsHeaderBase.defaultProps = {\n selectAllVisibility: SelectAllVisibility.visible,\n collapseAllVisibility: CollapseAllVisibility.visible,\n useFastIcons: true,\n };\n return DetailsHeaderBase;\n}(React.Component));\nexport { DetailsHeaderBase };\nfunction _liesBetween(rtl, target, left, right) {\n return rtl ? target <= left && target >= right : target >= left && target <= right;\n}\nfunction _isBefore(rtl, a, b) {\n return rtl ? a >= b : a <= b;\n}\nfunction _isAfter(rtl, a, b) {\n return rtl ? a <= b : a >= b;\n}\nfunction _stopPropagation(ev) {\n ev.stopPropagation();\n}\n//# sourceMappingURL=DetailsHeader.base.js.map","import { styled } from '../../Utilities';\nimport { DetailsHeaderBase } from './DetailsHeader.base';\nimport { getDetailsHeaderStyles } from './DetailsHeader.styles';\nexport var DetailsHeader = styled(DetailsHeaderBase, getDetailsHeaderStyles, undefined, { scope: 'DetailsHeader' });\n//# sourceMappingURL=DetailsHeader.js.map","import { __assign } from \"tslib\";\nimport { getFocusStyle, focusClear, getGlobalClassNames, HighContrastSelector, hiddenContentStyle, getHighContrastNoAdjustStyle, } from '../../Styling';\nimport { getRTL, IsFocusVisibleClassName } from '../../Utilities';\nimport { DEFAULT_CELL_STYLE_PROPS } from './DetailsRow.styles';\n// For every group level there is a GroupSpacer added. Importing this const to have the source value in one place.\nimport { SPACER_WIDTH as GROUP_EXPANDER_WIDTH } from '../GroupedList/GroupSpacer';\nvar GlobalClassNames = {\n tooltipHost: 'ms-TooltipHost',\n root: 'ms-DetailsHeader',\n cell: 'ms-DetailsHeader-cell',\n cellIsCheck: 'ms-DetailsHeader-cellIsCheck',\n collapseButton: 'ms-DetailsHeader-collapseButton',\n isCollapsed: 'is-collapsed',\n isAllSelected: 'is-allSelected',\n isSelectAllHidden: 'is-selectAllHidden',\n isResizingColumn: 'is-resizingColumn',\n cellSizer: 'ms-DetailsHeader-cellSizer',\n isResizing: 'is-resizing',\n dropHintCircleStyle: 'ms-DetailsHeader-dropHintCircleStyle',\n dropHintCaretStyle: 'ms-DetailsHeader-dropHintCaretStyle',\n dropHintLineStyle: 'ms-DetailsHeader-dropHintLineStyle',\n cellTitle: 'ms-DetailsHeader-cellTitle',\n cellName: 'ms-DetailsHeader-cellName',\n filterChevron: 'ms-DetailsHeader-filterChevron',\n gripperBarVertical: 'ms-DetailsColumn-gripperBarVertical',\n checkTooltip: 'ms-DetailsHeader-checkTooltip',\n check: 'ms-DetailsHeader-check',\n};\nexport var HEADER_HEIGHT = 42;\nexport var getCellStyles = function (props) {\n var theme = props.theme, _a = props.cellStyleProps, cellStyleProps = _a === void 0 ? DEFAULT_CELL_STYLE_PROPS : _a;\n var semanticColors = theme.semanticColors;\n var classNames = getGlobalClassNames(GlobalClassNames, theme);\n return [\n classNames.cell,\n getFocusStyle(theme),\n {\n color: semanticColors.bodyText,\n position: 'relative',\n display: 'inline-block',\n boxSizing: 'border-box',\n padding: \"0 \".concat(cellStyleProps.cellRightPadding, \"px 0 \").concat(cellStyleProps.cellLeftPadding, \"px\"),\n lineHeight: 'inherit',\n margin: '0',\n height: HEADER_HEIGHT,\n verticalAlign: 'top',\n whiteSpace: 'nowrap',\n textOverflow: 'ellipsis',\n textAlign: 'left',\n },\n ];\n};\nexport var getDetailsHeaderStyles = function (props) {\n var _a, _b, _c, _d;\n var theme = props.theme, className = props.className, isAllSelected = props.isAllSelected, isResizingColumn = props.isResizingColumn, isSizing = props.isSizing, isAllCollapsed = props.isAllCollapsed, _e = props.cellStyleProps, cellStyleProps = _e === void 0 ? DEFAULT_CELL_STYLE_PROPS : _e;\n var semanticColors = theme.semanticColors, palette = theme.palette, fonts = theme.fonts;\n var classNames = getGlobalClassNames(GlobalClassNames, theme);\n var colors = {\n iconForegroundColor: semanticColors.bodySubtext,\n headerForegroundColor: semanticColors.bodyText,\n headerBackgroundColor: semanticColors.bodyBackground,\n resizerColor: palette.neutralTertiaryAlt,\n };\n var cellSizerFadeInStyles = {\n opacity: 1,\n transition: 'opacity 0.3s linear',\n };\n var cellStyles = getCellStyles(props);\n return {\n root: [\n classNames.root,\n fonts.small,\n {\n display: 'inline-block',\n background: colors.headerBackgroundColor,\n position: 'relative',\n minWidth: '100%',\n verticalAlign: 'top',\n height: HEADER_HEIGHT,\n lineHeight: HEADER_HEIGHT,\n whiteSpace: 'nowrap',\n boxSizing: 'content-box',\n paddingBottom: '1px',\n paddingTop: '16px',\n borderBottom: \"1px solid \".concat(semanticColors.bodyDivider),\n cursor: 'default',\n userSelect: 'none',\n selectors: (_a = {},\n _a[\"&:hover .\".concat(classNames.check)] = {\n opacity: 1,\n },\n _a[\"& .\".concat(classNames.tooltipHost, \" .\").concat(classNames.checkTooltip)] = {\n display: 'block',\n },\n _a),\n },\n isAllSelected && classNames.isAllSelected,\n isResizingColumn && classNames.isResizingColumn,\n className,\n ],\n check: [\n classNames.check,\n {\n height: HEADER_HEIGHT,\n },\n {\n selectors: (_b = {},\n _b[\".\".concat(IsFocusVisibleClassName, \" &:focus, :host(.\").concat(IsFocusVisibleClassName, \") &:focus\")] = {\n opacity: 1,\n },\n _b),\n },\n ],\n cellWrapperPadded: {\n paddingRight: cellStyleProps.cellExtraRightPadding + cellStyleProps.cellRightPadding,\n },\n cellIsCheck: [\n cellStyles,\n classNames.cellIsCheck,\n {\n position: 'relative',\n padding: 0,\n margin: 0,\n display: 'inline-flex',\n alignItems: 'center',\n border: 'none',\n },\n isAllSelected && {\n opacity: 1,\n },\n ],\n cellIsGroupExpander: [\n cellStyles,\n {\n display: 'inline-flex',\n alignItems: 'center',\n justifyContent: 'center',\n fontSize: fonts.small.fontSize,\n padding: 0,\n border: 'none',\n width: GROUP_EXPANDER_WIDTH, // align with GroupedList's first expandIcon cell width.\n color: palette.neutralSecondary,\n selectors: {\n ':hover': {\n backgroundColor: palette.neutralLighter,\n },\n ':active': {\n backgroundColor: palette.neutralLight,\n },\n },\n },\n ],\n cellIsActionable: {\n selectors: {\n ':hover': {\n color: semanticColors.bodyText,\n background: semanticColors.listHeaderBackgroundHovered,\n },\n ':active': {\n background: semanticColors.listHeaderBackgroundPressed,\n },\n },\n },\n cellIsEmpty: {\n textOverflow: 'clip',\n },\n cellSizer: [\n classNames.cellSizer,\n focusClear(),\n {\n display: 'inline-block',\n position: 'relative',\n cursor: 'ew-resize',\n bottom: 0,\n top: 0,\n overflow: 'hidden',\n height: 'inherit',\n background: 'transparent',\n zIndex: 1,\n width: 16,\n selectors: (_c = {\n ':after': {\n content: '\"\"',\n position: 'absolute',\n top: 0,\n bottom: 0,\n width: 1,\n background: colors.resizerColor,\n opacity: 0,\n left: '50%',\n },\n ':focus:after': cellSizerFadeInStyles,\n ':hover:after': cellSizerFadeInStyles\n },\n _c[\"&.\".concat(classNames.isResizing, \":after\")] = [\n cellSizerFadeInStyles,\n {\n boxShadow: '0 0 5px 0 rgba(0, 0, 0, 0.4)',\n },\n ],\n _c),\n },\n ],\n cellIsResizing: classNames.isResizing,\n cellSizerStart: {\n margin: '0 -8px',\n },\n cellSizerEnd: {\n margin: 0,\n marginLeft: -16,\n },\n collapseButton: [\n classNames.collapseButton,\n {\n transformOrigin: '50% 50%',\n transition: 'transform .1s linear',\n },\n isAllCollapsed\n ? [\n classNames.isCollapsed,\n {\n transform: 'rotate(0deg)',\n },\n ]\n : {\n transform: getRTL(theme) ? 'rotate(-90deg)' : 'rotate(90deg)',\n },\n ],\n checkTooltip: classNames.checkTooltip,\n sizingOverlay: isSizing && {\n position: 'absolute',\n left: 0,\n top: 0,\n right: 0,\n bottom: 0,\n cursor: 'ew-resize',\n background: 'rgba(255, 255, 255, 0)',\n selectors: (_d = {},\n _d[HighContrastSelector] = __assign({ background: 'transparent' }, getHighContrastNoAdjustStyle()),\n _d),\n },\n accessibleLabel: hiddenContentStyle,\n dropHintCircleStyle: [\n classNames.dropHintCircleStyle,\n {\n display: 'inline-block',\n visibility: 'hidden',\n position: 'absolute',\n bottom: 0,\n height: 9,\n width: 9,\n borderRadius: '50%',\n marginLeft: -5,\n top: 34,\n overflow: 'visible',\n zIndex: 10,\n border: \"1px solid \".concat(palette.themePrimary),\n background: palette.white,\n },\n ],\n dropHintCaretStyle: [\n classNames.dropHintCaretStyle,\n {\n display: 'none',\n position: 'absolute',\n top: -28,\n left: -6.5,\n fontSize: fonts.medium.fontSize,\n color: palette.themePrimary,\n overflow: 'visible',\n zIndex: 10,\n },\n ],\n dropHintLineStyle: [\n classNames.dropHintLineStyle,\n {\n display: 'none',\n position: 'absolute',\n bottom: 0,\n top: 0,\n overflow: 'hidden',\n height: 42,\n width: 1,\n background: palette.themePrimary,\n zIndex: 10,\n },\n ],\n dropHintStyle: {\n display: 'inline-block',\n position: 'absolute',\n },\n };\n};\n//# sourceMappingURL=DetailsHeader.styles.js.map","/**\n * {@docCategory DetailsList}\n */\nexport var SelectAllVisibility;\n(function (SelectAllVisibility) {\n SelectAllVisibility[SelectAllVisibility[\"none\"] = 0] = \"none\";\n SelectAllVisibility[SelectAllVisibility[\"hidden\"] = 1] = \"hidden\";\n SelectAllVisibility[SelectAllVisibility[\"visible\"] = 2] = \"visible\";\n})(SelectAllVisibility || (SelectAllVisibility = {}));\n//# sourceMappingURL=DetailsHeader.types.js.map","import { __assign, __decorate, __extends } from \"tslib\";\nimport * as React from 'react';\nimport { initializeComponentRef, FocusRects, Async, KeyCodes, elementContains, getRTLSafeKeyCode, classNamesFunction, css, memoizeFunction, warnMutuallyExclusive, } from '../../Utilities';\nimport { CheckboxVisibility, ColumnActionsMode, ConstrainMode, DetailsListLayoutMode, ColumnDragEndLocation, } from '../DetailsList/DetailsList.types';\nimport { DetailsHeader } from '../DetailsList/DetailsHeader';\nimport { SelectAllVisibility } from '../DetailsList/DetailsHeader.types';\nimport { DetailsRow } from '../DetailsList/DetailsRow';\nimport { FocusZone, FocusZoneDirection } from '../../FocusZone';\nimport { Selection, SelectionMode, SelectionZone } from '../../Selection';\nimport { DragDropHelper } from '../../DragDrop';\nimport { GroupedList } from '../../GroupedList';\nimport { List } from '../../List';\nimport { withViewport } from '../../utilities/decorators/withViewport';\nimport { GetGroupCount } from '../../utilities/groupedList/GroupedListUtility';\nimport { DEFAULT_CELL_STYLE_PROPS } from './DetailsRow.styles';\nimport { CHECK_CELL_WIDTH as CHECKBOX_WIDTH } from './DetailsRowCheck.styles';\n// For every group level there is a GroupSpacer added. Importing this const to have the source value in one place.\nimport { SPACER_WIDTH as GROUP_EXPAND_WIDTH } from '../GroupedList/GroupSpacer';\nimport { composeComponentAs, composeRenderFunction, getId } from '@fluentui/utilities';\nimport { useConst } from '@fluentui/react-hooks';\nimport { WindowContext } from '@fluentui/react-window-provider';\nimport { getDocumentEx } from '../../utilities/dom';\nvar getClassNames = classNamesFunction();\nvar COMPONENT_NAME = 'DetailsList';\nvar MIN_COLUMN_WIDTH = 100; // this is the global min width\nvar DEFAULT_RENDERED_WINDOWS_AHEAD = 2;\nvar DEFAULT_RENDERED_WINDOWS_BEHIND = 2;\nvar rowFocusZoneAddTabIndexProps = { tabIndex: 0 };\nvar rowFocusZoneNoTabIndexProps = {};\n/**\n * Hooks-based implementation of DetailsList.\n * Since many existing consumers of DetailsList expect `ref` to return a `DetailsList`,\n * this inner component handles rendering while the outer maintains compatibility.\n */\nvar DetailsListInner = function (props) {\n var selection = props.selection;\n var ariaLabelForListHeader = props.ariaLabelForListHeader, ariaLabelForSelectAllCheckbox = props.ariaLabelForSelectAllCheckbox, ariaLabelForSelectionColumn = props.ariaLabelForSelectionColumn, className = props.className, checkboxVisibility = props.checkboxVisibility, compact = props.compact, constrainMode = props.constrainMode, dragDropEvents = props.dragDropEvents, groups = props.groups, groupProps = props.groupProps, indentWidth = props.indentWidth, items = props.items, isPlaceholderData = props.isPlaceholderData, isHeaderVisible = props.isHeaderVisible, layoutMode = props.layoutMode, onItemInvoked = props.onItemInvoked, onItemContextMenu = props.onItemContextMenu, onColumnHeaderClick = props.onColumnHeaderClick, onColumnHeaderContextMenu = props.onColumnHeaderContextMenu, _a = props.selectionMode, selectionMode = _a === void 0 ? selection.mode : _a, selectionPreservedOnEmptyClick = props.selectionPreservedOnEmptyClick, selectionZoneProps = props.selectionZoneProps, \n // eslint-disable-next-line @typescript-eslint/no-deprecated\n ariaLabel = props.ariaLabel, ariaLabelForGrid = props.ariaLabelForGrid, rowElementEventMap = props.rowElementEventMap, \n // eslint-disable-next-line @typescript-eslint/no-deprecated\n _b = props.shouldApplyApplicationRole, \n // eslint-disable-next-line @typescript-eslint/no-deprecated\n shouldApplyApplicationRole = _b === void 0 ? false : _b, getKey = props.getKey, listProps = props.listProps, usePageCache = props.usePageCache, onShouldVirtualize = props.onShouldVirtualize, viewport = props.viewport, minimumPixelsForDrag = props.minimumPixelsForDrag, getGroupHeight = props.getGroupHeight, styles = props.styles, theme = props.theme, _c = props.cellStyleProps, cellStyleProps = _c === void 0 ? DEFAULT_CELL_STYLE_PROPS : _c, onRenderCheckbox = props.onRenderCheckbox, useFastIcons = props.useFastIcons, dragDropHelper = props.dragDropHelper, adjustedColumns = props.adjustedColumns, isCollapsed = props.isCollapsed, isSizing = props.isSizing, isSomeGroupExpanded = props.isSomeGroupExpanded, version = props.version, rootRef = props.rootRef, listRef = props.listRef, focusZoneRef = props.focusZoneRef, columnReorderOptions = props.columnReorderOptions, groupedListRef = props.groupedListRef, headerRef = props.headerRef, onGroupExpandStateChanged = props.onGroupExpandStateChanged, onColumnIsSizingChanged = props.onColumnIsSizingChanged, onRowDidMount = props.onRowDidMount, onRowWillUnmount = props.onRowWillUnmount, disableSelectionZone = props.disableSelectionZone, _d = props.isSelectedOnFocus, isSelectedOnFocus = _d === void 0 ? true : _d, onColumnResized = props.onColumnResized, onColumnAutoResized = props.onColumnAutoResized, onToggleCollapse = props.onToggleCollapse, onActiveRowChanged = props.onActiveRowChanged, onBlur = props.onBlur, eventsToRegister = props.rowElementEventMap, onRenderMissingItem = props.onRenderMissingItem, onRenderItemColumn = props.onRenderItemColumn, onRenderField = props.onRenderField, getCellValueKey = props.getCellValueKey, getRowAriaLabel = props.getRowAriaLabel, getRowAriaDescribedBy = props.getRowAriaDescribedBy, checkButtonAriaLabel = props.checkButtonAriaLabel, checkButtonGroupAriaLabel = props.checkButtonGroupAriaLabel, checkboxCellClassName = props.checkboxCellClassName, useReducedRowRenderer = props.useReducedRowRenderer, enableUpdateAnimations = props.enableUpdateAnimations, enterModalSelectionOnTouch = props.enterModalSelectionOnTouch, onRenderDefaultRow = props.onRenderDefaultRow, selectionZoneRef = props.selectionZoneRef, focusZoneProps = props.focusZoneProps;\n var defaultRole = 'grid';\n var role = props.role ? props.role : defaultRole;\n var rowId = getId('row');\n var groupNestingDepth = getGroupNestingDepth(groups);\n var groupedDetailsListIndexMap = useGroupedDetailsListIndexMap(groups);\n var additionalListProps = React.useMemo(function () {\n return __assign({ renderedWindowsAhead: isSizing ? 0 : DEFAULT_RENDERED_WINDOWS_AHEAD, renderedWindowsBehind: isSizing ? 0 : DEFAULT_RENDERED_WINDOWS_BEHIND, getKey: getKey, version: version }, listProps);\n }, [isSizing, getKey, version, listProps]);\n var selectAllVisibility = SelectAllVisibility.none; // for SelectionMode.none\n if (selectionMode === SelectionMode.single) {\n selectAllVisibility = SelectAllVisibility.hidden;\n }\n if (selectionMode === SelectionMode.multiple) {\n // if isCollapsedGroupSelectVisible is false, disable select all when the list has all collapsed groups\n var isCollapsedGroupSelectVisible = groupProps && groupProps.headerProps && groupProps.headerProps.isCollapsedGroupSelectVisible;\n if (isCollapsedGroupSelectVisible === undefined) {\n isCollapsedGroupSelectVisible = true;\n }\n var isSelectAllVisible = isCollapsedGroupSelectVisible || !groups || isSomeGroupExpanded;\n selectAllVisibility = isSelectAllVisible ? SelectAllVisibility.visible : SelectAllVisibility.hidden;\n }\n if (checkboxVisibility === CheckboxVisibility.hidden) {\n selectAllVisibility = SelectAllVisibility.none;\n }\n var defaultOnRenderDetailsHeader = React.useCallback(function (detailsHeaderProps) {\n return React.createElement(DetailsHeader, __assign({}, detailsHeaderProps));\n }, []);\n var defaultOnRenderDetailsFooter = React.useCallback(function () {\n return null;\n }, []);\n var propsOnRenderDetailsHeader = props.onRenderDetailsHeader;\n var onRenderDetailsHeader = React.useMemo(function () {\n return propsOnRenderDetailsHeader\n ? composeRenderFunction(propsOnRenderDetailsHeader, defaultOnRenderDetailsHeader)\n : defaultOnRenderDetailsHeader;\n }, [propsOnRenderDetailsHeader, defaultOnRenderDetailsHeader]);\n var propsOnRenderDetailsFooter = props.onRenderDetailsFooter;\n var onRenderDetailsFooter = React.useMemo(function () {\n return propsOnRenderDetailsFooter\n ? composeRenderFunction(propsOnRenderDetailsFooter, defaultOnRenderDetailsFooter)\n : defaultOnRenderDetailsFooter;\n }, [propsOnRenderDetailsFooter, defaultOnRenderDetailsFooter]);\n var detailsFooterProps = React.useMemo(function () {\n return {\n columns: adjustedColumns,\n groupNestingDepth: groupNestingDepth,\n selection: selection,\n selectionMode: selectionMode,\n viewport: viewport,\n checkboxVisibility: checkboxVisibility,\n indentWidth: indentWidth,\n cellStyleProps: cellStyleProps,\n };\n }, [\n adjustedColumns,\n groupNestingDepth,\n selection,\n selectionMode,\n viewport,\n checkboxVisibility,\n indentWidth,\n cellStyleProps,\n ]);\n var columnReorderOnDragEnd = columnReorderOptions && columnReorderOptions.onDragEnd;\n var onColumnDragEnd = React.useCallback(function (_a, event) {\n var dropLocation = _a.dropLocation;\n var finalDropLocation = ColumnDragEndLocation.outside;\n if (columnReorderOnDragEnd) {\n if (dropLocation && dropLocation !== ColumnDragEndLocation.header) {\n finalDropLocation = dropLocation;\n }\n else if (rootRef.current) {\n var clientRect = rootRef.current.getBoundingClientRect();\n if (event.clientX > clientRect.left &&\n event.clientX < clientRect.right &&\n event.clientY > clientRect.top &&\n event.clientY < clientRect.bottom) {\n finalDropLocation = ColumnDragEndLocation.surface;\n }\n }\n columnReorderOnDragEnd(finalDropLocation);\n }\n }, [columnReorderOnDragEnd, rootRef]);\n var columnReorderProps = React.useMemo(function () {\n if (columnReorderOptions) {\n return __assign(__assign({}, columnReorderOptions), { onColumnDragEnd: onColumnDragEnd });\n }\n }, [columnReorderOptions, onColumnDragEnd]);\n var rowCount = (isHeaderVisible ? 1 : 0) +\n (props.onRenderDetailsFooter ? 1 : 0) +\n GetGroupCount(groups) +\n (items ? items.length : 0);\n var colCount = (selectAllVisibility !== SelectAllVisibility.none ? 1 : 0) +\n (adjustedColumns ? adjustedColumns.length : 0) +\n (groups ? 1 : 0);\n var classNames = React.useMemo(function () {\n return getClassNames(styles, {\n theme: theme,\n compact: compact,\n isFixed: layoutMode === DetailsListLayoutMode.fixedColumns,\n isHorizontalConstrained: constrainMode === ConstrainMode.horizontalConstrained,\n className: className,\n });\n }, [styles, theme, compact, layoutMode, constrainMode, className]);\n var onRenderDetailsGroupFooter = groupProps && groupProps.onRenderFooter;\n var finalOnRenderDetailsGroupFooter = React.useMemo(function () {\n return onRenderDetailsGroupFooter\n ? function (groupFooterProps, defaultRender) {\n return onRenderDetailsGroupFooter(__assign(__assign({}, groupFooterProps), { columns: adjustedColumns, groupNestingDepth: groupNestingDepth, indentWidth: indentWidth, selection: selection, selectionMode: selectionMode, viewport: viewport, checkboxVisibility: checkboxVisibility, cellStyleProps: cellStyleProps }), defaultRender);\n }\n : undefined;\n }, [\n onRenderDetailsGroupFooter,\n adjustedColumns,\n groupNestingDepth,\n indentWidth,\n selection,\n selectionMode,\n viewport,\n checkboxVisibility,\n cellStyleProps,\n ]);\n var onRenderDetailsGroupHeader = groupProps && groupProps.onRenderHeader;\n var finalOnRenderDetailsGroupHeader = React.useMemo(function () {\n return onRenderDetailsGroupHeader\n ? function (groupHeaderProps, defaultRender) {\n var _a, _b;\n var groupIndex = groupHeaderProps.groupIndex;\n var groupKey = groupIndex !== undefined ? (_b = (_a = groupHeaderProps.groups) === null || _a === void 0 ? void 0 : _a[groupIndex]) === null || _b === void 0 ? void 0 : _b.key : undefined;\n var totalRowCount = groupKey !== undefined && groupedDetailsListIndexMap[groupKey]\n ? groupedDetailsListIndexMap[groupKey].totalRowCount\n : 0;\n return onRenderDetailsGroupHeader(__assign(__assign({}, groupHeaderProps), { columns: adjustedColumns, groupNestingDepth: groupNestingDepth, indentWidth: indentWidth, selection: selection, selectionMode: checkboxVisibility !== CheckboxVisibility.hidden ? selectionMode : SelectionMode.none, viewport: viewport, checkboxVisibility: checkboxVisibility, cellStyleProps: cellStyleProps, ariaColSpan: adjustedColumns.length, ariaLevel: undefined, ariaPosInSet: undefined, ariaSetSize: undefined, ariaRowCount: undefined, ariaRowIndex: groupIndex !== undefined ? totalRowCount + (isHeaderVisible ? 1 : 0) : undefined }), defaultRender);\n }\n : function (groupHeaderProps, defaultRender) {\n var _a, _b;\n var groupIndex = groupHeaderProps.groupIndex;\n var groupKey = groupIndex !== undefined ? (_b = (_a = groupHeaderProps.groups) === null || _a === void 0 ? void 0 : _a[groupIndex]) === null || _b === void 0 ? void 0 : _b.key : undefined;\n var totalRowCount = groupKey !== undefined && groupedDetailsListIndexMap[groupKey]\n ? groupedDetailsListIndexMap[groupKey].totalRowCount\n : 0;\n return defaultRender(__assign(__assign({}, groupHeaderProps), { ariaColSpan: adjustedColumns.length, ariaLevel: undefined, ariaPosInSet: undefined, ariaSetSize: undefined, ariaRowCount: undefined, ariaRowIndex: groupIndex !== undefined ? totalRowCount + (isHeaderVisible ? 1 : 0) : undefined }));\n };\n }, [\n onRenderDetailsGroupHeader,\n adjustedColumns,\n groupNestingDepth,\n indentWidth,\n isHeaderVisible,\n selection,\n selectionMode,\n viewport,\n checkboxVisibility,\n cellStyleProps,\n groupedDetailsListIndexMap,\n ]);\n var finalGroupProps = React.useMemo(function () {\n var _a;\n return __assign(__assign({}, groupProps), { role: role === defaultRole ? 'rowgroup' : 'presentation', onRenderFooter: finalOnRenderDetailsGroupFooter, onRenderHeader: finalOnRenderDetailsGroupHeader, \n // pass through custom group header checkbox label\n headerProps: __assign(__assign({}, groupProps === null || groupProps === void 0 ? void 0 : groupProps.headerProps), { selectAllButtonProps: __assign({ 'aria-label': checkButtonGroupAriaLabel }, (_a = groupProps === null || groupProps === void 0 ? void 0 : groupProps.headerProps) === null || _a === void 0 ? void 0 : _a.selectAllButtonProps) }) });\n }, [groupProps, finalOnRenderDetailsGroupFooter, finalOnRenderDetailsGroupHeader, checkButtonGroupAriaLabel, role]);\n var sumColumnWidths = useConst(function () {\n return memoizeFunction(function (columns) {\n var totalWidth = 0;\n columns.forEach(function (column) { return (totalWidth += column.calculatedWidth || column.minWidth); });\n return totalWidth;\n });\n });\n var collapseAllVisibility = groupProps && groupProps.collapseAllVisibility;\n var rowWidth = React.useMemo(function () {\n return sumColumnWidths(adjustedColumns);\n }, [adjustedColumns, sumColumnWidths]);\n var onRenderCell = React.useCallback(function (nestingDepth, item, index, group) {\n var finalOnRenderRow = props.onRenderRow\n ? composeRenderFunction(props.onRenderRow, onRenderDefaultRow)\n : onRenderDefaultRow;\n var groupKey = group ? group.key : undefined;\n var numOfGroupHeadersBeforeItem = groupKey && groupedDetailsListIndexMap[groupKey]\n ? groupedDetailsListIndexMap[groupKey].numOfGroupHeadersBeforeItem\n : 0;\n var rowRole = role === defaultRole ? undefined : 'presentation';\n // add tabindex=\"0\" to first row so if the header isn't rendered or isn't focusable,\n // the focuszone still has content in the tab order.\n var rowFocusZoneProps = index > 0 ? rowFocusZoneNoTabIndexProps : rowFocusZoneAddTabIndexProps;\n var rowProps = {\n item: item,\n itemIndex: index,\n flatIndexOffset: (isHeaderVisible ? 2 : 1) + numOfGroupHeadersBeforeItem,\n compact: compact,\n columns: adjustedColumns,\n groupNestingDepth: nestingDepth,\n id: \"\".concat(rowId, \"-\").concat(index),\n selectionMode: selectionMode,\n selection: selection,\n onDidMount: onRowDidMount,\n onWillUnmount: onRowWillUnmount,\n onRenderItemColumn: onRenderItemColumn,\n onRenderField: onRenderField,\n getCellValueKey: getCellValueKey,\n eventsToRegister: eventsToRegister,\n dragDropEvents: dragDropEvents,\n dragDropHelper: dragDropHelper,\n viewport: viewport,\n checkboxVisibility: checkboxVisibility,\n collapseAllVisibility: collapseAllVisibility,\n getRowAriaLabel: getRowAriaLabel,\n getRowAriaDescribedBy: getRowAriaDescribedBy,\n checkButtonAriaLabel: checkButtonAriaLabel,\n checkboxCellClassName: checkboxCellClassName,\n useReducedRowRenderer: useReducedRowRenderer,\n indentWidth: indentWidth,\n cellStyleProps: cellStyleProps,\n onRenderDetailsCheckbox: onRenderCheckbox,\n enableUpdateAnimations: enableUpdateAnimations,\n rowWidth: rowWidth,\n useFastIcons: useFastIcons,\n role: rowRole,\n isGridRow: true,\n focusZoneProps: rowFocusZoneProps,\n };\n if (!item) {\n if (onRenderMissingItem) {\n return onRenderMissingItem(index, rowProps);\n }\n return null;\n }\n return finalOnRenderRow(rowProps);\n }, [\n compact,\n adjustedColumns,\n selectionMode,\n selection,\n rowId,\n onRowDidMount,\n onRowWillUnmount,\n onRenderItemColumn,\n onRenderField,\n getCellValueKey,\n eventsToRegister,\n dragDropEvents,\n dragDropHelper,\n viewport,\n checkboxVisibility,\n collapseAllVisibility,\n getRowAriaLabel,\n getRowAriaDescribedBy,\n isHeaderVisible,\n checkButtonAriaLabel,\n checkboxCellClassName,\n useReducedRowRenderer,\n indentWidth,\n cellStyleProps,\n onRenderCheckbox,\n enableUpdateAnimations,\n useFastIcons,\n onRenderDefaultRow,\n onRenderMissingItem,\n props.onRenderRow,\n rowWidth,\n role,\n groupedDetailsListIndexMap,\n ]);\n var onRenderListCell = React.useCallback(function (nestingDepth) {\n return function (item, itemIndex) {\n return onRenderCell(nestingDepth, item, itemIndex);\n };\n }, [onRenderCell]);\n var isRightArrow = React.useCallback(function (event) {\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n return event.which === getRTLSafeKeyCode(KeyCodes.right, theme);\n }, [theme]);\n var focusZoneInnerProps = __assign(__assign({}, focusZoneProps), { componentRef: focusZoneProps && focusZoneProps.componentRef ? focusZoneProps.componentRef : focusZoneRef, className: focusZoneProps && focusZoneProps.className\n ? css(classNames.focusZone, focusZoneProps.className)\n : classNames.focusZone, direction: focusZoneProps ? focusZoneProps.direction : FocusZoneDirection.vertical, shouldEnterInnerZone: focusZoneProps && focusZoneProps.shouldEnterInnerZone ? focusZoneProps.shouldEnterInnerZone : isRightArrow, onActiveElementChanged: focusZoneProps && focusZoneProps.onActiveElementChanged\n ? focusZoneProps.onActiveElementChanged\n : onActiveRowChanged, shouldRaiseClicksOnEnter: false, onBlur: focusZoneProps && focusZoneProps.onBlur ? focusZoneProps.onBlur : onBlur });\n var FinalGroupedList = groups && (groupProps === null || groupProps === void 0 ? void 0 : groupProps.groupedListAs) ? composeComponentAs(groupProps.groupedListAs, GroupedList) : GroupedList;\n var list = groups ? (React.createElement(FinalGroupedList, { focusZoneProps: focusZoneInnerProps, componentRef: groupedListRef, groups: groups, groupProps: finalGroupProps, items: items, onRenderCell: onRenderCell, role: \"presentation\", selection: selection, selectionMode: checkboxVisibility !== CheckboxVisibility.hidden ? selectionMode : SelectionMode.none, dragDropEvents: dragDropEvents, dragDropHelper: dragDropHelper, eventsToRegister: rowElementEventMap, listProps: additionalListProps, onGroupExpandStateChanged: onGroupExpandStateChanged, usePageCache: usePageCache, onShouldVirtualize: onShouldVirtualize, getGroupHeight: getGroupHeight, compact: compact })) : (React.createElement(FocusZone, __assign({}, focusZoneInnerProps),\n React.createElement(List, __assign({ ref: listRef, role: \"presentation\", items: items, onRenderCell: onRenderListCell(0), usePageCache: usePageCache, onShouldVirtualize: onShouldVirtualize }, additionalListProps))));\n var onHeaderKeyDown = React.useCallback(function (ev) {\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n if (ev.which === KeyCodes.down) {\n if (focusZoneRef.current && focusZoneRef.current.focus()) {\n // select the first item in list after down arrow key event\n // only if nothing was selected; otherwise start with the already-selected item\n if (isSelectedOnFocus && selection.getSelectedIndices().length === 0) {\n selection.setIndexSelected(0, true, false);\n }\n ev.preventDefault();\n ev.stopPropagation();\n }\n }\n }, [selection, focusZoneRef, isSelectedOnFocus]);\n var onContentKeyDown = React.useCallback(function (ev) {\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n if (ev.which === KeyCodes.up && !ev.altKey) {\n if (headerRef.current && headerRef.current.focus()) {\n ev.preventDefault();\n ev.stopPropagation();\n }\n }\n }, [headerRef]);\n return (React.createElement(\"div\", __assign({ ref: rootRef, className: classNames.root, \"data-automationid\": \"DetailsList\", \"data-is-scrollable\": \"false\" }, (shouldApplyApplicationRole ? { role: 'application' } : {})),\n React.createElement(FocusRects, null),\n React.createElement(\"div\", { role: role, \"aria-label\": ariaLabelForGrid || ariaLabel, \"aria-rowcount\": isPlaceholderData ? 0 : rowCount, \"aria-colcount\": colCount, \"aria-busy\": isPlaceholderData },\n React.createElement(\"div\", { onKeyDown: onHeaderKeyDown, role: \"presentation\", className: classNames.headerWrapper }, isHeaderVisible &&\n onRenderDetailsHeader({\n componentRef: headerRef,\n selectionMode: selectionMode,\n layoutMode: layoutMode,\n selection: selection,\n columns: adjustedColumns,\n onColumnClick: onColumnHeaderClick,\n onColumnContextMenu: onColumnHeaderContextMenu,\n onColumnResized: onColumnResized,\n onColumnIsSizingChanged: onColumnIsSizingChanged,\n onColumnAutoResized: onColumnAutoResized,\n groupNestingDepth: groupNestingDepth,\n isAllCollapsed: isCollapsed,\n onToggleCollapseAll: onToggleCollapse,\n ariaLabel: ariaLabelForListHeader,\n ariaLabelForSelectAllCheckbox: ariaLabelForSelectAllCheckbox,\n ariaLabelForSelectionColumn: ariaLabelForSelectionColumn,\n selectAllVisibility: selectAllVisibility,\n collapseAllVisibility: groupProps && groupProps.collapseAllVisibility,\n viewport: viewport,\n columnReorderProps: columnReorderProps,\n minimumPixelsForDrag: minimumPixelsForDrag,\n cellStyleProps: cellStyleProps,\n checkboxVisibility: checkboxVisibility,\n indentWidth: indentWidth,\n onRenderDetailsCheckbox: onRenderCheckbox,\n rowWidth: sumColumnWidths(adjustedColumns),\n useFastIcons: useFastIcons,\n }, onRenderDetailsHeader)),\n React.createElement(\"div\", { onKeyDown: onContentKeyDown, role: \"presentation\", className: classNames.contentWrapper }, !disableSelectionZone ? (React.createElement(SelectionZone, __assign({ ref: selectionZoneRef, selection: selection, selectionPreservedOnEmptyClick: selectionPreservedOnEmptyClick, selectionMode: selectionMode, isSelectedOnFocus: isSelectedOnFocus, selectionClearedOnEscapePress: isSelectedOnFocus, toggleWithoutModifierPressed: !isSelectedOnFocus, onItemInvoked: onItemInvoked, onItemContextMenu: onItemContextMenu, enterModalOnTouch: enterModalSelectionOnTouch }, (selectionZoneProps || {})), list)) : (list)),\n onRenderDetailsFooter(__assign({}, detailsFooterProps)))));\n};\nvar DetailsListBase = /** @class */ (function (_super) {\n __extends(DetailsListBase, _super);\n function DetailsListBase(props) {\n var _this = _super.call(this, props) || this;\n _this._root = React.createRef();\n _this._header = React.createRef();\n _this._groupedList = React.createRef();\n _this._list = React.createRef();\n _this._focusZone = React.createRef();\n _this._selectionZone = React.createRef();\n _this._onRenderRow = function (props, defaultRender) {\n return React.createElement(DetailsRow, __assign({}, props));\n };\n _this._getDerivedStateFromProps = function (nextProps, previousState) {\n var _a = _this.props, checkboxVisibility = _a.checkboxVisibility, items = _a.items, setKey = _a.setKey, _b = _a.selectionMode, selectionMode = _b === void 0 ? _this._selection.mode : _b, columns = _a.columns, viewport = _a.viewport, compact = _a.compact, dragDropEvents = _a.dragDropEvents;\n var _c = (_this.props.groupProps || {}).isAllGroupsCollapsed, isAllGroupsCollapsed = _c === void 0 ? undefined : _c;\n var newViewportWidth = (nextProps.viewport && nextProps.viewport.width) || 0;\n var oldViewportWidth = (viewport && viewport.width) || 0;\n var shouldResetSelection = nextProps.setKey !== setKey || nextProps.setKey === undefined;\n var shouldForceUpdates = false;\n if (nextProps.layoutMode !== _this.props.layoutMode) {\n shouldForceUpdates = true;\n }\n var nextState = previousState;\n if (shouldResetSelection) {\n _this._initialFocusedIndex = nextProps.initialFocusedIndex;\n // reset focusedItemIndex when setKey changes\n nextState = __assign(__assign({}, nextState), { focusedItemIndex: _this._initialFocusedIndex !== undefined ? _this._initialFocusedIndex : -1 });\n }\n if (!_this.props.disableSelectionZone && nextProps.items !== items) {\n _this._selection.setItems(nextProps.items, shouldResetSelection);\n }\n if (nextProps.checkboxVisibility !== checkboxVisibility ||\n nextProps.columns !== columns ||\n newViewportWidth !== oldViewportWidth ||\n nextProps.compact !== compact) {\n shouldForceUpdates = true;\n }\n nextState = __assign(__assign({}, nextState), _this._adjustColumns(nextProps, nextState, true));\n if (nextProps.selectionMode !== selectionMode) {\n shouldForceUpdates = true;\n }\n if (isAllGroupsCollapsed === undefined &&\n nextProps.groupProps &&\n nextProps.groupProps.isAllGroupsCollapsed !== undefined) {\n nextState = __assign(__assign({}, nextState), { isCollapsed: nextProps.groupProps.isAllGroupsCollapsed, isSomeGroupExpanded: !nextProps.groupProps.isAllGroupsCollapsed });\n }\n if (nextProps.dragDropEvents !== dragDropEvents) {\n _this._dragDropHelper && _this._dragDropHelper.dispose();\n _this._dragDropHelper = nextProps.dragDropEvents\n ? new DragDropHelper({\n selection: _this._selection,\n minimumPixelsForDrag: nextProps.minimumPixelsForDrag,\n })\n : undefined;\n shouldForceUpdates = true;\n }\n if (shouldForceUpdates) {\n nextState = __assign(__assign({}, nextState), { version: {} });\n }\n return nextState;\n };\n _this._onGroupExpandStateChanged = function (isSomeGroupExpanded) {\n _this.setState({ isSomeGroupExpanded: isSomeGroupExpanded });\n };\n _this._onColumnIsSizingChanged = function (column, isSizing) {\n _this.setState({ isSizing: isSizing });\n };\n _this._onRowDidMount = function (row) {\n var _a = row.props, item = _a.item, itemIndex = _a.itemIndex;\n var itemKey = _this._getItemKey(item, itemIndex);\n _this._activeRows[itemKey] = row; // this is used for column auto resize\n _this._setFocusToRowIfPending(row);\n var onRowDidMount = _this.props.onRowDidMount;\n if (onRowDidMount) {\n onRowDidMount(item, itemIndex);\n }\n };\n _this._onRowWillUnmount = function (row) {\n var onRowWillUnmount = _this.props.onRowWillUnmount;\n var _a = row.props, item = _a.item, itemIndex = _a.itemIndex;\n var itemKey = _this._getItemKey(item, itemIndex);\n delete _this._activeRows[itemKey];\n if (onRowWillUnmount) {\n onRowWillUnmount(item, itemIndex);\n }\n };\n _this._onToggleCollapse = function (collapsed) {\n _this.setState({\n isCollapsed: collapsed,\n });\n if (_this._groupedList.current) {\n _this._groupedList.current.toggleCollapseAll(collapsed);\n }\n };\n _this._onColumnResized = function (resizingColumn, newWidth, resizingColumnIndex) {\n var newCalculatedWidth = Math.max(resizingColumn.minWidth || MIN_COLUMN_WIDTH, newWidth);\n if (_this.props.onColumnResize) {\n _this.props.onColumnResize(resizingColumn, newCalculatedWidth, resizingColumnIndex);\n }\n _this._rememberCalculatedWidth(resizingColumn, newCalculatedWidth);\n _this.setState(__assign(__assign({}, _this._adjustColumns(_this.props, _this.state, true, resizingColumnIndex)), { version: {} }));\n };\n /**\n * Callback function when double clicked on the details header column resizer\n * which will measure the column cells of all the active rows and resize the\n * column to the max cell width.\n *\n * @param column - double clicked column definition\n * @param columnIndex - double clicked column index\n * TODO: min width 100 should be changed to const value and should be consistent with the\n * value used on _onSizerMove method in DetailsHeader\n */\n _this._onColumnAutoResized = function (column, columnIndex) {\n var max = 0;\n var count = 0;\n var totalCount = Object.keys(_this._activeRows).length;\n for (var key in _this._activeRows) {\n if (_this._activeRows.hasOwnProperty(key)) {\n var currentRow = _this._activeRows[key];\n currentRow.measureCell(columnIndex, function (width) {\n max = Math.max(max, width);\n count++;\n if (count === totalCount) {\n _this._onColumnResized(column, max, columnIndex);\n }\n });\n }\n }\n };\n /**\n * Call back function when an element in FocusZone becomes active. It will translate it into item\n * and call onActiveItemChanged callback if specified.\n *\n * @param row - element that became active in Focus Zone\n * @param focus - event from Focus Zone\n */\n _this._onActiveRowChanged = function (el, ev) {\n var _a = _this.props, items = _a.items, onActiveItemChanged = _a.onActiveItemChanged;\n if (!el) {\n return;\n }\n // Check and assign index only if the event was raised from any DetailsRow element\n if (el.getAttribute('data-item-index')) {\n var index = Number(el.getAttribute('data-item-index'));\n if (index >= 0) {\n if (onActiveItemChanged) {\n onActiveItemChanged(items[index], index, ev);\n }\n _this.setState({\n focusedItemIndex: index,\n });\n }\n }\n };\n _this._onBlur = function (event) {\n _this.setState({\n focusedItemIndex: -1,\n });\n };\n initializeComponentRef(_this);\n _this._async = new Async(_this);\n _this._activeRows = {};\n _this._columnOverrides = {};\n _this.state = {\n focusedItemIndex: -1,\n lastWidth: 0,\n adjustedColumns: _this._getAdjustedColumns(props, undefined),\n isSizing: false,\n isCollapsed: props.groupProps && props.groupProps.isAllGroupsCollapsed,\n isSomeGroupExpanded: props.groupProps && !props.groupProps.isAllGroupsCollapsed,\n version: {},\n getDerivedStateFromProps: _this._getDerivedStateFromProps,\n };\n warnMutuallyExclusive(COMPONENT_NAME, props, {\n selection: 'getKey',\n });\n _this._selection =\n props.selection ||\n new Selection({\n onSelectionChanged: undefined,\n getKey: props.getKey,\n selectionMode: props.selectionMode,\n });\n if (!_this.props.disableSelectionZone) {\n _this._selection.setItems(props.items, false);\n }\n _this._dragDropHelper = props.dragDropEvents\n ? new DragDropHelper({\n selection: _this._selection,\n minimumPixelsForDrag: props.minimumPixelsForDrag,\n })\n : undefined;\n _this._initialFocusedIndex = props.initialFocusedIndex;\n return _this;\n }\n DetailsListBase.getDerivedStateFromProps = function (nextProps, previousState) {\n return previousState.getDerivedStateFromProps(nextProps, previousState);\n };\n DetailsListBase.prototype.scrollToIndex = function (index, measureItem, scrollToMode) {\n this._list.current && this._list.current.scrollToIndex(index, measureItem, scrollToMode);\n this._groupedList.current && this._groupedList.current.scrollToIndex(index, measureItem, scrollToMode);\n };\n DetailsListBase.prototype.focusIndex = function (index, forceIntoFirstElement, measureItem, scrollToMode) {\n if (forceIntoFirstElement === void 0) { forceIntoFirstElement = false; }\n var item = this.props.items[index];\n if (item) {\n this.scrollToIndex(index, measureItem, scrollToMode);\n var itemKey = this._getItemKey(item, index);\n var row = this._activeRows[itemKey];\n if (row) {\n this._setFocusToRow(row, forceIntoFirstElement);\n }\n }\n };\n DetailsListBase.prototype.getStartItemIndexInView = function () {\n if (this._list && this._list.current) {\n return this._list.current.getStartItemIndexInView();\n }\n else if (this._groupedList && this._groupedList.current) {\n return this._groupedList.current.getStartItemIndexInView();\n }\n return 0;\n };\n DetailsListBase.prototype.updateColumn = function (column, options) {\n var _a, _b;\n var NO_COLUMNS = [];\n var _c = this.props, _d = _c.columns, columns = _d === void 0 ? NO_COLUMNS : _d, selectionMode = _c.selectionMode, checkboxVisibility = _c.checkboxVisibility, columnReorderOptions = _c.columnReorderOptions;\n var width = options.width, newColumnIndex = options.newColumnIndex;\n var index = columns.findIndex(function (col) { return col.key === column.key; });\n if (width) {\n this._onColumnResized(column, width, index);\n }\n if (newColumnIndex !== undefined && columnReorderOptions) {\n var isCheckboxColumnHidden = selectionMode === SelectionMode.none || checkboxVisibility === CheckboxVisibility.hidden;\n var showCheckbox = checkboxVisibility !== CheckboxVisibility.hidden;\n var columnIndex = (showCheckbox ? 2 : 1) + index;\n var draggedIndex = isCheckboxColumnHidden ? columnIndex - 1 : columnIndex - 2;\n var targetIndex = isCheckboxColumnHidden ? newColumnIndex - 1 : newColumnIndex - 2;\n var frozenColumnCountFromStart = (_a = columnReorderOptions.frozenColumnCountFromStart) !== null && _a !== void 0 ? _a : 0;\n var frozenColumnCountFromEnd = (_b = columnReorderOptions.frozenColumnCountFromEnd) !== null && _b !== void 0 ? _b : 0;\n var isValidTargetIndex = targetIndex >= frozenColumnCountFromStart && targetIndex < columns.length - frozenColumnCountFromEnd;\n if (isValidTargetIndex) {\n if (columnReorderOptions.onColumnDrop) {\n var dragDropDetails = {\n draggedIndex: draggedIndex,\n targetIndex: targetIndex,\n };\n columnReorderOptions.onColumnDrop(dragDropDetails);\n /* eslint-disable @typescript-eslint/no-deprecated */\n }\n else if (columnReorderOptions.handleColumnReorder) {\n columnReorderOptions.handleColumnReorder(draggedIndex, targetIndex);\n /* eslint-enable @typescript-eslint/no-deprecated */\n }\n }\n }\n };\n DetailsListBase.prototype.componentWillUnmount = function () {\n if (this._dragDropHelper) {\n // TODO If the DragDropHelper was passed via props, this will dispose it, which is incorrect behavior.\n this._dragDropHelper.dispose();\n }\n this._async.dispose();\n };\n DetailsListBase.prototype.componentDidUpdate = function (prevProps, prevState) {\n this._notifyColumnsResized();\n var doc = getDocumentEx(this.context);\n if (this._initialFocusedIndex !== undefined) {\n var item = this.props.items[this._initialFocusedIndex];\n if (item) {\n var itemKey = this._getItemKey(item, this._initialFocusedIndex);\n var row = this._activeRows[itemKey];\n if (row) {\n this._setFocusToRowIfPending(row);\n }\n }\n }\n if (this.props.items !== prevProps.items &&\n this.props.items.length > 0 &&\n this.state.focusedItemIndex !== -1 &&\n !elementContains(this._root.current, doc === null || doc === void 0 ? void 0 : doc.activeElement, false)) {\n // Item set has changed and previously-focused item is gone.\n // Set focus to item at index of previously-focused item if it is in range,\n // else set focus to the last item.\n var index = this.state.focusedItemIndex < this.props.items.length\n ? this.state.focusedItemIndex\n : this.props.items.length - 1;\n var item = this.props.items[index];\n var itemKey = this._getItemKey(item, this.state.focusedItemIndex);\n var row = this._activeRows[itemKey];\n if (row) {\n this._setFocusToRow(row);\n }\n else {\n this._initialFocusedIndex = index;\n }\n }\n if (this.props.onDidUpdate) {\n this.props.onDidUpdate(this);\n }\n };\n DetailsListBase.prototype.render = function () {\n return (React.createElement(DetailsListInner, __assign({}, this.props, this.state, { selection: this._selection, dragDropHelper: this._dragDropHelper, rootRef: this._root, listRef: this._list, groupedListRef: this._groupedList, focusZoneRef: this._focusZone, headerRef: this._header, selectionZoneRef: this._selectionZone, onGroupExpandStateChanged: this._onGroupExpandStateChanged, onColumnIsSizingChanged: this._onColumnIsSizingChanged, onRowDidMount: this._onRowDidMount, onRowWillUnmount: this._onRowWillUnmount, onColumnResized: this._onColumnResized, onColumnAutoResized: this._onColumnAutoResized, onToggleCollapse: this._onToggleCollapse, onActiveRowChanged: this._onActiveRowChanged, onBlur: this._onBlur, onRenderDefaultRow: this._onRenderRow })));\n };\n DetailsListBase.prototype.forceUpdate = function () {\n _super.prototype.forceUpdate.call(this);\n this._forceListUpdates();\n };\n DetailsListBase.prototype._getGroupNestingDepth = function () {\n var groups = this.props.groups;\n var level = 0;\n var groupsInLevel = groups;\n while (groupsInLevel && groupsInLevel.length > 0) {\n level++;\n groupsInLevel = groupsInLevel[0].children;\n }\n return level;\n };\n DetailsListBase.prototype._setFocusToRowIfPending = function (row) {\n var itemIndex = row.props.itemIndex;\n if (this._initialFocusedIndex !== undefined && itemIndex === this._initialFocusedIndex) {\n this._setFocusToRow(row);\n delete this._initialFocusedIndex;\n }\n };\n DetailsListBase.prototype._setFocusToRow = function (row, forceIntoFirstElement) {\n if (forceIntoFirstElement === void 0) { forceIntoFirstElement = false; }\n if (this._selectionZone.current) {\n this._selectionZone.current.ignoreNextFocus();\n }\n this._async.setTimeout(function () {\n row.focus(forceIntoFirstElement);\n }, 0);\n };\n DetailsListBase.prototype._forceListUpdates = function () {\n if (this._groupedList.current) {\n this._groupedList.current.forceUpdate();\n }\n if (this._list.current) {\n this._list.current.forceUpdate();\n }\n };\n DetailsListBase.prototype._notifyColumnsResized = function () {\n this.state.adjustedColumns.forEach(function (column) {\n if (column.onColumnResize) {\n column.onColumnResize(column.currentWidth);\n }\n });\n };\n DetailsListBase.prototype._adjustColumns = function (newProps, previousState, forceUpdate, resizingColumnIndex) {\n var adjustedColumns = this._getAdjustedColumns(newProps, previousState, forceUpdate, resizingColumnIndex);\n var viewport = this.props.viewport;\n var viewportWidth = viewport && viewport.width ? viewport.width : 0;\n return __assign(__assign({}, previousState), { adjustedColumns: adjustedColumns, lastWidth: viewportWidth });\n };\n /** Returns adjusted columns, given the viewport size and layout mode. */\n DetailsListBase.prototype._getAdjustedColumns = function (newProps, previousState, forceUpdate, resizingColumnIndex) {\n var _this = this;\n var newItems = newProps.items, layoutMode = newProps.layoutMode, selectionMode = newProps.selectionMode, viewport = newProps.viewport;\n var viewportWidth = viewport && viewport.width ? viewport.width : 0;\n var newColumns = newProps.columns;\n var columns = this.props ? this.props.columns : [];\n var lastWidth = previousState ? previousState.lastWidth : -1;\n var lastSelectionMode = previousState ? previousState.lastSelectionMode : undefined;\n if (!forceUpdate &&\n lastWidth === viewportWidth &&\n lastSelectionMode === selectionMode &&\n (!columns || newColumns === columns)) {\n return newColumns || [];\n }\n newColumns = newColumns || buildColumns(newItems, true);\n var adjustedColumns;\n if (layoutMode === DetailsListLayoutMode.fixedColumns) {\n adjustedColumns = this._getFixedColumns(newColumns, viewportWidth, newProps);\n // Preserve adjusted column calculated widths.\n adjustedColumns.forEach(function (column) {\n _this._rememberCalculatedWidth(column, column.calculatedWidth);\n });\n }\n else {\n adjustedColumns = this._getJustifiedColumns(newColumns, viewportWidth, newProps);\n adjustedColumns.forEach(function (column) {\n _this._getColumnOverride(column.key).currentWidth = column.calculatedWidth;\n });\n }\n return adjustedColumns;\n };\n /** Builds a set of columns based on the given columns mixed with the current overrides. */\n DetailsListBase.prototype._getFixedColumns = function (newColumns, viewportWidth, props) {\n var _this = this;\n var _a = this.props, _b = _a.selectionMode, selectionMode = _b === void 0 ? this._selection.mode : _b, checkboxVisibility = _a.checkboxVisibility, flexMargin = _a.flexMargin, skipViewportMeasures = _a.skipViewportMeasures;\n var remainingWidth = viewportWidth - (flexMargin || 0);\n var sumProportionalWidth = 0;\n newColumns.forEach(function (col) {\n if (skipViewportMeasures || !col.flexGrow) {\n remainingWidth -= col.maxWidth || col.minWidth || MIN_COLUMN_WIDTH;\n }\n else {\n remainingWidth -= col.minWidth || MIN_COLUMN_WIDTH;\n sumProportionalWidth += col.flexGrow;\n }\n remainingWidth -= getPaddedWidth(col, props, true);\n });\n var rowCheckWidth = selectionMode !== SelectionMode.none && checkboxVisibility !== CheckboxVisibility.hidden ? CHECKBOX_WIDTH : 0;\n var groupExpandWidth = this._getGroupNestingDepth() * GROUP_EXPAND_WIDTH;\n remainingWidth -= rowCheckWidth + groupExpandWidth;\n var widthFraction = remainingWidth / sumProportionalWidth;\n // Shrinks proportional columns to their max width and adds the remaining width to distribute to other columns.\n if (!skipViewportMeasures) {\n newColumns.forEach(function (column) {\n var newColumn = __assign(__assign({}, column), _this._columnOverrides[column.key]);\n if (newColumn.flexGrow && newColumn.maxWidth) {\n var fullWidth = newColumn.flexGrow * widthFraction + newColumn.minWidth;\n var shrinkWidth = fullWidth - newColumn.maxWidth;\n if (shrinkWidth > 0) {\n remainingWidth += shrinkWidth;\n sumProportionalWidth -= (shrinkWidth / (fullWidth - newColumn.minWidth)) * newColumn.flexGrow;\n }\n }\n });\n }\n widthFraction = remainingWidth > 0 ? remainingWidth / sumProportionalWidth : 0;\n return newColumns.map(function (column) {\n var newColumn = __assign(__assign({}, column), _this._columnOverrides[column.key]);\n // Delay computation until viewport width is available.\n if (!skipViewportMeasures && newColumn.flexGrow && remainingWidth <= 0 && viewportWidth === 0) {\n return newColumn;\n }\n if (!newColumn.calculatedWidth) {\n if (!skipViewportMeasures && newColumn.flexGrow) {\n // Assigns the proportion of the remaining extra width after all columns have met minimum widths.\n newColumn.calculatedWidth = newColumn.minWidth + newColumn.flexGrow * widthFraction;\n newColumn.calculatedWidth = Math.min(newColumn.calculatedWidth, newColumn.maxWidth || Number.MAX_VALUE);\n }\n else {\n newColumn.calculatedWidth = newColumn.maxWidth || newColumn.minWidth || MIN_COLUMN_WIDTH;\n }\n }\n return newColumn;\n });\n };\n /** Builds a set of columns to fix within the viewport width. */\n DetailsListBase.prototype._getJustifiedColumns = function (newColumns, viewportWidth, props) {\n var _this = this;\n var _a = props.selectionMode, selectionMode = _a === void 0 ? this._selection.mode : _a, checkboxVisibility = props.checkboxVisibility, skipViewportMeasures = props.skipViewportMeasures;\n var rowCheckWidth = selectionMode !== SelectionMode.none && checkboxVisibility !== CheckboxVisibility.hidden ? CHECKBOX_WIDTH : 0;\n var groupExpandWidth = this._getGroupNestingDepth() * GROUP_EXPAND_WIDTH;\n var totalWidth = 0; // offset because we have one less inner padding.\n var minimumWidth = 0;\n var availableWidth = viewportWidth - (rowCheckWidth + groupExpandWidth);\n var adjustedColumns = newColumns.map(function (column, i) {\n var baseColumn = __assign(__assign({}, column), { calculatedWidth: column.minWidth || MIN_COLUMN_WIDTH });\n var newColumn = __assign(__assign({}, baseColumn), _this._columnOverrides[column.key]);\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n if (!(baseColumn.isCollapsible || baseColumn.isCollapsable)) {\n minimumWidth += getPaddedWidth(baseColumn, props);\n }\n totalWidth += getPaddedWidth(newColumn, props);\n return newColumn;\n });\n if (skipViewportMeasures) {\n return adjustedColumns;\n }\n var lastIndex = adjustedColumns.length - 1;\n // Shrink or remove collapsable columns.\n while (lastIndex >= 0 && totalWidth > availableWidth) {\n var column = adjustedColumns[lastIndex];\n var minWidth = column.minWidth || MIN_COLUMN_WIDTH;\n var overflowWidth = totalWidth - availableWidth;\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n if (column.calculatedWidth - minWidth >= overflowWidth || !(column.isCollapsible || column.isCollapsable)) {\n var originalWidth = column.calculatedWidth;\n if (minimumWidth < availableWidth) {\n // Only adjust in cases where all the columns fit within the viewport\n column.calculatedWidth = Math.max(column.calculatedWidth - overflowWidth, minWidth);\n }\n totalWidth -= originalWidth - column.calculatedWidth;\n }\n else {\n totalWidth -= getPaddedWidth(column, props);\n adjustedColumns.splice(lastIndex, 1);\n }\n lastIndex--;\n }\n // Then expand columns starting at the beginning, until we've filled the width.\n for (var i = 0; i < adjustedColumns.length && totalWidth < availableWidth; i++) {\n var column = adjustedColumns[i];\n var isLast = i === adjustedColumns.length - 1;\n var overrides = this._columnOverrides[column.key];\n if (overrides && overrides.calculatedWidth && !isLast) {\n continue;\n }\n var spaceLeft = availableWidth - totalWidth;\n var increment = void 0;\n if (isLast) {\n increment = spaceLeft;\n }\n else {\n var maxWidth = column.maxWidth;\n var minWidth = column.minWidth || maxWidth || MIN_COLUMN_WIDTH;\n increment = maxWidth ? Math.min(spaceLeft, maxWidth - minWidth) : spaceLeft;\n }\n column.calculatedWidth = column.calculatedWidth + increment;\n totalWidth += increment;\n }\n return adjustedColumns;\n };\n DetailsListBase.prototype._rememberCalculatedWidth = function (column, newCalculatedWidth) {\n var overrides = this._getColumnOverride(column.key);\n overrides.calculatedWidth = newCalculatedWidth;\n overrides.currentWidth = newCalculatedWidth;\n };\n DetailsListBase.prototype._getColumnOverride = function (key) {\n return (this._columnOverrides[key] = this._columnOverrides[key] || {});\n };\n DetailsListBase.prototype._getItemKey = function (item, itemIndex) {\n var getKey = this.props.getKey;\n var itemKey = undefined;\n if (item) {\n itemKey = item.key;\n }\n if (getKey) {\n itemKey = getKey(item, itemIndex);\n }\n if (!itemKey) {\n itemKey = itemIndex;\n }\n return itemKey;\n };\n DetailsListBase.defaultProps = {\n layoutMode: DetailsListLayoutMode.justified,\n selectionMode: SelectionMode.multiple,\n constrainMode: ConstrainMode.horizontalConstrained,\n checkboxVisibility: CheckboxVisibility.onHover,\n isHeaderVisible: true,\n compact: false,\n useFastIcons: true,\n };\n DetailsListBase.contextType = WindowContext;\n DetailsListBase = __decorate([\n withViewport\n ], DetailsListBase);\n return DetailsListBase;\n}(React.Component));\nexport { DetailsListBase };\nexport function buildColumns(items, canResizeColumns, onColumnClick, sortedColumnKey, isSortedDescending, groupedColumnKey, isMultiline, columnActionsMode) {\n var columns = [];\n if (items && items.length) {\n var firstItem = items[0];\n for (var propName in firstItem) {\n if (firstItem.hasOwnProperty(propName)) {\n columns.push({\n key: propName,\n name: propName,\n fieldName: propName,\n minWidth: MIN_COLUMN_WIDTH,\n maxWidth: 300,\n isCollapsible: !!columns.length,\n isMultiline: isMultiline === undefined ? false : isMultiline,\n isSorted: sortedColumnKey === propName,\n isSortedDescending: !!isSortedDescending,\n isRowHeader: false,\n columnActionsMode: columnActionsMode !== null && columnActionsMode !== void 0 ? columnActionsMode : ColumnActionsMode.clickable,\n isResizable: canResizeColumns,\n onColumnClick: onColumnClick,\n isGrouped: groupedColumnKey === propName,\n });\n }\n }\n }\n return columns;\n}\nfunction getPaddedWidth(column, props, paddingOnly) {\n var _a = props.cellStyleProps, cellStyleProps = _a === void 0 ? DEFAULT_CELL_STYLE_PROPS : _a;\n return ((paddingOnly ? 0 : column.calculatedWidth) +\n cellStyleProps.cellLeftPadding +\n cellStyleProps.cellRightPadding +\n (column.isPadded ? cellStyleProps.cellExtraRightPadding : 0));\n}\nfunction getGroupNestingDepth(groups) {\n var level = 0;\n var groupsInLevel = groups;\n while (groupsInLevel && groupsInLevel.length > 0) {\n level++;\n groupsInLevel = groupsInLevel[0].children;\n }\n return level;\n}\nfunction useGroupedDetailsListIndexMap(groups) {\n return React.useMemo(function () {\n var indexMap = {};\n if (groups) {\n var rowCount = 1;\n var numGroupHeaders = 1;\n for (var _i = 0, groups_1 = groups; _i < groups_1.length; _i++) {\n var group = groups_1[_i];\n var key = group.key;\n indexMap[key] = { numOfGroupHeadersBeforeItem: numGroupHeaders, totalRowCount: rowCount };\n numGroupHeaders++;\n rowCount += group.count + 1;\n }\n }\n return indexMap;\n }, [groups]);\n}\n//# sourceMappingURL=DetailsList.base.js.map","import { styled } from '../../Utilities';\nimport { DetailsListBase } from './DetailsList.base';\nimport { getDetailsListStyles } from './DetailsList.styles';\nexport var DetailsList = styled(DetailsListBase, getDetailsListStyles, undefined, {\n scope: 'DetailsList',\n});\n//# sourceMappingURL=DetailsList.js.map","import { getGlobalClassNames } from '../../Styling';\nvar GlobalClassNames = {\n root: 'ms-DetailsList',\n compact: 'ms-DetailsList--Compact',\n contentWrapper: 'ms-DetailsList-contentWrapper',\n headerWrapper: 'ms-DetailsList-headerWrapper',\n isFixed: 'is-fixed',\n isHorizontalConstrained: 'is-horizontalConstrained',\n listCell: 'ms-List-cell',\n};\nexport var getDetailsListStyles = function (props) {\n var _a, _b;\n var theme = props.theme, className = props.className, isHorizontalConstrained = props.isHorizontalConstrained, compact = props.compact, isFixed = props.isFixed;\n var semanticColors = theme.semanticColors;\n var classNames = getGlobalClassNames(GlobalClassNames, theme);\n return {\n root: [\n classNames.root,\n theme.fonts.small,\n {\n position: 'relative',\n color: semanticColors.listText,\n selectors: (_a = {},\n _a[\"& .\".concat(classNames.listCell)] = {\n minHeight: 38,\n wordBreak: 'break-word',\n },\n _a),\n },\n isFixed && classNames.isFixed,\n compact && [\n classNames.compact,\n {\n selectors: (_b = {},\n _b[\".\".concat(classNames.listCell)] = {\n minHeight: 32,\n },\n _b),\n },\n ],\n isHorizontalConstrained && [\n classNames.isHorizontalConstrained,\n {\n overflowX: 'auto',\n overflowY: 'visible',\n WebkitOverflowScrolling: 'touch',\n },\n ],\n className,\n ],\n focusZone: [\n {\n display: 'inline-block',\n minWidth: '100%',\n minHeight: 1,\n },\n ],\n headerWrapper: classNames.headerWrapper,\n contentWrapper: classNames.contentWrapper,\n };\n};\n//# sourceMappingURL=DetailsList.styles.js.map","/**\n * Enum to describe how a particular column header behaves.\n * This is used to to specify the property `IColumn.columnActionsMode`.\n * If `IColumn.columnActionsMode` is undefined, it's equivalent to `ColumnActionsMode.clickable`.\n * {@docCategory DetailsList}\n */\nexport var ColumnActionsMode;\n(function (ColumnActionsMode) {\n /** Renders the column header as disabled. */\n ColumnActionsMode[ColumnActionsMode[\"disabled\"] = 0] = \"disabled\";\n /** Renders the column header as clickable. Default value. */\n ColumnActionsMode[ColumnActionsMode[\"clickable\"] = 1] = \"clickable\";\n /** Renders the column header as clickable and displays the dropdown chevron. */\n ColumnActionsMode[ColumnActionsMode[\"hasDropdown\"] = 2] = \"hasDropdown\";\n})(ColumnActionsMode || (ColumnActionsMode = {}));\n/**\n * {@docCategory DetailsList}\n */\nexport var ConstrainMode;\n(function (ConstrainMode) {\n /** Lets the content grow which allows the page to manage scrolling. */\n ConstrainMode[ConstrainMode[\"unconstrained\"] = 0] = \"unconstrained\";\n /** Constrains the list to the given layout space. */\n ConstrainMode[ConstrainMode[\"horizontalConstrained\"] = 1] = \"horizontalConstrained\";\n})(ConstrainMode || (ConstrainMode = {}));\n/**\n * Enum to describe where the column has been dropped, after starting the drag\n * {@docCategory DetailsList}\n */\nexport var ColumnDragEndLocation;\n(function (ColumnDragEndLocation) {\n /** Drag ended outside of current list */\n ColumnDragEndLocation[ColumnDragEndLocation[\"outside\"] = 0] = \"outside\";\n /** Drag ended within current list */\n ColumnDragEndLocation[ColumnDragEndLocation[\"surface\"] = 1] = \"surface\";\n /** Drag ended on header */\n ColumnDragEndLocation[ColumnDragEndLocation[\"header\"] = 2] = \"header\";\n})(ColumnDragEndLocation || (ColumnDragEndLocation = {}));\n/**\n * {@docCategory DetailsList}\n */\nexport var DetailsListLayoutMode;\n(function (DetailsListLayoutMode) {\n /**\n * Lets the user resize columns and makes not attempt to fit them.\n */\n DetailsListLayoutMode[DetailsListLayoutMode[\"fixedColumns\"] = 0] = \"fixedColumns\";\n /**\n * Manages which columns are visible, tries to size them according to their min/max rules and drops\n * off columns that can't fit and have isCollapsible set.\n */\n DetailsListLayoutMode[DetailsListLayoutMode[\"justified\"] = 1] = \"justified\";\n})(DetailsListLayoutMode || (DetailsListLayoutMode = {}));\n/**\n * {@docCategory DetailsList}\n */\nexport var CheckboxVisibility;\n(function (CheckboxVisibility) {\n /** Visible on hover. */\n CheckboxVisibility[CheckboxVisibility[\"onHover\"] = 0] = \"onHover\";\n /** Visible always. */\n CheckboxVisibility[CheckboxVisibility[\"always\"] = 1] = \"always\";\n /** Hide checkboxes. */\n CheckboxVisibility[CheckboxVisibility[\"hidden\"] = 2] = \"hidden\";\n})(CheckboxVisibility || (CheckboxVisibility = {}));\n//# sourceMappingURL=DetailsList.types.js.map","import { __assign, __extends } from \"tslib\";\nimport * as React from 'react';\nimport { initializeComponentRef, EventGroup, css, shallowCompare, getNativeProps, divProperties, composeComponentAs, } from '../../Utilities';\nimport { CheckboxVisibility } from './DetailsList.types';\nimport { DetailsRowCheck } from './DetailsRowCheck';\nimport { GroupSpacer } from '../GroupedList/GroupSpacer';\nimport { DetailsRowFields } from './DetailsRowFields';\nimport { FocusZone, FocusZoneDirection } from '../../FocusZone';\nimport { SelectionMode, SELECTION_CHANGE } from '../../Selection';\nimport { classNamesFunction } from '../../Utilities';\nimport { getId } from '../../Utilities';\nvar getClassNames = classNamesFunction();\nvar DEFAULT_DROPPING_CSS_CLASS = 'is-dropping';\nvar NO_COLUMNS = [];\nvar DetailsRowBase = /** @class */ (function (_super) {\n __extends(DetailsRowBase, _super);\n function DetailsRowBase(props) {\n var _this = _super.call(this, props) || this;\n _this._root = React.createRef();\n _this._cellMeasurer = React.createRef();\n _this._focusZone = React.createRef();\n _this._onSelectionChanged = function () {\n var selectionState = getSelectionState(_this.props);\n if (!shallowCompare(selectionState, _this.state.selectionState)) {\n _this.setState({ selectionState: selectionState });\n }\n };\n /**\n * update isDropping state based on the input value, which is used to change style during drag and drop\n *\n * when change to true, that means drag enter. we will add default dropping class name\n * or the custom dropping class name (return result from onDragEnter) to the root elemet.\n *\n * when change to false, that means drag leave. we will remove the dropping class name from root element.\n *\n * @param newValue - New isDropping state value\n * @param event - The event trigger dropping state change which can be dragenter, dragleave etc\n */\n _this._updateDroppingState = function (newValue, event) {\n var isDropping = _this.state.isDropping;\n var _a = _this.props, dragDropEvents = _a.dragDropEvents, item = _a.item;\n if (!newValue) {\n if (dragDropEvents.onDragLeave) {\n dragDropEvents.onDragLeave(item, event);\n }\n }\n else if (dragDropEvents.onDragEnter) {\n _this._droppingClassNames = dragDropEvents.onDragEnter(item, event);\n }\n if (isDropping !== newValue) {\n _this.setState({ isDropping: newValue });\n }\n };\n initializeComponentRef(_this);\n _this._events = new EventGroup(_this);\n _this.state = {\n selectionState: getSelectionState(props),\n columnMeasureInfo: undefined,\n isDropping: false,\n };\n _this._droppingClassNames = '';\n return _this;\n }\n DetailsRowBase.getDerivedStateFromProps = function (nextProps, previousState) {\n return __assign(__assign({}, previousState), { selectionState: getSelectionState(nextProps) });\n };\n DetailsRowBase.prototype.componentDidMount = function () {\n var _a = this.props, dragDropHelper = _a.dragDropHelper, selection = _a.selection, item = _a.item, onDidMount = _a.onDidMount;\n if (dragDropHelper && this._root.current) {\n this._dragDropSubscription = dragDropHelper.subscribe(this._root.current, this._events, this._getRowDragDropOptions());\n }\n if (selection) {\n this._events.on(selection, SELECTION_CHANGE, this._onSelectionChanged);\n }\n if (onDidMount && item) {\n // If the item appears later, we should wait for it before calling this method.\n this._onDidMountCalled = true;\n onDidMount(this);\n }\n };\n DetailsRowBase.prototype.componentDidUpdate = function (previousProps) {\n var state = this.state;\n var _a = this.props, item = _a.item, onDidMount = _a.onDidMount;\n var columnMeasureInfo = state.columnMeasureInfo;\n if (this.props.itemIndex !== previousProps.itemIndex ||\n this.props.item !== previousProps.item ||\n this.props.dragDropHelper !== previousProps.dragDropHelper) {\n if (this._dragDropSubscription) {\n this._dragDropSubscription.dispose();\n delete this._dragDropSubscription;\n }\n if (this.props.dragDropHelper && this._root.current) {\n this._dragDropSubscription = this.props.dragDropHelper.subscribe(this._root.current, this._events, this._getRowDragDropOptions());\n }\n }\n if (columnMeasureInfo && columnMeasureInfo.index >= 0 && this._cellMeasurer.current) {\n var newWidth = this._cellMeasurer.current.getBoundingClientRect().width;\n columnMeasureInfo.onMeasureDone(newWidth);\n this.setState({\n columnMeasureInfo: undefined,\n });\n }\n if (item && onDidMount && !this._onDidMountCalled) {\n this._onDidMountCalled = true;\n onDidMount(this);\n }\n };\n DetailsRowBase.prototype.componentWillUnmount = function () {\n var _a = this.props, item = _a.item, onWillUnmount = _a.onWillUnmount;\n // Only call the onWillUnmount callback if we have an item.\n if (onWillUnmount && item) {\n onWillUnmount(this);\n }\n if (this._dragDropSubscription) {\n this._dragDropSubscription.dispose();\n delete this._dragDropSubscription;\n }\n this._events.dispose();\n };\n DetailsRowBase.prototype.shouldComponentUpdate = function (nextProps, nextState) {\n if (this.props.useReducedRowRenderer) {\n var newSelectionState = getSelectionState(nextProps);\n if (this.state.selectionState.isSelected !== newSelectionState.isSelected) {\n return true;\n }\n return !shallowCompare(this.props, nextProps);\n }\n else {\n return true;\n }\n };\n DetailsRowBase.prototype.render = function () {\n var _a;\n var _b = this.props, className = _b.className, _c = _b.columns, columns = _c === void 0 ? NO_COLUMNS : _c, dragDropEvents = _b.dragDropEvents, item = _b.item, itemIndex = _b.itemIndex, id = _b.id, _d = _b.flatIndexOffset, flatIndexOffset = _d === void 0 ? 2 : _d, _e = _b.onRenderCheck, onRenderCheck = _e === void 0 ? this._onRenderCheck : _e, onRenderDetailsCheckbox = _b.onRenderDetailsCheckbox, onRenderItemColumn = _b.onRenderItemColumn, onRenderField = _b.onRenderField, getCellValueKey = _b.getCellValueKey, selectionMode = _b.selectionMode, checkboxVisibility = _b.checkboxVisibility, getRowAriaLabel = _b.getRowAriaLabel, getRowAriaDescription = _b.getRowAriaDescription, getRowAriaDescribedBy = _b.getRowAriaDescribedBy, isGridRow = _b.isGridRow, checkButtonAriaLabel = _b.checkButtonAriaLabel, checkboxCellClassName = _b.checkboxCellClassName, \n /** Alias rowFieldsAs as RowFields and default to DetailsRowFields if rowFieldsAs does not exist */\n rowFieldsAs = _b.rowFieldsAs, selection = _b.selection, indentWidth = _b.indentWidth, enableUpdateAnimations = _b.enableUpdateAnimations, compact = _b.compact, theme = _b.theme, styles = _b.styles, cellsByColumn = _b.cellsByColumn, groupNestingDepth = _b.groupNestingDepth, _f = _b.useFastIcons, useFastIcons = _f === void 0 ? true : _f, cellStyleProps = _b.cellStyleProps, group = _b.group, focusZoneProps = _b.focusZoneProps, _g = _b.disabled, disabled = _g === void 0 ? false : _g;\n var _h = this.state, columnMeasureInfo = _h.columnMeasureInfo, isDropping = _h.isDropping;\n var _j = this.state.selectionState, _k = _j.isSelected, isSelected = _k === void 0 ? false : _k, _l = _j.isSelectionModal, isSelectionModal = _l === void 0 ? false : _l;\n var isDraggable = dragDropEvents ? !!(dragDropEvents.canDrag && dragDropEvents.canDrag(item)) : undefined;\n var droppingClassName = isDropping ? this._droppingClassNames || DEFAULT_DROPPING_CSS_CLASS : '';\n var ariaLabel = getRowAriaLabel ? getRowAriaLabel(item) : undefined;\n var ariaRowDescription = getRowAriaDescription ? getRowAriaDescription(item) : undefined;\n var ariaDescribedBy = getRowAriaDescribedBy ? getRowAriaDescribedBy(item) : undefined;\n var canSelect = !!selection && selection.canSelectItem(item, itemIndex) && !disabled;\n var isContentUnselectable = selectionMode === SelectionMode.multiple;\n var showCheckbox = selectionMode !== SelectionMode.none && checkboxVisibility !== CheckboxVisibility.hidden;\n var ariaSelected = selectionMode === SelectionMode.none ? undefined : isSelected;\n var ariaPositionInSet = group ? itemIndex - group.startIndex + 1 : undefined;\n var ariaSetSize = group ? group.count : undefined;\n var focusZoneDirection = focusZoneProps ? focusZoneProps.direction : FocusZoneDirection.horizontal;\n this._classNames = __assign(__assign({}, this._classNames), getClassNames(styles, {\n theme: theme,\n isSelected: isSelected,\n canSelect: !isContentUnselectable,\n anySelected: isSelectionModal,\n checkboxCellClassName: checkboxCellClassName,\n droppingClassName: droppingClassName,\n className: className,\n compact: compact,\n enableUpdateAnimations: enableUpdateAnimations,\n cellStyleProps: cellStyleProps,\n disabled: disabled,\n }));\n var rowClassNames = {\n isMultiline: this._classNames.isMultiline,\n isRowHeader: this._classNames.isRowHeader,\n cell: this._classNames.cell,\n cellAnimation: this._classNames.cellAnimation,\n cellPadded: this._classNames.cellPadded,\n cellUnpadded: this._classNames.cellUnpadded,\n fields: this._classNames.fields,\n };\n // Only re-assign rowClassNames when classNames have changed.\n // Otherwise, they will cause DetailsRowFields to unnecessarily\n // re-render, see https://github.com/microsoft/fluentui/pull/8799.\n // Refactor DetailsRowFields to generate own styles to remove need for this.\n if (!shallowCompare(this._rowClassNames || {}, rowClassNames)) {\n this._rowClassNames = rowClassNames;\n }\n var RowFields = rowFieldsAs ? composeComponentAs(rowFieldsAs, DetailsRowFields) : DetailsRowFields;\n var rowFields = (React.createElement(RowFields, { rowClassNames: this._rowClassNames, rowHeaderId: \"\".concat(id, \"-header\"), cellsByColumn: cellsByColumn, columns: columns, item: item, itemIndex: itemIndex, isSelected: isSelected, columnStartIndex: (showCheckbox ? 1 : 0) + (groupNestingDepth ? 1 : 0), onRenderItemColumn: onRenderItemColumn, onRenderField: onRenderField, getCellValueKey: getCellValueKey, enableUpdateAnimations: enableUpdateAnimations, cellStyleProps: cellStyleProps }));\n var defaultRole = 'row';\n var role = this.props.role ? this.props.role : defaultRole;\n this._ariaRowDescriptionId = getId('DetailsRow-description');\n // When the user does not specify any column is a row-header in the columns props,\n // The aria-labelledby of the checkbox does not specify {id}-header.\n var hasRowHeader = columns.some(function (column) {\n return !!column.isRowHeader;\n });\n var ariaLabelledby = \"\".concat(id, \"-checkbox\") + (hasRowHeader ? \" \".concat(id, \"-header\") : '');\n // additional props for rows within a GroupedList\n // these are needed for treegrid row semantics, but not grid row semantics\n var groupedListRowProps = isGridRow\n ? {}\n : {\n 'aria-level': (groupNestingDepth && groupNestingDepth + 1) || undefined,\n 'aria-posinset': ariaPositionInSet,\n 'aria-setsize': ariaSetSize,\n };\n return (React.createElement(FocusZone, __assign({ \"data-is-focusable\": true }, getNativeProps(this.props, divProperties), (typeof isDraggable === 'boolean'\n ? {\n 'data-is-draggable': isDraggable, // This data attribute is used by some host applications.\n draggable: isDraggable,\n }\n : {}), focusZoneProps, groupedListRowProps, { direction: focusZoneDirection, elementRef: this._root, componentRef: this._focusZone, role: role, \"aria-label\": ariaLabel, \"aria-disabled\": disabled || undefined, \"aria-describedby\": ariaRowDescription ? this._ariaRowDescriptionId : ariaDescribedBy, className: this._classNames.root, \"data-selection-index\": itemIndex, \"data-selection-touch-invoke\": true, \"data-selection-disabled\": (_a = this.props['data-selection-disabled']) !== null && _a !== void 0 ? _a : (disabled || undefined), \"data-item-index\": itemIndex, \"aria-rowindex\": ariaPositionInSet === undefined ? itemIndex + flatIndexOffset : undefined, \"data-automationid\": \"DetailsRow\", \"aria-selected\": ariaSelected, allowFocusRoot: true }),\n ariaRowDescription ? (React.createElement(\"span\", { key: \"description\", role: \"presentation\", hidden: true, id: this._ariaRowDescriptionId }, ariaRowDescription)) : null,\n showCheckbox && (React.createElement(\"div\", { role: \"gridcell\", \"data-selection-toggle\": true, className: this._classNames.checkCell }, onRenderCheck({\n id: id ? \"\".concat(id, \"-checkbox\") : undefined,\n selected: isSelected,\n selectionMode: selectionMode,\n anySelected: isSelectionModal,\n 'aria-label': checkButtonAriaLabel,\n 'aria-labelledby': id ? ariaLabelledby : undefined,\n canSelect: canSelect,\n compact: compact,\n className: this._classNames.check,\n theme: theme,\n isVisible: checkboxVisibility === CheckboxVisibility.always,\n onRenderDetailsCheckbox: onRenderDetailsCheckbox,\n useFastIcons: useFastIcons,\n }))),\n React.createElement(GroupSpacer, { indentWidth: indentWidth, role: \"gridcell\", count: groupNestingDepth === 0 ? -1 : groupNestingDepth }),\n item && rowFields,\n columnMeasureInfo && (React.createElement(\"span\", { role: \"presentation\", className: css(this._classNames.cellMeasurer, this._classNames.cell), ref: this._cellMeasurer },\n React.createElement(RowFields, { rowClassNames: this._rowClassNames, rowHeaderId: \"\".concat(id, \"-header\"), columns: [columnMeasureInfo.column], item: item, itemIndex: itemIndex, columnStartIndex: (showCheckbox ? 1 : 0) + (groupNestingDepth ? 1 : 0) + columns.length, onRenderItemColumn: onRenderItemColumn, getCellValueKey: getCellValueKey })))));\n };\n /**\n * measure cell at index. and call the call back with the measured cell width when finish measure\n *\n * @param index - The cell index\n * @param onMeasureDone - The call back function when finish measure\n */\n DetailsRowBase.prototype.measureCell = function (index, onMeasureDone) {\n var _a = this.props.columns, columns = _a === void 0 ? NO_COLUMNS : _a;\n var column = __assign({}, columns[index]);\n column.minWidth = 0;\n column.maxWidth = 999999;\n delete column.calculatedWidth;\n this.setState({\n columnMeasureInfo: {\n index: index,\n column: column,\n onMeasureDone: onMeasureDone,\n },\n });\n };\n DetailsRowBase.prototype.focus = function (forceIntoFirstElement) {\n var _a;\n if (forceIntoFirstElement === void 0) { forceIntoFirstElement = false; }\n return !!((_a = this._focusZone.current) === null || _a === void 0 ? void 0 : _a.focus(forceIntoFirstElement));\n };\n DetailsRowBase.prototype._onRenderCheck = function (props) {\n return React.createElement(DetailsRowCheck, __assign({}, props));\n };\n DetailsRowBase.prototype._getRowDragDropOptions = function () {\n var _a = this.props, item = _a.item, itemIndex = _a.itemIndex, dragDropEvents = _a.dragDropEvents, eventsToRegister = _a.eventsToRegister;\n var options = {\n eventMap: eventsToRegister,\n selectionIndex: itemIndex,\n context: { data: item, index: itemIndex },\n canDrag: dragDropEvents.canDrag,\n canDrop: dragDropEvents.canDrop,\n onDragStart: dragDropEvents.onDragStart,\n updateDropState: this._updateDroppingState,\n onDrop: dragDropEvents.onDrop,\n onDragEnd: dragDropEvents.onDragEnd,\n onDragOver: dragDropEvents.onDragOver,\n };\n return options;\n };\n return DetailsRowBase;\n}(React.Component));\nexport { DetailsRowBase };\nfunction getSelectionState(props) {\n var _a;\n var itemIndex = props.itemIndex, selection = props.selection;\n return {\n isSelected: !!(selection === null || selection === void 0 ? void 0 : selection.isIndexSelected(itemIndex)),\n isSelectionModal: !!((_a = selection === null || selection === void 0 ? void 0 : selection.isModal) === null || _a === void 0 ? void 0 : _a.call(selection)),\n };\n}\n//# sourceMappingURL=DetailsRow.base.js.map","import { styled } from '../../Utilities';\nimport { DetailsRowBase } from './DetailsRow.base';\nimport { getDetailsRowStyles } from './DetailsRow.styles';\nexport var DetailsRow = styled(DetailsRowBase, getDetailsRowStyles, undefined, {\n scope: 'DetailsRow',\n});\n//# sourceMappingURL=DetailsRow.js.map","import { __assign } from \"tslib\";\nimport { AnimationClassNames, AnimationStyles, HighContrastSelector, getFocusStyle, getGlobalClassNames, FontWeights, getHighContrastNoAdjustStyle, } from '../../Styling';\nimport { IsFocusVisibleClassName } from '../../Utilities';\nimport { GlobalClassNames as LinkGlobalClassNames } from '../../components/Link/Link.styles';\nexport var DetailsRowGlobalClassNames = {\n root: 'ms-DetailsRow',\n // TODO: in Fabric 7.0 lowercase the 'Compact' for consistency across other components.\n compact: 'ms-DetailsList--Compact',\n cell: 'ms-DetailsRow-cell',\n cellAnimation: 'ms-DetailsRow-cellAnimation',\n cellCheck: 'ms-DetailsRow-cellCheck',\n check: 'ms-DetailsRow-check',\n cellMeasurer: 'ms-DetailsRow-cellMeasurer',\n listCellFirstChild: 'ms-List-cell:first-child',\n isContentUnselectable: 'is-contentUnselectable',\n isSelected: 'is-selected',\n isCheckVisible: 'is-check-visible',\n isRowHeader: 'is-row-header',\n fields: 'ms-DetailsRow-fields',\n};\nvar IsFocusableSelector = \"[data-is-focusable='true']\";\nexport var DEFAULT_CELL_STYLE_PROPS = {\n cellLeftPadding: 12,\n cellRightPadding: 8,\n cellExtraRightPadding: 24,\n};\n// Source of default row heights to share.\nexport var DEFAULT_ROW_HEIGHTS = {\n rowHeight: 42,\n compactRowHeight: 32,\n};\n// Constant values\nvar values = __assign(__assign({}, DEFAULT_ROW_HEIGHTS), { rowVerticalPadding: 11, compactRowVerticalPadding: 6 });\nexport var getDetailsRowStyles = function (props) {\n var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;\n var theme = props.theme, isSelected = props.isSelected, canSelect = props.canSelect, droppingClassName = props.droppingClassName, isCheckVisible = props.isCheckVisible, checkboxCellClassName = props.checkboxCellClassName, compact = props.compact, className = props.className, _q = props.cellStyleProps, cellStyleProps = _q === void 0 ? DEFAULT_CELL_STYLE_PROPS : _q, enableUpdateAnimations = props.enableUpdateAnimations, disabled = props.disabled;\n var palette = theme.palette, fonts = theme.fonts;\n var neutralPrimary = palette.neutralPrimary, white = palette.white, neutralSecondary = palette.neutralSecondary, neutralLighter = palette.neutralLighter, neutralLight = palette.neutralLight, neutralDark = palette.neutralDark, neutralQuaternaryAlt = palette.neutralQuaternaryAlt;\n var _r = theme.semanticColors, focusBorder = _r.focusBorder, focusedLinkColor = _r.linkHovered;\n var classNames = getGlobalClassNames(DetailsRowGlobalClassNames, theme);\n var colors = {\n // Default\n defaultHeaderText: neutralPrimary,\n defaultMetaText: neutralSecondary,\n defaultBackground: white,\n // Default Hover\n defaultHoverHeaderText: neutralDark,\n defaultHoverMetaText: neutralPrimary,\n defaultHoverBackground: neutralLighter,\n // Selected\n selectedHeaderText: neutralDark,\n selectedMetaText: neutralPrimary,\n selectedBackground: neutralLight,\n // Selected Hover\n selectedHoverHeaderText: neutralDark,\n selectedHoverMetaText: neutralPrimary,\n selectedHoverBackground: neutralQuaternaryAlt,\n // Focus\n focusHeaderText: neutralDark,\n focusMetaText: neutralPrimary,\n focusBackground: neutralLight,\n focusHoverBackground: neutralQuaternaryAlt,\n };\n var rowHighContrastFocus = {\n top: 2,\n right: 2,\n bottom: 2,\n left: 2,\n };\n // Selected row styles\n var selectedStyles = [\n getFocusStyle(theme, {\n inset: -1,\n borderColor: focusBorder,\n outlineColor: white,\n highContrastStyle: rowHighContrastFocus,\n pointerEvents: 'none',\n }),\n classNames.isSelected,\n {\n color: colors.selectedMetaText,\n background: colors.selectedBackground,\n borderBottom: \"1px solid \".concat(white),\n selectors: (_a = {\n '&:before': {\n position: 'absolute',\n display: 'block',\n top: -1,\n height: 1,\n bottom: 0,\n left: 0,\n right: 0,\n content: '',\n borderTop: \"1px solid \".concat(white),\n }\n },\n _a[\".\".concat(classNames.cell, \" > .\").concat(LinkGlobalClassNames.root)] = {\n color: focusedLinkColor,\n selectors: (_b = {},\n _b[HighContrastSelector] = {\n color: 'HighlightText',\n },\n _b),\n },\n // Selected State hover\n _a['&:hover'] = {\n background: colors.selectedHoverBackground,\n color: colors.selectedHoverMetaText,\n selectors: (_c = {},\n // Selected State hover meta cell\n _c[HighContrastSelector] = {\n background: 'Highlight',\n selectors: (_d = {},\n _d[\".\".concat(classNames.cell)] = {\n color: 'HighlightText',\n },\n _d[\".\".concat(classNames.cell, \" > .\").concat(LinkGlobalClassNames.root)] = {\n forcedColorAdjust: 'none',\n color: 'HighlightText',\n },\n _d),\n },\n // Selected State hover Header cell\n _c[\".\".concat(classNames.isRowHeader)] = {\n color: colors.selectedHoverHeaderText,\n selectors: (_e = {},\n _e[HighContrastSelector] = {\n color: 'HighlightText',\n },\n _e),\n },\n _c),\n },\n // Focus state\n _a['&:focus'] = {\n background: colors.focusBackground,\n selectors: (_f = {},\n // Selected State hover meta cell\n _f[\".\".concat(classNames.cell)] = {\n color: colors.focusMetaText,\n selectors: (_g = {},\n _g[HighContrastSelector] = {\n color: 'HighlightText',\n selectors: {\n '> a': {\n color: 'HighlightText',\n },\n },\n },\n _g),\n },\n // Row header cell\n _f[\".\".concat(classNames.isRowHeader)] = {\n color: colors.focusHeaderText,\n selectors: (_h = {},\n _h[HighContrastSelector] = {\n color: 'HighlightText',\n },\n _h),\n },\n // Ensure high-contrast mode overrides default focus background\n _f[HighContrastSelector] = {\n background: 'Highlight',\n },\n _f),\n },\n _a[HighContrastSelector] = __assign(__assign({ background: 'Highlight', color: 'HighlightText' }, getHighContrastNoAdjustStyle()), { selectors: {\n a: {\n color: 'HighlightText',\n },\n } }),\n // Focus and hover state\n _a['&:focus:hover'] = {\n background: colors.focusHoverBackground,\n },\n _a),\n },\n ];\n var cannotSelectStyles = [\n classNames.isContentUnselectable,\n {\n userSelect: 'none',\n cursor: 'default',\n },\n ];\n var rootCompactStyles = {\n minHeight: values.compactRowHeight,\n border: 0,\n };\n var cellCompactStyles = {\n minHeight: values.compactRowHeight,\n paddingTop: values.compactRowVerticalPadding,\n paddingBottom: values.compactRowVerticalPadding,\n paddingLeft: \"\".concat(cellStyleProps.cellLeftPadding, \"px\"),\n };\n var defaultCellStyles = [\n getFocusStyle(theme, { inset: -1 }),\n classNames.cell,\n {\n display: 'inline-block',\n position: 'relative',\n boxSizing: 'border-box',\n minHeight: values.rowHeight,\n verticalAlign: 'top',\n whiteSpace: 'nowrap',\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n paddingTop: values.rowVerticalPadding,\n paddingBottom: values.rowVerticalPadding,\n paddingLeft: \"\".concat(cellStyleProps.cellLeftPadding, \"px\"),\n selectors: (_j = {\n '& > button': {\n maxWidth: '100%',\n }\n },\n _j[IsFocusableSelector] = getFocusStyle(theme, { inset: -1, borderColor: neutralSecondary, outlineColor: white }),\n _j),\n },\n isSelected && {\n selectors: (_k = {},\n _k[HighContrastSelector] = __assign({ background: 'Highlight', color: 'HighlightText' }, getHighContrastNoAdjustStyle()),\n _k),\n },\n compact && cellCompactStyles,\n disabled && { opacity: 0.5 },\n ];\n return {\n root: [\n classNames.root,\n AnimationClassNames.fadeIn400,\n droppingClassName,\n theme.fonts.small,\n isCheckVisible && classNames.isCheckVisible,\n getFocusStyle(theme, { borderColor: focusBorder, outlineColor: white }),\n {\n borderBottom: \"1px solid \".concat(neutralLighter),\n background: colors.defaultBackground,\n color: colors.defaultMetaText,\n // This ensures that the row always tries to consume is minimum width and does not compress.\n display: 'inline-flex',\n minWidth: '100%',\n minHeight: values.rowHeight,\n whiteSpace: 'nowrap',\n padding: 0,\n boxSizing: 'border-box',\n verticalAlign: 'top',\n textAlign: 'left',\n selectors: (_l = {},\n _l[\".\".concat(classNames.listCellFirstChild, \" &:before\")] = {\n display: 'none',\n },\n _l['&:hover'] = {\n background: colors.defaultHoverBackground,\n color: colors.defaultHoverMetaText,\n selectors: (_m = {},\n _m[\".\".concat(classNames.isRowHeader)] = {\n color: colors.defaultHoverHeaderText,\n },\n _m[\".\".concat(classNames.cell, \" > .\").concat(LinkGlobalClassNames.root)] = {\n color: focusedLinkColor,\n },\n _m),\n },\n _l[\"&:hover .\".concat(classNames.check)] = {\n opacity: 1,\n },\n // eslint-disable-next-line @fluentui/max-len\n _l[\".\".concat(IsFocusVisibleClassName, \" &:focus .\").concat(classNames.check, \", :host(.\").concat(IsFocusVisibleClassName, \") &:focus .\").concat(classNames.check)] = {\n opacity: 1,\n },\n _l['.ms-GroupSpacer'] = {\n flexShrink: 0,\n flexGrow: 0,\n },\n _l),\n },\n isSelected && selectedStyles,\n !canSelect && cannotSelectStyles,\n compact && rootCompactStyles,\n className,\n ],\n cellUnpadded: {\n paddingRight: \"\".concat(cellStyleProps.cellRightPadding, \"px\"),\n },\n cellPadded: {\n paddingRight: \"\".concat(cellStyleProps.cellExtraRightPadding + cellStyleProps.cellRightPadding, \"px\"),\n selectors: (_o = {},\n _o[\"&.\".concat(classNames.cellCheck)] = {\n paddingRight: 0,\n },\n _o),\n },\n cell: defaultCellStyles,\n cellAnimation: enableUpdateAnimations && AnimationStyles.slideLeftIn40,\n cellMeasurer: [\n classNames.cellMeasurer,\n {\n overflow: 'visible',\n whiteSpace: 'nowrap',\n },\n ],\n checkCell: [\n defaultCellStyles,\n classNames.cellCheck,\n checkboxCellClassName,\n {\n padding: 0,\n // Ensure that the check cell covers the top border of the cell.\n // This ensures the click target does not leave a spot which would\n // cause other items to be deselected.\n paddingTop: 1,\n marginTop: -1,\n flexShrink: 0,\n },\n ],\n fields: [\n classNames.fields,\n {\n display: 'flex',\n alignItems: 'stretch',\n },\n ],\n isRowHeader: [\n classNames.isRowHeader,\n {\n color: colors.defaultHeaderText,\n fontSize: fonts.medium.fontSize,\n },\n isSelected && {\n color: colors.selectedHeaderText,\n fontWeight: FontWeights.semibold,\n selectors: (_p = {},\n _p[HighContrastSelector] = {\n color: 'HighlightText',\n },\n _p),\n },\n ],\n isMultiline: [\n defaultCellStyles,\n {\n whiteSpace: 'normal',\n wordBreak: 'break-word',\n textOverflow: 'clip',\n },\n ],\n check: [classNames.check],\n };\n};\n//# sourceMappingURL=DetailsRow.styles.js.map","import { __assign, __rest } from \"tslib\";\nimport * as React from 'react';\nimport { css, styled, classNamesFunction, composeRenderFunction, getNativeElementProps } from '../../Utilities';\nimport { Check } from '../../Check';\nimport { getDetailsRowCheckStyles } from './DetailsRowCheck.styles';\nimport { SelectionMode } from '../../Selection';\nvar getClassNames = classNamesFunction();\nvar DetailsRowCheckBase = function (props) {\n var _a = props.isVisible, isVisible = _a === void 0 ? false : _a, _b = props.canSelect, canSelect = _b === void 0 ? false : _b, _c = props.anySelected, anySelected = _c === void 0 ? false : _c, _d = props.selected, selected = _d === void 0 ? false : _d, selectionMode = props.selectionMode, _e = props.isHeader, isHeader = _e === void 0 ? false : _e, className = props.className, checkClassName = props.checkClassName, styles = props.styles, theme = props.theme, compact = props.compact, onRenderDetailsCheckbox = props.onRenderDetailsCheckbox, _f = props.useFastIcons, useFastIcons = _f === void 0 ? true : _f, // must be removed from buttonProps\n buttonProps = __rest(props, [\"isVisible\", \"canSelect\", \"anySelected\", \"selected\", \"selectionMode\", \"isHeader\", \"className\", \"checkClassName\", \"styles\", \"theme\", \"compact\", \"onRenderDetailsCheckbox\", \"useFastIcons\"]);\n var defaultCheckboxRender = useFastIcons ? _fastDefaultCheckboxRender : _defaultCheckboxRender;\n var onRenderCheckbox = onRenderDetailsCheckbox\n ? composeRenderFunction(onRenderDetailsCheckbox, defaultCheckboxRender)\n : defaultCheckboxRender;\n var classNames = getClassNames(styles, {\n theme: theme,\n canSelect: canSelect,\n selected: selected,\n anySelected: anySelected,\n className: className,\n isHeader: isHeader,\n isVisible: isVisible,\n compact: compact,\n });\n var detailsCheckboxProps = {\n checked: selected,\n theme: theme,\n };\n var divProps = getNativeElementProps('div', buttonProps, ['aria-label', 'aria-labelledby', 'aria-describedby']);\n var checkRole = selectionMode === SelectionMode.single ? 'radio' : 'checkbox';\n return canSelect ? (React.createElement(\"div\", __assign({}, buttonProps, { role: checkRole, \n // eslint-disable-next-line @typescript-eslint/no-deprecated\n className: css(classNames.root, classNames.check), \"aria-checked\": selected, \"data-selection-toggle\": true, \"data-automationid\": \"DetailsRowCheck\", tabIndex: -1 }), onRenderCheckbox(detailsCheckboxProps))) : (\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n React.createElement(\"div\", __assign({}, divProps, { className: css(classNames.root, classNames.check) })));\n};\nvar FastCheck = React.memo(function (props) {\n return React.createElement(Check, { theme: props.theme, checked: props.checked, className: props.className, useFastIcons: true });\n});\nfunction _defaultCheckboxRender(checkboxProps) {\n return React.createElement(Check, { checked: checkboxProps.checked });\n}\nfunction _fastDefaultCheckboxRender(checkboxProps) {\n return React.createElement(FastCheck, { theme: checkboxProps.theme, checked: checkboxProps.checked });\n}\nexport var DetailsRowCheck = styled(DetailsRowCheckBase, getDetailsRowCheckStyles, undefined, { scope: 'DetailsRowCheck' }, true);\n//# sourceMappingURL=DetailsRowCheck.js.map","import { getGlobalClassNames, getFocusStyle } from '../../Styling';\nimport { DEFAULT_ROW_HEIGHTS } from './DetailsRow.styles';\nimport { HEADER_HEIGHT } from './DetailsHeader.styles';\nimport { CheckGlobalClassNames } from '../../components/Check/Check.styles';\nvar GlobalClassNames = {\n root: 'ms-DetailsRow-check',\n isDisabled: 'ms-DetailsRow-check--isDisabled',\n isHeader: 'ms-DetailsRow-check--isHeader',\n};\nexport var CHECK_CELL_WIDTH = 48;\nexport var getDetailsRowCheckStyles = function (props) {\n var theme = props.theme, className = props.className, isHeader = props.isHeader, selected = props.selected, anySelected = props.anySelected, canSelect = props.canSelect, compact = props.compact, isVisible = props.isVisible;\n var classNames = getGlobalClassNames(GlobalClassNames, theme);\n var rowHeight = DEFAULT_ROW_HEIGHTS.rowHeight, compactRowHeight = DEFAULT_ROW_HEIGHTS.compactRowHeight;\n var height = isHeader ? HEADER_HEIGHT : compact ? compactRowHeight : rowHeight;\n var isCheckVisible = isVisible || selected || anySelected;\n return {\n root: [classNames.root, className],\n check: [\n !canSelect && classNames.isDisabled,\n isHeader && classNames.isHeader,\n getFocusStyle(theme),\n theme.fonts.small,\n CheckGlobalClassNames.checkHost,\n {\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n cursor: 'default',\n boxSizing: 'border-box',\n verticalAlign: 'top',\n background: 'none',\n backgroundColor: 'transparent',\n border: 'none',\n opacity: isCheckVisible ? 1 : 0,\n height: height,\n width: CHECK_CELL_WIDTH,\n padding: 0,\n margin: 0,\n },\n ],\n isDisabled: [],\n };\n};\n//# sourceMappingURL=DetailsRowCheck.styles.js.map","import * as React from 'react';\nimport { composeRenderFunction, css } from '../../Utilities';\nimport { DEFAULT_CELL_STYLE_PROPS } from './DetailsRow.styles';\nvar getCellText = function (item, column) {\n var value = item && column && column.fieldName ? item[column.fieldName] : '';\n if (value === null || value === undefined) {\n value = '';\n }\n if (typeof value === 'boolean') {\n return value.toString();\n }\n return value;\n};\n/**\n * Component for rendering a row's cells in a `DetailsList`.\n *\n * {@docCategory DetailsList}\n */\nexport var DetailsRowFields = function (props) {\n var columns = props.columns, rowClassNames = props.rowClassNames, _a = props.cellStyleProps, cellStyleProps = _a === void 0 ? DEFAULT_CELL_STYLE_PROPS : _a, item = props.item, itemIndex = props.itemIndex, isSelected = props.isSelected, onRenderItemColumn = props.onRenderItemColumn, getCellValueKey = props.getCellValueKey, propsOnRenderField = props.onRenderField, cellsByColumn = props.cellsByColumn, enableUpdateAnimations = props.enableUpdateAnimations, rowHeaderId = props.rowHeaderId;\n var cellValueKeysRef = React.useRef();\n var cellValueKeys = cellValueKeysRef.current || (cellValueKeysRef.current = {});\n var defaultOnRenderField = React.useCallback(function (fieldProps) {\n var column = fieldProps.column, cellValueKey = fieldProps.cellValueKey, className = fieldProps.className, onRender = fieldProps.onRender, fieldItem = fieldProps.item, fieldItemIndex = fieldProps.itemIndex;\n var width = typeof column.calculatedWidth === 'undefined'\n ? 'auto'\n : column.calculatedWidth +\n cellStyleProps.cellLeftPadding +\n cellStyleProps.cellRightPadding +\n (column.isPadded ? cellStyleProps.cellExtraRightPadding : 0);\n var key = \"\".concat(column.key).concat(cellValueKey !== undefined ? \"-\".concat(cellValueKey) : '');\n return (React.createElement(\"div\", { key: key, id: column.isRowHeader ? rowHeaderId : undefined, role: column.isRowHeader ? 'rowheader' : 'gridcell', className: css(column.className, column.isMultiline && rowClassNames.isMultiline, column.isRowHeader && rowClassNames.isRowHeader, rowClassNames.cell, column.isPadded ? rowClassNames.cellPadded : rowClassNames.cellUnpadded, className), style: { width: width }, \"data-automationid\": \"DetailsRowCell\", \"data-automation-key\": column.key }, onRender(fieldItem, fieldItemIndex, column)));\n }, [rowClassNames, cellStyleProps, rowHeaderId]);\n return (React.createElement(\"div\", { className: rowClassNames.fields, \"data-automationid\": \"DetailsRowFields\", role: \"presentation\" }, columns.map(function (column) {\n var _a = column.getValueKey, getValueKey = _a === void 0 ? getCellValueKey : _a;\n var onRender = (cellsByColumn && column.key in cellsByColumn && (function () { return cellsByColumn[column.key]; })) ||\n column.onRender ||\n onRenderItemColumn ||\n defaultOnRender;\n var onRenderField = defaultOnRenderField;\n if (column.onRenderField) {\n onRenderField = composeRenderFunction(column.onRenderField, onRenderField);\n }\n if (propsOnRenderField) {\n onRenderField = composeRenderFunction(propsOnRenderField, onRenderField);\n }\n var previousValueKey = cellValueKeys[column.key];\n var cellValueKey = enableUpdateAnimations && getValueKey ? getValueKey(item, itemIndex, column) : undefined;\n var showAnimation = false;\n if (cellValueKey !== undefined && previousValueKey !== undefined && cellValueKey !== previousValueKey) {\n showAnimation = true;\n }\n cellValueKeys[column.key] = cellValueKey;\n return onRenderField({\n item: item,\n itemIndex: itemIndex,\n isSelected: isSelected,\n column: column,\n cellValueKey: cellValueKey,\n className: showAnimation ? rowClassNames.cellAnimation : undefined,\n onRender: onRender,\n });\n })));\n};\nfunction defaultOnRender(item, index, column) {\n if (!item || !column) {\n return null;\n }\n return getCellText(item, column);\n}\n//# sourceMappingURL=DetailsRowFields.js.map","import * as React from 'react';\nimport { classNamesFunction } from '../../Utilities';\nvar getClassNames = classNamesFunction();\nexport var VerticalDividerBase = React.forwardRef(function (props, ref) {\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n var styles = props.styles, theme = props.theme, deprecatedGetClassNames = props.getClassNames, className = props.className;\n var classNames = getClassNames(styles, { theme: theme, getClassNames: deprecatedGetClassNames, className: className });\n return (React.createElement(\"span\", { className: classNames.wrapper, ref: ref },\n React.createElement(\"span\", { className: classNames.divider })));\n});\nVerticalDividerBase.displayName = 'VerticalDividerBase';\n//# sourceMappingURL=VerticalDivider.base.js.map","import { getStyles } from './VerticalDivider.styles';\nimport { VerticalDividerBase } from './VerticalDivider.base';\nimport { styled } from '../../Utilities';\nexport var VerticalDivider = styled(VerticalDividerBase, getStyles, undefined, {\n scope: 'VerticalDivider',\n});\n//# sourceMappingURL=VerticalDivider.js.map","export var getStyles = function (props) {\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n var theme = props.theme, getClassNames = props.getClassNames, className = props.className;\n if (!theme) {\n throw new Error('Theme is undefined or null.');\n }\n if (getClassNames) {\n var names = getClassNames(theme);\n return {\n wrapper: [names.wrapper],\n divider: [names.divider],\n };\n }\n return {\n wrapper: [\n {\n display: 'inline-flex',\n height: '100%',\n alignItems: 'center',\n },\n className,\n ],\n divider: [\n {\n width: 1,\n height: '100%',\n backgroundColor: theme.palette.neutralTertiaryAlt,\n },\n ],\n };\n};\n//# sourceMappingURL=VerticalDivider.styles.js.map","import { __spreadArray } from \"tslib\";\nimport { DropdownMenuItemType } from '../Dropdown.types';\n/**\n * A utility class to cache size and position in cache.\n *\n * Dropdown options has non-selectable display types. It is therefore not cheap to determine\n * the total number of actual selectable options as well as the position an option is in the\n * list of options - O(n) cost for each lookup.\n *\n * Given that we potentially have to make this determination on every single render pass, this\n * cache should provide a little bit of relief.\n */\nvar DropdownSizePosCache = /** @class */ (function () {\n function DropdownSizePosCache() {\n this._size = 0;\n }\n /**\n * Invalidates the cache and recalculate the size of selectable options.\n */\n DropdownSizePosCache.prototype.updateOptions = function (options) {\n var displayOnlyOptionsCache = [];\n var notSelectableOptionsCache = [];\n var size = 0;\n for (var i = 0; i < options.length; i++) {\n var _a = options[i], itemType = _a.itemType, hidden = _a.hidden;\n if (itemType === DropdownMenuItemType.Divider || itemType === DropdownMenuItemType.Header) {\n displayOnlyOptionsCache.push(i);\n notSelectableOptionsCache.push(i);\n }\n else if (hidden) {\n notSelectableOptionsCache.push(i);\n }\n else {\n size++;\n }\n }\n this._size = size;\n this._displayOnlyOptionsCache = displayOnlyOptionsCache;\n this._notSelectableOptionsCache = notSelectableOptionsCache;\n this._cachedOptions = __spreadArray([], options, true);\n };\n Object.defineProperty(DropdownSizePosCache.prototype, \"optionSetSize\", {\n /**\n * The size of all the selectable options.\n */\n get: function () {\n return this._size;\n },\n enumerable: false,\n configurable: true\n });\n Object.defineProperty(DropdownSizePosCache.prototype, \"cachedOptions\", {\n /**\n * The chached options array.\n */\n get: function () {\n return this._cachedOptions;\n },\n enumerable: false,\n configurable: true\n });\n /**\n * Returns the position of this option element relative to the full set of selectable option elements.\n * Note: the first selectable element is position 1 in the set.\n * @param index The raw index of the option element.\n */\n DropdownSizePosCache.prototype.positionInSet = function (index) {\n if (index === undefined) {\n return undefined;\n }\n // we could possibly memoize this too but this should be good enough, most of the time (the expectation is that\n // when you have a lot of options, the selectable options will heavily dominate over the non-selectable options.\n var offset = 0;\n while (index > this._notSelectableOptionsCache[offset]) {\n offset++;\n }\n if (this._displayOnlyOptionsCache[offset] === index) {\n throw new Error(\"Unexpected: Option at index \".concat(index, \" is not a selectable element.\"));\n }\n if (this._notSelectableOptionsCache[offset] === index) {\n return undefined;\n }\n return index - offset + 1;\n };\n return DropdownSizePosCache;\n}());\nexport { DropdownSizePosCache };\n//# sourceMappingURL=DropdownSizePosCache.js.map","import { __assign, __extends, __spreadArray } from \"tslib\";\nimport * as React from 'react';\nimport { css, KeyCodes, classNamesFunction, divProperties, findIndex, getDocument, getFirstFocusable, getId, getLastFocusable, getNativeProps, initializeComponentRef, isIOS, isMac, mergeAriaAttributeValues, safeRequestAnimationFrame, warn, warnDeprecations, warnMutuallyExclusive, } from '../../Utilities';\nimport { Callout, DirectionalHint } from '../../Callout';\nimport { CommandButton } from '../../Button';\nimport { DropdownMenuItemType } from './Dropdown.types';\nimport { DropdownSizePosCache } from './utilities/DropdownSizePosCache';\nimport { FocusZone, FocusZoneDirection } from '../../FocusZone';\nimport { Icon } from '../../Icon';\nimport { Label } from '../../Label';\nimport { Panel } from '../../Panel';\nimport { ResponsiveMode, useResponsiveMode } from '../../ResponsiveMode';\nimport { SelectableOptionMenuItemType, getAllSelectedOptions } from '../../SelectableOption';\n// import and use V7 Checkbox to ensure no breaking changes.\nimport { Checkbox } from '../../Checkbox';\nimport { getNextElement, getPreviousElement, getPropsWithDefaults } from '@fluentui/utilities';\nimport { useMergedRefs, usePrevious } from '@fluentui/react-hooks';\nimport { WindowContext } from '@fluentui/react-window-provider';\nimport { getDocumentEx, getWindowEx } from '../../utilities/dom';\nvar COMPONENT_NAME = 'Dropdown';\nvar getClassNames = classNamesFunction();\nvar DEFAULT_PROPS = {\n options: [],\n};\nfunction useSelectedItemsState(_a) {\n var defaultSelectedKeys = _a.defaultSelectedKeys, selectedKeys = _a.selectedKeys, defaultSelectedKey = _a.defaultSelectedKey, selectedKey = _a.selectedKey, options = _a.options, multiSelect = _a.multiSelect;\n var oldOptions = usePrevious(options);\n var _b = React.useState([]), selectedIndices = _b[0], setSelectedIndices = _b[1];\n // In controlled component usage where selectedKey is provided, update the selectedIndex\n // state if the key or options change.\n var selectedKeyPropToUse;\n // this does a shallow compare (assumes options are pure), for the purposes of determining whether\n // defaultSelectedKey/defaultSelectedKeys are respected.\n var didOptionsChange = options !== oldOptions;\n if (multiSelect) {\n if (didOptionsChange && defaultSelectedKeys !== undefined) {\n selectedKeyPropToUse = defaultSelectedKeys;\n }\n else {\n selectedKeyPropToUse = selectedKeys;\n }\n }\n else {\n if (didOptionsChange && defaultSelectedKey !== undefined) {\n selectedKeyPropToUse = defaultSelectedKey;\n }\n else {\n selectedKeyPropToUse = selectedKey;\n }\n }\n var oldSelectedKeyProp = usePrevious(selectedKeyPropToUse);\n React.useEffect(function () {\n /** Get all selected indexes for multi-select mode */\n var getSelectedIndexes = function () {\n if (selectedKeyPropToUse === undefined) {\n if (multiSelect) {\n return getAllSelectedIndices();\n }\n var selectedIndex = getSelectedIndex(null);\n return selectedIndex !== -1 ? [selectedIndex] : [];\n }\n else if (!Array.isArray(selectedKeyPropToUse)) {\n var selectedIndex = getSelectedIndex(selectedKeyPropToUse);\n return selectedIndex !== -1 ? [selectedIndex] : [];\n }\n var returnValue = [];\n for (var _i = 0, selectedKeyPropToUse_1 = selectedKeyPropToUse; _i < selectedKeyPropToUse_1.length; _i++) {\n var key = selectedKeyPropToUse_1[_i];\n var selectedIndex = getSelectedIndex(key);\n selectedIndex !== -1 && returnValue.push(selectedIndex);\n }\n return returnValue;\n };\n var getAllSelectedIndices = function () {\n return options\n .map(function (option, index) { return (option.selected ? index : -1); })\n .filter(function (index) { return index !== -1; });\n };\n var getSelectedIndex = function (searchKey) {\n return findIndex(options, function (option) {\n // eslint-disable-next-line eqeqeq\n if (searchKey != null) {\n return option.key === searchKey;\n }\n else {\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n return !!option.selected || !!option.isSelected;\n }\n });\n };\n if ((selectedKeyPropToUse !== undefined || !oldOptions) &&\n (selectedKeyPropToUse !== oldSelectedKeyProp || didOptionsChange)) {\n setSelectedIndices(getSelectedIndexes());\n }\n }, [didOptionsChange, multiSelect, oldOptions, oldSelectedKeyProp, options, selectedKeyPropToUse]);\n return [selectedIndices, setSelectedIndices];\n}\nexport var DropdownBase = React.forwardRef(function (propsWithoutDefaults, forwardedRef) {\n var props = getPropsWithDefaults(DEFAULT_PROPS, propsWithoutDefaults);\n var rootRef = React.useRef(null);\n var mergedRootRef = useMergedRefs(forwardedRef, rootRef);\n var responsiveMode = useResponsiveMode(rootRef, props.responsiveMode);\n var _a = useSelectedItemsState(props), selectedIndices = _a[0], setSelectedIndices = _a[1];\n return (React.createElement(DropdownInternal, __assign({}, props, { responsiveMode: responsiveMode, hoisted: { rootRef: mergedRootRef, selectedIndices: selectedIndices, setSelectedIndices: setSelectedIndices } })));\n});\nDropdownBase.displayName = 'DropdownBase';\nvar DropdownInternal = /** @class */ (function (_super) {\n __extends(DropdownInternal, _super);\n function DropdownInternal(props) {\n var _this = _super.call(this, props) || this;\n _this._host = React.createRef();\n _this._focusZone = React.createRef();\n _this._dropDown = React.createRef();\n _this._scrollIdleDelay = 250 /* ms */;\n _this._sizePosCache = new DropdownSizePosCache();\n _this._requestAnimationFrame = safeRequestAnimationFrame(_this);\n /**\n * Close menu callout if it is open\n */\n _this.dismissMenu = function () {\n var isOpen = _this.state.isOpen;\n isOpen && _this.setState({ isOpen: false });\n };\n _this._onChange = function (event, options, index, checked, multiSelect) {\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n var _a = _this.props, onChange = _a.onChange, onChanged = _a.onChanged;\n if (onChange || onChanged) {\n // for single-select, option passed in will always be selected.\n // for multi-select, flip the checked value\n var changedOpt = multiSelect ? __assign(__assign({}, options[index]), { selected: !checked }) : options[index];\n onChange && onChange(__assign(__assign({}, event), { target: _this._dropDown.current }), changedOpt, index);\n onChanged && onChanged(changedOpt, index);\n }\n };\n /** Get either props.placeholder (new name) or props.placeHolder (old name) */\n _this._getPlaceholder = function () {\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n return _this.props.placeholder || _this.props.placeHolder;\n };\n /** Get text in dropdown input as a string */\n _this._getTitle = function (items, _unused) {\n var _a = _this.props.multiSelectDelimiter, multiSelectDelimiter = _a === void 0 ? ', ' : _a;\n return items.map(function (i) { return i.text; }).join(multiSelectDelimiter);\n };\n /** Render text in dropdown input */\n _this._onRenderTitle = function (items) {\n return React.createElement(React.Fragment, null, _this._getTitle(items));\n };\n /** Render placeholder text in dropdown input */\n _this._onRenderPlaceholder = function (props) {\n if (!_this._getPlaceholder()) {\n return null;\n }\n return React.createElement(React.Fragment, null, _this._getPlaceholder());\n };\n /** Render Callout or Panel container and pass in list */\n _this._onRenderContainer = function (props) {\n var calloutProps = props.calloutProps, panelProps = props.panelProps;\n var _a = _this.props, responsiveMode = _a.responsiveMode, dropdownWidth = _a.dropdownWidth;\n var isSmall = responsiveMode <= ResponsiveMode.medium;\n var focusTrapZoneProps = { firstFocusableTarget: \"#\".concat(_this._listId, \"1\") };\n var panelStyles = _this._classNames.subComponentStyles\n ? _this._classNames.subComponentStyles.panel\n : undefined;\n var calloutWidth = undefined;\n var calloutMinWidth = undefined;\n if (dropdownWidth === 'auto') {\n calloutMinWidth = _this._dropDown.current ? _this._dropDown.current.clientWidth : 0;\n }\n else {\n calloutWidth = dropdownWidth || (_this._dropDown.current ? _this._dropDown.current.clientWidth : 0);\n }\n return isSmall ? (React.createElement(Panel, __assign({ closeButtonAriaLabel: \"Close\", focusTrapZoneProps: focusTrapZoneProps, hasCloseButton: true, isOpen: true, isLightDismiss: true, onDismiss: _this._onDismiss, styles: panelStyles }, panelProps), _this._renderFocusableList(props))) : (React.createElement(Callout, __assign({ isBeakVisible: false, gapSpace: 0, doNotLayer: false, directionalHintFixed: false, directionalHint: DirectionalHint.bottomLeftEdge, calloutWidth: calloutWidth, calloutMinWidth: calloutMinWidth }, calloutProps, { className: _this._classNames.callout, target: _this._dropDown.current, onDismiss: _this._onDismiss, onScroll: _this._onScroll, onPositioned: _this._onPositioned }), _this._renderFocusableList(props)));\n };\n /** Render Caret Down Icon */\n _this._onRenderCaretDown = function (props) {\n return React.createElement(Icon, { className: _this._classNames.caretDown, iconName: \"ChevronDown\", \"aria-hidden\": true });\n };\n /** Render List of items */\n _this._onRenderList = function (props) {\n var _a = props.onRenderItem, onRenderItem = _a === void 0 ? _this._onRenderItem : _a;\n var queue = { items: [] };\n var renderedList = [];\n var emptyQueue = function () {\n var newGroup = queue.id\n ? [\n React.createElement(\"div\", { role: \"group\", key: queue.id, \"aria-labelledby\": queue.id }, queue.items),\n ]\n : queue.items;\n renderedList = __spreadArray(__spreadArray([], renderedList, true), newGroup, true);\n // Flush items and id\n queue = { items: [] };\n };\n var placeRenderedOptionIntoQueue = function (item, index) {\n /*\n Case Header\n empty queue if it's not already empty\n ensure unique ID for header and set queue ID\n push header into queue\n Case Divider\n push divider into queue if not first item\n empty queue if not already empty\n Default\n push item into queue\n */\n switch (item.itemType) {\n case SelectableOptionMenuItemType.Header:\n queue.items.length > 0 && emptyQueue();\n var id = _this._id + item.key;\n queue.items.push(onRenderItem(__assign(__assign({ id: id }, item), { index: index }), _this._onRenderItem));\n queue.id = id;\n break;\n case SelectableOptionMenuItemType.Divider:\n index > 0 && queue.items.push(onRenderItem(__assign(__assign({}, item), { index: index }), _this._onRenderItem));\n queue.items.length > 0 && emptyQueue();\n break;\n default:\n queue.items.push(onRenderItem(__assign(__assign({}, item), { index: index }), _this._onRenderItem));\n }\n };\n // Place options into the queue. Queue will be emptied anytime a Header or Divider is encountered\n props.options.forEach(function (item, index) {\n placeRenderedOptionIntoQueue(item, index);\n });\n // Push remaining items into all renderedList\n queue.items.length > 0 && emptyQueue();\n return React.createElement(React.Fragment, null, renderedList);\n };\n _this._onRenderItem = function (item) {\n switch (item.itemType) {\n case SelectableOptionMenuItemType.Divider:\n return _this._renderSeparator(item);\n case SelectableOptionMenuItemType.Header:\n return _this._renderHeader(item);\n default:\n return _this._renderOption(item);\n }\n };\n _this._renderOption = function (item) {\n var _a;\n var _b = _this.props, _c = _b.onRenderOption, onRenderOption = _c === void 0 ? _this._onRenderOption : _c, _d = _b.hoisted.selectedIndices, selectedIndices = _d === void 0 ? [] : _d;\n var isItemSelected = item.index !== undefined && selectedIndices ? selectedIndices.indexOf(item.index) > -1 : false;\n // select the right className based on the combination of selected/disabled\n var itemClassName = item.hidden // predicate: item hidden\n ? _this._classNames.dropdownItemHidden\n : isItemSelected && item.disabled === true // predicate: both selected and disabled\n ? _this._classNames.dropdownItemSelectedAndDisabled\n : isItemSelected // predicate: selected only\n ? _this._classNames.dropdownItemSelected\n : item.disabled === true // predicate: disabled only\n ? _this._classNames.dropdownItemDisabled\n : _this._classNames.dropdownItem;\n var title = item.title;\n // define the id and label id (for multiselect checkboxes)\n var id = _this._listId + item.index;\n var labelId = (_a = item.id) !== null && _a !== void 0 ? _a : id + '-label';\n var multiSelectItemStyles = _this._classNames.subComponentStyles\n ? _this._classNames.subComponentStyles.multiSelectItem\n : undefined;\n return !_this.props.multiSelect ? (React.createElement(CommandButton, { id: id, key: item.key, \"data-index\": item.index, \"data-is-focusable\": !item.disabled, disabled: item.disabled, className: itemClassName, onClick: _this._onItemClick(item), \n // eslint-disable-next-line react/jsx-no-bind\n onMouseEnter: _this._onItemMouseEnter.bind(_this, item), \n // eslint-disable-next-line react/jsx-no-bind\n onMouseLeave: _this._onMouseItemLeave.bind(_this, item), \n // eslint-disable-next-line react/jsx-no-bind\n onMouseMove: _this._onItemMouseMove.bind(_this, item), role: \"option\", \"aria-selected\": isItemSelected ? 'true' : 'false', ariaLabel: item.ariaLabel, title: title, \"aria-posinset\": _this._sizePosCache.positionInSet(item.index), \"aria-setsize\": _this._sizePosCache.optionSetSize }, onRenderOption(item, _this._onRenderOption))) : (React.createElement(Checkbox, { id: id, key: item.key, disabled: item.disabled, onChange: _this._onItemClick(item), inputProps: __assign({ 'aria-selected': isItemSelected, onMouseEnter: _this._onItemMouseEnter.bind(_this, item), onMouseLeave: _this._onMouseItemLeave.bind(_this, item), onMouseMove: _this._onItemMouseMove.bind(_this, item), role: 'option' }, {\n 'data-index': item.index,\n 'data-is-focusable': !(item.disabled || item.hidden),\n }), label: item.text, title: title, \n // eslint-disable-next-line react/jsx-no-bind\n onRenderLabel: _this._onRenderItemLabel.bind(_this, __assign(__assign({}, item), { id: labelId })), className: css(itemClassName, 'is-multi-select'), checked: isItemSelected, styles: multiSelectItemStyles, ariaPositionInSet: !item.hidden ? _this._sizePosCache.positionInSet(item.index) : undefined, ariaSetSize: !item.hidden ? _this._sizePosCache.optionSetSize : undefined, ariaLabel: item.ariaLabel, ariaLabelledBy: item.ariaLabel ? undefined : labelId }));\n };\n /** Render content of item (i.e. text/icon inside of button) */\n _this._onRenderOption = function (item) {\n return React.createElement(\"span\", { className: _this._classNames.dropdownOptionText }, item.text);\n };\n /*\n * Render content of a multiselect item label.\n * Text within the label is aria-hidden, to prevent duplicate input/label exposure\n */\n _this._onRenderMultiselectOption = function (item) {\n return (React.createElement(\"span\", { id: item.id, \"aria-hidden\": \"true\", className: _this._classNames.dropdownOptionText }, item.text));\n };\n /** Render custom label for multiselect checkbox items */\n _this._onRenderItemLabel = function (item) {\n var _a = _this.props.onRenderOption, onRenderOption = _a === void 0 ? _this._onRenderMultiselectOption : _a;\n return onRenderOption(item, _this._onRenderMultiselectOption);\n };\n _this._onPositioned = function (positions) {\n if (_this._focusZone.current) {\n // Focusing an element can trigger a reflow. Making this wait until there is an animation\n // frame can improve perf significantly.\n _this._requestAnimationFrame(function () {\n var selectedIndices = _this.props.hoisted.selectedIndices;\n if (_this._focusZone.current) {\n if (!_this._hasBeenPositioned &&\n selectedIndices &&\n selectedIndices[0] &&\n !_this.props.options[selectedIndices[0]].disabled) {\n var element = getDocument().getElementById(\"\".concat(_this._id, \"-list\").concat(selectedIndices[0]));\n if (element) {\n _this._focusZone.current.focusElement(element);\n }\n _this._hasBeenPositioned = true;\n }\n else {\n _this._focusZone.current.focus();\n }\n }\n });\n }\n if (!_this.state.calloutRenderEdge || _this.state.calloutRenderEdge !== positions.targetEdge) {\n _this.setState({\n calloutRenderEdge: positions.targetEdge,\n });\n }\n };\n _this._onItemClick = function (item) {\n return function (event) {\n if (!item.disabled) {\n _this.setSelectedIndex(event, item.index);\n if (!_this.props.multiSelect) {\n // only close the callout when it's in single-select mode\n _this.setState({\n isOpen: false,\n });\n }\n }\n };\n };\n /**\n * Scroll handler for the callout to make sure the mouse events\n * for updating focus are not interacting during scroll\n */\n _this._onScroll = function () {\n var win = getWindowEx(_this.context); // can only be called on the client\n if (!_this._isScrollIdle && _this._scrollIdleTimeoutId !== undefined) {\n win.clearTimeout(_this._scrollIdleTimeoutId);\n _this._scrollIdleTimeoutId = undefined;\n }\n else {\n _this._isScrollIdle = false;\n }\n _this._scrollIdleTimeoutId = win.setTimeout(function () {\n _this._isScrollIdle = true;\n }, _this._scrollIdleDelay);\n };\n _this._onMouseItemLeave = function (item, ev) {\n if (_this._shouldIgnoreMouseEvent()) {\n return;\n }\n /**\n * IE11 focus() method forces parents to scroll to top of element.\n * Edge and IE expose a setActive() function for focusable divs that\n * sets the page focus but does not scroll the parent element.\n */\n if (_this._host.current) {\n if (_this._host.current.setActive) {\n try {\n _this._host.current.setActive();\n }\n catch (e) {\n /* no-op */\n }\n }\n else {\n _this._host.current.focus();\n }\n }\n };\n _this._onDismiss = function () {\n _this.setState({ isOpen: false });\n };\n _this._onDropdownBlur = function (ev) {\n // If Dropdown disabled do not proceed with this logic.\n var disabled = _this._isDisabled();\n if (disabled) {\n return;\n }\n if (_this.state.isOpen) {\n // Do not call onBlur or update focus state when the callout is opened\n return;\n }\n _this.setState({ hasFocus: false });\n if (_this.props.onBlur) {\n _this.props.onBlur(ev);\n }\n };\n _this._onDropdownKeyDown = function (ev) {\n // If Dropdown disabled do not process any keyboard events.\n var disabled = _this._isDisabled();\n if (disabled) {\n return;\n }\n // Take note if we are processing an alt (option) or meta (command) keydown.\n // See comment in _shouldHandleKeyUp for reasoning.\n _this._lastKeyDownWasAltOrMeta = _this._isAltOrMeta(ev);\n if (_this.props.onKeyDown) {\n _this.props.onKeyDown(ev);\n if (ev.defaultPrevented) {\n return;\n }\n }\n var newIndex;\n var selectedIndex = _this.props.hoisted.selectedIndices.length ? _this.props.hoisted.selectedIndices[0] : -1;\n var containsExpandCollapseModifier = ev.altKey || ev.metaKey;\n var isOpen = _this.state.isOpen;\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n switch (ev.which) {\n case KeyCodes.enter:\n _this.setState({\n isOpen: !isOpen,\n });\n break;\n case KeyCodes.escape:\n if (!isOpen) {\n return;\n }\n _this.setState({\n isOpen: false,\n });\n break;\n case KeyCodes.up:\n if (containsExpandCollapseModifier) {\n if (isOpen) {\n _this.setState({ isOpen: false });\n break;\n }\n return;\n }\n if (_this.props.multiSelect) {\n _this.setState({ isOpen: true });\n }\n else if (!_this._isDisabled()) {\n newIndex = _this._moveIndex(ev, -1, selectedIndex - 1, selectedIndex);\n }\n break;\n case KeyCodes.down:\n if (containsExpandCollapseModifier) {\n ev.stopPropagation();\n ev.preventDefault();\n }\n if ((containsExpandCollapseModifier && !isOpen) || _this.props.multiSelect) {\n _this.setState({ isOpen: true });\n }\n else if (!_this._isDisabled()) {\n newIndex = _this._moveIndex(ev, 1, selectedIndex + 1, selectedIndex);\n }\n break;\n case KeyCodes.home:\n if (!_this.props.multiSelect) {\n newIndex = _this._moveIndex(ev, 1, 0, selectedIndex);\n }\n break;\n case KeyCodes.end:\n if (!_this.props.multiSelect) {\n newIndex = _this._moveIndex(ev, -1, _this.props.options.length - 1, selectedIndex);\n }\n break;\n case KeyCodes.space:\n // event handled in _onDropdownKeyUp\n break;\n default:\n return;\n }\n if (newIndex !== selectedIndex) {\n ev.stopPropagation();\n ev.preventDefault();\n }\n };\n _this._onDropdownKeyUp = function (ev) {\n // If Dropdown disabled do not process any keyboard events.\n var disabled = _this._isDisabled();\n if (disabled) {\n return;\n }\n var shouldHandleKey = _this._shouldHandleKeyUp(ev);\n var isOpen = _this.state.isOpen;\n if (_this.props.onKeyUp) {\n _this.props.onKeyUp(ev);\n if (ev.defaultPrevented) {\n return;\n }\n }\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n switch (ev.which) {\n case KeyCodes.space:\n _this.setState({\n isOpen: !isOpen,\n });\n break;\n default:\n if (shouldHandleKey && isOpen) {\n _this.setState({ isOpen: false });\n }\n return;\n }\n ev.stopPropagation();\n ev.preventDefault();\n };\n _this._onZoneKeyDown = function (ev) {\n var _a, _b;\n var elementToFocus;\n // Take note if we are processing an alt (option) or meta (command) keydown.\n // See comment in _shouldHandleKeyUp for reasoning.\n _this._lastKeyDownWasAltOrMeta = _this._isAltOrMeta(ev);\n var containsExpandCollapseModifier = ev.altKey || ev.metaKey;\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n switch (ev.which) {\n case KeyCodes.up:\n if (containsExpandCollapseModifier) {\n _this.setState({ isOpen: false });\n }\n else {\n if (_this._host.current) {\n elementToFocus = getLastFocusable(_this._host.current, _this._host.current.lastChild, true);\n }\n }\n break;\n // All directional keystrokes should be canceled when the zone is rendered.\n // This avoids the body scroll from reacting and thus dismissing the dropdown.\n case KeyCodes.home:\n case KeyCodes.end:\n case KeyCodes.pageUp:\n case KeyCodes.pageDown:\n break;\n case KeyCodes.down:\n if (!containsExpandCollapseModifier && _this._host.current) {\n elementToFocus = getFirstFocusable(_this._host.current, _this._host.current.firstChild, true);\n }\n break;\n case KeyCodes.escape:\n _this.setState({ isOpen: false });\n break;\n case KeyCodes.tab:\n _this.setState({ isOpen: false });\n var document_1 = getDocument();\n if (document_1) {\n if (ev.shiftKey) {\n (_a = getPreviousElement(document_1.body, _this._dropDown.current, false, false, true, true)) === null || _a === void 0 ? void 0 : _a.focus();\n }\n else {\n (_b = getNextElement(document_1.body, _this._dropDown.current, false, false, true, true)) === null || _b === void 0 ? void 0 : _b.focus();\n }\n }\n break;\n default:\n return;\n }\n if (elementToFocus) {\n elementToFocus.focus();\n }\n ev.stopPropagation();\n ev.preventDefault();\n };\n _this._onZoneKeyUp = function (ev) {\n var shouldHandleKey = _this._shouldHandleKeyUp(ev);\n if (shouldHandleKey && _this.state.isOpen) {\n _this.setState({ isOpen: false });\n ev.preventDefault();\n }\n };\n _this._onDropdownClick = function (ev) {\n if (_this.props.onClick) {\n _this.props.onClick(ev);\n if (ev.defaultPrevented) {\n return;\n }\n }\n var isOpen = _this.state.isOpen;\n var disabled = _this._isDisabled();\n if (!disabled && !_this._shouldOpenOnFocus()) {\n _this.setState({\n isOpen: !isOpen,\n });\n }\n _this._isFocusedByClick = false; // reset\n };\n _this._onDropdownMouseDown = function () {\n _this._isFocusedByClick = true;\n };\n _this._onFocus = function (ev) {\n var disabled = _this._isDisabled();\n if (!disabled) {\n if (_this.props.onFocus) {\n _this.props.onFocus(ev);\n }\n var state = { hasFocus: true };\n if (_this._shouldOpenOnFocus()) {\n state.isOpen = true;\n }\n _this.setState(state);\n }\n };\n /**\n * Because the isDisabled prop is deprecated, we have had to repeat this logic all over the place.\n * This helper method avoids all the repetition.\n */\n _this._isDisabled = function () {\n var disabled = _this.props.disabled;\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n var isDisabled = _this.props.isDisabled;\n // Remove this deprecation workaround at 1.0.0\n if (disabled === undefined) {\n disabled = isDisabled;\n }\n return disabled;\n };\n _this._onRenderLabel = function (props) {\n var label = props.label, required = props.required, disabled = props.disabled;\n var labelStyles = _this._classNames.subComponentStyles\n ? _this._classNames.subComponentStyles.label\n : undefined;\n return label ? (React.createElement(Label, { className: _this._classNames.label, id: _this._labelId, required: required, styles: labelStyles, disabled: disabled }, label)) : null;\n };\n initializeComponentRef(_this);\n var multiSelect = props.multiSelect, selectedKey = props.selectedKey, selectedKeys = props.selectedKeys, defaultSelectedKey = props.defaultSelectedKey, defaultSelectedKeys = props.defaultSelectedKeys, options = props.options;\n if (process.env.NODE_ENV !== 'production') {\n warnDeprecations(COMPONENT_NAME, props, {\n isDisabled: 'disabled',\n onChanged: 'onChange',\n placeHolder: 'placeholder',\n onRenderPlaceHolder: 'onRenderPlaceholder',\n });\n warnMutuallyExclusive(COMPONENT_NAME, props, {\n defaultSelectedKey: 'selectedKey',\n defaultSelectedKeys: 'selectedKeys',\n selectedKeys: 'selectedKey',\n });\n if (multiSelect) {\n var warnMultiSelect = function (prop) {\n return warn(\"Dropdown property '\".concat(prop, \"' cannot be used when 'multiSelect' is true. Use '\").concat(prop, \"s' instead.\"));\n };\n if (selectedKey !== undefined) {\n warnMultiSelect('selectedKey');\n }\n if (defaultSelectedKey !== undefined) {\n warnMultiSelect('defaultSelectedKey');\n }\n }\n else {\n var warnNotMultiSelect = function (prop) {\n return warn(\"Dropdown property '\".concat(prop, \"s' cannot be used when 'multiSelect' is false/unset. Use '\").concat(prop, \"' instead.\"));\n };\n if (selectedKeys !== undefined) {\n warnNotMultiSelect('selectedKey');\n }\n if (defaultSelectedKeys !== undefined) {\n warnNotMultiSelect('defaultSelectedKey');\n }\n }\n }\n _this._id = props.id || getId('Dropdown');\n _this._labelId = _this._id + '-label';\n _this._listId = _this._id + '-list';\n _this._optionId = _this._id + '-option';\n _this._isScrollIdle = true;\n _this._hasBeenPositioned = false;\n _this._sizePosCache.updateOptions(options);\n _this.state = {\n isOpen: false,\n hasFocus: false,\n calloutRenderEdge: undefined,\n };\n return _this;\n }\n Object.defineProperty(DropdownInternal.prototype, \"selectedOptions\", {\n /**\n * All selected options\n */\n get: function () {\n var _a = this.props, options = _a.options, selectedIndices = _a.hoisted.selectedIndices;\n return getAllSelectedOptions(options, selectedIndices);\n },\n enumerable: false,\n configurable: true\n });\n DropdownInternal.prototype.componentWillUnmount = function () {\n clearTimeout(this._scrollIdleTimeoutId);\n };\n DropdownInternal.prototype.componentDidUpdate = function (prevProps, prevState) {\n if (prevState.isOpen === true && this.state.isOpen === false) {\n this._gotMouseMove = false;\n this._hasBeenPositioned = false;\n if (this.props.onDismiss) {\n this.props.onDismiss();\n }\n }\n };\n DropdownInternal.prototype.render = function () {\n var id = this._id;\n var props = this.props;\n var className = props.className, label = props.label, options = props.options, ariaLabel = props.ariaLabel, required = props.required, errorMessage = props.errorMessage, propStyles = props.styles, theme = props.theme, panelProps = props.panelProps, calloutProps = props.calloutProps, _a = props.onRenderTitle, onRenderTitle = _a === void 0 ? this._getTitle : _a, _b = props.onRenderContainer, onRenderContainer = _b === void 0 ? this._onRenderContainer : _b, _c = props.onRenderCaretDown, onRenderCaretDown = _c === void 0 ? this._onRenderCaretDown : _c, _d = props.onRenderLabel, onRenderLabel = _d === void 0 ? this._onRenderLabel : _d, _e = props.onRenderItem, onRenderItem = _e === void 0 ? this._onRenderItem : _e, selectedIndices = props.hoisted.selectedIndices;\n var _f = this.state, isOpen = _f.isOpen, calloutRenderEdge = _f.calloutRenderEdge, hasFocus = _f.hasFocus;\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n var onRenderPlaceholder = props.onRenderPlaceholder || props.onRenderPlaceHolder || this._getPlaceholder;\n // If our cached options are out of date update our cache\n if (options !== this._sizePosCache.cachedOptions) {\n this._sizePosCache.updateOptions(options);\n }\n var selectedOptions = getAllSelectedOptions(options, selectedIndices);\n var divProps = getNativeProps(props, divProperties);\n var disabled = this._isDisabled();\n var errorMessageId = id + '-errorMessage';\n this._classNames = getClassNames(propStyles, {\n theme: theme,\n className: className,\n hasError: !!(errorMessage && errorMessage.length > 0),\n hasLabel: !!label,\n isOpen: isOpen,\n required: required,\n disabled: disabled,\n isRenderingPlaceholder: !selectedOptions.length,\n panelClassName: panelProps ? panelProps.className : undefined,\n calloutClassName: calloutProps ? calloutProps.className : undefined,\n calloutRenderEdge: calloutRenderEdge,\n });\n var hasErrorMessage = !!errorMessage && errorMessage.length > 0;\n return (React.createElement(\"div\", { className: this._classNames.root, ref: this.props.hoisted.rootRef, \"aria-owns\": isOpen ? this._listId : undefined },\n onRenderLabel(this.props, this._onRenderLabel),\n React.createElement(\"div\", __assign({ \"data-is-focusable\": !disabled, \"data-ktp-target\": true, ref: this._dropDown, id: id, tabIndex: disabled ? -1 : 0, role: \"combobox\", \"aria-haspopup\": \"listbox\", \"aria-expanded\": isOpen ? 'true' : 'false', \"aria-label\": ariaLabel, \"aria-labelledby\": label && !ariaLabel ? mergeAriaAttributeValues(this._labelId, this._optionId) : undefined, \"aria-describedby\": hasErrorMessage ? this._id + '-errorMessage' : undefined, \"aria-required\": required, \"aria-disabled\": disabled, \"aria-invalid\": hasErrorMessage, \"aria-controls\": isOpen ? this._listId : undefined }, divProps, { className: this._classNames.dropdown, onBlur: this._onDropdownBlur, onKeyDown: this._onDropdownKeyDown, onKeyUp: this._onDropdownKeyUp, onClick: this._onDropdownClick, onMouseDown: this._onDropdownMouseDown, onFocus: this._onFocus }),\n React.createElement(\"span\", { id: this._optionId, className: this._classNames.title, \"aria-live\": hasFocus ? 'polite' : undefined, \"aria-atomic\": hasFocus ? true : undefined }, \n // If option is selected render title, otherwise render the placeholder text\n selectedOptions.length\n ? onRenderTitle(selectedOptions, this._onRenderTitle)\n : onRenderPlaceholder(props, this._onRenderPlaceholder)),\n React.createElement(\"span\", { className: this._classNames.caretDownWrapper }, onRenderCaretDown(props, this._onRenderCaretDown))),\n isOpen &&\n onRenderContainer(__assign(__assign({}, props), { onDismiss: this._onDismiss, onRenderItem: onRenderItem }), this._onRenderContainer),\n hasErrorMessage && (React.createElement(\"div\", { role: \"alert\", id: errorMessageId, className: this._classNames.errorMessage }, errorMessage))));\n };\n DropdownInternal.prototype.focus = function (shouldOpenOnFocus) {\n if (this._dropDown.current) {\n this._dropDown.current.focus();\n if (shouldOpenOnFocus) {\n this.setState({\n isOpen: true,\n });\n }\n }\n };\n DropdownInternal.prototype.setSelectedIndex = function (event, index) {\n var _a = this.props, options = _a.options, selectedKey = _a.selectedKey, selectedKeys = _a.selectedKeys, multiSelect = _a.multiSelect, notifyOnReselect = _a.notifyOnReselect, _b = _a.hoisted.selectedIndices, selectedIndices = _b === void 0 ? [] : _b;\n var checked = selectedIndices ? selectedIndices.indexOf(index) > -1 : false;\n var newIndexes = [];\n index = Math.max(0, Math.min(options.length - 1, index));\n // If this is a controlled component then no state change should take place.\n if (selectedKey !== undefined || selectedKeys !== undefined) {\n this._onChange(event, options, index, checked, multiSelect);\n return;\n }\n if (!multiSelect && !notifyOnReselect && index === selectedIndices[0]) {\n return;\n }\n else if (multiSelect) {\n newIndexes = selectedIndices ? this._copyArray(selectedIndices) : [];\n if (checked) {\n var position = newIndexes.indexOf(index);\n if (position > -1) {\n // unchecked the current one\n newIndexes.splice(position, 1);\n }\n }\n else {\n // add the new selected index into the existing one\n newIndexes.push(index);\n }\n }\n else {\n // Set the selected option if this is an uncontrolled component\n newIndexes = [index];\n }\n event.persist();\n // Call onChange after state is updated\n this.props.hoisted.setSelectedIndices(newIndexes);\n this._onChange(event, options, index, checked, multiSelect);\n };\n DropdownInternal.prototype._copyArray = function (array) {\n var newArray = [];\n for (var _i = 0, array_1 = array; _i < array_1.length; _i++) {\n var element = array_1[_i];\n newArray.push(element);\n }\n return newArray;\n };\n /**\n * Finds the next valid Dropdown option and sets the selected index to it.\n * @param stepValue - Value of how many items the function should traverse. Should be -1 or 1.\n * @param index - Index of where the search should start\n * @param selectedIndex - The selectedIndex Dropdown's state\n * @returns The next valid dropdown option's index\n */\n DropdownInternal.prototype._moveIndex = function (event, stepValue, index, selectedIndex) {\n var options = this.props.options;\n // Return selectedIndex if nothing has changed or options is empty\n if (selectedIndex === index || options.length === 0) {\n return selectedIndex;\n }\n // If the user is pressing the up or down key we want to make\n // sure that the dropdown cycles through the options without\n // causing the screen to scroll. In _onDropdownKeyDown\n // at the very end is a check to see if newIndex !== selectedIndex.\n // If the index is less than 0 and we set it back to 0, then\n // newIndex will equal selectedIndex and not stop the action\n // of the key press happening and vice versa for indexes greater\n // than or equal to the options length.\n if (index >= options.length) {\n index = 0;\n }\n else if (index < 0) {\n index = options.length - 1;\n }\n var stepCounter = 0;\n // If current index is a header or divider, or disabled, increment by step\n while (options[index].itemType === DropdownMenuItemType.Header ||\n options[index].itemType === DropdownMenuItemType.Divider ||\n options[index].disabled) {\n // If stepCounter exceeds length of options, then return selectedIndex (-1)\n if (stepCounter >= options.length) {\n return selectedIndex;\n }\n // If index + stepValue is out of bounds, wrap around\n if (index + stepValue < 0) {\n index = options.length;\n }\n else if (index + stepValue >= options.length) {\n index = -1;\n }\n index = index + stepValue;\n stepCounter++;\n }\n this.setSelectedIndex(event, index);\n return index;\n };\n /** Wrap item list in a FocusZone */\n DropdownInternal.prototype._renderFocusableList = function (props) {\n var _a = props.onRenderList, onRenderList = _a === void 0 ? this._onRenderList : _a, label = props.label, ariaLabel = props.ariaLabel, multiSelect = props.multiSelect;\n return (React.createElement(\"div\", { className: this._classNames.dropdownItemsWrapper, onKeyDown: this._onZoneKeyDown, onKeyUp: this._onZoneKeyUp, ref: this._host, tabIndex: 0 },\n React.createElement(FocusZone, { ref: this._focusZone, direction: FocusZoneDirection.vertical, id: this._listId, className: this._classNames.dropdownItems, role: \"listbox\", \"aria-label\": ariaLabel, \"aria-labelledby\": label && !ariaLabel ? this._labelId : undefined, \"aria-multiselectable\": multiSelect }, onRenderList(props, this._onRenderList))));\n };\n DropdownInternal.prototype._renderSeparator = function (item) {\n var index = item.index, key = item.key;\n var separatorClassName = item.hidden ? this._classNames.dropdownDividerHidden : this._classNames.dropdownDivider;\n if (index > 0) {\n return React.createElement(\"div\", { role: \"presentation\", key: key, className: separatorClassName });\n }\n return null;\n };\n DropdownInternal.prototype._renderHeader = function (item) {\n var _a = this.props.onRenderOption, onRenderOption = _a === void 0 ? this._onRenderOption : _a;\n var key = item.key, id = item.id;\n var headerClassName = item.hidden\n ? this._classNames.dropdownItemHeaderHidden\n : this._classNames.dropdownItemHeader;\n return (React.createElement(\"div\", { id: id, key: key, className: headerClassName }, onRenderOption(item, this._onRenderOption)));\n };\n DropdownInternal.prototype._onItemMouseEnter = function (item, ev) {\n if (this._shouldIgnoreMouseEvent()) {\n return;\n }\n var targetElement = ev.currentTarget;\n targetElement.focus();\n };\n DropdownInternal.prototype._onItemMouseMove = function (item, ev) {\n var doc = getDocumentEx(this.context); // can only be called on the client\n var targetElement = ev.currentTarget;\n this._gotMouseMove = true;\n if (!this._isScrollIdle || doc.activeElement === targetElement) {\n return;\n }\n targetElement.focus();\n };\n DropdownInternal.prototype._shouldIgnoreMouseEvent = function () {\n return !this._isScrollIdle || !this._gotMouseMove;\n };\n /**\n * Returns true if the key for the event is alt (Mac option) or meta (Mac command).\n */\n DropdownInternal.prototype._isAltOrMeta = function (ev) {\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n return ev.which === KeyCodes.alt || ev.key === 'Meta';\n };\n /**\n * We close the menu on key up only if ALL of the following are true:\n * - Most recent key down was alt or meta (command)\n * - The alt/meta key down was NOT followed by some other key (such as down/up arrow to\n * expand/collapse the menu)\n * - We're not on a Mac (or iOS)\n *\n * This is because on Windows, pressing alt moves focus to the application menu bar or similar,\n * closing any open context menus. There is not a similar behavior on Macs.\n */\n DropdownInternal.prototype._shouldHandleKeyUp = function (ev) {\n var keyPressIsAltOrMetaAlone = this._lastKeyDownWasAltOrMeta && this._isAltOrMeta(ev);\n this._lastKeyDownWasAltOrMeta = false;\n return !!keyPressIsAltOrMetaAlone && !(isMac() || isIOS());\n };\n /**\n * Returns true if dropdown should set to open on focus.\n * Otherwise, isOpen state should be toggled on click\n */\n DropdownInternal.prototype._shouldOpenOnFocus = function () {\n var hasFocus = this.state.hasFocus;\n var openOnKeyboardFocus = this.props.openOnKeyboardFocus;\n return !this._isFocusedByClick && openOnKeyboardFocus === true && !hasFocus;\n };\n DropdownInternal.defaultProps = {\n options: [],\n };\n DropdownInternal.contextType = WindowContext;\n return DropdownInternal;\n}(React.Component));\n//# sourceMappingURL=Dropdown.base.js.map","var _a, _b, _c, _d, _e;\nimport { __assign, __spreadArray } from \"tslib\";\nimport { IsFocusVisibleClassName } from '../../Utilities';\nimport { RectangleEdge } from '../../Positioning';\nimport { FontWeights, HighContrastSelector, getGlobalClassNames, normalize, HighContrastSelectorWhite, getScreenSelector, ScreenWidthMinMedium, getHighContrastNoAdjustStyle, } from '../../Styling';\nvar GlobalClassNames = {\n root: 'ms-Dropdown-container',\n label: 'ms-Dropdown-label',\n dropdown: 'ms-Dropdown',\n title: 'ms-Dropdown-title',\n caretDownWrapper: 'ms-Dropdown-caretDownWrapper',\n caretDown: 'ms-Dropdown-caretDown',\n callout: 'ms-Dropdown-callout',\n panel: 'ms-Dropdown-panel',\n dropdownItems: 'ms-Dropdown-items',\n dropdownItem: 'ms-Dropdown-item',\n dropdownDivider: 'ms-Dropdown-divider',\n dropdownOptionText: 'ms-Dropdown-optionText',\n dropdownItemHeader: 'ms-Dropdown-header',\n titleIsPlaceHolder: 'ms-Dropdown-titleIsPlaceHolder',\n titleHasError: 'ms-Dropdown-title--hasError',\n};\nvar DROPDOWN_HEIGHT = 32;\nvar DROPDOWN_ITEM_HEIGHT = 36;\nvar highContrastAdjustMixin = (_a = {},\n _a[\"\".concat(HighContrastSelector, \", \").concat(HighContrastSelectorWhite.replace('@media ', ''))] = __assign({}, getHighContrastNoAdjustStyle()),\n _a);\nvar highContrastItemAndTitleStateMixin = {\n selectors: __assign((_b = {}, _b[HighContrastSelector] = (_c = {\n backgroundColor: 'Highlight',\n borderColor: 'Highlight',\n color: 'HighlightText'\n },\n _c[\".\".concat(IsFocusVisibleClassName, \" &:focus:after\")] = {\n borderColor: 'HighlightText',\n },\n _c), _b['.ms-Checkbox-checkbox'] = (_d = {},\n _d[HighContrastSelector] = {\n borderColor: 'HighlightText',\n },\n _d), _b), highContrastAdjustMixin),\n};\nvar highContrastBorderState = {\n selectors: (_e = {},\n _e[HighContrastSelector] = {\n borderColor: 'Highlight',\n },\n _e),\n};\nvar MinimumScreenSelector = getScreenSelector(0, ScreenWidthMinMedium);\nexport var getStyles = function (props) {\n var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;\n var theme = props.theme, hasError = props.hasError, hasLabel = props.hasLabel, className = props.className, isOpen = props.isOpen, disabled = props.disabled, required = props.required, isRenderingPlaceholder = props.isRenderingPlaceholder, panelClassName = props.panelClassName, calloutClassName = props.calloutClassName, calloutRenderEdge = props.calloutRenderEdge;\n if (!theme) {\n throw new Error('theme is undefined or null in base Dropdown getStyles function.');\n }\n var globalClassnames = getGlobalClassNames(GlobalClassNames, theme);\n var palette = theme.palette, semanticColors = theme.semanticColors, effects = theme.effects, fonts = theme.fonts;\n var rootHoverFocusActiveSelectorNeutralDarkMixin = {\n color: semanticColors.menuItemTextHovered,\n };\n var rootHoverFocusActiveSelectorNeutralPrimaryMixin = {\n color: semanticColors.menuItemText,\n };\n var borderColorError = {\n borderColor: semanticColors.errorText,\n };\n var dropdownItemStyle = [\n globalClassnames.dropdownItem,\n {\n backgroundColor: 'transparent',\n boxSizing: 'border-box',\n cursor: 'pointer',\n display: 'flex',\n alignItems: 'center',\n padding: '0 8px',\n width: '100%',\n minHeight: DROPDOWN_ITEM_HEIGHT,\n lineHeight: 20,\n height: 0,\n position: 'relative',\n border: '1px solid transparent',\n borderRadius: 0,\n wordWrap: 'break-word',\n overflowWrap: 'break-word',\n textAlign: 'left',\n '.ms-Button-flexContainer': {\n width: '100%',\n },\n },\n ];\n var dropdownHeaderStyle = [\n globalClassnames.dropdownItemHeader,\n __assign(__assign({}, fonts.medium), { fontWeight: FontWeights.semibold, color: semanticColors.menuHeader, background: 'none', backgroundColor: 'transparent', border: 'none', height: DROPDOWN_ITEM_HEIGHT, lineHeight: DROPDOWN_ITEM_HEIGHT, cursor: 'default', padding: '0 8px', userSelect: 'none', textAlign: 'left', selectors: (_a = {},\n _a[HighContrastSelector] = __assign({ color: 'GrayText' }, getHighContrastNoAdjustStyle()),\n _a) }),\n ];\n var selectedItemBackgroundColor = semanticColors.menuItemBackgroundPressed;\n var itemSelectors = function (isSelected) {\n var _a, _b;\n if (isSelected === void 0) { isSelected = false; }\n return {\n selectors: (_a = {\n '&:hover': [\n {\n color: semanticColors.menuItemTextHovered,\n backgroundColor: !isSelected ? semanticColors.menuItemBackgroundHovered : selectedItemBackgroundColor,\n },\n highContrastItemAndTitleStateMixin,\n ],\n '&.is-multi-select:hover': [\n { backgroundColor: !isSelected ? 'transparent' : selectedItemBackgroundColor },\n highContrastItemAndTitleStateMixin,\n ],\n '&:active:hover': [\n {\n color: semanticColors.menuItemTextHovered,\n backgroundColor: !isSelected\n ? semanticColors.menuItemBackgroundPressed\n : semanticColors.menuItemBackgroundHovered,\n },\n highContrastItemAndTitleStateMixin,\n ]\n },\n _a[\".\".concat(IsFocusVisibleClassName, \" &:focus:after, :host(.\").concat(IsFocusVisibleClassName, \") &:focus:after\")] = (_b = {\n left: 0,\n top: 0,\n bottom: 0,\n right: 0\n },\n _b[HighContrastSelector] = {\n inset: '2px',\n },\n _b),\n _a[HighContrastSelector] = {\n border: 'none',\n },\n _a),\n };\n };\n var dropdownItemSelected = __spreadArray(__spreadArray([], dropdownItemStyle, true), [\n {\n backgroundColor: selectedItemBackgroundColor,\n color: semanticColors.menuItemTextHovered,\n },\n itemSelectors(true),\n highContrastItemAndTitleStateMixin,\n ], false);\n var dropdownItemDisabled = __spreadArray(__spreadArray([], dropdownItemStyle, true), [\n {\n color: semanticColors.disabledText,\n cursor: 'default',\n selectors: (_b = {},\n _b[HighContrastSelector] = {\n color: 'GrayText',\n border: 'none',\n },\n _b),\n },\n ], false);\n var titleOpenBorderRadius = calloutRenderEdge === RectangleEdge.bottom\n ? \"\".concat(effects.roundedCorner2, \" \").concat(effects.roundedCorner2, \" 0 0\")\n : \"0 0 \".concat(effects.roundedCorner2, \" \").concat(effects.roundedCorner2);\n var calloutOpenBorderRadius = calloutRenderEdge === RectangleEdge.bottom\n ? \"0 0 \".concat(effects.roundedCorner2, \" \").concat(effects.roundedCorner2)\n : \"\".concat(effects.roundedCorner2, \" \").concat(effects.roundedCorner2, \" 0 0\");\n return {\n root: [globalClassnames.root, className],\n label: globalClassnames.label,\n dropdown: [\n globalClassnames.dropdown,\n normalize,\n fonts.medium,\n {\n color: semanticColors.menuItemText,\n borderColor: semanticColors.focusBorder,\n position: 'relative',\n outline: 0,\n userSelect: 'none',\n selectors: (_c = {},\n _c['&:hover .' + globalClassnames.title] = [\n !disabled && rootHoverFocusActiveSelectorNeutralDarkMixin,\n { borderColor: isOpen ? palette.neutralSecondary : palette.neutralPrimary },\n highContrastBorderState,\n ],\n _c['&:focus .' + globalClassnames.title] = [\n !disabled && rootHoverFocusActiveSelectorNeutralDarkMixin,\n { selectors: (_d = {}, _d[HighContrastSelector] = { color: 'Highlight' }, _d) },\n ],\n _c['&:focus:after'] = [\n {\n pointerEvents: 'none',\n content: \"''\",\n position: 'absolute',\n boxSizing: 'border-box',\n top: '0px',\n left: '0px',\n width: '100%',\n height: '100%',\n // see https://github.com/microsoft/fluentui/pull/9182 for semantic color disc\n border: !disabled ? \"2px solid \".concat(palette.themePrimary) : 'none',\n borderRadius: '2px',\n selectors: (_e = {},\n _e[HighContrastSelector] = {\n color: 'Highlight',\n },\n _e),\n },\n ],\n _c['&:active .' + globalClassnames.title] = [\n !disabled && rootHoverFocusActiveSelectorNeutralDarkMixin,\n { borderColor: palette.themePrimary },\n highContrastBorderState,\n ],\n _c['&:hover .' + globalClassnames.caretDown] = !disabled && rootHoverFocusActiveSelectorNeutralPrimaryMixin,\n _c['&:focus .' + globalClassnames.caretDown] = [\n !disabled && rootHoverFocusActiveSelectorNeutralPrimaryMixin,\n { selectors: (_f = {}, _f[HighContrastSelector] = { color: 'Highlight' }, _f) },\n ],\n _c['&:active .' + globalClassnames.caretDown] = !disabled && rootHoverFocusActiveSelectorNeutralPrimaryMixin,\n _c['&:hover .' + globalClassnames.titleIsPlaceHolder] = !disabled && rootHoverFocusActiveSelectorNeutralPrimaryMixin,\n _c['&:focus .' + globalClassnames.titleIsPlaceHolder] = !disabled && rootHoverFocusActiveSelectorNeutralPrimaryMixin,\n _c['&:active .' + globalClassnames.titleIsPlaceHolder] = !disabled && rootHoverFocusActiveSelectorNeutralPrimaryMixin,\n _c['&:hover .' + globalClassnames.titleHasError] = borderColorError,\n _c['&:active .' + globalClassnames.titleHasError] = borderColorError,\n _c),\n },\n isOpen && 'is-open',\n disabled && 'is-disabled',\n required && 'is-required',\n required &&\n !hasLabel && {\n selectors: (_g = {\n ':before': {\n content: \"'*'\",\n color: semanticColors.errorText,\n position: 'absolute',\n top: -5,\n right: -10,\n }\n },\n _g[HighContrastSelector] = {\n selectors: {\n ':after': {\n right: -14, // moving the * 4 pixel to right to alleviate border clipping in HC mode.\n },\n },\n },\n _g),\n },\n ],\n title: [\n globalClassnames.title,\n normalize,\n {\n backgroundColor: semanticColors.inputBackground,\n borderWidth: 1,\n borderStyle: 'solid',\n borderColor: semanticColors.inputBorder,\n borderRadius: isOpen ? titleOpenBorderRadius : effects.roundedCorner2,\n cursor: 'pointer',\n display: 'block',\n height: DROPDOWN_HEIGHT,\n lineHeight: DROPDOWN_HEIGHT - 2,\n padding: \"0 28px 0 8px\",\n position: 'relative',\n overflow: 'hidden',\n whiteSpace: 'nowrap',\n textOverflow: 'ellipsis',\n },\n isRenderingPlaceholder && [globalClassnames.titleIsPlaceHolder, { color: semanticColors.inputPlaceholderText }],\n hasError && [globalClassnames.titleHasError, borderColorError],\n disabled && {\n backgroundColor: semanticColors.disabledBackground,\n border: 'none',\n color: semanticColors.disabledText,\n cursor: 'default',\n selectors: (_h = {},\n _h[HighContrastSelector] = __assign({ border: '1px solid GrayText', color: 'GrayText', backgroundColor: 'Window' }, getHighContrastNoAdjustStyle()),\n _h),\n },\n ],\n caretDownWrapper: [\n globalClassnames.caretDownWrapper,\n {\n height: DROPDOWN_HEIGHT,\n lineHeight: DROPDOWN_HEIGHT - 2, // height minus the border\n paddingTop: 1,\n position: 'absolute',\n right: 8,\n top: 0,\n },\n !disabled && {\n cursor: 'pointer',\n },\n ],\n caretDown: [\n globalClassnames.caretDown,\n { color: palette.neutralSecondary, fontSize: fonts.small.fontSize, pointerEvents: 'none' },\n disabled && {\n color: semanticColors.disabledText,\n selectors: (_j = {},\n _j[HighContrastSelector] = __assign({ color: 'GrayText' }, getHighContrastNoAdjustStyle()),\n _j),\n },\n ],\n errorMessage: __assign(__assign({ color: semanticColors.errorText }, theme.fonts.small), { paddingTop: 5 }),\n callout: [\n globalClassnames.callout,\n {\n boxShadow: effects.elevation8,\n borderRadius: calloutOpenBorderRadius,\n selectors: (_k = {},\n _k['.ms-Callout-main'] = { borderRadius: calloutOpenBorderRadius },\n _k),\n },\n calloutClassName,\n ],\n dropdownItemsWrapper: { selectors: { '&:focus': { outline: 0 } } },\n dropdownItems: [globalClassnames.dropdownItems, { display: 'block' }],\n dropdownItem: __spreadArray(__spreadArray([], dropdownItemStyle, true), [itemSelectors()], false),\n dropdownItemSelected: dropdownItemSelected,\n dropdownItemDisabled: dropdownItemDisabled,\n dropdownItemSelectedAndDisabled: [dropdownItemSelected, dropdownItemDisabled, { backgroundColor: 'transparent' }],\n dropdownItemHidden: __spreadArray(__spreadArray([], dropdownItemStyle, true), [{ display: 'none' }], false),\n dropdownDivider: [globalClassnames.dropdownDivider, { height: 1, backgroundColor: semanticColors.bodyDivider }],\n dropdownDividerHidden: [globalClassnames.dropdownDivider, { display: 'none' }],\n dropdownOptionText: [\n globalClassnames.dropdownOptionText,\n {\n overflow: 'hidden',\n whiteSpace: 'nowrap',\n textOverflow: 'ellipsis',\n minWidth: 0,\n maxWidth: '100%',\n wordWrap: 'break-word',\n overflowWrap: 'break-word',\n margin: '1px',\n },\n ],\n dropdownItemHeader: dropdownHeaderStyle,\n dropdownItemHeaderHidden: __spreadArray(__spreadArray([], dropdownHeaderStyle, true), [{ display: 'none' }], false),\n subComponentStyles: {\n label: { root: { display: 'inline-block' } },\n multiSelectItem: {\n root: {\n padding: 0,\n },\n label: {\n alignSelf: 'stretch',\n padding: '0 8px',\n width: '100%',\n },\n input: {\n selectors: (_l = {},\n // eslint-disable-next-line @fluentui/max-len\n _l[\".\".concat(IsFocusVisibleClassName, \" &:focus + label::before, :host(.\").concat(IsFocusVisibleClassName, \") &:focus + label::before\")] = {\n outlineOffset: '0px',\n },\n _l),\n },\n },\n panel: {\n root: [panelClassName],\n main: {\n selectors: (_m = {},\n // In case of extra small screen sizes\n _m[MinimumScreenSelector] = {\n // panelWidth xs\n width: 272,\n },\n _m),\n },\n contentInner: { padding: '0 0 20px' },\n },\n },\n };\n};\n//# sourceMappingURL=Dropdown.styles.js.map","import { styled } from '../../Utilities';\nimport { DropdownBase } from './Dropdown.base';\nimport { getStyles } from './Dropdown.styles';\nexport var Dropdown = styled(DropdownBase, getStyles, undefined, {\n scope: 'Dropdown',\n});\nDropdown.displayName = 'Dropdown';\n//# sourceMappingURL=Dropdown.js.map","import { __assign } from \"tslib\";\nimport * as React from 'react';\nimport { classNamesFunction, divProperties, getDocument, getNativeProps, getRTL, memoizeFunction, Customizer, FocusRectsProvider, } from '../../Utilities';\nimport { createTheme } from '../../Styling';\nimport { useMergedRefs } from '@fluentui/react-hooks';\nvar getClassNames = classNamesFunction();\nvar getFabricTheme = memoizeFunction(function (theme, isRTL) { return createTheme(__assign(__assign({}, theme), { rtl: isRTL })); });\nvar getDir = function (_a) {\n var theme = _a.theme, dir = _a.dir;\n var contextDir = getRTL(theme) ? 'rtl' : 'ltr';\n var pageDir = getRTL() ? 'rtl' : 'ltr';\n var componentDir = dir ? dir : contextDir;\n return {\n // If Fabric dir !== contextDir\n // Or If contextDir !== pageDir\n // Then we need to set dir of the Fabric root\n rootDir: componentDir !== contextDir || componentDir !== pageDir ? componentDir : dir,\n // If dir !== contextDir || pageDir\n // then set contextual theme around content\n needsTheme: componentDir !== contextDir,\n };\n};\nexport var FabricBase = React.forwardRef(function (props, ref) {\n var className = props.className, theme = props.theme, applyTheme = props.applyTheme, applyThemeToBody = props.applyThemeToBody, styles = props.styles;\n var classNames = getClassNames(styles, {\n theme: theme,\n applyTheme: applyTheme,\n className: className,\n });\n var rootElement = React.useRef(null);\n useApplyThemeToBody(applyThemeToBody, classNames, rootElement);\n return React.createElement(React.Fragment, null, useRenderedContent(props, classNames, rootElement, ref));\n});\nFabricBase.displayName = 'FabricBase';\nfunction useRenderedContent(props, _a, rootElement, ref) {\n var root = _a.root;\n var _b = props.as, Root = _b === void 0 ? 'div' : _b, dir = props.dir, theme = props.theme;\n var divProps = getNativeProps(props, divProperties, ['dir']);\n var _c = getDir(props), rootDir = _c.rootDir, needsTheme = _c.needsTheme;\n var renderedContent = (React.createElement(FocusRectsProvider, { providerRef: rootElement },\n React.createElement(Root, __assign({ dir: rootDir }, divProps, { className: root, ref: useMergedRefs(rootElement, ref) }))));\n // Create the contextual theme if component direction does not match parent direction.\n if (needsTheme) {\n // Disabling ThemeProvider here because theme doesn't need to be re-provided by ThemeProvider if dir has changed.\n renderedContent = (\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n React.createElement(Customizer, { settings: { theme: getFabricTheme(theme, dir === 'rtl') } }, renderedContent));\n }\n return renderedContent;\n}\nfunction useApplyThemeToBody(applyThemeToBody, _a, rootElement) {\n var bodyThemed = _a.bodyThemed;\n React.useEffect(function () {\n if (applyThemeToBody) {\n var currentDoc_1 = getDocument(rootElement.current);\n if (currentDoc_1) {\n currentDoc_1.body.classList.add(bodyThemed);\n return function () {\n currentDoc_1.body.classList.remove(bodyThemed);\n };\n }\n }\n }, [bodyThemed, applyThemeToBody, rootElement]);\n return rootElement;\n}\n//# sourceMappingURL=Fabric.base.js.map","import { getGlobalClassNames } from '../../Styling';\nvar inheritFont = { fontFamily: 'inherit' };\nvar GlobalClassNames = {\n root: 'ms-Fabric',\n bodyThemed: 'ms-Fabric-bodyThemed',\n};\nexport var getStyles = function (props) {\n var applyTheme = props.applyTheme, className = props.className, preventBlanketFontInheritance = props.preventBlanketFontInheritance, theme = props.theme;\n var classNames = getGlobalClassNames(GlobalClassNames, theme);\n return {\n root: [\n classNames.root,\n theme.fonts.medium,\n {\n color: theme.palette.neutralPrimary,\n },\n !preventBlanketFontInheritance && {\n '& button': inheritFont,\n '& input': inheritFont,\n '& textarea': inheritFont,\n },\n // apply theme to only if applyTheme is true\n applyTheme && {\n color: theme.semanticColors.bodyText,\n backgroundColor: theme.semanticColors.bodyBackground,\n },\n className,\n ],\n bodyThemed: [\n {\n backgroundColor: theme.semanticColors.bodyBackground,\n },\n ],\n };\n};\n//# sourceMappingURL=Fabric.styles.js.map","import { styled } from '../../Utilities';\nimport { FabricBase } from './Fabric.base';\nimport { getStyles } from './Fabric.styles';\n/**\n * @deprecated This component is deprecated as of `@fluentui/react` version 8. Use `ThemeProvider` instead.\n */\nexport var Fabric = styled(FabricBase, getStyles, undefined, {\n scope: 'Fabric',\n});\n//# sourceMappingURL=Fabric.js.map","export var getActiveElement = function (doc) {\n var ae = doc.activeElement;\n while (ae === null || ae === void 0 ? void 0 : ae.shadowRoot) {\n ae = ae.shadowRoot.activeElement;\n }\n return ae;\n};\n//# sourceMappingURL=getActiveElement.js.map","export var getEventTarget = function (event) {\n var target = event.target;\n if (target && target.shadowRoot) {\n target = event.composedPath()[0];\n }\n return target;\n};\n//# sourceMappingURL=getEventTarget.js.map","import { __assign } from \"tslib\";\nimport * as React from 'react';\nimport { getActiveElement, getEventTarget, elementContains, getNativeProps, divProperties, getFirstTabbable, getLastTabbable, getNextElement, focusAsync, getPropsWithDefaults, modalize, on, useHasMergeStylesShadowRootContext, } from '../../Utilities';\nimport { useId, useConst, useMergedRefs, useEventCallback, usePrevious, useUnmount } from '@fluentui/react-hooks';\nimport { useDocument } from '../../WindowProvider';\nimport { useWindowEx } from '../../utilities/dom';\nvar COMPONENT_NAME = 'FocusTrapZone';\nvar DEFAULT_PROPS = {\n disabled: false,\n disableFirstFocus: false,\n forceFocusInsideTrap: true,\n isClickableOutsideFocusTrap: false,\n // Hardcoding completely uncontrolled flag for proper interop with FluentUI V9.\n 'data-tabster': '{\"uncontrolled\": {\"completely\": true}}',\n};\nvar useComponentRef = function (componentRef, previouslyFocusedElement, focusFTZ) {\n React.useImperativeHandle(componentRef, function () { return ({\n get previouslyFocusedElement() {\n return previouslyFocusedElement;\n },\n focus: focusFTZ,\n }); }, [focusFTZ, previouslyFocusedElement]);\n};\nexport var FocusTrapZone = React.forwardRef(function (propsWithoutDefaults, ref) {\n var _a;\n var root = React.useRef(null);\n var firstBumper = React.useRef(null);\n var lastBumper = React.useRef(null);\n var mergedRootRef = useMergedRefs(root, ref);\n var doc = useDocument();\n var win = useWindowEx();\n var inShadow = useHasMergeStylesShadowRootContext();\n var isFirstRender = (_a = usePrevious(false)) !== null && _a !== void 0 ? _a : true;\n var props = getPropsWithDefaults(DEFAULT_PROPS, propsWithoutDefaults);\n var internalState = useConst({\n hasFocus: false,\n focusStackId: useId('ftz-', props.id),\n });\n var children = props.children, componentRef = props.componentRef, disabled = props.disabled, disableFirstFocus = props.disableFirstFocus, forceFocusInsideTrap = props.forceFocusInsideTrap, focusPreviouslyFocusedInnerElement = props.focusPreviouslyFocusedInnerElement, \n // eslint-disable-next-line @typescript-eslint/no-deprecated\n firstFocusableSelector = props.firstFocusableSelector, firstFocusableTarget = props.firstFocusableTarget, \n // eslint-disable-next-line @typescript-eslint/no-deprecated\n _b = props.disableRestoreFocus, \n // eslint-disable-next-line @typescript-eslint/no-deprecated\n disableRestoreFocus = _b === void 0 ? props.ignoreExternalFocusing : _b, isClickableOutsideFocusTrap = props.isClickableOutsideFocusTrap, enableAriaHiddenSiblings = props.enableAriaHiddenSiblings;\n var bumperProps = {\n 'aria-hidden': true,\n style: {\n pointerEvents: 'none',\n position: 'fixed', // 'fixed' prevents browsers from scrolling to bumpers when viewport does not contain them\n },\n tabIndex: disabled ? -1 : 0, // make bumpers tabbable only when enabled\n 'data-is-visible': true,\n 'data-is-focus-trap-zone-bumper': true,\n };\n var focusElementAsync = React.useCallback(function (element) {\n if (element !== firstBumper.current && element !== lastBumper.current) {\n focusAsync(element);\n }\n }, []);\n /**\n * Callback to force focus into FTZ (named to avoid overlap with global focus() callback).\n * useEventCallback always returns the same callback reference but updates the implementation\n * every render to avoid stale captured values.\n */\n var focusFTZ = useEventCallback(function () {\n if (!root.current) {\n return; // not done mounting\n }\n var previouslyFocusedElementInTrapZone = internalState.previouslyFocusedElementInTrapZone;\n if (focusPreviouslyFocusedInnerElement &&\n previouslyFocusedElementInTrapZone &&\n elementContains(root.current, previouslyFocusedElementInTrapZone)) {\n // focus on the last item that had focus in the zone before we left the zone\n focusElementAsync(previouslyFocusedElementInTrapZone);\n return;\n }\n var firstFocusableChild = null;\n if (typeof firstFocusableTarget === 'string') {\n firstFocusableChild = root.current.querySelector(firstFocusableTarget);\n }\n else if (firstFocusableTarget) {\n firstFocusableChild = firstFocusableTarget(root.current);\n }\n else if (firstFocusableSelector) {\n var focusSelector = typeof firstFocusableSelector === 'string' ? firstFocusableSelector : firstFocusableSelector();\n firstFocusableChild = root.current.querySelector('.' + focusSelector);\n }\n // Fall back to first element if query selector did not match any elements.\n if (!firstFocusableChild) {\n firstFocusableChild = getNextElement(root.current, root.current.firstChild, false, false, false, true, undefined, undefined, undefined, inShadow);\n }\n if (firstFocusableChild) {\n focusElementAsync(firstFocusableChild);\n }\n });\n /** Used in root div focus/blur handlers */\n var focusBumper = function (isFirstBumper) {\n if (disabled || !root.current) {\n return;\n }\n var nextFocusable = isFirstBumper === internalState.hasFocus\n ? getLastTabbable(root.current, lastBumper.current, true, false, inShadow)\n : getFirstTabbable(root.current, firstBumper.current, true, false, inShadow);\n if (nextFocusable) {\n if (nextFocusable === firstBumper.current || nextFocusable === lastBumper.current) {\n // This can happen when FTZ contains no tabbable elements.\n // focusFTZ() will take care of finding a focusable element in FTZ.\n focusFTZ();\n }\n else {\n nextFocusable.focus();\n }\n }\n };\n /** Root div blur handler (doesn't need useCallback since it's for a native element) */\n var onRootBlurCapture = function (ev) {\n var _a;\n (_a = props.onBlurCapture) === null || _a === void 0 ? void 0 : _a.call(props, ev);\n var relatedTarget = ev.relatedTarget;\n if (ev.relatedTarget === null) {\n // In IE11, due to lack of support, event.relatedTarget is always\n // null making every onBlur call to be \"outside\" of the root\n // even when it's not. Using document.activeElement is another way\n // for us to be able to get what the relatedTarget without relying\n // on the event\n relatedTarget = getActiveElement(doc);\n }\n if (!elementContains(root.current, relatedTarget)) {\n internalState.hasFocus = false;\n }\n };\n /** Root div focus handler (doesn't need useCallback since it's for a native element) */\n var onRootFocusCapture = function (ev) {\n var _a;\n (_a = props.onFocusCapture) === null || _a === void 0 ? void 0 : _a.call(props, ev);\n if (ev.target === firstBumper.current) {\n focusBumper(true);\n }\n else if (ev.target === lastBumper.current) {\n focusBumper(false);\n }\n internalState.hasFocus = true;\n if (ev.target !== ev.currentTarget && !(ev.target === firstBumper.current || ev.target === lastBumper.current)) {\n // every time focus changes within the trap zone, remember the focused element so that\n // it can be restored if focus leaves the pane and returns via keystroke (i.e. via a call to this.focus(true))\n internalState.previouslyFocusedElementInTrapZone = getEventTarget(ev.nativeEvent);\n }\n };\n /** Called to restore focus on unmount or props change. (useEventCallback ensures latest prop values are used.) */\n var returnFocusToInitiator = useEventCallback(function (elementToFocusOnDismiss) {\n FocusTrapZone.focusStack = FocusTrapZone.focusStack.filter(function (value) { return internalState.focusStackId !== value; });\n if (!doc) {\n return;\n }\n // Do not use getActiveElement() here.\n // When the FTZ is in shadow DOM focus returns to the\n // shadow host rather than body so we need to be\n // able to inspect that\n var activeElement = doc.activeElement;\n if (!disableRestoreFocus &&\n typeof (elementToFocusOnDismiss === null || elementToFocusOnDismiss === void 0 ? void 0 : elementToFocusOnDismiss.focus) === 'function' &&\n // only restore focus if the current focused element is within the FTZ, or if nothing is focused\n (elementContains(root.current, activeElement) || activeElement === doc.body || activeElement.shadowRoot)) {\n focusElementAsync(elementToFocusOnDismiss);\n }\n });\n /** Called in window event handlers. (useEventCallback ensures latest prop values are used.) */\n var forceFocusOrClickInTrap = useEventCallback(function (ev) {\n // be sure to use the latest values here\n if (disabled) {\n return;\n }\n if (internalState.focusStackId === FocusTrapZone.focusStack.slice(-1)[0]) {\n var targetElement = getEventTarget(ev);\n if (targetElement && !elementContains(root.current, targetElement)) {\n if (doc && getActiveElement(doc) === doc.body) {\n setTimeout(function () {\n if (doc && getActiveElement(doc) === doc.body) {\n focusFTZ();\n internalState.hasFocus = true; // set focus here since we stop event propagation\n }\n }, 0);\n }\n else {\n focusFTZ();\n internalState.hasFocus = true; // set focus here since we stop event propagation\n }\n ev.preventDefault();\n ev.stopPropagation();\n }\n }\n });\n // Update window event handlers when relevant props change\n React.useEffect(function () {\n var disposables = [];\n if (forceFocusInsideTrap) {\n disposables.push(on(win, 'focus', forceFocusOrClickInTrap, true));\n }\n if (!isClickableOutsideFocusTrap) {\n disposables.push(on(win, 'click', forceFocusOrClickInTrap, true));\n }\n return function () {\n disposables.forEach(function (dispose) { return dispose(); });\n };\n // eslint-disable-next-line react-hooks/exhaustive-deps -- should only run when these two props change\n }, [forceFocusInsideTrap, isClickableOutsideFocusTrap, win]);\n // On prop change or first render, focus the FTZ and update focusStack if appropriate\n React.useEffect(function () {\n // Do nothing if disabled, or if it's a re-render and forceFocusInsideTrap is false\n // (to match existing behavior, the FTZ handles first focus even if forceFocusInsideTrap\n // is false, though it's debatable whether it should do this)\n if (disabled || (!isFirstRender && !forceFocusInsideTrap) || !root.current) {\n return;\n }\n // Transition from forceFocusInsideTrap / FTZ disabled to enabled (or initial mount)\n FocusTrapZone.focusStack.push(internalState.focusStackId);\n var elementToFocusOnDismiss = props.elementToFocusOnDismiss || getActiveElement(doc);\n if (!disableFirstFocus && !elementContains(root.current, elementToFocusOnDismiss)) {\n focusFTZ();\n }\n // To match existing behavior, always return focus on cleanup (even if we didn't handle\n // initial focus), but it's debatable whether that's correct\n return function () { return returnFocusToInitiator(elementToFocusOnDismiss); };\n // eslint-disable-next-line react-hooks/exhaustive-deps -- should only run when these two props change\n }, [forceFocusInsideTrap, disabled]);\n // Handle modalization separately from first focus\n React.useEffect(function () {\n if (!disabled && enableAriaHiddenSiblings) {\n var unmodalize = modalize(root.current);\n return unmodalize;\n }\n }, [disabled, enableAriaHiddenSiblings, root]);\n // Cleanup lifecyle method for internalState.\n useUnmount(function () {\n // Dispose of element references so the DOM Nodes can be garbage-collected\n delete internalState.previouslyFocusedElementInTrapZone;\n });\n useComponentRef(componentRef, internalState.previouslyFocusedElementInTrapZone, focusFTZ);\n return (React.createElement(\"div\", __assign({ \"aria-labelledby\": props.ariaLabelledBy }, getNativeProps(props, divProperties), { ref: mergedRootRef, onFocusCapture: onRootFocusCapture, onBlurCapture: onRootBlurCapture }),\n React.createElement(\"div\", __assign({}, bumperProps, { ref: firstBumper })),\n children,\n React.createElement(\"div\", __assign({}, bumperProps, { ref: lastBumper }))));\n});\nFocusTrapZone.displayName = COMPONENT_NAME;\nFocusTrapZone.focusStack = [];\n//# sourceMappingURL=FocusTrapZone.js.map","import { getGlobalClassNames } from '../../Styling';\nvar GlobalClassNames = {\n root: 'ms-groupFooter',\n};\nexport var getStyles = function (props) {\n var theme = props.theme, className = props.className;\n var classNames = getGlobalClassNames(GlobalClassNames, theme);\n return {\n root: [\n theme.fonts.medium,\n classNames.root,\n {\n position: 'relative',\n padding: '5px 38px',\n },\n className,\n ],\n };\n};\n//# sourceMappingURL=GroupFooter.styles.js.map","import * as React from 'react';\nimport { classNamesFunction } from '../../Utilities';\nimport { GroupSpacer } from './GroupSpacer';\nvar getClassNames = classNamesFunction();\nexport var GroupFooterBase = function (props) {\n var group = props.group, groupLevel = props.groupLevel, footerText = props.footerText, indentWidth = props.indentWidth, styles = props.styles, theme = props.theme;\n var classNames = getClassNames(styles, { theme: theme });\n if (group && footerText) {\n return (React.createElement(\"div\", { className: classNames.root },\n React.createElement(GroupSpacer, { indentWidth: indentWidth, count: groupLevel }),\n footerText));\n }\n return null;\n};\n//# sourceMappingURL=GroupFooter.base.js.map","import { styled } from '../../Utilities';\nimport { getStyles } from './GroupFooter.styles';\nimport { GroupFooterBase } from './GroupFooter.base';\nexport var GroupFooter = styled(GroupFooterBase, getStyles, undefined, {\n scope: 'GroupFooter',\n});\n//# sourceMappingURL=GroupFooter.js.map","import { getGlobalClassNames, getFocusStyle, AnimationVariables, FontWeights, IconFontSizes } from '../../Styling';\nimport { getRTL, IsFocusVisibleClassName } from '../../Utilities';\nimport { DEFAULT_CELL_STYLE_PROPS } from '../DetailsList/DetailsRow.styles';\nimport { CHECK_CELL_WIDTH } from '../DetailsList/DetailsRowCheck.styles';\n// For every group level there is a GroupSpacer added. Importing this const to have the source value in one place.\nimport { SPACER_WIDTH as EXPAND_BUTTON_WIDTH } from './GroupSpacer';\nvar GlobalClassNames = {\n root: 'ms-GroupHeader',\n compact: 'ms-GroupHeader--compact',\n check: 'ms-GroupHeader-check',\n dropIcon: 'ms-GroupHeader-dropIcon',\n expand: 'ms-GroupHeader-expand',\n isCollapsed: 'is-collapsed',\n title: 'ms-GroupHeader-title',\n isSelected: 'is-selected',\n iconTag: 'ms-Icon--Tag',\n group: 'ms-GroupedList-group',\n isDropping: 'is-dropping',\n};\nvar beziers = {\n easeOutCirc: 'cubic-bezier(0.075, 0.820, 0.165, 1.000)',\n easeOutSine: 'cubic-bezier(0.390, 0.575, 0.565, 1.000)',\n easeInBack: 'cubic-bezier(0.600, -0.280, 0.735, 0.045)',\n};\nvar DEFAULT_GROUP_HEADER_HEIGHT = 48;\nvar COMPACT_GROUP_HEADER_HEIGHT = 40;\nexport var getStyles = function (props) {\n var _a, _b, _c, _d, _e;\n var theme = props.theme, className = props.className, selected = props.selected, isCollapsed = props.isCollapsed, compact = props.compact;\n // padding from the source to align GroupHeader title with DetailsRow's first cell.\n var cellLeftPadding = DEFAULT_CELL_STYLE_PROPS.cellLeftPadding;\n var finalRowHeight = compact ? COMPACT_GROUP_HEADER_HEIGHT : DEFAULT_GROUP_HEADER_HEIGHT;\n var semanticColors = theme.semanticColors, palette = theme.palette, fonts = theme.fonts;\n var classNames = getGlobalClassNames(GlobalClassNames, theme);\n var checkExpandResetStyles = [\n getFocusStyle(theme),\n {\n cursor: 'default',\n background: 'none',\n backgroundColor: 'transparent',\n border: 'none',\n padding: 0, // cancel default