@fluentui/react-charting 4.23.16 → 4.23.18

package/dist/react-charting.js

@@ -28953,7 +28953,7 @@ __webpack_require__.r(__webpack_exports__);
 // Do not modify this file; it is generated as part of publish.
 // The checked in version is a placeholder only and will not be updated.
 
-Object(_uifabric_set_version__WEBPACK_IMPORTED_MODULE_0__["setVersion"])('@uifabric/charting', '4.23.15');
+Object(_uifabric_set_version__WEBPACK_IMPORTED_MODULE_0__["setVersion"])('@uifabric/charting', '4.23.17');
 
 
 /***/ }),
@@ -36056,6 +36056,97 @@ __webpack_require__.r(__webpack_exports__);
 
 
 
+/***/ }),
+
+/***/ "../../packages/office-ui-fabric-react/lib/Theme.js":
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony import */ var _fluentui_theme__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("../../packages/theme/lib/index.js");
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "AnimationStyles", function() { return _fluentui_theme__WEBPACK_IMPORTED_MODULE_0__["AnimationStyles"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "AnimationVariables", function() { return _fluentui_theme__WEBPACK_IMPORTED_MODULE_0__["AnimationVariables"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "CommunicationColors", function() { return _fluentui_theme__WEBPACK_IMPORTED_MODULE_0__["CommunicationColors"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "DefaultEffects", function() { return _fluentui_theme__WEBPACK_IMPORTED_MODULE_0__["DefaultEffects"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "DefaultFontStyles", function() { return _fluentui_theme__WEBPACK_IMPORTED_MODULE_0__["DefaultFontStyles"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "DefaultPalette", function() { return _fluentui_theme__WEBPACK_IMPORTED_MODULE_0__["DefaultPalette"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "DefaultSpacing", function() { return _fluentui_theme__WEBPACK_IMPORTED_MODULE_0__["DefaultSpacing"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Depths", function() { return _fluentui_theme__WEBPACK_IMPORTED_MODULE_0__["Depths"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "FluentTheme", function() { return _fluentui_theme__WEBPACK_IMPORTED_MODULE_0__["FluentTheme"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "createFontStyles", function() { return _fluentui_theme__WEBPACK_IMPORTED_MODULE_0__["createFontStyles"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "createTheme", function() { return _fluentui_theme__WEBPACK_IMPORTED_MODULE_0__["createTheme"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "LocalizedFontFamilies", function() { return _fluentui_theme__WEBPACK_IMPORTED_MODULE_0__["LocalizedFontFamilies"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "LocalizedFontNames", function() { return _fluentui_theme__WEBPACK_IMPORTED_MODULE_0__["LocalizedFontNames"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "mergeThemes", function() { return _fluentui_theme__WEBPACK_IMPORTED_MODULE_0__["mergeThemes"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "MotionDurations", function() { return _fluentui_theme__WEBPACK_IMPORTED_MODULE_0__["MotionDurations"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "MotionTimings", function() { return _fluentui_theme__WEBPACK_IMPORTED_MODULE_0__["MotionTimings"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "MotionAnimations", function() { return _fluentui_theme__WEBPACK_IMPORTED_MODULE_0__["MotionAnimations"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "NeutralColors", function() { return _fluentui_theme__WEBPACK_IMPORTED_MODULE_0__["NeutralColors"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "SharedColors", function() { return _fluentui_theme__WEBPACK_IMPORTED_MODULE_0__["SharedColors"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "registerDefaultFontFaces", function() { return _fluentui_theme__WEBPACK_IMPORTED_MODULE_0__["registerDefaultFontFaces"]; });
+
+/* harmony import */ var _fluentui_react_theme_provider__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__("../../packages/react-theme-provider/lib/index.js");
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "ThemeProvider", function() { return _fluentui_react_theme_provider__WEBPACK_IMPORTED_MODULE_1__["ThemeProvider"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "useThemeProviderClasses", function() { return _fluentui_react_theme_provider__WEBPACK_IMPORTED_MODULE_1__["useThemeProviderClasses"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "useThemeProvider", function() { return _fluentui_react_theme_provider__WEBPACK_IMPORTED_MODULE_1__["useThemeProvider"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "useThemeProviderState", function() { return _fluentui_react_theme_provider__WEBPACK_IMPORTED_MODULE_1__["useThemeProviderState"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "withThemeProvider", function() { return _fluentui_react_theme_provider__WEBPACK_IMPORTED_MODULE_1__["withThemeProvider"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "applyClasses", function() { return _fluentui_react_theme_provider__WEBPACK_IMPORTED_MODULE_1__["applyClasses"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "useTheme", function() { return _fluentui_react_theme_provider__WEBPACK_IMPORTED_MODULE_1__["useTheme"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "ThemeContext", function() { return _fluentui_react_theme_provider__WEBPACK_IMPORTED_MODULE_1__["ThemeContext"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "getStyleFromPropsAndOptions", function() { return _fluentui_react_theme_provider__WEBPACK_IMPORTED_MODULE_1__["getStyleFromPropsAndOptions"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "tokensToStyleObject", function() { return _fluentui_react_theme_provider__WEBPACK_IMPORTED_MODULE_1__["tokensToStyleObject"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "useInlineTokens", function() { return _fluentui_react_theme_provider__WEBPACK_IMPORTED_MODULE_1__["useInlineTokens"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "makeVariantClasses", function() { return _fluentui_react_theme_provider__WEBPACK_IMPORTED_MODULE_1__["makeVariantClasses"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "makeStyles", function() { return _fluentui_react_theme_provider__WEBPACK_IMPORTED_MODULE_1__["makeStyles"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "makeClasses", function() { return _fluentui_react_theme_provider__WEBPACK_IMPORTED_MODULE_1__["makeClasses"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "mergeStylesRenderer", function() { return _fluentui_react_theme_provider__WEBPACK_IMPORTED_MODULE_1__["mergeStylesRenderer"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "MergeStylesProvider", function() { return _fluentui_react_theme_provider__WEBPACK_IMPORTED_MODULE_1__["MergeStylesProvider"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "StyleRendererContext", function() { return _fluentui_react_theme_provider__WEBPACK_IMPORTED_MODULE_1__["StyleRendererContext"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "useStyleRenderer", function() { return _fluentui_react_theme_provider__WEBPACK_IMPORTED_MODULE_1__["useStyleRenderer"]; });
+
+//When adding new exports to this file, also add them to index.ts.
+
+
+//When adding new exports to this file, also add them to index.ts.
+
+
 /***/ }),
 
 /***/ "../../packages/office-ui-fabric-react/lib/ThemeGenerator.js":
@@ -41982,7 +42073,7 @@ var CalloutContentBase = /** @class */ (function (_super) {
         // eslint-disable-next-line deprecation/deprecation
         _c = _a.shouldRestoreFocus, 
         // eslint-disable-next-line deprecation/deprecation
-        shouldRestoreFocus = _c === void 0 ? true : _c;
+        shouldRestoreFocus = _c === void 0 ? true : _c, popupProps = _a.popupProps;
         target = this._getTarget();
         var positions = this.state.positions;
         var getContentMaxHeight = this._getMaxHeight()
@@ -42014,7 +42105,7 @@ var CalloutContentBase = /** @class */ (function (_super) {
                 tabIndex: -1, ref: this._calloutElement }),
                 beakVisible && react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { className: this._classNames.beak, style: this._getBeakPosition() }),
                 beakVisible && react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { className: this._classNames.beakCurtain }),
-                react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_Popup__WEBPACK_IMPORTED_MODULE_5__["Popup"], Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__assign"])({}, Object(_Utilities__WEBPACK_IMPORTED_MODULE_3__["getNativeProps"])(this.props, ARIA_ROLE_ATTRIBUTES), { ariaLabel: ariaLabel, onRestoreFocus: this.props.onRestoreFocus, ariaDescribedBy: ariaDescribedBy, ariaLabelledBy: ariaLabelledBy, className: this._classNames.calloutMain, onDismiss: this.dismiss, onScroll: onScroll, shouldRestoreFocus: shouldRestoreFocus, style: overflowStyle, onMouseDown: this._mouseDownOnPopup, onMouseUp: this._mouseUpOnPopup }), children))));
+                react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_Popup__WEBPACK_IMPORTED_MODULE_5__["Popup"], Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__assign"])({}, Object(_Utilities__WEBPACK_IMPORTED_MODULE_3__["getNativeProps"])(this.props, ARIA_ROLE_ATTRIBUTES), { ariaLabel: ariaLabel, onRestoreFocus: this.props.onRestoreFocus, ariaDescribedBy: ariaDescribedBy, ariaLabelledBy: ariaLabelledBy, className: this._classNames.calloutMain, onDismiss: this.dismiss, onScroll: onScroll, shouldRestoreFocus: shouldRestoreFocus, style: overflowStyle, onMouseDown: this._mouseDownOnPopup, onMouseUp: this._mouseUpOnPopup }, popupProps), children))));
         return content;
     };
     CalloutContentBase.prototype._dismissOnClickOrScroll = function (ev) {
@@ -87524,7 +87615,40 @@ __webpack_require__.r(__webpack_exports__);
 
 /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "WindowProvider", function() { return _WindowProvider__WEBPACK_IMPORTED_MODULE_87__["WindowProvider"]; });
 
-/* harmony import */ var _version__WEBPACK_IMPORTED_MODULE_88__ = __webpack_require__("../../packages/office-ui-fabric-react/lib/version.js");
+/* harmony import */ var _Theme__WEBPACK_IMPORTED_MODULE_88__ = __webpack_require__("../../packages/office-ui-fabric-react/lib/Theme.js");
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "ThemeContext", function() { return _Theme__WEBPACK_IMPORTED_MODULE_88__["ThemeContext"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "ThemeProvider", function() { return _Theme__WEBPACK_IMPORTED_MODULE_88__["ThemeProvider"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "makeStyles", function() { return _Theme__WEBPACK_IMPORTED_MODULE_88__["makeStyles"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "useTheme", function() { return _Theme__WEBPACK_IMPORTED_MODULE_88__["useTheme"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "CommunicationColors", function() { return _Theme__WEBPACK_IMPORTED_MODULE_88__["CommunicationColors"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "DefaultSpacing", function() { return _Theme__WEBPACK_IMPORTED_MODULE_88__["DefaultSpacing"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Depths", function() { return _Theme__WEBPACK_IMPORTED_MODULE_88__["Depths"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "FluentTheme", function() { return _Theme__WEBPACK_IMPORTED_MODULE_88__["FluentTheme"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "LocalizedFontFamilies", function() { return _Theme__WEBPACK_IMPORTED_MODULE_88__["LocalizedFontFamilies"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "LocalizedFontNames", function() { return _Theme__WEBPACK_IMPORTED_MODULE_88__["LocalizedFontNames"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "mergeThemes", function() { return _Theme__WEBPACK_IMPORTED_MODULE_88__["mergeThemes"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "MotionDurations", function() { return _Theme__WEBPACK_IMPORTED_MODULE_88__["MotionDurations"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "MotionTimings", function() { return _Theme__WEBPACK_IMPORTED_MODULE_88__["MotionTimings"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "MotionAnimations", function() { return _Theme__WEBPACK_IMPORTED_MODULE_88__["MotionAnimations"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "NeutralColors", function() { return _Theme__WEBPACK_IMPORTED_MODULE_88__["NeutralColors"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "SharedColors", function() { return _Theme__WEBPACK_IMPORTED_MODULE_88__["SharedColors"]; });
+
+/* harmony import */ var _version__WEBPACK_IMPORTED_MODULE_89__ = __webpack_require__("../../packages/office-ui-fabric-react/lib/version.js");
 
 
 
@@ -87615,6 +87739,8 @@ __webpack_require__.r(__webpack_exports__);
 
 
 
+
+
 
 
 
@@ -92228,7 +92354,382 @@ __webpack_require__.r(__webpack_exports__);
 // Do not modify this file; it is generated as part of publish.
 // The checked in version is a placeholder only and will not be updated.
 
-Object(_uifabric_set_version__WEBPACK_IMPORTED_MODULE_0__["setVersion"])('office-ui-fabric-react', '7.199.6');
+Object(_uifabric_set_version__WEBPACK_IMPORTED_MODULE_0__["setVersion"])('office-ui-fabric-react', '7.200.0');
+
+
+/***/ }),
+
+/***/ "../../packages/react-compose/lib/appendClasses.js":
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "appendClasses", function() { return appendClasses; });
+function appendClasses() {
+    var classes = [];
+    for (var _i = 0; _i < arguments.length; _i++) {
+        classes[_i] = arguments[_i];
+    }
+    var result = '';
+    for (var _a = 0, classes_1 = classes; _a < classes_1.length; _a++) {
+        var className = classes_1[_a];
+        if (className) {
+            result = (result ? result + " " : '') + className;
+        }
+    }
+    return result;
+}
+
+
+/***/ }),
+
+/***/ "../../packages/react-compose/lib/createClassResolver.js":
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "createClassResolver", function() { return createClassResolver; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "createResolvedMap", function() { return createResolvedMap; });
+/* harmony import */ var _appendClasses__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("../../packages/react-compose/lib/appendClasses.js");
+
+/**
+ * `createClassResolver` is a factory function which creates a state to classmap resolver for
+ * slot specific class names. It can be used in conjunction with the `compose` option `classes` to
+ * inject css modules without writing cx(...) logic manually distributing classnames.
+ *
+ * Class names which map to slots are automatically distributed to correct slot props.
+ *
+ * Class names with an underscore are interpretted as enum matchable classes. For example,
+ * the class "size_large" would be applied to the `root` slot when the component's state contains
+ * a prop `size` with a value `large`.
+ *
+ * Remaining class names would be interpretted as modifiers, applied to the `root` slot when
+ * the component `state` contains a truthy matching prop name.
+ */
+var createClassResolver = function (classes) {
+    // This is in creation time, so this will happen once per css file.
+    var _a = createResolvedMap(classes), slots = _a.slots, modifiers = _a.modifiers, enums = _a.enums;
+    // Everything in the function below will happen at runtime, so it's very critical that this
+    // code is as minimal as possible.
+    return function classResolver(state) {
+        var resolvedClasses = {};
+        var modifierClasses = '';
+        for (var _i = 0, _a = Object.keys(modifiers); _i < _a.length; _i++) {
+            var modifierName = _a[_i];
+            if (state[modifierName]) {
+                modifierClasses = Object(_appendClasses__WEBPACK_IMPORTED_MODULE_0__["appendClasses"])(modifierClasses, modifiers[modifierName]);
+            }
+        }
+        var enumClasses = '';
+        for (var _b = 0, _c = Object.keys(enums); _b < _c.length; _b++) {
+            var enumName = _c[_b];
+            var enumValues = enums[enumName];
+            // if we have a class which matches the enumName and current state value, add it.
+            if (enumValues[state[enumName]]) {
+                enumClasses = Object(_appendClasses__WEBPACK_IMPORTED_MODULE_0__["appendClasses"])(enumClasses, enumValues[state[enumName]]);
+            }
+        }
+        for (var _d = 0, _e = Object.keys(slots); _d < _e.length; _d++) {
+            var slotName = _e[_d];
+            resolvedClasses[slotName] = Object(_appendClasses__WEBPACK_IMPORTED_MODULE_0__["appendClasses"])(slots[slotName], modifierClasses, enumClasses);
+        }
+        return resolvedClasses;
+    };
+};
+/**
+ * Helper to take a css module map and translate it into { slots, modifiers, enums } where
+ * slots are a matched name in the slotNames array, enums have underscores splitting the matched
+ * name/value, and modifiers are everything else. Creating this split definition keeps runtime
+ * resolution work to a minimum.
+ */
+function createResolvedMap(classes) {
+    var resolvedMap = {
+        slots: {},
+        modifiers: {},
+        enums: {},
+    };
+    var slots = resolvedMap.slots, modifiers = resolvedMap.modifiers, enums = resolvedMap.enums;
+    // Iterate through classes
+    Object.keys(classes).forEach(function (key) {
+        var classValue = classes[key];
+        if (classValue) {
+            var classParts = key.split('_');
+            // If the class is named the same as a slot, add it to the slot.
+            switch (classParts.length) {
+                case 2: // modifier (_modifierName)
+                    modifiers[classParts[1]] = classValue;
+                    break;
+                case 3: // enum (_enumName_enumValue)
+                    var enumName = classParts[1];
+                    var enumValue = classParts[2];
+                    var enumValues = (enums[enumName] = enums[enumName] || {});
+                    enumValues[enumValue] = classValue;
+                    break;
+                default:
+                    // slot (root)
+                    slots[key] = classValue;
+            }
+        }
+    });
+    return resolvedMap;
+}
+
+
+/***/ }),
+
+/***/ "../../packages/react-compose/lib/next/getSlots.js":
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "getSlots", function() { return getSlots; });
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var _uifabric_utilities__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__("../../packages/utilities/lib/index.js");
+/* harmony import */ var _nullRender__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__("../../packages/react-compose/lib/next/nullRender.js");
+
+
+
+/**
+ * Given the state and an array of slot names, will break out `slots` and `slotProps`
+ * collections.
+ *
+ * The root is always derived from the `as` prop.
+ *
+ * Slots will render as null if they are rendered as primitives with undefined children.
+ *
+ * The slotProps will always omit the `as` prop within them, and for slots that are string
+ * primitives, the props will be filtered according the the slot type. For example, if the
+ * slot is rendered `as: 'a'`, the props will be filtered for acceptable anchor props.
+ *
+ * @param state - State including slot definitions
+ * @param slotNames - Name of which props are slots
+ * @returns An object containing the `slots` map and `slotProps` map.
+ */
+var getSlots = function (state, slotNames) {
+    var slots = {
+        root: state.as || 'div',
+    };
+    var slotProps = {
+        root: typeof state.as === 'string' ? Object(_uifabric_utilities__WEBPACK_IMPORTED_MODULE_1__["getNativeElementProps"])(state.as, state) : Object(_uifabric_utilities__WEBPACK_IMPORTED_MODULE_1__["omit"])(state, ['as']),
+    };
+    if (slotNames) {
+        for (var _i = 0, slotNames_1 = slotNames; _i < slotNames_1.length; _i++) {
+            var name_1 = slotNames_1[_i];
+            var slotDefinition = state[name_1] || {};
+            var _a = slotDefinition.as, slotAs = _a === void 0 ? 'span' : _a, children = slotDefinition.children;
+            var isSlotPrimitive = typeof slotAs === 'string';
+            var isSlotEmpty = isSlotPrimitive && slotDefinition.children === undefined;
+            slots[name_1] = isSlotEmpty ? _nullRender__WEBPACK_IMPORTED_MODULE_2__["nullRender"] : slotAs;
+            if (typeof children === 'function') {
+                slotProps[name_1] = {
+                    children: children(slots[name_1], Object(_uifabric_utilities__WEBPACK_IMPORTED_MODULE_1__["omit"])(slotDefinition, ['as', 'children'])),
+                };
+                slots[name_1] = react__WEBPACK_IMPORTED_MODULE_0__["Fragment"];
+            }
+            else if (slots[name_1] !== _nullRender__WEBPACK_IMPORTED_MODULE_2__["nullRender"]) {
+                slotProps[name_1] = isSlotPrimitive
+                    ? Object(_uifabric_utilities__WEBPACK_IMPORTED_MODULE_1__["getNativeElementProps"])(slotAs, slotDefinition)
+                    : Object(_uifabric_utilities__WEBPACK_IMPORTED_MODULE_1__["omit"])(slotDefinition, ['as']);
+            }
+        }
+    }
+    return { slots: slots, slotProps: slotProps };
+};
+
+
+/***/ }),
+
+/***/ "../../packages/react-compose/lib/next/index.js":
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony import */ var _getSlots__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("../../packages/react-compose/lib/next/getSlots.js");
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "getSlots", function() { return _getSlots__WEBPACK_IMPORTED_MODULE_0__["getSlots"]; });
+
+/* harmony import */ var _makeMergeProps__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__("../../packages/react-compose/lib/next/makeMergeProps.js");
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "makeMergeProps", function() { return _makeMergeProps__WEBPACK_IMPORTED_MODULE_1__["makeMergeProps"]; });
+
+/* harmony import */ var _resolveShorthandProps__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__("../../packages/react-compose/lib/next/resolveShorthandProps.js");
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "resolveShorthandProps", function() { return _resolveShorthandProps__WEBPACK_IMPORTED_MODULE_2__["resolveShorthandProps"]; });
+
+/* harmony import */ var _makeClasses__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__("../../packages/react-compose/lib/next/makeClasses.js");
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "makeClasses", function() { return _makeClasses__WEBPACK_IMPORTED_MODULE_3__["makeClasses"]; });
+
+
+
+
+
+
+
+/***/ }),
+
+/***/ "../../packages/react-compose/lib/next/makeClasses.js":
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "makeClasses", function() { return makeClasses; });
+/* harmony import */ var _appendClasses__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("../../packages/react-compose/lib/appendClasses.js");
+/* harmony import */ var _createClassResolver__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__("../../packages/react-compose/lib/createClassResolver.js");
+
+
+var makeClasses = function (classes) {
+    // This is in creation time, so this will happen once per css file.
+    var _a = Object(_createClassResolver__WEBPACK_IMPORTED_MODULE_1__["createResolvedMap"])(classes), slots = _a.slots, modifiers = _a.modifiers, enums = _a.enums;
+    return function useClasses(state) {
+        var _a;
+        var modifierClasses = '';
+        var enumClasses = '';
+        for (var _i = 0, _b = Object.keys(modifiers); _i < _b.length; _i++) {
+            var modifierName = _b[_i];
+            if (state[modifierName]) {
+                modifierClasses = Object(_appendClasses__WEBPACK_IMPORTED_MODULE_0__["appendClasses"])(modifierClasses, modifiers[modifierName]);
+            }
+        }
+        for (var _c = 0, _d = Object.keys(enums); _c < _d.length; _c++) {
+            var enumName = _d[_c];
+            var enumValues = enums[enumName];
+            // if we have a class which matches the enumName and current state value, add it.
+            if (enumValues[state[enumName]] !== undefined) {
+                enumClasses = Object(_appendClasses__WEBPACK_IMPORTED_MODULE_0__["appendClasses"])(enumClasses, enumValues[state[enumName]]);
+            }
+        }
+        state.className = Object(_appendClasses__WEBPACK_IMPORTED_MODULE_0__["appendClasses"])(state.className, slots.root, modifierClasses, enumClasses);
+        for (var _e = 0, _f = Object.keys(slots); _e < _f.length; _e++) {
+            var slotName = _f[_e];
+            if (slotName !== 'root') {
+                state[slotName] = state[slotName] || {};
+                state[slotName].className = Object(_appendClasses__WEBPACK_IMPORTED_MODULE_0__["appendClasses"])((_a = state[slotName]) === null || _a === void 0 ? void 0 : _a.className, slots[slotName]);
+            }
+        }
+    };
+};
+
+
+/***/ }),
+
+/***/ "../../packages/react-compose/lib/next/makeMergeProps.js":
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "makeMergeProps", function() { return makeMergeProps; });
+/* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("../../node_modules/tslib/tslib.es6.js");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__("react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);
+/* harmony import */ var _uifabric_utilities__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__("../../packages/utilities/lib/index.js");
+
+
+
+/**
+ * Helper which deep clones props, but respectively assigns JSX, object refs, and class names
+ * appropriately.
+ *
+ * @param target - the target object to merge onto.
+ * @param propSets - one or more prop sets to deep merge onto the target.
+ */
+var makeMergeProps = function (options) {
+    if (options === void 0) { options = {}; }
+    var deepMerge = Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__spreadArrays"])((options.deepMerge || []), ['style']);
+    var mergeProps = function (target) {
+        var propSets = [];
+        for (var _i = 1; _i < arguments.length; _i++) {
+            propSets[_i - 1] = arguments[_i];
+        }
+        for (var _a = 0, propSets_1 = propSets; _a < propSets_1.length; _a++) {
+            var props = propSets_1[_a];
+            if (props) {
+                for (var _b = 0, _c = Object.keys(props); _b < _c.length; _b++) {
+                    var propName = _c[_b];
+                    var propValue = props[propName];
+                    var propValueType = typeof propValue;
+                    if (propValue !== undefined) {
+                        if (propValue && propValueType === 'object') {
+                            if (Array.isArray(propValue)) {
+                                // for arrays, replace.
+                                target[propName] = propValue;
+                            }
+                            else {
+                                target[propName] = target[propName] || {};
+                                if (typeof target[propName] !== 'object' ||
+                                    react__WEBPACK_IMPORTED_MODULE_1__["isValidElement"](propValue) ||
+                                    (propValue && typeof propValue === 'object' && propValue.hasOwnProperty('current')) ||
+                                    deepMerge.indexOf(propName) === -1) {
+                                    // if target is not an object, or value is JSX,  or a ref object, replace
+                                    target[propName] = propValue;
+                                }
+                                else {
+                                    // else deep merge.
+                                    mergeProps(target[propName], propValue);
+                                }
+                            }
+                        }
+                        else if (propName === 'className') {
+                            if (propValue) {
+                                // for classnames, append
+                                target[propName] = Object(_uifabric_utilities__WEBPACK_IMPORTED_MODULE_2__["css"])(target[propName], propValue);
+                            }
+                        }
+                        else {
+                            target[propName] = propValue;
+                        }
+                    }
+                }
+            }
+        }
+        return target;
+    };
+    return mergeProps;
+};
+
+
+/***/ }),
+
+/***/ "../../packages/react-compose/lib/next/nullRender.js":
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "nullRender", function() { return nullRender; });
+var nullRender = function () { return null; };
+
+
+/***/ }),
+
+/***/ "../../packages/react-compose/lib/next/resolveShorthandProps.js":
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "resolveShorthandProps", function() { return resolveShorthandProps; });
+/* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("../../node_modules/tslib/tslib.es6.js");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__("react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);
+
+
+/**
+ * Ensures that the given slots are represented using object syntax. This ensures that
+ * the object can be merged along with other objects.
+ * @param props - The incoming props
+ * @param shorthandPropNames - An array of prop names to apply simplification to
+ */
+var resolveShorthandProps = function (props, shorthandPropNames) {
+    var newProps = props;
+    if (shorthandPropNames && shorthandPropNames.length) {
+        newProps = Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__assign"])({}, props);
+        for (var _i = 0, shorthandPropNames_1 = shorthandPropNames; _i < shorthandPropNames_1.length; _i++) {
+            var propName = shorthandPropNames_1[_i];
+            var propValue = props[propName];
+            if (propValue !== undefined && (typeof propValue !== 'object' || react__WEBPACK_IMPORTED_MODULE_1__["isValidElement"](propValue))) {
+                // eslint-disable-next-line @typescript-eslint/no-explicit-any
+                newProps[propName] = { children: propValue };
+            }
+        }
+    }
+    return newProps;
+};
 
 
 /***/ }),
@@ -94138,6 +94639,1121 @@ __webpack_require__.r(__webpack_exports__);
 Object(_uifabric_set_version__WEBPACK_IMPORTED_MODULE_0__["setVersion"])('@uifabric/react-hooks', '7.16.4');
 
 
+/***/ }),
+
+/***/ "../../packages/react-stylesheets/lib/StylesheetContext.js":
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "registerStyles", function() { return registerStyles; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "StylesheetContext", function() { return StylesheetContext; });
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
+
+var defaultDocument = { document: 'document' };
+/**
+ * Register styles can be called with a single or multiple stylesheets. Each will be evaluated
+ * if they've been registered already, and then passed along to `renderStyles` if they're new
+ * to the given context.
+ */
+var registerStyles = function (sheets, context) {
+    var styleCache = context.styleCache, target = context.target;
+    if (!sheets || sheets.length < 1) {
+        return;
+    }
+    if (!Array.isArray(sheets)) {
+        sheets = [sheets];
+    }
+    // Grab the style cache for the target document.
+    var sheetsToRender = [];
+    var cacheKey = target || defaultDocument;
+    var targetStylesheets = styleCache.get(cacheKey);
+    if (!targetStylesheets) {
+        targetStylesheets = new Map();
+        styleCache.set(cacheKey, targetStylesheets);
+    }
+    for (var _i = 0, sheets_1 = sheets; _i < sheets_1.length; _i++) {
+        var sheet = sheets_1[_i];
+        if (!targetStylesheets.has(sheet)) {
+            sheetsToRender.push(sheet);
+            targetStylesheets.set(sheet, true);
+        }
+    }
+    if (sheetsToRender.length) {
+        context.renderStyles(sheetsToRender, context);
+    }
+};
+/**
+ * Default renderStyles implementation, which will render the give sheets to the contextual
+ * target.
+ */
+var renderStyles = function (sheets, context) {
+    var target = context.target;
+    if (sheets.length && target) {
+        var styleElement = target.createElement('style');
+        styleElement.textContent = sheets.join('');
+        target.head.appendChild(styleElement);
+    }
+};
+// Shared stylesheet context, providing the registration function and target document.
+var StylesheetContext = react__WEBPACK_IMPORTED_MODULE_0__["createContext"]({
+    registerStyles: registerStyles,
+    renderStyles: renderStyles,
+    target: typeof window === 'object' ? window.document : undefined,
+    styleCache: new WeakMap(),
+});
+
+
+/***/ }),
+
+/***/ "../../packages/react-stylesheets/lib/StylesheetProvider.js":
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "StylesheetProvider", function() { return StylesheetProvider; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "StylesheetConsumer", function() { return StylesheetConsumer; });
+/* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("../../node_modules/tslib/tslib.es6.js");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__("react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);
+/* harmony import */ var _StylesheetContext__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__("../../packages/react-stylesheets/lib/StylesheetContext.js");
+
+
+
+/**
+ * Provider for registering stylesheets in a given target document.
+ * The `register` method can be called many times and will only register once
+ * per unique target document.
+ */
+var StylesheetProvider = function (props) {
+    var context = react__WEBPACK_IMPORTED_MODULE_1__["useContext"](_StylesheetContext__WEBPACK_IMPORTED_MODULE_2__["StylesheetContext"]);
+    var mergedContext = react__WEBPACK_IMPORTED_MODULE_1__["useMemo"](function () { return (Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__assign"])(Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__assign"])({}, context), props)); }, 
+    // Only recompute the context to pass down if the parent passes a new one. Props should not
+    // be mutating dynamically for a provider, or may be doing so accidentally. Avoid recomputations.
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [context]);
+    return react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_StylesheetContext__WEBPACK_IMPORTED_MODULE_2__["StylesheetContext"].Provider, { value: mergedContext }, props.children);
+};
+var StylesheetConsumer = _StylesheetContext__WEBPACK_IMPORTED_MODULE_2__["StylesheetContext"].Consumer;
+
+
+/***/ }),
+
+/***/ "../../packages/react-stylesheets/lib/index.js":
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony import */ var _version__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("../../packages/react-stylesheets/lib/version.js");
+/* harmony import */ var _StylesheetContext__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__("../../packages/react-stylesheets/lib/StylesheetContext.js");
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "StylesheetContext", function() { return _StylesheetContext__WEBPACK_IMPORTED_MODULE_1__["StylesheetContext"]; });
+
+/* harmony import */ var _StylesheetProvider__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__("../../packages/react-stylesheets/lib/StylesheetProvider.js");
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "StylesheetProvider", function() { return _StylesheetProvider__WEBPACK_IMPORTED_MODULE_2__["StylesheetProvider"]; });
+
+/* harmony import */ var _useStylesheet__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__("../../packages/react-stylesheets/lib/useStylesheet.js");
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "useStylesheet", function() { return _useStylesheet__WEBPACK_IMPORTED_MODULE_3__["useStylesheet"]; });
+
+
+
+
+
+
+
+/***/ }),
+
+/***/ "../../packages/react-stylesheets/lib/useStylesheet.js":
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "useStylesheet", function() { return useStylesheet; });
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var _StylesheetContext__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__("../../packages/react-stylesheets/lib/StylesheetContext.js");
+
+
+/**
+ * A hook for providing a stylesheet or array of stylesheets. Can be used standalone
+ * or with the `StylesheetProvider` component to direct styles to be registered to a
+ * different target such as a child window or as a string in SSR scenarios.
+ */
+var useStylesheet = function (sheets) {
+    var context = react__WEBPACK_IMPORTED_MODULE_0__["useContext"](_StylesheetContext__WEBPACK_IMPORTED_MODULE_1__["StylesheetContext"]);
+    context.registerStyles(sheets, context);
+};
+
+
+/***/ }),
+
+/***/ "../../packages/react-stylesheets/lib/version.js":
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony import */ var _uifabric_set_version__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("../../packages/set-version/lib/index.js");
+// Do not modify this file; it is generated as part of publish.
+// The checked in version is a placeholder only and will not be updated.
+
+Object(_uifabric_set_version__WEBPACK_IMPORTED_MODULE_0__["setVersion"])('@fluentui/react-stylesheets', '0.2.9');
+
+
+/***/ }),
+
+/***/ "../../packages/react-theme-provider/lib/ThemeContext.js":
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ThemeContext", function() { return ThemeContext; });
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
+
+var ThemeContext = react__WEBPACK_IMPORTED_MODULE_0__["createContext"](undefined);
+
+
+/***/ }),
+
+/***/ "../../packages/react-theme-provider/lib/ThemeProvider.js":
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ThemeProvider", function() { return ThemeProvider; });
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var _useThemeProviderClasses__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__("../../packages/react-theme-provider/lib/useThemeProviderClasses.js");
+/* harmony import */ var _useThemeProvider__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__("../../packages/react-theme-provider/lib/useThemeProvider.js");
+/* harmony import */ var _styleRenderers_mergeStylesRenderer__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__("../../packages/react-theme-provider/lib/styleRenderers/mergeStylesRenderer.js");
+/* harmony import */ var _fluentui_react_stylesheets__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__("../../packages/react-stylesheets/lib/index.js");
+/* harmony import */ var _uifabric_utilities__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__("../../packages/utilities/lib/index.js");
+
+
+
+
+
+
+/**
+ * ThemeProvider, used for providing css variables and registering stylesheets.
+ */
+var ThemeProvider = react__WEBPACK_IMPORTED_MODULE_0__["forwardRef"](function (props, ref) {
+    var _a = Object(_useThemeProvider__WEBPACK_IMPORTED_MODULE_2__["useThemeProvider"])(props, ref, {
+        // The renderer default value is required to be defined, so if you're recomposing
+        // this component, be sure to do so.
+        renderer: _styleRenderers_mergeStylesRenderer__WEBPACK_IMPORTED_MODULE_3__["mergeStylesRenderer"],
+        applyTo: 'element',
+    }), render = _a.render, state = _a.state;
+    // Register stylesheets as needed.
+    Object(_fluentui_react_stylesheets__WEBPACK_IMPORTED_MODULE_4__["useStylesheet"])(state.theme.stylesheets);
+    // Render styles.
+    Object(_useThemeProviderClasses__WEBPACK_IMPORTED_MODULE_1__["useThemeProviderClasses"])(state);
+    // Apply focus rect class on key presses.
+    Object(_uifabric_utilities__WEBPACK_IMPORTED_MODULE_5__["useFocusRects"])(state.ref);
+    // Return the rendered content.
+    return render(state);
+});
+ThemeProvider.displayName = 'ThemeProvider';
+
+
+/***/ }),
+
+/***/ "../../packages/react-theme-provider/lib/applyClasses.js":
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "applyClasses", function() { return applyClasses; });
+/**
+ * The `applyClasses` takes in a mutable state and a class map and, given the class map
+ * follows the a naming convention described below, auto-applies classes to the appropriate places
+ * in the state.
+ *
+ * Usage:
+ *
+ * ```tsx
+ * const useButtonClasses = makeClasses(theme => {
+ *   root: { ... },
+ *   _primary: { ... },
+ *   _size_small: { ... }
+ * });
+ * ```
+ *
+ * The class naming convention is broken down as follows:
+ *
+ * * No underscores - a slot class name. (E.g. "root", "icon", etc)
+ * * Prefixed with underscore - a modifier. (E.g. "_primary", "_fluid")
+ * * Contains 2 underscores - a name/value matcher. (E.g. "_size_small")
+ *
+ * Modifier classnames are added to the root className when the state contains a truthy value
+ * of the same name. For example, when the primary flag is present, the "_primary" modifier
+ * class will be appended to the root className prop.
+ *
+ * Enum classnames are also added to the root className when teh state contains an enum value
+ * which matches the value in the className. for example, when the `size` enum value is `small`,
+ * the "_size_small" enum class will be appended to the root className prop.
+ */
+var applyClasses = function (state, classMap) {
+    for (var _i = 0, _a = Object.keys(classMap); _i < _a.length; _i++) {
+        var key = _a[_i];
+        var value = classMap[key];
+        var parts = key.split('_');
+        switch (parts.length) {
+            case 1:
+                if (key === 'root') {
+                    _setClass(state, value);
+                }
+                else if (key !== 'subComponentStyles') {
+                    // The subComponentStyles check is an unfortunate workaround to avoid breaking partners.
+                    _setClass(state, value, key);
+                }
+                break;
+            case 2:
+                var modifierName = parts[1];
+                // eslint-disable-next-line @typescript-eslint/no-explicit-any
+                if (state[modifierName] || state.variant === modifierName) {
+                    _setClass(state, value);
+                }
+                break;
+            case 3:
+                var enumName = parts[1];
+                var enumValue = parts[2];
+                // eslint-disable-next-line @typescript-eslint/no-explicit-any
+                if (state[enumName] === enumValue) {
+                    _setClass(state, value);
+                }
+                break;
+        }
+    }
+};
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+function _setClass(state, className, slot) {
+    var currentSlot = slot ? (state[slot] = state[slot] || {}) : state;
+    if (currentSlot.className) {
+        currentSlot.className += ' ' + className;
+    }
+    else {
+        currentSlot.className = className;
+    }
+}
+
+
+/***/ }),
+
+/***/ "../../packages/react-theme-provider/lib/getStyleFromPropsAndOptions.js":
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "getStyleFromPropsAndOptions", function() { return getStyleFromPropsAndOptions; });
+/* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("../../node_modules/tslib/tslib.es6.js");
+/* harmony import */ var _tokensToStyleObject__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__("../../packages/react-theme-provider/lib/tokensToStyleObject.js");
+
+
+var getStyleFromPropsAndOptions = function (props, options, prefix) {
+    var rootSlotStyle = {};
+    options.slotProps.forEach(function (definition) {
+        var _a;
+        var nextSlotProps = definition(props);
+        rootSlotStyle = Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__assign"])(Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__assign"])({}, rootSlotStyle), (_a = nextSlotProps.root) === null || _a === void 0 ? void 0 : _a.style);
+    });
+    return Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__assign"])(Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__assign"])(Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__assign"])({}, props.style), rootSlotStyle), Object(_tokensToStyleObject__WEBPACK_IMPORTED_MODULE_1__["tokensToStyleObject"])(props.tokens, prefix));
+};
+
+
+/***/ }),
+
+/***/ "../../packages/react-theme-provider/lib/getTokens.js":
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "getTokens", function() { return getTokens; });
+/* harmony import */ var _uifabric_utilities__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("../../packages/utilities/lib/index.js");
+
+/**
+ * Get tokens from theme object.
+ */
+function getTokens(theme, userTokens) {
+    var fonts = theme.fonts;
+    var palette = theme.palette, semanticColors = theme.semanticColors;
+    var preparedTokens = Object(_uifabric_utilities__WEBPACK_IMPORTED_MODULE_0__["merge"])({
+        color: {
+            body: {
+                background: semanticColors.bodyBackground,
+                contentColor: semanticColors.bodyText,
+            },
+            // accent is currently only mapped for primary button to use.
+            brand: {
+                background: semanticColors.primaryButtonBackground,
+                borderColor: semanticColors.primaryButtonBorder,
+                contentColor: semanticColors.primaryButtonText,
+                iconColor: palette.white,
+                dividerColor: palette.white,
+                secondaryContentColor: palette.white,
+                hovered: {
+                    background: semanticColors.primaryButtonBackgroundHovered,
+                    contentColor: semanticColors.primaryButtonTextHovered,
+                    secondaryContentColor: palette.white,
+                    borderColor: 'var(--color-brand-borderColor)',
+                },
+                pressed: {
+                    background: semanticColors.primaryButtonBackgroundPressed,
+                    contentColor: semanticColors.primaryButtonTextPressed,
+                    secondaryContentColor: semanticColors.primaryButtonTextPressed,
+                    borderColor: 'var(--color-brand-borderColor)',
+                    iconColor: 'var(--color-brand-iconColor)',
+                },
+                focused: {
+                    background: 'var(--color-brand-background)',
+                    borderColor: 'var(--color-brand-borderColor)',
+                    contentColor: 'var(--color-brand-contentColor)',
+                    iconColor: 'var(--color-brand-iconColor)',
+                    secondaryContentColor: 'var(--color-brand-focused-contentColor)',
+                },
+                disabled: {
+                    background: semanticColors.primaryButtonBackgroundDisabled,
+                    contentColor: semanticColors.buttonTextDisabled,
+                    dividerColor: palette.neutralTertiaryAlt,
+                    secondaryContentColor: 'var(--color-brand-disabled-contentColor)',
+                    borderColor: 'var(--color-brand-disabled-background)',
+                    iconColor: 'var(--color-brand-disabled-contentColor)',
+                },
+                checked: {
+                    background: semanticColors.primaryButtonBackgroundPressed,
+                    contentColor: semanticColors.primaryButtonTextPressed,
+                    iconColor: semanticColors.primaryButtonTextPressed,
+                },
+                checkedHovered: {
+                    background: semanticColors.primaryButtonBackgroundPressed,
+                    contentColor: semanticColors.primaryButtonTextPressed,
+                    iconColor: semanticColors.primaryButtonTextPressed,
+                },
+            },
+        },
+        body: {
+            fontFamily: fonts.medium.fontFamily,
+            fontWeight: fonts.medium.fontWeight,
+            fontSize: fonts.medium.fontSize,
+            mozOsxFontSmoothing: fonts.medium.MozOsxFontSmoothing,
+            webkitFontSmoothing: fonts.medium.WebkitFontSmoothing,
+        },
+        // TODO: This will be moved out as a text variant.
+        text: {
+            variant: {
+                caption: {
+                    fontSize: '12px',
+                    fontWeight: '400',
+                    lineHeight: '14px',
+                },
+                body: {
+                    fontSize: '14px',
+                    fontWeight: '400',
+                    lineHeight: '20px',
+                },
+                subHeadline: {
+                    fontSize: '16px',
+                    fontWeight: '600',
+                    lineHeight: '22px',
+                },
+                headline: {
+                    fontSize: '20px',
+                    fontWeight: '600',
+                    lineHeight: '28px',
+                },
+                title3: {
+                    fontSize: '24px',
+                    fontWeight: '600',
+                    lineHeight: '32px',
+                },
+                title2: {
+                    fontSize: '28px',
+                    fontWeight: '600',
+                    lineHeight: '36px',
+                },
+                title1: {
+                    fontSize: '32px',
+                    fontWeight: '600',
+                    lineHeight: '40px',
+                },
+                largeTitle: {
+                    fontSize: '40px',
+                    fontWeight: '600',
+                    lineHeight: '52px',
+                },
+                display: {
+                    fontSize: '68px',
+                    fontWeight: '600',
+                    lineHeight: '92px',
+                },
+            },
+        },
+    }, userTokens);
+    return preparedTokens;
+}
+
+
+/***/ }),
+
+/***/ "../../packages/react-theme-provider/lib/index.js":
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony import */ var _version__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("../../packages/react-theme-provider/lib/version.js");
+/* harmony import */ var _ThemeProvider__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__("../../packages/react-theme-provider/lib/ThemeProvider.js");
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "ThemeProvider", function() { return _ThemeProvider__WEBPACK_IMPORTED_MODULE_1__["ThemeProvider"]; });
+
+/* harmony import */ var _useThemeProviderClasses__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__("../../packages/react-theme-provider/lib/useThemeProviderClasses.js");
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "useThemeProviderClasses", function() { return _useThemeProviderClasses__WEBPACK_IMPORTED_MODULE_2__["useThemeProviderClasses"]; });
+
+/* harmony import */ var _useThemeProvider__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__("../../packages/react-theme-provider/lib/useThemeProvider.js");
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "useThemeProvider", function() { return _useThemeProvider__WEBPACK_IMPORTED_MODULE_3__["useThemeProvider"]; });
+
+/* harmony import */ var _useThemeProviderState__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__("../../packages/react-theme-provider/lib/useThemeProviderState.js");
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "useThemeProviderState", function() { return _useThemeProviderState__WEBPACK_IMPORTED_MODULE_4__["useThemeProviderState"]; });
+
+/* harmony import */ var _withThemeProvider__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__("../../packages/react-theme-provider/lib/withThemeProvider.js");
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "withThemeProvider", function() { return _withThemeProvider__WEBPACK_IMPORTED_MODULE_5__["withThemeProvider"]; });
+
+/* harmony import */ var _applyClasses__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__("../../packages/react-theme-provider/lib/applyClasses.js");
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "applyClasses", function() { return _applyClasses__WEBPACK_IMPORTED_MODULE_6__["applyClasses"]; });
+
+/* harmony import */ var _useTheme__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__("../../packages/react-theme-provider/lib/useTheme.js");
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "useTheme", function() { return _useTheme__WEBPACK_IMPORTED_MODULE_7__["useTheme"]; });
+
+/* harmony import */ var _ThemeContext__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__("../../packages/react-theme-provider/lib/ThemeContext.js");
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "ThemeContext", function() { return _ThemeContext__WEBPACK_IMPORTED_MODULE_8__["ThemeContext"]; });
+
+/* harmony import */ var _getStyleFromPropsAndOptions__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__("../../packages/react-theme-provider/lib/getStyleFromPropsAndOptions.js");
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "getStyleFromPropsAndOptions", function() { return _getStyleFromPropsAndOptions__WEBPACK_IMPORTED_MODULE_9__["getStyleFromPropsAndOptions"]; });
+
+/* harmony import */ var _tokensToStyleObject__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__("../../packages/react-theme-provider/lib/tokensToStyleObject.js");
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "tokensToStyleObject", function() { return _tokensToStyleObject__WEBPACK_IMPORTED_MODULE_10__["tokensToStyleObject"]; });
+
+/* harmony import */ var _useInlineTokens__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__("../../packages/react-theme-provider/lib/useInlineTokens.js");
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "useInlineTokens", function() { return _useInlineTokens__WEBPACK_IMPORTED_MODULE_11__["useInlineTokens"]; });
+
+/* harmony import */ var _makeVariantClasses__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__("../../packages/react-theme-provider/lib/makeVariantClasses.js");
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "makeVariantClasses", function() { return _makeVariantClasses__WEBPACK_IMPORTED_MODULE_12__["makeVariantClasses"]; });
+
+/* harmony import */ var _makeStyles__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__("../../packages/react-theme-provider/lib/makeStyles.js");
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "makeStyles", function() { return _makeStyles__WEBPACK_IMPORTED_MODULE_13__["makeStyles"]; });
+
+/* harmony import */ var _makeClasses__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__("../../packages/react-theme-provider/lib/makeClasses.js");
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "makeClasses", function() { return _makeClasses__WEBPACK_IMPORTED_MODULE_14__["makeClasses"]; });
+
+/* harmony import */ var _styleRenderers_mergeStylesRenderer__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__("../../packages/react-theme-provider/lib/styleRenderers/mergeStylesRenderer.js");
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "mergeStylesRenderer", function() { return _styleRenderers_mergeStylesRenderer__WEBPACK_IMPORTED_MODULE_15__["mergeStylesRenderer"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "MergeStylesProvider", function() { return _styleRenderers_mergeStylesRenderer__WEBPACK_IMPORTED_MODULE_15__["MergeStylesProvider"]; });
+
+/* harmony import */ var _styleRenderers_useStyleRenderer__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__("../../packages/react-theme-provider/lib/styleRenderers/useStyleRenderer.js");
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "StyleRendererContext", function() { return _styleRenderers_useStyleRenderer__WEBPACK_IMPORTED_MODULE_16__["StyleRendererContext"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "useStyleRenderer", function() { return _styleRenderers_useStyleRenderer__WEBPACK_IMPORTED_MODULE_16__["useStyleRenderer"]; });
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+/***/ }),
+
+/***/ "../../packages/react-theme-provider/lib/makeClasses.js":
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "makeClasses", function() { return makeClasses; });
+/* harmony import */ var _applyClasses__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("../../packages/react-theme-provider/lib/applyClasses.js");
+/* harmony import */ var _makeStyles__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__("../../packages/react-theme-provider/lib/makeStyles.js");
+
+
+/**
+ * The `makeClasses` helper encapsulates `makeStyles`, and given a style map which follows
+ * a specific naming convention, produces a hook function which takes in the component
+ * draft state and auto distributes classes into the draft state. This removes a lot of
+ * boilerplate code using `classnames` helpers to manage distributing classnames manually.
+ *
+ * Usage:
+ *
+ * ```tsx
+ * const useButtonClasses makeClasses(theme => {
+ *   root: { ... },
+ *   _primary: { ... },
+ *   _size_small: { ... }
+ * });
+ * ```
+ *
+ * The class naming convention is broken down as follows:
+ *
+ * * No underscores - a slot class name. (E.g. "root", "icon", etc)
+ * * Prefixed with underscore - a modifier. (E.g. "_primary", "_fluid")
+ * * Contains 2 underscores - a name/value matcher. (E.g. "_size_small")
+ *
+ * Modifier classnames are added to the root className when the state contains a truthy value
+ * of the same name. For example, when the primary flag is present, the "_primary" modifier
+ * class will be appended to the root className prop.
+ *
+ * Enum classnames are also added to the root className when teh state contains an enum value
+ * which matches the value in the className. for example, when the `size` enum value is `small`,
+ * the "_size_small" enum class will be appended to the root className prop.
+ */
+var makeClasses = function (styleOrFunction) {
+    var useStyles = Object(_makeStyles__WEBPACK_IMPORTED_MODULE_1__["makeStyles"])(styleOrFunction);
+    return function (state, options) {
+        var classes = useStyles(options);
+        Object(_applyClasses__WEBPACK_IMPORTED_MODULE_0__["applyClasses"])(state, classes);
+    };
+};
+
+
+/***/ }),
+
+/***/ "../../packages/react-theme-provider/lib/makeStyles.js":
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "makeStyles", function() { return makeStyles; });
+/* harmony import */ var _useTheme__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("../../packages/react-theme-provider/lib/useTheme.js");
+/* harmony import */ var _fluentui_react_window_provider__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__("../../packages/react-window-provider/lib/index.js");
+/* harmony import */ var _styleRenderers_useStyleRenderer__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__("../../packages/react-theme-provider/lib/styleRenderers/useStyleRenderer.js");
+
+
+
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+var graphGet = function (graphNode, path) {
+    for (var _i = 0, path_1 = path; _i < path_1.length; _i++) {
+        var key = path_1[_i];
+        graphNode = graphNode.get(key);
+        if (!graphNode) {
+            return;
+        }
+    }
+    return graphNode;
+};
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+var graphSet = function (graphNode, path, value) {
+    for (var i = 0; i < path.length - 1; i++) {
+        var key = path[i];
+        var current = graphNode.get(key);
+        if (!current) {
+            current = new Map();
+            graphNode.set(key, current);
+        }
+        graphNode = current;
+    }
+    graphNode.set(path[path.length - 1], value);
+};
+/**
+ * Registers a css object, optionally as a function of the theme.
+ *
+ * @param styleOrFunction - Either a css javascript object, or a function which takes in `ITheme`
+ * and returns a css javascript object.
+ */
+function makeStyles(styleOrFunction) {
+    // Create graph of inputs to map to output.
+    var graph = new Map();
+    return function (options) {
+        if (options === void 0) { options = {}; }
+        var theme = options.theme, renderer = options.renderer;
+        var win = Object(_fluentui_react_window_provider__WEBPACK_IMPORTED_MODULE_1__["useWindow"])();
+        var contextualTheme = Object(_useTheme__WEBPACK_IMPORTED_MODULE_0__["useTheme"])();
+        var contextualRenderer = Object(_styleRenderers_useStyleRenderer__WEBPACK_IMPORTED_MODULE_2__["useStyleRenderer"])();
+        theme = theme || contextualTheme || {};
+        renderer = (renderer || contextualRenderer);
+        var id = renderer.getId();
+        var isStyleFunction = typeof styleOrFunction === 'function';
+        var path = isStyleFunction ? [id, win, theme] : [id, win];
+        var value = graphGet(graph, path);
+        if (!value) {
+            var styles = isStyleFunction ? styleOrFunction(theme) : styleOrFunction;
+            value = renderer.renderStyles(styles, { targetWindow: win, rtl: !!theme.rtl });
+            graphSet(graph, path, value);
+        }
+        return value;
+    };
+}
+
+
+/***/ }),
+
+/***/ "../../packages/react-theme-provider/lib/makeVariantClasses.js":
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "makeVariantClasses", function() { return makeVariantClasses; });
+/* harmony import */ var _tokensToStyleObject__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("../../packages/react-theme-provider/lib/tokensToStyleObject.js");
+/* harmony import */ var _makeClasses__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__("../../packages/react-theme-provider/lib/makeClasses.js");
+/* eslint-disable @typescript-eslint/no-explicit-any */
+
+
+/**
+ * Calls a function with the argument, or returns the given object.
+ * @param objOrFunc - Function or object.
+ * @param argument - Argument to pass if a function is provided.
+ */
+var callOrReturn = function (objOrFunc, argument) {
+    return typeof objOrFunc === 'function' ? objOrFunc(argument) : objOrFunc;
+};
+var processVariants = function (variants, theme, name, prefix) {
+    var result = {};
+    if (variants) {
+        variants = callOrReturn(variants, theme);
+        for (var _i = 0, _a = Object.keys(variants); _i < _a.length; _i++) {
+            var variantName = _a[_i];
+            var modifierName = variantName === 'root' ? variantName : '_' + variantName;
+            var rule = (result[modifierName] = Object(_tokensToStyleObject__WEBPACK_IMPORTED_MODULE_0__["tokensToStyleObject"])(variants[variantName], prefix));
+            // The display name should be tied to the unique theme object, causing the
+            // renderer to treat scoped themes as sandboxed css scopes.
+            if (name) {
+                rule.displayName = "" + name + (theme.id || '');
+                if (variantName !== 'root') {
+                    rule.displayName += "--" + variantName;
+                }
+            }
+        }
+    }
+    return result;
+};
+/**
+ * Hook factory for creating a `use*Variants` helper. Variants represent a configuration of
+ * token values mapped to modifiers on the component. A variant can also be referenced using
+ * a variant string. Variants can be overridden through the theme of the component.
+ */
+var makeVariantClasses = function (options) {
+    var styles = options.styles, variants = options.variants, name = options.name, prefix = options.prefix;
+    // This function will only be called when styles have not been evaluated for this set for
+    // the particular theme/window/direction combo.
+    var styleFunction = function (theme) {
+        var _a, _b, _c;
+        var themeVariants = name ? (_c = (_b = (_a = theme) === null || _a === void 0 ? void 0 : _a.components) === null || _b === void 0 ? void 0 : _b[name]) === null || _c === void 0 ? void 0 : _c.variants : undefined;
+        return [
+            callOrReturn(styles, theme),
+            processVariants(variants, theme, name, prefix),
+            processVariants(themeVariants, theme, name, prefix),
+        ];
+    };
+    return Object(_makeClasses__WEBPACK_IMPORTED_MODULE_1__["makeClasses"])(styleFunction);
+};
+
+
+/***/ }),
+
+/***/ "../../packages/react-theme-provider/lib/renderThemeProvider.js":
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "renderThemeProvider", function() { return renderThemeProvider; });
+/* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("../../node_modules/tslib/tslib.es6.js");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__("react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);
+/* harmony import */ var _fluentui_react_compose_lib_next_index__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__("../../packages/react-compose/lib/next/index.js");
+/* harmony import */ var _uifabric_utilities__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__("../../packages/utilities/lib/index.js");
+/* harmony import */ var _ThemeContext__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__("../../packages/react-theme-provider/lib/ThemeContext.js");
+/* harmony import */ var _styleRenderers_useStyleRenderer__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__("../../packages/react-theme-provider/lib/styleRenderers/useStyleRenderer.js");
+
+
+
+
+
+
+var renderThemeProvider = function (state) {
+    var _a = Object(_fluentui_react_compose_lib_next_index__WEBPACK_IMPORTED_MODULE_2__["getSlots"])(state), slots = _a.slots, slotProps = _a.slotProps;
+    var theme = state.theme, customizerContext = state.customizerContext;
+    return (react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_ThemeContext__WEBPACK_IMPORTED_MODULE_4__["ThemeContext"].Provider, { value: theme },
+        react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_styleRenderers_useStyleRenderer__WEBPACK_IMPORTED_MODULE_5__["StyleRendererContext"].Provider, { value: state.renderer },
+            react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_uifabric_utilities__WEBPACK_IMPORTED_MODULE_3__["CustomizerContext"].Provider, { value: customizerContext },
+                react__WEBPACK_IMPORTED_MODULE_1__["createElement"](slots.root, Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__assign"])({}, slotProps.root))))));
+};
+
+
+/***/ }),
+
+/***/ "../../packages/react-theme-provider/lib/styleRenderers/mergeStylesRenderer.js":
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "mergeStylesRenderer", function() { return mergeStylesRenderer; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MergeStylesProvider", function() { return MergeStylesProvider; });
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var _useStyleRenderer__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__("../../packages/react-theme-provider/lib/styleRenderers/useStyleRenderer.js");
+/* harmony import */ var _uifabric_merge_styles__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__("../../packages/merge-styles/lib/index.js");
+
+
+
+var _seed = 0;
+var mergeStylesRenderer = {
+    reset: function () {
+        // If the stylesheet reset call is made, invalidate the cache keys.
+        _uifabric_merge_styles__WEBPACK_IMPORTED_MODULE_2__["Stylesheet"].getInstance().onReset(function () { return _seed++; });
+    },
+    getId: function () { return _seed; },
+    renderStyles: function (styleSet, options) {
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        return Object(_uifabric_merge_styles__WEBPACK_IMPORTED_MODULE_2__["mergeCssSets"])((Array.isArray(styleSet) ? styleSet : [styleSet]), options);
+    },
+    renderFontFace: function (fontFace, options) {
+        return Object(_uifabric_merge_styles__WEBPACK_IMPORTED_MODULE_2__["fontFace"])(fontFace);
+    },
+    renderKeyframes: function (keyframes) {
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        return Object(_uifabric_merge_styles__WEBPACK_IMPORTED_MODULE_2__["keyframes"])(keyframes);
+    },
+};
+var MergeStylesProvider = function (_a) {
+    var children = _a.children;
+    return (react__WEBPACK_IMPORTED_MODULE_0__["createElement"](_useStyleRenderer__WEBPACK_IMPORTED_MODULE_1__["StyleRendererContext"].Provider, { value: mergeStylesRenderer }, children));
+};
+
+
+/***/ }),
+
+/***/ "../../packages/react-theme-provider/lib/styleRenderers/useStyleRenderer.js":
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "StyleRendererContext", function() { return StyleRendererContext; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "useStyleRenderer", function() { return useStyleRenderer; });
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var _mergeStylesRenderer__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__("../../packages/react-theme-provider/lib/styleRenderers/mergeStylesRenderer.js");
+
+
+var StyleRendererContext = react__WEBPACK_IMPORTED_MODULE_0__["createContext"](_mergeStylesRenderer__WEBPACK_IMPORTED_MODULE_1__["mergeStylesRenderer"]);
+var useStyleRenderer = function () { return react__WEBPACK_IMPORTED_MODULE_0__["useContext"](StyleRendererContext); };
+
+
+/***/ }),
+
+/***/ "../../packages/react-theme-provider/lib/tokensToStyleObject.js":
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "tokensToStyleObject", function() { return tokensToStyleObject; });
+var tokensToStyleObject = function (tokens, prefix, style) {
+    if (style === void 0) { style = {}; }
+    var hasCheckedObject = false;
+    if (tokens) {
+        for (var _i = 0, _a = Object.keys(tokens); _i < _a.length; _i++) {
+            var name_1 = _a[_i];
+            // On the first token property, check if this object has already been tokenized.
+            if (!hasCheckedObject) {
+                if (name_1.indexOf('--') === 0) {
+                    return tokens;
+                }
+                hasCheckedObject = true;
+            }
+            var varName = prefix ? "" + prefix + (name_1 === 'default' ? '' : '-' + name_1) : "--" + name_1;
+            var varValue = tokens[name_1];
+            if (varValue && typeof varValue === 'object') {
+                tokensToStyleObject(varValue, varName, style);
+            }
+            else {
+                // eslint-disable-next-line @typescript-eslint/no-explicit-any
+                style[varName] = varValue;
+            }
+        }
+    }
+    return style;
+};
+
+
+/***/ }),
+
+/***/ "../../packages/react-theme-provider/lib/useInlineTokens.js":
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "useInlineTokens", function() { return useInlineTokens; });
+/* harmony import */ var _tokensToStyleObject__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("../../packages/react-theme-provider/lib/tokensToStyleObject.js");
+
+/**
+ * Hook which given draftState, will ensure that tokens are spit out to inline styles.
+ * @param draftState - state to read and manipulate. Expected to have `tokens` prop, will
+ * transform into inline
+ * @param prefix - prefix to prepend to variables (e.g. "--button")
+ */
+var useInlineTokens = function (draftState, prefix) {
+    var tokens = draftState.tokens, style = draftState.style;
+    if (tokens) {
+        draftState.style = style || {};
+        Object(_tokensToStyleObject__WEBPACK_IMPORTED_MODULE_0__["tokensToStyleObject"])(tokens, prefix, draftState.style);
+    }
+};
+
+
+/***/ }),
+
+/***/ "../../packages/react-theme-provider/lib/useTheme.js":
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "useTheme", function() { return useTheme; });
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var _uifabric_utilities__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__("../../packages/utilities/lib/index.js");
+/* harmony import */ var _fluentui_theme__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__("../../packages/theme/lib/index.js");
+/* harmony import */ var _ThemeContext__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__("../../packages/react-theme-provider/lib/ThemeContext.js");
+
+
+
+
+/**
+ * Get theme from CustomizerContext or Customizations singleton.
+ */
+function useCompatTheme() {
+    return Object(_uifabric_utilities__WEBPACK_IMPORTED_MODULE_1__["useCustomizationSettings"])(['theme']).theme;
+}
+/**
+ * React hook for programmatically accessing the theme.
+ */
+var useTheme = function () {
+    var theme = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_ThemeContext__WEBPACK_IMPORTED_MODULE_3__["ThemeContext"]);
+    var legacyTheme = useCompatTheme();
+    return theme || legacyTheme || Object(_fluentui_theme__WEBPACK_IMPORTED_MODULE_2__["createTheme"])({});
+};
+
+
+/***/ }),
+
+/***/ "../../packages/react-theme-provider/lib/useThemeProvider.js":
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "useThemeProvider", function() { return useThemeProvider; });
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var _renderThemeProvider__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__("../../packages/react-theme-provider/lib/renderThemeProvider.js");
+/* harmony import */ var _fluentui_react_compose_lib_next_index__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__("../../packages/react-compose/lib/next/index.js");
+/* harmony import */ var _useThemeProviderState__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__("../../packages/react-theme-provider/lib/useThemeProviderState.js");
+/* harmony import */ var _uifabric_react_hooks__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__("../../packages/react-hooks/lib/index.js");
+
+
+
+
+
+var mergeProps = Object(_fluentui_react_compose_lib_next_index__WEBPACK_IMPORTED_MODULE_2__["makeMergeProps"])();
+/**
+ * Returns the ThemeProvider render function and calculated state, given user input, ref, and
+ * a set of default prop values.
+ */
+var useThemeProvider = function (props, ref, defaultProps) {
+    var rootRef = Object(_uifabric_react_hooks__WEBPACK_IMPORTED_MODULE_4__["useMergedRefs"])(ref, react__WEBPACK_IMPORTED_MODULE_0__["useRef"](null));
+    var state = mergeProps({
+        ref: rootRef,
+        as: 'div',
+    }, defaultProps, props);
+    // Apply changes to state.
+    Object(_useThemeProviderState__WEBPACK_IMPORTED_MODULE_3__["useThemeProviderState"])(state);
+    return {
+        state: state,
+        render: _renderThemeProvider__WEBPACK_IMPORTED_MODULE_1__["renderThemeProvider"],
+    };
+};
+
+
+/***/ }),
+
+/***/ "../../packages/react-theme-provider/lib/useThemeProviderClasses.js":
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "useThemeProviderClasses", function() { return useThemeProviderClasses; });
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var _uifabric_utilities__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__("../../packages/utilities/lib/index.js");
+/* harmony import */ var _fluentui_react_window_provider__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__("../../packages/react-window-provider/lib/index.js");
+/* harmony import */ var _makeStyles__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__("../../packages/react-theme-provider/lib/makeStyles.js");
+/* harmony import */ var _tokensToStyleObject__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__("../../packages/react-theme-provider/lib/tokensToStyleObject.js");
+
+
+
+
+
+var useThemeProviderStyles = Object(_makeStyles__WEBPACK_IMPORTED_MODULE_3__["makeStyles"])(function (theme) {
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r;
+    var tokens = theme.tokens;
+    var tokenStyles = Object(_tokensToStyleObject__WEBPACK_IMPORTED_MODULE_4__["tokensToStyleObject"])(tokens);
+    return {
+        root: tokenStyles,
+        body: [
+            {
+                color: (_c = (_b = (_a = tokens) === null || _a === void 0 ? void 0 : _a.color) === null || _b === void 0 ? void 0 : _b.body) === null || _c === void 0 ? void 0 : _c.contentColor,
+                background: (_f = (_e = (_d = tokens) === null || _d === void 0 ? void 0 : _d.color) === null || _e === void 0 ? void 0 : _e.body) === null || _f === void 0 ? void 0 : _f.background,
+                fontFamily: (_h = (_g = tokens) === null || _g === void 0 ? void 0 : _g.body) === null || _h === void 0 ? void 0 : _h.fontFamily,
+                fontWeight: (_k = (_j = tokens) === null || _j === void 0 ? void 0 : _j.body) === null || _k === void 0 ? void 0 : _k.fontWeight,
+                fontSize: (_m = (_l = tokens) === null || _l === void 0 ? void 0 : _l.body) === null || _m === void 0 ? void 0 : _m.fontSize,
+                MozOsxFontSmoothing: (_p = (_o = tokens) === null || _o === void 0 ? void 0 : _o.body) === null || _p === void 0 ? void 0 : _p.mozOsxFontSmoothing,
+                WebkitFontSmoothing: (_r = (_q = tokens) === null || _q === void 0 ? void 0 : _q.body) === null || _r === void 0 ? void 0 : _r.webkitFontSmoothing,
+            },
+        ],
+    };
+});
+/**
+ * Hook to add class to body element.
+ */
+function useApplyClassToBody(state, classesToApply) {
+    var _a;
+    var applyTo = state.applyTo;
+    var applyToBody = applyTo === 'body';
+    var body = (_a = Object(_fluentui_react_window_provider__WEBPACK_IMPORTED_MODULE_2__["useDocument"])()) === null || _a === void 0 ? void 0 : _a.body;
+    react__WEBPACK_IMPORTED_MODULE_0__["useEffect"](function () {
+        if (!applyToBody || !body) {
+            return;
+        }
+        for (var _i = 0, classesToApply_1 = classesToApply; _i < classesToApply_1.length; _i++) {
+            var classToApply = classesToApply_1[_i];
+            if (classToApply) {
+                body.classList.add(classToApply);
+            }
+        }
+        return function () {
+            if (!applyToBody || !body) {
+                return;
+            }
+            for (var _i = 0, classesToApply_2 = classesToApply; _i < classesToApply_2.length; _i++) {
+                var classToApply = classesToApply_2[_i];
+                if (classToApply) {
+                    body.classList.remove(classToApply);
+                }
+            }
+        };
+    }, [applyToBody, body, classesToApply]);
+}
+function useThemeProviderClasses(state) {
+    var classes = useThemeProviderStyles(state);
+    var className = state.className, applyTo = state.applyTo;
+    useApplyClassToBody(state, [classes.root, classes.body]);
+    state.className = Object(_uifabric_utilities__WEBPACK_IMPORTED_MODULE_1__["css"])(className, classes.root, applyTo === 'element' && classes.body);
+}
+
+
+/***/ }),
+
+/***/ "../../packages/react-theme-provider/lib/useThemeProviderState.js":
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "useThemeProviderState", function() { return useThemeProviderState; });
+/* harmony import */ var _fluentui_theme__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("../../packages/theme/lib/index.js");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__("react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);
+/* harmony import */ var _useTheme__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__("../../packages/react-theme-provider/lib/useTheme.js");
+/* harmony import */ var _uifabric_utilities__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__("../../packages/utilities/lib/index.js");
+/* harmony import */ var _getTokens__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__("../../packages/react-theme-provider/lib/getTokens.js");
+
+
+
+
+
+var themeToIdMap = new Map();
+var getThemeId = function () {
+    var themes = [];
+    for (var _i = 0; _i < arguments.length; _i++) {
+        themes[_i] = arguments[_i];
+    }
+    var ids = [];
+    for (var _a = 0, themes_1 = themes; _a < themes_1.length; _a++) {
+        var theme = themes_1[_a];
+        if (theme) {
+            var id = theme.id || themeToIdMap.get(theme);
+            if (!id) {
+                id = Object(_uifabric_utilities__WEBPACK_IMPORTED_MODULE_3__["getId"])('');
+                themeToIdMap.set(theme, id);
+            }
+            ids.push(id);
+        }
+    }
+    return ids.join('-');
+};
+var useThemeProviderState = function (draftState) {
+    var userTheme = draftState.theme;
+    // Pull contextual theme.
+    var parentTheme = Object(_useTheme__WEBPACK_IMPORTED_MODULE_2__["useTheme"])();
+    // Update the incoming theme with a memoized version of the merged theme.
+    var theme = (draftState.theme = react__WEBPACK_IMPORTED_MODULE_1__["useMemo"](function () {
+        var _a;
+        var mergedTheme = Object(_fluentui_theme__WEBPACK_IMPORTED_MODULE_0__["mergeThemes"])(parentTheme, userTheme);
+        mergedTheme.tokens = Object(_getTokens__WEBPACK_IMPORTED_MODULE_4__["getTokens"])(mergedTheme, (_a = userTheme) === null || _a === void 0 ? void 0 : _a.tokens);
+        mergedTheme.id = getThemeId(parentTheme, userTheme);
+        return mergedTheme;
+    }, [parentTheme, userTheme]));
+    draftState.customizerContext = react__WEBPACK_IMPORTED_MODULE_1__["useMemo"](function () { return ({
+        customizations: {
+            inCustomizerContext: true,
+            settings: { theme: theme },
+            scopedSettings: theme.components || {},
+        },
+    }); }, [theme]);
+    if (draftState.theme.rtl !== parentTheme.rtl) {
+        draftState.dir = draftState.theme.rtl ? 'rtl' : 'ltr';
+    }
+};
+
+
+/***/ }),
+
+/***/ "../../packages/react-theme-provider/lib/version.js":
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony import */ var _uifabric_set_version__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("../../packages/set-version/lib/index.js");
+// Do not modify this file; it is generated as part of publish.
+// The checked in version is a placeholder only and will not be updated.
+
+Object(_uifabric_set_version__WEBPACK_IMPORTED_MODULE_0__["setVersion"])('@fluentui/react-theme-provider', '0.19.16');
+
+
+/***/ }),
+
+/***/ "../../packages/react-theme-provider/lib/withThemeProvider.js":
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "withThemeProvider", function() { return withThemeProvider; });
+/* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("../../node_modules/tslib/tslib.es6.js");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__("react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);
+/* harmony import */ var _ThemeProvider__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__("../../packages/react-theme-provider/lib/ThemeProvider.js");
+
+
+
+var withThemeProvider = function (Component) {
+    return react__WEBPACK_IMPORTED_MODULE_1__["forwardRef"](function (props, ref) { return (react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_ThemeProvider__WEBPACK_IMPORTED_MODULE_2__["ThemeProvider"], null,
+        react__WEBPACK_IMPORTED_MODULE_1__["createElement"](Component, Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__assign"])({}, props, { ref: ref })))); });
+};
+
+
 /***/ }),
 
 /***/ "../../packages/react-window-provider/lib/WindowProvider.js":
@@ -95810,6 +97426,19 @@ __webpack_require__.r(__webpack_exports__);
 Object(_uifabric_set_version__WEBPACK_IMPORTED_MODULE_0__["setVersion"])('@uifabric/styling', '7.25.1');
 
 
+/***/ }),
+
+/***/ "../../packages/theme/lib/FluentTheme.js":
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "FluentTheme", function() { return FluentTheme; });
+/* harmony import */ var _createTheme__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("../../packages/theme/lib/createTheme.js");
+
+var FluentTheme = Object(_createTheme__WEBPACK_IMPORTED_MODULE_0__["createTheme"])({});
+
+
 /***/ }),
 
 /***/ "../../packages/theme/lib/colors/DefaultPalette.js":
