@fluentui/react-accordion 9.0.0-nightly.b5b7401007.0 → 9.0.0-rc.3

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 (197) hide show
  1. package/CHANGELOG.json +439 -29
  2. package/CHANGELOG.md +99 -15
  3. package/Spec.md +36 -4
  4. package/dist/react-accordion.d.ts +50 -56
  5. package/lib/Accordion.js.map +1 -1
  6. package/lib/AccordionHeader.js.map +1 -1
  7. package/lib/AccordionItem.js.map +1 -1
  8. package/lib/AccordionPanel.js.map +1 -1
  9. package/lib/components/Accordion/Accordion.d.ts +1 -1
  10. package/lib/components/Accordion/Accordion.js +10 -8
  11. package/lib/components/Accordion/Accordion.js.map +1 -1
  12. package/lib/components/Accordion/Accordion.types.d.ts +7 -5
  13. package/lib/components/Accordion/Accordion.types.js.map +1 -1
  14. package/lib/components/Accordion/AccordionContext.js +4 -3
  15. package/lib/components/Accordion/AccordionContext.js.map +1 -1
  16. package/lib/components/Accordion/index.d.ts +1 -0
  17. package/lib/components/Accordion/index.js +1 -0
  18. package/lib/components/Accordion/index.js.map +1 -1
  19. package/lib/components/Accordion/renderAccordion.d.ts +1 -1
  20. package/lib/components/Accordion/renderAccordion.js +7 -7
  21. package/lib/components/Accordion/renderAccordion.js.map +1 -1
  22. package/lib/components/Accordion/useAccordion.d.ts +2 -3
  23. package/lib/components/Accordion/useAccordion.js +48 -63
  24. package/lib/components/Accordion/useAccordion.js.map +1 -1
  25. package/lib/components/Accordion/useAccordionContextValues.d.ts +1 -1
  26. package/lib/components/Accordion/useAccordionContextValues.js +13 -11
  27. package/lib/components/Accordion/useAccordionContextValues.js.map +1 -1
  28. package/lib/components/Accordion/useAccordionStyles.d.ts +3 -0
  29. package/lib/components/Accordion/useAccordionStyles.js +7 -0
  30. package/lib/components/Accordion/useAccordionStyles.js.map +1 -0
  31. package/lib/components/AccordionHeader/AccordionHeader.d.ts +2 -1
  32. package/lib/components/AccordionHeader/AccordionHeader.js +11 -10
  33. package/lib/components/AccordionHeader/AccordionHeader.js.map +1 -1
  34. package/lib/components/AccordionHeader/AccordionHeader.types.d.ts +12 -11
  35. package/lib/components/AccordionHeader/AccordionHeader.types.js.map +1 -1
  36. package/lib/components/AccordionHeader/AccordionHeaderContext.js +2 -4
  37. package/lib/components/AccordionHeader/AccordionHeaderContext.js.map +1 -1
  38. package/lib/components/AccordionHeader/index.d.ts +0 -1
  39. package/lib/components/AccordionHeader/index.js +0 -1
  40. package/lib/components/AccordionHeader/index.js.map +1 -1
  41. package/lib/components/AccordionHeader/renderAccordionHeader.d.ts +1 -1
  42. package/lib/components/AccordionHeader/renderAccordionHeader.js +11 -8
  43. package/lib/components/AccordionHeader/renderAccordionHeader.js.map +1 -1
  44. package/lib/components/AccordionHeader/useAccordionHeader.d.ts +2 -6
  45. package/lib/components/AccordionHeader/useAccordionHeader.js +53 -48
  46. package/lib/components/AccordionHeader/useAccordionHeader.js.map +1 -1
  47. package/lib/components/AccordionHeader/useAccordionHeaderContextValues.d.ts +1 -1
  48. package/lib/components/AccordionHeader/useAccordionHeaderContextValues.js +14 -14
  49. package/lib/components/AccordionHeader/useAccordionHeaderContextValues.js.map +1 -1
  50. package/lib/components/AccordionHeader/useAccordionHeaderStyles.d.ts +2 -1
  51. package/lib/components/AccordionHeader/useAccordionHeaderStyles.js +43 -52
  52. package/lib/components/AccordionHeader/useAccordionHeaderStyles.js.map +1 -1
  53. package/lib/components/AccordionItem/AccordionItem.d.ts +1 -1
  54. package/lib/components/AccordionItem/AccordionItem.js +10 -8
  55. package/lib/components/AccordionItem/AccordionItem.js.map +1 -1
  56. package/lib/components/AccordionItem/AccordionItem.types.d.ts +4 -3
  57. package/lib/components/AccordionItem/AccordionItem.types.js.map +1 -1
  58. package/lib/components/AccordionItem/AccordionItemContext.d.ts +1 -1
  59. package/lib/components/AccordionItem/AccordionItemContext.js +4 -5
  60. package/lib/components/AccordionItem/AccordionItemContext.js.map +1 -1
  61. package/lib/components/AccordionItem/index.d.ts +1 -0
  62. package/lib/components/AccordionItem/index.js +1 -0
  63. package/lib/components/AccordionItem/index.js.map +1 -1
  64. package/lib/components/AccordionItem/renderAccordionItem.d.ts +1 -1
  65. package/lib/components/AccordionItem/renderAccordionItem.js +7 -8
  66. package/lib/components/AccordionItem/renderAccordionItem.js.map +1 -1
  67. package/lib/components/AccordionItem/useAccordionItem.d.ts +2 -6
  68. package/lib/components/AccordionItem/useAccordionItem.js +24 -34
  69. package/lib/components/AccordionItem/useAccordionItem.js.map +1 -1
  70. package/lib/components/AccordionItem/useAccordionItemContextValues.d.ts +1 -1
  71. package/lib/components/AccordionItem/useAccordionItemContextValues.js +12 -12
  72. package/lib/components/AccordionItem/useAccordionItemContextValues.js.map +1 -1
  73. package/lib/components/AccordionItem/useAccordionItemStyles.d.ts +3 -0
  74. package/lib/components/AccordionItem/useAccordionItemStyles.js +7 -0
  75. package/lib/components/AccordionItem/useAccordionItemStyles.js.map +1 -0
  76. package/lib/components/AccordionPanel/AccordionPanel.d.ts +1 -1
  77. package/lib/components/AccordionPanel/AccordionPanel.js +8 -8
  78. package/lib/components/AccordionPanel/AccordionPanel.js.map +1 -1
  79. package/lib/components/AccordionPanel/AccordionPanel.types.d.ts +2 -2
  80. package/lib/components/AccordionPanel/AccordionPanel.types.js.map +1 -1
  81. package/lib/components/AccordionPanel/index.js.map +1 -1
  82. package/lib/components/AccordionPanel/renderAccordionPanel.d.ts +1 -1
  83. package/lib/components/AccordionPanel/renderAccordionPanel.js +7 -8
  84. package/lib/components/AccordionPanel/renderAccordionPanel.js.map +1 -1
  85. package/lib/components/AccordionPanel/useAccordionPanel.d.ts +2 -6
  86. package/lib/components/AccordionPanel/useAccordionPanel.js +13 -14
  87. package/lib/components/AccordionPanel/useAccordionPanel.js.map +1 -1
  88. package/lib/components/AccordionPanel/useAccordionPanelStyles.d.ts +2 -1
  89. package/lib/components/AccordionPanel/useAccordionPanelStyles.js +6 -5
  90. package/lib/components/AccordionPanel/useAccordionPanelStyles.js.map +1 -1
  91. package/lib/index.js.map +1 -1
  92. package/lib-commonjs/Accordion.js +1 -1
  93. package/lib-commonjs/Accordion.js.map +1 -1
  94. package/lib-commonjs/AccordionHeader.js +1 -1
  95. package/lib-commonjs/AccordionHeader.js.map +1 -1
  96. package/lib-commonjs/AccordionItem.js +1 -1
  97. package/lib-commonjs/AccordionItem.js.map +1 -1
  98. package/lib-commonjs/AccordionPanel.js +1 -1
  99. package/lib-commonjs/AccordionPanel.js.map +1 -1
  100. package/lib-commonjs/components/Accordion/Accordion.d.ts +1 -1
  101. package/lib-commonjs/components/Accordion/Accordion.js +12 -9
  102. package/lib-commonjs/components/Accordion/Accordion.js.map +1 -1
  103. package/lib-commonjs/components/Accordion/Accordion.types.d.ts +7 -5
  104. package/lib-commonjs/components/Accordion/Accordion.types.js.map +1 -1
  105. package/lib-commonjs/components/Accordion/AccordionContext.js +4 -3
  106. package/lib-commonjs/components/Accordion/AccordionContext.js.map +1 -1
  107. package/lib-commonjs/components/Accordion/index.d.ts +1 -0
  108. package/lib-commonjs/components/Accordion/index.js +3 -1
  109. package/lib-commonjs/components/Accordion/index.js.map +1 -1
  110. package/lib-commonjs/components/Accordion/renderAccordion.d.ts +1 -1
  111. package/lib-commonjs/components/Accordion/renderAccordion.js +12 -13
  112. package/lib-commonjs/components/Accordion/renderAccordion.js.map +1 -1
  113. package/lib-commonjs/components/Accordion/useAccordion.d.ts +2 -3
  114. package/lib-commonjs/components/Accordion/useAccordion.js +53 -68
  115. package/lib-commonjs/components/Accordion/useAccordion.js.map +1 -1
  116. package/lib-commonjs/components/Accordion/useAccordionContextValues.d.ts +1 -1
  117. package/lib-commonjs/components/Accordion/useAccordionContextValues.js +15 -13
  118. package/lib-commonjs/components/Accordion/useAccordionContextValues.js.map +1 -1
  119. package/lib-commonjs/components/Accordion/useAccordionStyles.d.ts +3 -0
  120. package/lib-commonjs/components/Accordion/useAccordionStyles.js +18 -0
  121. package/lib-commonjs/components/Accordion/useAccordionStyles.js.map +1 -0
  122. package/lib-commonjs/components/AccordionHeader/AccordionHeader.d.ts +2 -1
  123. package/lib-commonjs/components/AccordionHeader/AccordionHeader.js +12 -11
  124. package/lib-commonjs/components/AccordionHeader/AccordionHeader.js.map +1 -1
  125. package/lib-commonjs/components/AccordionHeader/AccordionHeader.types.d.ts +12 -11
  126. package/lib-commonjs/components/AccordionHeader/AccordionHeader.types.js.map +1 -1
  127. package/lib-commonjs/components/AccordionHeader/AccordionHeaderContext.js +2 -4
  128. package/lib-commonjs/components/AccordionHeader/AccordionHeaderContext.js.map +1 -1
  129. package/lib-commonjs/components/AccordionHeader/index.d.ts +0 -1
  130. package/lib-commonjs/components/AccordionHeader/index.js +1 -3
  131. package/lib-commonjs/components/AccordionHeader/index.js.map +1 -1
  132. package/lib-commonjs/components/AccordionHeader/renderAccordionHeader.d.ts +1 -1
  133. package/lib-commonjs/components/AccordionHeader/renderAccordionHeader.js +16 -15
  134. package/lib-commonjs/components/AccordionHeader/renderAccordionHeader.js.map +1 -1
  135. package/lib-commonjs/components/AccordionHeader/useAccordionHeader.d.ts +2 -6
  136. package/lib-commonjs/components/AccordionHeader/useAccordionHeader.js +60 -54
  137. package/lib-commonjs/components/AccordionHeader/useAccordionHeader.js.map +1 -1
  138. package/lib-commonjs/components/AccordionHeader/useAccordionHeaderContextValues.d.ts +1 -1
  139. package/lib-commonjs/components/AccordionHeader/useAccordionHeaderContextValues.js +17 -17
  140. package/lib-commonjs/components/AccordionHeader/useAccordionHeaderContextValues.js.map +1 -1
  141. package/lib-commonjs/components/AccordionHeader/useAccordionHeaderStyles.d.ts +2 -1
  142. package/lib-commonjs/components/AccordionHeader/useAccordionHeaderStyles.js +50 -57
  143. package/lib-commonjs/components/AccordionHeader/useAccordionHeaderStyles.js.map +1 -1
  144. package/lib-commonjs/components/AccordionItem/AccordionItem.d.ts +1 -1
  145. package/lib-commonjs/components/AccordionItem/AccordionItem.js +12 -9
  146. package/lib-commonjs/components/AccordionItem/AccordionItem.js.map +1 -1
  147. package/lib-commonjs/components/AccordionItem/AccordionItem.types.d.ts +4 -3
  148. package/lib-commonjs/components/AccordionItem/AccordionItem.types.js.map +1 -1
  149. package/lib-commonjs/components/AccordionItem/AccordionItemContext.d.ts +1 -1
  150. package/lib-commonjs/components/AccordionItem/AccordionItemContext.js +6 -7
  151. package/lib-commonjs/components/AccordionItem/AccordionItemContext.js.map +1 -1
  152. package/lib-commonjs/components/AccordionItem/index.d.ts +1 -0
  153. package/lib-commonjs/components/AccordionItem/index.js +3 -1
  154. package/lib-commonjs/components/AccordionItem/index.js.map +1 -1
  155. package/lib-commonjs/components/AccordionItem/renderAccordionItem.d.ts +1 -1
  156. package/lib-commonjs/components/AccordionItem/renderAccordionItem.js +12 -15
  157. package/lib-commonjs/components/AccordionItem/renderAccordionItem.js.map +1 -1
  158. package/lib-commonjs/components/AccordionItem/useAccordionItem.d.ts +2 -6
  159. package/lib-commonjs/components/AccordionItem/useAccordionItem.js +31 -42
  160. package/lib-commonjs/components/AccordionItem/useAccordionItem.js.map +1 -1
  161. package/lib-commonjs/components/AccordionItem/useAccordionItemContextValues.d.ts +1 -1
  162. package/lib-commonjs/components/AccordionItem/useAccordionItemContextValues.js +15 -15
  163. package/lib-commonjs/components/AccordionItem/useAccordionItemContextValues.js.map +1 -1
  164. package/lib-commonjs/components/AccordionItem/useAccordionItemStyles.d.ts +3 -0
  165. package/lib-commonjs/components/AccordionItem/useAccordionItemStyles.js +18 -0
  166. package/lib-commonjs/components/AccordionItem/useAccordionItemStyles.js.map +1 -0
  167. package/lib-commonjs/components/AccordionPanel/AccordionPanel.d.ts +1 -1
  168. package/lib-commonjs/components/AccordionPanel/AccordionPanel.js +9 -9
  169. package/lib-commonjs/components/AccordionPanel/AccordionPanel.js.map +1 -1
  170. package/lib-commonjs/components/AccordionPanel/AccordionPanel.types.d.ts +2 -2
  171. package/lib-commonjs/components/AccordionPanel/AccordionPanel.types.js.map +1 -1
  172. package/lib-commonjs/components/AccordionPanel/index.js +1 -1
  173. package/lib-commonjs/components/AccordionPanel/index.js.map +1 -1
  174. package/lib-commonjs/components/AccordionPanel/renderAccordionPanel.d.ts +1 -1
  175. package/lib-commonjs/components/AccordionPanel/renderAccordionPanel.js +11 -14
  176. package/lib-commonjs/components/AccordionPanel/renderAccordionPanel.js.map +1 -1
  177. package/lib-commonjs/components/AccordionPanel/useAccordionPanel.d.ts +2 -6
  178. package/lib-commonjs/components/AccordionPanel/useAccordionPanel.js +17 -19
  179. package/lib-commonjs/components/AccordionPanel/useAccordionPanel.js.map +1 -1
  180. package/lib-commonjs/components/AccordionPanel/useAccordionPanelStyles.d.ts +2 -1
  181. package/lib-commonjs/components/AccordionPanel/useAccordionPanelStyles.js +9 -8
  182. package/lib-commonjs/components/AccordionPanel/useAccordionPanelStyles.js.map +1 -1
  183. package/lib-commonjs/index.js +1 -1
  184. package/lib-commonjs/index.js.map +1 -1
  185. package/package.json +17 -19
  186. package/lib/common/isConformant.d.ts +0 -4
  187. package/lib/common/isConformant.js +0 -12
  188. package/lib/common/isConformant.js.map +0 -1
  189. package/lib/components/AccordionHeader/AccordionHeaderExpandIcon.d.ts +0 -3
  190. package/lib/components/AccordionHeader/AccordionHeaderExpandIcon.js +0 -42
  191. package/lib/components/AccordionHeader/AccordionHeaderExpandIcon.js.map +0 -1
  192. package/lib-commonjs/common/isConformant.d.ts +0 -4
  193. package/lib-commonjs/common/isConformant.js +0 -23
  194. package/lib-commonjs/common/isConformant.js.map +0 -1
  195. package/lib-commonjs/components/AccordionHeader/AccordionHeaderExpandIcon.d.ts +0 -3
  196. package/lib-commonjs/components/AccordionHeader/AccordionHeaderExpandIcon.js +0 -52
  197. package/lib-commonjs/components/AccordionHeader/AccordionHeaderExpandIcon.js.map +0 -1
