@fluentui/react-button 0.0.0-nightly-20230223-0420.1 → 0.0.0-nightly-20230223-2115.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (134) hide show
  1. package/.swcrc +33 -0
  2. package/CHANGELOG.json +15 -15
  3. package/CHANGELOG.md +10 -10
  4. package/lib/Button.js.map +1 -1
  5. package/lib/CompoundButton.js.map +1 -1
  6. package/lib/MenuButton.js.map +1 -1
  7. package/lib/SplitButton.js.map +1 -1
  8. package/lib/ToggleButton.js.map +1 -1
  9. package/lib/components/Button/Button.js.map +1 -1
  10. package/lib/components/Button/Button.types.js.map +1 -1
  11. package/lib/components/Button/index.js.map +1 -1
  12. package/lib/components/Button/renderButton.js +2 -7
  13. package/lib/components/Button/renderButton.js.map +1 -1
  14. package/lib/components/Button/useButton.js +2 -1
  15. package/lib/components/Button/useButton.js.map +1 -1
  16. package/lib/components/Button/useButtonStyles.js.map +1 -1
  17. package/lib/components/CompoundButton/CompoundButton.js.map +1 -1
  18. package/lib/components/CompoundButton/CompoundButton.types.js.map +1 -1
  19. package/lib/components/CompoundButton/index.js.map +1 -1
  20. package/lib/components/CompoundButton/renderCompoundButton.js +2 -11
  21. package/lib/components/CompoundButton/renderCompoundButton.js.map +1 -1
  22. package/lib/components/CompoundButton/useCompoundButton.js +9 -7
  23. package/lib/components/CompoundButton/useCompoundButton.js.map +1 -1
  24. package/lib/components/CompoundButton/useCompoundButtonStyles.js.map +1 -1
  25. package/lib/components/MenuButton/MenuButton.js.map +1 -1
  26. package/lib/components/MenuButton/MenuButton.types.js.map +1 -1
  27. package/lib/components/MenuButton/index.js.map +1 -1
  28. package/lib/components/MenuButton/renderMenuButton.js +2 -7
  29. package/lib/components/MenuButton/renderMenuButton.js.map +1 -1
  30. package/lib/components/MenuButton/useMenuButton.js +6 -6
  31. package/lib/components/MenuButton/useMenuButton.js.map +1 -1
  32. package/lib/components/MenuButton/useMenuButtonStyles.js.map +1 -1
  33. package/lib/components/SplitButton/SplitButton.js.map +1 -1
  34. package/lib/components/SplitButton/SplitButton.types.js.map +1 -1
  35. package/lib/components/SplitButton/index.js.map +1 -1
  36. package/lib/components/SplitButton/renderSplitButton.js +2 -7
  37. package/lib/components/SplitButton/renderSplitButton.js.map +1 -1
  38. package/lib/components/SplitButton/useSplitButton.js +1 -0
  39. package/lib/components/SplitButton/useSplitButton.js.map +1 -1
  40. package/lib/components/SplitButton/useSplitButtonStyles.js.map +1 -1
  41. package/lib/components/ToggleButton/ToggleButton.js.map +1 -1
  42. package/lib/components/ToggleButton/ToggleButton.types.js.map +1 -1
  43. package/lib/components/ToggleButton/index.js.map +1 -1
  44. package/lib/components/ToggleButton/renderToggleButton.js.map +1 -1
  45. package/lib/components/ToggleButton/useToggleButton.js +1 -0
  46. package/lib/components/ToggleButton/useToggleButton.js.map +1 -1
  47. package/lib/components/ToggleButton/useToggleButtonStyles.js.map +1 -1
  48. package/lib/contexts/ButtonContext.js +1 -4
  49. package/lib/contexts/ButtonContext.js.map +1 -1
  50. package/lib/contexts/index.js.map +1 -1
  51. package/lib/index.js.map +1 -1
  52. package/lib/utils/index.js.map +1 -1
  53. package/lib/utils/useToggleState.js.map +1 -1
  54. package/lib-commonjs/Button.js +5 -4
  55. package/lib-commonjs/Button.js.map +1 -1
  56. package/lib-commonjs/CompoundButton.js +5 -4
  57. package/lib-commonjs/CompoundButton.js.map +1 -1
  58. package/lib-commonjs/MenuButton.js +5 -4
  59. package/lib-commonjs/MenuButton.js.map +1 -1
  60. package/lib-commonjs/SplitButton.js +5 -4
  61. package/lib-commonjs/SplitButton.js.map +1 -1
  62. package/lib-commonjs/ToggleButton.js +5 -4
  63. package/lib-commonjs/ToggleButton.js.map +1 -1
  64. package/lib-commonjs/components/Button/Button.js +16 -16
  65. package/lib-commonjs/components/Button/Button.js.map +1 -1
  66. package/lib-commonjs/components/Button/Button.types.js +3 -2
  67. package/lib-commonjs/components/Button/Button.types.js.map +1 -1
  68. package/lib-commonjs/components/Button/index.js +17 -19
  69. package/lib-commonjs/components/Button/index.js.map +1 -1
  70. package/lib-commonjs/components/Button/renderButton.js +16 -26
  71. package/lib-commonjs/components/Button/renderButton.js.map +1 -1
  72. package/lib-commonjs/components/Button/useButton.js +40 -52
  73. package/lib-commonjs/components/Button/useButton.js.map +1 -1
  74. package/lib-commonjs/components/Button/useButtonStyles.js +1129 -471
  75. package/lib-commonjs/components/Button/useButtonStyles.js.map +1 -1
  76. package/lib-commonjs/components/CompoundButton/CompoundButton.js +16 -16
  77. package/lib-commonjs/components/CompoundButton/CompoundButton.js.map +1 -1
  78. package/lib-commonjs/components/CompoundButton/CompoundButton.types.js +3 -2
  79. package/lib-commonjs/components/CompoundButton/CompoundButton.types.js.map +1 -1
  80. package/lib-commonjs/components/CompoundButton/index.js +18 -20
  81. package/lib-commonjs/components/CompoundButton/index.js.map +1 -1
  82. package/lib-commonjs/components/CompoundButton/renderCompoundButton.js +16 -30
  83. package/lib-commonjs/components/CompoundButton/renderCompoundButton.js.map +1 -1
  84. package/lib-commonjs/components/CompoundButton/useCompoundButton.js +32 -36
  85. package/lib-commonjs/components/CompoundButton/useCompoundButton.js.map +1 -1
  86. package/lib-commonjs/components/CompoundButton/useCompoundButtonStyles.js +315 -184
  87. package/lib-commonjs/components/CompoundButton/useCompoundButtonStyles.js.map +1 -1
  88. package/lib-commonjs/components/MenuButton/MenuButton.js +16 -17
  89. package/lib-commonjs/components/MenuButton/MenuButton.js.map +1 -1
  90. package/lib-commonjs/components/MenuButton/MenuButton.types.js +3 -2
  91. package/lib-commonjs/components/MenuButton/MenuButton.types.js.map +1 -1
  92. package/lib-commonjs/components/MenuButton/index.js +18 -20
  93. package/lib-commonjs/components/MenuButton/index.js.map +1 -1
  94. package/lib-commonjs/components/MenuButton/renderMenuButton.js +16 -26
  95. package/lib-commonjs/components/MenuButton/renderMenuButton.js.map +1 -1
  96. package/lib-commonjs/components/MenuButton/useMenuButton.js +34 -37
  97. package/lib-commonjs/components/MenuButton/useMenuButton.js.map +1 -1
  98. package/lib-commonjs/components/MenuButton/useMenuButtonStyles.js +166 -106
  99. package/lib-commonjs/components/MenuButton/useMenuButtonStyles.js.map +1 -1
  100. package/lib-commonjs/components/SplitButton/SplitButton.js +16 -17
  101. package/lib-commonjs/components/SplitButton/SplitButton.js.map +1 -1
  102. package/lib-commonjs/components/SplitButton/SplitButton.types.js +3 -2
  103. package/lib-commonjs/components/SplitButton/SplitButton.types.js.map +1 -1
  104. package/lib-commonjs/components/SplitButton/index.js +18 -20
  105. package/lib-commonjs/components/SplitButton/index.js.map +1 -1
  106. package/lib-commonjs/components/SplitButton/renderSplitButton.js +15 -22
  107. package/lib-commonjs/components/SplitButton/renderSplitButton.js.map +1 -1
  108. package/lib-commonjs/components/SplitButton/useSplitButton.js +66 -79
  109. package/lib-commonjs/components/SplitButton/useSplitButton.js.map +1 -1
  110. package/lib-commonjs/components/SplitButton/useSplitButtonStyles.js +263 -106
  111. package/lib-commonjs/components/SplitButton/useSplitButtonStyles.js.map +1 -1
  112. package/lib-commonjs/components/ToggleButton/ToggleButton.js +16 -16
  113. package/lib-commonjs/components/ToggleButton/ToggleButton.js.map +1 -1
  114. package/lib-commonjs/components/ToggleButton/ToggleButton.types.js +3 -2
  115. package/lib-commonjs/components/ToggleButton/ToggleButton.types.js.map +1 -1
  116. package/lib-commonjs/components/ToggleButton/index.js +18 -20
  117. package/lib-commonjs/components/ToggleButton/index.js.map +1 -1
  118. package/lib-commonjs/components/ToggleButton/renderToggleButton.js +6 -8
  119. package/lib-commonjs/components/ToggleButton/renderToggleButton.js.map +1 -1
  120. package/lib-commonjs/components/ToggleButton/useToggleButton.js +14 -16
  121. package/lib-commonjs/components/ToggleButton/useToggleButton.js.map +1 -1
  122. package/lib-commonjs/components/ToggleButton/useToggleButtonStyles.js +897 -380
  123. package/lib-commonjs/components/ToggleButton/useToggleButtonStyles.js.map +1 -1
  124. package/lib-commonjs/contexts/ButtonContext.js +17 -19
  125. package/lib-commonjs/contexts/ButtonContext.js.map +1 -1
  126. package/lib-commonjs/contexts/index.js +5 -4
  127. package/lib-commonjs/contexts/index.js.map +1 -1
  128. package/lib-commonjs/index.js +47 -179
  129. package/lib-commonjs/index.js.map +1 -1
  130. package/lib-commonjs/utils/index.js +5 -4
  131. package/lib-commonjs/utils/index.js.map +1 -1
  132. package/lib-commonjs/utils/useToggleState.js +40 -40
  133. package/lib-commonjs/utils/useToggleState.js.map +1 -1
  134. package/package.json +9 -9
@@ -1,3 +1,4 @@
1
+ import _extends from "@swc/helpers/src/_extends.mjs";
1
2
  import * as React from 'react';
2
3
  import { getSlots } from '@fluentui/react-utilities';
3
4
  /**
@@ -12,12 +13,6 @@ export const renderMenuButton_unstable = state => {
12
13
  icon,
13
14
  iconOnly
14
15
  } = state;
15
- return /*#__PURE__*/React.createElement(slots.root, {
16
- ...slotProps.root
17
- }, slots.icon && /*#__PURE__*/React.createElement(slots.icon, {
18
- ...slotProps.icon
19
- }), !iconOnly && slotProps.root.children, (!iconOnly || !(icon === null || icon === void 0 ? void 0 : icon.children)) && slots.menuIcon && /*#__PURE__*/React.createElement(slots.menuIcon, {
20
- ...slotProps.menuIcon
21
- }));
16
+ return /*#__PURE__*/React.createElement(slots.root, _extends({}, slotProps.root), slots.icon && /*#__PURE__*/React.createElement(slots.icon, _extends({}, slotProps.icon)), !iconOnly && slotProps.root.children, (!iconOnly || !(icon === null || icon === void 0 ? void 0 : icon.children)) && slots.menuIcon && /*#__PURE__*/React.createElement(slots.menuIcon, _extends({}, slotProps.menuIcon)));
22
17
  };
23
18
  //# sourceMappingURL=renderMenuButton.js.map
@@ -1 +1 @@
1
- {"version":3,"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,QAAQ,QAAQ,2BAA2B;AAGpD;;;AAGA,OAAO,MAAMC,yBAAyB,GAAIC,KAAsB,IAAI;EAClE,MAAM;IAAEC,KAAK;IAAEC;EAAS,CAAE,GAAGJ,QAAQ,CAAkBE,KAAK,CAAC;EAC7D,MAAM;IAAEG,IAAI;IAAEC;EAAQ,CAAE,GAAGJ,KAAK;EAEhC,oBACEH,oBAACI,KAAK,CAACI,IAAI;IAAA,GAAKH,SAAS,CAACG;EAAI,GAC3BJ,KAAK,CAACE,IAAI,iBAAIN,oBAACI,KAAK,CAACE,IAAI;IAAA,GAAKD,SAAS,CAACC;EAAI,EAAI,EAChD,CAACC,QAAQ,IAAIF,SAAS,CAACG,IAAI,CAACC,QAAQ,EACpC,CAAC,CAACF,QAAQ,IAAI,EAACD,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAEG,QAAQ,MAAKL,KAAK,CAACM,QAAQ,iBAAIV,oBAACI,KAAK,CAACM,QAAQ;IAAA,GAAKL,SAAS,CAACK;EAAQ,EAAI,CACpF;AAEjB,CAAC","names":["React","getSlots","renderMenuButton_unstable","state","slots","slotProps","icon","iconOnly","root","children","menuIcon"],"sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-button/src/components/MenuButton/renderMenuButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { MenuButtonSlots, MenuButtonState } from './MenuButton.types';\n\n/**\n * Renders a MenuButton component by passing the state defined props to the appropriate slots.\n */\nexport const renderMenuButton_unstable = (state: MenuButtonState) => {\n const { slots, slotProps } = getSlots<MenuButtonSlots>(state);\n const { icon, iconOnly } = state;\n\n return (\n <slots.root {...slotProps.root}>\n {slots.icon && <slots.icon {...slotProps.icon} />}\n {!iconOnly && slotProps.root.children}\n {(!iconOnly || !icon?.children) && slots.menuIcon && <slots.menuIcon {...slotProps.menuIcon} />}\n </slots.root>\n );\n};\n"]}
1
+ {"version":3,"mappings":";AAAA,YAAYA,WAAW;AACvB,SAASC,QAAQ,QAAQ;AAGzB;;;AAGA,OAAO,MAAMC,4BAA6BC,SAA2B;EACnE,MAAM;IAAEC;IAAOC;EAAS,CAAE,GAAGJ,SAA0BE;EACvD,MAAM;IAAEG;IAAMC;EAAQ,CAAE,GAAGJ;EAE3B,oBACEH,oBAACI,MAAMI,IAAI,eAAKH,UAAUG,IAAI,GAC3BJ,MAAME,IAAI,iBAAIN,oBAACI,MAAME,IAAI,eAAKD,UAAUC,IAAI,IAC5C,CAACC,YAAYF,UAAUG,IAAI,CAACC,QAAQ,EACpC,CAAC,CAACF,YAAY,EAACD,iDAAMG,QAAQ,CAAD,KAAML,MAAMM,QAAQ,iBAAIV,oBAACI,MAAMM,QAAQ,eAAKL,UAAUK,QAAQ;AAGjG","names":["React","getSlots","renderMenuButton_unstable","state","slots","slotProps","icon","iconOnly","root","children","menuIcon"],"sources":["../../../src/components/MenuButton/renderMenuButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { MenuButtonSlots, MenuButtonState } from './MenuButton.types';\n\n/**\n * Renders a MenuButton component by passing the state defined props to the appropriate slots.\n */\nexport const renderMenuButton_unstable = (state: MenuButtonState) => {\n const { slots, slotProps } = getSlots<MenuButtonSlots>(state);\n const { icon, iconOnly } = state;\n\n return (\n <slots.root {...slotProps.root}>\n {slots.icon && <slots.icon {...slotProps.icon} />}\n {!iconOnly && slotProps.root.children}\n {(!iconOnly || !icon?.children) && slots.menuIcon && <slots.menuIcon {...slotProps.menuIcon} />}\n </slots.root>\n );\n};\n"]}
@@ -5,13 +5,13 @@ import { useButton_unstable } from '../Button/index';
5
5
  /**
6
6
  * Given user props, returns the final state for a MenuButton.
7
7
  */
