npm - @fluentui/react-button - Versions diffs - 9.1.12 → 9.1.13 - Mend

@fluentui/react-button 9.1.12 → 9.1.13

Files changed (115) hide show

package/lib/components/ToggleButton/useToggleButtonStyles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["packages/react-components/react-button/src/components/ToggleButton/useToggleButtonStyles.ts"],"names":[],"mappings":"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","sourcesContent":["import { iconFilledClassName, iconRegularClassName } from '@fluentui/react-icons';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nimport { tokens } from '@fluentui/react-theme';\nimport { shorthands, mergeClasses, makeStyles } from '@griffel/react';\nimport { useButtonStyles_unstable } from '../Button/useButtonStyles';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { ButtonSlots } from '../Button/Button.types';\nimport type { ToggleButtonState } from './ToggleButton.types';\n\nexport const toggleButtonClassNames: SlotClassNames<ButtonSlots> = {\n root: 'fui-ToggleButton',\n icon: 'fui-ToggleButton__icon',\n};\n\nconst useRootCheckedStyles = makeStyles({\n // Base styles\n base: {\n backgroundColor: tokens.colorNeutralBackground1Selected,\n ...shorthands.borderColor(tokens.colorNeutralStroke1),\n color: tokens.colorNeutralForeground1Selected,\n\n ...shorthands.borderWidth(tokens.strokeWidthThin),\n\n [`& .${iconFilledClassName}`]: {\n display: 'inline',\n },\n [`& .${iconRegularClassName}`]: {\n display: 'none',\n },\n\n ':hover': {\n backgroundColor: tokens.colorNeutralBackground1Hover,\n ...shorthands.borderColor(tokens.colorNeutralStroke1Hover),\n color: tokens.colorNeutralForeground1Hover,\n },\n\n ':hover:active': {\n backgroundColor: tokens.colorNeutralBackground1Pressed,\n ...shorthands.borderColor(tokens.colorNeutralStroke1Pressed),\n color: tokens.colorNeutralForeground1Pressed,\n },\n },\n\n // High contrast styles\n highContrast: {\n '@media (forced-colors: active)': {\n backgroundColor: 'Highlight',\n ...shorthands.borderColor('Highlight'),\n color: 'HighlightText',\n forcedColorAdjust: 'none',\n\n ':hover': {\n backgroundColor: 'HighlightText',\n ...shorthands.borderColor('Highlight'),\n color: 'Highlight',\n },\n\n ':hover:active': {\n backgroundColor: 'HighlightText',\n ...shorthands.borderColor('Highlight'),\n color: 'Highlight',\n },\n\n ':focus': {\n ...shorthands.borderColor('Highlight'),\n },\n },\n },\n highContrastFocusStyles: createCustomFocusIndicatorStyle({\n ...shorthands.border('1px', 'solid', 'HighlightText'),\n outlineColor: 'Highlight',\n }),\n\n // Appearance variations\n outline: {\n backgroundColor: tokens.colorTransparentBackgroundSelected,\n ...shorthands.borderColor(tokens.colorNeutralStroke1),\n ...shorthands.borderWidth(tokens.strokeWidthThicker),\n\n ':hover': {\n backgroundColor: tokens.colorTransparentBackgroundHover,\n },\n\n ':hover:active': {\n backgroundColor: tokens.colorTransparentBackgroundPressed,\n },\n\n ...createCustomFocusIndicatorStyle({\n ...shorthands.borderColor(tokens.colorNeutralStroke1),\n }),\n },\n primary: {\n backgroundColor: tokens.colorBrandBackgroundSelected,\n ...shorthands.borderColor('transparent'),\n color: tokens.colorNeutralForegroundOnBrand,\n\n ':hover': {\n backgroundColor: tokens.colorBrandBackgroundHover,\n ...shorthands.borderColor('transparent'),\n color: tokens.colorNeutralForegroundOnBrand,\n },\n\n ':hover:active': {\n backgroundColor: tokens.colorBrandBackgroundPressed,\n ...shorthands.borderColor('transparent'),\n color: tokens.colorNeutralForegroundOnBrand,\n },\n },\n secondary: {\n /* The secondary styles are exactly the same as the base styles. /\n },\n subtle: {\n backgroundColor: tokens.colorSubtleBackgroundSelected,\n ...shorthands.borderColor('transparent'),\n color: tokens.colorNeutralForeground2Selected,\n\n ':hover': {\n backgroundColor: tokens.colorSubtleBackgroundHover,\n ...shorthands.borderColor('transparent'),\n color: tokens.colorNeutralForeground2Hover,\n },\n\n ':hover:active': {\n backgroundColor: tokens.colorSubtleBackgroundPressed,\n ...shorthands.borderColor('transparent'),\n color: tokens.colorNeutralForeground2Pressed,\n },\n },\n transparent: {\n backgroundColor: tokens.colorTransparentBackgroundSelected,\n ...shorthands.borderColor('transparent'),\n color: tokens.colorNeutralForeground2BrandSelected,\n\n ':hover': {\n backgroundColor: tokens.colorTransparentBackgroundHover,\n ...shorthands.borderColor('transparent'),\n color: tokens.colorNeutralForeground2BrandHover,\n },\n\n ':hover:active': {\n backgroundColor: tokens.colorTransparentBackgroundPressed,\n ...shorthands.borderColor('transparent'),\n color: tokens.colorNeutralForeground2BrandPressed,\n },\n },\n});\n\nconst useRootDisabledStyles = makeStyles({\n // Base styles\n base: {\n backgroundColor: tokens.colorNeutralBackgroundDisabled,\n ...shorthands.borderColor(tokens.colorNeutralStrokeDisabled),\n color: tokens.colorNeutralForegroundDisabled,\n\n ':hover': {\n backgroundColor: tokens.colorNeutralBackgroundDisabled,\n ...shorthands.borderColor(tokens.colorNeutralStrokeDisabled),\n color: tokens.colorNeutralForegroundDisabled,\n },\n\n ':hover:active': {\n backgroundColor: tokens.colorNeutralBackgroundDisabled,\n ...shorthands.borderColor(tokens.colorNeutralStrokeDisabled),\n color: tokens.colorNeutralForegroundDisabled,\n },\n },\n\n // Appearance variations\n outline: {\n / No styles /\n },\n primary: {\n ...shorthands.borderColor('transparent'),\n\n ':hover': {\n ...shorthands.borderColor('transparent'),\n },\n\n ':hover:active': {\n ...shorthands.borderColor('transparent'),\n },\n },\n secondary: {\n / The secondary styles are exactly the same as the base styles. */\n },\n subtle: {\n backgroundColor: tokens.colorTransparentBackground,\n ...shorthands.borderColor('transparent'),\n\n ':hover': {\n backgroundColor: tokens.colorTransparentBackgroundHover,\n ...shorthands.borderColor('transparent'),\n },\n\n ':hover:active': {\n backgroundColor: tokens.colorTransparentBackgroundPressed,\n ...shorthands.borderColor('transparent'),\n },\n },\n transparent: {\n backgroundColor: tokens.colorTransparentBackground,\n ...shorthands.borderColor('transparent'),\n\n ':hover': {\n backgroundColor: tokens.colorTransparentBackgroundHover,\n ...shorthands.borderColor('transparent'),\n },\n\n ':hover:active': {\n backgroundColor: tokens.colorTransparentBackgroundPressed,\n ...shorthands.borderColor('transparent'),\n },\n },\n});\n\nconst useIconCheckedStyles = makeStyles({\n // Appearance variations\n subtleOrTransparent: {\n color: tokens.colorNeutralForeground2BrandSelected,\n },\n});\n\nexport const useToggleButtonStyles_unstable = (state: ToggleButtonState): ToggleButtonState => {\n const rootCheckedStyles = useRootCheckedStyles();\n const rootDisabledStyles = useRootDisabledStyles();\n const iconCheckedStyles = useIconCheckedStyles();\n\n const { appearance, checked, disabled, disabledFocusable } = state;\n\n state.root.className = mergeClasses(\n toggleButtonClassNames.root,\n\n // Checked styles\n checked && rootCheckedStyles.base,\n checked && rootCheckedStyles.highContrast,\n appearance && checked && rootCheckedStyles[appearance],\n\n // Disabled styles\n (disabled \|\| disabledFocusable) && rootDisabledStyles.base,\n appearance && (disabled \|\| disabledFocusable) && rootDisabledStyles[appearance],\n\n // User provided class name\n state.root.className,\n );\n\n if (state.icon) {\n state.icon.className = mergeClasses(\n toggleButtonClassNames.icon,\n (appearance === 'subtle' \|\| appearance === 'transparent') && iconCheckedStyles.subtleOrTransparent,\n state.icon.className,\n );\n }\n\n useButtonStyles_unstable(state);\n\n return state;\n};\n"],"sourceRoot":"../src/"}
1	+ {"version":3,"mappings":"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","names":["iconFilledClassName","iconRegularClassName","createCustomFocusIndicatorStyle","tokens","shorthands","mergeClasses","useButtonStyles_unstable","toggleButtonClassNames","root","icon","useRootCheckedStyles","useRootDisabledStyles","useIconCheckedStyles","useToggleButtonStyles_unstable","state","rootCheckedStyles","rootDisabledStyles","iconCheckedStyles","appearance","checked","disabled","disabledFocusable","className","base","highContrast","subtleOrTransparent"],"sourceRoot":"../src/","sources":["packages/react-components/react-button/src/components/ToggleButton/useToggleButtonStyles.ts"],"sourcesContent":["import { iconFilledClassName, iconRegularClassName } from '@fluentui/react-icons';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nimport { tokens } from '@fluentui/react-theme';\nimport { shorthands, mergeClasses, makeStyles } from '@griffel/react';\nimport { useButtonStyles_unstable } from '../Button/useButtonStyles';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { ButtonSlots } from '../Button/Button.types';\nimport type { ToggleButtonState } from './ToggleButton.types';\n\nexport const toggleButtonClassNames: SlotClassNames<ButtonSlots> = {\n root: 'fui-ToggleButton',\n icon: 'fui-ToggleButton__icon',\n};\n\nconst useRootCheckedStyles = makeStyles({\n // Base styles\n base: {\n backgroundColor: tokens.colorNeutralBackground1Selected,\n ...shorthands.borderColor(tokens.colorNeutralStroke1),\n color: tokens.colorNeutralForeground1Selected,\n\n ...shorthands.borderWidth(tokens.strokeWidthThin),\n\n [`& .${iconFilledClassName}`]: {\n display: 'inline',\n },\n [`& .${iconRegularClassName}`]: {\n display: 'none',\n },\n\n ':hover': {\n backgroundColor: tokens.colorNeutralBackground1Hover,\n ...shorthands.borderColor(tokens.colorNeutralStroke1Hover),\n color: tokens.colorNeutralForeground1Hover,\n },\n\n ':hover:active': {\n backgroundColor: tokens.colorNeutralBackground1Pressed,\n ...shorthands.borderColor(tokens.colorNeutralStroke1Pressed),\n color: tokens.colorNeutralForeground1Pressed,\n },\n },\n\n // High contrast styles\n highContrast: {\n '@media (forced-colors: active)': {\n backgroundColor: 'Highlight',\n ...shorthands.borderColor('Highlight'),\n color: 'HighlightText',\n forcedColorAdjust: 'none',\n\n ':hover': {\n backgroundColor: 'HighlightText',\n ...shorthands.borderColor('Highlight'),\n color: 'Highlight',\n },\n\n ':hover:active': {\n backgroundColor: 'HighlightText',\n ...shorthands.borderColor('Highlight'),\n color: 'Highlight',\n },\n\n ':focus': {\n ...shorthands.borderColor('Highlight'),\n },\n },\n },\n highContrastFocusStyles: createCustomFocusIndicatorStyle({\n ...shorthands.border('1px', 'solid', 'HighlightText'),\n outlineColor: 'Highlight',\n }),\n\n // Appearance variations\n outline: {\n backgroundColor: tokens.colorTransparentBackgroundSelected,\n ...shorthands.borderColor(tokens.colorNeutralStroke1),\n ...shorthands.borderWidth(tokens.strokeWidthThicker),\n\n ':hover': {\n backgroundColor: tokens.colorTransparentBackgroundHover,\n },\n\n ':hover:active': {\n backgroundColor: tokens.colorTransparentBackgroundPressed,\n },\n\n ...createCustomFocusIndicatorStyle({\n ...shorthands.borderColor(tokens.colorNeutralStroke1),\n }),\n },\n primary: {\n backgroundColor: tokens.colorBrandBackgroundSelected,\n ...shorthands.borderColor('transparent'),\n color: tokens.colorNeutralForegroundOnBrand,\n\n ':hover': {\n backgroundColor: tokens.colorBrandBackgroundHover,\n ...shorthands.borderColor('transparent'),\n color: tokens.colorNeutralForegroundOnBrand,\n },\n\n ':hover:active': {\n backgroundColor: tokens.colorBrandBackgroundPressed,\n ...shorthands.borderColor('transparent'),\n color: tokens.colorNeutralForegroundOnBrand,\n },\n },\n secondary: {\n /* The secondary styles are exactly the same as the base styles. /\n },\n subtle: {\n backgroundColor: tokens.colorSubtleBackgroundSelected,\n ...shorthands.borderColor('transparent'),\n color: tokens.colorNeutralForeground2Selected,\n\n ':hover': {\n backgroundColor: tokens.colorSubtleBackgroundHover,\n ...shorthands.borderColor('transparent'),\n color: tokens.colorNeutralForeground2Hover,\n },\n\n ':hover:active': {\n backgroundColor: tokens.colorSubtleBackgroundPressed,\n ...shorthands.borderColor('transparent'),\n color: tokens.colorNeutralForeground2Pressed,\n },\n },\n transparent: {\n backgroundColor: tokens.colorTransparentBackgroundSelected,\n ...shorthands.borderColor('transparent'),\n color: tokens.colorNeutralForeground2BrandSelected,\n\n ':hover': {\n backgroundColor: tokens.colorTransparentBackgroundHover,\n ...shorthands.borderColor('transparent'),\n color: tokens.colorNeutralForeground2BrandHover,\n },\n\n ':hover:active': {\n backgroundColor: tokens.colorTransparentBackgroundPressed,\n ...shorthands.borderColor('transparent'),\n color: tokens.colorNeutralForeground2BrandPressed,\n },\n },\n});\n\nconst useRootDisabledStyles = makeStyles({\n // Base styles\n base: {\n backgroundColor: tokens.colorNeutralBackgroundDisabled,\n ...shorthands.borderColor(tokens.colorNeutralStrokeDisabled),\n color: tokens.colorNeutralForegroundDisabled,\n\n ':hover': {\n backgroundColor: tokens.colorNeutralBackgroundDisabled,\n ...shorthands.borderColor(tokens.colorNeutralStrokeDisabled),\n color: tokens.colorNeutralForegroundDisabled,\n },\n\n ':hover:active': {\n backgroundColor: tokens.colorNeutralBackgroundDisabled,\n ...shorthands.borderColor(tokens.colorNeutralStrokeDisabled),\n color: tokens.colorNeutralForegroundDisabled,\n },\n },\n\n // Appearance variations\n outline: {\n / No styles /\n },\n primary: {\n ...shorthands.borderColor('transparent'),\n\n ':hover': {\n ...shorthands.borderColor('transparent'),\n },\n\n ':hover:active': {\n ...shorthands.borderColor('transparent'),\n },\n },\n secondary: {\n / The secondary styles are exactly the same as the base styles. */\n },\n subtle: {\n backgroundColor: tokens.colorTransparentBackground,\n ...shorthands.borderColor('transparent'),\n\n ':hover': {\n backgroundColor: tokens.colorTransparentBackgroundHover,\n ...shorthands.borderColor('transparent'),\n },\n\n ':hover:active': {\n backgroundColor: tokens.colorTransparentBackgroundPressed,\n ...shorthands.borderColor('transparent'),\n },\n },\n transparent: {\n backgroundColor: tokens.colorTransparentBackground,\n ...shorthands.borderColor('transparent'),\n\n ':hover': {\n backgroundColor: tokens.colorTransparentBackgroundHover,\n ...shorthands.borderColor('transparent'),\n },\n\n ':hover:active': {\n backgroundColor: tokens.colorTransparentBackgroundPressed,\n ...shorthands.borderColor('transparent'),\n },\n },\n});\n\nconst useIconCheckedStyles = makeStyles({\n // Appearance variations\n subtleOrTransparent: {\n color: tokens.colorNeutralForeground2BrandSelected,\n },\n});\n\nexport const useToggleButtonStyles_unstable = (state: ToggleButtonState): ToggleButtonState => {\n const rootCheckedStyles = useRootCheckedStyles();\n const rootDisabledStyles = useRootDisabledStyles();\n const iconCheckedStyles = useIconCheckedStyles();\n\n const { appearance, checked, disabled, disabledFocusable } = state;\n\n state.root.className = mergeClasses(\n toggleButtonClassNames.root,\n\n // Checked styles\n checked && rootCheckedStyles.base,\n checked && rootCheckedStyles.highContrast,\n appearance && checked && rootCheckedStyles[appearance],\n\n // Disabled styles\n (disabled \|\| disabledFocusable) && rootDisabledStyles.base,\n appearance && (disabled \|\| disabledFocusable) && rootDisabledStyles[appearance],\n\n // User provided class name\n state.root.className,\n );\n\n if (state.icon) {\n state.icon.className = mergeClasses(\n toggleButtonClassNames.icon,\n (appearance === 'subtle' \|\| appearance === 'transparent') && iconCheckedStyles.subtleOrTransparent,\n state.icon.className,\n );\n }\n\n useButtonStyles_unstable(state);\n\n return state;\n};\n"]}