@@ -1,80 +1,88 @@
1
- import { __assign } from "tslib";
1
+ import * as React from 'react';
2
2
  import { getNativeElementProps, resolveShorthand, useEventCallback } from '@fluentui/react-utilities';
3
- import { useAccordionItemContext } from '../AccordionItem/index';
4
- import { AccordionHeaderExpandIcon } from './AccordionHeaderExpandIcon';
3
+ import { useAccordionItemContext_unstable } from '../AccordionItem/index';
5
4
  import { useARIAButton } from '@fluentui/react-aria';
6
5
  import { useContextSelector } from '@fluentui/react-context-selector';
7
6
  import { AccordionContext } from '../Accordion/AccordionContext';
8
- /**
9
- * Const listing which props are shorthand props.
10
- */
11
-
12
- export var accordionHeaderShorthandProps = ['root', 'icon', 'button', 'children', 'expandIcon'];
7
+ import { ChevronRightRegular } from '@fluentui/react-icons';
8
+ import { useFluent } from '@fluentui/react-shared-contexts';
13
9
  /**
14
10
  * Returns the props and state required to render the component
15
11
  * @param props - AccordionHeader properties
16
12
  * @param ref - reference to root HTMLElement of AccordionHeader
17
13
  */
18
14
 
19
- export var useAccordionHeader = function (props, ref) {
20
- var icon = props.icon,
21
- button = props.button,
22
- children = props.children,
23
- expandIcon = props.expandIcon,
24
- _a = props.inline,
25
- inline = _a === void 0 ? false : _a,
26
- _b = props.size,
27
- size = _b === void 0 ? 'medium' : _b,
28
- _c = props.expandIconPosition,
29
- expandIconPosition = _c === void 0 ? 'start' : _c;
30
-
31
- var _d = useAccordionItemContext(),
32
- onAccordionHeaderClick = _d.onHeaderClick,
33
- disabled = _d.disabled,
34
- open = _d.open;
15
+ export const useAccordionHeader_unstable = (props, ref) => {
16
+ const {
17
+ as,
18
+ icon,
19
+ button,
20
+ expandIcon,
21
+ inline = false,
22
+ size = 'medium',
23
+ expandIconPosition = 'start'
24
+ } = props;
25
+ const {
26
+ onHeaderClick: onAccordionHeaderClick,
27
+ disabled,
28
+ open
29
+ } = useAccordionItemContext_unstable();
35
30
  /**
36
31
  * force disabled state on button if accordion isn't collapsible
37
32
  * and this is the only item opened
38
33
  */
39
34
 
35
+ const disabledFocusable = useContextSelector(AccordionContext, ctx => !ctx.collapsible && ctx.openItems.length === 1 && open);
36
+ const {
37
+ dir
38
+ } = useFluent(); // Calculate how to rotate the expand icon [>] (ChevronRightRegular)
40
39
 
41
- var disabledFocusable = useContextSelector(AccordionContext, function (ctx) {
42
- return !ctx.collapsible && ctx.openItems.length === 1 && open;
43
- });
44
- var buttonShorthand = useARIAButton(button, {
40
+ let expandIconRotation;
41
+
42
+ if (expandIconPosition === 'end') {
43
+ // If expand icon is at the end, the chevron points up [^] when open, and down [v] when closed
44
+ expandIconRotation = open ? -90 : 90;
45
+ } else {
46
+ // Otherwise, the chevron points down [v] when open, and right [>] (or left [<] in RTL) when closed
47
+ expandIconRotation = open ? 90 : dir !== 'rtl' ? 0 : 180;
48
+ }
49
+
50
+ const buttonShorthand = useARIAButton(button, {
45
51
  required: true,
46
52
  defaultProps: {
47
- disabled: disabled,
48
- disabledFocusable: disabledFocusable,
53
+ disabled,
54
+ disabledFocusable,
49
55
  'aria-expanded': open
50
56
  }
51
57
  });
52
58
  return {
53
- disabled: disabled,
54
- open: open,
55
- size: size,
56
- inline: inline,
57
- expandIconPosition: expandIconPosition,
59
+ disabled,
60
+ open,
61
+ size,
62
+ inline,
63
+ expandIconPosition,
58
64
  components: {
59
65
  root: 'div',
60
66
  button: 'button',
61
- expandIcon: AccordionHeaderExpandIcon,
62
- icon: 'div',
63
- children: 'div'
67
+ expandIcon: 'span',
68
+ icon: 'div'
64
69
  },
65
- root: getNativeElementProps('div', __assign({
66
- ref: ref,
67
- role: 'heading'
68
- }, props)),
70
+ root: getNativeElementProps(as || 'div', {
71
+ ref,
72
+ ...props
73
+ }),
69
74
  icon: resolveShorthand(icon),
70
75
  expandIcon: resolveShorthand(expandIcon, {
71
76
  required: true,
72
77
  defaultProps: {
78
+ children: /*#__PURE__*/React.createElement(ChevronRightRegular, {
79
+ transform: `rotate(${expandIconRotation})`
80
+ }),
73
81
  'aria-hidden': true
74
82
  }
75
83
  }),
76
- button: __assign(__assign({}, buttonShorthand), {
77
- onClick: useEventCallback(function (ev) {
84
+ button: { ...buttonShorthand,
85
+ onClick: useEventCallback(ev => {
78
86
  var _a;
79
87
 
80
88
  (_a = buttonShorthand.onClick) === null || _a === void 0 ? void 0 : _a.call(buttonShorthand, ev);
@@ -83,10 +91,7 @@ export var useAccordionHeader = function (props, ref) {
83
91
  onAccordionHeaderClick(ev);
84
92
  }
85
93
  })
86
- }),
87
- children: resolveShorthand(children, {
88
- required: true
89
- })
94
+ }
90
95
  };
91
96
  };
92
97
  //# sourceMappingURL=useAccordionHeader.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/AccordionHeader/useAccordionHeader.ts"],"names":[],"mappings":"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","sourceRoot":""}
1
+ {"version":3,"sources":["components/AccordionHeader/useAccordionHeader.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, resolveShorthand, useEventCallback } from '@fluentui/react-utilities';\nimport { useAccordionItemContext_unstable } from '../AccordionItem/index';\nimport { useARIAButton } from '@fluentui/react-aria';\nimport type { AccordionHeaderProps, AccordionHeaderState } from './AccordionHeader.types';\nimport { useContextSelector } from '@fluentui/react-context-selector';\nimport { AccordionContext } from '../Accordion/AccordionContext';\nimport { ChevronRightRegular } from '@fluentui/react-icons';\nimport { useFluent } from '@fluentui/react-shared-contexts';\n\n/**\n * Returns the props and state required to render the component\n * @param props - AccordionHeader properties\n * @param ref - reference to root HTMLElement of AccordionHeader\n */\nexport const useAccordionHeader_unstable = (\n props: AccordionHeaderProps,\n ref: React.Ref<HTMLElement>,\n): AccordionHeaderState => {\n const { as, icon, button, expandIcon, inline = false, size = 'medium', expandIconPosition = 'start' } = props;\n const { onHeaderClick: onAccordionHeaderClick, disabled, open } = useAccordionItemContext_unstable();\n\n /**\n * force disabled state on button if accordion isn't collapsible\n * and this is the only item opened\n */\n const disabledFocusable = useContextSelector(\n AccordionContext,\n ctx => !ctx.collapsible && ctx.openItems.length === 1 && open,\n );\n\n const { dir } = useFluent();\n\n // Calculate how to rotate the expand icon [>] (ChevronRightRegular)\n let expandIconRotation: 0 | 90 | -90 | 180;\n if (expandIconPosition === 'end') {\n // If expand icon is at the end, the chevron points up [^] when open, and down [v] when closed\n expandIconRotation = open ? -90 : 90;\n } else {\n // Otherwise, the chevron points down [v] when open, and right [>] (or left [<] in RTL) when closed\n expandIconRotation = open ? 90 : dir !== 'rtl' ? 0 : 180;\n }\n\n const buttonShorthand = useARIAButton(button, {\n required: true,\n defaultProps: {\n disabled,\n disabledFocusable,\n 'aria-expanded': open,\n },\n });\n\n return {\n disabled,\n open,\n size,\n inline,\n expandIconPosition,\n components: {\n root: 'div',\n button: 'button',\n expandIcon: 'span',\n icon: 'div',\n },\n root: getNativeElementProps(as || 'div', {\n ref,\n ...props,\n }),\n icon: resolveShorthand(icon),\n expandIcon: resolveShorthand(expandIcon, {\n required: true,\n defaultProps: {\n children: <ChevronRightRegular transform={`rotate(${expandIconRotation})`} />,\n 'aria-hidden': true,\n },\n }),\n button: {\n ...buttonShorthand,\n onClick: useEventCallback(\n (ev: React.MouseEvent<HTMLButtonElement & HTMLDivElement & HTMLSpanElement & HTMLAnchorElement>) => {\n buttonShorthand.onClick?.(ev);\n if (!ev.defaultPrevented) {\n onAccordionHeaderClick(ev);\n }\n },\n ),\n },\n };\n};\n"],"sourceRoot":"../src/"}
@@ -1,2 +1,2 @@
1
1
  import type { AccordionHeaderState, AccordionHeaderContextValues } from './AccordionHeader.types';
2
- export declare function useAccordionHeaderContextValues(state: AccordionHeaderState): AccordionHeaderContextValues;
2
+ export declare function useAccordionHeaderContextValues_unstable(state: AccordionHeaderState): AccordionHeaderContextValues;
@@ -1,19 +1,19 @@
1
1
  import * as React from 'react';
2
- export function useAccordionHeaderContextValues(state) {
3
- var disabled = state.disabled,
4
- expandIconPosition = state.expandIconPosition,
5
- open = state.open,
6
- size = state.size;
7
- var accordionHeader = React.useMemo(function () {
8
- return {
9
- disabled: disabled,
10
- expandIconPosition: expandIconPosition,
11
- open: open,
12
- size: size
13
- };
14
- }, [disabled, expandIconPosition, open, size]);
2
+ export function useAccordionHeaderContextValues_unstable(state) {
3
+ const {
4
+ disabled,
5
+ expandIconPosition,
6
+ open,
7
+ size
8
+ } = state;
9
+ const accordionHeader = React.useMemo(() => ({
10
+ disabled,
11
+ expandIconPosition,
12
+ open,
13
+ size
14
+ }), [disabled, expandIconPosition, open, size]);
15
15
  return {
16
- accordionHeader: accordionHeader
16
+ accordionHeader
17
17
  };
18
18
  }
19
19
  //# sourceMappingURL=useAccordionHeaderContextValues.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/AccordionHeader/useAccordionHeaderContextValues.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AAOA,OAAM,SAAU,+BAAV,CAA0C,KAA1C,EAAqE;AACjE,MAAA,QAAQ,GAAqC,KAAK,CAA1C,QAAR;AAAA,MAAU,kBAAkB,GAAiB,KAAK,CAAtB,kBAA5B;AAAA,MAA8B,IAAI,GAAW,KAAK,CAAhB,IAAlC;AAAA,MAAoC,IAAI,GAAK,KAAK,CAAV,IAAxC;AAER,MAAM,eAAe,GAAG,KAAK,CAAC,OAAN,CACtB,YAAA;AAAM,WAAC;AACL,MAAA,QAAQ,EAAA,QADH;AAEL,MAAA,kBAAkB,EAAA,kBAFb;AAGL,MAAA,IAAI,EAAA,IAHC;AAIL,MAAA,IAAI,EAAA;AAJC,KAAD;AAKJ,GANoB,EAOtB,CAAC,QAAD,EAAW,kBAAX,EAA+B,IAA/B,EAAqC,IAArC,CAPsB,CAAxB;AAUA,SAAO;AAAE,IAAA,eAAe,EAAA;AAAjB,GAAP;AACD","sourceRoot":""}
1
+ {"version":3,"sources":["components/AccordionHeader/useAccordionHeaderContextValues.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AAOA,OAAM,SAAU,wCAAV,CAAmD,KAAnD,EAA8E;AAClF,QAAM;AAAE,IAAA,QAAF;AAAY,IAAA,kBAAZ;AAAgC,IAAA,IAAhC;AAAsC,IAAA;AAAtC,MAA+C,KAArD;AAEA,QAAM,eAAe,GAAG,KAAK,CAAC,OAAN,CACtB,OAAO;AACL,IAAA,QADK;AAEL,IAAA,kBAFK;AAGL,IAAA,IAHK;AAIL,IAAA;AAJK,GAAP,CADsB,EAOtB,CAAC,QAAD,EAAW,kBAAX,EAA+B,IAA/B,EAAqC,IAArC,CAPsB,CAAxB;AAUA,SAAO;AAAE,IAAA;AAAF,GAAP;AACD","sourcesContent":["import * as React from 'react';\nimport type {\n AccordionHeaderContextValue,\n AccordionHeaderState,\n AccordionHeaderContextValues,\n} from './AccordionHeader.types';\n\nexport function useAccordionHeaderContextValues_unstable(state: AccordionHeaderState): AccordionHeaderContextValues {\n const { disabled, expandIconPosition, open, size } = state;\n\n const accordionHeader = React.useMemo<AccordionHeaderContextValue>(\n () => ({\n disabled,\n expandIconPosition,\n open,\n size,\n }),\n [disabled, expandIconPosition, open, size],\n );\n\n return { accordionHeader };\n}\n"],"sourceRoot":"../src/"}
@@ -1,3 +1,4 @@
1
1
  import type { AccordionHeaderState } from './AccordionHeader.types';
2
+ export declare const accordionHeaderClassName = "fui-AccordionHeader";
2
3
  /** Applies style classnames to slots */
3
- export declare const useAccordionHeaderStyles: (state: AccordionHeaderState) => AccordionHeaderState;
4
+ export declare const useAccordionHeaderStyles_unstable: (state: AccordionHeaderState) => AccordionHeaderState;
@@ -1,14 +1,18 @@
1
- import { __styles, mergeClasses } from '@fluentui/react-make-styles';
1
+ import { shorthands, __styles, mergeClasses } from '@griffel/react';
2
2
  import { createFocusOutlineStyle } from '@fluentui/react-tabster';
3
+ import { tokens } from '@fluentui/react-theme';
4
+ export const accordionHeaderClassName = 'fui-AccordionHeader';
3
5
 
4
- var useStyles = /*#__PURE__*/__styles({
6
+ const useStyles = /*#__PURE__*/__styles({
5
7
  "resetButton": {
6
8
  "B7ck84d": "f1e4lqlz",
7
- "ayd6f0": "f1k2sg7s",
9
+ "De3pzq": "f1u2r49w",
8
10
  "sj55zd": "f1ym3bx4",
9
- "Bkuyir6": "f15dniw2",
11
+ "Bahqtrf": "f1mo0ibp",
12
+ "Be2twd7": "fjoy568",
10
13
  "Bg96gwp": "fytdu2e",
11
- "Bpg54ce": "f1gl81tg",
14
+ "B68tc82": "f1mtd64y",
15
+ "Bmxbyg5": "f1y7q3j9",
12
16
  "z8tnut": "f1g0x7ka",
13
17
  "z189sj": ["fhxju0i", "f1cnd47f"],
14
18
  "Byoj8tv": "f1qch9an",
@@ -19,28 +23,16 @@ var useStyles = /*#__PURE__*/__styles({
19
23
  },
20
24
  "focusIndicator": {
21
25
  "B486eqv": "f2hkw1w",
22
- "Bnmjwt4": "flfsvnh",
23
- "Jopkrh": ["f1781m5e", "flvaaa9"],
24
- "hhrs2v": "f50u1b5",
25
- "B7jbng7": ["flvaaa9", "f1781m5e"],
26
+ "B1bra5l": "fc85khu",
26
27
  "e8izhr": "f1pxpxw8",
27
28
  "in3gf6": "f1149fnl",
28
29
  "B1i23sz": "fd1orka",
29
30
  "ln9as": "fgtqheg",
30
31
  "Bfgg0yq": "fq7mjg8",
31
- "B7231uf": "fmqgchs",
32
- "Bxoolf0": ["f1lv6wi8", "famjx04"],
33
- "fo1iai": "f1nbyjd2",
34
- "Bh81ga8": ["famjx04", "f1lv6wi8"],
35
- "qztvpn": "f5n18is",
36
- "ge3ubn": ["f13az7yk", "f14kwzu1"],
37
- "F41yt0": "fneogx5",
38
- "Bxrdl85": ["f14kwzu1", "f13az7yk"],
32
+ "i16j1i": "fq9bj62",
33
+ "yxydaw": "fy07e8r",
39
34
  "B9sa02e": "f1ha6shg",
40
- "hzsgvt": "f1f43d5r",
41
- "Ba9tnbb": ["f1ib27sc", "f14s7j5v"],
42
- "Fpkomr": "f13oqbgc",
43
- "Bttdqvk": ["f14s7j5v", "f1ib27sc"],
35
+ "yaquy9": "f4ltwxu",
44
36
  "Bl8qd6i": "f1284xzw",
45
37
  "Byzgy54": "f14dru39",
46
38
  "mq8cyt": ["fvabyfg", "f12y1wz2"],
@@ -49,10 +41,17 @@ var useStyles = /*#__PURE__*/__styles({
49
41
  "root": {
50
42
  "sj55zd": "f19n0e5",
51
43
  "De3pzq": "fxugw4r",
52
- "Dimara": "fl4tsp0"
44
+ "B6of3ja": "f1hu3pq6",
45
+ "t21cq0": ["f11qmguv", "f1tyq0we"],
46
+ "jrapky": "f19f4twv",
47
+ "Frg6f3": ["f1tyq0we", "f11qmguv"],
48
+ "Bbmb7ep": ["f2i1086", "f1rlsnju"],
49
+ "Beyfa6y": ["f1rlsnju", "f2i1086"],
50
+ "B7oj6ja": ["f1stktl2", "f1127022"],
51
+ "Btl43ni": ["f1127022", "f1stktl2"]
53
52
  },
54
53
  "rootDisabled": {
55
- "De3pzq": "flu3bqm",
54
+ "Bcmaq0h": "fwrgwhw",
56
55
  "sj55zd": "f1s2aq7o"
57
56
  },
58
57
  "rootInline": {
@@ -78,69 +77,61 @@ var useStyles = /*#__PURE__*/__styles({
78
77
  "Bqenvij": "f1ft4266",
79
78
  "mc9l5x": "f22iagw",
80
79
  "Bt984gj": "f122n59",
81
- "Bceei9c": "f1k6fduh"
80
+ "Bceei9c": "f1k6fduh",
81
+ "Be2twd7": "fkhj508",
82
+ "Bahqtrf": "fk6fouc"
82
83
  },
83
84
  "buttonSmall": {
84
- "Bqenvij": "f1d2rq10"
85
+ "Bqenvij": "f1d2rq10",
86
+ "Be2twd7": "fy9rknc"
87
+ },
88
+ "buttonLarge": {
89
+ "Be2twd7": "fod5ikn"
90
+ },
91
+ "buttonExtraLarge": {
92
+ "Be2twd7": "f1pp30po"
85
93
  },
86
94
  "buttonInline": {
87
95
  "mc9l5x": "ftuwxu6"
88
96
  },
89
97
  "expandIcon": {
90
- "Bg96gwp": "fez10in"
98
+ "Bg96gwp": "fez10in",
99
+ "Be2twd7": "fe5j1ua"
91
100
  },
92
101
  "expandIconStart": {
93
102
  "z189sj": ["f19lj068", "f177v4lu"]
94
103
  },
95
104
  "expandIconEnd": {
96
105
  "Bh6795r": "fqerorx",
106
+ "Bnnss6s": "f1neuvcm",
107
+ "xawz": "flqd7gy",
97
108
  "mc9l5x": "f22iagw",
98
109
  "Brf1p80": "f9c4gz4",
99
110
  "uwmqm3": ["f177v4lu", "f19lj068"]
100
111
  },
101
112
  "icon": {
102
113
  "t21cq0": ["f1phki43", "ff9s3yw"],
103
- "Frg6f3": ["ff9s3yw", "f1phki43"]
114
+ "Be2twd7": "fe5j1ua"
104
115
  },
105
116
  "iconExpandIconEnd": {
106
117
  "Frg6f3": ["f1oou7ox", "f1pxv85q"]
107
- },
108
- "children": {
109
- "Be2twd7": "fkhj508",
110
- "Bahqtrf": "fk6fouc",
111
- "ygn44y": "f1cmbuwj",
112
- "Huce71": "fz5stix",
113
- "Bpg54ce": "f1a3p1vp"
114
- },
115
- "childrenSmall": {
116
- "Be2twd7": "fy9rknc"
117
- },
118
- "childrenLarge": {
119
- "Be2twd7": "fod5ikn"
120
- },
121
- "childrenExtraLarge": {
122
- "Be2twd7": "f1pp30po"
123
118
  }
124
119
  }, {
125
- "d": [".f1e4lqlz{box-sizing:content-box;}", ".f1k2sg7s{background:none;}", ".f1ym3bx4{color:inherit;}", ".f15dniw2{font:inherit;}", ".fytdu2e{line-height:normal;}", ".f1gl81tg{overflow:visible;}", ".f1g0x7ka{padding-top:0;}", ".fhxju0i{padding-right:0;}", ".f1cnd47f{padding-left:0;}", ".f1qch9an{padding-bottom:0;}", ".f37px4s{-webkit-appearance:button;}", ".f1xqy1su{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}", ".fgusgyc{text-align:unset;}", "[data-keyboard-nav] .flfsvnh:focus{border-top-color:transparent;}", "[data-keyboard-nav] .f1781m5e:focus{border-right-color:transparent;}", "[data-keyboard-nav] .flvaaa9:focus{border-left-color:transparent;}", "[data-keyboard-nav] .f50u1b5:focus{border-bottom-color:transparent;}", "[data-keyboard-nav] .f1pxpxw8:focus:after{content:\"\";}", "[data-keyboard-nav] .f1149fnl:focus:after{position:absolute;}", "[data-keyboard-nav] .fd1orka:focus:after{pointer-events:none;}", "[data-keyboard-nav] .fgtqheg:focus:after{box-sizing:outline-box;}", "[data-keyboard-nav] .fq7mjg8:focus:after{z-index:1;}", "[data-keyboard-nav] .fmqgchs:focus:after{border-top-style:solid;}", "[data-keyboard-nav] .f1lv6wi8:focus:after{border-right-style:solid;}", "[data-keyboard-nav] .famjx04:focus:after{border-left-style:solid;}", "[data-keyboard-nav] .f1nbyjd2:focus:after{border-bottom-style:solid;}", "[data-keyboard-nav] .f5n18is:focus:after{border-top-width:2px;}", "[data-keyboard-nav] .f13az7yk:focus:after{border-right-width:2px;}", "[data-keyboard-nav] .f14kwzu1:focus:after{border-left-width:2px;}", "[data-keyboard-nav] .fneogx5:focus:after{border-bottom-width:2px;}", "[data-keyboard-nav] .f1ha6shg:focus:after{border-radius:var(--borderRadiusMedium);}", "[data-keyboard-nav] .f1f43d5r:focus:after{border-top-color:var(--colorStrokeFocus2);}", "[data-keyboard-nav] .f1ib27sc:focus:after{border-right-color:var(--colorStrokeFocus2);}", "[data-keyboard-nav] .f14s7j5v:focus:after{border-left-color:var(--colorStrokeFocus2);}", "[data-keyboard-nav] .f13oqbgc:focus:after{border-bottom-color:var(--colorStrokeFocus2);}", "[data-keyboard-nav] .f1284xzw:focus:after{top:-2px;}", "[data-keyboard-nav] .f14dru39:focus:after{bottom:-2px;}", "[data-keyboard-nav] .fvabyfg:focus:after{left:-2px;}", "[data-keyboard-nav] .f12y1wz2:focus:after{right:-2px;}", ".f19n0e5{color:var(--colorNeutralForeground1);}", ".fxugw4r{background-color:var(--colorNeutralBackground1);}", ".fl4tsp0{border-radius:2px;}", ".flu3bqm{background-color:none;}", ".f1s2aq7o{color:var(--colorNeutralForegroundDisabled);}", ".f14t3ns0{display:inline-block;}", ".f10pi13n{position:relative;}", ".f1wfwcyy{width:calc(100% - 22px);}", ".f5ogflp{border-top-width:1px;}", ".f1hqa2wf{border-right-width:1px;}", ".finvdd3{border-left-width:1px;}", ".f1f09k3d{border-bottom-width:1px;}", ".fzkkow9{border-top-style:solid;}", ".fcdblym{border-right-style:solid;}", ".fjik90z{border-left-style:solid;}", ".fg706s2{border-bottom-style:solid;}", ".f1p3nwhy{border-top-color:transparent;}", ".f11589ue{border-right-color:transparent;}", ".f1pdflbu{border-left-color:transparent;}", ".f1q5o8ev{border-bottom-color:transparent;}", ".f81rol6{padding-right:10px;}", ".frdkuqy{padding-left:10px;}", ".f1ft4266{height:44px;}", ".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}", ".f122n59{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}", ".f1k6fduh{cursor:pointer;}", ".f1d2rq10{height:32px;}", ".ftuwxu6{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;}", ".fez10in{line-height:0;}", ".f19lj068{padding-right:8px;}", ".f177v4lu{padding-left:8px;}", ".fqerorx{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}", ".f9c4gz4{-webkit-box-pack:end;-ms-flex-pack:end;-webkit-justify-content:flex-end;justify-content:flex-end;}", ".f1phki43{margin-right:8px;}", ".ff9s3yw{margin-left:8px;}", ".f1oou7ox{margin-left:10px;}", ".f1pxv85q{margin-right:10px;}", ".fkhj508{font-size:var(--fontSizeBase300);}", ".fk6fouc{font-family:var(--fontFamilyBase);}", ".f1cmbuwj{text-overflow:ellipsis;}", ".fz5stix{white-space:nowrap;}", ".f1a3p1vp{overflow:hidden;}", ".fy9rknc{font-size:var(--fontSizeBase200);}", ".fod5ikn{font-size:var(--fontSizeBase400);}", ".f1pp30po{font-size:var(--fontSizeBase500);}"],
120
+ "d": [".f1e4lqlz{box-sizing:content-box;}", ".f1u2r49w{background-color:inherit;}", ".f1ym3bx4{color:inherit;}", ".f1mo0ibp{font-family:inherit;}", ".fjoy568{font-size:inherit;}", ".fytdu2e{line-height:normal;}", ".f1mtd64y{overflow-x:visible;}", ".f1y7q3j9{overflow-y:visible;}", ".f1g0x7ka{padding-top:0;}", ".fhxju0i{padding-right:0;}", ".f1cnd47f{padding-left:0;}", ".f1qch9an{padding-bottom:0;}", ".f37px4s{-webkit-appearance:button;}", ".f1xqy1su{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}", ".fgusgyc{text-align:unset;}", "[data-keyboard-nav] .fc85khu:focus{border-color:transparent;}", "[data-keyboard-nav] .f1pxpxw8:focus:after{content:\"\";}", "[data-keyboard-nav] .f1149fnl:focus:after{position:absolute;}", "[data-keyboard-nav] .fd1orka:focus:after{pointer-events:none;}", "[data-keyboard-nav] .fgtqheg:focus:after{box-sizing:outline-box;}", "[data-keyboard-nav] .fq7mjg8:focus:after{z-index:1;}", "[data-keyboard-nav] .fq9bj62:focus:after{border-style:solid;}", "[data-keyboard-nav] .fy07e8r:focus:after{border-width:2px;}", "[data-keyboard-nav] .f1ha6shg:focus:after{border-radius:var(--borderRadiusMedium);}", "[data-keyboard-nav] .f4ltwxu:focus:after{border-color:var(--colorStrokeFocus2);}", "[data-keyboard-nav] .f1284xzw:focus:after{top:-2px;}", "[data-keyboard-nav] .f14dru39:focus:after{bottom:-2px;}", "[data-keyboard-nav] .fvabyfg:focus:after{left:-2px;}", "[data-keyboard-nav] .f12y1wz2:focus:after{right:-2px;}", ".f19n0e5{color:var(--colorNeutralForeground1);}", ".fxugw4r{background-color:var(--colorNeutralBackground1);}", ".f1hu3pq6{margin-top:0;}", ".f11qmguv{margin-right:0;}", ".f1tyq0we{margin-left:0;}", ".f19f4twv{margin-bottom:0;}", ".f2i1086{border-bottom-right-radius:2px;}", ".f1rlsnju{border-bottom-left-radius:2px;}", ".f1stktl2{border-top-right-radius:2px;}", ".f1127022{border-top-left-radius:2px;}", ".fwrgwhw{background-image:none;}", ".f1s2aq7o{color:var(--colorNeutralForegroundDisabled);}", ".f14t3ns0{display:inline-block;}", ".f10pi13n{position:relative;}", ".f1wfwcyy{width:calc(100% - 22px);}", ".f5ogflp{border-top-width:1px;}", ".f1hqa2wf{border-right-width:1px;}", ".finvdd3{border-left-width:1px;}", ".f1f09k3d{border-bottom-width:1px;}", ".fzkkow9{border-top-style:solid;}", ".fcdblym{border-right-style:solid;}", ".fjik90z{border-left-style:solid;}", ".fg706s2{border-bottom-style:solid;}", ".f1p3nwhy{border-top-color:transparent;}", ".f11589ue{border-right-color:transparent;}", ".f1pdflbu{border-left-color:transparent;}", ".f1q5o8ev{border-bottom-color:transparent;}", ".f81rol6{padding-right:10px;}", ".frdkuqy{padding-left:10px;}", ".f1ft4266{height:44px;}", ".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}", ".f122n59{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}", ".f1k6fduh{cursor:pointer;}", ".fkhj508{font-size:var(--fontSizeBase300);}", ".fk6fouc{font-family:var(--fontFamilyBase);}", ".f1d2rq10{height:32px;}", ".fy9rknc{font-size:var(--fontSizeBase200);}", ".fod5ikn{font-size:var(--fontSizeBase400);}", ".f1pp30po{font-size:var(--fontSizeBase500);}", ".ftuwxu6{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;}", ".fez10in{line-height:0;}", ".fe5j1ua{font-size:20px;}", ".f19lj068{padding-right:8px;}", ".f177v4lu{padding-left:8px;}", ".fqerorx{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}", ".f1neuvcm{-webkit-flex-shrink:1;-ms-flex-negative:1;flex-shrink:1;}", ".flqd7gy{-webkit-flex-basis:0%;-ms-flex-preferred-size:0%;flex-basis:0%;}", ".f9c4gz4{-webkit-box-pack:end;-ms-flex-pack:end;-webkit-justify-content:flex-end;justify-content:flex-end;}", ".f1phki43{margin-right:8px;}", ".ff9s3yw{margin-left:8px;}", ".f1oou7ox{margin-left:10px;}", ".f1pxv85q{margin-right:10px;}"],
126
121
  "i": [".f2hkw1w:focus-visible{outline-style:none;}"]
127
122
  });
128
123
  /** Applies style classnames to slots */
129
124
 
130
125
 
131
- export var useAccordionHeaderStyles = function (state) {
132
- var styles = useStyles();
133
- state.root.className = mergeClasses(styles.root, state.inline && styles.rootInline, state.disabled && styles.rootDisabled, state.root.className);
134
- state.button.className = mergeClasses(styles.resetButton, styles.button, styles.focusIndicator, state.inline && styles.buttonInline, state.size === 'small' && styles.buttonSmall, state.button.className);
126
+ export const useAccordionHeaderStyles_unstable = state => {
127
+ const styles = useStyles();
128
+ state.root.className = mergeClasses(accordionHeaderClassName, styles.root, state.inline && styles.rootInline, state.disabled && styles.rootDisabled, state.root.className);
129
+ state.button.className = mergeClasses(styles.resetButton, styles.button, styles.focusIndicator, state.inline && styles.buttonInline, state.size === 'small' && styles.buttonSmall, state.size === 'large' && styles.buttonLarge, state.size === 'extra-large' && styles.buttonExtraLarge, state.button.className);
135
130
 
136
131
  if (state.expandIcon) {
137
132
  state.expandIcon.className = mergeClasses(styles.expandIcon, state.expandIconPosition === 'start' && styles.expandIconStart, state.expandIconPosition === 'end' && styles.expandIconEnd, state.expandIcon.className);
138
133
  }
139
134
 
140
- if (state.children) {
141
- state.children.className = mergeClasses(styles.children, state.size === 'small' && styles.childrenSmall, state.size === 'large' && styles.childrenLarge, state.size === 'extra-large' && styles.childrenExtraLarge, state.children.className);
142
- }
143
-
144
135
  if (state.icon) {
145
136
  state.icon.className = mergeClasses(styles.icon, state.expandIconPosition === 'end' && styles.iconExpandIconEnd, state.icon.className);
146
137
  }
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/AccordionHeader/useAccordionHeaderStyles.ts"],"names":[],"mappings":"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","sourceRoot":""}
1
+ {"version":3,"sources":["components/AccordionHeader/useAccordionHeaderStyles.ts"],"names":[],"mappings":"AAAA,SAAS,UAAT,YAAiC,YAAjC,QAAqD,gBAArD;AACA,SAAS,uBAAT,QAAwC,yBAAxC;AACA,SAAS,MAAT,QAAuB,uBAAvB;AAGA,OAAO,MAAM,wBAAwB,GAAG,qBAAjC;;AAEP,MAAM,SAAS,gBAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAlB;AA+EA;;;AACA,OAAO,MAAM,iCAAiC,GAAI,KAAD,IAAgC;AAC/E,QAAM,MAAM,GAAG,SAAS,EAAxB;AACA,EAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,YAAY,CACjC,wBADiC,EAEjC,MAAM,CAAC,IAF0B,EAGjC,KAAK,CAAC,MAAN,IAAgB,MAAM,CAAC,UAHU,EAIjC,KAAK,CAAC,QAAN,IAAkB,MAAM,CAAC,YAJQ,EAKjC,KAAK,CAAC,IAAN,CAAW,SALsB,CAAnC;AAQA,EAAA,KAAK,CAAC,MAAN,CAAa,SAAb,GAAyB,YAAY,CACnC,MAAM,CAAC,WAD4B,EAEnC,MAAM,CAAC,MAF4B,EAGnC,MAAM,CAAC,cAH4B,EAInC,KAAK,CAAC,MAAN,IAAgB,MAAM,CAAC,YAJY,EAKnC,KAAK,CAAC,IAAN,KAAe,OAAf,IAA0B,MAAM,CAAC,WALE,EAMnC,KAAK,CAAC,IAAN,KAAe,OAAf,IAA0B,MAAM,CAAC,WANE,EAOnC,KAAK,CAAC,IAAN,KAAe,aAAf,IAAgC,MAAM,CAAC,gBAPJ,EAQnC,KAAK,CAAC,MAAN,CAAa,SARsB,CAArC;;AAWA,MAAI,KAAK,CAAC,UAAV,EAAsB;AACpB,IAAA,KAAK,CAAC,UAAN,CAAiB,SAAjB,GAA6B,YAAY,CACvC,MAAM,CAAC,UADgC,EAEvC,KAAK,CAAC,kBAAN,KAA6B,OAA7B,IAAwC,MAAM,CAAC,eAFR,EAGvC,KAAK,CAAC,kBAAN,KAA6B,KAA7B,IAAsC,MAAM,CAAC,aAHN,EAIvC,KAAK,CAAC,UAAN,CAAiB,SAJsB,CAAzC;AAMD;;AACD,MAAI,KAAK,CAAC,IAAV,EAAgB;AACd,IAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,YAAY,CACjC,MAAM,CAAC,IAD0B,EAEjC,KAAK,CAAC,kBAAN,KAA6B,KAA7B,IAAsC,MAAM,CAAC,iBAFZ,EAGjC,KAAK,CAAC,IAAN,CAAW,SAHsB,CAAnC;AAKD;;AACD,SAAO,KAAP;AACD,CArCM","sourcesContent":["import { shorthands, makeStyles, mergeClasses } from '@griffel/react';\nimport { createFocusOutlineStyle } from '@fluentui/react-tabster';\nimport { tokens } from '@fluentui/react-theme';\nimport type { AccordionHeaderState } from './AccordionHeader.types';\n\nexport const accordionHeaderClassName = 'fui-AccordionHeader';\n\nconst useStyles = makeStyles({\n // TODO: this should be extracted to another package\n resetButton: {\n boxSizing: 'content-box',\n backgroundColor: 'inherit',\n color: 'inherit',\n fontFamily: 'inherit',\n fontSize: 'inherit',\n lineHeight: 'normal',\n ...shorthands.overflow('visible'),\n ...shorthands.padding(0),\n WebkitAppearance: 'button',\n userSelect: 'none',\n textAlign: 'unset',\n },\n focusIndicator: createFocusOutlineStyle(),\n root: {\n color: tokens.colorNeutralForeground1,\n backgroundColor: tokens.colorNeutralBackground1,\n ...shorthands.margin(0),\n ...shorthands.borderRadius('2px'),\n },\n rootDisabled: {\n backgroundImage: 'none',\n color: tokens.colorNeutralForegroundDisabled,\n },\n rootInline: {\n display: 'inline-block',\n },\n button: {\n position: 'relative',\n width: 'calc(100% - 22px)',\n ...shorthands.border('1px', 'solid', 'transparent'),\n paddingRight: '10px',\n paddingLeft: '10px',\n height: '44px',\n display: 'flex',\n alignItems: 'center',\n cursor: 'pointer',\n fontSize: tokens.fontSizeBase300,\n fontFamily: tokens.fontFamilyBase,\n },\n buttonSmall: {\n height: '32px',\n fontSize: tokens.fontSizeBase200,\n },\n buttonLarge: {\n fontSize: tokens.fontSizeBase400,\n },\n buttonExtraLarge: {\n fontSize: tokens.fontSizeBase500,\n },\n buttonInline: {\n display: 'inline-flex',\n },\n expandIcon: {\n lineHeight: '0',\n fontSize: '20px',\n },\n expandIconStart: {\n paddingRight: '8px',\n },\n expandIconEnd: {\n flexGrow: 1,\n flexShrink: 1,\n flexBasis: '0%',\n display: 'flex',\n justifyContent: 'flex-end',\n paddingLeft: '8px',\n },\n icon: {\n marginRight: '8px',\n fontSize: '20px',\n },\n iconExpandIconEnd: {\n marginLeft: '10px',\n },\n});\n\n/** Applies style classnames to slots */\nexport const useAccordionHeaderStyles_unstable = (state: AccordionHeaderState) => {\n const styles = useStyles();\n state.root.className = mergeClasses(\n accordionHeaderClassName,\n styles.root,\n state.inline && styles.rootInline,\n state.disabled && styles.rootDisabled,\n state.root.className,\n );\n\n state.button.className = mergeClasses(\n styles.resetButton,\n styles.button,\n styles.focusIndicator,\n state.inline && styles.buttonInline,\n state.size === 'small' && styles.buttonSmall,\n state.size === 'large' && styles.buttonLarge,\n state.size === 'extra-large' && styles.buttonExtraLarge,\n state.button.className,\n );\n\n if (state.expandIcon) {\n state.expandIcon.className = mergeClasses(\n styles.expandIcon,\n state.expandIconPosition === 'start' && styles.expandIconStart,\n state.expandIconPosition === 'end' && styles.expandIconEnd,\n state.expandIcon.className,\n );\n }\n if (state.icon) {\n state.icon.className = mergeClasses(\n styles.icon,\n state.expandIconPosition === 'end' && styles.iconExpandIconEnd,\n state.icon.className,\n );\n }\n return state;\n};\n"],"sourceRoot":"../src/"}
@@ -1,6 +1,6 @@
1
1
  import type { AccordionItemProps } from './AccordionItem.types';
2
2
  import type { ForwardRefComponent } from '@fluentui/react-utilities';
3
3
  /**
4
- * Define a styled AccordionItem, using the `useAccordionItem` and `useAccordionItemStyles` hooks.
4
+ * Define a styled AccordionItem, using the `useAccordionItem_unstable` and `useAccordionItemStyles_unstable` hooks.
5
5
  */
6
6
  export declare const AccordionItem: ForwardRefComponent<AccordionItemProps>;
@@ -1,15 +1,17 @@
1
1
  import * as React from 'react';
2
- import { useAccordionItem } from './useAccordionItem';
3
- import { useAccordionItemContextValues } from './useAccordionItemContextValues';
4
- import { renderAccordionItem } from './renderAccordionItem';
2
+ import { useAccordionItem_unstable } from './useAccordionItem';
3
+ import { useAccordionItemContextValues_unstable } from './useAccordionItemContextValues';
4
+ import { renderAccordionItem_unstable } from './renderAccordionItem';
5
+ import { useAccordionItemStyles_unstable } from './useAccordionItemStyles';
5
6
  /**
6
- * Define a styled AccordionItem, using the `useAccordionItem` and `useAccordionItemStyles` hooks.
7
+ * Define a styled AccordionItem, using the `useAccordionItem_unstable` and `useAccordionItemStyles_unstable` hooks.
7
8
  */
8
9
 
9
- export var AccordionItem = /*#__PURE__*/React.forwardRef(function (props, ref) {
10
- var state = useAccordionItem(props, ref);
11
- var contextValues = useAccordionItemContextValues(state);
12
- return renderAccordionItem(state, contextValues);
10
+ export const AccordionItem = /*#__PURE__*/React.forwardRef((props, ref) => {
11
+ const state = useAccordionItem_unstable(props, ref);
12
+ const contextValues = useAccordionItemContextValues_unstable(state);
13
+ useAccordionItemStyles_unstable(state);
14
+ return renderAccordionItem_unstable(state, contextValues);
13
15
  });
14
16
  AccordionItem.displayName = 'AccordionItem';
15
17
  //# sourceMappingURL=AccordionItem.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/AccordionItem/AccordionItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,gBAAT,QAAiC,oBAAjC;AACA,SAAS,6BAAT,QAA8C,iCAA9C;AACA,SAAS,mBAAT,QAAoC,uBAApC;AAIA;;AAEG;;AACH,OAAO,IAAM,aAAa,gBAA4C,KAAK,CAAC,UAAN,CAAiB,UAAC,KAAD,EAAQ,GAAR,EAAW;AAChG,MAAM,KAAK,GAAG,gBAAgB,CAAC,KAAD,EAAQ,GAAR,CAA9B;AACA,MAAM,aAAa,GAAG,6BAA6B,CAAC,KAAD,CAAnD;AAEA,SAAO,mBAAmB,CAAC,KAAD,EAAQ,aAAR,CAA1B;AACD,CALqE,CAA/D;AAOP,aAAa,CAAC,WAAd,GAA4B,eAA5B","sourceRoot":""}
1
+ {"version":3,"sources":["components/AccordionItem/AccordionItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,yBAAT,QAA0C,oBAA1C;AACA,SAAS,sCAAT,QAAuD,iCAAvD;AACA,SAAS,4BAAT,QAA6C,uBAA7C;AAGA,SAAS,+BAAT,QAAgD,0BAAhD;AAEA;;AAEG;;AACH,OAAO,MAAM,aAAa,gBAA4C,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;AACpG,QAAM,KAAK,GAAG,yBAAyB,CAAC,KAAD,EAAQ,GAAR,CAAvC;AACA,QAAM,aAAa,GAAG,sCAAsC,CAAC,KAAD,CAA5D;AAEA,EAAA,+BAA+B,CAAC,KAAD,CAA/B;AAEA,SAAO,4BAA4B,CAAC,KAAD,EAAQ,aAAR,CAAnC;AACD,CAPqE,CAA/D;AASP,aAAa,CAAC,WAAd,GAA4B,eAA5B","sourcesContent":["import * as React from 'react';\nimport { useAccordionItem_unstable } from './useAccordionItem';\nimport { useAccordionItemContextValues_unstable } from './useAccordionItemContextValues';\nimport { renderAccordionItem_unstable } from './renderAccordionItem';\nimport type { AccordionItemProps } from './AccordionItem.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useAccordionItemStyles_unstable } from './useAccordionItemStyles';\n\n/**\n * Define a styled AccordionItem, using the `useAccordionItem_unstable` and `useAccordionItemStyles_unstable` hooks.\n */\nexport const AccordionItem: ForwardRefComponent<AccordionItemProps> = React.forwardRef((props, ref) => {\n const state = useAccordionItem_unstable(props, ref);\n const contextValues = useAccordionItemContextValues_unstable(state);\n\n useAccordionItemStyles_unstable(state);\n\n return renderAccordionItem_unstable(state, contextValues);\n});\n\nAccordionItem.displayName = 'AccordionItem';\n"],"sourceRoot":"../src/"}
@@ -1,5 +1,5 @@
1
1
  import * as React from 'react';
2
- import type { ComponentProps, ComponentState, IntrinsicShorthandProps } from '@fluentui/react-utilities';
2
+ import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';
3
3
  export declare type AccordionItemContextValue = Omit<AccordionItemCommons, 'value'> & {
4
4
  open: boolean;
5
5
  onHeaderClick(ev: React.MouseEvent | React.KeyboardEvent): void;
@@ -8,9 +8,9 @@ export declare type AccordionItemContextValues = {
8
8
  accordionItem: AccordionItemContextValue;
9
9
  };
10
10
  export declare type AccordionItemSlots = {
11
- root: IntrinsicShorthandProps<'div'>;
11
+ root: Slot<'div'>;
12
12
  };
13
- export declare type AccordionItemCommons = {
13
+ declare type AccordionItemCommons = {
14
14
  /**
15
15
  * Disables opening/closing of panel
16
16
  */
@@ -23,3 +23,4 @@ export declare type AccordionItemCommons = {
23
23
  export declare type AccordionItemProps = ComponentProps<AccordionItemSlots> & Partial<AccordionItemCommons> & Pick<AccordionItemCommons, 'value'>;
24
24
  export declare type AccordionItemValue = unknown;
25
25
  export declare type AccordionItemState = ComponentState<AccordionItemSlots> & AccordionItemCommons & AccordionItemContextValue;
26
+ export {};
@@ -1 +1 @@
1
- {"version":3,"file":"AccordionItem.types.js","sourceRoot":"","sources":["../../../src/components/AccordionItem/AccordionItem.types.ts"],"names":[],"mappings":""}
1
+ {"version":3,"file":"AccordionItem.types.js","sourceRoot":"../src/","sources":["components/AccordionItem/AccordionItem.types.ts"],"names":[],"mappings":"","sourcesContent":["import * as React from 'react';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type AccordionItemContextValue = Omit<AccordionItemCommons, 'value'> & {\n open: boolean;\n onHeaderClick(ev: React.MouseEvent | React.KeyboardEvent): void;\n};\n\nexport type AccordionItemContextValues = {\n accordionItem: AccordionItemContextValue;\n};\n\nexport type AccordionItemSlots = {\n root: Slot<'div'>;\n};\n\ntype AccordionItemCommons = {\n /**\n * Disables opening/closing of panel\n */\n disabled: boolean;\n /**\n * required value that identifies this item inside an Accordion component\n */\n value: AccordionItemValue;\n};\n\nexport type AccordionItemProps = ComponentProps<AccordionItemSlots> &\n Partial<AccordionItemCommons> &\n Pick<AccordionItemCommons, 'value'>;\n\nexport type AccordionItemValue = unknown;\n\nexport type AccordionItemState = ComponentState<AccordionItemSlots> & AccordionItemCommons & AccordionItemContextValue;\n"]}
@@ -1,4 +1,4 @@
1
1
  import * as React from 'react';
2
2
  import type { AccordionItemContextValue } from './AccordionItem.types';
3
3
  export declare const AccordionItemContext: React.Context<AccordionItemContextValue>;
4
- export declare const useAccordionItemContext: () => AccordionItemContextValue;
4
+ export declare const useAccordionItemContext_unstable: () => AccordionItemContextValue;
@@ -1,13 +1,12 @@
1
1
  import * as React from 'react'; // No default value.
2
2
 
3
- export var AccordionItemContext = /*#__PURE__*/React.createContext({
4
- onHeaderClick: function () {
3
+ export const AccordionItemContext = /*#__PURE__*/React.createContext({
4
+ onHeaderClick() {
5
5
  /** */
6
6
  },
7
+
7
8
  open: false,
8
9
  disabled: false
9
10
  });
10
- export var useAccordionItemContext = function () {
11
- return React.useContext(AccordionItemContext);
12
- };
11
+ export const useAccordionItemContext_unstable = () => React.useContext(AccordionItemContext);
13
12
  //# sourceMappingURL=AccordionItemContext.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/AccordionItem/AccordionItemContext.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB,C,CAGA;;AACA,OAAO,IAAM,oBAAoB,gBAAG,KAAK,CAAC,aAAN,CAA+C;AACjF,EAAA,aAAa,EAAA,YAAA;AACX;AACD,GAHgF;AAIjF,EAAA,IAAI,EAAE,KAJ2E;AAKjF,EAAA,QAAQ,EAAE;AALuE,CAA/C,CAA7B;AAQP,OAAO,IAAM,uBAAuB,GAAG,YAAA;AAAM,SAAA,KAAK,CAAC,UAAN,CAAA,oBAAA,CAAA;AAAsC,CAA5E","sourceRoot":""}
1
+ {"version":3,"sources":["components/AccordionItem/AccordionItemContext.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB,C,CAGA;;AACA,OAAO,MAAM,oBAAoB,gBAAG,KAAK,CAAC,aAAN,CAA+C;AACjF,EAAA,aAAa,GAAA;AACX;AACD,GAHgF;;AAIjF,EAAA,IAAI,EAAE,KAJ2E;AAKjF,EAAA,QAAQ,EAAE;AALuE,CAA/C,CAA7B;AAQP,OAAO,MAAM,gCAAgC,GAAG,MAAM,KAAK,CAAC,UAAN,CAAiB,oBAAjB,CAA/C","sourcesContent":["import * as React from 'react';\nimport type { AccordionItemContextValue } from './AccordionItem.types';\n\n// No default value.\nexport const AccordionItemContext = React.createContext<AccordionItemContextValue>({\n onHeaderClick() {\n /** */\n },\n open: false,\n disabled: false,\n});\n\nexport const useAccordionItemContext_unstable = () => React.useContext(AccordionItemContext);\n"],"sourceRoot":"../src/"}
@@ -4,3 +4,4 @@ export * from './renderAccordionItem';
4
4
  export * from './useAccordionItem';
5
5
  export * from './useAccordionItemContextValues';
6
6
  export * from './AccordionItemContext';
7
+ export * from './useAccordionItemStyles';
@@ -4,4 +4,5 @@ export * from './renderAccordionItem';
4
4
  export * from './useAccordionItem';
5
5
  export * from './useAccordionItemContextValues';
6
6
  export * from './AccordionItemContext';
7
+ export * from './useAccordionItemStyles';
7
8
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/AccordionItem/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAC;AAChC,cAAc,uBAAuB,CAAC;AACtC,cAAc,uBAAuB,CAAC;AACtC,cAAc,oBAAoB,CAAC;AACnC,cAAc,iCAAiC,CAAC;AAChD,cAAc,wBAAwB,CAAC"}
1
+ {"version":3,"file":"index.js","sourceRoot":"../src/","sources":["components/AccordionItem/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAC;AAChC,cAAc,uBAAuB,CAAC;AACtC,cAAc,uBAAuB,CAAC;AACtC,cAAc,oBAAoB,CAAC;AACnC,cAAc,iCAAiC,CAAC;AAChD,cAAc,wBAAwB,CAAC;AACvC,cAAc,0BAA0B,CAAC","sourcesContent":["export * from './AccordionItem';\nexport * from './AccordionItem.types';\nexport * from './renderAccordionItem';\nexport * from './useAccordionItem';\nexport * from './useAccordionItemContextValues';\nexport * from './AccordionItemContext';\nexport * from './useAccordionItemStyles';\n"]}
@@ -2,4 +2,4 @@ import type { AccordionItemState, AccordionItemContextValues } from './Accordion
2
2
  /**
3
3
  * Function that renders the final JSX of the component
4
4
  */
5
- export declare const renderAccordionItem: (state: AccordionItemState, contextValues: AccordionItemContextValues) => JSX.Element;
5
+ export declare const renderAccordionItem_unstable: (state: AccordionItemState, contextValues: AccordionItemContextValues) => JSX.Element;
@@ -1,18 +1,17 @@
1
- import { __assign } from "tslib";
2
1
  import * as React from 'react';
3
2
  import { getSlots } from '@fluentui/react-utilities';
4
- import { accordionItemShorthandProps } from './useAccordionItem';
5
3
  import { AccordionItemContext } from './AccordionItemContext';
6
4
  /**
7
5
  * Function that renders the final JSX of the component
8
6
  */
9
7
 
10
- export var renderAccordionItem = function (state, contextValues) {
11
- var _a = getSlots(state, accordionItemShorthandProps),
12
- slots = _a.slots,
13
- slotProps = _a.slotProps;
14
-
15
- return /*#__PURE__*/React.createElement(slots.root, __assign({}, slotProps.root), /*#__PURE__*/React.createElement(AccordionItemContext.Provider, {
8
+ export const renderAccordionItem_unstable = (state, contextValues) => {
9
+ const {
10
+ slots,
11
+ slotProps
12
+ } = getSlots(state);
13
+ return /*#__PURE__*/React.createElement(slots.root, { ...slotProps.root
14
+ }, /*#__PURE__*/React.createElement(AccordionItemContext.Provider, {
16
15
  value: contextValues.accordionItem
17
16
  }, slotProps.root.children));
18
17
  };
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/AccordionItem/renderAccordionItem.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,QAAT,QAAyB,2BAAzB;AACA,SAAS,2BAAT,QAA4C,oBAA5C;AACA,SAAS,oBAAT,QAAqC,wBAArC;AAGA;;AAEG;;AACH,OAAO,IAAM,mBAAmB,GAAG,UAAC,KAAD,EAA4B,aAA5B,EAAqE;AAChG,MAAA,EAAA,GAAuB,QAAQ,CAAqB,KAArB,EAA4B,2BAA5B,CAA/B;AAAA,MAAE,KAAK,GAAA,EAAA,CAAA,KAAP;AAAA,MAAS,SAAS,GAAA,EAAA,CAAA,SAAlB;;AAEN,sBACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,QAAA,CAAA,EAAA,EAAK,SAAS,CAAC,IAAf,CAAX,eACE,KAAA,CAAA,aAAA,CAAC,oBAAoB,CAAC,QAAtB,EAA8B;AAAC,IAAA,KAAK,EAAE,aAAa,CAAC;AAAtB,GAA9B,EACG,SAAS,CAAC,IAAV,CAAe,QADlB,CADF,CADF;AAOD,CAVM","sourceRoot":""}
1
+ {"version":3,"sources":["components/AccordionItem/renderAccordionItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,QAAT,QAAyB,2BAAzB;AACA,SAAS,oBAAT,QAAqC,wBAArC;AAGA;;AAEG;;AACH,OAAO,MAAM,4BAA4B,GAAG,CAAC,KAAD,EAA4B,aAA5B,KAAyE;AACnH,QAAM;AAAE,IAAA,KAAF;AAAS,IAAA;AAAT,MAAuB,QAAQ,CAAqB,KAArB,CAArC;AAEA,sBACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;AAAf,GAAX,eACE,KAAA,CAAA,aAAA,CAAC,oBAAoB,CAAC,QAAtB,EAA8B;AAAC,IAAA,KAAK,EAAE,aAAa,CAAC;AAAtB,GAA9B,EACG,SAAS,CAAC,IAAV,CAAe,QADlB,CADF,CADF;AAOD,CAVM","sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport { AccordionItemContext } from './AccordionItemContext';\nimport type { AccordionItemState, AccordionItemSlots, AccordionItemContextValues } from './AccordionItem.types';\n\n/**\n * Function that renders the final JSX of the component\n */\nexport const renderAccordionItem_unstable = (state: AccordionItemState, contextValues: AccordionItemContextValues) => {\n const { slots, slotProps } = getSlots<AccordionItemSlots>(state);\n\n return (\n <slots.root {...slotProps.root}>\n <AccordionItemContext.Provider value={contextValues.accordionItem}>\n {slotProps.root.children}\n </AccordionItemContext.Provider>\n </slots.root>\n );\n};\n"],"sourceRoot":"../src/"}