@@ -96377,6 +98006,77 @@ __webpack_require__.r(__webpack_exports__);
 
 
 
+/***/ }),
+
+/***/ "../../packages/theme/lib/index.js":
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony import */ var _mergeThemes__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("../../packages/theme/lib/mergeThemes.js");
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "mergeThemes", function() { return _mergeThemes__WEBPACK_IMPORTED_MODULE_0__["mergeThemes"]; });
+
+/* harmony import */ var _colors_index__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__("../../packages/theme/lib/colors/index.js");
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "CommunicationColors", function() { return _colors_index__WEBPACK_IMPORTED_MODULE_1__["CommunicationColors"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "NeutralColors", function() { return _colors_index__WEBPACK_IMPORTED_MODULE_1__["NeutralColors"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "SharedColors", function() { return _colors_index__WEBPACK_IMPORTED_MODULE_1__["SharedColors"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "DefaultPalette", function() { return _colors_index__WEBPACK_IMPORTED_MODULE_1__["DefaultPalette"]; });
+
+/* harmony import */ var _effects_index__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__("../../packages/theme/lib/effects/index.js");
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "DefaultEffects", function() { return _effects_index__WEBPACK_IMPORTED_MODULE_2__["DefaultEffects"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Depths", function() { return _effects_index__WEBPACK_IMPORTED_MODULE_2__["Depths"]; });
+
+/* harmony import */ var _spacing_index__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__("../../packages/theme/lib/spacing/index.js");
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "DefaultSpacing", function() { return _spacing_index__WEBPACK_IMPORTED_MODULE_3__["DefaultSpacing"]; });
+
+/* harmony import */ var _motion_index__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__("../../packages/theme/lib/motion/index.js");
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "MotionDurations", function() { return _motion_index__WEBPACK_IMPORTED_MODULE_4__["MotionDurations"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "MotionTimings", function() { return _motion_index__WEBPACK_IMPORTED_MODULE_4__["MotionTimings"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "MotionAnimations", function() { return _motion_index__WEBPACK_IMPORTED_MODULE_4__["MotionAnimations"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "AnimationVariables", function() { return _motion_index__WEBPACK_IMPORTED_MODULE_4__["AnimationVariables"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "AnimationStyles", function() { return _motion_index__WEBPACK_IMPORTED_MODULE_4__["AnimationStyles"]; });
+
+/* harmony import */ var _fonts_index__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__("../../packages/theme/lib/fonts/index.js");
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "LocalizedFontNames", function() { return _fonts_index__WEBPACK_IMPORTED_MODULE_5__["LocalizedFontNames"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "LocalizedFontFamilies", function() { return _fonts_index__WEBPACK_IMPORTED_MODULE_5__["LocalizedFontFamilies"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "FontSizes", function() { return _fonts_index__WEBPACK_IMPORTED_MODULE_5__["FontSizes"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "FontWeights", function() { return _fonts_index__WEBPACK_IMPORTED_MODULE_5__["FontWeights"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "IconFontSizes", function() { return _fonts_index__WEBPACK_IMPORTED_MODULE_5__["IconFontSizes"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "createFontStyles", function() { return _fonts_index__WEBPACK_IMPORTED_MODULE_5__["createFontStyles"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "DefaultFontStyles", function() { return _fonts_index__WEBPACK_IMPORTED_MODULE_5__["DefaultFontStyles"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "registerDefaultFontFaces", function() { return _fonts_index__WEBPACK_IMPORTED_MODULE_5__["registerDefaultFontFaces"]; });
+
+/* harmony import */ var _createTheme__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__("../../packages/theme/lib/createTheme.js");
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "createTheme", function() { return _createTheme__WEBPACK_IMPORTED_MODULE_6__["createTheme"]; });
+
+/* harmony import */ var _FluentTheme__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__("../../packages/theme/lib/FluentTheme.js");
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "FluentTheme", function() { return _FluentTheme__WEBPACK_IMPORTED_MODULE_7__["FluentTheme"]; });
+
+
+
+
+
+
+
+
+
+
+
 /***/ }),
 
 /***/ "../../packages/theme/lib/mergeThemes.js":
@@ -96577,6 +98277,123 @@ function _createSlideOutY(toY) {
 }
 
 
+/***/ }),
+
+/***/ "../../packages/theme/lib/motion/FluentMotion.js":
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MotionDurations", function() { return MotionDurations; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MotionTimings", function() { return MotionTimings; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MotionAnimations", function() { return MotionAnimations; });
+/* harmony import */ var _uifabric_merge_styles__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("../../packages/merge-styles/lib/index.js");
+
+var fadeInAnimationName = Object(_uifabric_merge_styles__WEBPACK_IMPORTED_MODULE_0__["keyframes"])({
+    from: { opacity: 0 },
+    to: { opacity: 1 },
+});
+var fadeOutAnimationName = Object(_uifabric_merge_styles__WEBPACK_IMPORTED_MODULE_0__["keyframes"])({
+    from: { opacity: 1 },
+    to: { opacity: 0 },
+});
+var scaleDownInAnimationName = Object(_uifabric_merge_styles__WEBPACK_IMPORTED_MODULE_0__["keyframes"])({
+    from: { transform: 'scale3d(1.15, 1.15, 1)' },
+    to: { transform: 'scale3d(1, 1, 1)' },
+});
+var scaleDownOutAnimationName = Object(_uifabric_merge_styles__WEBPACK_IMPORTED_MODULE_0__["keyframes"])({
+    from: { transform: 'scale3d(1, 1, 1)' },
+    to: { transform: 'scale3d(0.9, 0.9, 1)' },
+});
+var slideLeftOutAnimationName = Object(_uifabric_merge_styles__WEBPACK_IMPORTED_MODULE_0__["keyframes"])({
+    from: { transform: 'translate3d(0, 0, 0)' },
+    to: { transform: 'translate3d(-48px, 0, 0)' },
+});
+var slideRightOutAnimationName = Object(_uifabric_merge_styles__WEBPACK_IMPORTED_MODULE_0__["keyframes"])({
+    from: { transform: 'translate3d(0, 0, 0)' },
+    to: { transform: 'translate3d(48px, 0, 0)' },
+});
+var slideLeftInAnimationName = Object(_uifabric_merge_styles__WEBPACK_IMPORTED_MODULE_0__["keyframes"])({
+    from: { transform: 'translate3d(48px, 0, 0)' },
+    to: { transform: 'translate3d(0, 0, 0)' },
+});
+var slideRightInAnimationName = Object(_uifabric_merge_styles__WEBPACK_IMPORTED_MODULE_0__["keyframes"])({
+    from: { transform: 'translate3d(-48px, 0, 0)' },
+    to: { transform: 'translate3d(0, 0, 0)' },
+});
+var slideUpOutAnimationName = Object(_uifabric_merge_styles__WEBPACK_IMPORTED_MODULE_0__["keyframes"])({
+    from: { transform: 'translate3d(0, 0, 0)' },
+    to: { transform: 'translate3d(0, -48px, 0)' },
+});
+var slideDownOutAnimationName = Object(_uifabric_merge_styles__WEBPACK_IMPORTED_MODULE_0__["keyframes"])({
+    from: { transform: 'translate3d(0, 0, 0)' },
+    to: { transform: 'translate3d(0, 48px, 0)' },
+});
+var slideUpInAnimationName = Object(_uifabric_merge_styles__WEBPACK_IMPORTED_MODULE_0__["keyframes"])({
+    from: { transform: 'translate3d(0, 48px, 0)' },
+    to: { transform: 'translate3d(0, 0, 0)' },
+});
+var slideDownInAnimationName = Object(_uifabric_merge_styles__WEBPACK_IMPORTED_MODULE_0__["keyframes"])({
+    from: { transform: 'translate3d(0, -48px, 0)' },
+    to: { transform: 'translate3d(0, 0, 0)' },
+});
+var MotionDurations;
+(function (MotionDurations) {
+    MotionDurations.duration1 = '100ms';
+    MotionDurations.duration2 = '200ms';
+    MotionDurations.duration3 = '300ms';
+    MotionDurations.duration4 = '400ms';
+})(MotionDurations || (MotionDurations = {}));
+var MotionTimings;
+(function (MotionTimings) {
+    MotionTimings.accelerate = 'cubic-bezier(0.9, 0.1, 1, 0.2)';
+    MotionTimings.decelerate = 'cubic-bezier(0.1, 0.9, 0.2, 1)';
+    MotionTimings.linear = 'cubic-bezier(0, 0, 1, 1)';
+    MotionTimings.standard = 'cubic-bezier(0.8, 0, 0.2, 1)';
+})(MotionTimings || (MotionTimings = {}));
+function _createAnimation(animationName, animationDuration, animationTimingFunction) {
+    return animationName + " " + animationDuration + " " + animationTimingFunction;
+}
+var MotionAnimations;
+(function (MotionAnimations) {
+    MotionAnimations.fadeIn = _createAnimation(fadeInAnimationName, MotionDurations.duration1, MotionTimings.linear);
+    MotionAnimations.fadeOut = _createAnimation(fadeOutAnimationName, MotionDurations.duration1, MotionTimings.linear);
+    MotionAnimations.scaleDownIn = _createAnimation(scaleDownInAnimationName, MotionDurations.duration3, MotionTimings.decelerate);
+    MotionAnimations.scaleDownOut = _createAnimation(scaleDownOutAnimationName, MotionDurations.duration3, MotionTimings.decelerate);
+    MotionAnimations.slideLeftOut = _createAnimation(slideLeftOutAnimationName, MotionDurations.duration1, MotionTimings.accelerate);
+    MotionAnimations.slideRightOut = _createAnimation(slideRightOutAnimationName, MotionDurations.duration1, MotionTimings.accelerate);
+    MotionAnimations.slideLeftIn = _createAnimation(slideLeftInAnimationName, MotionDurations.duration1, MotionTimings.decelerate);
+    MotionAnimations.slideRightIn = _createAnimation(slideRightInAnimationName, MotionDurations.duration1, MotionTimings.decelerate);
+    MotionAnimations.slideUpOut = _createAnimation(slideUpOutAnimationName, MotionDurations.duration1, MotionTimings.accelerate);
+    MotionAnimations.slideDownOut = _createAnimation(slideDownOutAnimationName, MotionDurations.duration1, MotionTimings.accelerate);
+    MotionAnimations.slideUpIn = _createAnimation(slideUpInAnimationName, MotionDurations.duration1, MotionTimings.decelerate);
+    MotionAnimations.slideDownIn = _createAnimation(slideDownInAnimationName, MotionDurations.duration1, MotionTimings.decelerate);
+})(MotionAnimations || (MotionAnimations = {}));
+
+
+/***/ }),
+
+/***/ "../../packages/theme/lib/motion/index.js":
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony import */ var _FluentMotion__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("../../packages/theme/lib/motion/FluentMotion.js");
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "MotionDurations", function() { return _FluentMotion__WEBPACK_IMPORTED_MODULE_0__["MotionDurations"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "MotionTimings", function() { return _FluentMotion__WEBPACK_IMPORTED_MODULE_0__["MotionTimings"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "MotionAnimations", function() { return _FluentMotion__WEBPACK_IMPORTED_MODULE_0__["MotionAnimations"]; });
+
+/* harmony import */ var _AnimationStyles__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__("../../packages/theme/lib/motion/AnimationStyles.js");
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "AnimationVariables", function() { return _AnimationStyles__WEBPACK_IMPORTED_MODULE_1__["AnimationVariables"]; });
+
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "AnimationStyles", function() { return _AnimationStyles__WEBPACK_IMPORTED_MODULE_1__["AnimationStyles"]; });
+
+
+
+
+
 /***/ }),
 
 /***/ "../../packages/theme/lib/spacing/DefaultSpacing.js":