package/lib/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"~~sources":["packages/react-components/react-button/src/index.ts"],"names":[],"~~mappings":"AAAA,~~SACE~~,~~MADF~~,~~EAEE~~,~~gBAFF~~,~~EAGE~~,~~qBAHF~~,~~EAIE~~,~~wBAJF~~,~~EAKE~~,~~kBALF~~,~~QAMO~~,~~UANP~~;~~AAQA~~,~~SACE~~,~~cADF~~,~~EAEE~~,~~wBAFF~~,~~EAGE~~,~~6BAHF~~,~~EAIE~~,~~gCAJF~~,~~EAKE~~,~~0BALF~~,~~QAMO~~,~~kBANP~~;~~AAQA~~,~~SACE~~,~~UADF~~,~~EAEE~~,~~oBAFF~~,~~EAGE~~,~~yBAHF~~,~~EAIE~~,~~4BAJF~~,~~EAKE~~,~~sBALF~~,~~QAMO~~,~~cANP~~;~~AAQA~~,~~SACE~~,~~WADF~~,~~EAEE~~,~~0BAFF~~,~~EAGE~~,~~qBAHF~~,~~EAIE~~,~~6BAJF~~,~~EAKE~~,~~uBALF~~,~~QAMO~~,~~eANP~~;~~AAQA~~,~~SACE~~,~~YADF~~,~~EAEE~~,~~2BAFF~~,~~EAGE~~,~~sBAHF~~,~~EAIE~~,~~8BAJF~~,~~EAKE~~,~~wBALF~~,~~QAMO~~,~~gBANP~~;~~AASA~~,~~SAAS~~,~~cAAT~~,~~QAA+B~~,~~eAA~~/B","sourcesContent":["export {\n Button,\n buttonClassNames,\n renderButton_unstable,\n useButtonStyles_unstable,\n useButton_unstable,\n} from './Button';\nexport type { ButtonProps, ButtonSlots, ButtonState } from './Button';\nexport {\n CompoundButton,\n compoundButtonClassNames,\n renderCompoundButton_unstable,\n useCompoundButtonStyles_unstable,\n useCompoundButton_unstable,\n} from './CompoundButton';\nexport type { CompoundButtonProps, CompoundButtonSlots, CompoundButtonState } from './CompoundButton';\nexport {\n MenuButton,\n menuButtonClassNames,\n renderMenuButton_unstable,\n useMenuButtonStyles_unstable,\n useMenuButton_unstable,\n} from './MenuButton';\nexport type { MenuButtonProps, MenuButtonSlots, MenuButtonState } from './MenuButton';\nexport {\n SplitButton,\n renderSplitButton_unstable,\n splitButtonClassNames,\n useSplitButtonStyles_unstable,\n useSplitButton_unstable,\n} from './SplitButton';\nexport type { SplitButtonProps, SplitButtonSlots, SplitButtonState } from './SplitButton';\nexport {\n ToggleButton,\n renderToggleButton_unstable,\n toggleButtonClassNames,\n useToggleButtonStyles_unstable,\n useToggleButton_unstable,\n} from './ToggleButton';\nexport type { ToggleButtonProps, ToggleButtonState } from './ToggleButton';\n\nexport { useToggleState } from './utils/index';\n"]~~,"sourceRoot":"../src/"~~}
1	+ {"version":3,"mappings":"AAAA,SACEA,MAAM,EACNC,gBAAgB,EAChBC,qBAAqB,EACrBC,wBAAwB,EACxBC,kBAAkB,QACb,UAAU;AAEjB,SACEC,cAAc,EACdC,wBAAwB,EACxBC,6BAA6B,EAC7BC,gCAAgC,EAChCC,0BAA0B,QACrB,kBAAkB;AAEzB,SACEC,UAAU,EACVC,oBAAoB,EACpBC,yBAAyB,EACzBC,4BAA4B,EAC5BC,sBAAsB,QACjB,cAAc;AAErB,SACEC,WAAW,EACXC,0BAA0B,EAC1BC,qBAAqB,EACrBC,6BAA6B,EAC7BC,uBAAuB,QAClB,eAAe;AAEtB,SACEC,YAAY,EACZC,2BAA2B,EAC3BC,sBAAsB,EACtBC,8BAA8B,EAC9BC,wBAAwB,QACnB,gBAAgB;AAGvB,SAASC,cAAc,QAAQ,eAAe","names":["Button","buttonClassNames","renderButton_unstable","useButtonStyles_unstable","useButton_unstable","CompoundButton","compoundButtonClassNames","renderCompoundButton_unstable","useCompoundButtonStyles_unstable","useCompoundButton_unstable","MenuButton","menuButtonClassNames","renderMenuButton_unstable","useMenuButtonStyles_unstable","useMenuButton_unstable","SplitButton","renderSplitButton_unstable","splitButtonClassNames","useSplitButtonStyles_unstable","useSplitButton_unstable","ToggleButton","renderToggleButton_unstable","toggleButtonClassNames","useToggleButtonStyles_unstable","useToggleButton_unstable","useToggleState"],"sourceRoot":"../src/","sources":["packages/react-components/react-button/src/index.ts"],"sourcesContent":["export {\n Button,\n buttonClassNames,\n renderButton_unstable,\n useButtonStyles_unstable,\n useButton_unstable,\n} from './Button';\nexport type { ButtonProps, ButtonSlots, ButtonState } from './Button';\nexport {\n CompoundButton,\n compoundButtonClassNames,\n renderCompoundButton_unstable,\n useCompoundButtonStyles_unstable,\n useCompoundButton_unstable,\n} from './CompoundButton';\nexport type { CompoundButtonProps, CompoundButtonSlots, CompoundButtonState } from './CompoundButton';\nexport {\n MenuButton,\n menuButtonClassNames,\n renderMenuButton_unstable,\n useMenuButtonStyles_unstable,\n useMenuButton_unstable,\n} from './MenuButton';\nexport type { MenuButtonProps, MenuButtonSlots, MenuButtonState } from './MenuButton';\nexport {\n SplitButton,\n renderSplitButton_unstable,\n splitButtonClassNames,\n useSplitButtonStyles_unstable,\n useSplitButton_unstable,\n} from './SplitButton';\nexport type { SplitButtonProps, SplitButtonSlots, SplitButtonState } from './SplitButton';\nexport {\n ToggleButton,\n renderToggleButton_unstable,\n toggleButtonClassNames,\n useToggleButtonStyles_unstable,\n useToggleButton_unstable,\n} from './ToggleButton';\nexport type { ToggleButtonProps, ToggleButtonState } from './ToggleButton';\n\nexport { useToggleState } from './utils/index';\n"]}