8
- export const useMenuButton_unstable = ({
9
- menuIcon,
10
- ...props
11
- }, ref) => {
12
- var _a;
8
+ export const useMenuButton_unstable = (param, ref) => {
9
+ let {
10
+ menuIcon,
11
+ ...props
12
+ } = param;
13
13
  const buttonState = useButton_unstable(props, ref);
14
- buttonState.root['aria-expanded'] = (_a = props['aria-expanded']) !== null && _a !== void 0 ? _a : false;
14
+ buttonState.root['aria-expanded'] = props['aria-expanded'] ?? false;
15
15
  return {
16
16
  // Button state
17
17
  ...buttonState,
@@ -1 +1 @@
1
- {"version":3,"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,kBAAkB,QAAQ,uBAAuB;AAC1D,SAASC,gBAAgB,QAAQ,2BAA2B;AAC5D,SAASC,kBAAkB,QAAQ,iBAAiB;AAGpD;;;AAGA,OAAO,MAAMC,sBAAsB,GAAG,CACpC;EAAEC,QAAQ;EAAE,GAAGC;AAAK,CAAmB,EACvCC,GAAqD,KAClC;;EACnB,MAAMC,WAAW,GAAGL,kBAAkB,CAACG,KAAK,EAAEC,GAAG,CAAC;EAClDC,WAAW,CAACC,IAAI,CAAC,eAAe,CAAC,GAAG,WAAK,CAAC,eAAe,CAAC,mCAAI,KAAK;EAEnE,OAAO;IACL;IACA,GAAGD,WAAW;IAEd;IACAE,QAAQ,EAAEC,OAAO,CAAC,CAACL,KAAK,CAACM,QAAQ,CAAC;IAElC;IACAC,UAAU,EAAE;MACVJ,IAAI,EAAE,QAAQ;MACdK,IAAI,EAAE,MAAM;MACZT,QAAQ,EAAE;KACX;IAEDA,QAAQ,EAAEH,gBAAgB,CAACG,QAAQ,EAAE;MACnCU,YAAY,EAAE;QACZH,QAAQ,eAAEZ,oBAACC,kBAAkB;OAC9B;MACDe,QAAQ,EAAE;KACX;GACF;AACH,CAAC","names":["React","ChevronDownRegular","resolveShorthand","useButton_unstable","useMenuButton_unstable","menuIcon","props","ref","buttonState","root","iconOnly","Boolean","children","components","icon","defaultProps","required"],"sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-button/src/components/MenuButton/useMenuButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { ChevronDownRegular } from '@fluentui/react-icons';\nimport { resolveShorthand } from '@fluentui/react-utilities';\nimport { useButton_unstable } from '../Button/index';\nimport type { MenuButtonProps, MenuButtonState } from './MenuButton.types';\n\n/**\n * Given user props, returns the final state for a MenuButton.\n */\nexport const useMenuButton_unstable = (\n { menuIcon, ...props }: MenuButtonProps,\n ref: React.Ref<HTMLButtonElement | HTMLAnchorElement>,\n): MenuButtonState => {\n const buttonState = useButton_unstable(props, ref);\n buttonState.root['aria-expanded'] = props['aria-expanded'] ?? false;\n\n return {\n // Button state\n ...buttonState,\n\n // State calculated from a set of props\n iconOnly: Boolean(!props.children),\n\n // Slots definition\n components: {\n root: 'button',\n icon: 'span',\n menuIcon: 'span',\n },\n\n menuIcon: resolveShorthand(menuIcon, {\n defaultProps: {\n children: <ChevronDownRegular />,\n },\n required: true,\n }),\n };\n};\n"]}
1
+ {"version":3,"mappings":"AAAA,YAAYA,WAAW;AACvB,SAASC,kBAAkB,QAAQ;AACnC,SAASC,gBAAgB,QAAQ;AACjC,SAASC,kBAAkB,QAAQ;AAGnC;;;AAGA,OAAO,MAAMC,yBAAyB,QAEpCC,QACoB;MAFpB;IAAEC;IAAU,GAAGC;EAAAA,CAAwB;EAGvC,MAAMC,cAAcL,mBAAmBI,OAAOF;EAC9CG,YAAYC,IAAI,CAAC,gBAAgB,GAAGF,KAAK,CAAC,gBAAgB,IAAI,KAAK;EAEnE,OAAO;IACL;IACA,GAAGC,WAAW;IAEd;IACAE,UAAUC,QAAQ,CAACJ,MAAMK,QAAQ;IAEjC;IACAC,YAAY;MACVJ,MAAM;MACNK,MAAM;MACNR,UAAU;IACZ;IAEAA,UAAUJ,iBAAiBI,UAAU;MACnCS,cAAc;QACZH,uBAAUZ,oBAACC;MACb;MACAe,UAAU;IACZ;EACF;AACF","names":["React","ChevronDownRegular","resolveShorthand","useButton_unstable","useMenuButton_unstable","ref","menuIcon","props","buttonState","root","iconOnly","Boolean","children","components","icon","defaultProps","required"],"sources":["../../../src/components/MenuButton/useMenuButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { ChevronDownRegular } from '@fluentui/react-icons';\nimport { resolveShorthand } from '@fluentui/react-utilities';\nimport { useButton_unstable } from '../Button/index';\nimport type { MenuButtonProps, MenuButtonState } from './MenuButton.types';\n\n/**\n * Given user props, returns the final state for a MenuButton.\n */\nexport const useMenuButton_unstable = (\n { menuIcon, ...props }: MenuButtonProps,\n ref: React.Ref<HTMLButtonElement | HTMLAnchorElement>,\n): MenuButtonState => {\n const buttonState = useButton_unstable(props, ref);\n buttonState.root['aria-expanded'] = props['aria-expanded'] ?? false;\n\n return {\n // Button state\n ...buttonState,\n\n // State calculated from a set of props\n iconOnly: Boolean(!props.children),\n\n // Slots definition\n components: {\n root: 'button',\n icon: 'span',\n menuIcon: 'span',\n },\n\n menuIcon: resolveShorthand(menuIcon, {\n defaultProps: {\n children: <ChevronDownRegular />,\n },\n required: true,\n }),\n };\n};\n"]}
@@ -1 +1 @@
1
- {"version":3,"mappings":"AAAA,SAASA,mBAAmB,EAAEC,oBAAoB,QAAQ,uBAAuB;AACjF,SAASC,MAAM,QAAQ,uBAAuB;AAE9C,SAASC,YAAY,YAAcC,UAAU,QAAQ,gBAAgB;AACrE,SAASC,wBAAwB,QAAQ,2BAA2B;AAGpE,OAAO,MAAMC,oBAAoB,GAAoC;EACnEC,IAAI,EAAE,gBAAgB;EACtBC,IAAI,EAAE,sBAAsB;EAC5BC,QAAQ,EAAE;CACX;AAED,MAAMC,qBAAqB,gBAAG;EAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;EAAA;AAAA;EAAA;AAAA,EAgC5B;AAEF,MAAMC,qBAAqB,gBAAG;EAAA;IAAA;EAAA;EAAA;EAAA;IAAA;EAAA;EAAA;IAAA;EAAA;EAAA;IAAA;EAAA;AAAA;EAAA;AAAA,EAiB5B;AAEF,MAAMC,iBAAiB,gBAAG;EAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;EAAA;AAAA;EAAA;AAAA,EA6BxB;AAEF,OAAO,MAAMC,4BAA4B,GAAIC,KAAsB,IAAqB;EACtF,MAAMC,kBAAkB,GAAGL,qBAAqB,EAAE;EAClD,MAAMM,kBAAkB,GAAGL,qBAAqB,EAAE;EAClD,MAAMM,cAAc,GAAGL,iBAAiB,EAAE;EAE1CE,KAAK,CAACP,IAAI,CAACW,SAAS,GAAGf,YAAY,CACjCG,oBAAoB,CAACC,IAAI,EACzBO,KAAK,CAACP,IAAI,CAAC,eAAe,CAAC,IAAIQ,kBAAkB,CAACI,IAAI,EACtDL,KAAK,CAACP,IAAI,CAAC,eAAe,CAAC,IAAIQ,kBAAkB,CAACD,KAAK,CAACM,UAAU,CAAC,EACnEN,KAAK,CAACP,IAAI,CAACW,SAAS,CACrB;EAED,IAAIJ,KAAK,CAACN,IAAI,EAAE;IACdM,KAAK,CAACN,IAAI,CAACU,SAAS,GAAGf,YAAY,CACjCG,oBAAoB,CAACE,IAAI,EACzBM,KAAK,CAACP,IAAI,CAAC,eAAe,CAAC,IAAIS,kBAAkB,CAACF,KAAK,CAACM,UAAU,CAAC,EACnEN,KAAK,CAACN,IAAI,CAACU,SAAS,CACrB;;EAGH,IAAIJ,KAAK,CAACL,QAAQ,EAAE;IAClBK,KAAK,CAACL,QAAQ,CAACS,SAAS,GAAGf,YAAY,CACrCG,oBAAoB,CAACG,QAAQ,EAC7BQ,cAAc,CAACE,IAAI,EACnBF,cAAc,CAACH,KAAK,CAACO,IAAI,CAAC,EAC1B,CAACP,KAAK,CAACQ,QAAQ,IAAIL,cAAc,CAACM,WAAW,EAC7CT,KAAK,CAACL,QAAQ,CAACS,SAAS,CACzB;;EAGHb,wBAAwB,CAAC;IAAE,GAAGS,KAAK;IAAEU,YAAY,EAAE;EAAQ,CAAE,CAAC;EAE9D,OAAOV,KAAK;AACd,CAAC","names":["iconFilledClassName","iconRegularClassName","tokens","mergeClasses","shorthands","useButtonStyles_unstable","menuButtonClassNames","root","icon","menuIcon","useRootExpandedStyles","useIconExpandedStyles","useMenuIconStyles","useMenuButtonStyles_unstable","state","rootExpandedStyles","iconExpandedStyles","menuIconStyles","className","base","appearance","size","iconOnly","notIconOnly","iconPosition"],"sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-button/src/components/MenuButton/useMenuButtonStyles.ts"],"sourcesContent":["import { iconFilledClassName, iconRegularClassName } from '@fluentui/react-icons';\nimport { tokens } from '@fluentui/react-theme';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { mergeClasses, makeStyles, shorthands } from '@griffel/react';\nimport { useButtonStyles_unstable } from '../Button/useButtonStyles';\nimport type { MenuButtonSlots, MenuButtonState } from './MenuButton.types';\n\nexport const menuButtonClassNames: SlotClassNames<MenuButtonSlots> = {\n root: 'fui-MenuButton',\n icon: 'fui-MenuButton__icon',\n menuIcon: 'fui-MenuButton__menuIcon',\n};\n\nconst useRootExpandedStyles = makeStyles({\n base: {\n [`& .${iconFilledClassName}`]: {\n display: 'inline',\n },\n [`& .${iconRegularClassName}`]: {\n display: 'none',\n },\n },\n\n // Appearance variations\n outline: {\n ...shorthands.borderColor(tokens.colorNeutralStroke1Selected),\n ...shorthands.borderWidth(tokens.strokeWidthThicker),\n color: tokens.colorNeutralForeground1Selected,\n },\n primary: {\n backgroundColor: tokens.colorBrandBackgroundSelected,\n },\n secondary: {\n backgroundColor: tokens.colorNeutralBackground1Selected,\n ...shorthands.borderColor(tokens.colorNeutralStroke1Selected),\n color: tokens.colorNeutralForeground1Selected,\n },\n subtle: {\n backgroundColor: tokens.colorSubtleBackgroundSelected,\n color: tokens.colorNeutralForeground2Selected,\n },\n transparent: {\n backgroundColor: tokens.colorTransparentBackgroundSelected,\n color: tokens.colorNeutralForeground2BrandSelected,\n },\n});\n\nconst useIconExpandedStyles = makeStyles({\n // Appearance variations\n outline: {\n color: tokens.colorNeutralForeground1Selected,\n },\n primary: {\n /* The primary styles are exactly the same as the base styles. */\n },\n secondary: {\n color: tokens.colorNeutralForeground1Selected,\n },\n subtle: {\n color: tokens.colorNeutralForeground2BrandSelected,\n },\n transparent: {\n color: tokens.colorNeutralForeground2BrandSelected,\n },\n});\n\nconst useMenuIconStyles = makeStyles({\n base: {\n lineHeight: 0,\n },\n\n // Size appearance\n small: {\n fontSize: '12px',\n height: '12px',\n lineHeight: tokens.lineHeightBase200,\n width: '12px',\n },\n medium: {\n fontSize: '12px',\n height: '12px',\n lineHeight: tokens.lineHeightBase200,\n width: '12px',\n },\n large: {\n fontSize: '16px',\n height: '16px',\n lineHeight: tokens.lineHeightBase400,\n width: '16px',\n },\n\n // Not-icon only\n notIconOnly: {\n marginLeft: tokens.spacingHorizontalXS,\n },\n});\n\nexport const useMenuButtonStyles_unstable = (state: MenuButtonState): MenuButtonState => {\n const rootExpandedStyles = useRootExpandedStyles();\n const iconExpandedStyles = useIconExpandedStyles();\n const menuIconStyles = useMenuIconStyles();\n\n state.root.className = mergeClasses(\n menuButtonClassNames.root,\n state.root['aria-expanded'] && rootExpandedStyles.base,\n state.root['aria-expanded'] && rootExpandedStyles[state.appearance],\n state.root.className,\n );\n\n if (state.icon) {\n state.icon.className = mergeClasses(\n menuButtonClassNames.icon,\n state.root['aria-expanded'] && iconExpandedStyles[state.appearance],\n state.icon.className,\n );\n }\n\n if (state.menuIcon) {\n state.menuIcon.className = mergeClasses(\n menuButtonClassNames.menuIcon,\n menuIconStyles.base,\n menuIconStyles[state.size],\n !state.iconOnly && menuIconStyles.notIconOnly,\n state.menuIcon.className,\n );\n }\n\n useButtonStyles_unstable({ ...state, iconPosition: 'before' });\n\n return state;\n};\n"]}
1
+ {"version":3,"mappings":"AAAA,SAASA,mBAAmB,EAAEC,oBAAoB,QAAQ;AAC1D,SAASC,MAAM,QAAQ;AAEvB,SAASC,YAAY,YAAcC,UAAU,QAAQ;AACrD,SAASC,wBAAwB,QAAQ;AAGzC,OAAO,MAAMC,uBAAwD;EACnEC,MAAM;EACNC,MAAM;EACNC,UAAU;AACZ;AAEA,MAAMC,qCAAwBC;EAAAA;IAAAA;IAAAA;EAAAA;EAAAA;IAAAA;IAAAA;IAAAA;IAAAA;IAAAA;IAAAA;IAAAA;IAAAA;IAAAA;EAAAA;EAAAA;IAAAA;EAAAA;EAAAA;IAAAA;IAAAA;IAAAA;IAAAA;IAAAA;IAAAA;EAAAA;EAAAA;IAAAA;IAAAA;EAAAA;EAAAA;IAAAA;IAAAA;EAAAA;AAAAA;EAAAA;AAAAA,EAgC9B;AAEA,MAAMC,qCAAwBD;EAAAA;IAAAA;EAAAA;EAAAA;EAAAA;IAAAA;EAAAA;EAAAA;IAAAA;EAAAA;EAAAA;IAAAA;EAAAA;AAAAA;EAAAA;AAAAA,EAiB9B;AAEA,MAAME,iCAAoBF;EAAAA;IAAAA;EAAAA;EAAAA;IAAAA;IAAAA;IAAAA;IAAAA;EAAAA;EAAAA;IAAAA;IAAAA;IAAAA;IAAAA;EAAAA;EAAAA;IAAAA;IAAAA;IAAAA;IAAAA;EAAAA;EAAAA;IAAAA;EAAAA;AAAAA;EAAAA;AAAAA,EA6B1B;AAEA,OAAO,MAAMG,+BAAgCC,SAA4C;EACvF,MAAMC,qBAAqBN;EAC3B,MAAMO,qBAAqBL;EAC3B,MAAMM,iBAAiBL;EAEvBE,MAAMR,IAAI,CAACY,SAAS,GAAGhB,aACrBG,qBAAqBC,IAAI,EACzBQ,MAAMR,IAAI,CAAC,gBAAgB,IAAIS,mBAAmBI,IAAI,EACtDL,MAAMR,IAAI,CAAC,gBAAgB,IAAIS,kBAAkB,CAACD,MAAMM,UAAU,CAAC,EACnEN,MAAMR,IAAI,CAACY,SAAS;EAGtB,IAAIJ,MAAMP,IAAI,EAAE;IACdO,MAAMP,IAAI,CAACW,SAAS,GAAGhB,aACrBG,qBAAqBE,IAAI,EACzBO,MAAMR,IAAI,CAAC,gBAAgB,IAAIU,kBAAkB,CAACF,MAAMM,UAAU,CAAC,EACnEN,MAAMP,IAAI,CAACW,SAAS;EAExB;EAEA,IAAIJ,MAAMN,QAAQ,EAAE;IAClBM,MAAMN,QAAQ,CAACU,SAAS,GAAGhB,aACzBG,qBAAqBG,QAAQ,EAC7BS,eAAeE,IAAI,EACnBF,cAAc,CAACH,MAAMO,IAAI,CAAC,EAC1B,CAACP,MAAMQ,QAAQ,IAAIL,eAAeM,WAAW,EAC7CT,MAAMN,QAAQ,CAACU,SAAS;EAE5B;EAEAd,yBAAyB;IAAE,GAAGU,KAAK;IAAEU,cAAc;EAAS;EAE5D,OAAOV;AACT","names":["iconFilledClassName","iconRegularClassName","tokens","mergeClasses","shorthands","useButtonStyles_unstable","menuButtonClassNames","root","icon","menuIcon","useRootExpandedStyles","makeStyles","useIconExpandedStyles","useMenuIconStyles","useMenuButtonStyles_unstable","state","rootExpandedStyles","iconExpandedStyles","menuIconStyles","className","base","appearance","size","iconOnly","notIconOnly","iconPosition"],"sources":["../../../src/components/MenuButton/useMenuButtonStyles.ts"],"sourcesContent":["import { iconFilledClassName, iconRegularClassName } from '@fluentui/react-icons';\nimport { tokens } from '@fluentui/react-theme';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { mergeClasses, makeStyles, shorthands } from '@griffel/react';\nimport { useButtonStyles_unstable } from '../Button/useButtonStyles';\nimport type { MenuButtonSlots, MenuButtonState } from './MenuButton.types';\n\nexport const menuButtonClassNames: SlotClassNames<MenuButtonSlots> = {\n root: 'fui-MenuButton',\n icon: 'fui-MenuButton__icon',\n menuIcon: 'fui-MenuButton__menuIcon',\n};\n\nconst useRootExpandedStyles = makeStyles({\n base: {\n [`& .${iconFilledClassName}`]: {\n display: 'inline',\n },\n [`& .${iconRegularClassName}`]: {\n display: 'none',\n },\n },\n\n // Appearance variations\n outline: {\n ...shorthands.borderColor(tokens.colorNeutralStroke1Selected),\n ...shorthands.borderWidth(tokens.strokeWidthThicker),\n color: tokens.colorNeutralForeground1Selected,\n },\n primary: {\n backgroundColor: tokens.colorBrandBackgroundSelected,\n },\n secondary: {\n backgroundColor: tokens.colorNeutralBackground1Selected,\n ...shorthands.borderColor(tokens.colorNeutralStroke1Selected),\n color: tokens.colorNeutralForeground1Selected,\n },\n subtle: {\n backgroundColor: tokens.colorSubtleBackgroundSelected,\n color: tokens.colorNeutralForeground2Selected,\n },\n transparent: {\n backgroundColor: tokens.colorTransparentBackgroundSelected,\n color: tokens.colorNeutralForeground2BrandSelected,\n },\n});\n\nconst useIconExpandedStyles = makeStyles({\n // Appearance variations\n outline: {\n color: tokens.colorNeutralForeground1Selected,\n },\n primary: {\n /* The primary styles are exactly the same as the base styles. */\n },\n secondary: {\n color: tokens.colorNeutralForeground1Selected,\n },\n subtle: {\n color: tokens.colorNeutralForeground2BrandSelected,\n },\n transparent: {\n color: tokens.colorNeutralForeground2BrandSelected,\n },\n});\n\nconst useMenuIconStyles = makeStyles({\n base: {\n lineHeight: 0,\n },\n\n // Size appearance\n small: {\n fontSize: '12px',\n height: '12px',\n lineHeight: tokens.lineHeightBase200,\n width: '12px',\n },\n medium: {\n fontSize: '12px',\n height: '12px',\n lineHeight: tokens.lineHeightBase200,\n width: '12px',\n },\n large: {\n fontSize: '16px',\n height: '16px',\n lineHeight: tokens.lineHeightBase400,\n width: '16px',\n },\n\n // Not-icon only\n notIconOnly: {\n marginLeft: tokens.spacingHorizontalXS,\n },\n});\n\nexport const useMenuButtonStyles_unstable = (state: MenuButtonState): MenuButtonState => {\n const rootExpandedStyles = useRootExpandedStyles();\n const iconExpandedStyles = useIconExpandedStyles();\n const menuIconStyles = useMenuIconStyles();\n\n state.root.className = mergeClasses(\n menuButtonClassNames.root,\n state.root['aria-expanded'] && rootExpandedStyles.base,\n state.root['aria-expanded'] && rootExpandedStyles[state.appearance],\n state.root.className,\n );\n\n if (state.icon) {\n state.icon.className = mergeClasses(\n menuButtonClassNames.icon,\n state.root['aria-expanded'] && iconExpandedStyles[state.appearance],\n state.icon.className,\n );\n }\n\n if (state.menuIcon) {\n state.menuIcon.className = mergeClasses(\n menuButtonClassNames.menuIcon,\n menuIconStyles.base,\n menuIconStyles[state.size],\n !state.iconOnly && menuIconStyles.notIconOnly,\n state.menuIcon.className,\n );\n }\n\n useButtonStyles_unstable({ ...state, iconPosition: 'before' });\n\n return state;\n};\n"]}
@@ -1 +1 @@
1
- {"version":3,"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,0BAA0B,QAAQ,qBAAqB;AAChE,SAASC,uBAAuB,QAAQ,kBAAkB;AAC1D,SAASC,6BAA6B,QAAQ,wBAAwB;AAItE;;;;AAIA,OAAO,MAAMC,WAAW,gBAA0CJ,KAAK,CAACK,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EAChG,MAAMC,KAAK,GAAGN,uBAAuB,CAACI,KAAK,EAAEC,GAAG,CAAC;EAEjDJ,6BAA6B,CAACK,KAAK,CAAC;EAEpC,OAAOP,0BAA0B,CAACO,KAAK,CAAC;EACxC;AACF,CAAC,CAA0C;;AAE3CJ,WAAW,CAACK,WAAW,GAAG,aAAa","names":["React","renderSplitButton_unstable","useSplitButton_unstable","useSplitButtonStyles_unstable","SplitButton","forwardRef","props","ref","state","displayName"],"sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-button/src/components/SplitButton/SplitButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { renderSplitButton_unstable } from './renderSplitButton';\nimport { useSplitButton_unstable } from './useSplitButton';\nimport { useSplitButtonStyles_unstable } from './useSplitButtonStyles';\nimport type { SplitButtonProps } from './SplitButton.types';\nimport { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * SplitButtons are a grouping of two interactive surfaces where interacting with the first one triggers a primary\n * action, while interacting with the second one opens a menu with secondary actions.\n */\nexport const SplitButton: ForwardRefComponent<SplitButtonProps> = React.forwardRef((props, ref) => {\n const state = useSplitButton_unstable(props, ref);\n\n useSplitButtonStyles_unstable(state);\n\n return renderSplitButton_unstable(state);\n // Casting is required due to lack of distributive union to support unions on @types/react\n}) as ForwardRefComponent<SplitButtonProps>;\n\nSplitButton.displayName = 'SplitButton';\n"]}
1
+ {"version":3,"mappings":"AAAA,YAAYA,WAAW;AACvB,SAASC,0BAA0B,QAAQ;AAC3C,SAASC,uBAAuB,QAAQ;AACxC,SAASC,6BAA6B,QAAQ;AAI9C;;;;AAIA,OAAO,MAAMC,2BAAqDJ,MAAMK,UAAU,CAAC,CAACC,OAAOC,QAAQ;EACjG,MAAMC,QAAQN,wBAAwBI,OAAOC;EAE7CJ,8BAA8BK;EAE9B,OAAOP,2BAA2BO;EAClC;AACF;;AAEAJ,YAAYK,WAAW,GAAG","names":["React","renderSplitButton_unstable","useSplitButton_unstable","useSplitButtonStyles_unstable","SplitButton","forwardRef","props","ref","state","displayName"],"sources":["../../../src/components/SplitButton/SplitButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { renderSplitButton_unstable } from './renderSplitButton';\nimport { useSplitButton_unstable } from './useSplitButton';\nimport { useSplitButtonStyles_unstable } from './useSplitButtonStyles';\nimport type { SplitButtonProps } from './SplitButton.types';\nimport { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * SplitButtons are a grouping of two interactive surfaces where interacting with the first one triggers a primary\n * action, while interacting with the second one opens a menu with secondary actions.\n */\nexport const SplitButton: ForwardRefComponent<SplitButtonProps> = React.forwardRef((props, ref) => {\n const state = useSplitButton_unstable(props, ref);\n\n useSplitButtonStyles_unstable(state);\n\n return renderSplitButton_unstable(state);\n // Casting is required due to lack of distributive union to support unions on @types/react\n}) as ForwardRefComponent<SplitButtonProps>;\n\nSplitButton.displayName = 'SplitButton';\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"SplitButton.types.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-button/src/components/SplitButton/SplitButton.types.ts"],"names":[],"mappings":"","sourcesContent":["import { Button } from '../Button/Button';\nimport { MenuButton } from '../MenuButton/MenuButton';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport type { ButtonProps, ButtonState } from '../Button/Button.types';\nimport type { MenuButtonProps, MenuButtonState } from '../MenuButton/MenuButton.types';\n\nexport type SplitButtonSlots = {\n /**\n * Root of the component that wraps the primary action button and menu button.\n */\n root: NonNullable<Slot<'div'>>;\n\n /**\n * Button that opens menu with secondary actions in SplitButton.\n */\n menuButton?: Slot<typeof MenuButton>;\n /**\n * Button to perform primary action in SplitButton.\n */\n primaryActionButton?: Slot<typeof Button>;\n};\n\nexport type SplitButtonProps = ComponentProps<SplitButtonSlots> &\n Omit<ButtonProps, 'root'> &\n Omit<MenuButtonProps, 'root'>;\n\nexport type SplitButtonState = ComponentState<SplitButtonSlots> &\n Omit<ButtonState, 'components' | 'iconOnly' | 'root'> &\n Omit<MenuButtonState, 'components' | 'iconOnly' | 'root'>;\n"]}
1
+ {"version":3,"mappings":"AAAA","names":[],"sources":["../../../src/components/SplitButton/SplitButton.types.ts"],"sourcesContent":["import { Button } from '../Button/Button';\nimport { MenuButton } from '../MenuButton/MenuButton';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport type { ButtonProps, ButtonState } from '../Button/Button.types';\nimport type { MenuButtonProps, MenuButtonState } from '../MenuButton/MenuButton.types';\n\nexport type SplitButtonSlots = {\n /**\n * Root of the component that wraps the primary action button and menu button.\n */\n root: NonNullable<Slot<'div'>>;\n\n /**\n * Button that opens menu with secondary actions in SplitButton.\n */\n menuButton?: Slot<typeof MenuButton>;\n /**\n * Button to perform primary action in SplitButton.\n */\n primaryActionButton?: Slot<typeof Button>;\n};\n\nexport type SplitButtonProps = ComponentProps<SplitButtonSlots> &\n Omit<ButtonProps, 'root'> &\n Omit<MenuButtonProps, 'root'>;\n\nexport type SplitButtonState = ComponentState<SplitButtonSlots> &\n Omit<ButtonState, 'components' | 'iconOnly' | 'root'> &\n Omit<MenuButtonState, 'components' | 'iconOnly' | 'root'>;\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-button/src/components/SplitButton/index.ts"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAC;AAC9B,cAAc,qBAAqB,CAAC;AACpC,cAAc,qBAAqB,CAAC;AACpC,cAAc,kBAAkB,CAAC;AACjC,OAAO,EAAE,qBAAqB,EAAE,6BAA6B,EAAE,MAAM,wBAAwB,CAAC","sourcesContent":["export * from './SplitButton';\nexport * from './SplitButton.types';\nexport * from './renderSplitButton';\nexport * from './useSplitButton';\nexport { splitButtonClassNames, useSplitButtonStyles_unstable } from './useSplitButtonStyles';\n"]}
1
+ {"version":3,"mappings":"AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,SAASA,qBAAqB,EAAEC,6BAA6B,QAAQ","names":["splitButtonClassNames","useSplitButtonStyles_unstable"],"sources":["../../../src/components/SplitButton/index.ts"],"sourcesContent":["export * from './SplitButton';\nexport * from './SplitButton.types';\nexport * from './renderSplitButton';\nexport * from './useSplitButton';\nexport { splitButtonClassNames, useSplitButtonStyles_unstable } from './useSplitButtonStyles';\n"]}
@@ -1,3 +1,4 @@
1
+ import _extends from "@swc/helpers/src/_extends.mjs";
1
2
  import * as React from 'react';
2
3
  import { getSlots } from '@fluentui/react-utilities';
3
4
  /**
@@ -8,12 +9,6 @@ export const renderSplitButton_unstable = state => {
8
9
  slots,
9
10
  slotProps
10
11
  } = getSlots(state);
11
- return /*#__PURE__*/React.createElement(slots.root, {
12
- ...slotProps.root
13
- }, slots.primaryActionButton && /*#__PURE__*/React.createElement(slots.primaryActionButton, {
14
- ...slotProps.primaryActionButton
15
- }), slots.menuButton && /*#__PURE__*/React.createElement(slots.menuButton, {
16
- ...slotProps.menuButton
17
- }));
12
+ return /*#__PURE__*/React.createElement(slots.root, _extends({}, slotProps.root), slots.primaryActionButton && /*#__PURE__*/React.createElement(slots.primaryActionButton, _extends({}, slotProps.primaryActionButton)), slots.menuButton && /*#__PURE__*/React.createElement(slots.menuButton, _extends({}, slotProps.menuButton)));
18
13
  };
19
14
  //# sourceMappingURL=renderSplitButton.js.map
@@ -1 +1 @@
1
- {"version":3,"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,QAAQ,QAAQ,2BAA2B;AAGpD;;;AAGA,OAAO,MAAMC,0BAA0B,GAAIC,KAAuB,IAAI;EACpE,MAAM;IAAEC,KAAK;IAAEC;EAAS,CAAE,GAAGJ,QAAQ,CAAmBE,KAAK,CAAC;EAE9D,oBACEH,oBAACI,KAAK,CAACE,IAAI;IAAA,GAAKD,SAAS,CAACC;EAAI,GAC3BF,KAAK,CAACG,mBAAmB,iBAAIP,oBAACI,KAAK,CAACG,mBAAmB;IAAA,GAAKF,SAAS,CAACE;EAAmB,EAAI,EAC7FH,KAAK,CAACI,UAAU,iBAAIR,oBAACI,KAAK,CAACI,UAAU;IAAA,GAAKH,SAAS,CAACG;EAAU,EAAI,CACxD;AAEjB,CAAC","names":["React","getSlots","renderSplitButton_unstable","state","slots","slotProps","root","primaryActionButton","menuButton"],"sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-button/src/components/SplitButton/renderSplitButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { SplitButtonSlots, SplitButtonState } from './SplitButton.types';\n\n/**\n * Renders a SplitButton component by passing the state defined props to the appropriate slots.\n */\nexport const renderSplitButton_unstable = (state: SplitButtonState) => {\n const { slots, slotProps } = getSlots<SplitButtonSlots>(state);\n\n return (\n <slots.root {...slotProps.root}>\n {slots.primaryActionButton && <slots.primaryActionButton {...slotProps.primaryActionButton} />}\n {slots.menuButton && <slots.menuButton {...slotProps.menuButton} />}\n </slots.root>\n );\n};\n"]}
1
+ {"version":3,"mappings":";AAAA,YAAYA,WAAW;AACvB,SAASC,QAAQ,QAAQ;AAGzB;;;AAGA,OAAO,MAAMC,6BAA8BC,SAA4B;EACrE,MAAM;IAAEC;IAAOC;EAAS,CAAE,GAAGJ,SAA2BE;EAExD,oBACEH,oBAACI,MAAME,IAAI,eAAKD,UAAUC,IAAI,GAC3BF,MAAMG,mBAAmB,iBAAIP,oBAACI,MAAMG,mBAAmB,eAAKF,UAAUE,mBAAmB,IACzFH,MAAMI,UAAU,iBAAIR,oBAACI,MAAMI,UAAU,eAAKH,UAAUG,UAAU;AAGrE","names":["React","getSlots","renderSplitButton_unstable","state","slots","slotProps","root","primaryActionButton","menuButton"],"sources":["../../../src/components/SplitButton/renderSplitButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { SplitButtonSlots, SplitButtonState } from './SplitButton.types';\n\n/**\n * Renders a SplitButton component by passing the state defined props to the appropriate slots.\n */\nexport const renderSplitButton_unstable = (state: SplitButtonState) => {\n const { slots, slotProps } = getSlots<SplitButtonSlots>(state);\n\n return (\n <slots.root {...slotProps.root}>\n {slots.primaryActionButton && <slots.primaryActionButton {...slotProps.primaryActionButton} />}\n {slots.menuButton && <slots.menuButton {...slotProps.menuButton} />}\n </slots.root>\n );\n};\n"]}
@@ -1,3 +1,4 @@
1
+ import * as React from 'react';
1
2
  import { getNativeElementProps, resolveShorthand, useId } from '@fluentui/react-utilities';
2
3
  import { Button } from '../Button/Button';
3
4
  import { MenuButton } from '../MenuButton/MenuButton';
@@ -1 +1 @@
1
- {"version":3,"mappings":"AACA,SAASA,qBAAqB,EAAEC,gBAAgB,EAAEC,KAAK,QAAQ,2BAA2B;AAC1F,SAASC,MAAM,QAAQ,kBAAkB;AACzC,SAASC,UAAU,QAAQ,0BAA0B;AAGrD;;;;;AAKA,OAAO,MAAMC,uBAAuB,GAAG,CACrCC,KAAuB,EACvBC,GAAqD,KACjC;EACpB,MAAM;IACJC,UAAU,GAAG,WAAW;IACxBC,QAAQ;IACRC,QAAQ,GAAG,KAAK;IAChBC,iBAAiB,GAAG,KAAK;IACzBC,IAAI;IACJC,YAAY,GAAG,QAAQ;IACvBC,UAAU;IACVC,QAAQ;IACRC,mBAAmB;IACnBC,KAAK,GAAG,SAAS;IACjBC,IAAI,GAAG;EAAQ,CAChB,GAAGZ,KAAK;EAET,MAAMa,MAAM,GAAGjB,KAAK,CAAC,cAAc,CAAC;EAEpC,MAAMkB,mBAAmB,GAAGnB,gBAAgB,CAACa,UAAU,EAAE;IACvDO,YAAY,EAAE;MACZb,UAAU;MACVE,QAAQ;MACRC,iBAAiB;MACjBI,QAAQ;MACRE,KAAK;MACLC;KACD;IACDI,QAAQ,EAAE;GACX,CAAC;EAEF,MAAMC,4BAA4B,GAAGtB,gBAAgB,CAACe,mBAAmB,EAAE;IACzEK,YAAY,EAAE;MACZb,UAAU;MACVC,QAAQ;MACRC,QAAQ;MACRC,iBAAiB;MACjBC,IAAI;MACJC,YAAY;MACZW,EAAE,EAAEL,MAAM,GAAG,uBAAuB;MACpCF,KAAK;MACLC;KACD;IACDI,QAAQ,EAAE;GACX,CAAC;EAEF;EACA;EACA,IACEF,mBAAmB,IACnBG,4BAA4B,IAC5B,CAACH,mBAAmB,CAAC,YAAY,CAAC,IAClC,CAACA,mBAAmB,CAAC,iBAAiB,CAAC,EACvC;IACAA,mBAAmB,CAAC,iBAAiB,CAAC,GAAGG,4BAA4B,CAACC,EAAE;;EAG1E,OAAO;IACL;IACAhB,UAAU;IACVE,QAAQ;IACRC,iBAAiB;IACjBE,YAAY;IACZI,KAAK;IACLC,IAAI;IAEJ;IACAO,UAAU,EAAE;MACVC,IAAI,EAAE,KAAK;MACXZ,UAAU,EAAEV,UAAU;MACtBY,mBAAmB,EAAEb;KACtB;IAEDuB,IAAI,EAAE1B,qBAAqB,CAAC,KAAK,EAAE;MAAEO,GAAG;MAAE,GAAGD;IAAK,CAAE,CAAC;IACrDQ,UAAU,EAAEM,mBAAmB;IAC/BJ,mBAAmB,EAAEO;GACtB;AACH,CAAC","names":["getNativeElementProps","resolveShorthand","useId","Button","MenuButton","useSplitButton_unstable","props","ref","appearance","children","disabled","disabledFocusable","icon","iconPosition","menuButton","menuIcon","primaryActionButton","shape","size","baseId","menuButtonShorthand","defaultProps","required","primaryActionButtonShorthand","id","components","root"],"sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-button/src/components/SplitButton/useSplitButton.ts"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, resolveShorthand, useId } from '@fluentui/react-utilities';\nimport { Button } from '../Button/Button';\nimport { MenuButton } from '../MenuButton/MenuButton';\nimport type { SplitButtonProps, SplitButtonState } from './SplitButton.types';\n\n/**\n * Given user props, defines default props for the SplitButton and returns processed state.\n * @param props - User provided props to the SplitButton component.\n * @param ref - User provided ref to be passed to the SplitButton component.\n */\nexport const useSplitButton_unstable = (\n props: SplitButtonProps,\n ref: React.Ref<HTMLButtonElement | HTMLAnchorElement>,\n): SplitButtonState => {\n const {\n appearance = 'secondary',\n children,\n disabled = false,\n disabledFocusable = false,\n icon,\n iconPosition = 'before',\n menuButton,\n menuIcon,\n primaryActionButton,\n shape = 'rounded',\n size = 'medium',\n } = props;\n\n const baseId = useId('splitButton-');\n\n const menuButtonShorthand = resolveShorthand(menuButton, {\n defaultProps: {\n appearance,\n disabled,\n disabledFocusable,\n menuIcon,\n shape,\n size,\n },\n required: true,\n });\n\n const primaryActionButtonShorthand = resolveShorthand(primaryActionButton, {\n defaultProps: {\n appearance,\n children,\n disabled,\n disabledFocusable,\n icon,\n iconPosition,\n id: baseId + '__primaryActionButton',\n shape,\n size,\n },\n required: true,\n });\n\n // Resolve menu button's aria-labelledby to be labelled by the primary action button if not a label was not provided\n // by the user.\n if (\n menuButtonShorthand &&\n primaryActionButtonShorthand &&\n !menuButtonShorthand['aria-label'] &&\n !menuButtonShorthand['aria-labelledby']\n ) {\n menuButtonShorthand['aria-labelledby'] = primaryActionButtonShorthand.id;\n }\n\n return {\n // Props passed at the top-level\n appearance,\n disabled,\n disabledFocusable,\n iconPosition,\n shape,\n size,\n\n // Slots definition\n components: {\n root: 'div',\n menuButton: MenuButton,\n primaryActionButton: Button,\n },\n\n root: getNativeElementProps('div', { ref, ...props }),\n menuButton: menuButtonShorthand,\n primaryActionButton: primaryActionButtonShorthand,\n };\n};\n"]}
1
+ {"version":3,"mappings":"AAAA,YAAYA,WAAW;AACvB,SAASC,qBAAqB,EAAEC,gBAAgB,EAAEC,KAAK,QAAQ;AAC/D,SAASC,MAAM,QAAQ;AACvB,SAASC,UAAU,QAAQ;AAG3B;;;;;AAKA,OAAO,MAAMC,0BAA0B,CACrCC,OACAC,QACqB;EACrB,MAAM;IACJC,aAAa;IACbC;IACAC,WAAW,KAAK;IAChBC,oBAAoB,KAAK;IACzBC;IACAC,eAAe;IACfC;IACAC;IACAC;IACAC,QAAQ;IACRC,OAAO;EAAQ,CAChB,GAAGZ;EAEJ,MAAMa,SAASjB,MAAM;EAErB,MAAMkB,sBAAsBnB,iBAAiBa,YAAY;IACvDO,cAAc;MACZb;MACAE;MACAC;MACAI;MACAE;MACAC;IACF;IACAI,UAAU;EACZ;EAEA,MAAMC,+BAA+BtB,iBAAiBe,qBAAqB;IACzEK,cAAc;MACZb;MACAC;MACAC;MACAC;MACAC;MACAC;MACAW,IAAIL,SAAS;MACbF;MACAC;IACF;IACAI,UAAU;EACZ;EAEA;EACA;EACA,IACEF,uBACAG,gCACA,CAACH,mBAAmB,CAAC,aAAa,IAClC,CAACA,mBAAmB,CAAC,kBAAkB,EACvC;IACAA,mBAAmB,CAAC,kBAAkB,GAAGG,6BAA6BC,EAAE;EAC1E;EAEA,OAAO;IACL;IACAhB;IACAE;IACAC;IACAE;IACAI;IACAC;IAEA;IACAO,YAAY;MACVC,MAAM;MACNZ,YAAYV;MACZY,qBAAqBb;IACvB;IAEAuB,MAAM1B,sBAAsB,OAAO;MAAEO;MAAK,GAAGD;IAAM;IACnDQ,YAAYM;IACZJ,qBAAqBO;EACvB;AACF","names":["React","getNativeElementProps","resolveShorthand","useId","Button","MenuButton","useSplitButton_unstable","props","ref","appearance","children","disabled","disabledFocusable","icon","iconPosition","menuButton","menuIcon","primaryActionButton","shape","size","baseId","menuButtonShorthand","defaultProps","required","primaryActionButtonShorthand","id","components","root"],"sources":["../../../src/components/SplitButton/useSplitButton.ts"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, resolveShorthand, useId } from '@fluentui/react-utilities';\nimport { Button } from '../Button/Button';\nimport { MenuButton } from '../MenuButton/MenuButton';\nimport type { SplitButtonProps, SplitButtonState } from './SplitButton.types';\n\n/**\n * Given user props, defines default props for the SplitButton and returns processed state.\n * @param props - User provided props to the SplitButton component.\n * @param ref - User provided ref to be passed to the SplitButton component.\n */\nexport const useSplitButton_unstable = (\n props: SplitButtonProps,\n ref: React.Ref<HTMLButtonElement | HTMLAnchorElement>,\n): SplitButtonState => {\n const {\n appearance = 'secondary',\n children,\n disabled = false,\n disabledFocusable = false,\n icon,\n iconPosition = 'before',\n menuButton,\n menuIcon,\n primaryActionButton,\n shape = 'rounded',\n size = 'medium',\n } = props;\n\n const baseId = useId('splitButton-');\n\n const menuButtonShorthand = resolveShorthand(menuButton, {\n defaultProps: {\n appearance,\n disabled,\n disabledFocusable,\n menuIcon,\n shape,\n size,\n },\n required: true,\n });\n\n const primaryActionButtonShorthand = resolveShorthand(primaryActionButton, {\n defaultProps: {\n appearance,\n children,\n disabled,\n disabledFocusable,\n icon,\n iconPosition,\n id: baseId + '__primaryActionButton',\n shape,\n size,\n },\n required: true,\n });\n\n // Resolve menu button's aria-labelledby to be labelled by the primary action button if not a label was not provided\n // by the user.\n if (\n menuButtonShorthand &&\n primaryActionButtonShorthand &&\n !menuButtonShorthand['aria-label'] &&\n !menuButtonShorthand['aria-labelledby']\n ) {\n menuButtonShorthand['aria-labelledby'] = primaryActionButtonShorthand.id;\n }\n\n return {\n // Props passed at the top-level\n appearance,\n disabled,\n disabledFocusable,\n iconPosition,\n shape,\n size,\n\n // Slots definition\n components: {\n root: 'div',\n menuButton: MenuButton,\n primaryActionButton: Button,\n },\n\n root: getNativeElementProps('div', { ref, ...props }),\n menuButton: menuButtonShorthand,\n primaryActionButton: primaryActionButtonShorthand,\n };\n};\n"]}
@@ -1 +1 @@
1
- {"version":3,"mappings":"AAAA,mBAAqBA,YAAY,QAAQ,gBAAgB;AACzD,SAASC,+BAA+B,QAAQ,yBAAyB;AACzE,SAASC,MAAM,QAAQ,uBAAuB;AAI9C,OAAO,MAAMC,qBAAqB,GAAqC;EACrEC,IAAI,EAAE,iBAAiB;EACvBC,UAAU,EAAE,6BAA6B;EACzCC,mBAAmB,EAAE;CACtB;AAED,MAAMC,cAAc,gBAAG;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;AAAA;EAAA;EAAA;EAAA;AAAA,EAWrB;AAEF,MAAMC,aAAa,gBAAG;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;EAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;EAAA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;EAAA;AAAA;EAAA;EAAA;EAAA;IAAA;EAAA;IAAA;EAAA;IAAA;EAAA;IAAA;EAAA;IAAA;EAAA;IAAA;EAAA;AAAA,EA8IpB;AAEF,OAAO,MAAMC,6BAA6B,GAAIC,KAAuB,IAAsB;EACzF,MAAMC,UAAU,GAAGH,aAAa,EAAE;EAClC,MAAMI,WAAW,GAAGL,cAAc,EAAE;EAEpC,MAAM;IAAEM,UAAU;IAAEC,QAAQ;IAAEC;EAAiB,CAAE,GAAGL,KAAK;EAEzDA,KAAK,CAACN,IAAI,CAACY,SAAS,GAAGhB,YAAY,CACjCG,qBAAqB,CAACC,IAAI,EAC1BO,UAAU,CAACM,IAAI,EACfJ,UAAU,IAAIF,UAAU,CAACE,UAAU,CAAC,EACpC,CAACC,QAAQ,IAAIC,iBAAiB,KAAKJ,UAAU,CAACG,QAAQ,EACtD,CAACA,QAAQ,IAAIC,iBAAiB,KAAKJ,UAAU,CAACO,oBAAoB,EAClER,KAAK,CAACN,IAAI,CAACY,SAAS,CACrB;EAED,IAAIN,KAAK,CAACL,UAAU,EAAE;IACpBK,KAAK,CAACL,UAAU,CAACW,SAAS,GAAGhB,YAAY,CACvCG,qBAAqB,CAACE,UAAU,EAChCO,WAAW,CAACP,UAAU,EACtBK,KAAK,CAACL,UAAU,CAACW,SAAS,CAC3B;;EAGH,IAAIN,KAAK,CAACJ,mBAAmB,EAAE;IAC7BI,KAAK,CAACJ,mBAAmB,CAACU,SAAS,GAAGhB,YAAY,CAChDG,qBAAqB,CAACG,mBAAmB,EACzCM,WAAW,CAACN,mBAAmB,EAC/BI,KAAK,CAACJ,mBAAmB,CAACU,SAAS,CACpC;;EAGH,OAAON,KAAK;AACd,CAAC","names":["mergeClasses","createCustomFocusIndicatorStyle","tokens","splitButtonClassNames","root","menuButton","primaryActionButton","useFocusStyles","useRootStyles","useSplitButtonStyles_unstable","state","rootStyles","focusStyles","appearance","disabled","disabledFocusable","className","base","disabledHighContrast"],"sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-button/src/components/SplitButton/useSplitButtonStyles.ts"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nimport { tokens } from '@fluentui/react-theme';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { SplitButtonSlots, SplitButtonState } from './SplitButton.types';\n\nexport const splitButtonClassNames: SlotClassNames<SplitButtonSlots> = {\n root: 'fui-SplitButton',\n menuButton: 'fui-SplitButton__menuButton',\n primaryActionButton: 'fui-SplitButton__primaryActionButton',\n};\n\nconst useFocusStyles = makeStyles({\n primaryActionButton: createCustomFocusIndicatorStyle({\n borderTopRightRadius: 0,\n borderBottomRightRadius: 0,\n }),\n\n menuButton: createCustomFocusIndicatorStyle({\n borderLeftWidth: 0,\n borderTopLeftRadius: 0,\n borderBottomLeftRadius: 0,\n }),\n});\n\nconst useRootStyles = makeStyles({\n // Base styles\n base: {\n display: 'inline-flex',\n justifyContent: 'stretch',\n position: 'relative',\n verticalAlign: 'middle',\n\n [`& .${splitButtonClassNames.primaryActionButton}`]: {\n borderTopRightRadius: 0,\n borderBottomRightRadius: 0,\n },\n\n [`& .${splitButtonClassNames.menuButton}`]: {\n borderLeftWidth: 0,\n borderTopLeftRadius: 0,\n borderBottomLeftRadius: 0,\n minWidth: 0,\n },\n },\n\n // Appearance variations\n outline: {\n /* No styles */\n },\n primary: {\n [`& .${splitButtonClassNames.primaryActionButton}`]: {\n borderRightColor: tokens.colorNeutralForegroundOnBrand,\n },\n\n ':hover': {\n [`& .${splitButtonClassNames.primaryActionButton}`]: {\n borderRightColor: tokens.colorNeutralForegroundOnBrand,\n },\n },\n\n ':hover:active': {\n [`& .${splitButtonClassNames.primaryActionButton}`]: {\n borderRightColor: tokens.colorNeutralForegroundOnBrand,\n },\n },\n\n '@media (forced-colors: active)': {\n [`& .${splitButtonClassNames.primaryActionButton}`]: {\n borderRightColor: 'HighlightText',\n },\n\n ':hover': {\n [`& .${splitButtonClassNames.primaryActionButton}`]: {\n borderRightColor: 'Highlight',\n },\n },\n\n ':hover:active': {\n [`& .${splitButtonClassNames.primaryActionButton}`]: {\n borderRightColor: 'Highlight',\n },\n },\n },\n },\n secondary: {\n /* The secondary styles are exactly the same as the base styles. */\n },\n subtle: {\n [`& .${splitButtonClassNames.primaryActionButton}`]: {\n borderRightColor: tokens.colorNeutralStroke1,\n },\n\n ':hover': {\n [`& .${splitButtonClassNames.primaryActionButton}`]: {\n borderRightColor: tokens.colorNeutralStroke1Hover,\n },\n },\n\n ':hover:active': {\n [`& .${splitButtonClassNames.primaryActionButton}`]: {\n borderRightColor: tokens.colorNeutralStroke1Pressed,\n },\n },\n },\n transparent: {\n [`& .${splitButtonClassNames.primaryActionButton}`]: {\n borderRightColor: tokens.colorNeutralStroke1,\n },\n\n ':hover': {\n [`& .${splitButtonClassNames.primaryActionButton}`]: {\n borderRightColor: tokens.colorNeutralStroke1Hover,\n },\n },\n\n ':hover:active': {\n [`& .${splitButtonClassNames.primaryActionButton}`]: {\n borderRightColor: tokens.colorNeutralStroke1Pressed,\n },\n },\n },\n\n // Shape variations\n circular: {},\n rounded: {},\n square: {},\n\n // Disabled styles\n disabled: {\n [`& .${splitButtonClassNames.primaryActionButton}`]: {\n borderRightColor: tokens.colorNeutralStrokeDisabled,\n },\n\n ':hover': {\n [`& .${splitButtonClassNames.primaryActionButton}`]: {\n borderRightColor: tokens.colorNeutralStrokeDisabled,\n },\n },\n\n ':hover:active': {\n [`& .${splitButtonClassNames.primaryActionButton}`]: {\n borderRightColor: tokens.colorNeutralStrokeDisabled,\n },\n },\n },\n\n // Disabled high contrast styles\n disabledHighContrast: {\n '@media (forced-colors: active)': {\n [`& .${splitButtonClassNames.primaryActionButton}`]: {\n borderRightColor: 'GrayText',\n },\n\n ':hover': {\n [`& .${splitButtonClassNames.primaryActionButton}`]: {\n borderRightColor: 'GrayText',\n },\n },\n\n ':hover:active': {\n [`& .${splitButtonClassNames.primaryActionButton}`]: {\n borderRightColor: 'GrayText',\n },\n },\n },\n },\n});\n\nexport const useSplitButtonStyles_unstable = (state: SplitButtonState): SplitButtonState => {\n const rootStyles = useRootStyles();\n const focusStyles = useFocusStyles();\n\n const { appearance, disabled, disabledFocusable } = state;\n\n state.root.className = mergeClasses(\n splitButtonClassNames.root,\n rootStyles.base,\n appearance && rootStyles[appearance],\n (disabled || disabledFocusable) && rootStyles.disabled,\n (disabled || disabledFocusable) && rootStyles.disabledHighContrast,\n state.root.className,\n );\n\n if (state.menuButton) {\n state.menuButton.className = mergeClasses(\n splitButtonClassNames.menuButton,\n focusStyles.menuButton,\n state.menuButton.className,\n );\n }\n\n if (state.primaryActionButton) {\n state.primaryActionButton.className = mergeClasses(\n splitButtonClassNames.primaryActionButton,\n focusStyles.primaryActionButton,\n state.primaryActionButton.className,\n );\n }\n\n return state;\n};\n"]}
1
+ {"version":3,"mappings":"AAAA,mBAAqBA,YAAY,QAAQ;AACzC,SAASC,+BAA+B,QAAQ;AAChD,SAASC,MAAM,QAAQ;AAIvB,OAAO,MAAMC,wBAA0D;EACrEC,MAAM;EACNC,YAAY;EACZC,qBAAqB;AACvB;AAEA,MAAMC,8BAAiBC;EAAAA;IAAAA;IAAAA;IAAAA;IAAAA;EAAAA;EAAAA;IAAAA;IAAAA;IAAAA;IAAAA;IAAAA;EAAAA;AAAAA;EAAAA;EAAAA;EAAAA;AAAAA,EAWvB;AAEA,MAAMC,6BAAgBD;EAAAA;IAAAA;IAAAA;IAAAA;IAAAA;IAAAA;IAAAA;IAAAA;IAAAA;IAAAA;IAAAA;EAAAA;EAAAA;EAAAA;IAAAA;IAAAA;IAAAA;IAAAA;IAAAA;IAAAA;EAAAA;EAAAA;EAAAA;IAAAA;IAAAA;IAAAA;EAAAA;EAAAA;IAAAA;IAAAA;IAAAA;EAAAA;EAAAA;EAAAA;EAAAA;EAAAA;IAAAA;IAAAA;IAAAA;EAAAA;EAAAA;IAAAA;IAAAA;IAAAA;EAAAA;AAAAA;EAAAA;EAAAA;EAAAA;IAAAA;EAAAA;IAAAA;EAAAA;IAAAA;EAAAA;IAAAA;EAAAA;IAAAA;EAAAA;IAAAA;EAAAA;AAAAA,EA8ItB;AAEA,OAAO,MAAME,gCAAiCC,SAA8C;EAC1F,MAAMC,aAAaH;EACnB,MAAMI,cAAcN;EAEpB,MAAM;IAAEO;IAAYC;IAAUC;EAAiB,CAAE,GAAGL;EAEpDA,MAAMP,IAAI,CAACa,SAAS,GAAGjB,aACrBG,sBAAsBC,IAAI,EAC1BQ,WAAWM,IAAI,EACfJ,cAAcF,UAAU,CAACE,WAAW,EACpC,CAACC,YAAYC,iBAAgB,KAAMJ,WAAWG,QAAQ,EACtD,CAACA,YAAYC,iBAAgB,KAAMJ,WAAWO,oBAAoB,EAClER,MAAMP,IAAI,CAACa,SAAS;EAGtB,IAAIN,MAAMN,UAAU,EAAE;IACpBM,MAAMN,UAAU,CAACY,SAAS,GAAGjB,aAC3BG,sBAAsBE,UAAU,EAChCQ,YAAYR,UAAU,EACtBM,MAAMN,UAAU,CAACY,SAAS;EAE9B;EAEA,IAAIN,MAAML,mBAAmB,EAAE;IAC7BK,MAAML,mBAAmB,CAACW,SAAS,GAAGjB,aACpCG,sBAAsBG,mBAAmB,EACzCO,YAAYP,mBAAmB,EAC/BK,MAAML,mBAAmB,CAACW,SAAS;EAEvC;EAEA,OAAON;AACT","names":["mergeClasses","createCustomFocusIndicatorStyle","tokens","splitButtonClassNames","root","menuButton","primaryActionButton","useFocusStyles","makeStyles","useRootStyles","useSplitButtonStyles_unstable","state","rootStyles","focusStyles","appearance","disabled","disabledFocusable","className","base","disabledHighContrast"],"sources":["../../../src/components/SplitButton/useSplitButtonStyles.ts"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nimport { tokens } from '@fluentui/react-theme';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { SplitButtonSlots, SplitButtonState } from './SplitButton.types';\n\nexport const splitButtonClassNames: SlotClassNames<SplitButtonSlots> = {\n root: 'fui-SplitButton',\n menuButton: 'fui-SplitButton__menuButton',\n primaryActionButton: 'fui-SplitButton__primaryActionButton',\n};\n\nconst useFocusStyles = makeStyles({\n primaryActionButton: createCustomFocusIndicatorStyle({\n borderTopRightRadius: 0,\n borderBottomRightRadius: 0,\n }),\n\n menuButton: createCustomFocusIndicatorStyle({\n borderLeftWidth: 0,\n borderTopLeftRadius: 0,\n borderBottomLeftRadius: 0,\n }),\n});\n\nconst useRootStyles = makeStyles({\n // Base styles\n base: {\n display: 'inline-flex',\n justifyContent: 'stretch',\n position: 'relative',\n verticalAlign: 'middle',\n\n [`& .${splitButtonClassNames.primaryActionButton}`]: {\n borderTopRightRadius: 0,\n borderBottomRightRadius: 0,\n },\n\n [`& .${splitButtonClassNames.menuButton}`]: {\n borderLeftWidth: 0,\n borderTopLeftRadius: 0,\n borderBottomLeftRadius: 0,\n minWidth: 0,\n },\n },\n\n // Appearance variations\n outline: {\n /* No styles */\n },\n primary: {\n [`& .${splitButtonClassNames.primaryActionButton}`]: {\n borderRightColor: tokens.colorNeutralForegroundOnBrand,\n },\n\n ':hover': {\n [`& .${splitButtonClassNames.primaryActionButton}`]: {\n borderRightColor: tokens.colorNeutralForegroundOnBrand,\n },\n },\n\n ':hover:active': {\n [`& .${splitButtonClassNames.primaryActionButton}`]: {\n borderRightColor: tokens.colorNeutralForegroundOnBrand,\n },\n },\n\n '@media (forced-colors: active)': {\n [`& .${splitButtonClassNames.primaryActionButton}`]: {\n borderRightColor: 'HighlightText',\n },\n\n ':hover': {\n [`& .${splitButtonClassNames.primaryActionButton}`]: {\n borderRightColor: 'Highlight',\n },\n },\n\n ':hover:active': {\n [`& .${splitButtonClassNames.primaryActionButton}`]: {\n borderRightColor: 'Highlight',\n },\n },\n },\n },\n secondary: {\n /* The secondary styles are exactly the same as the base styles. */\n },\n subtle: {\n [`& .${splitButtonClassNames.primaryActionButton}`]: {\n borderRightColor: tokens.colorNeutralStroke1,\n },\n\n ':hover': {\n [`& .${splitButtonClassNames.primaryActionButton}`]: {\n borderRightColor: tokens.colorNeutralStroke1Hover,\n },\n },\n\n ':hover:active': {\n [`& .${splitButtonClassNames.primaryActionButton}`]: {\n borderRightColor: tokens.colorNeutralStroke1Pressed,\n },\n },\n },\n transparent: {\n [`& .${splitButtonClassNames.primaryActionButton}`]: {\n borderRightColor: tokens.colorNeutralStroke1,\n },\n\n ':hover': {\n [`& .${splitButtonClassNames.primaryActionButton}`]: {\n borderRightColor: tokens.colorNeutralStroke1Hover,\n },\n },\n\n ':hover:active': {\n [`& .${splitButtonClassNames.primaryActionButton}`]: {\n borderRightColor: tokens.colorNeutralStroke1Pressed,\n },\n },\n },\n\n // Shape variations\n circular: {},\n rounded: {},\n square: {},\n\n // Disabled styles\n disabled: {\n [`& .${splitButtonClassNames.primaryActionButton}`]: {\n borderRightColor: tokens.colorNeutralStrokeDisabled,\n },\n\n ':hover': {\n [`& .${splitButtonClassNames.primaryActionButton}`]: {\n borderRightColor: tokens.colorNeutralStrokeDisabled,\n },\n },\n\n ':hover:active': {\n [`& .${splitButtonClassNames.primaryActionButton}`]: {\n borderRightColor: tokens.colorNeutralStrokeDisabled,\n },\n },\n },\n\n // Disabled high contrast styles\n disabledHighContrast: {\n '@media (forced-colors: active)': {\n [`& .${splitButtonClassNames.primaryActionButton}`]: {\n borderRightColor: 'GrayText',\n },\n\n ':hover': {\n [`& .${splitButtonClassNames.primaryActionButton}`]: {\n borderRightColor: 'GrayText',\n },\n },\n\n ':hover:active': {\n [`& .${splitButtonClassNames.primaryActionButton}`]: {\n borderRightColor: 'GrayText',\n },\n },\n },\n },\n});\n\nexport const useSplitButtonStyles_unstable = (state: SplitButtonState): SplitButtonState => {\n const rootStyles = useRootStyles();\n const focusStyles = useFocusStyles();\n\n const { appearance, disabled, disabledFocusable } = state;\n\n state.root.className = mergeClasses(\n splitButtonClassNames.root,\n rootStyles.base,\n appearance && rootStyles[appearance],\n (disabled || disabledFocusable) && rootStyles.disabled,\n (disabled || disabledFocusable) && rootStyles.disabledHighContrast,\n state.root.className,\n );\n\n if (state.menuButton) {\n state.menuButton.className = mergeClasses(\n splitButtonClassNames.menuButton,\n focusStyles.menuButton,\n state.menuButton.className,\n );\n }\n\n if (state.primaryActionButton) {\n state.primaryActionButton.className = mergeClasses(\n splitButtonClassNames.primaryActionButton,\n focusStyles.primaryActionButton,\n state.primaryActionButton.className,\n );\n }\n\n return state;\n};\n"]}
@@ -1 +1 @@
1
- {"version":3,"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,2BAA2B,QAAQ,sBAAsB;AAClE,SAASC,wBAAwB,QAAQ,mBAAmB;AAC5D,SAASC,8BAA8B,QAAQ,yBAAyB;AAIxE;;;AAGA,OAAO,MAAMC,YAAY,gBAA2CJ,KAAK,CAACK,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EAClG,MAAMC,KAAK,GAAGN,wBAAwB,CAACI,KAAK,EAAEC,GAAG,CAAC;EAElDJ,8BAA8B,CAACK,KAAK,CAAC;EAErC,OAAOP,2BAA2B,CAACO,KAAK,CAAC;EACzC;AACF,CAAC,CAA2C;;AAE5CJ,YAAY,CAACK,WAAW,GAAG,cAAc","names":["React","renderToggleButton_unstable","useToggleButton_unstable","useToggleButtonStyles_unstable","ToggleButton","forwardRef","props","ref","state","displayName"],"sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-button/src/components/ToggleButton/ToggleButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { renderToggleButton_unstable } from './renderToggleButton';\nimport { useToggleButton_unstable } from './useToggleButton';\nimport { useToggleButtonStyles_unstable } from './useToggleButtonStyles';\nimport type { ToggleButtonProps } from './ToggleButton.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * ToggleButtons are buttons that toggle between two defined states when triggered.\n */\nexport const ToggleButton: ForwardRefComponent<ToggleButtonProps> = React.forwardRef((props, ref) => {\n const state = useToggleButton_unstable(props, ref);\n\n useToggleButtonStyles_unstable(state);\n\n return renderToggleButton_unstable(state);\n // Casting is required due to lack of distributive union to support unions on @types/react\n}) as ForwardRefComponent<ToggleButtonProps>;\n\nToggleButton.displayName = 'ToggleButton';\n"]}
1
+ {"version":3,"mappings":"AAAA,YAAYA,WAAW;AACvB,SAASC,2BAA2B,QAAQ;AAC5C,SAASC,wBAAwB,QAAQ;AACzC,SAASC,8BAA8B,QAAQ;AAI/C;;;AAGA,OAAO,MAAMC,4BAAuDJ,MAAMK,UAAU,CAAC,CAACC,OAAOC,QAAQ;EACnG,MAAMC,QAAQN,yBAAyBI,OAAOC;EAE9CJ,+BAA+BK;EAE/B,OAAOP,4BAA4BO;EACnC;AACF;;AAEAJ,aAAaK,WAAW,GAAG","names":["React","renderToggleButton_unstable","useToggleButton_unstable","useToggleButtonStyles_unstable","ToggleButton","forwardRef","props","ref","state","displayName"],"sources":["../../../src/components/ToggleButton/ToggleButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { renderToggleButton_unstable } from './renderToggleButton';\nimport { useToggleButton_unstable } from './useToggleButton';\nimport { useToggleButtonStyles_unstable } from './useToggleButtonStyles';\nimport type { ToggleButtonProps } from './ToggleButton.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * ToggleButtons are buttons that toggle between two defined states when triggered.\n */\nexport const ToggleButton: ForwardRefComponent<ToggleButtonProps> = React.forwardRef((props, ref) => {\n const state = useToggleButton_unstable(props, ref);\n\n useToggleButtonStyles_unstable(state);\n\n return renderToggleButton_unstable(state);\n // Casting is required due to lack of distributive union to support unions on @types/react\n}) as ForwardRefComponent<ToggleButtonProps>;\n\nToggleButton.displayName = 'ToggleButton';\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"ToggleButton.types.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-button/src/components/ToggleButton/ToggleButton.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ButtonProps, ButtonState } from '../Button/Button.types';\n\nexport type ToggleButtonProps = ButtonProps & {\n /**\n * Defines whether the `ToggleButton` is initially in a checked state or not when rendered.\n *\n * @default false\n */\n defaultChecked?: boolean;\n\n /**\n * Defines the controlled checked state of the `ToggleButton`.\n * If passed, `ToggleButton` ignores the `defaultChecked` property.\n * This should only be used if the checked state is to be controlled at a higher level and there is a plan to pass the\n * correct value based on handling `onClick` events and re-rendering.\n *\n * @default false\n */\n checked?: boolean;\n};\n\nexport type ToggleButtonState = ButtonState & Required<Pick<ToggleButtonProps, 'checked'>>;\n"]}
1
+ {"version":3,"mappings":"AAAA","names":[],"sources":["../../../src/components/ToggleButton/ToggleButton.types.ts"],"sourcesContent":["import type { ButtonProps, ButtonState } from '../Button/Button.types';\n\nexport type ToggleButtonProps = ButtonProps & {\n /**\n * Defines whether the `ToggleButton` is initially in a checked state or not when rendered.\n *\n * @default false\n */\n defaultChecked?: boolean;\n\n /**\n * Defines the controlled checked state of the `ToggleButton`.\n * If passed, `ToggleButton` ignores the `defaultChecked` property.\n * This should only be used if the checked state is to be controlled at a higher level and there is a plan to pass the\n * correct value based on handling `onClick` events and re-rendering.\n *\n * @default false\n */\n checked?: boolean;\n};\n\nexport type ToggleButtonState = ButtonState & Required<Pick<ToggleButtonProps, 'checked'>>;\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-button/src/components/ToggleButton/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAC;AAC/B,cAAc,sBAAsB,CAAC;AACrC,cAAc,sBAAsB,CAAC;AACrC,cAAc,mBAAmB,CAAC;AAClC,OAAO,EAAE,sBAAsB,EAAE,8BAA8B,EAAE,MAAM,yBAAyB,CAAC","sourcesContent":["export * from './ToggleButton';\nexport * from './ToggleButton.types';\nexport * from './renderToggleButton';\nexport * from './useToggleButton';\nexport { toggleButtonClassNames, useToggleButtonStyles_unstable } from './useToggleButtonStyles';\n"]}
1
+ {"version":3,"mappings":"AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,SAASA,sBAAsB,EAAEC,8BAA8B,QAAQ","names":["toggleButtonClassNames","useToggleButtonStyles_unstable"],"sources":["../../../src/components/ToggleButton/index.ts"],"sourcesContent":["export * from './ToggleButton';\nexport * from './ToggleButton.types';\nexport * from './renderToggleButton';\nexport * from './useToggleButton';\nexport { toggleButtonClassNames, useToggleButtonStyles_unstable } from './useToggleButtonStyles';\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"renderToggleButton.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-button/src/components/ToggleButton/renderToggleButton.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,qBAAqB,IAAI,2BAA2B,EAAE,MAAM,wBAAwB,CAAC","sourcesContent":["export { renderButton_unstable as renderToggleButton_unstable } from '../Button/renderButton';\n"]}
1
+ {"version":3,"mappings":"AAAA,SAASA,yBAAyBC,2BAA2B,QAAQ","names":["renderButton_unstable","renderToggleButton_unstable"],"sources":["../../../src/components/ToggleButton/renderToggleButton.tsx"],"sourcesContent":["export { renderButton_unstable as renderToggleButton_unstable } from '../Button/renderButton';\n"]}
@@ -1,3 +1,4 @@
1
+ import * as React from 'react';
1
2
  import { useToggleState } from '../../utils/useToggleState';
2
3
  import { useButton_unstable } from '../Button/useButton';
3
4
  /**
@@ -1 +1 @@
1
- {"version":3,"mappings":"AACA,SAASA,cAAc,QAAQ,4BAA4B;AAC3D,SAASC,kBAAkB,QAAQ,qBAAqB;AAGxD;;;;;;AAMA,OAAO,MAAMC,wBAAwB,GAAG,CACtCC,KAAwB,EACxBC,GAAqD,KAChC;EACrB,MAAMC,WAAW,GAAGJ,kBAAkB,CAACE,KAAK,EAAEC,GAAG,CAAC;EAElD,OAAOJ,cAAc,CAACG,KAAK,EAAEE,WAAW,CAAC;AAC3C,CAAC","names":["useToggleState","useButton_unstable","useToggleButton_unstable","props","ref","buttonState"],"sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-button/src/components/ToggleButton/useToggleButton.ts"],"sourcesContent":["import * as React from 'react';\nimport { useToggleState } from '../../utils/useToggleState';\nimport { useButton_unstable } from '../Button/useButton';\nimport type { ToggleButtonProps, ToggleButtonState } from './ToggleButton.types';\n\n/**\n * Given user props, defines default props for the ToggleButton, calls useButtonState and useChecked, and returns\n * processed state.\n * @param props - User provided props to the ToggleButton component.\n * @param ref - User provided ref to be passed to the ToggleButton component.\n */\nexport const useToggleButton_unstable = (\n props: ToggleButtonProps,\n ref: React.Ref<HTMLButtonElement | HTMLAnchorElement>,\n): ToggleButtonState => {\n const buttonState = useButton_unstable(props, ref);\n\n return useToggleState(props, buttonState);\n};\n"]}
1
+ {"version":3,"mappings":"AAAA,YAAYA,WAAW;AACvB,SAASC,cAAc,QAAQ;AAC/B,SAASC,kBAAkB,QAAQ;AAGnC;;;;;;AAMA,OAAO,MAAMC,2BAA2B,CACtCC,OACAC,QACsB;EACtB,MAAMC,cAAcJ,mBAAmBE,OAAOC;EAE9C,OAAOJ,eAAeG,OAAOE;AAC/B","names":["React","useToggleState","useButton_unstable","useToggleButton_unstable","props","ref","buttonState"],"sources":["../../../src/components/ToggleButton/useToggleButton.ts"],"sourcesContent":["import * as React from 'react';\nimport { useToggleState } from '../../utils/useToggleState';\nimport { useButton_unstable } from '../Button/useButton';\nimport type { ToggleButtonProps, ToggleButtonState } from './ToggleButton.types';\n\n/**\n * Given user props, defines default props for the ToggleButton, calls useButtonState and useChecked, and returns\n * processed state.\n * @param props - User provided props to the ToggleButton component.\n * @param ref - User provided ref to be passed to the ToggleButton component.\n */\nexport const useToggleButton_unstable = (\n props: ToggleButtonProps,\n ref: React.Ref<HTMLButtonElement | HTMLAnchorElement>,\n): ToggleButtonState => {\n const buttonState = useButton_unstable(props, ref);\n\n return useToggleState(props, buttonState);\n};\n"]}
@@ -1 +1 @@
1
- {"version":3,"mappings":"AAAA,SAASA,mBAAmB,EAAEC,oBAAoB,QAAQ,uBAAuB;AACjF,SAASC,+BAA+B,QAAQ,yBAAyB;AACzE,SAASC,MAAM,QAAQ,uBAAuB;AAC9C,SAASC,UAAU,EAAEC,YAAY,kBAAoB,gBAAgB;AACrE,SAASC,wBAAwB,QAAQ,2BAA2B;AAKpE,OAAO,MAAMC,sBAAsB,GAAgC;EACjEC,IAAI,EAAE,kBAAkB;EACxBC,IAAI,EAAE;CACP;AAED,MAAMC,oBAAoB,gBAAG;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;AAAA;EAAA;EAAA;EAAA;IAAA;EAAA;IAAA;EAAA;IAAA;EAAA;IAAA;EAAA;IAAA;EAAA;IAAA;EAAA;IAAA;EAAA;IAAA;EAAA;IAAA;EAAA;IAAA;EAAA;IAAA;EAAA;IAAA;EAAA;IAAA;EAAA;IAAA;EAAA;IAAA;EAAA;IAAA;EAAA;IAAA;EAAA;IAAA;EAAA;IAAA;EAAA;IAAA;EAAA;IAAA;EAAA;IAAA;EAAA;IAAA;EAAA;IAAA;EAAA;IAAA;EAAA;IAAA;EAAA;IAAA;EAAA;IAAA;EAAA;IAAA;EAAA;IAAA;EAAA;IAAA;EAAA;IAAA;EAAA;EAAA;EAAA;AAAA,EAgI3B;AAEF,MAAMC,qBAAqB,gBAAG;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;AAAA;EAAA;EAAA;AAAA,EAkE5B;AAEF,MAAMC,oBAAoB,gBAAG;EAAA;IAAA;EAAA;AAAA;EAAA;AAAA,EAK3B;AAEF,MAAMC,4BAA4B,gBAAG;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;AAAA;EAAA;IAAA;EAAA;IAAA;EAAA;IAAA;EAAA;IAAA;EAAA;IAAA;EAAA;IAAA;EAAA;IAAA;EAAA;IAAA;EAAA;IAAA;EAAA;IAAA;EAAA;IAAA;EAAA;IAAA;EAAA;IAAA;EAAA;IAAA;EAAA;IAAA;EAAA;IAAA;EAAA;AAAA,EAsBnC;AAEF,OAAO,MAAMC,8BAA8B,GAAIC,KAAwB,IAAuB;EAC5F,MAAMC,iBAAiB,GAAGN,oBAAoB,EAAE;EAChD,MAAMO,kBAAkB,GAAGN,qBAAqB,EAAE;EAClD,MAAMO,iBAAiB,GAAGN,oBAAoB,EAAE;EAChD,MAAMO,yBAAyB,GAAGN,4BAA4B,EAAE;EAEhE,MAAM;IAAEO,UAAU;IAAEC,OAAO;IAAEC,QAAQ;IAAEC;EAAiB,CAAE,GAAGR,KAAK;EAElEA,KAAK,CAACP,IAAI,CAACgB,SAAS,GAAGnB,YAAY,CACjCE,sBAAsB,CAACC,IAAI;EAE3B;EACAY,UAAU,KAAK,SAAS,IAAID,yBAAyB,CAACM,IAAI,EAC1DL,UAAU,KAAK,SAAS,KAAKE,QAAQ,IAAIC,iBAAiB,CAAC,IAAIJ,yBAAyB,CAACG,QAAQ;EAEjG;EACAD,OAAO,IAAIL,iBAAiB,CAACS,IAAI,EACjCJ,OAAO,IAAIL,iBAAiB,CAACU,YAAY,EACzCN,UAAU,IAAIC,OAAO,IAAIL,iBAAiB,CAACI,UAAU,CAAC;EAEtD;EACA,CAACE,QAAQ,IAAIC,iBAAiB,KAAKN,kBAAkB,CAACQ,IAAI,EAC1DL,UAAU,KAAKE,QAAQ,IAAIC,iBAAiB,CAAC,IAAIN,kBAAkB,CAACG,UAAU,CAAC;EAE/E;EACAL,KAAK,CAACP,IAAI,CAACgB,SAAS,CACrB;EAED,IAAIT,KAAK,CAACN,IAAI,EAAE;IACdM,KAAK,CAACN,IAAI,CAACe,SAAS,GAAGnB,YAAY,CACjCE,sBAAsB,CAACE,IAAI,EAC3B,CAACW,UAAU,KAAK,QAAQ,IAAIA,UAAU,KAAK,aAAa,KAAKF,iBAAiB,CAACS,mBAAmB,EAClGZ,KAAK,CAACN,IAAI,CAACe,SAAS,CACrB;;EAGHlB,wBAAwB,CAACS,KAAK,CAAC;EAE/B,OAAOA,KAAK;AACd,CAAC","names":["iconFilledClassName","iconRegularClassName","createCustomFocusIndicatorStyle","tokens","shorthands","mergeClasses","useButtonStyles_unstable","toggleButtonClassNames","root","icon","useRootCheckedStyles","useRootDisabledStyles","useIconCheckedStyles","usePrimaryHighContrastStyles","useToggleButtonStyles_unstable","state","rootCheckedStyles","rootDisabledStyles","iconCheckedStyles","primaryHighContrastStyles","appearance","checked","disabled","disabledFocusable","className","base","highContrast","subtleOrTransparent"],"sourceRoot":"","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.border('1px', 'solid', 'HighlightText'),\n outlineColor: 'Highlight',\n },\n },\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\nconst usePrimaryHighContrastStyles = makeStyles({\n // Do not use primary variant high contrast styles for toggle buttons\n // otherwise there isn't enough difference between on/off states\n base: {\n '@media (forced-colors: active)': {\n backgroundColor: 'ButtonFace',\n ...shorthands.borderColor('ButtonBorder'),\n color: 'ButtonText',\n forcedColorAdjust: 'auto',\n },\n },\n\n disabled: {\n '@media (forced-colors: active)': {\n ...shorthands.borderColor('GrayText'),\n color: 'GrayText',\n\n ':focus': {\n ...shorthands.borderColor('GrayText'),\n },\n },\n },\n});\n\nexport const useToggleButtonStyles_unstable = (state: ToggleButtonState): ToggleButtonState => {\n const rootCheckedStyles = useRootCheckedStyles();\n const rootDisabledStyles = useRootDisabledStyles();\n const iconCheckedStyles = useIconCheckedStyles();\n const primaryHighContrastStyles = usePrimaryHighContrastStyles();\n\n const { appearance, checked, disabled, disabledFocusable } = state;\n\n state.root.className = mergeClasses(\n toggleButtonClassNames.root,\n\n // Primary high contrast styles\n appearance === 'primary' && primaryHighContrastStyles.base,\n appearance === 'primary' && (disabled || disabledFocusable) && primaryHighContrastStyles.disabled,\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"]}
1
+ {"version":3,"mappings":"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","names":["iconFilledClassName","iconRegularClassName","createCustomFocusIndicatorStyle","tokens","shorthands","mergeClasses","useButtonStyles_unstable","toggleButtonClassNames","root","icon","useRootCheckedStyles","makeStyles","useRootDisabledStyles","useIconCheckedStyles","usePrimaryHighContrastStyles","useToggleButtonStyles_unstable","state","rootCheckedStyles","rootDisabledStyles","iconCheckedStyles","primaryHighContrastStyles","appearance","checked","disabled","disabledFocusable","className","base","highContrast","subtleOrTransparent"],"sources":["../../../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.border('1px', 'solid', 'HighlightText'),\n outlineColor: 'Highlight',\n },\n },\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\nconst usePrimaryHighContrastStyles = makeStyles({\n // Do not use primary variant high contrast styles for toggle buttons\n // otherwise there isn't enough difference between on/off states\n base: {\n '@media (forced-colors: active)': {\n backgroundColor: 'ButtonFace',\n ...shorthands.borderColor('ButtonBorder'),\n color: 'ButtonText',\n forcedColorAdjust: 'auto',\n },\n },\n\n disabled: {\n '@media (forced-colors: active)': {\n ...shorthands.borderColor('GrayText'),\n color: 'GrayText',\n\n ':focus': {\n ...shorthands.borderColor('GrayText'),\n },\n },\n },\n});\n\nexport const useToggleButtonStyles_unstable = (state: ToggleButtonState): ToggleButtonState => {\n const rootCheckedStyles = useRootCheckedStyles();\n const rootDisabledStyles = useRootDisabledStyles();\n const iconCheckedStyles = useIconCheckedStyles();\n const primaryHighContrastStyles = usePrimaryHighContrastStyles();\n\n const { appearance, checked, disabled, disabledFocusable } = state;\n\n state.root.className = mergeClasses(\n toggleButtonClassNames.root,\n\n // Primary high contrast styles\n appearance === 'primary' && primaryHighContrastStyles.base,\n appearance === 'primary' && (disabled || disabledFocusable) && primaryHighContrastStyles.disabled,\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"]}
@@ -10,8 +10,5 @@ export const ButtonContextProvider = buttonContext.Provider;
10
10
  * @internal
11
11
  * Internal context hook used to update default values between internal components
12
12
  */
13
- export const useButtonContext = () => {
14
- var _a;
15
- return (_a = React.useContext(buttonContext)) !== null && _a !== void 0 ? _a : buttonContextDefaultValue;
16
- };
13
+ export const useButtonContext = () => React.useContext(buttonContext) ?? buttonContextDefaultValue;
17
14
  //# sourceMappingURL=ButtonContext.js.map
@@ -1 +1 @@
1
- {"version":3,"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAG9B,MAAMC,aAAa,gBAAGD,KAAK,CAACE,aAAa,CAAiCC,SAAS,CAAC;AAUpF,MAAMC,yBAAyB,GAAuB,EAAE;AAExD;;;;AAIA,OAAO,MAAMC,qBAAqB,GAAGJ,aAAa,CAACK,QAAQ;AAE3D;;;;AAIA,OAAO,MAAMC,gBAAgB,GAAG,MAAK;EAAA;EAAC,kBAAK,CAACC,UAAU,CAACP,aAAa,CAAC,mCAAIG,yBAAyB;AAAA","names":["React","buttonContext","createContext","undefined","buttonContextDefaultValue","ButtonContextProvider","Provider","useButtonContext","useContext"],"sourceRoot":"","sources":["../../../../../../../../packages/react-components/react-button/src/contexts/ButtonContext.ts"],"sourcesContent":["import * as React from 'react';\nimport { ButtonSize } from '../components/Button/Button.types';\n\nconst buttonContext = React.createContext<ButtonContextValue | undefined>(undefined);\n\n/**\n * @internal\n * Internal context value used to update default values between internal components\n */\nexport interface ButtonContextValue {\n size?: ButtonSize;\n}\n\nconst buttonContextDefaultValue: ButtonContextValue = {};\n\n/**\n * @internal\n * Internal context provider used to update default values between internal components\n */\nexport const ButtonContextProvider = buttonContext.Provider;\n\n/**\n * @internal\n * Internal context hook used to update default values between internal components\n */\nexport const useButtonContext = () => React.useContext(buttonContext) ?? buttonContextDefaultValue;\n"]}
1
+ {"version":3,"mappings":"AAAA,YAAYA,WAAW;AAGvB,MAAMC,6BAAgBD,MAAME,aAAa,CAAiCC;AAU1E,MAAMC,4BAAgD,CAAC;AAEvD;;;;AAIA,OAAO,MAAMC,wBAAwBJ,cAAcK,QAAQ;AAE3D;;;;AAIA,OAAO,MAAMC,mBAAmB,MAAMP,MAAMQ,UAAU,CAACP,kBAAkBG","names":["React","buttonContext","createContext","undefined","buttonContextDefaultValue","ButtonContextProvider","Provider","useButtonContext","useContext"],"sources":["../../src/contexts/ButtonContext.ts"],"sourcesContent":["import * as React from 'react';\nimport { ButtonSize } from '../components/Button/Button.types';\n\nconst buttonContext = React.createContext<ButtonContextValue | undefined>(undefined);\n\n/**\n * @internal\n * Internal context value used to update default values between internal components\n */\nexport interface ButtonContextValue {\n size?: ButtonSize;\n}\n\nconst buttonContextDefaultValue: ButtonContextValue = {};\n\n/**\n * @internal\n * Internal context provider used to update default values between internal components\n */\nexport const ButtonContextProvider = buttonContext.Provider;\n\n/**\n * @internal\n * Internal context hook used to update default values between internal components\n */\nexport const useButtonContext = () => React.useContext(buttonContext) ?? buttonContextDefaultValue;\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../../packages/react-components/react-button/src/contexts/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAC","sourcesContent":["export * from './ButtonContext';\n"]}
1
+ {"version":3,"mappings":"AAAA,cAAc","names":[],"sources":["../../src/contexts/index.ts"],"sourcesContent":["export * from './ButtonContext';\n"]}
package/lib/index.js.map CHANGED
@@ -1 +1 @@
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;AAE9C,SAASC,qBAAqB,EAAEC,gBAAgB,QAAQ,kBAAkB","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","ButtonContextProvider","useButtonContext"],"sourceRoot":"","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\nexport { ButtonContextProvider, useButtonContext } from './contexts/index';\nexport type { ButtonContextValue } from './contexts/index';\n"]}
1
+ {"version":3,"mappings":"AAAA,SACEA,MAAM,EACNC,gBAAgB,EAChBC,qBAAqB,EACrBC,wBAAwB,EACxBC,kBAAkB,QACb;AAEP,SACEC,cAAc,EACdC,wBAAwB,EACxBC,6BAA6B,EAC7BC,gCAAgC,EAChCC,0BAA0B,QACrB;AAEP,SACEC,UAAU,EACVC,oBAAoB,EACpBC,yBAAyB,EACzBC,4BAA4B,EAC5BC,sBAAsB,QACjB;AAEP,SACEC,WAAW,EACXC,0BAA0B,EAC1BC,qBAAqB,EACrBC,6BAA6B,EAC7BC,uBAAuB,QAClB;AAEP,SACEC,YAAY,EACZC,2BAA2B,EAC3BC,sBAAsB,EACtBC,8BAA8B,EAC9BC,wBAAwB,QACnB;AAGP,SAASC,cAAc,QAAQ;AAE/B,SAASC,qBAAqB,EAAEC,gBAAgB,QAAQ","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","ButtonContextProvider","useButtonContext"],"sources":["../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\nexport { ButtonContextProvider, useButtonContext } from './contexts/index';\nexport type { ButtonContextValue } from './contexts/index';\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../../packages/react-components/react-button/src/utils/index.ts"],"names":[],"mappings":"AAAA,cAAc,kBAAkB,CAAC","sourcesContent":["export * from './useToggleState';\n"]}
1
+ {"version":3,"mappings":"AAAA,cAAc","names":[],"sources":["../../src/utils/index.ts"],"sourcesContent":["export * from './useToggleState';\n"]}
@@ -1 +1 @@
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":"","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"]}
1
+ {"version":3,"mappings":"AAAA,YAAYA,WAAW;AACvB,SAASC,cAAc,EAAEC,oBAAoB,EAAEC,gBAAgB,QAAQ;AAIvE,OAAO,SAASC,eAIdC,KAAyB,EAAEC,KAAmB,EAAsB;EACpE,MAAM;IAAEC;IAASC;IAAgBC;IAAUC;EAAiB,CAAE,GAAGL;EACjE,MAAM;IAAEM;IAASC;EAAI,CAAE,GAAGN,MAAMO,IAAI;EAEpC,MAAM,CAACC,cAAcC,gBAAgB,GAAGb,qBAAqB;IAC3DI,OAAOC;IACPS,cAAcR;IACdS,cAAc;EAChB;EAEA,MAAMC,qBAAqBN,SAAS,sBAAsBA,SAAS;EAEnE,MAAMO,gBAAgBnB,MAAMoB,WAAW,CACrCC,MAAM;IACJ,IAAI,CAACZ,YAAY,CAACC,mBAAmB;MACnC,IAAIW,GAAGC,gBAAgB,EAAE;QACvB;MACF;MAEAP,gBAAgB,CAACD;IACnB;EACF,GACA,CAACA,cAAcL,UAAUC,mBAAmBK,gBAAgB;EAG9D,OAAO;IACL,GAAGT,KAAK;IAERC,SAASO;IAETD,MAAM;MACJ,GAAGP,MAAMO,IAAI;MACb,CAACK,qBAAqB,iBAAiB,cAAc,GAAGJ;MACxDH,SAASR,iBACPF,eAAeU,SAA2EQ;IAE9F;EACF;AACF","names":["React","mergeCallbacks","useControllableState","useEventCallback","useToggleState","props","state","checked","defaultChecked","disabled","disabledFocusable","onClick","role","root","checkedValue","setCheckedValue","defaultState","initialState","isCheckboxTypeRole","onToggleClick","useCallback","ev","defaultPrevented"],"sources":["../../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"]}
@@ -1,8 +1,9 @@
1
1
  "use strict";
2
-
3
2
  Object.defineProperty(exports, "__esModule", {
4
- value: true
3
+ value: true
5
4
  });
6
- const tslib_1 = /*#__PURE__*/require("tslib");
7
- tslib_1.__exportStar(require("./components/Button/index"), exports);
5
+ const _exportStar = require("@swc/helpers/lib/_export_star.js").default;
6
+ _exportStar(require("./components/Button/index"), exports);
7
+ //# sourceMappingURL=Button.js.map
8
+
8
9
  //# sourceMappingURL=Button.js.map
@@ -1 +1 @@
1
- {"version":3,"mappings":";;;;;;AAAAA","names":["tslib_1"],"sourceRoot":"","sources":["../../../../../../../packages/react-components/react-button/src/Button.tsx"],"sourcesContent":["export * from './components/Button/index';\n"]}
1
+ {"version":3,"sources":["../lib/Button.js"],"sourcesContent":["export * from './components/Button/index';\n//# sourceMappingURL=Button.js.map"],"names":[],"mappings":";;;;;oBAAc;CACd,kCAAkC"}
@@ -1,8 +1,9 @@
1
1
  "use strict";
2
-
3
2
  Object.defineProperty(exports, "__esModule", {
4
- value: true
3
+ value: true
5
4
  });
6
- const tslib_1 = /*#__PURE__*/require("tslib");
7
- tslib_1.__exportStar(require("./components/CompoundButton/index"), exports);
5
+ const _exportStar = require("@swc/helpers/lib/_export_star.js").default;
6
+ _exportStar(require("./components/CompoundButton/index"), exports);
7
+ //# sourceMappingURL=CompoundButton.js.map
8
+
8
9
  //# sourceMappingURL=CompoundButton.js.map
@@ -1 +1 @@
1
- {"version":3,"mappings":";;;;;;AAAAA","names":["tslib_1"],"sourceRoot":"","sources":["../../../../../../../packages/react-components/react-button/src/CompoundButton.ts"],"sourcesContent":["export * from './components/CompoundButton/index';\n"]}
1
+ {"version":3,"sources":["../lib/CompoundButton.js"],"sourcesContent":["export * from './components/CompoundButton/index';\n//# sourceMappingURL=CompoundButton.js.map"],"names":[],"mappings":";;;;;oBAAc;CACd,0CAA0C"}
@@ -1,8 +1,9 @@
1
1
  "use strict";
2
-
3
2
  Object.defineProperty(exports, "__esModule", {
4
- value: true
3
+ value: true
5
4
  });
6
- const tslib_1 = /*#__PURE__*/require("tslib");
7
- tslib_1.__exportStar(require("./components/MenuButton/index"), exports);
5
+ const _exportStar = require("@swc/helpers/lib/_export_star.js").default;
6
+ _exportStar(require("./components/MenuButton/index"), exports);
7
+ //# sourceMappingURL=MenuButton.js.map
8
+
8
9
  //# sourceMappingURL=MenuButton.js.map
@@ -1 +1 @@
1
- {"version":3,"mappings":";;;;;;AAAAA","names":["tslib_1"],"sourceRoot":"","sources":["../../../../../../../packages/react-components/react-button/src/MenuButton.ts"],"sourcesContent":["export * from './components/MenuButton/index';\n"]}
1
+ {"version":3,"sources":["../lib/MenuButton.js"],"sourcesContent":["export * from './components/MenuButton/index';\n//# sourceMappingURL=MenuButton.js.map"],"names":[],"mappings":";;;;;oBAAc;CACd,sCAAsC"}
@@ -1,8 +1,9 @@
1
1
  "use strict";
2
-
3
2
  Object.defineProperty(exports, "__esModule", {
4
- value: true
3
+ value: true
5
4
  });
6
- const tslib_1 = /*#__PURE__*/require("tslib");
7
- tslib_1.__exportStar(require("./components/SplitButton/index"), exports);
5
+ const _exportStar = require("@swc/helpers/lib/_export_star.js").default;
6
+ _exportStar(require("./components/SplitButton/index"), exports);
7
+ //# sourceMappingURL=SplitButton.js.map
8
+
8
9
  //# sourceMappingURL=SplitButton.js.map
@@ -1 +1 @@
1
- {"version":3,"mappings":";;;;;;AAAAA","names":["tslib_1"],"sourceRoot":"","sources":["../../../../../../../packages/react-components/react-button/src/SplitButton.ts"],"sourcesContent":["export * from './components/SplitButton/index';\n"]}
1
+ {"version":3,"sources":["../lib/SplitButton.js"],"sourcesContent":["export * from './components/SplitButton/index';\n//# sourceMappingURL=SplitButton.js.map"],"names":[],"mappings":";;;;;oBAAc;CACd,uCAAuC"}
@@ -1,8 +1,9 @@
1
1
  "use strict";
2
-
3
2
  Object.defineProperty(exports, "__esModule", {
4
- value: true
3
+ value: true
5
4
  });
6
- const tslib_1 = /*#__PURE__*/require("tslib");
7
- tslib_1.__exportStar(require("./components/ToggleButton/index"), exports);
5
+ const _exportStar = require("@swc/helpers/lib/_export_star.js").default;
6
+ _exportStar(require("./components/ToggleButton/index"), exports);
7
+ //# sourceMappingURL=ToggleButton.js.map
8
+
8
9
  //# sourceMappingURL=ToggleButton.js.map
@@ -1 +1 @@
1
- {"version":3,"mappings":";;;;;;AAAAA","names":["tslib_1"],"sourceRoot":"","sources":["../../../../../../../packages/react-components/react-button/src/ToggleButton.ts"],"sourcesContent":["export * from './components/ToggleButton/index';\n"]}
1
+ {"version":3,"sources":["../lib/ToggleButton.js"],"sourcesContent":["export * from './components/ToggleButton/index';\n//# sourceMappingURL=ToggleButton.js.map"],"names":[],"mappings":";;;;;oBAAc;CACd,wCAAwC"}