@fluentui/react-toolbar 9.0.7 → 9.1.0

package/lib-amd/components/Toolbar/Toolbar.js

@@ -1,4 +1,4 @@
-define(["require", "exports", "react", "./useToolbar", "./renderToolbar", "./useToolbarStyles", "./useToolbarContextValues"], function (require, exports, React, useToolbar_1, renderToolbar_1, useToolbarStyles_1, useToolbarContextValues_1) {
+define(["require", "exports", "react", "./useToolbar", "./renderToolbar", "./useToolbarStyles", "./useToolbarContextValues", "@fluentui/react-shared-contexts"], function (require, exports, React, useToolbar_1, renderToolbar_1, useToolbarStyles_1, useToolbarContextValues_1, react_shared_contexts_1) {
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
     exports.Toolbar = void 0;
@@ -9,6 +9,8 @@ define(["require", "exports", "react", "./useToolbar", "./renderToolbar", "./use
         var state = useToolbar_1.useToolbar_unstable(props, ref);
         var contextValues = useToolbarContextValues_1.useToolbarContextValues_unstable(state);
         useToolbarStyles_1.useToolbarStyles_unstable(state);
+        var useCustomStyles = react_shared_contexts_1.useCustomStyleHooks_unstable().useToolbarStyles_unstable;
+        useCustomStyles(state);
         return renderToolbar_1.renderToolbar_unstable(state, contextValues);
     });
     exports.Toolbar.displayName = 'Toolbar';

package/lib-amd/components/Toolbar/Toolbar.js.map

@@ -1 +1 @@
-{"version":3,"file":"Toolbar.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-toolbar/src/components/Toolbar/Toolbar.tsx"],"names":[],"mappings":";;;;IAQA;;OAEG;IACU,QAAA,OAAO,GAAsC,KAAK,CAAC,UAAU,CAAC,UAAC,KAAK,EAAE,GAAG;QACpF,IAAM,KAAK,GAAG,gCAAmB,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC;QAC9C,IAAM,aAAa,GAAG,0DAAgC,CAAC,KAAK,CAAC,CAAC;QAC9D,4CAAyB,CAAC,KAAK,CAAC,CAAC;QACjC,OAAO,sCAAsB,CAAC,KAAK,EAAE,aAAa,CAAC,CAAC;IACtD,CAAC,CAAC,CAAC;IAEH,eAAO,CAAC,WAAW,GAAG,SAAS,CAAC","sourcesContent":["import * as React from 'react';\nimport { useToolbar_unstable } from './useToolbar';\nimport { renderToolbar_unstable } from './renderToolbar';\nimport { useToolbarStyles_unstable } from './useToolbarStyles';\nimport type { ToolbarProps } from './Toolbar.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useToolbarContextValues_unstable } from './useToolbarContextValues';\n\n/**\n * Toolbar component\n */\nexport const Toolbar: ForwardRefComponent<ToolbarProps> = React.forwardRef((props, ref) => {\n  const state = useToolbar_unstable(props, ref);\n  const contextValues = useToolbarContextValues_unstable(state);\n  useToolbarStyles_unstable(state);\n  return renderToolbar_unstable(state, contextValues);\n});\n\nToolbar.displayName = 'Toolbar';\n"]}
+{"version":3,"file":"Toolbar.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-toolbar/src/components/Toolbar/Toolbar.tsx"],"names":[],"mappings":";;;;IASA;;OAEG;IACU,QAAA,OAAO,GAAsC,KAAK,CAAC,UAAU,CAAC,UAAC,KAAK,EAAE,GAAG;QACpF,IAAM,KAAK,GAAG,gCAAmB,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC;QAC9C,IAAM,aAAa,GAAG,0DAAgC,CAAC,KAAK,CAAC,CAAC;QAE9D,4CAAyB,CAAC,KAAK,CAAC,CAAC;QAEzB,IAA2B,eAAe,GAAK,oDAA4B,EAAE,0BAAnC,CAAoC;QACtF,eAAe,CAAC,KAAK,CAAC,CAAC;QAEvB,OAAO,sCAAsB,CAAC,KAAK,EAAE,aAAa,CAAC,CAAC;IACtD,CAAC,CAAC,CAAC;IAEH,eAAO,CAAC,WAAW,GAAG,SAAS,CAAC","sourcesContent":["import * as React from 'react';\nimport { useToolbar_unstable } from './useToolbar';\nimport { renderToolbar_unstable } from './renderToolbar';\nimport { useToolbarStyles_unstable } from './useToolbarStyles';\nimport type { ToolbarProps } from './Toolbar.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useToolbarContextValues_unstable } from './useToolbarContextValues';\nimport { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * Toolbar component\n */\nexport const Toolbar: ForwardRefComponent<ToolbarProps> = React.forwardRef((props, ref) => {\n  const state = useToolbar_unstable(props, ref);\n  const contextValues = useToolbarContextValues_unstable(state);\n\n  useToolbarStyles_unstable(state);\n\n  const { useToolbarStyles_unstable: useCustomStyles } = useCustomStyleHooks_unstable();\n  useCustomStyles(state);\n\n  return renderToolbar_unstable(state, contextValues);\n});\n\nToolbar.displayName = 'Toolbar';\n"]}

package/lib-amd/components/ToolbarButton/ToolbarButton.js

@@ -1,4 +1,4 @@
-define(["require", "exports", "react", "@fluentui/react-button", "./useToolbarButtonStyles", "./useToolbarButton"], function (require, exports, React, react_button_1, useToolbarButtonStyles_1, useToolbarButton_1) {
+define(["require", "exports", "react", "@fluentui/react-button", "./useToolbarButtonStyles", "./useToolbarButton", "@fluentui/react-shared-contexts"], function (require, exports, React, react_button_1, useToolbarButtonStyles_1, useToolbarButton_1, react_shared_contexts_1) {
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
     exports.ToolbarButton = void 0;
@@ -9,6 +9,8 @@ define(["require", "exports", "react", "@fluentui/react-button", "./useToolbarBu
     exports.ToolbarButton = React.forwardRef(function (props, ref) {
         var state = useToolbarButton_1.useToolbarButton_unstable(props, ref);
         useToolbarButtonStyles_1.useToolbarButtonStyles_unstable(state);
+        var useCustomStyles = react_shared_contexts_1.useCustomStyleHooks_unstable().useToolbarButtonStyles_unstable;
+        useCustomStyles(state);
         return react_button_1.renderButton_unstable(state);
         // Casting is required due to lack of distributive union to support unions on @types/react
     });

package/lib-amd/components/ToolbarButton/ToolbarButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"ToolbarButton.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-toolbar/src/components/ToolbarButton/ToolbarButton.tsx"],"names":[],"mappings":";;;;IAOA;;;OAGG;IACU,QAAA,aAAa,GAA4C,KAAK,CAAC,UAAU,CAAC,UAAC,KAAK,EAAE,GAAG;QAChG,IAAM,KAAK,GAAG,4CAAyB,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC;QACpD,wDAA+B,CAAC,KAAK,CAAC,CAAC;QAEvC,OAAO,oCAAqB,CAAC,KAAK,CAAC,CAAC;QACpC,0FAA0F;IAC5F,CAAC,CAA4C,CAAC;IAE9C,qBAAa,CAAC,WAAW,GAAG,eAAe,CAAC","sourcesContent":["import * as React from 'react';\nimport type { ToolbarButtonProps } from './ToolbarButton.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { renderButton_unstable } from '@fluentui/react-button';\nimport { useToolbarButtonStyles_unstable } from './useToolbarButtonStyles';\nimport { useToolbarButton_unstable } from './useToolbarButton';\n\n/**\n * ToolbarButton component is a Button to be used inside Toolbar\n * which will respect toolbar props such as `size`\n */\nexport const ToolbarButton: ForwardRefComponent<ToolbarButtonProps> = React.forwardRef((props, ref) => {\n  const state = useToolbarButton_unstable(props, ref);\n  useToolbarButtonStyles_unstable(state);\n\n  return renderButton_unstable(state);\n  // Casting is required due to lack of distributive union to support unions on @types/react\n}) as ForwardRefComponent<ToolbarButtonProps>;\n\nToolbarButton.displayName = 'ToolbarButton';\n"]}
+{"version":3,"file":"ToolbarButton.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-toolbar/src/components/ToolbarButton/ToolbarButton.tsx"],"names":[],"mappings":";;;;IAQA;;;OAGG;IACU,QAAA,aAAa,GAA4C,KAAK,CAAC,UAAU,CAAC,UAAC,KAAK,EAAE,GAAG;QAChG,IAAM,KAAK,GAAG,4CAAyB,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC;QAEpD,wDAA+B,CAAC,KAAK,CAAC,CAAC;QAE/B,IAAiC,eAAe,GAAK,oDAA4B,EAAE,gCAAnC,CAAoC;QAC5F,eAAe,CAAC,KAAK,CAAC,CAAC;QAEvB,OAAO,oCAAqB,CAAC,KAAK,CAAC,CAAC;QACpC,0FAA0F;IAC5F,CAAC,CAA4C,CAAC;IAE9C,qBAAa,CAAC,WAAW,GAAG,eAAe,CAAC","sourcesContent":["import * as React from 'react';\nimport type { ToolbarButtonProps } from './ToolbarButton.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { renderButton_unstable } from '@fluentui/react-button';\nimport { useToolbarButtonStyles_unstable } from './useToolbarButtonStyles';\nimport { useToolbarButton_unstable } from './useToolbarButton';\nimport { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * ToolbarButton component is a Button to be used inside Toolbar\n * which will respect toolbar props such as `size`\n */\nexport const ToolbarButton: ForwardRefComponent<ToolbarButtonProps> = React.forwardRef((props, ref) => {\n  const state = useToolbarButton_unstable(props, ref);\n\n  useToolbarButtonStyles_unstable(state);\n\n  const { useToolbarButtonStyles_unstable: useCustomStyles } = useCustomStyleHooks_unstable();\n  useCustomStyles(state);\n\n  return renderButton_unstable(state);\n  // Casting is required due to lack of distributive union to support unions on @types/react\n}) as ForwardRefComponent<ToolbarButtonProps>;\n\nToolbarButton.displayName = 'ToolbarButton';\n"]}

package/lib-amd/components/ToolbarDivider/ToolbarDivider.js

@@ -1,4 +1,4 @@
-define(["require", "exports", "react", "./useToolbarDividerStyles", "@fluentui/react-divider", "./useToolbarDivider"], function (require, exports, React, useToolbarDividerStyles_1, react_divider_1, useToolbarDivider_1) {
+define(["require", "exports", "react", "./useToolbarDividerStyles", "@fluentui/react-divider", "./useToolbarDivider", "@fluentui/react-shared-contexts"], function (require, exports, React, useToolbarDividerStyles_1, react_divider_1, useToolbarDivider_1, react_shared_contexts_1) {
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
     exports.ToolbarDivider = void 0;
@@ -8,6 +8,8 @@ define(["require", "exports", "react", "./useToolbarDividerStyles", "@fluentui/r
     exports.ToolbarDivider = React.forwardRef(function (props, ref) {
         var state = useToolbarDivider_1.useToolbarDivider_unstable(props, ref);
         useToolbarDividerStyles_1.useToolbarDividerStyles_unstable(state);
+        var useCustomStyles = react_shared_contexts_1.useCustomStyleHooks_unstable().useToolbarDividerStyles_unstable;
+        useCustomStyles(state);
         return react_divider_1.renderDivider_unstable(state);
     });
     exports.ToolbarDivider.displayName = 'ToolbarDivider';

package/lib-amd/components/ToolbarDivider/ToolbarDivider.js.map

@@ -1 +1 @@
-{"version":3,"file":"ToolbarDivider.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-toolbar/src/components/ToolbarDivider/ToolbarDivider.tsx"],"names":[],"mappings":";;;;IAOA;;OAEG;IACU,QAAA,cAAc,GAA6C,KAAK,CAAC,UAAU,CAAC,UAAC,KAAK,EAAE,GAAG;QAClG,IAAM,KAAK,GAAG,8CAA0B,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC;QACrD,0DAAgC,CAAC,KAAK,CAAC,CAAC;QACxC,OAAO,sCAAsB,CAAC,KAAK,CAAC,CAAC;IACvC,CAAC,CAAC,CAAC;IAEH,sBAAc,CAAC,WAAW,GAAG,gBAAgB,CAAC","sourcesContent":["import * as React from 'react';\nimport { useToolbarDividerStyles_unstable } from './useToolbarDividerStyles';\nimport type { ToolbarDividerProps } from './ToolbarDivider.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { renderDivider_unstable } from '@fluentui/react-divider';\nimport { useToolbarDivider_unstable } from './useToolbarDivider';\n\n/**\n * ToolbarDivider component\n */\nexport const ToolbarDivider: ForwardRefComponent<ToolbarDividerProps> = React.forwardRef((props, ref) => {\n  const state = useToolbarDivider_unstable(props, ref);\n  useToolbarDividerStyles_unstable(state);\n  return renderDivider_unstable(state);\n});\n\nToolbarDivider.displayName = 'ToolbarDivider';\n"]}
+{"version":3,"file":"ToolbarDivider.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-toolbar/src/components/ToolbarDivider/ToolbarDivider.tsx"],"names":[],"mappings":";;;;IAQA;;OAEG;IACU,QAAA,cAAc,GAA6C,KAAK,CAAC,UAAU,CAAC,UAAC,KAAK,EAAE,GAAG;QAClG,IAAM,KAAK,GAAG,8CAA0B,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC;QAErD,0DAAgC,CAAC,KAAK,CAAC,CAAC;QAEhC,IAAkC,eAAe,GAAK,oDAA4B,EAAE,iCAAnC,CAAoC;QAC7F,eAAe,CAAC,KAAK,CAAC,CAAC;QAEvB,OAAO,sCAAsB,CAAC,KAAK,CAAC,CAAC;IACvC,CAAC,CAAC,CAAC;IAEH,sBAAc,CAAC,WAAW,GAAG,gBAAgB,CAAC","sourcesContent":["import * as React from 'react';\nimport { useToolbarDividerStyles_unstable } from './useToolbarDividerStyles';\nimport type { ToolbarDividerProps } from './ToolbarDivider.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { renderDivider_unstable } from '@fluentui/react-divider';\nimport { useToolbarDivider_unstable } from './useToolbarDivider';\nimport { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * ToolbarDivider component\n */\nexport const ToolbarDivider: ForwardRefComponent<ToolbarDividerProps> = React.forwardRef((props, ref) => {\n  const state = useToolbarDivider_unstable(props, ref);\n\n  useToolbarDividerStyles_unstable(state);\n\n  const { useToolbarDividerStyles_unstable: useCustomStyles } = useCustomStyleHooks_unstable();\n  useCustomStyles(state);\n\n  return renderDivider_unstable(state);\n});\n\nToolbarDivider.displayName = 'ToolbarDivider';\n"]}

package/lib-amd/components/ToolbarGroup/ToolbarGroup.js

@@ -1,4 +1,4 @@
-define(["require", "exports", "react", "./useToolbarGroup", "./useToolbarGroupStyles", "./renderToolbarGroup"], function (require, exports, React, useToolbarGroup_1, useToolbarGroupStyles_1, renderToolbarGroup_1) {
+define(["require", "exports", "react", "./useToolbarGroup", "./useToolbarGroupStyles", "./renderToolbarGroup", "@fluentui/react-shared-contexts"], function (require, exports, React, useToolbarGroup_1, useToolbarGroupStyles_1, renderToolbarGroup_1, react_shared_contexts_1) {
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
     exports.ToolbarGroup = void 0;
@@ -9,6 +9,8 @@ define(["require", "exports", "react", "./useToolbarGroup", "./useToolbarGroupSt
     exports.ToolbarGroup = React.forwardRef(function (props, ref) {
         var state = useToolbarGroup_1.useToolbarGroup_unstable(props, ref);
         useToolbarGroupStyles_1.useToolbarGroupStyles_unstable(state);
+        var useCustomStyles = react_shared_contexts_1.useCustomStyleHooks_unstable().useToolbarGroupStyles_unstable;
+        useCustomStyles(state);
         return renderToolbarGroup_1.renderToolbarGroup_unstable(state);
         // Casting is required due to lack of distributive union to support unions on @types/react
     });

package/lib-amd/components/ToolbarGroup/ToolbarGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"ToolbarGroup.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-toolbar/src/components/ToolbarGroup/ToolbarGroup.tsx"],"names":[],"mappings":";;;;IAOA;;;OAGG;IACU,QAAA,YAAY,GAA2C,KAAK,CAAC,UAAU,CAAC,UAAC,KAAK,EAAE,GAAG;QAC9F,IAAM,KAAK,GAAG,0CAAwB,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC;QACnD,sDAA8B,CAAC,KAAK,CAAC,CAAC;QACtC,OAAO,gDAA2B,CAAC,KAAK,CAAC,CAAC;QAC1C,0FAA0F;IAC5F,CAAC,CAA2C,CAAC;IAE7C,oBAAY,CAAC,WAAW,GAAG,cAAc,CAAC","sourcesContent":["import * as React from 'react';\nimport type { ToolbarGroupProps } from './ToolbarGroup.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useToolbarGroup_unstable } from './useToolbarGroup';\nimport { useToolbarGroupStyles_unstable } from './useToolbarGroupStyles';\nimport { renderToolbarGroup_unstable } from './renderToolbarGroup';\n\n/**\n * ToolbarGroup component is a Button to be used inside Toolbar\n * which will respect toolbar props such as `size`\n */\nexport const ToolbarGroup: ForwardRefComponent<ToolbarGroupProps> = React.forwardRef((props, ref) => {\n  const state = useToolbarGroup_unstable(props, ref);\n  useToolbarGroupStyles_unstable(state);\n  return renderToolbarGroup_unstable(state);\n  // Casting is required due to lack of distributive union to support unions on @types/react\n}) as ForwardRefComponent<ToolbarGroupProps>;\n\nToolbarGroup.displayName = 'ToolbarGroup';\n"]}
+{"version":3,"file":"ToolbarGroup.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-toolbar/src/components/ToolbarGroup/ToolbarGroup.tsx"],"names":[],"mappings":";;;;IAQA;;;OAGG;IACU,QAAA,YAAY,GAA2C,KAAK,CAAC,UAAU,CAAC,UAAC,KAAK,EAAE,GAAG;QAC9F,IAAM,KAAK,GAAG,0CAAwB,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC;QAEnD,sDAA8B,CAAC,KAAK,CAAC,CAAC;QAE9B,IAAgC,eAAe,GAAK,oDAA4B,EAAE,+BAAnC,CAAoC;QAC3F,eAAe,CAAC,KAAK,CAAC,CAAC;QAEvB,OAAO,gDAA2B,CAAC,KAAK,CAAC,CAAC;QAC1C,0FAA0F;IAC5F,CAAC,CAA2C,CAAC;IAE7C,oBAAY,CAAC,WAAW,GAAG,cAAc,CAAC","sourcesContent":["import * as React from 'react';\nimport type { ToolbarGroupProps } from './ToolbarGroup.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useToolbarGroup_unstable } from './useToolbarGroup';\nimport { useToolbarGroupStyles_unstable } from './useToolbarGroupStyles';\nimport { renderToolbarGroup_unstable } from './renderToolbarGroup';\nimport { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * ToolbarGroup component is a Button to be used inside Toolbar\n * which will respect toolbar props such as `size`\n */\nexport const ToolbarGroup: ForwardRefComponent<ToolbarGroupProps> = React.forwardRef((props, ref) => {\n  const state = useToolbarGroup_unstable(props, ref);\n\n  useToolbarGroupStyles_unstable(state);\n\n  const { useToolbarGroupStyles_unstable: useCustomStyles } = useCustomStyleHooks_unstable();\n  useCustomStyles(state);\n\n  return renderToolbarGroup_unstable(state);\n  // Casting is required due to lack of distributive union to support unions on @types/react\n}) as ForwardRefComponent<ToolbarGroupProps>;\n\nToolbarGroup.displayName = 'ToolbarGroup';\n"]}

package/lib-amd/components/ToolbarRadioButton/ToolbarRadioButton.js

@@ -1,4 +1,4 @@
-define(["require", "exports", "react", "@fluentui/react-button", "./useToolbarRadioButton", "./useToolbarRadioButtonStyles"], function (require, exports, React, react_button_1, useToolbarRadioButton_1, useToolbarRadioButtonStyles_1) {
+define(["require", "exports", "react", "@fluentui/react-button", "./useToolbarRadioButton", "./useToolbarRadioButtonStyles", "@fluentui/react-shared-contexts"], function (require, exports, React, react_button_1, useToolbarRadioButton_1, useToolbarRadioButtonStyles_1, react_shared_contexts_1) {
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
     exports.ToolbarRadioButton = void 0;
@@ -8,6 +8,8 @@ define(["require", "exports", "react", "@fluentui/react-button", "./useToolbarRa
     exports.ToolbarRadioButton = React.forwardRef(function (props, ref) {
         var state = useToolbarRadioButton_1.useToolbarRadioButton_unstable(props, ref);
         useToolbarRadioButtonStyles_1.useToolbarRadioButtonStyles_unstable(state);
+        var useCustomStyles = react_shared_contexts_1.useCustomStyleHooks_unstable().useToolbarRadioButtonStyles_unstable;
+        useCustomStyles(state);
         return react_button_1.renderToggleButton_unstable(state);
     });
     exports.ToolbarRadioButton.displayName = 'ToolbarRadioButton';

package/lib-amd/components/ToolbarRadioButton/ToolbarRadioButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"ToolbarRadioButton.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-toolbar/src/components/ToolbarRadioButton/ToolbarRadioButton.tsx"],"names":[],"mappings":";;;;IAOA;;OAEG;IACU,QAAA,kBAAkB,GAAiD,KAAK,CAAC,UAAU,CAAC,UAAC,KAAK,EAAE,GAAG;QAC1G,IAAM,KAAK,GAAG,sDAA8B,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC;QAEzD,kEAAoC,CAAC,KAAK,CAAC,CAAC;QAC5C,OAAO,0CAA2B,CAAC,KAAK,CAAC,CAAC;IAC5C,CAAC,CAAiD,CAAC;IAEnD,0BAAkB,CAAC,WAAW,GAAG,oBAAoB,CAAC","sourcesContent":["import * as React from 'react';\nimport type { ToolbarRadioButtonProps } from './ToolbarRadioButton.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { renderToggleButton_unstable } from '@fluentui/react-button';\nimport { useToolbarRadioButton_unstable } from './useToolbarRadioButton';\nimport { useToolbarRadioButtonStyles_unstable } from './useToolbarRadioButtonStyles';\n\n/**\n * ToolbarRadioButton component\n */\nexport const ToolbarRadioButton: ForwardRefComponent<ToolbarRadioButtonProps> = React.forwardRef((props, ref) => {\n  const state = useToolbarRadioButton_unstable(props, ref);\n\n  useToolbarRadioButtonStyles_unstable(state);\n  return renderToggleButton_unstable(state);\n}) as ForwardRefComponent<ToolbarRadioButtonProps>;\n\nToolbarRadioButton.displayName = 'ToolbarRadioButton';\n"]}
+{"version":3,"file":"ToolbarRadioButton.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-toolbar/src/components/ToolbarRadioButton/ToolbarRadioButton.tsx"],"names":[],"mappings":";;;;IAQA;;OAEG;IACU,QAAA,kBAAkB,GAAiD,KAAK,CAAC,UAAU,CAAC,UAAC,KAAK,EAAE,GAAG;QAC1G,IAAM,KAAK,GAAG,sDAA8B,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC;QAEzD,kEAAoC,CAAC,KAAK,CAAC,CAAC;QAEpC,IAAsC,eAAe,GAAK,oDAA4B,EAAE,qCAAnC,CAAoC;QACjG,eAAe,CAAC,KAAK,CAAC,CAAC;QAEvB,OAAO,0CAA2B,CAAC,KAAK,CAAC,CAAC;IAC5C,CAAC,CAAiD,CAAC;IAEnD,0BAAkB,CAAC,WAAW,GAAG,oBAAoB,CAAC","sourcesContent":["import * as React from 'react';\nimport type { ToolbarRadioButtonProps } from './ToolbarRadioButton.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { renderToggleButton_unstable } from '@fluentui/react-button';\nimport { useToolbarRadioButton_unstable } from './useToolbarRadioButton';\nimport { useToolbarRadioButtonStyles_unstable } from './useToolbarRadioButtonStyles';\nimport { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * ToolbarRadioButton component\n */\nexport const ToolbarRadioButton: ForwardRefComponent<ToolbarRadioButtonProps> = React.forwardRef((props, ref) => {\n  const state = useToolbarRadioButton_unstable(props, ref);\n\n  useToolbarRadioButtonStyles_unstable(state);\n\n  const { useToolbarRadioButtonStyles_unstable: useCustomStyles } = useCustomStyleHooks_unstable();\n  useCustomStyles(state);\n\n  return renderToggleButton_unstable(state);\n}) as ForwardRefComponent<ToolbarRadioButtonProps>;\n\nToolbarRadioButton.displayName = 'ToolbarRadioButton';\n"]}

package/lib-amd/components/ToolbarRadioGroup/ToolbarRadioGroup.js

@@ -1,4 +1,4 @@
-define(["require", "exports", "tslib", "react", "../../ToolbarGroup"], function (require, exports, tslib_1, React, ToolbarGroup_1) {
+define(["require", "exports", "tslib", "react", "../../ToolbarGroup", "@fluentui/react-shared-contexts"], function (require, exports, tslib_1, React, ToolbarGroup_1, react_shared_contexts_1) {
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
     exports.ToolbarRadioGroup = void 0;
@@ -9,6 +9,8 @@ define(["require", "exports", "tslib", "react", "../../ToolbarGroup"], function
     exports.ToolbarRadioGroup = React.forwardRef(function (props, ref) {
         var state = ToolbarGroup_1.useToolbarGroup_unstable(tslib_1.__assign({ role: 'radiogroup' }, props), ref);
         ToolbarGroup_1.useToolbarGroupStyles_unstable(state);
+        var useCustomStyles = react_shared_contexts_1.useCustomStyleHooks_unstable().useToolbarGroupStyles_unstable;
+        useCustomStyles(state);
         return ToolbarGroup_1.renderToolbarGroup_unstable(state);
         // Casting is required due to lack of distributive union to support unions on @types/react
     });

package/lib-amd/components/ToolbarRadioGroup/ToolbarRadioGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"ToolbarRadioGroup.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-toolbar/src/components/ToolbarRadioGroup/ToolbarRadioGroup.tsx"],"names":[],"mappings":";;;;IASA;;;OAGG;IACU,QAAA,iBAAiB,GAAgD,KAAK,CAAC,UAAU,CAAC,UAAC,KAAK,EAAE,GAAG;QACxG,IAAM,KAAK,GAAG,uCAAwB,oBAAG,IAAI,EAAE,YAAY,IAAK,KAAK,GAAI,GAAG,CAAC,CAAC;QAC9E,6CAA8B,CAAC,KAAK,CAAC,CAAC;QACtC,OAAO,0CAA2B,CAAC,KAAK,CAAC,CAAC;QAC1C,0FAA0F;IAC5F,CAAC,CAAgD,CAAC;IAElD,yBAAiB,CAAC,WAAW,GAAG,mBAAmB,CAAC","sourcesContent":["import * as React from 'react';\nimport type { ToolbarRadioGroupProps } from './ToolbarRadioGroup.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport {\n  renderToolbarGroup_unstable,\n  useToolbarGroupStyles_unstable,\n  useToolbarGroup_unstable,\n} from '../../ToolbarGroup';\n\n/**\n * ToolbarRadioGroup component is a Button to be used inside Toolbar\n * which will respect toolbar props such as `size`\n */\nexport const ToolbarRadioGroup: ForwardRefComponent<ToolbarRadioGroupProps> = React.forwardRef((props, ref) => {\n  const state = useToolbarGroup_unstable({ role: 'radiogroup', ...props }, ref);\n  useToolbarGroupStyles_unstable(state);\n  return renderToolbarGroup_unstable(state);\n  // Casting is required due to lack of distributive union to support unions on @types/react\n}) as ForwardRefComponent<ToolbarRadioGroupProps>;\n\nToolbarRadioGroup.displayName = 'ToolbarRadioGroup';\n"]}
+{"version":3,"file":"ToolbarRadioGroup.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-toolbar/src/components/ToolbarRadioGroup/ToolbarRadioGroup.tsx"],"names":[],"mappings":";;;;IAUA;;;OAGG;IACU,QAAA,iBAAiB,GAAgD,KAAK,CAAC,UAAU,CAAC,UAAC,KAAK,EAAE,GAAG;QACxG,IAAM,KAAK,GAAG,uCAAwB,oBAAG,IAAI,EAAE,YAAY,IAAK,KAAK,GAAI,GAAG,CAAC,CAAC;QAE9E,6CAA8B,CAAC,KAAK,CAAC,CAAC;QAE9B,IAAgC,eAAe,GAAK,oDAA4B,EAAE,+BAAnC,CAAoC;QAC3F,eAAe,CAAC,KAAK,CAAC,CAAC;QAEvB,OAAO,0CAA2B,CAAC,KAAK,CAAC,CAAC;QAC1C,0FAA0F;IAC5F,CAAC,CAAgD,CAAC;IAElD,yBAAiB,CAAC,WAAW,GAAG,mBAAmB,CAAC","sourcesContent":["import * as React from 'react';\nimport type { ToolbarRadioGroupProps } from './ToolbarRadioGroup.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport {\n  renderToolbarGroup_unstable,\n  useToolbarGroupStyles_unstable,\n  useToolbarGroup_unstable,\n} from '../../ToolbarGroup';\nimport { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * ToolbarRadioGroup component is a Button to be used inside Toolbar\n * which will respect toolbar props such as `size`\n */\nexport const ToolbarRadioGroup: ForwardRefComponent<ToolbarRadioGroupProps> = React.forwardRef((props, ref) => {\n  const state = useToolbarGroup_unstable({ role: 'radiogroup', ...props }, ref);\n\n  useToolbarGroupStyles_unstable(state);\n\n  const { useToolbarGroupStyles_unstable: useCustomStyles } = useCustomStyleHooks_unstable();\n  useCustomStyles(state);\n\n  return renderToolbarGroup_unstable(state);\n  // Casting is required due to lack of distributive union to support unions on @types/react\n}) as ForwardRefComponent<ToolbarRadioGroupProps>;\n\nToolbarRadioGroup.displayName = 'ToolbarRadioGroup';\n"]}

package/lib-amd/components/ToolbarToggleButton/ToolbarToggleButton.js

@@ -1,4 +1,4 @@
-define(["require", "exports", "react", "@fluentui/react-button", "./useToolbarToggleButton", "./useToolbarToggleButtonStyles"], function (require, exports, React, react_button_1, useToolbarToggleButton_1, useToolbarToggleButtonStyles_1) {
+define(["require", "exports", "react", "@fluentui/react-button", "./useToolbarToggleButton", "./useToolbarToggleButtonStyles", "@fluentui/react-shared-contexts"], function (require, exports, React, react_button_1, useToolbarToggleButton_1, useToolbarToggleButtonStyles_1, react_shared_contexts_1) {
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
     exports.ToolbarToggleButton = void 0;
@@ -8,6 +8,8 @@ define(["require", "exports", "react", "@fluentui/react-button", "./useToolbarTo
     exports.ToolbarToggleButton = React.forwardRef(function (props, ref) {
         var state = useToolbarToggleButton_1.useToolbarToggleButton_unstable(props, ref);
         useToolbarToggleButtonStyles_1.useToolbarToggleButtonStyles_unstable(state);
+        var useCustomStyles = react_shared_contexts_1.useCustomStyleHooks_unstable().useToolbarToggleButtonStyles_unstable;
+        useCustomStyles(state);
         return react_button_1.renderToggleButton_unstable(state);
     });
     exports.ToolbarToggleButton.displayName = 'ToolbarToggleButton';

package/lib-amd/components/ToolbarToggleButton/ToolbarToggleButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"ToolbarToggleButton.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-toolbar/src/components/ToolbarToggleButton/ToolbarToggleButton.tsx"],"names":[],"mappings":";;;;IAOA;;OAEG;IACU,QAAA,mBAAmB,GAAkD,KAAK,CAAC,UAAU,CAAC,UAAC,KAAK,EAAE,GAAG;QAC5G,IAAM,KAAK,GAAG,wDAA+B,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC;QAE1D,oEAAqC,CAAC,KAAK,CAAC,CAAC;QAC7C,OAAO,0CAA2B,CAAC,KAAK,CAAC,CAAC;IAC5C,CAAC,CAAkD,CAAC;IAEpD,2BAAmB,CAAC,WAAW,GAAG,qBAAqB,CAAC","sourcesContent":["import * as React from 'react';\nimport type { ToolbarToggleButtonProps } from './ToolbarToggleButton.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { renderToggleButton_unstable } from '@fluentui/react-button';\nimport { useToolbarToggleButton_unstable } from './useToolbarToggleButton';\nimport { useToolbarToggleButtonStyles_unstable } from './useToolbarToggleButtonStyles';\n\n/**\n * ToolbarToggleButton component\n */\nexport const ToolbarToggleButton: ForwardRefComponent<ToolbarToggleButtonProps> = React.forwardRef((props, ref) => {\n  const state = useToolbarToggleButton_unstable(props, ref);\n\n  useToolbarToggleButtonStyles_unstable(state);\n  return renderToggleButton_unstable(state);\n}) as ForwardRefComponent<ToolbarToggleButtonProps>;\n\nToolbarToggleButton.displayName = 'ToolbarToggleButton';\n"]}
+{"version":3,"file":"ToolbarToggleButton.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-toolbar/src/components/ToolbarToggleButton/ToolbarToggleButton.tsx"],"names":[],"mappings":";;;;IAQA;;OAEG;IACU,QAAA,mBAAmB,GAAkD,KAAK,CAAC,UAAU,CAAC,UAAC,KAAK,EAAE,GAAG;QAC5G,IAAM,KAAK,GAAG,wDAA+B,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC;QAE1D,oEAAqC,CAAC,KAAK,CAAC,CAAC;QAErC,IAAuC,eAAe,GAAK,oDAA4B,EAAE,sCAAnC,CAAoC;QAClG,eAAe,CAAC,KAAK,CAAC,CAAC;QAEvB,OAAO,0CAA2B,CAAC,KAAK,CAAC,CAAC;IAC5C,CAAC,CAAkD,CAAC;IAEpD,2BAAmB,CAAC,WAAW,GAAG,qBAAqB,CAAC","sourcesContent":["import * as React from 'react';\nimport type { ToolbarToggleButtonProps } from './ToolbarToggleButton.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { renderToggleButton_unstable } from '@fluentui/react-button';\nimport { useToolbarToggleButton_unstable } from './useToolbarToggleButton';\nimport { useToolbarToggleButtonStyles_unstable } from './useToolbarToggleButtonStyles';\nimport { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * ToolbarToggleButton component\n */\nexport const ToolbarToggleButton: ForwardRefComponent<ToolbarToggleButtonProps> = React.forwardRef((props, ref) => {\n  const state = useToolbarToggleButton_unstable(props, ref);\n\n  useToolbarToggleButtonStyles_unstable(state);\n\n  const { useToolbarToggleButtonStyles_unstable: useCustomStyles } = useCustomStyleHooks_unstable();\n  useCustomStyles(state);\n\n  return renderToggleButton_unstable(state);\n}) as ForwardRefComponent<ToolbarToggleButtonProps>;\n\nToolbarToggleButton.displayName = 'ToolbarToggleButton';\n"]}

package/lib-commonjs/Toolbar.js.map

@@ -1 +1 @@
-{"version":3,"mappings":";;;;;;AAAAA","names":["tslib_1"],"sourceRoot":"../src/","sources":["packages/react-components/react-toolbar/src/Toolbar.ts"],"sourcesContent":["export * from './components/Toolbar/index';\n"]}
+{"version":3,"names":["tslib_1","__exportStar","require","exports"],"sources":["../src/packages/react-components/react-toolbar/src/Toolbar.ts"],"sourcesContent":["export * from './components/Toolbar/index';\n"],"mappings":";;;;;;AAAAA,OAAA,CAAAC,YAAA,CAAAC,OAAA,gCAAAC,OAAA"}

package/lib-commonjs/ToolbarButton.js.map

@@ -1 +1 @@
-{"version":3,"mappings":";;;;;;AAAAA","names":["tslib_1"],"sourceRoot":"../src/","sources":["packages/react-components/react-toolbar/src/ToolbarButton.ts"],"sourcesContent":["export * from './components/ToolbarButton/index';\n"]}
+{"version":3,"names":["tslib_1","__exportStar","require","exports"],"sources":["../src/packages/react-components/react-toolbar/src/ToolbarButton.ts"],"sourcesContent":["export * from './components/ToolbarButton/index';\n"],"mappings":";;;;;;AAAAA,OAAA,CAAAC,YAAA,CAAAC,OAAA,sCAAAC,OAAA"}

package/lib-commonjs/ToolbarDivider.js.map

@@ -1 +1 @@
-{"version":3,"mappings":";;;;;;AAAAA","names":["tslib_1"],"sourceRoot":"../src/","sources":["packages/react-components/react-toolbar/src/ToolbarDivider.ts"],"sourcesContent":["export * from './components/ToolbarDivider/index';\n"]}
+{"version":3,"names":["tslib_1","__exportStar","require","exports"],"sources":["../src/packages/react-components/react-toolbar/src/ToolbarDivider.ts"],"sourcesContent":["export * from './components/ToolbarDivider/index';\n"],"mappings":";;;;;;AAAAA,OAAA,CAAAC,YAAA,CAAAC,OAAA,uCAAAC,OAAA"}

package/lib-commonjs/ToolbarGroup.js.map

@@ -1 +1 @@
-{"version":3,"mappings":";;;;;;AAAAA","names":["tslib_1"],"sourceRoot":"../src/","sources":["packages/react-components/react-toolbar/src/ToolbarGroup.ts"],"sourcesContent":["export * from './components/ToolbarGroup/index';\n"]}
+{"version":3,"names":["tslib_1","__exportStar","require","exports"],"sources":["../src/packages/react-components/react-toolbar/src/ToolbarGroup.ts"],"sourcesContent":["export * from './components/ToolbarGroup/index';\n"],"mappings":";;;;;;AAAAA,OAAA,CAAAC,YAAA,CAAAC,OAAA,qCAAAC,OAAA"}

package/lib-commonjs/ToolbarRadioButton.js.map

@@ -1 +1 @@
-{"version":3,"mappings":";;;;;;AAAAA","names":["tslib_1"],"sourceRoot":"../src/","sources":["packages/react-components/react-toolbar/src/ToolbarRadioButton.ts"],"sourcesContent":["export * from './components/ToolbarRadioButton/index';\n"]}
+{"version":3,"names":["tslib_1","__exportStar","require","exports"],"sources":["../src/packages/react-components/react-toolbar/src/ToolbarRadioButton.ts"],"sourcesContent":["export * from './components/ToolbarRadioButton/index';\n"],"mappings":";;;;;;AAAAA,OAAA,CAAAC,YAAA,CAAAC,OAAA,2CAAAC,OAAA"}

package/lib-commonjs/ToolbarRadioGroup.js.map

@@ -1 +1 @@
-{"version":3,"mappings":";;;;;;AAAAA","names":["tslib_1"],"sourceRoot":"../src/","sources":["packages/react-components/react-toolbar/src/ToolbarRadioGroup.ts"],"sourcesContent":["export * from './components/ToolbarRadioGroup/index';\n"]}
+{"version":3,"names":["tslib_1","__exportStar","require","exports"],"sources":["../src/packages/react-components/react-toolbar/src/ToolbarRadioGroup.ts"],"sourcesContent":["export * from './components/ToolbarRadioGroup/index';\n"],"mappings":";;;;;;AAAAA,OAAA,CAAAC,YAAA,CAAAC,OAAA,0CAAAC,OAAA"}

package/lib-commonjs/ToolbarToggleButton.js.map

@@ -1 +1 @@
-{"version":3,"mappings":";;;;;;AAAAA","names":["tslib_1"],"sourceRoot":"../src/","sources":["packages/react-components/react-toolbar/src/ToolbarToggleButton.ts"],"sourcesContent":["export * from './components/ToolbarToggleButton/index';\n"]}
+{"version":3,"names":["tslib_1","__exportStar","require","exports"],"sources":["../src/packages/react-components/react-toolbar/src/ToolbarToggleButton.ts"],"sourcesContent":["export * from './components/ToolbarToggleButton/index';\n"],"mappings":";;;;;;AAAAA,OAAA,CAAAC,YAAA,CAAAC,OAAA,4CAAAC,OAAA"}

package/lib-commonjs/components/Toolbar/Toolbar.js

@@ -9,6 +9,7 @@ const useToolbar_1 = /*#__PURE__*/require("./useToolbar");
 const renderToolbar_1 = /*#__PURE__*/require("./renderToolbar");
 const useToolbarStyles_1 = /*#__PURE__*/require("./useToolbarStyles");
 const useToolbarContextValues_1 = /*#__PURE__*/require("./useToolbarContextValues");
+const react_shared_contexts_1 = /*#__PURE__*/require("@fluentui/react-shared-contexts");
 /**
  * Toolbar component
  */
@@ -16,6 +17,10 @@ exports.Toolbar = /*#__PURE__*/React.forwardRef((props, ref) => {
   const state = useToolbar_1.useToolbar_unstable(props, ref);
   const contextValues = useToolbarContextValues_1.useToolbarContextValues_unstable(state);
   useToolbarStyles_1.useToolbarStyles_unstable(state);
+  const {
+    useToolbarStyles_unstable: useCustomStyles
+  } = react_shared_contexts_1.useCustomStyleHooks_unstable();
+  useCustomStyles(state);
   return renderToolbar_1.renderToolbar_unstable(state, contextValues);
 });
 exports.Toolbar.displayName = 'Toolbar';

package/lib-commonjs/components/Toolbar/Toolbar.js.map

@@ -1 +1 @@
-{"version":3,"mappings":";;;;;;AAAA;AACA;AACA;AACA;AAGA;AAEA;;;AAGaA,eAAO,gBAAsCC,KAAK,CAACC,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EACxF,MAAMC,KAAK,GAAGC,gCAAmB,CAACH,KAAK,EAAEC,GAAG,CAAC;EAC7C,MAAMG,aAAa,GAAGC,0DAAgC,CAACH,KAAK,CAAC;EAC7DI,4CAAyB,CAACJ,KAAK,CAAC;EAChC,OAAOK,sCAAsB,CAACL,KAAK,EAAEE,aAAa,CAAC;AACrD,CAAC,CAAC;AAEFP,eAAO,CAACW,WAAW,GAAG,SAAS","names":["exports","React","forwardRef","props","ref","state","useToolbar_1","contextValues","useToolbarContextValues_1","useToolbarStyles_1","renderToolbar_1","displayName"],"sourceRoot":"../src/","sources":["packages/react-components/react-toolbar/src/components/Toolbar/Toolbar.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useToolbar_unstable } from './useToolbar';\nimport { renderToolbar_unstable } from './renderToolbar';\nimport { useToolbarStyles_unstable } from './useToolbarStyles';\nimport type { ToolbarProps } from './Toolbar.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useToolbarContextValues_unstable } from './useToolbarContextValues';\n\n/**\n * Toolbar component\n */\nexport const Toolbar: ForwardRefComponent<ToolbarProps> = React.forwardRef((props, ref) => {\n  const state = useToolbar_unstable(props, ref);\n  const contextValues = useToolbarContextValues_unstable(state);\n  useToolbarStyles_unstable(state);\n  return renderToolbar_unstable(state, contextValues);\n});\n\nToolbar.displayName = 'Toolbar';\n"]}
+{"version":3,"names":["React","require","useToolbar_1","renderToolbar_1","useToolbarStyles_1","useToolbarContextValues_1","react_shared_contexts_1","exports","Toolbar","forwardRef","props","ref","state","useToolbar_unstable","contextValues","useToolbarContextValues_unstable","useToolbarStyles_unstable","useCustomStyles","useCustomStyleHooks_unstable","renderToolbar_unstable","displayName"],"sources":["../src/packages/react-components/react-toolbar/src/components/Toolbar/Toolbar.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useToolbar_unstable } from './useToolbar';\nimport { renderToolbar_unstable } from './renderToolbar';\nimport { useToolbarStyles_unstable } from './useToolbarStyles';\nimport type { ToolbarProps } from './Toolbar.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useToolbarContextValues_unstable } from './useToolbarContextValues';\nimport { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * Toolbar component\n */\nexport const Toolbar: ForwardRefComponent<ToolbarProps> = React.forwardRef((props, ref) => {\n  const state = useToolbar_unstable(props, ref);\n  const contextValues = useToolbarContextValues_unstable(state);\n\n  useToolbarStyles_unstable(state);\n\n  const { useToolbarStyles_unstable: useCustomStyles } = useCustomStyleHooks_unstable();\n  useCustomStyles(state);\n\n  return renderToolbar_unstable(state, contextValues);\n});\n\nToolbar.displayName = 'Toolbar';\n"],"mappings":";;;;;;AAAA,MAAAA,KAAA,gBAAAC,OAAA;AACA,MAAAC,YAAA,gBAAAD,OAAA;AACA,MAAAE,eAAA,gBAAAF,OAAA;AACA,MAAAG,kBAAA,gBAAAH,OAAA;AAGA,MAAAI,yBAAA,gBAAAJ,OAAA;AACA,MAAAK,uBAAA,gBAAAL,OAAA;AAEA;;;AAGaM,OAAA,CAAAC,OAAO,gBAAsCR,KAAK,CAACS,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EACxF,MAAMC,KAAK,GAAGV,YAAA,CAAAW,mBAAmB,CAACH,KAAK,EAAEC,GAAG,CAAC;EAC7C,MAAMG,aAAa,GAAGT,yBAAA,CAAAU,gCAAgC,CAACH,KAAK,CAAC;EAE7DR,kBAAA,CAAAY,yBAAyB,CAACJ,KAAK,CAAC;EAEhC,MAAM;IAAEI,yBAAyB,EAAEC;EAAe,CAAE,GAAGX,uBAAA,CAAAY,4BAA4B,EAAE;EACrFD,eAAe,CAACL,KAAK,CAAC;EAEtB,OAAOT,eAAA,CAAAgB,sBAAsB,CAACP,KAAK,EAAEE,aAAa,CAAC;AACrD,CAAC,CAAC;AAEFP,OAAA,CAAAC,OAAO,CAACY,WAAW,GAAG,SAAS"}

package/lib-commonjs/components/Toolbar/Toolbar.types.js.map

@@ -1 +1 @@
-{"version":3,"mappings":"","names":[],"sourceRoot":"../src/","sources":[],"sourcesContent":[]}
+{"version":3,"names":[],"sources":["../src/packages/react-components/react-toolbar/src/components/Toolbar/Toolbar.types.ts"],"sourcesContent":["import * as React from 'react';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type ToolbarSlots = {\n  root: Slot<'div'>;\n};\n\nexport type ToolbarCheckedValueChangeData = {\n  /** The items for this value that are checked */\n  checkedItems: string[];\n  /** The name of the value */\n  name: string;\n};\n\nexport type ToolbarCheckedValueChangeEvent = React.MouseEvent | React.KeyboardEvent;\n\n/**\n * Toolbar Props\n */\nexport type ToolbarProps = ComponentProps<ToolbarSlots> & {\n  /**\n   * Toolbar can have small or medium size\n   *\n   * @default medium\n   */\n  size?: 'small' | 'medium' | 'large';\n\n  /**\n   * Toolbar can be vertical styled\n   * @default false\n   */\n  vertical?: boolean;\n\n  /**\n   * Map of all checked values\n   */\n  checkedValues?: Record<string, string[]>;\n\n  /**\n   * Default values to be checked on mount\n   */\n  defaultCheckedValues?: Record<string, string[]>;\n\n  /**\n   * Callback when checked items change for value with a name\n   *\n   * @param event - React's original SyntheticEvent\n   * @param data - A data object with relevant information\n   */\n  onCheckedValueChange?: (e: ToolbarCheckedValueChangeEvent, data: ToolbarCheckedValueChangeData) => void;\n};\n\n/**\n * State used in rendering Toolbar\n */\nexport type ToolbarState = ComponentState<ToolbarSlots> &\n  Required<Pick<ToolbarProps, 'size' | 'checkedValues' | 'vertical'>> &\n  Pick<ToolbarProps, 'defaultCheckedValues' | 'onCheckedValueChange'> & {\n    /*\n     * Toggles the state of a ToggleButton item\n     */\n    handleToggleButton: ToggableHandler;\n    /*\n     * Toggles the state of a ToggleButton item\n     */\n    handleRadio: ToggableHandler;\n  };\n\nexport type ToolbarContextValue = Pick<ToolbarState, 'size' | 'vertical' | 'checkedValues'> & {\n  handleToggleButton?: ToggableHandler;\n  handleRadio?: ToggableHandler;\n};\n\nexport type ToolbarContextValues = {\n  toolbar: ToolbarContextValue;\n};\n\nexport type UninitializedToolbarState = Omit<ToolbarState, 'checkedValues' | 'handleToggleButton' | 'handleRadio'> &\n  Partial<Pick<ToolbarState, 'checkedValues'>>;\n\nexport type ToggableHandler = (\n  e: React.MouseEvent | React.KeyboardEvent,\n  name: string,\n  value: string,\n  checked?: boolean,\n) => void;\n"],"mappings":""}

package/lib-commonjs/components/Toolbar/ToolbarContext.js.map

@@ -1 +1 @@
-{"version":3,"mappings":";;;;;;AAAA;AAIaA,sBAAc,gBAAGC,sCAAa,CAAkCC,SAAS,CAAiC;AAEvH,MAAMC,0BAA0B,GAAwB;EACtDC,IAAI,EAAE,QAAoB;EAC1BC,kBAAkB,EAAE,MAAM,IAAI;EAC9BC,WAAW,EAAE,MAAM,IAAI;EACvBC,QAAQ,EAAE,KAAK;EACfC,aAAa,EAAE;CAChB;AAEM,MAAMC,0BAA0B,GAAOC,QAAiD,IAC7FT,2CAAkB,CAACD,sBAAc,EAAE,CAACW,GAAG,GAAGR,0BAA0B,KAAKO,QAAQ,CAACC,GAAG,CAAC,CAAC;AAD5EX,kCAA0B","names":["exports","react_context_selector_1","undefined","toolbarContextDefaultValue","size","handleToggleButton","handleRadio","vertical","checkedValues","useToolbarContext_unstable","selector","ctx"],"sourceRoot":"../src/","sources":["packages/react-components/react-toolbar/src/components/Toolbar/ToolbarContext.ts"],"sourcesContent":["import { ContextSelector, createContext, useContextSelector } from '@fluentui/react-context-selector';\nimport type { Context } from '@fluentui/react-context-selector';\nimport type { ToolbarContextValue } from './Toolbar.types';\n\nexport const ToolbarContext = createContext<ToolbarContextValue | undefined>(undefined) as Context<ToolbarContextValue>;\n\nconst toolbarContextDefaultValue: ToolbarContextValue = {\n  size: 'medium' as 'medium',\n  handleToggleButton: () => null,\n  handleRadio: () => null,\n  vertical: false,\n  checkedValues: {},\n};\n\nexport const useToolbarContext_unstable = <T>(selector: ContextSelector<ToolbarContextValue, T>): T =>\n  useContextSelector(ToolbarContext, (ctx = toolbarContextDefaultValue) => selector(ctx));\n"]}
+{"version":3,"names":["react_context_selector_1","require","exports","ToolbarContext","createContext","undefined","toolbarContextDefaultValue","size","handleToggleButton","handleRadio","vertical","checkedValues","useToolbarContext_unstable","selector","useContextSelector","ctx"],"sources":["../src/packages/react-components/react-toolbar/src/components/Toolbar/ToolbarContext.ts"],"sourcesContent":["import { ContextSelector, createContext, useContextSelector } from '@fluentui/react-context-selector';\nimport type { Context } from '@fluentui/react-context-selector';\nimport type { ToolbarContextValue } from './Toolbar.types';\n\nexport const ToolbarContext = createContext<ToolbarContextValue | undefined>(undefined) as Context<ToolbarContextValue>;\n\nconst toolbarContextDefaultValue: ToolbarContextValue = {\n  size: 'medium' as 'medium',\n  handleToggleButton: () => null,\n  handleRadio: () => null,\n  vertical: false,\n  checkedValues: {},\n};\n\nexport const useToolbarContext_unstable = <T>(selector: ContextSelector<ToolbarContextValue, T>): T =>\n  useContextSelector(ToolbarContext, (ctx = toolbarContextDefaultValue) => selector(ctx));\n"],"mappings":";;;;;;AAAA,MAAAA,wBAAA,gBAAAC,OAAA;AAIaC,OAAA,CAAAC,cAAc,gBAAGH,wBAAA,CAAAI,aAAa,CAAkCC,SAAS,CAAiC;AAEvH,MAAMC,0BAA0B,GAAwB;EACtDC,IAAI,EAAE,QAAoB;EAC1BC,kBAAkB,EAAEA,CAAA,KAAM,IAAI;EAC9BC,WAAW,EAAEA,CAAA,KAAM,IAAI;EACvBC,QAAQ,EAAE,KAAK;EACfC,aAAa,EAAE;CAChB;AAEM,MAAMC,0BAA0B,GAAOC,QAAiD,IAC7Fb,wBAAA,CAAAc,kBAAkB,CAACZ,OAAA,CAAAC,cAAc,EAAE,CAACY,GAAG,GAAGT,0BAA0B,KAAKO,QAAQ,CAACE,GAAG,CAAC,CAAC;AAD5Eb,OAAA,CAAAU,0BAA0B,GAAAA,0BAAA"}

package/lib-commonjs/components/Toolbar/index.js.map

@@ -1 +1 @@
-{"version":3,"mappings":";;;;;;AAAAA;AACAA;AACAA;AACAA;AACAA","names":["tslib_1"],"sourceRoot":"../src/","sources":["packages/react-components/react-toolbar/src/components/Toolbar/index.ts"],"sourcesContent":["export * from './Toolbar';\nexport * from './Toolbar.types';\nexport * from './renderToolbar';\nexport * from './useToolbar';\nexport * from './useToolbarStyles';\n"]}
+{"version":3,"names":["tslib_1","__exportStar","require","exports"],"sources":["../src/packages/react-components/react-toolbar/src/components/Toolbar/index.ts"],"sourcesContent":["export * from './Toolbar';\nexport * from './Toolbar.types';\nexport * from './renderToolbar';\nexport * from './useToolbar';\nexport * from './useToolbarStyles';\n"],"mappings":";;;;;;AAAAA,OAAA,CAAAC,YAAA,CAAAC,OAAA,eAAAC,OAAA;AACAH,OAAA,CAAAC,YAAA,CAAAC,OAAA,qBAAAC,OAAA;AACAH,OAAA,CAAAC,YAAA,CAAAC,OAAA,qBAAAC,OAAA;AACAH,OAAA,CAAAC,YAAA,CAAAC,OAAA,kBAAAC,OAAA;AACAH,OAAA,CAAAC,YAAA,CAAAC,OAAA,wBAAAC,OAAA"}

package/lib-commonjs/components/Toolbar/renderToolbar.js.map

@@ -1 +1 @@
-{"version":3,"mappings":";;;;;;AAAA;AACA;AAEA;AAEA;;;AAGO,MAAMA,sBAAsB,GAAG,CAACC,KAAmB,EAAEC,aAAmC,KAAI;EACjG,MAAM;IAAEC,KAAK;IAAEC;EAAS,CAAE,GAAGC,0BAAQ,CAAeJ,KAAK,CAAC;EAE1D,OACEK,oBAACC,+BAAc,CAACC,QAAQ;IAACC,KAAK,EAAEP,aAAa,CAACQ;EAAO,GACnDJ,oBAACH,KAAK,CAACQ,IAAI;IAAA,GAAKP,SAAS,CAACO;EAAI,GAAGP,SAAS,CAACO,IAAI,CAACC,QAAQ,CAAc,CAC9C;AAE9B,CAAC;AARYC,8BAAsB","names":["renderToolbar_unstable","state","contextValues","slots","slotProps","react_utilities_1","React","ToolbarContext_1","Provider","value","toolbar","root","children","exports"],"sourceRoot":"../src/","sources":["packages/react-components/react-toolbar/src/components/Toolbar/renderToolbar.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { ToolbarState, ToolbarSlots, ToolbarContextValues } from './Toolbar.types';\nimport { ToolbarContext } from './ToolbarContext';\n\n/**\n * Render the final JSX of Toolbar\n */\nexport const renderToolbar_unstable = (state: ToolbarState, contextValues: ToolbarContextValues) => {\n  const { slots, slotProps } = getSlots<ToolbarSlots>(state);\n\n  return (\n    <ToolbarContext.Provider value={contextValues.toolbar}>\n      <slots.root {...slotProps.root}>{slotProps.root.children}</slots.root>\n    </ToolbarContext.Provider>\n  );\n};\n"]}
+{"version":3,"names":["React","require","react_utilities_1","ToolbarContext_1","renderToolbar_unstable","state","contextValues","slots","slotProps","getSlots","createElement","ToolbarContext","Provider","value","toolbar","root","children","exports"],"sources":["../src/packages/react-components/react-toolbar/src/components/Toolbar/renderToolbar.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { ToolbarState, ToolbarSlots, ToolbarContextValues } from './Toolbar.types';\nimport { ToolbarContext } from './ToolbarContext';\n\n/**\n * Render the final JSX of Toolbar\n */\nexport const renderToolbar_unstable = (state: ToolbarState, contextValues: ToolbarContextValues) => {\n  const { slots, slotProps } = getSlots<ToolbarSlots>(state);\n\n  return (\n    <ToolbarContext.Provider value={contextValues.toolbar}>\n      <slots.root {...slotProps.root}>{slotProps.root.children}</slots.root>\n    </ToolbarContext.Provider>\n  );\n};\n"],"mappings":";;;;;;AAAA,MAAAA,KAAA,gBAAAC,OAAA;AACA,MAAAC,iBAAA,gBAAAD,OAAA;AAEA,MAAAE,gBAAA,gBAAAF,OAAA;AAEA;;;AAGO,MAAMG,sBAAsB,GAAGA,CAACC,KAAmB,EAAEC,aAAmC,KAAI;EACjG,MAAM;IAAEC,KAAK;IAAEC;EAAS,CAAE,GAAGN,iBAAA,CAAAO,QAAQ,CAAeJ,KAAK,CAAC;EAE1D,OACEL,KAAA,CAAAU,aAAA,CAACP,gBAAA,CAAAQ,cAAc,CAACC,QAAQ;IAACC,KAAK,EAAEP,aAAa,CAACQ;EAAO,GACnDd,KAAA,CAAAU,aAAA,CAACH,KAAK,CAACQ,IAAI;IAAA,GAAKP,SAAS,CAACO;EAAI,GAAGP,SAAS,CAACO,IAAI,CAACC,QAAQ,CAAc,CAC9C;AAE9B,CAAC;AARYC,OAAA,CAAAb,sBAAsB,GAAAA,sBAAA"}

package/lib-commonjs/components/Toolbar/useToolbar.js.map

@@ -1 +1 @@
-{"version":3,"mappings":";;;;;;AACA;AACA;AAEA;AAEA;;;;;;;;;AASO,MAAMA,mBAAmB,GAAG,CAACC,KAAmB,EAAEC,GAA2B,KAAkB;EACpG,MAAM;IAAEC,IAAI,GAAG,QAAQ;IAAEC,QAAQ,GAAG;EAAK,CAAE,GAAGH,KAAK;EAEnD,MAAMI,oBAAoB,GAAGC,uCAAuB,CAAC;IACnDC,QAAQ,EAAE,IAAI;IACdC,IAAI,EAAE;GACP,CAAC;EAEF,MAAMC,YAAY,GAA8B;IAC9CN,IAAI;IACJC,QAAQ;IACR;IACAM,UAAU,EAAE;MACV;MACAC,IAAI,EAAE;KACP;IACD;IACA;IACAA,IAAI,EAAEC,uCAAqB,CAAC,KAAK,EAAE;MACjCC,IAAI,EAAE,SAAS;MACfX,GAAG;MACH,IAAIE,QAAQ,IAAI;QAAE,kBAAkB,EAAE;MAAU,CAAE,CAAC;MACnD,GAAGC,oBAAoB;MACvB,GAAGJ;KACJ;GACF;EAED,MAAM,CAACa,aAAa,EAAEC,oBAAoB,CAAC,GAAGC,yBAAyB,CAAC;IACtEF,aAAa,EAAEb,KAAK,CAACa,aAAa;IAClCG,oBAAoB,EAAEhB,KAAK,CAACgB,oBAAoB;IAChDF,oBAAoB,EAAEd,KAAK,CAACc;GAC7B,CAAC;EAEF,MAAMG,kBAAkB,GAAoBC,kCAAgB,CAC1D,CAACC,CAAyC,EAAEC,IAAY,EAAEC,KAAa,EAAEC,OAAiB,KAAI;IAC5F,IAAIF,IAAI,IAAIC,KAAK,EAAE;MACjB,MAAME,YAAY,GAAG,cAAa,aAAbV,aAAa,uBAAbA,aAAa,CAAGO,IAAI,CAAC,KAAI,EAAE;MAChD,MAAMI,eAAe,GAAG,CAAC,GAAGD,YAAY,CAAC;MACzC,IAAID,OAAO,EAAE;QACXE,eAAe,CAACC,MAAM,CAACD,eAAe,CAACE,OAAO,CAACL,KAAK,CAAC,EAAE,CAAC,CAAC;OAC1D,MAAM;QACLG,eAAe,CAACG,IAAI,CAACN,KAAK,CAAC;;MAE7BP,oBAAoB,aAApBA,oBAAoB,uBAApBA,oBAAoB,CAAGK,CAAC,EAAE;QAAEC,IAAI;QAAEG,YAAY,EAAEC;MAAe,CAAE,CAAC;;EAEtE,CAAC,CACF;EAED,MAAMI,WAAW,GAAoBV,kCAAgB,CACnD,CAACC,CAAyC,EAAEC,IAAY,EAAEC,KAAa,EAAEC,OAAiB,KAAI;IAC5F,IAAIF,IAAI,IAAIC,KAAK,EAAE;MACjBP,oBAAoB,aAApBA,oBAAoB,uBAApBA,oBAAoB,CAAGK,CAAC,EAAE;QACxBC,IAAI;QACJG,YAAY,EAAE,CAACF,KAAK;OACrB,CAAC;;EAEN,CAAC,CACF;EAED,OAAO;IACL,GAAGb,YAAY;IACfS,kBAAkB;IAClBW,WAAW;IACXf,aAAa,EAAEA,aAAa,aAAbA,aAAa,cAAbA,aAAa,GAAI;GACjC;AACH,CAAC;AAjEYgB,2BAAmB;AAmEhC;;;;AAIA,MAAMd,yBAAyB,GAC7Be,KAA4F,IAC1F;EACF,MAAM,CAACjB,aAAa,EAAEkB,gBAAgB,CAAC,GAAGb,sCAAoB,CAAC;IAC7DY,KAAK,EAAEA,KAAK,CAACjB,aAAa;IAC1BmB,YAAY,EAAEF,KAAK,CAACd,oBAAoB;IACxCR,YAAY,EAAE;GACf,CAAC;EACF,MAAM;IAAEM,oBAAoB,EAAEmB;EAA4B,CAAE,GAAGH,KAAK;EACpE,MAAMhB,oBAAoB,GAAyCI,kCAAgB,CAAC,CAACC,CAAC,EAAE;IAAEC,IAAI;IAAEG;EAAY,CAAE,KAAI;IAChH,IAAIU,4BAA4B,EAAE;MAChCA,4BAA4B,CAACd,CAAC,EAAE;QAAEC,IAAI;QAAEG;MAAY,CAAE,CAAC;;IAGzDQ,gBAAgB,CAACG,CAAC,IAAG;MACnB,OAAOA,CAAC,GAAG;QAAE,GAAGA,CAAC;QAAE,CAACd,IAAI,GAAGG;MAAY,CAAE,GAAG;QAAE,CAACH,IAAI,GAAGG;MAAY,CAAE;IACtE,CAAC,CAAC;EACJ,CAAC,CAAC;EAEF,OAAO,CAACV,aAAa,EAAEC,oBAAoB,CAAU;AACvD,CAAC","names":["useToolbar_unstable","props","ref","size","vertical","arrowNavigationProps","react_tabster_1","circular","axis","initialState","components","root","react_utilities_2","role","checkedValues","onCheckedValueChange","useToolbarSelectableState","defaultCheckedValues","handleToggleButton","react_utilities_1","e","name","value","checked","checkedItems","newCheckedItems","splice","indexOf","push","handleRadio","exports","state","setCheckedValues","defaultState","onCheckedValueChangeOriginal","s"],"sourceRoot":"../src/","sources":["packages/react-components/react-toolbar/src/components/Toolbar/useToolbar.ts"],"sourcesContent":["import * as React from 'react';\nimport { useEventCallback, useControllableState } from '@fluentui/react-utilities';\nimport { getNativeElementProps } from '@fluentui/react-utilities';\nimport type { ToggableHandler, ToolbarProps, ToolbarState, UninitializedToolbarState } from './Toolbar.types';\nimport { useArrowNavigationGroup } from '@fluentui/react-tabster';\n\n/**\n * Create the state required to render Toolbar.\n *\n * The returned state can be modified with hooks such as useToolbarStyles_unstable,\n * before being passed to renderToolbar_unstable.\n *\n * @param props - props from this instance of Toolbar\n * @param ref - reference to root HTMLElement of Toolbar\n */\nexport const useToolbar_unstable = (props: ToolbarProps, ref: React.Ref<HTMLElement>): ToolbarState => {\n  const { size = 'medium', vertical = false } = props;\n\n  const arrowNavigationProps = useArrowNavigationGroup({\n    circular: true,\n    axis: 'both',\n  });\n\n  const initialState: UninitializedToolbarState = {\n    size,\n    vertical,\n    // TODO add appropriate props/defaults\n    components: {\n      // TODO add each slot's element type or component\n      root: 'div',\n    },\n    // TODO add appropriate slots, for example:\n    // mySlot: resolveShorthand(props.mySlot),\n    root: getNativeElementProps('div', {\n      role: 'toolbar',\n      ref,\n      ...(vertical && { 'aria-orientation': 'vertical' }),\n      ...arrowNavigationProps,\n      ...props,\n    }),\n  };\n\n  const [checkedValues, onCheckedValueChange] = useToolbarSelectableState({\n    checkedValues: props.checkedValues,\n    defaultCheckedValues: props.defaultCheckedValues,\n    onCheckedValueChange: props.onCheckedValueChange,\n  });\n\n  const handleToggleButton: ToggableHandler = useEventCallback(\n    (e: React.MouseEvent | React.KeyboardEvent, name: string, value: string, checked?: boolean) => {\n      if (name && value) {\n        const checkedItems = checkedValues?.[name] || [];\n        const newCheckedItems = [...checkedItems];\n        if (checked) {\n          newCheckedItems.splice(newCheckedItems.indexOf(value), 1);\n        } else {\n          newCheckedItems.push(value);\n        }\n        onCheckedValueChange?.(e, { name, checkedItems: newCheckedItems });\n      }\n    },\n  );\n\n  const handleRadio: ToggableHandler = useEventCallback(\n    (e: React.MouseEvent | React.KeyboardEvent, name: string, value: string, checked?: boolean) => {\n      if (name && value) {\n        onCheckedValueChange?.(e, {\n          name,\n          checkedItems: [value],\n        });\n      }\n    },\n  );\n\n  return {\n    ...initialState,\n    handleToggleButton,\n    handleRadio,\n    checkedValues: checkedValues ?? {},\n  };\n};\n\n/**\n * Adds appropriate state values and handlers for selectable items\n * i.e checkboxes and radios\n */\nconst useToolbarSelectableState = (\n  state: Pick<ToolbarProps, 'checkedValues' | 'defaultCheckedValues' | 'onCheckedValueChange'>,\n) => {\n  const [checkedValues, setCheckedValues] = useControllableState({\n    state: state.checkedValues,\n    defaultState: state.defaultCheckedValues,\n    initialState: {},\n  });\n  const { onCheckedValueChange: onCheckedValueChangeOriginal } = state;\n  const onCheckedValueChange: ToolbarState['onCheckedValueChange'] = useEventCallback((e, { name, checkedItems }) => {\n    if (onCheckedValueChangeOriginal) {\n      onCheckedValueChangeOriginal(e, { name, checkedItems });\n    }\n\n    setCheckedValues(s => {\n      return s ? { ...s, [name]: checkedItems } : { [name]: checkedItems };\n    });\n  });\n\n  return [checkedValues, onCheckedValueChange] as const;\n};\n"]}
+{"version":3,"names":["react_utilities_1","require","react_utilities_2","react_tabster_1","useToolbar_unstable","props","ref","size","vertical","arrowNavigationProps","useArrowNavigationGroup","circular","axis","initialState","components","root","getNativeElementProps","role","checkedValues","onCheckedValueChange","useToolbarSelectableState","defaultCheckedValues","handleToggleButton","useEventCallback","e","name","value","checked","checkedItems","newCheckedItems","splice","indexOf","push","handleRadio","exports","state","setCheckedValues","useControllableState","defaultState","onCheckedValueChangeOriginal","s"],"sources":["../src/packages/react-components/react-toolbar/src/components/Toolbar/useToolbar.ts"],"sourcesContent":["import * as React from 'react';\nimport { useEventCallback, useControllableState } from '@fluentui/react-utilities';\nimport { getNativeElementProps } from '@fluentui/react-utilities';\nimport type { ToggableHandler, ToolbarProps, ToolbarState, UninitializedToolbarState } from './Toolbar.types';\nimport { useArrowNavigationGroup } from '@fluentui/react-tabster';\n\n/**\n * Create the state required to render Toolbar.\n *\n * The returned state can be modified with hooks such as useToolbarStyles_unstable,\n * before being passed to renderToolbar_unstable.\n *\n * @param props - props from this instance of Toolbar\n * @param ref - reference to root HTMLElement of Toolbar\n */\nexport const useToolbar_unstable = (props: ToolbarProps, ref: React.Ref<HTMLElement>): ToolbarState => {\n  const { size = 'medium', vertical = false } = props;\n\n  const arrowNavigationProps = useArrowNavigationGroup({\n    circular: true,\n    axis: 'both',\n  });\n\n  const initialState: UninitializedToolbarState = {\n    size,\n    vertical,\n    // TODO add appropriate props/defaults\n    components: {\n      // TODO add each slot's element type or component\n      root: 'div',\n    },\n    // TODO add appropriate slots, for example:\n    // mySlot: resolveShorthand(props.mySlot),\n    root: getNativeElementProps('div', {\n      role: 'toolbar',\n      ref,\n      ...(vertical && { 'aria-orientation': 'vertical' }),\n      ...arrowNavigationProps,\n      ...props,\n    }),\n  };\n\n  const [checkedValues, onCheckedValueChange] = useToolbarSelectableState({\n    checkedValues: props.checkedValues,\n    defaultCheckedValues: props.defaultCheckedValues,\n    onCheckedValueChange: props.onCheckedValueChange,\n  });\n\n  const handleToggleButton: ToggableHandler = useEventCallback(\n    (e: React.MouseEvent | React.KeyboardEvent, name: string, value: string, checked?: boolean) => {\n      if (name && value) {\n        const checkedItems = checkedValues?.[name] || [];\n        const newCheckedItems = [...checkedItems];\n        if (checked) {\n          newCheckedItems.splice(newCheckedItems.indexOf(value), 1);\n        } else {\n          newCheckedItems.push(value);\n        }\n        onCheckedValueChange?.(e, { name, checkedItems: newCheckedItems });\n      }\n    },\n  );\n\n  const handleRadio: ToggableHandler = useEventCallback(\n    (e: React.MouseEvent | React.KeyboardEvent, name: string, value: string, checked?: boolean) => {\n      if (name && value) {\n        onCheckedValueChange?.(e, {\n          name,\n          checkedItems: [value],\n        });\n      }\n    },\n  );\n\n  return {\n    ...initialState,\n    handleToggleButton,\n    handleRadio,\n    checkedValues: checkedValues ?? {},\n  };\n};\n\n/**\n * Adds appropriate state values and handlers for selectable items\n * i.e checkboxes and radios\n */\nconst useToolbarSelectableState = (\n  state: Pick<ToolbarProps, 'checkedValues' | 'defaultCheckedValues' | 'onCheckedValueChange'>,\n) => {\n  const [checkedValues, setCheckedValues] = useControllableState({\n    state: state.checkedValues,\n    defaultState: state.defaultCheckedValues,\n    initialState: {},\n  });\n  const { onCheckedValueChange: onCheckedValueChangeOriginal } = state;\n  const onCheckedValueChange: ToolbarState['onCheckedValueChange'] = useEventCallback((e, { name, checkedItems }) => {\n    if (onCheckedValueChangeOriginal) {\n      onCheckedValueChangeOriginal(e, { name, checkedItems });\n    }\n\n    setCheckedValues(s => {\n      return s ? { ...s, [name]: checkedItems } : { [name]: checkedItems };\n    });\n  });\n\n  return [checkedValues, onCheckedValueChange] as const;\n};\n"],"mappings":"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"}

package/lib-commonjs/components/Toolbar/useToolbarContextValues.js.map

@@ -1 +1 @@
-{"version":3,"mappings":";;;;;;AAEA,SAAgBA,gCAAgC,CAACC,KAAmB;EAClE,MAAM;IAAEC,IAAI;IAAEC,kBAAkB;IAAEC,QAAQ;IAAEC,aAAa;IAAEC;EAAW,CAAE,GAAGL,KAAK;EAChF;EACA,MAAMM,OAAO,GAAwB;IACnCL,IAAI;IACJE,QAAQ;IACRD,kBAAkB;IAClBG,WAAW;IACXD;GACD;EAED,OAAO;IAAEE;EAAO,CAAE;AACpB;AAZAC","names":["useToolbarContextValues_unstable","state","size","handleToggleButton","vertical","checkedValues","handleRadio","toolbar","exports"],"sourceRoot":"../src/","sources":["packages/react-components/react-toolbar/src/components/Toolbar/useToolbarContextValues.tsx"],"sourcesContent":["import type { ToolbarContextValue, ToolbarContextValues, ToolbarState } from './Toolbar.types';\n\nexport function useToolbarContextValues_unstable(state: ToolbarState): ToolbarContextValues {\n  const { size, handleToggleButton, vertical, checkedValues, handleRadio } = state;\n  // This context is created with \"@fluentui/react-context-selector\", these is no sense to memoize it\n  const toolbar: ToolbarContextValue = {\n    size,\n    vertical,\n    handleToggleButton,\n    handleRadio,\n    checkedValues,\n  };\n\n  return { toolbar };\n}\n"]}
+{"version":3,"names":["useToolbarContextValues_unstable","state","size","handleToggleButton","vertical","checkedValues","handleRadio","toolbar","exports"],"sources":["../src/packages/react-components/react-toolbar/src/components/Toolbar/useToolbarContextValues.tsx"],"sourcesContent":["import type { ToolbarContextValue, ToolbarContextValues, ToolbarState } from './Toolbar.types';\n\nexport function useToolbarContextValues_unstable(state: ToolbarState): ToolbarContextValues {\n  const { size, handleToggleButton, vertical, checkedValues, handleRadio } = state;\n  // This context is created with \"@fluentui/react-context-selector\", these is no sense to memoize it\n  const toolbar: ToolbarContextValue = {\n    size,\n    vertical,\n    handleToggleButton,\n    handleRadio,\n    checkedValues,\n  };\n\n  return { toolbar };\n}\n"],"mappings":";;;;;;AAEA,SAAgBA,gCAAgCA,CAACC,KAAmB;EAClE,MAAM;IAAEC,IAAI;IAAEC,kBAAkB;IAAEC,QAAQ;IAAEC,aAAa;IAAEC;EAAW,CAAE,GAAGL,KAAK;EAChF;EACA,MAAMM,OAAO,GAAwB;IACnCL,IAAI;IACJE,QAAQ;IACRD,kBAAkB;IAClBG,WAAW;IACXD;GACD;EAED,OAAO;IAAEE;EAAO,CAAE;AACpB;AAZAC,OAAA,CAAAR,gCAAA,GAAAA,gCAAA"}

package/lib-commonjs/components/Toolbar/useToolbarStyles.js.map

@@ -1 +1 @@
-{"version":3,"mappings":";;;;;;AACA;AAGaA,yBAAiB,GAAiC;EAC7DC,IAAI,EAAE;CACP;AAED;;;AAGA,MAAMC,SAAS,gBAAGC,gBAAU;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;EAAA;EAAA;IAAA;EAAA;EAAA;IAAA;EAAA;EAAA;IAAA;EAAA;AAAA;EAAA;AAAA,EAoB1B;AAEF;;;AAGO,MAAMC,yBAAyB,GAAIC,KAAmB,IAAkB;EAC7E,MAAMC,MAAM,GAAGJ,SAAS,EAAE;EAC1B,MAAM;IAAEK,QAAQ;IAAEC;EAAI,CAAE,GAAGH,KAAK;EAChCA,KAAK,CAACJ,IAAI,CAACQ,SAAS,GAAGN,oBAAY,CACjCH,yBAAiB,CAACC,IAAI,EACtBK,MAAM,CAACL,IAAI,EACXM,QAAQ,IAAID,MAAM,CAACC,QAAQ,EAC3BC,IAAI,KAAK,OAAO,IAAI,CAACD,QAAQ,IAAID,MAAM,CAACI,KAAK,EAC7CF,IAAI,KAAK,QAAQ,IAAI,CAACD,QAAQ,IAAID,MAAM,CAACK,MAAM,EAC/CH,IAAI,KAAK,OAAO,IAAI,CAACD,QAAQ,IAAID,MAAM,CAACM,KAAK,EAC7CP,KAAK,CAACJ,IAAI,CAACQ,SAAS,CACrB;EAED,OAAOJ,KAAK;AACd,CAAC;AAdYL,iCAAyB","names":["exports","root","useStyles","react_1","useToolbarStyles_unstable","state","styles","vertical","size","className","small","medium","large"],"sourceRoot":"../src/","sources":["packages/react-components/react-toolbar/src/components/Toolbar/useToolbarStyles.ts"],"sourcesContent":["import { SlotClassNames } from '@fluentui/react-utilities';\nimport { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport type { ToolbarSlots, ToolbarState } from './Toolbar.types';\n\nexport const toolbarClassNames: SlotClassNames<ToolbarSlots> = {\n  root: 'fui-Toolbar',\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n  root: {\n    display: 'flex',\n    alignItems: 'center',\n    ...shorthands.padding('4px', '8px', '4px', '8px'),\n    ...shorthands.gap('8px'),\n  },\n  vertical: {\n    flexDirection: 'column',\n    width: 'fit-content',\n  },\n  small: {\n    height: '32px',\n  },\n  medium: {\n    height: '40px',\n  },\n  large: {\n    height: '48px',\n  },\n});\n\n/**\n * Apply styling to the Toolbar slots based on the state\n */\nexport const useToolbarStyles_unstable = (state: ToolbarState): ToolbarState => {\n  const styles = useStyles();\n  const { vertical, size } = state;\n  state.root.className = mergeClasses(\n    toolbarClassNames.root,\n    styles.root,\n    vertical && styles.vertical,\n    size === 'small' && !vertical && styles.small,\n    size === 'medium' && !vertical && styles.medium,\n    size === 'large' && !vertical && styles.large,\n    state.root.className,\n  );\n\n  return state;\n};\n"]}
+{"version":3,"names":["react_1","require","exports","toolbarClassNames","root","useStyles","__styles","mc9l5x","Bt984gj","z8tnut","z189sj","Byoj8tv","uwmqm3","i8kkvl","Belr9w4","vertical","Beiy3e4","a9b677","small","Bqenvij","medium","large","d","useToolbarStyles_unstable","state","styles","size","className","mergeClasses"],"sources":["../src/packages/react-components/react-toolbar/src/components/Toolbar/useToolbarStyles.ts"],"sourcesContent":["import { SlotClassNames } from '@fluentui/react-utilities';\nimport { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport type { ToolbarSlots, ToolbarState } from './Toolbar.types';\n\nexport const toolbarClassNames: SlotClassNames<ToolbarSlots> = {\n  root: 'fui-Toolbar',\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n  root: {\n    display: 'flex',\n    alignItems: 'center',\n    ...shorthands.padding('4px', '8px', '4px', '8px'),\n    ...shorthands.gap('8px'),\n  },\n  vertical: {\n    flexDirection: 'column',\n    width: 'fit-content',\n  },\n  small: {\n    height: '32px',\n  },\n  medium: {\n    height: '40px',\n  },\n  large: {\n    height: '48px',\n  },\n});\n\n/**\n * Apply styling to the Toolbar slots based on the state\n */\nexport const useToolbarStyles_unstable = (state: ToolbarState): ToolbarState => {\n  const styles = useStyles();\n  const { vertical, size } = state;\n  state.root.className = mergeClasses(\n    toolbarClassNames.root,\n    styles.root,\n    vertical && styles.vertical,\n    size === 'small' && !vertical && styles.small,\n    size === 'medium' && !vertical && styles.medium,\n    size === 'large' && !vertical && styles.large,\n    state.root.className,\n  );\n\n  return state;\n};\n"],"mappings":";;;;;;AACA,MAAAA,OAAA,gBAAAC,OAAA;AAGaC,OAAA,CAAAC,iBAAiB,GAAiC;EAC7DC,IAAI,EAAE;CACP;AAED;;;AAGA,MAAMC,SAAS,gBAAGL,OAAA,CAAAM,QAAU;EAAAF,IAAA;IAAAG,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;EAAA;EAAAC,QAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;EAAAC,KAAA;IAAAC,OAAA;EAAA;EAAAC,MAAA;IAAAD,OAAA;EAAA;EAAAE,KAAA;IAAAF,OAAA;EAAA;AAAA;EAAAG,CAAA;AAAA,EAoB1B;AAEF;;;AAGO,MAAMC,yBAAyB,GAAIC,KAAmB,IAAkB;EAC7E,MAAMC,MAAM,GAAGpB,SAAS,EAAE;EAC1B,MAAM;IAAEU,QAAQ;IAAEW;EAAI,CAAE,GAAGF,KAAK;EAChCA,KAAK,CAACpB,IAAI,CAACuB,SAAS,GAAG3B,OAAA,CAAA4B,YAAY,CACjC1B,OAAA,CAAAC,iBAAiB,CAACC,IAAI,EACtBqB,MAAM,CAACrB,IAAI,EACXW,QAAQ,IAAIU,MAAM,CAACV,QAAQ,EAC3BW,IAAI,KAAK,OAAO,IAAI,CAACX,QAAQ,IAAIU,MAAM,CAACP,KAAK,EAC7CQ,IAAI,KAAK,QAAQ,IAAI,CAACX,QAAQ,IAAIU,MAAM,CAACL,MAAM,EAC/CM,IAAI,KAAK,OAAO,IAAI,CAACX,QAAQ,IAAIU,MAAM,CAACJ,KAAK,EAC7CG,KAAK,CAACpB,IAAI,CAACuB,SAAS,CACrB;EAED,OAAOH,KAAK;AACd,CAAC;AAdYtB,OAAA,CAAAqB,yBAAyB,GAAAA,yBAAA"}

package/lib-commonjs/components/ToolbarButton/ToolbarButton.js

@@ -8,6 +8,7 @@ const React = /*#__PURE__*/require("react");
 const react_button_1 = /*#__PURE__*/require("@fluentui/react-button");
 const useToolbarButtonStyles_1 = /*#__PURE__*/require("./useToolbarButtonStyles");
 const useToolbarButton_1 = /*#__PURE__*/require("./useToolbarButton");
+const react_shared_contexts_1 = /*#__PURE__*/require("@fluentui/react-shared-contexts");
 /**
  * ToolbarButton component is a Button to be used inside Toolbar
  * which will respect toolbar props such as `size`
@@ -15,6 +16,10 @@ const useToolbarButton_1 = /*#__PURE__*/require("./useToolbarButton");
 exports.ToolbarButton = /*#__PURE__*/React.forwardRef((props, ref) => {
   const state = useToolbarButton_1.useToolbarButton_unstable(props, ref);
   useToolbarButtonStyles_1.useToolbarButtonStyles_unstable(state);
+  const {
+    useToolbarButtonStyles_unstable: useCustomStyles
+  } = react_shared_contexts_1.useCustomStyleHooks_unstable();
+  useCustomStyles(state);
   return react_button_1.renderButton_unstable(state);
   // Casting is required due to lack of distributive union to support unions on @types/react
 });

package/lib-commonjs/components/ToolbarButton/ToolbarButton.js.map

@@ -1 +1 @@
-{"version":3,"mappings":";;;;;;AAAA;AAGA;AACA;AACA;AAEA;;;;AAIaA,qBAAa,gBAA4CC,KAAK,CAACC,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EACpG,MAAMC,KAAK,GAAGC,4CAAyB,CAACH,KAAK,EAAEC,GAAG,CAAC;EACnDG,wDAA+B,CAACF,KAAK,CAAC;EAEtC,OAAOG,oCAAqB,CAACH,KAAK,CAAC;EACnC;AACF,CAAC,CAA4C;;AAE7CL,qBAAa,CAACS,WAAW,GAAG,eAAe","names":["exports","React","forwardRef","props","ref","state","useToolbarButton_1","useToolbarButtonStyles_1","react_button_1","displayName"],"sourceRoot":"../src/","sources":["packages/react-components/react-toolbar/src/components/ToolbarButton/ToolbarButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { ToolbarButtonProps } from './ToolbarButton.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { renderButton_unstable } from '@fluentui/react-button';\nimport { useToolbarButtonStyles_unstable } from './useToolbarButtonStyles';\nimport { useToolbarButton_unstable } from './useToolbarButton';\n\n/**\n * ToolbarButton component is a Button to be used inside Toolbar\n * which will respect toolbar props such as `size`\n */\nexport const ToolbarButton: ForwardRefComponent<ToolbarButtonProps> = React.forwardRef((props, ref) => {\n  const state = useToolbarButton_unstable(props, ref);\n  useToolbarButtonStyles_unstable(state);\n\n  return renderButton_unstable(state);\n  // Casting is required due to lack of distributive union to support unions on @types/react\n}) as ForwardRefComponent<ToolbarButtonProps>;\n\nToolbarButton.displayName = 'ToolbarButton';\n"]}
+{"version":3,"names":["React","require","react_button_1","useToolbarButtonStyles_1","useToolbarButton_1","react_shared_contexts_1","exports","ToolbarButton","forwardRef","props","ref","state","useToolbarButton_unstable","useToolbarButtonStyles_unstable","useCustomStyles","useCustomStyleHooks_unstable","renderButton_unstable","displayName"],"sources":["../src/packages/react-components/react-toolbar/src/components/ToolbarButton/ToolbarButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { ToolbarButtonProps } from './ToolbarButton.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { renderButton_unstable } from '@fluentui/react-button';\nimport { useToolbarButtonStyles_unstable } from './useToolbarButtonStyles';\nimport { useToolbarButton_unstable } from './useToolbarButton';\nimport { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * ToolbarButton component is a Button to be used inside Toolbar\n * which will respect toolbar props such as `size`\n */\nexport const ToolbarButton: ForwardRefComponent<ToolbarButtonProps> = React.forwardRef((props, ref) => {\n  const state = useToolbarButton_unstable(props, ref);\n\n  useToolbarButtonStyles_unstable(state);\n\n  const { useToolbarButtonStyles_unstable: useCustomStyles } = useCustomStyleHooks_unstable();\n  useCustomStyles(state);\n\n  return renderButton_unstable(state);\n  // Casting is required due to lack of distributive union to support unions on @types/react\n}) as ForwardRefComponent<ToolbarButtonProps>;\n\nToolbarButton.displayName = 'ToolbarButton';\n"],"mappings":";;;;;;AAAA,MAAAA,KAAA,gBAAAC,OAAA;AAGA,MAAAC,cAAA,gBAAAD,OAAA;AACA,MAAAE,wBAAA,gBAAAF,OAAA;AACA,MAAAG,kBAAA,gBAAAH,OAAA;AACA,MAAAI,uBAAA,gBAAAJ,OAAA;AAEA;;;;AAIaK,OAAA,CAAAC,aAAa,gBAA4CP,KAAK,CAACQ,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EACpG,MAAMC,KAAK,GAAGP,kBAAA,CAAAQ,yBAAyB,CAACH,KAAK,EAAEC,GAAG,CAAC;EAEnDP,wBAAA,CAAAU,+BAA+B,CAACF,KAAK,CAAC;EAEtC,MAAM;IAAEE,+BAA+B,EAAEC;EAAe,CAAE,GAAGT,uBAAA,CAAAU,4BAA4B,EAAE;EAC3FD,eAAe,CAACH,KAAK,CAAC;EAEtB,OAAOT,cAAA,CAAAc,qBAAqB,CAACL,KAAK,CAAC;EACnC;AACF,CAAC,CAA4C;;AAE7CL,OAAA,CAAAC,aAAa,CAACU,WAAW,GAAG,eAAe"}

package/lib-commonjs/components/ToolbarButton/ToolbarButton.types.js.map

@@ -1 +1 @@
-{"version":3,"mappings":"","names":[],"sourceRoot":"../src/","sources":[],"sourcesContent":[]}
+{"version":3,"names":[],"sources":["../src/packages/react-components/react-toolbar/src/components/ToolbarButton/ToolbarButton.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState } from '@fluentui/react-utilities';\nimport { ButtonProps, ButtonSlots, ButtonState } from '@fluentui/react-button';\n\n/**\n * ToolbarButton Props\n */\nexport type ToolbarButtonProps = ComponentProps<ButtonSlots> &\n  Partial<Pick<ButtonProps, 'disabled' | 'disabledFocusable'>> & {\n    appearance?: 'primary' | 'subtle';\n  } & {\n    vertical?: boolean;\n  };\n\n/**\n * State used in rendering ToolbarButton\n */\nexport type ToolbarButtonState = ComponentState<Partial<ButtonSlots>> &\n  ButtonState &\n  Required<Pick<ToolbarButtonProps, 'vertical'>>;\n"],"mappings":""}

package/lib-commonjs/components/ToolbarButton/index.js.map

@@ -1 +1 @@
-{"version":3,"mappings":";;;;;;AAAAA;AACAA;AACAA;AACAA","names":["tslib_1"],"sourceRoot":"../src/","sources":["packages/react-components/react-toolbar/src/components/ToolbarButton/index.ts"],"sourcesContent":["export * from './ToolbarButton';\nexport * from './ToolbarButton.types';\nexport * from './useToolbarButton';\nexport * from './useToolbarButtonStyles';\n"]}
+{"version":3,"names":["tslib_1","__exportStar","require","exports"],"sources":["../src/packages/react-components/react-toolbar/src/components/ToolbarButton/index.ts"],"sourcesContent":["export * from './ToolbarButton';\nexport * from './ToolbarButton.types';\nexport * from './useToolbarButton';\nexport * from './useToolbarButtonStyles';\n"],"mappings":";;;;;;AAAAA,OAAA,CAAAC,YAAA,CAAAC,OAAA,qBAAAC,OAAA;AACAH,OAAA,CAAAC,YAAA,CAAAC,OAAA,2BAAAC,OAAA;AACAH,OAAA,CAAAC,YAAA,CAAAC,OAAA,wBAAAC,OAAA;AACAH,OAAA,CAAAC,YAAA,CAAAC,OAAA,8BAAAC,OAAA"}

package/lib-commonjs/components/ToolbarButton/useToolbarButton.js.map

@@ -1 +1 @@
-{"version":3,"mappings":";;;;;;AACA;AAGA;;;;;;AAMO,MAAMA,yBAAyB,GAAG,CACvCC,KAAyB,EACzBC,GAAqD,KAC/B;EACtB,MAAM;IAAEC,QAAQ,GAAG,KAAK;IAAE,GAAGC;EAAW,CAAE,GAAGH,KAAK;EAClD,MAAMI,KAAK,GAAGC,iCAAkB,CAAC;IAAEC,UAAU,EAAE,QAAQ;IAAE,GAAGH;EAAW,CAAE,EAAEF,GAAG,CAAC;EAC/E,OAAO;IACLC,QAAQ;IACR,GAAGE;GACJ;AACH,CAAC;AAVYG,iCAAyB","names":["useToolbarButton_unstable","props","ref","vertical","buttonProps","state","react_button_1","appearance","exports"],"sourceRoot":"../src/","sources":["packages/react-components/react-toolbar/src/components/ToolbarButton/useToolbarButton.ts"],"sourcesContent":["import * as React from 'react';\nimport { useButton_unstable } from '@fluentui/react-button';\nimport { ToolbarButtonProps, ToolbarButtonState } from './ToolbarButton.types';\n\n/**\n * Given user props, defines default props for the Button, calls useButtonState and useChecked, and returns\n * processed state.\n * @param props - User provided props to the Button component.\n * @param ref - User provided ref to be passed to the Button component.\n */\nexport const useToolbarButton_unstable = (\n  props: ToolbarButtonProps,\n  ref: React.Ref<HTMLButtonElement | HTMLAnchorElement>,\n): ToolbarButtonState => {\n  const { vertical = false, ...buttonProps } = props;\n  const state = useButton_unstable({ appearance: 'subtle', ...buttonProps }, ref);\n  return {\n    vertical,\n    ...state,\n  };\n};\n"]}
+{"version":3,"names":["react_button_1","require","useToolbarButton_unstable","props","ref","vertical","buttonProps","state","useButton_unstable","appearance","exports"],"sources":["../src/packages/react-components/react-toolbar/src/components/ToolbarButton/useToolbarButton.ts"],"sourcesContent":["import * as React from 'react';\nimport { useButton_unstable } from '@fluentui/react-button';\nimport { ToolbarButtonProps, ToolbarButtonState } from './ToolbarButton.types';\n\n/**\n * Given user props, defines default props for the Button, calls useButtonState and useChecked, and returns\n * processed state.\n * @param props - User provided props to the Button component.\n * @param ref - User provided ref to be passed to the Button component.\n */\nexport const useToolbarButton_unstable = (\n  props: ToolbarButtonProps,\n  ref: React.Ref<HTMLButtonElement | HTMLAnchorElement>,\n): ToolbarButtonState => {\n  const { vertical = false, ...buttonProps } = props;\n  const state = useButton_unstable({ appearance: 'subtle', ...buttonProps }, ref);\n  return {\n    vertical,\n    ...state,\n  };\n};\n"],"mappings":";;;;;;AACA,MAAAA,cAAA,gBAAAC,OAAA;AAGA;;;;;;AAMO,MAAMC,yBAAyB,GAAGA,CACvCC,KAAyB,EACzBC,GAAqD,KAC/B;EACtB,MAAM;IAAEC,QAAQ,GAAG,KAAK;IAAE,GAAGC;EAAW,CAAE,GAAGH,KAAK;EAClD,MAAMI,KAAK,GAAGP,cAAA,CAAAQ,kBAAkB,CAAC;IAAEC,UAAU,EAAE,QAAQ;IAAE,GAAGH;EAAW,CAAE,EAAEF,GAAG,CAAC;EAC/E,OAAO;IACLC,QAAQ;IACR,GAAGE;GACJ;AACH,CAAC;AAVYG,OAAA,CAAAR,yBAAyB,GAAAA,yBAAA"}

package/lib-commonjs/components/ToolbarButton/useToolbarButtonStyles.js.map

@@ -1 +1 @@
-{"version":3,"mappings":";;;;;;AAAA;AACA;AAGA,MAAMA,aAAa,gBAAGC,gBAAU;EAAA;IAAA;EAAA;EAAA;IAAA;EAAA;AAAA;EAAA;AAAA,EAO9B;AAEF;;;AAGO,MAAMC,+BAA+B,GAAIC,KAAyB,IAAI;EAC3EC,uCAAwB,CAACD,KAAK,CAAC;EAC/B,MAAME,YAAY,GAAGL,aAAa,EAAE;EAEpCG,KAAK,CAACG,IAAI,CAACC,SAAS,GAAGN,oBAAY,CAACE,KAAK,CAACG,IAAI,CAACC,SAAS,EAAEJ,KAAK,CAACK,QAAQ,IAAIH,YAAY,CAACG,QAAQ,CAAC;EAClG,IAAIL,KAAK,CAACM,IAAI,EAAE;IACdN,KAAK,CAACM,IAAI,CAACF,SAAS,GAAGN,oBAAY,CAACE,KAAK,CAACM,IAAI,CAACF,SAAS,EAAEJ,KAAK,CAACK,QAAQ,IAAIH,YAAY,CAACK,YAAY,CAAC;;AAE1G,CAAC;AARYC,uCAA+B","names":["useBaseStyles","react_1","useToolbarButtonStyles_unstable","state","react_button_1","buttonStyles","root","className","vertical","icon","verticalIcon","exports"],"sourceRoot":"../src/","sources":["packages/react-components/react-toolbar/src/components/ToolbarButton/useToolbarButtonStyles.ts"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport { useButtonStyles_unstable } from '@fluentui/react-button';\nimport { ToolbarButtonState } from './ToolbarButton.types';\n\nconst useBaseStyles = makeStyles({\n  vertical: {\n    flexDirection: 'column',\n  },\n  verticalIcon: {\n    fontSize: '24px',\n  },\n});\n\n/**\n * Apply styling to the ToolbarButton slots based on the state\n */\nexport const useToolbarButtonStyles_unstable = (state: ToolbarButtonState) => {\n  useButtonStyles_unstable(state);\n  const buttonStyles = useBaseStyles();\n\n  state.root.className = mergeClasses(state.root.className, state.vertical && buttonStyles.vertical);\n  if (state.icon) {\n    state.icon.className = mergeClasses(state.icon.className, state.vertical && buttonStyles.verticalIcon);\n  }\n};\n"]}
+{"version":3,"names":["react_1","require","react_button_1","useBaseStyles","__styles","vertical","Beiy3e4","verticalIcon","Be2twd7","d","useToolbarButtonStyles_unstable","state","useButtonStyles_unstable","buttonStyles","root","className","mergeClasses","icon","exports"],"sources":["../src/packages/react-components/react-toolbar/src/components/ToolbarButton/useToolbarButtonStyles.ts"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport { useButtonStyles_unstable } from '@fluentui/react-button';\nimport { ToolbarButtonState } from './ToolbarButton.types';\n\nconst useBaseStyles = makeStyles({\n  vertical: {\n    flexDirection: 'column',\n  },\n  verticalIcon: {\n    fontSize: '24px',\n  },\n});\n\n/**\n * Apply styling to the ToolbarButton slots based on the state\n */\nexport const useToolbarButtonStyles_unstable = (state: ToolbarButtonState) => {\n  useButtonStyles_unstable(state);\n  const buttonStyles = useBaseStyles();\n\n  state.root.className = mergeClasses(state.root.className, state.vertical && buttonStyles.vertical);\n  if (state.icon) {\n    state.icon.className = mergeClasses(state.icon.className, state.vertical && buttonStyles.verticalIcon);\n  }\n};\n"],"mappings":";;;;;;AAAA,MAAAA,OAAA,gBAAAC,OAAA;AACA,MAAAC,cAAA,gBAAAD,OAAA;AAGA,MAAME,aAAa,gBAAGH,OAAA,CAAAI,QAAU;EAAAC,QAAA;IAAAC,OAAA;EAAA;EAAAC,YAAA;IAAAC,OAAA;EAAA;AAAA;EAAAC,CAAA;AAAA,EAO9B;AAEF;;;AAGO,MAAMC,+BAA+B,GAAIC,KAAyB,IAAI;EAC3ET,cAAA,CAAAU,wBAAwB,CAACD,KAAK,CAAC;EAC/B,MAAME,YAAY,GAAGV,aAAa,EAAE;EAEpCQ,KAAK,CAACG,IAAI,CAACC,SAAS,GAAGf,OAAA,CAAAgB,YAAY,CAACL,KAAK,CAACG,IAAI,CAACC,SAAS,EAAEJ,KAAK,CAACN,QAAQ,IAAIQ,YAAY,CAACR,QAAQ,CAAC;EAClG,IAAIM,KAAK,CAACM,IAAI,EAAE;IACdN,KAAK,CAACM,IAAI,CAACF,SAAS,GAAGf,OAAA,CAAAgB,YAAY,CAACL,KAAK,CAACM,IAAI,CAACF,SAAS,EAAEJ,KAAK,CAACN,QAAQ,IAAIQ,YAAY,CAACN,YAAY,CAAC;;AAE1G,CAAC;AARYW,OAAA,CAAAR,+BAA+B,GAAAA,+BAAA"}

package/lib-commonjs/components/ToolbarDivider/ToolbarDivider.js

@@ -8,12 +8,17 @@ const React = /*#__PURE__*/require("react");
 const useToolbarDividerStyles_1 = /*#__PURE__*/require("./useToolbarDividerStyles");
 const react_divider_1 = /*#__PURE__*/require("@fluentui/react-divider");
 const useToolbarDivider_1 = /*#__PURE__*/require("./useToolbarDivider");
+const react_shared_contexts_1 = /*#__PURE__*/require("@fluentui/react-shared-contexts");
 /**
  * ToolbarDivider component
  */
 exports.ToolbarDivider = /*#__PURE__*/React.forwardRef((props, ref) => {
   const state = useToolbarDivider_1.useToolbarDivider_unstable(props, ref);
   useToolbarDividerStyles_1.useToolbarDividerStyles_unstable(state);
+  const {
+    useToolbarDividerStyles_unstable: useCustomStyles
+  } = react_shared_contexts_1.useCustomStyleHooks_unstable();
+  useCustomStyles(state);
   return react_divider_1.renderDivider_unstable(state);
 });
 exports.ToolbarDivider.displayName = 'ToolbarDivider';

package/lib-commonjs/components/ToolbarDivider/ToolbarDivider.js.map

@@ -1 +1 @@
-{"version":3,"mappings":";;;;;;AAAA;AACA;AAGA;AACA;AAEA;;;AAGaA,sBAAc,gBAA6CC,KAAK,CAACC,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EACtG,MAAMC,KAAK,GAAGC,8CAA0B,CAACH,KAAK,EAAEC,GAAG,CAAC;EACpDG,0DAAgC,CAACF,KAAK,CAAC;EACvC,OAAOG,sCAAsB,CAACH,KAAK,CAAC;AACtC,CAAC,CAAC;AAEFL,sBAAc,CAACS,WAAW,GAAG,gBAAgB","names":["exports","React","forwardRef","props","ref","state","useToolbarDivider_1","useToolbarDividerStyles_1","react_divider_1","displayName"],"sourceRoot":"../src/","sources":["packages/react-components/react-toolbar/src/components/ToolbarDivider/ToolbarDivider.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useToolbarDividerStyles_unstable } from './useToolbarDividerStyles';\nimport type { ToolbarDividerProps } from './ToolbarDivider.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { renderDivider_unstable } from '@fluentui/react-divider';\nimport { useToolbarDivider_unstable } from './useToolbarDivider';\n\n/**\n * ToolbarDivider component\n */\nexport const ToolbarDivider: ForwardRefComponent<ToolbarDividerProps> = React.forwardRef((props, ref) => {\n  const state = useToolbarDivider_unstable(props, ref);\n  useToolbarDividerStyles_unstable(state);\n  return renderDivider_unstable(state);\n});\n\nToolbarDivider.displayName = 'ToolbarDivider';\n"]}
+{"version":3,"names":["React","require","useToolbarDividerStyles_1","react_divider_1","useToolbarDivider_1","react_shared_contexts_1","exports","ToolbarDivider","forwardRef","props","ref","state","useToolbarDivider_unstable","useToolbarDividerStyles_unstable","useCustomStyles","useCustomStyleHooks_unstable","renderDivider_unstable","displayName"],"sources":["../src/packages/react-components/react-toolbar/src/components/ToolbarDivider/ToolbarDivider.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useToolbarDividerStyles_unstable } from './useToolbarDividerStyles';\nimport type { ToolbarDividerProps } from './ToolbarDivider.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { renderDivider_unstable } from '@fluentui/react-divider';\nimport { useToolbarDivider_unstable } from './useToolbarDivider';\nimport { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * ToolbarDivider component\n */\nexport const ToolbarDivider: ForwardRefComponent<ToolbarDividerProps> = React.forwardRef((props, ref) => {\n  const state = useToolbarDivider_unstable(props, ref);\n\n  useToolbarDividerStyles_unstable(state);\n\n  const { useToolbarDividerStyles_unstable: useCustomStyles } = useCustomStyleHooks_unstable();\n  useCustomStyles(state);\n\n  return renderDivider_unstable(state);\n});\n\nToolbarDivider.displayName = 'ToolbarDivider';\n"],"mappings":";;;;;;AAAA,MAAAA,KAAA,gBAAAC,OAAA;AACA,MAAAC,yBAAA,gBAAAD,OAAA;AAGA,MAAAE,eAAA,gBAAAF,OAAA;AACA,MAAAG,mBAAA,gBAAAH,OAAA;AACA,MAAAI,uBAAA,gBAAAJ,OAAA;AAEA;;;AAGaK,OAAA,CAAAC,cAAc,gBAA6CP,KAAK,CAACQ,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EACtG,MAAMC,KAAK,GAAGP,mBAAA,CAAAQ,0BAA0B,CAACH,KAAK,EAAEC,GAAG,CAAC;EAEpDR,yBAAA,CAAAW,gCAAgC,CAACF,KAAK,CAAC;EAEvC,MAAM;IAAEE,gCAAgC,EAAEC;EAAe,CAAE,GAAGT,uBAAA,CAAAU,4BAA4B,EAAE;EAC5FD,eAAe,CAACH,KAAK,CAAC;EAEtB,OAAOR,eAAA,CAAAa,sBAAsB,CAACL,KAAK,CAAC;AACtC,CAAC,CAAC;AAEFL,OAAA,CAAAC,cAAc,CAACU,WAAW,GAAG,gBAAgB"}

package/lib-commonjs/components/ToolbarDivider/ToolbarDivider.types.js.map

@@ -1 +1 @@
-{"version":3,"mappings":"","names":[],"sourceRoot":"../src/","sources":[],"sourcesContent":[]}
+{"version":3,"names":[],"sources":["../src/packages/react-components/react-toolbar/src/components/ToolbarDivider/ToolbarDivider.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState } from '@fluentui/react-utilities';\nimport { DividerSlots, DividerState } from '@fluentui/react-divider';\n\n/**\n * ToolbarDivider Props\n */\nexport type ToolbarDividerProps = ComponentProps<Partial<DividerSlots>> & {\n  /**\n   * A divider can be horizontal or vertical (default).\n   *\n   * @default true\n   */\n  vertical?: boolean;\n};\n\n/**\n * State used in rendering ToolbarDivider\n */\nexport type ToolbarDividerState = ComponentState<Partial<DividerSlots>> & DividerState;\n"],"mappings":""}

package/lib-commonjs/components/ToolbarDivider/index.js.map

@@ -1 +1 @@
-{"version":3,"mappings":";;;;;;AAAAA;AACAA;AACAA;AACAA","names":["tslib_1"],"sourceRoot":"../src/","sources":["packages/react-components/react-toolbar/src/components/ToolbarDivider/index.ts"],"sourcesContent":["export * from './ToolbarDivider';\nexport * from './ToolbarDivider.types';\nexport * from './useToolbarDividerStyles';\nexport * from './useToolbarDivider';\n"]}
+{"version":3,"names":["tslib_1","__exportStar","require","exports"],"sources":["../src/packages/react-components/react-toolbar/src/components/ToolbarDivider/index.ts"],"sourcesContent":["export * from './ToolbarDivider';\nexport * from './ToolbarDivider.types';\nexport * from './useToolbarDividerStyles';\nexport * from './useToolbarDivider';\n"],"mappings":";;;;;;AAAAA,OAAA,CAAAC,YAAA,CAAAC,OAAA,sBAAAC,OAAA;AACAH,OAAA,CAAAC,YAAA,CAAAC,OAAA,4BAAAC,OAAA;AACAH,OAAA,CAAAC,YAAA,CAAAC,OAAA,+BAAAC,OAAA;AACAH,OAAA,CAAAC,YAAA,CAAAC,OAAA,yBAAAC,OAAA"}

package/lib-commonjs/components/ToolbarDivider/useToolbarDivider.js.map

@@ -1 +1 @@
-{"version":3,"mappings":";;;;;;AAEA;AACA;AAEA;;;;;;;;;AASO,MAAMA,0BAA0B,GAAG,CACxCC,KAA0B,EAC1BC,GAA2B,KACJ;EACvB,MAAMC,QAAQ,GAAGC,2CAA0B,CAACC,GAAG,IAAIA,GAAG,CAACF,QAAQ,CAAC;EAChE,OAAOG,mCAAmB,CAAC;IAAEH,QAAQ,EAAE,CAACA,QAAQ;IAAE,GAAGF;EAAK,CAAE,EAAEC,GAAG,CAAC;AACpE,CAAC;AANYK,kCAA0B","names":["useToolbarDivider_unstable","props","ref","vertical","ToolbarContext_1","ctx","react_divider_1","exports"],"sourceRoot":"../src/","sources":["packages/react-components/react-toolbar/src/components/ToolbarDivider/useToolbarDivider.ts"],"sourcesContent":["import * as React from 'react';\nimport { ToolbarDividerProps, ToolbarDividerState } from './ToolbarDivider.types';\nimport { useDivider_unstable } from '@fluentui/react-divider';\nimport { useToolbarContext_unstable } from '../Toolbar/ToolbarContext';\n\n/**\n * Create the state required to render ToolbarDivider.\n *\n * The returned state can be modified with hooks such as useToolbarDividerStyles_unstable,\n * before being passed to renderToolbar_unstable.\n *\n * @param props - props from this instance of ToolbarDivider\n * @param ref - reference to root HTMLElement of ToolbarDivider\n */\nexport const useToolbarDivider_unstable = (\n  props: ToolbarDividerProps,\n  ref: React.Ref<HTMLElement>,\n): ToolbarDividerState => {\n  const vertical = useToolbarContext_unstable(ctx => ctx.vertical);\n  return useDivider_unstable({ vertical: !vertical, ...props }, ref);\n};\n"]}
+{"version":3,"names":["react_divider_1","require","ToolbarContext_1","useToolbarDivider_unstable","props","ref","vertical","useToolbarContext_unstable","ctx","useDivider_unstable","exports"],"sources":["../src/packages/react-components/react-toolbar/src/components/ToolbarDivider/useToolbarDivider.ts"],"sourcesContent":["import * as React from 'react';\nimport { ToolbarDividerProps, ToolbarDividerState } from './ToolbarDivider.types';\nimport { useDivider_unstable } from '@fluentui/react-divider';\nimport { useToolbarContext_unstable } from '../Toolbar/ToolbarContext';\n\n/**\n * Create the state required to render ToolbarDivider.\n *\n * The returned state can be modified with hooks such as useToolbarDividerStyles_unstable,\n * before being passed to renderToolbar_unstable.\n *\n * @param props - props from this instance of ToolbarDivider\n * @param ref - reference to root HTMLElement of ToolbarDivider\n */\nexport const useToolbarDivider_unstable = (\n  props: ToolbarDividerProps,\n  ref: React.Ref<HTMLElement>,\n): ToolbarDividerState => {\n  const vertical = useToolbarContext_unstable(ctx => ctx.vertical);\n  return useDivider_unstable({ vertical: !vertical, ...props }, ref);\n};\n"],"mappings":";;;;;;AAEA,MAAAA,eAAA,gBAAAC,OAAA;AACA,MAAAC,gBAAA,gBAAAD,OAAA;AAEA;;;;;;;;;AASO,MAAME,0BAA0B,GAAGA,CACxCC,KAA0B,EAC1BC,GAA2B,KACJ;EACvB,MAAMC,QAAQ,GAAGJ,gBAAA,CAAAK,0BAA0B,CAACC,GAAG,IAAIA,GAAG,CAACF,QAAQ,CAAC;EAChE,OAAON,eAAA,CAAAS,mBAAmB,CAAC;IAAEH,QAAQ,EAAE,CAACA,QAAQ;IAAE,GAAGF;EAAK,CAAE,EAAEC,GAAG,CAAC;AACpE,CAAC;AANYK,OAAA,CAAAP,0BAA0B,GAAAA,0BAAA"}

package/lib-commonjs/components/ToolbarDivider/useToolbarDividerStyles.js.map

@@ -1 +1 @@
-{"version":3,"mappings":";;;;;;AAAA;AACA;AAGA,MAAMA,aAAa,gBAAGC,gBAAU;EAAA;IAAA;IAAA;EAAA;EAAA;IAAA;EAAA;AAAA;EAAA;AAAA,EAS9B;AAEF;;;AAGO,MAAMC,gCAAgC,GAAIC,KAA0B,IAAyB;EAClGC,yCAAyB,CAACD,KAAK,CAAC;EAChC,MAAM;IAAEE;EAAQ,CAAE,GAAGF,KAAK;EAC1B,MAAMG,oBAAoB,GAAGN,aAAa,EAAE;EAC5CG,KAAK,CAACI,IAAI,CAACC,SAAS,GAAGP,oBAAY,CACjCE,KAAK,CAACI,IAAI,CAACC,SAAS,EACpBF,oBAAoB,CAACC,IAAI,EACzB,CAACF,QAAQ,IAAIC,oBAAoB,CAACD,QAAQ,CAC3C;EACD,OAAOF,KAAK;AACd,CAAC;AAVYM,wCAAgC","names":["useBaseStyles","react_1","useToolbarDividerStyles_unstable","state","react_divider_1","vertical","toolbarDividerStyles","root","className","exports"],"sourceRoot":"../src/","sources":["packages/react-components/react-toolbar/src/components/ToolbarDivider/useToolbarDividerStyles.ts"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport { useDividerStyles_unstable } from '@fluentui/react-divider';\nimport type { ToolbarDividerState } from './ToolbarDivider.types';\n\nconst useBaseStyles = makeStyles({\n  // Base styles\n  root: {\n    display: 'inline-flex',\n    maxWidth: '1px',\n  },\n  vertical: {\n    maxWidth: 'initial',\n  },\n});\n\n/**\n * Apply styling to the ToolbarDivider slots based on the state\n */\nexport const useToolbarDividerStyles_unstable = (state: ToolbarDividerState): ToolbarDividerState => {\n  useDividerStyles_unstable(state);\n  const { vertical } = state;\n  const toolbarDividerStyles = useBaseStyles();\n  state.root.className = mergeClasses(\n    state.root.className,\n    toolbarDividerStyles.root,\n    !vertical && toolbarDividerStyles.vertical,\n  );\n  return state;\n};\n"]}
+{"version":3,"names":["react_1","require","react_divider_1","useBaseStyles","__styles","root","mc9l5x","B2u0y6b","vertical","d","useToolbarDividerStyles_unstable","state","useDividerStyles_unstable","toolbarDividerStyles","className","mergeClasses","exports"],"sources":["../src/packages/react-components/react-toolbar/src/components/ToolbarDivider/useToolbarDividerStyles.ts"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport { useDividerStyles_unstable } from '@fluentui/react-divider';\nimport type { ToolbarDividerState } from './ToolbarDivider.types';\n\nconst useBaseStyles = makeStyles({\n  // Base styles\n  root: {\n    display: 'inline-flex',\n    maxWidth: '1px',\n  },\n  vertical: {\n    maxWidth: 'initial',\n  },\n});\n\n/**\n * Apply styling to the ToolbarDivider slots based on the state\n */\nexport const useToolbarDividerStyles_unstable = (state: ToolbarDividerState): ToolbarDividerState => {\n  useDividerStyles_unstable(state);\n  const { vertical } = state;\n  const toolbarDividerStyles = useBaseStyles();\n  state.root.className = mergeClasses(\n    state.root.className,\n    toolbarDividerStyles.root,\n    !vertical && toolbarDividerStyles.vertical,\n  );\n  return state;\n};\n"],"mappings":";;;;;;AAAA,MAAAA,OAAA,gBAAAC,OAAA;AACA,MAAAC,eAAA,gBAAAD,OAAA;AAGA,MAAME,aAAa,gBAAGH,OAAA,CAAAI,QAAU;EAAAC,IAAA;IAAAC,MAAA;IAAAC,OAAA;EAAA;EAAAC,QAAA;IAAAD,OAAA;EAAA;AAAA;EAAAE,CAAA;AAAA,EAS9B;AAEF;;;AAGO,MAAMC,gCAAgC,GAAIC,KAA0B,IAAyB;EAClGT,eAAA,CAAAU,yBAAyB,CAACD,KAAK,CAAC;EAChC,MAAM;IAAEH;EAAQ,CAAE,GAAGG,KAAK;EAC1B,MAAME,oBAAoB,GAAGV,aAAa,EAAE;EAC5CQ,KAAK,CAACN,IAAI,CAACS,SAAS,GAAGd,OAAA,CAAAe,YAAY,CACjCJ,KAAK,CAACN,IAAI,CAACS,SAAS,EACpBD,oBAAoB,CAACR,IAAI,EACzB,CAACG,QAAQ,IAAIK,oBAAoB,CAACL,QAAQ,CAC3C;EACD,OAAOG,KAAK;AACd,CAAC;AAVYK,OAAA,CAAAN,gCAAgC,GAAAA,gCAAA"}

package/lib-commonjs/components/ToolbarGroup/ToolbarGroup.js

@@ -8,6 +8,7 @@ const React = /*#__PURE__*/require("react");
 const useToolbarGroup_1 = /*#__PURE__*/require("./useToolbarGroup");
 const useToolbarGroupStyles_1 = /*#__PURE__*/require("./useToolbarGroupStyles");
 const renderToolbarGroup_1 = /*#__PURE__*/require("./renderToolbarGroup");
+const react_shared_contexts_1 = /*#__PURE__*/require("@fluentui/react-shared-contexts");
 /**
  * ToolbarGroup component is a Button to be used inside Toolbar
  * which will respect toolbar props such as `size`
@@ -15,6 +16,10 @@ const renderToolbarGroup_1 = /*#__PURE__*/require("./renderToolbarGroup");
 exports.ToolbarGroup = /*#__PURE__*/React.forwardRef((props, ref) => {
   const state = useToolbarGroup_1.useToolbarGroup_unstable(props, ref);
   useToolbarGroupStyles_1.useToolbarGroupStyles_unstable(state);
+  const {
+    useToolbarGroupStyles_unstable: useCustomStyles
+  } = react_shared_contexts_1.useCustomStyleHooks_unstable();
+  useCustomStyles(state);
   return renderToolbarGroup_1.renderToolbarGroup_unstable(state);
   // Casting is required due to lack of distributive union to support unions on @types/react
 });

package/lib-commonjs/components/ToolbarGroup/ToolbarGroup.js.map

@@ -1 +1 @@
-{"version":3,"mappings":";;;;;;AAAA;AAGA;AACA;AACA;AAEA;;;;AAIaA,oBAAY,gBAA2CC,KAAK,CAACC,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EAClG,MAAMC,KAAK,GAAGC,0CAAwB,CAACH,KAAK,EAAEC,GAAG,CAAC;EAClDG,sDAA8B,CAACF,KAAK,CAAC;EACrC,OAAOG,gDAA2B,CAACH,KAAK,CAAC;EACzC;AACF,CAAC,CAA2C;;AAE5CL,oBAAY,CAACS,WAAW,GAAG,cAAc","names":["exports","React","forwardRef","props","ref","state","useToolbarGroup_1","useToolbarGroupStyles_1","renderToolbarGroup_1","displayName"],"sourceRoot":"../src/","sources":["packages/react-components/react-toolbar/src/components/ToolbarGroup/ToolbarGroup.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { ToolbarGroupProps } from './ToolbarGroup.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useToolbarGroup_unstable } from './useToolbarGroup';\nimport { useToolbarGroupStyles_unstable } from './useToolbarGroupStyles';\nimport { renderToolbarGroup_unstable } from './renderToolbarGroup';\n\n/**\n * ToolbarGroup component is a Button to be used inside Toolbar\n * which will respect toolbar props such as `size`\n */\nexport const ToolbarGroup: ForwardRefComponent<ToolbarGroupProps> = React.forwardRef((props, ref) => {\n  const state = useToolbarGroup_unstable(props, ref);\n  useToolbarGroupStyles_unstable(state);\n  return renderToolbarGroup_unstable(state);\n  // Casting is required due to lack of distributive union to support unions on @types/react\n}) as ForwardRefComponent<ToolbarGroupProps>;\n\nToolbarGroup.displayName = 'ToolbarGroup';\n"]}
+{"version":3,"names":["React","require","useToolbarGroup_1","useToolbarGroupStyles_1","renderToolbarGroup_1","react_shared_contexts_1","exports","ToolbarGroup","forwardRef","props","ref","state","useToolbarGroup_unstable","useToolbarGroupStyles_unstable","useCustomStyles","useCustomStyleHooks_unstable","renderToolbarGroup_unstable","displayName"],"sources":["../src/packages/react-components/react-toolbar/src/components/ToolbarGroup/ToolbarGroup.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { ToolbarGroupProps } from './ToolbarGroup.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useToolbarGroup_unstable } from './useToolbarGroup';\nimport { useToolbarGroupStyles_unstable } from './useToolbarGroupStyles';\nimport { renderToolbarGroup_unstable } from './renderToolbarGroup';\nimport { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * ToolbarGroup component is a Button to be used inside Toolbar\n * which will respect toolbar props such as `size`\n */\nexport const ToolbarGroup: ForwardRefComponent<ToolbarGroupProps> = React.forwardRef((props, ref) => {\n  const state = useToolbarGroup_unstable(props, ref);\n\n  useToolbarGroupStyles_unstable(state);\n\n  const { useToolbarGroupStyles_unstable: useCustomStyles } = useCustomStyleHooks_unstable();\n  useCustomStyles(state);\n\n  return renderToolbarGroup_unstable(state);\n  // Casting is required due to lack of distributive union to support unions on @types/react\n}) as ForwardRefComponent<ToolbarGroupProps>;\n\nToolbarGroup.displayName = 'ToolbarGroup';\n"],"mappings":";;;;;;AAAA,MAAAA,KAAA,gBAAAC,OAAA;AAGA,MAAAC,iBAAA,gBAAAD,OAAA;AACA,MAAAE,uBAAA,gBAAAF,OAAA;AACA,MAAAG,oBAAA,gBAAAH,OAAA;AACA,MAAAI,uBAAA,gBAAAJ,OAAA;AAEA;;;;AAIaK,OAAA,CAAAC,YAAY,gBAA2CP,KAAK,CAACQ,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EAClG,MAAMC,KAAK,GAAGT,iBAAA,CAAAU,wBAAwB,CAACH,KAAK,EAAEC,GAAG,CAAC;EAElDP,uBAAA,CAAAU,8BAA8B,CAACF,KAAK,CAAC;EAErC,MAAM;IAAEE,8BAA8B,EAAEC;EAAe,CAAE,GAAGT,uBAAA,CAAAU,4BAA4B,EAAE;EAC1FD,eAAe,CAACH,KAAK,CAAC;EAEtB,OAAOP,oBAAA,CAAAY,2BAA2B,CAACL,KAAK,CAAC;EACzC;AACF,CAAC,CAA2C;;AAE5CL,OAAA,CAAAC,YAAY,CAACU,WAAW,GAAG,cAAc"}

package/lib-commonjs/components/ToolbarGroup/ToolbarGroup.types.js.map

@@ -1 +1 @@
-{"version":3,"mappings":"","names":[],"sourceRoot":"../src/","sources":[],"sourcesContent":[]}
+{"version":3,"names":[],"sources":["../src/packages/react-components/react-toolbar/src/components/ToolbarGroup/ToolbarGroup.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type ToolbarGroupSlots = {\n  root: Slot<'div'>;\n};\n\n/**\n * ToolbarButton Props\n */\nexport type ToolbarGroupProps = ComponentProps<ToolbarGroupSlots>;\n\n/**\n * State used in rendering ToolbarButton\n */\nexport type ToolbarGroupState = ComponentState<ToolbarGroupSlots>;\n"],"mappings":""}