package/lib/utils/useToggleState.js CHANGED Viewed

@@ -22,13 +22,14 @@ export function useToggleState(props, state) {
       if (ev.defaultPrevented) {
         return;
       }
       setCheckedValue(!checkedValue);
     }
   }, [checkedValue, disabled, disabledFocusable, setCheckedValue]);
-  return { ...state,
+  return {
+    ...state,
     checked: checkedValue,
-    root: { ...state.root,
+    root: {
+      ...state.root,
       [isCheckboxTypeRole ? 'aria-checked' : 'aria-pressed']: checkedValue,
       onClick: useEventCallback(mergeCallbacks(onClick, onToggleClick))
     }

package/lib/utils/useToggleState.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"~~sources":["packages/react-components/react-button/src/utils/useToggleState.ts"],"names":[],"~~mappings":"AAAA,OAAO,KAAK,~~KAAZ~~,~~MAAuB,OAAvB~~;~~AACA~~,~~SAAS~~,~~cAAT~~,~~EAAyB~~,~~oBAAzB~~,~~EAA+C~~,~~gBAA/C~~,~~QAAuE~~,~~2BAAvE~~;~~AAIA~~,OAAM,~~SAAU~~,~~cAAV~~,~~CAIJ~~,~~KAJI~~,~~EAIuB~~,~~KAJvB,EAI0C~~;EAC9C,MAAM;~~IAAE~~,~~OAAF~~;~~IAAW~~,~~cAAX~~;~~IAA2B~~,~~QAA3B~~;~~IAAqC~~;~~EAArC~~,~~IAA2D~~,~~KAAjE~~;~~EACA~~,MAAM;~~IAAE~~,~~OAAF~~;~~IAAW~~;~~EAAX~~,~~IAAoB~~,KAAK,~~CAAC~~,~~IAAhC~~;~~EAEA~~,MAAM,~~CAAC~~,~~YAAD~~,~~EAAe~~,~~eAAf~~,~~IAAkC~~,oBAAoB,CAAC;~~IAC3D~~,KAAK,~~EAAE~~,~~OADoD~~;~~IAE3D~~,YAAY,~~EAAE~~,~~cAF6C~~;~~IAG3D~~,YAAY,EAAE;~~EAH6C~~,~~CAAD,CAA5D~~;~~EAMA~~,~~MAAM~~,kBAAkB,~~GAAG~~,IAAI,KAAK,~~kBAAT~~,~~IAA+B~~,IAAI,KAAK,~~UAAnE~~;~~EAEA~~,~~MAAM~~,aAAa,~~GAAG~~,KAAK,~~CAAC~~,~~WAAN~~,~~CACpB~~,EAAE,IAAG;IACH,IAAI,~~CAAC~~,~~QAAD~~,~~IAAa~~,~~CAAC~~,~~iBAAlB~~,~~EAAqC~~;MACnC,~~IAAI~~,EAAE,~~CAAC~~,~~gBAAP~~,~~EAAyB~~;QACvB~~;MACD~~;;~~MAED~~,eAAe,CAAC,~~CAAC~~,~~YAAF~~,~~CAAf;IACD;EACF~~,~~CATmB~~,~~EAUpB~~,~~CAAC~~,~~YAAD~~,~~EAAe~~,~~QAAf~~,~~EAAyB~~,~~iBAAzB~~,~~EAA4C~~,~~eAA5C~~,~~CAVoB~~,~~CAAtB~~;~~EAaA~~,OAAO,~~EACL~~,~~GAAG,KADE~~;~~IAGL~~,OAAO,~~EAAE~~,~~YAHJ~~;~~IAKL~~,IAAI,EAAE,~~EACJ~~,~~GAAG,~~KAAK,~~CAAC~~,~~IADL~~;~~MAEJ~~,~~CAAC~~,kBAAkB,GAAG,~~cAAH~~,~~GAAoB~~,~~cAAvC~~,~~GAAwD~~,~~YAFpD~~;~~MAGJ~~,OAAO,~~EAAE~~,gBAAgB,~~CACvB~~,cAAc,~~CAAC~~,~~OAAD~~,~~EAA4E~~,~~aAA5E~~,~~CADS~~;~~IAHrB;EALD~~,~~CAAP;AAaD~~","sourcesContent":["import * as React from 'react';\nimport { mergeCallbacks, useControllableState, useEventCallback } from '@fluentui/react-utilities';\nimport type { ButtonState } from '../Button';\nimport type { ToggleButtonProps, ToggleButtonState } from '../ToggleButton';\n\nexport function useToggleState<\n TToggleButtonProps extends Pick<ToggleButtonProps, 'checked' \| 'defaultChecked' \| 'disabled' \| 'disabledFocusable'>,\n TButtonState extends Pick<ButtonState, 'root'>,\n TToggleButtonState extends Pick<ToggleButtonState, 'checked' \| 'root'>\n>(props: TToggleButtonProps, state: TButtonState): TToggleButtonState {\n const { checked, defaultChecked, disabled, disabledFocusable } = props;\n const { onClick, role } = state.root;\n\n const [checkedValue, setCheckedValue] = useControllableState({\n state: checked,\n defaultState: defaultChecked,\n initialState: false,\n });\n\n const isCheckboxTypeRole = role === 'menuitemcheckbox' \|\| role === 'checkbox';\n\n const onToggleClick = React.useCallback(\n ev => {\n if (!disabled && !disabledFocusable) {\n if (ev.defaultPrevented) {\n return;\n }\n\n setCheckedValue(!checkedValue);\n }\n },\n [checkedValue, disabled, disabledFocusable, setCheckedValue],\n );\n\n return {\n ...state,\n\n checked: checkedValue,\n\n root: {\n ...state.root,\n [isCheckboxTypeRole ? 'aria-checked' : 'aria-pressed']: checkedValue,\n onClick: useEventCallback(\n mergeCallbacks(onClick as React.MouseEventHandler<HTMLButtonElement \| HTMLAnchorElement>, onToggleClick),\n ),\n },\n } as TToggleButtonState;\n}\n"]~~,"sourceRoot":"../src/"~~}
1	+ {"version":3,"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,cAAc,EAAEC,oBAAoB,EAAEC,gBAAgB,QAAQ,2BAA2B;AAIlG,OAAM,SAAUC,cAAc,CAI5BC,KAAyB,EAAEC,KAAmB;EAC9C,MAAM;IAAEC,OAAO;IAAEC,cAAc;IAAEC,QAAQ;IAAEC;EAAiB,CAAE,GAAGL,KAAK;EACtE,MAAM;IAAEM,OAAO;IAAEC;EAAI,CAAE,GAAGN,KAAK,CAACO,IAAI;EAEpC,MAAM,CAACC,YAAY,EAAEC,eAAe,CAAC,GAAGb,oBAAoB,CAAC;IAC3DI,KAAK,EAAEC,OAAO;IACdS,YAAY,EAAER,cAAc;IAC5BS,YAAY,EAAE;GACf,CAAC;EAEF,MAAMC,kBAAkB,GAAGN,IAAI,KAAK,kBAAkB,IAAIA,IAAI,KAAK,UAAU;EAE7E,MAAMO,aAAa,GAAGnB,KAAK,CAACoB,WAAW,CACrCC,EAAE,IAAG;IACH,IAAI,CAACZ,QAAQ,IAAI,CAACC,iBAAiB,EAAE;MACnC,IAAIW,EAAE,CAACC,gBAAgB,EAAE;QACvB;;MAGFP,eAAe,CAAC,CAACD,YAAY,CAAC;;EAElC,CAAC,EACD,CAACA,YAAY,EAAEL,QAAQ,EAAEC,iBAAiB,EAAEK,eAAe,CAAC,CAC7D;EAED,OAAO;IACL,GAAGT,KAAK;IAERC,OAAO,EAAEO,YAAY;IAErBD,IAAI,EAAE;MACJ,GAAGP,KAAK,CAACO,IAAI;MACb,CAACK,kBAAkB,GAAG,cAAc,GAAG,cAAc,GAAGJ,YAAY;MACpEH,OAAO,EAAER,gBAAgB,CACvBF,cAAc,CAACU,OAAyE,EAAEQ,aAAa,CAAC;;GAGvF;AACzB","names":["React","mergeCallbacks","useControllableState","useEventCallback","useToggleState","props","state","checked","defaultChecked","disabled","disabledFocusable","onClick","role","root","checkedValue","setCheckedValue","defaultState","initialState","isCheckboxTypeRole","onToggleClick","useCallback","ev","defaultPrevented"],"sourceRoot":"../src/","sources":["packages/react-components/react-button/src/utils/useToggleState.ts"],"sourcesContent":["import * as React from 'react';\nimport { mergeCallbacks, useControllableState, useEventCallback } from '@fluentui/react-utilities';\nimport type { ButtonState } from '../Button';\nimport type { ToggleButtonProps, ToggleButtonState } from '../ToggleButton';\n\nexport function useToggleState<\n TToggleButtonProps extends Pick<ToggleButtonProps, 'checked' \| 'defaultChecked' \| 'disabled' \| 'disabledFocusable'>,\n TButtonState extends Pick<ButtonState, 'root'>,\n TToggleButtonState extends Pick<ToggleButtonState, 'checked' \| 'root'>\n>(props: TToggleButtonProps, state: TButtonState): TToggleButtonState {\n const { checked, defaultChecked, disabled, disabledFocusable } = props;\n const { onClick, role } = state.root;\n\n const [checkedValue, setCheckedValue] = useControllableState({\n state: checked,\n defaultState: defaultChecked,\n initialState: false,\n });\n\n const isCheckboxTypeRole = role === 'menuitemcheckbox' \|\| role === 'checkbox';\n\n const onToggleClick = React.useCallback(\n ev => {\n if (!disabled && !disabledFocusable) {\n if (ev.defaultPrevented) {\n return;\n }\n\n setCheckedValue(!checkedValue);\n }\n },\n [checkedValue, disabled, disabledFocusable, setCheckedValue],\n );\n\n return {\n ...state,\n\n checked: checkedValue,\n\n root: {\n ...state.root,\n [isCheckboxTypeRole ? 'aria-checked' : 'aria-pressed']: checkedValue,\n onClick: useEventCallback(\n mergeCallbacks(onClick as React.MouseEventHandler<HTMLButtonElement \| HTMLAnchorElement>, onToggleClick),\n ),\n },\n } as TToggleButtonState;\n}\n"]}

package/lib-commonjs/Button.js CHANGED Viewed

@@ -3,8 +3,6 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 const tslib_1 = /*#__PURE__*/require("tslib");
 tslib_1.__exportStar(require("./components/Button/index"), exports);
 //# sourceMappingURL=Button.js.map

package/lib-commonjs/Button.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["packages/react-components/react-button/src/Button.tsx"],"~~names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,2BAAA,CAAA,EAAA,OAAA","~~sourcesContent":["export * from './components/Button/index';\n"]~~,"sourceRoot":"../src/"~~}
1	+ {"version":3,"mappings":";;;;;;AAAAA","names":["tslib_1"],"sourceRoot":"../src/","sources":["packages/react-components/react-button/src/Button.tsx"],"sourcesContent":["export * from './components/Button/index';\n"]}

package/lib-commonjs/CompoundButton.js CHANGED Viewed

@@ -3,8 +3,6 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 const tslib_1 = /*#__PURE__*/require("tslib");
 tslib_1.__exportStar(require("./components/CompoundButton/index"), exports);
 //# sourceMappingURL=CompoundButton.js.map

package/lib-commonjs/CompoundButton.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["packages/react-components/react-button/src/CompoundButton.ts"],"~~names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,mCAAA,CAAA,EAAA,OAAA","~~sourcesContent":["export * from './components/CompoundButton/index';\n"]~~,"sourceRoot":"../src/"~~}
1	+ {"version":3,"mappings":";;;;;;AAAAA","names":["tslib_1"],"sourceRoot":"../src/","sources":["packages/react-components/react-button/src/CompoundButton.ts"],"sourcesContent":["export * from './components/CompoundButton/index';\n"]}

package/lib-commonjs/MenuButton.js CHANGED Viewed

@@ -3,8 +3,6 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 const tslib_1 = /*#__PURE__*/require("tslib");
 tslib_1.__exportStar(require("./components/MenuButton/index"), exports);
 //# sourceMappingURL=MenuButton.js.map

package/lib-commonjs/MenuButton.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["packages/react-components/react-button/src/MenuButton.ts"],"~~names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,+BAAA,CAAA,EAAA,OAAA","~~sourcesContent":["export * from './components/MenuButton/index';\n"]~~,"sourceRoot":"../src/"~~}
1	+ {"version":3,"mappings":";;;;;;AAAAA","names":["tslib_1"],"sourceRoot":"../src/","sources":["packages/react-components/react-button/src/MenuButton.ts"],"sourcesContent":["export * from './components/MenuButton/index';\n"]}

package/lib-commonjs/SplitButton.js CHANGED Viewed

@@ -3,8 +3,6 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 const tslib_1 = /*#__PURE__*/require("tslib");
 tslib_1.__exportStar(require("./components/SplitButton/index"), exports);
 //# sourceMappingURL=SplitButton.js.map

package/lib-commonjs/SplitButton.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["packages/react-components/react-button/src/SplitButton.ts"],"~~names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,gCAAA,CAAA,EAAA,OAAA","~~sourcesContent":["export * from './components/SplitButton/index';\n"]~~,"sourceRoot":"../src/"~~}
1	+ {"version":3,"mappings":";;;;;;AAAAA","names":["tslib_1"],"sourceRoot":"../src/","sources":["packages/react-components/react-button/src/SplitButton.ts"],"sourcesContent":["export * from './components/SplitButton/index';\n"]}

package/lib-commonjs/ToggleButton.js CHANGED Viewed

@@ -3,8 +3,6 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 const tslib_1 = /*#__PURE__*/require("tslib");
 tslib_1.__exportStar(require("./components/ToggleButton/index"), exports);
 //# sourceMappingURL=ToggleButton.js.map

package/lib-commonjs/ToggleButton.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["packages/react-components/react-button/src/ToggleButton.ts"],"~~names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,iCAAA,CAAA,EAAA,OAAA","~~sourcesContent":["export * from './components/ToggleButton/index';\n"]~~,"sourceRoot":"../src/"~~}
1	+ {"version":3,"mappings":";;;;;;AAAAA","names":["tslib_1"],"sourceRoot":"../src/","sources":["packages/react-components/react-button/src/ToggleButton.ts"],"sourcesContent":["export * from './components/ToggleButton/index';\n"]}

package/lib-commonjs/components/Button/Button.js CHANGED Viewed

@@ -4,23 +4,19 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.Button = void 0;
 const React = /*#__PURE__*/require("react");
 const renderButton_1 = /*#__PURE__*/require("./renderButton");
 const useButton_1 = /*#__PURE__*/require("./useButton");
 const useButtonStyles_1 = /*#__PURE__*/require("./useButtonStyles");
 /**
  * Buttons give people a way to trigger an action.
  */
 exports.Button = /*#__PURE__*/React.forwardRef((props, ref) => {
   const state = useButton_1.useButton_unstable(props, ref);
   useButtonStyles_1.useButtonStyles_unstable(state);
-  return renderButton_1.renderButton_unstable(state); // Casting is required due to lack of distributive union to support unions on @types/react
+  return renderButton_1.renderButton_unstable(state);
+  // Casting is required due to lack of distributive union to support unions on @types/react
 });
 exports.Button.displayName = 'Button';
 //# sourceMappingURL=Button.js.map

package/lib-commonjs/components/Button/Button.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"~~sources":["packages/react-components/react-button/src/components/Button/Button.tsx"],"names":[],"~~mappings":"~~;;;;;;;~~AAAA~~,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;~~AACA~~,MAAA,cAAA,gBAAA,OAAA,CAAA,gBAAA,CAAA;;~~AACA~~,MAAA,WAAA,gBAAA,OAAA,CAAA,aAAA,CAAA;;~~AACA~~,MAAA,iBAAA,gBAAA,OAAA,CAAA,mBAAA,CAAA~~;AAIA~~;;AAEG~~;;;~~AACU~~,~~OAAA~~,~~CAAA~~,~~MAAA~~,~~gBAA2C~~,~~KAAK~~,CAAC,~~UAAN~~,~~CAAiB~~,~~CAAC~~,~~KAAD~~,~~EAAQ,GAAR,KAAe~~;EACtF,~~MAAM~~,KAAK,~~GAAG~~,~~WAAA~~,~~CAAA~~,~~kBAAA~~,~~CAAmB~~,~~KAAnB~~,~~EAA0B~~,~~GAA1B~~,~~CAAd~~;~~EAEA~~,~~iBAAA~~,~~CAAA~~,~~wBAAA~~,~~CAAyB~~,~~KAAzB~~;~~EAEA~~,~~OAAO~~,~~cAAA~~,~~CAAA~~,~~qBAAA~~,~~CAAsB~~,~~KAAtB~~,~~CAAP~~,~~CALsF~~,~~CAMtF;AACD~~,~~CAPuD~~,~~CAA3C;AASb~~,~~OAAA~~,~~CAAA~~,~~MAAA~~,~~CAAO~~,~~WAAP~~,~~GAAqB~~,~~QAArB~~","sourcesContent":["import * as React from 'react';\nimport { renderButton_unstable } from './renderButton';\nimport { useButton_unstable } from './useButton';\nimport { useButtonStyles_unstable } from './useButtonStyles';\nimport type { ButtonProps } from './Button.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/*\n Buttons give people a way to trigger an action.\n */\nexport const Button: ForwardRefComponent<ButtonProps> = React.forwardRef((props, ref) => {\n const state = useButton_unstable(props, ref);\n\n useButtonStyles_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<ButtonProps>;\n\nButton.displayName = 'Button';\n"]~~,"sourceRoot":"../src/"~~}
1	+ {"version":3,"mappings":";;;;;;AAAA;AACA;AACA;AACA;AAIA;;;AAGaA,cAAM,gBAAqCC,KAAK,CAACC,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EACtF,MAAMC,KAAK,GAAGC,8BAAkB,CAACH,KAAK,EAAEC,GAAG,CAAC;EAE5CG,0CAAwB,CAACF,KAAK,CAAC;EAE/B,OAAOG,oCAAqB,CAACH,KAAK,CAAC;EACnC;AACF,CAAC,CAAqC;;AAEtCL,cAAM,CAACS,WAAW,GAAG,QAAQ","names":["exports","React","forwardRef","props","ref","state","useButton_1","useButtonStyles_1","renderButton_1","displayName"],"sourceRoot":"../src/","sources":["packages/react-components/react-button/src/components/Button/Button.tsx"],"sourcesContent":["import * as React from 'react';\nimport { renderButton_unstable } from './renderButton';\nimport { useButton_unstable } from './useButton';\nimport { useButtonStyles_unstable } from './useButtonStyles';\nimport type { ButtonProps } from './Button.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/*\n Buttons give people a way to trigger an action.\n */\nexport const Button: ForwardRefComponent<ButtonProps> = React.forwardRef((props, ref) => {\n const state = useButton_unstable(props, ref);\n\n useButtonStyles_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<ButtonProps>;\n\nButton.displayName = 'Button';\n"]}

package/lib-commonjs/components/Button/Button.types.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"~~sources~~":[],"names":[],"~~mappings~~":"","~~sourceRoot~~":"~~../src/~~"}
1	+ {"version":3,"mappings":"","names":[],"sourceRoot":"../src/","sources":[],"sourcesContent":[]}

package/lib-commonjs/components/Button/index.js CHANGED Viewed

@@ -4,17 +4,11 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.useButtonStyles_unstable = exports.buttonClassNames = void 0;
 const tslib_1 = /*#__PURE__*/require("tslib");
 tslib_1.__exportStar(require("./Button"), exports);
 tslib_1.__exportStar(require("./renderButton"), exports);
 tslib_1.__exportStar(require("./useButton"), exports);
 var useButtonStyles_1 = /*#__PURE__*/require("./useButtonStyles");
 Object.defineProperty(exports, "buttonClassNames", {
   enumerable: true,
   get: function () {

package/lib-commonjs/components/Button/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["packages/react-components/react-button/src/components/Button/index.ts"],"names":[],"mappings":";;;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,UAAA,CAAA,EAAA,OAAA;;AAGA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,gBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,aAAA,CAAA,EAAA,OAAA;;AACA,IAAA,iBAAA,gBAAA,OAAA,CAAA,mBAAA,CAAA;;AAAS,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,kBAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,iBAAA,CAAA,gBAAA;EAAgB;AAAhB,CAAA;AAAkB,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,0BAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,iBAAA,CAAA,wBAAA;EAAwB;AAAxB,CAAA","sourcesContent":["export * from './Button';\n// Explicit exports to omit ButtonCommons\nexport type { ButtonProps, ButtonSlots, ButtonState } from './Button.types';\nexport * from './renderButton';\nexport * from './useButton';\nexport { buttonClassNames, useButtonStyles_unstable } from './useButtonStyles';\n"]~~,"sourceRoot":"../src/"~~}
1	+ {"version":3,"mappings":";;;;;;;AAAAA;AAGAA;AACAA;AACA;AAASC;EAAAC;EAAAC;IAAA,yCAAgB;EAAA;AAAA;AAAEF;EAAAC;EAAAC;IAAA,iDAAwB;EAAA;AAAA","names":["tslib_1","Object","enumerable","get"],"sourceRoot":"../src/","sources":["packages/react-components/react-button/src/components/Button/index.ts"],"sourcesContent":["export * from './Button';\n// Explicit exports to omit ButtonCommons\nexport type { ButtonProps, ButtonSlots, ButtonState } from './Button.types';\nexport * from './renderButton';\nexport * from './useButton';\nexport { buttonClassNames, useButtonStyles_unstable } from './useButtonStyles';\n"]}

package/lib-commonjs/components/Button/renderButton.js CHANGED Viewed

@@ -4,15 +4,11 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.renderButton_unstable = void 0;
 const React = /*#__PURE__*/require("react");
 const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
 /**
  * Renders a Button component by passing the state defined props to the appropriate slots.
  */
 const renderButton_unstable = state => {
   const {
     slots,
@@ -22,11 +18,13 @@ const renderButton_unstable = state => {
     iconOnly,
     iconPosition
   } = state;
-  return React.createElement(slots.root, { ...slotProps.root
-  }, iconPosition !== 'after' && slots.icon && React.createElement(slots.icon, { ...slotProps.icon
-  }), !iconOnly && state.root.children, iconPosition === 'after' && slots.icon && React.createElement(slots.icon, { ...slotProps.icon
+  return React.createElement(slots.root, {
+    ...slotProps.root
+  }, iconPosition !== 'after' && slots.icon && React.createElement(slots.icon, {
+    ...slotProps.icon
+  }), !iconOnly && state.root.children, iconPosition === 'after' && slots.icon && React.createElement(slots.icon, {
+    ...slotProps.icon
   }));
 };
 exports.renderButton_unstable = renderButton_unstable;
 //# sourceMappingURL=renderButton.js.map

package/lib-commonjs/components/Button/renderButton.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"~~sources":["packages/react-components/react-button/src/components/Button/renderButton.tsx"],"names":[],"~~mappings":"~~;;;;;;;~~AAAA~~,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;~~AACA~~,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA~~;AAGA~~;;AAEG~~;;;~~AACI~~,~~MAAM~~,qBAAqB,~~GAAI~~,~~KAAD~~,~~IAAuB~~;EAC1D,MAAM;~~IAAE~~,~~KAAF~~;~~IAAS~~;~~EAAT~~,~~IAAuB~~,~~iBAAA~~,~~CAAA~~,~~QAAA~~,~~CAAsB~~,~~KAAtB,CAA7B~~;~~EACA~~,MAAM;~~IAAE~~,~~QAAF~~;~~IAAY~~;~~EAAZ~~,~~IAA6B~~,~~KAAnC~~;~~EAEA~~,~~OACE~~,~~KAAA~~,~~CAAA,aAAA,CAAC,~~KAAK,~~CAAC~~,~~IAAP~~,~~EAAW~~,~~EAAA,GAAK,~~SAAS,~~CAAC~~;~~EAAf~~,~~CAAX~~,~~EACG,~~YAAY,KAAK,~~OAAjB~~,~~IAA4B~~,KAAK,~~CAAC~~,~~IAAlC~~,~~IAA0C~~,~~KAAA~~,~~CAAA,aAAA,CAAC,~~KAAK,~~CAAC~~,~~IAAP~~,~~EAAW~~,~~EAAA,GAAK,~~SAAS,~~CAAC~~;~~EAAf~~,~~CAAX~~,~~CAD7C~~,~~EAEG~~,~~CAAC~~,~~QAAD~~,~~IAAa,~~KAAK,~~CAAC~~,~~IAAN~~,~~CAAW~~,~~QAF3B~~,~~EAGG~~,YAAY,KAAK,~~OAAjB~~,~~IAA4B~~,KAAK,~~CAAC~~,~~IAAlC~~,~~IAA0C~~,~~KAAA~~,~~CAAA~~,~~aAAA~~,~~CAAC~~,~~KAAK~~,CAAC,~~IAAP~~,~~EAAW~~,~~EAAA~~,~~GAAK~~,~~SAAS~~,~~CAAC;EAAf~~,~~CAAX~~,~~CAH7C~~,~~CADF;AAOD~~,~~CAXM;;AAAM~~,~~OAAA~~,~~CAAA~~,~~qBAAA~~,~~GAAqB~~,~~qBAArB~~","sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { ButtonSlots, ButtonState } from './Button.types';\n\n/*\n Renders a Button component by passing the state defined props to the appropriate slots.\n */\nexport const renderButton_unstable = (state: ButtonState) => {\n const { slots, slotProps } = getSlots<ButtonSlots>(state);\n const { iconOnly, iconPosition } = state;\n\n return (\n <slots.root {...slotProps.root}>\n {iconPosition !== 'after' && slots.icon && <slots.icon {...slotProps.icon} />}\n {!iconOnly && state.root.children}\n {iconPosition === 'after' && slots.icon && <slots.icon {...slotProps.icon} />}\n </slots.root>\n );\n};\n"]~~,"sourceRoot":"../src/"~~}
1	+ {"version":3,"mappings":";;;;;;AAAA;AACA;AAGA;;;AAGO,MAAMA,qBAAqB,GAAIC,KAAkB,IAAI;EAC1D,MAAM;IAAEC,KAAK;IAAEC;EAAS,CAAE,GAAGC,0BAAQ,CAAcH,KAAK,CAAC;EACzD,MAAM;IAAEI,QAAQ;IAAEC;EAAY,CAAE,GAAGL,KAAK;EAExC,OACEM,oBAACL,KAAK,CAACM,IAAI;IAAA,GAAKL,SAAS,CAACK;EAAI,GAC3BF,YAAY,KAAK,OAAO,IAAIJ,KAAK,CAACO,IAAI,IAAIF,oBAACL,KAAK,CAACO,IAAI;IAAA,GAAKN,SAAS,CAACM;EAAI,EAAI,EAC5E,CAACJ,QAAQ,IAAIJ,KAAK,CAACO,IAAI,CAACE,QAAQ,EAChCJ,YAAY,KAAK,OAAO,IAAIJ,KAAK,CAACO,IAAI,IAAIF,oBAACL,KAAK,CAACO,IAAI;IAAA,GAAKN,SAAS,CAACM;EAAI,EAAI,CAClE;AAEjB,CAAC;AAXYE,6BAAqB","names":["renderButton_unstable","state","slots","slotProps","react_utilities_1","iconOnly","iconPosition","React","root","icon","children","exports"],"sourceRoot":"../src/","sources":["packages/react-components/react-button/src/components/Button/renderButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { ButtonSlots, ButtonState } from './Button.types';\n\n/*\n Renders a Button component by passing the state defined props to the appropriate slots.\n */\nexport const renderButton_unstable = (state: ButtonState) => {\n const { slots, slotProps } = getSlots<ButtonSlots>(state);\n const { iconOnly, iconPosition } = state;\n\n return (\n <slots.root {...slotProps.root}>\n {iconPosition !== 'after' && slots.icon && <slots.icon {...slotProps.icon} />}\n {!iconOnly && state.root.children}\n {iconPosition === 'after' && slots.icon && <slots.icon {...slotProps.icon} />}\n </slots.root>\n );\n};\n"]}

package/lib-commonjs/components/Button/useButton.js CHANGED Viewed

@@ -4,17 +4,13 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.useButton_unstable = void 0;
 const react_aria_1 = /*#__PURE__*/require("@fluentui/react-aria");
 const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
 /**
  * Given user props, defines default props for the Button, calls useButtonState, and returns processed state.
  * @param props - User provided props to the Button component.
  * @param ref - User provided ref to be passed to the Button component.
  */
 const useButton_unstable = (props, ref) => {
   const {
     appearance = 'secondary',
@@ -52,6 +48,5 @@ const useButton_unstable = (props, ref) => {
     icon: iconShorthand
   };
 };
 exports.useButton_unstable = useButton_unstable;
 //# sourceMappingURL=useButton.js.map

package/lib-commonjs/components/Button/useButton.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"~~sources":["packages/react-components/react-button/src/components/Button/useButton.ts"],"names":[],"~~mappings":"~~;;;;;;;~~AACA~~,MAAA,YAAA,gBAAA,OAAA,CAAA,sBAAA,CAAA;;~~AACA~~,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA~~;AAGA~~;;;;AAIG;;;AACI~~,~~MAAM~~,kBAAkB,GAAG,~~CAChC~~,~~KADgC~~,~~EAEhC~~,~~GAFgC~~,~~KAGjB~~;EACf,MAAM;~~IACJ~~,UAAU,GAAG,~~WADT~~;~~IAEJ~~,EAAE,GAAG,~~QAFD~~;~~IAGJ~~,QAAQ,GAAG,~~KAHP~~;~~IAIJ~~,iBAAiB,GAAG,~~KAJhB~~;~~IAKJ~~,~~IALI~~;~~IAMJ~~,YAAY,GAAG,~~QANX~~;~~IAOJ~~,KAAK,GAAG,~~SAPJ~~;~~IAQJ~~,IAAI,GAAG;~~EARH~~,~~IASF~~,~~KATJ~~;~~EAUA~~,~~MAAM~~,aAAa,~~GAAG~~,~~iBAAA~~,~~CAAA~~,~~gBAAA~~,~~CAAiB,IAAjB,CAAtB~~;~~EAEA~~,OAAO;IACL;~~IACA~~,~~UAFK~~;~~IAGL~~,~~QAHK~~;~~IAIL~~,~~iBAJK~~;~~IAKL~~,~~YALK~~;~~IAML~~,~~KANK~~;~~IAOL~~,~~IAPK~~;~~IASL~~;~~IACA~~,QAAQ,~~EAAE~~,OAAO,CAAC,~~CAAA~~,~~aAAa~~,~~KAAA,IAAb,IAAA,~~aAAa,~~KAAA~~,~~KAAA,CAAb,GAAa,KAAA,CAAb,GAAA,~~aAAa,~~CAAE~~,~~QAAf~~,~~KAA2B~~,~~CAAC~~,KAAK,~~CAAC~~,~~QAAnC~~,~~CAVZ~~;~~IAYL~~;~~IACA~~,UAAU,EAAE;~~MACV~~,IAAI,EAAE,~~QADI~~;~~MAEV~~,IAAI,EAAE;~~IAFI,CAbP~~;~~IAkBL~~,IAAI,~~EAAE~~,~~iBAAA~~,~~CAAA~~,~~qBAAA~~,~~CACJ~~,~~EADI~~,~~EAEJ~~,~~YAAA~~,~~CAAA,sBAAA,CAAiD,KAAjD,EAAwD~~;~~MACtD~~,QAAQ,EAAE,~~IAD4C~~;~~MAEtD~~,YAAY,EAAE;~~QACZ~~,GAAG,~~EAAE~~,~~GADO~~;~~QAEZ~~,IAAI,EAAE~~;MAFM;IAFwC~~,~~CAAxD~~,~~CAFI,CAlBD~~;~~IA4BL~~,IAAI,~~EAAE~~;~~EA5BD~~,~~CAAP~~;~~AA8BD~~,~~CA9CM;;AAAM~~,~~OAAA~~,~~CAAA~~,~~kBAAA~~,~~GAAkB~~,~~kBAAlB~~","sourcesContent":["import * as React from 'react';\nimport { ARIAButtonSlotProps, useARIAButtonShorthand } from '@fluentui/react-aria';\nimport { getNativeElementProps, resolveShorthand } from '@fluentui/react-utilities';\nimport type { ButtonProps, ButtonState } from './Button.types';\n\n/*\n Given user props, defines default props for the Button, calls useButtonState, and returns 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 useButton_unstable = (\n props: ButtonProps,\n ref: React.Ref<HTMLButtonElement \| HTMLAnchorElement>,\n): ButtonState => {\n const {\n appearance = 'secondary',\n as = 'button',\n disabled = false,\n disabledFocusable = false,\n icon,\n iconPosition = 'before',\n shape = 'rounded',\n size = 'medium',\n } = props;\n const iconShorthand = resolveShorthand(icon);\n\n return {\n // Props passed at the top-level\n appearance,\n disabled,\n disabledFocusable,\n iconPosition,\n shape,\n size,\n\n // State calculated from a set of props\n iconOnly: Boolean(iconShorthand?.children && !props.children),\n\n // Slots definition\n components: {\n root: 'button',\n icon: 'span',\n },\n\n root: getNativeElementProps(\n as,\n useARIAButtonShorthand<ARIAButtonSlotProps<'a'>>(props, {\n required: true,\n defaultProps: {\n ref: ref as React.Ref<HTMLButtonElement & HTMLAnchorElement>,\n type: 'button',\n },\n }),\n ),\n icon: iconShorthand,\n };\n};\n"]~~,"sourceRoot":"../src/"~~}
1	+ {"version":3,"mappings":";;;;;;AACA;AACA;AAGA;;;;;AAKO,MAAMA,kBAAkB,GAAG,CAChCC,KAAkB,EAClBC,GAAqD,KACtC;EACf,MAAM;IACJC,UAAU,GAAG,WAAW;IACxBC,EAAE,GAAG,QAAQ;IACbC,QAAQ,GAAG,KAAK;IAChBC,iBAAiB,GAAG,KAAK;IACzBC,IAAI;IACJC,YAAY,GAAG,QAAQ;IACvBC,KAAK,GAAG,SAAS;IACjBC,IAAI,GAAG;EAAQ,CAChB,GAAGT,KAAK;EACT,MAAMU,aAAa,GAAGC,kCAAgB,CAACL,IAAI,CAAC;EAE5C,OAAO;IACL;IACAJ,UAAU;IACVE,QAAQ;IACRC,iBAAiB;IACjBE,YAAY;IACZC,KAAK;IACLC,IAAI;IAEJ;IACAG,QAAQ,EAAEC,OAAO,CAAC,cAAa,aAAbH,aAAa,uBAAbA,aAAa,CAAEI,QAAQ,KAAI,CAACd,KAAK,CAACc,QAAQ,CAAC;IAE7D;IACAC,UAAU,EAAE;MACVC,IAAI,EAAE,QAAQ;MACdV,IAAI,EAAE;KACP;IAEDU,IAAI,EAAEL,uCAAqB,CACzBR,EAAE,EACFc,mCAAsB,CAA2BjB,KAAK,EAAE;MACtDkB,QAAQ,EAAE,IAAI;MACdC,YAAY,EAAE;QACZlB,GAAG,EAAEA,GAAuD;QAC5DmB,IAAI,EAAE;;KAET,CAAC,CACH;IACDd,IAAI,EAAEI;GACP;AACH,CAAC;AA9CYW,0BAAkB","names":["useButton_unstable","props","ref","appearance","as","disabled","disabledFocusable","icon","iconPosition","shape","size","iconShorthand","react_utilities_1","iconOnly","Boolean","children","components","root","react_aria_1","required","defaultProps","type","exports"],"sourceRoot":"../src/","sources":["packages/react-components/react-button/src/components/Button/useButton.ts"],"sourcesContent":["import * as React from 'react';\nimport { ARIAButtonSlotProps, useARIAButtonShorthand } from '@fluentui/react-aria';\nimport { getNativeElementProps, resolveShorthand } from '@fluentui/react-utilities';\nimport type { ButtonProps, ButtonState } from './Button.types';\n\n/*\n Given user props, defines default props for the Button, calls useButtonState, and returns 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 useButton_unstable = (\n props: ButtonProps,\n ref: React.Ref<HTMLButtonElement \| HTMLAnchorElement>,\n): ButtonState => {\n const {\n appearance = 'secondary',\n as = 'button',\n disabled = false,\n disabledFocusable = false,\n icon,\n iconPosition = 'before',\n shape = 'rounded',\n size = 'medium',\n } = props;\n const iconShorthand = resolveShorthand(icon);\n\n return {\n // Props passed at the top-level\n appearance,\n disabled,\n disabledFocusable,\n iconPosition,\n shape,\n size,\n\n // State calculated from a set of props\n iconOnly: Boolean(iconShorthand?.children && !props.children),\n\n // Slots definition\n components: {\n root: 'button',\n icon: 'span',\n },\n\n root: getNativeElementProps(\n as,\n useARIAButtonShorthand<ARIAButtonSlotProps<'a'>>(props, {\n required: true,\n defaultProps: {\n ref: ref as React.Ref<HTMLButtonElement & HTMLAnchorElement>,\n type: 'button',\n },\n }),\n ),\n icon: iconShorthand,\n };\n};\n"]}