@fluentui/react-accordion 9.1.12 → 9.1.14
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.
- package/CHANGELOG.json +51 -1
- package/CHANGELOG.md +22 -2
- package/dist/index.d.ts +5 -5
- package/lib/components/Accordion/Accordion.types.js.map +1 -1
- package/lib/components/AccordionHeader/AccordionHeader.types.js.map +1 -1
- package/lib/components/AccordionHeader/renderAccordionHeader.js +1 -1
- package/lib/components/AccordionHeader/renderAccordionHeader.js.map +1 -1
- package/lib/components/AccordionHeader/useAccordionHeader.js +18 -15
- package/lib/components/AccordionHeader/useAccordionHeader.js.map +1 -1
- package/lib/components/AccordionItem/AccordionItem.types.js.map +1 -1
- package/lib/components/AccordionPanel/AccordionPanel.types.js.map +1 -1
- package/lib-commonjs/components/AccordionHeader/renderAccordionHeader.js +1 -1
- package/lib-commonjs/components/AccordionHeader/renderAccordionHeader.js.map +1 -1
- package/lib-commonjs/components/AccordionHeader/useAccordionHeader.js +17 -14
- package/lib-commonjs/components/AccordionHeader/useAccordionHeader.js.map +1 -1
- package/package.json +4 -4
package/CHANGELOG.json
CHANGED
|
@@ -2,7 +2,57 @@
|
|
|
2
2
|
"name": "@fluentui/react-accordion",
|
|
3
3
|
"entries": [
|
|
4
4
|
{
|
|
5
|
-
"date": "
|
|
5
|
+
"date": "Wed, 24 May 2023 20:42:34 GMT",
|
|
6
|
+
"tag": "@fluentui/react-accordion_v9.1.14",
|
|
7
|
+
"version": "9.1.14",
|
|
8
|
+
"comments": {
|
|
9
|
+
"none": [
|
|
10
|
+
{
|
|
11
|
+
"author": "olfedias@microsoft.com",
|
|
12
|
+
"package": "@fluentui/react-accordion",
|
|
13
|
+
"commit": "69e0617a93cb44ef42f3bd19284b7dc5fe27fed3",
|
|
14
|
+
"comment": "chore: update test-ssr script"
|
|
15
|
+
}
|
|
16
|
+
],
|
|
17
|
+
"patch": [
|
|
18
|
+
{
|
|
19
|
+
"author": "bernardo.sunderhus@gmail.com",
|
|
20
|
+
"package": "@fluentui/react-accordion",
|
|
21
|
+
"commit": "323e7a97aed12661495a492c9a8f10e617a332dd",
|
|
22
|
+
"comment": "chore: ensures AccordionHeader expandIcon supports null"
|
|
23
|
+
},
|
|
24
|
+
{
|
|
25
|
+
"author": "beachball",
|
|
26
|
+
"package": "@fluentui/react-accordion",
|
|
27
|
+
"comment": "Bump @fluentui/react-shared-contexts to v9.5.0",
|
|
28
|
+
"commit": "3f088b7b09988e7c05af1c953021acc94c273026"
|
|
29
|
+
},
|
|
30
|
+
{
|
|
31
|
+
"author": "beachball",
|
|
32
|
+
"package": "@fluentui/react-accordion",
|
|
33
|
+
"comment": "Bump @fluentui/react-tabster to v9.7.3",
|
|
34
|
+
"commit": "3f088b7b09988e7c05af1c953021acc94c273026"
|
|
35
|
+
}
|
|
36
|
+
]
|
|
37
|
+
}
|
|
38
|
+
},
|
|
39
|
+
{
|
|
40
|
+
"date": "Thu, 18 May 2023 13:11:08 GMT",
|
|
41
|
+
"tag": "@fluentui/react-accordion_v9.1.13",
|
|
42
|
+
"version": "9.1.13",
|
|
43
|
+
"comments": {
|
|
44
|
+
"patch": [
|
|
45
|
+
{
|
|
46
|
+
"author": "beachball",
|
|
47
|
+
"package": "@fluentui/react-accordion",
|
|
48
|
+
"comment": "Bump @fluentui/react-tabster to v9.7.2",
|
|
49
|
+
"commit": "1e6f5c8eec4b67c051fb3aa429e303115570ae4d"
|
|
50
|
+
}
|
|
51
|
+
]
|
|
52
|
+
}
|
|
53
|
+
},
|
|
54
|
+
{
|
|
55
|
+
"date": "Thu, 18 May 2023 00:39:01 GMT",
|
|
6
56
|
"tag": "@fluentui/react-accordion_v9.1.12",
|
|
7
57
|
"version": "9.1.12",
|
|
8
58
|
"comments": {
|
package/CHANGELOG.md
CHANGED
|
@@ -1,12 +1,32 @@
|
|
|
1
1
|
# Change Log - @fluentui/react-accordion
|
|
2
2
|
|
|
3
|
-
This log was last generated on
|
|
3
|
+
This log was last generated on Wed, 24 May 2023 20:42:34 GMT and should not be manually modified.
|
|
4
4
|
|
|
5
5
|
<!-- Start content -->
|
|
6
6
|
|
|
7
|
+
## [9.1.14](https://github.com/microsoft/fluentui/tree/@fluentui/react-accordion_v9.1.14)
|
|
8
|
+
|
|
9
|
+
Wed, 24 May 2023 20:42:34 GMT
|
|
10
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-accordion_v9.1.13..@fluentui/react-accordion_v9.1.14)
|
|
11
|
+
|
|
12
|
+
### Patches
|
|
13
|
+
|
|
14
|
+
- chore: ensures AccordionHeader expandIcon supports null ([PR #27912](https://github.com/microsoft/fluentui/pull/27912) by bernardo.sunderhus@gmail.com)
|
|
15
|
+
- Bump @fluentui/react-shared-contexts to v9.5.0 ([PR #27989](https://github.com/microsoft/fluentui/pull/27989) by beachball)
|
|
16
|
+
- Bump @fluentui/react-tabster to v9.7.3 ([PR #27989](https://github.com/microsoft/fluentui/pull/27989) by beachball)
|
|
17
|
+
|
|
18
|
+
## [9.1.13](https://github.com/microsoft/fluentui/tree/@fluentui/react-accordion_v9.1.13)
|
|
19
|
+
|
|
20
|
+
Thu, 18 May 2023 13:11:08 GMT
|
|
21
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-accordion_v9.1.12..@fluentui/react-accordion_v9.1.13)
|
|
22
|
+
|
|
23
|
+
### Patches
|
|
24
|
+
|
|
25
|
+
- Bump @fluentui/react-tabster to v9.7.2 ([PR #27540](https://github.com/microsoft/fluentui/pull/27540) by beachball)
|
|
26
|
+
|
|
7
27
|
## [9.1.12](https://github.com/microsoft/fluentui/tree/@fluentui/react-accordion_v9.1.12)
|
|
8
28
|
|
|
9
|
-
Thu, 18 May 2023 00:
|
|
29
|
+
Thu, 18 May 2023 00:39:01 GMT
|
|
10
30
|
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-accordion_v9.1.11..@fluentui/react-accordion_v9.1.12)
|
|
11
31
|
|
|
12
32
|
### Patches
|
package/dist/index.d.ts
CHANGED
|
@@ -75,7 +75,7 @@ export declare type AccordionHeaderSlots = {
|
|
|
75
75
|
/**
|
|
76
76
|
* The element wrapping the button. By default this is a div, but can be a heading.
|
|
77
77
|
*/
|
|
78
|
-
root: Slot<'div', 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6'
|
|
78
|
+
root: NonNullable<Slot<'div', 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6'>>;
|
|
79
79
|
/**
|
|
80
80
|
* The component to be used as button in heading
|
|
81
81
|
*/
|
|
@@ -83,7 +83,7 @@ export declare type AccordionHeaderSlots = {
|
|
|
83
83
|
/**
|
|
84
84
|
* Expand icon slot rendered before (or after) children content in heading.
|
|
85
85
|
*/
|
|
86
|
-
expandIcon
|
|
86
|
+
expandIcon?: Slot<'span'>;
|
|
87
87
|
/**
|
|
88
88
|
* Expand icon slot rendered before (or after) children content in heading.
|
|
89
89
|
*/
|
|
@@ -124,7 +124,7 @@ export declare type AccordionItemProps = ComponentProps<AccordionItemSlots> & {
|
|
|
124
124
|
export declare const AccordionItemProvider: React_2.Provider<AccordionItemContextValue>;
|
|
125
125
|
|
|
126
126
|
export declare type AccordionItemSlots = {
|
|
127
|
-
root: Slot<'div'
|
|
127
|
+
root: NonNullable<Slot<'div'>>;
|
|
128
128
|
};
|
|
129
129
|
|
|
130
130
|
export declare type AccordionItemState = ComponentState<AccordionItemSlots> & AccordionItemContextValue;
|
|
@@ -141,7 +141,7 @@ export declare const accordionPanelClassNames: SlotClassNames<AccordionPanelSlot
|
|
|
141
141
|
export declare type AccordionPanelProps = ComponentProps<AccordionPanelSlots>;
|
|
142
142
|
|
|
143
143
|
export declare type AccordionPanelSlots = {
|
|
144
|
-
root: Slot<'div'
|
|
144
|
+
root: NonNullable<Slot<'div'>>;
|
|
145
145
|
};
|
|
146
146
|
|
|
147
147
|
export declare type AccordionPanelState = ComponentState<AccordionPanelSlots> & {
|
|
@@ -181,7 +181,7 @@ export declare type AccordionProps = ComponentProps<AccordionSlots> & {
|
|
|
181
181
|
export declare const AccordionProvider: Provider<AccordionContextValue> & FC<ProviderProps<AccordionContextValue>>;
|
|
182
182
|
|
|
183
183
|
export declare type AccordionSlots = {
|
|
184
|
-
root: Slot<'div'
|
|
184
|
+
root: NonNullable<Slot<'div'>>;
|
|
185
185
|
};
|
|
186
186
|
|
|
187
187
|
export declare type AccordionState = ComponentState<AccordionSlots> & AccordionContextValue;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React"],"sources":["../../../src/components/Accordion/Accordion.types.ts"],"sourcesContent":["import * as React from 'react';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport type { AccordionItemValue } from '../AccordionItem/AccordionItem.types';\n\nexport type AccordionIndex = number | number[];\n\nexport type AccordionToggleEvent<E = HTMLElement> = React.MouseEvent<E> | React.KeyboardEvent<E>;\n\nexport type AccordionToggleEventHandler = (event: AccordionToggleEvent, data: AccordionToggleData) => void;\n\nexport type AccordionContextValue = Required<Pick<AccordionProps, 'collapsible'>> &\n Pick<AccordionProps, 'navigation'> & {\n /**\n * The list of opened panels by index\n */\n openItems: AccordionItemValue[];\n /**\n * Callback used by AccordionItem to request a change on it's own opened state\n * Should be used to toggle AccordionItem\n */\n requestToggle: (event: AccordionToggleEvent, data: AccordionToggleData) => void;\n };\n\nexport type AccordionContextValues = {\n accordion: AccordionContextValue;\n};\n\nexport type AccordionSlots = {\n root: Slot<'div'
|
|
1
|
+
{"version":3,"names":["React"],"sources":["../../../src/components/Accordion/Accordion.types.ts"],"sourcesContent":["import * as React from 'react';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport type { AccordionItemValue } from '../AccordionItem/AccordionItem.types';\n\nexport type AccordionIndex = number | number[];\n\nexport type AccordionToggleEvent<E = HTMLElement> = React.MouseEvent<E> | React.KeyboardEvent<E>;\n\nexport type AccordionToggleEventHandler = (event: AccordionToggleEvent, data: AccordionToggleData) => void;\n\nexport type AccordionContextValue = Required<Pick<AccordionProps, 'collapsible'>> &\n Pick<AccordionProps, 'navigation'> & {\n /**\n * The list of opened panels by index\n */\n openItems: AccordionItemValue[];\n /**\n * Callback used by AccordionItem to request a change on it's own opened state\n * Should be used to toggle AccordionItem\n */\n requestToggle: (event: AccordionToggleEvent, data: AccordionToggleData) => void;\n };\n\nexport type AccordionContextValues = {\n accordion: AccordionContextValue;\n};\n\nexport type AccordionSlots = {\n root: NonNullable<Slot<'div'>>;\n};\n\nexport type AccordionToggleData = {\n value: AccordionItemValue;\n};\n\nexport type AccordionProps = ComponentProps<AccordionSlots> & {\n /**\n * Default value for the uncontrolled state of the panel.\n */\n defaultOpenItems?: AccordionItemValue | AccordionItemValue[];\n\n /**\n * Indicates if Accordion support multiple Panels closed at the same time.\n */\n collapsible?: boolean;\n\n /**\n * Indicates if Accordion support multiple Panels opened at the same time.\n */\n multiple?: boolean;\n\n /**\n * Indicates if keyboard navigation is available and gives two options, linear or circular navigation.\n */\n navigation?: 'linear' | 'circular';\n\n /**\n * Callback to be called when the opened items change.\n */\n onToggle?: AccordionToggleEventHandler;\n\n /**\n * Controls the state of the panel.\n */\n openItems?: AccordionItemValue | AccordionItemValue[];\n};\n\nexport type AccordionState = ComponentState<AccordionSlots> & AccordionContextValue;\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":[],"sources":["../../../src/components/AccordionHeader/AccordionHeader.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport type { ARIAButtonSlotProps } from '@fluentui/react-aria';\n\nexport type AccordionHeaderSize = 'small' | 'medium' | 'large' | 'extra-large';\nexport type AccordionHeaderExpandIconPosition = 'start' | 'end';\n\nexport type AccordionHeaderContextValue = Required<Pick<AccordionHeaderProps, 'expandIconPosition' | 'size'>> & {\n disabled: boolean;\n open: boolean;\n};\n\nexport type AccordionHeaderContextValues = {\n accordionHeader: AccordionHeaderContextValue;\n};\n\nexport type AccordionHeaderSlots = {\n /**\n * The element wrapping the button. By default this is a div, but can be a heading.\n */\n root: Slot<'div', 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6'
|
|
1
|
+
{"version":3,"names":[],"sources":["../../../src/components/AccordionHeader/AccordionHeader.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport type { ARIAButtonSlotProps } from '@fluentui/react-aria';\n\nexport type AccordionHeaderSize = 'small' | 'medium' | 'large' | 'extra-large';\nexport type AccordionHeaderExpandIconPosition = 'start' | 'end';\n\nexport type AccordionHeaderContextValue = Required<Pick<AccordionHeaderProps, 'expandIconPosition' | 'size'>> & {\n disabled: boolean;\n open: boolean;\n};\n\nexport type AccordionHeaderContextValues = {\n accordionHeader: AccordionHeaderContextValue;\n};\n\nexport type AccordionHeaderSlots = {\n /**\n * The element wrapping the button. By default this is a div, but can be a heading.\n */\n root: NonNullable<Slot<'div', 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6'>>;\n /**\n * The component to be used as button in heading\n */\n button: NonNullable<Slot<ARIAButtonSlotProps<'a'>>>;\n /**\n * Expand icon slot rendered before (or after) children content in heading.\n */\n expandIcon?: Slot<'span'>;\n /**\n * Expand icon slot rendered before (or after) children content in heading.\n */\n icon?: Slot<'div'>;\n};\n\nexport type AccordionHeaderProps = ComponentProps<Partial<AccordionHeaderSlots>> & {\n /**\n * The position of the expand icon slot in heading.\n */\n expandIconPosition?: AccordionHeaderExpandIconPosition;\n\n /**\n * Indicates if the AccordionHeader should be rendered inline.\n */\n inline?: boolean;\n\n /**\n * Size of spacing in the heading.\n */\n size?: AccordionHeaderSize;\n};\n\nexport type AccordionHeaderState = ComponentState<AccordionHeaderSlots> &\n Required<Pick<AccordionHeaderProps, 'inline'>> &\n AccordionHeaderContextValue;\n"],"mappings":"AAAA"}
|
|
@@ -11,6 +11,6 @@ export const renderAccordionHeader_unstable = (state, contextValues) => {
|
|
|
11
11
|
} = getSlotsNext(state);
|
|
12
12
|
return /*#__PURE__*/createElement(AccordionHeaderContext.Provider, {
|
|
13
13
|
value: contextValues.accordionHeader
|
|
14
|
-
}, /*#__PURE__*/createElement(slots.root, slotProps.root, /*#__PURE__*/createElement(slots.button, slotProps.button, state.expandIconPosition === 'start' && /*#__PURE__*/createElement(slots.expandIcon, slotProps.expandIcon), slots.icon && /*#__PURE__*/createElement(slots.icon, slotProps.icon), slotProps.root.children, state.expandIconPosition === 'end' && /*#__PURE__*/createElement(slots.expandIcon, slotProps.expandIcon))));
|
|
14
|
+
}, /*#__PURE__*/createElement(slots.root, slotProps.root, /*#__PURE__*/createElement(slots.button, slotProps.button, state.expandIconPosition === 'start' && slots.expandIcon && /*#__PURE__*/createElement(slots.expandIcon, slotProps.expandIcon), slots.icon && /*#__PURE__*/createElement(slots.icon, slotProps.icon), slotProps.root.children, state.expandIconPosition === 'end' && slots.expandIcon && /*#__PURE__*/createElement(slots.expandIcon, slotProps.expandIcon))));
|
|
15
15
|
};
|
|
16
16
|
//# sourceMappingURL=renderAccordionHeader.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["createElement","getSlotsNext","AccordionHeaderContext","renderAccordionHeader_unstable","state","contextValues","slots","slotProps","Provider","value","accordionHeader","root","button","expandIconPosition","expandIcon","icon","children"],"sources":["../../../src/components/AccordionHeader/renderAccordionHeader.tsx"],"sourcesContent":["/** @jsxRuntime classic */\n/** @jsx createElement */\n\nimport { createElement } from '@fluentui/react-jsx-runtime';\n\nimport { getSlotsNext } from '@fluentui/react-utilities';\nimport { AccordionHeaderContext } from './AccordionHeaderContext';\nimport type { AccordionHeaderState, AccordionHeaderSlots, AccordionHeaderContextValues } from './AccordionHeader.types';\n\n/**\n * Function that renders the final JSX of the component\n */\nexport const renderAccordionHeader_unstable = (\n state: AccordionHeaderState,\n contextValues: AccordionHeaderContextValues,\n) => {\n const { slots, slotProps } = getSlotsNext<AccordionHeaderSlots>(state);\n\n return (\n <AccordionHeaderContext.Provider value={contextValues.accordionHeader}>\n <slots.root {...slotProps.root}>\n <slots.button {...slotProps.button}>\n {state.expandIconPosition === 'start' && <slots.expandIcon {...slotProps.expandIcon} />}\n {slots.icon && <slots.icon {...slotProps.icon} />}\n {slotProps.root.children}\n {state.expandIconPosition === 'end' && <slots.expandIcon {...slotProps.expandIcon} />}\n </slots.button>\n </slots.root>\n </AccordionHeaderContext.Provider>\n );\n};\n"],"mappings":"AAAA,2BACA,yBAEA,SAASA,aAAa,QAAQ;AAE9B,SAASC,YAAY,QAAQ;AAC7B,SAASC,sBAAsB,QAAQ;AAGvC;;;AAGA,OAAO,MAAMC,8BAAA,GAAiCA,CAC5CC,KAAA,EACAC,aAAA,KACG;EACH,MAAM;IAAEC,KAAA;IAAOC;EAAS,CAAE,GAAGN,YAAA,CAAmCG,KAAA;EAEhE,oBACEJ,aAlBJ,CAkBKE,sBAAA,CAAuBM,QAAQ;IAACC,KAAA,EAAOJ,aAAA,CAAcK;kBACpDV,aAnBN,CAmBOM,KAAA,CAAMK,IAAI,EAAKJ,SAAA,CAAUI,IAAI,eAC5BX,aApBR,CAoBSM,KAAA,CAAMM,MAAM,EAAKL,SAAA,CAAUK,MAAM,EAC/BR,KAAA,CAAMS,kBAAkB,KAAK,
|
|
1
|
+
{"version":3,"names":["createElement","getSlotsNext","AccordionHeaderContext","renderAccordionHeader_unstable","state","contextValues","slots","slotProps","Provider","value","accordionHeader","root","button","expandIconPosition","expandIcon","icon","children"],"sources":["../../../src/components/AccordionHeader/renderAccordionHeader.tsx"],"sourcesContent":["/** @jsxRuntime classic */\n/** @jsx createElement */\n\nimport { createElement } from '@fluentui/react-jsx-runtime';\n\nimport { getSlotsNext } from '@fluentui/react-utilities';\nimport { AccordionHeaderContext } from './AccordionHeaderContext';\nimport type { AccordionHeaderState, AccordionHeaderSlots, AccordionHeaderContextValues } from './AccordionHeader.types';\n\n/**\n * Function that renders the final JSX of the component\n */\nexport const renderAccordionHeader_unstable = (\n state: AccordionHeaderState,\n contextValues: AccordionHeaderContextValues,\n) => {\n const { slots, slotProps } = getSlotsNext<AccordionHeaderSlots>(state);\n\n return (\n <AccordionHeaderContext.Provider value={contextValues.accordionHeader}>\n <slots.root {...slotProps.root}>\n <slots.button {...slotProps.button}>\n {state.expandIconPosition === 'start' && slots.expandIcon && <slots.expandIcon {...slotProps.expandIcon} />}\n {slots.icon && <slots.icon {...slotProps.icon} />}\n {slotProps.root.children}\n {state.expandIconPosition === 'end' && slots.expandIcon && <slots.expandIcon {...slotProps.expandIcon} />}\n </slots.button>\n </slots.root>\n </AccordionHeaderContext.Provider>\n );\n};\n"],"mappings":"AAAA,2BACA,yBAEA,SAASA,aAAa,QAAQ;AAE9B,SAASC,YAAY,QAAQ;AAC7B,SAASC,sBAAsB,QAAQ;AAGvC;;;AAGA,OAAO,MAAMC,8BAAA,GAAiCA,CAC5CC,KAAA,EACAC,aAAA,KACG;EACH,MAAM;IAAEC,KAAA;IAAOC;EAAS,CAAE,GAAGN,YAAA,CAAmCG,KAAA;EAEhE,oBACEJ,aAlBJ,CAkBKE,sBAAA,CAAuBM,QAAQ;IAACC,KAAA,EAAOJ,aAAA,CAAcK;kBACpDV,aAnBN,CAmBOM,KAAA,CAAMK,IAAI,EAAKJ,SAAA,CAAUI,IAAI,eAC5BX,aApBR,CAoBSM,KAAA,CAAMM,MAAM,EAAKL,SAAA,CAAUK,MAAM,EAC/BR,KAAA,CAAMS,kBAAkB,KAAK,WAAWP,KAAA,CAAMQ,UAAU,iBAAId,aArBvE,CAqBwEM,KAAA,CAAMQ,UAAU,EAAKP,SAAA,CAAUO,UAAU,GACtGR,KAAA,CAAMS,IAAI,iBAAIf,aAtBzB,CAsB0BM,KAAA,CAAMS,IAAI,EAAKR,SAAA,CAAUQ,IAAI,GAC5CR,SAAA,CAAUI,IAAI,CAACK,QAAQ,EACvBZ,KAAA,CAAMS,kBAAkB,KAAK,SAASP,KAAA,CAAMQ,UAAU,iBAAId,aAxBrE,CAwBsEM,KAAA,CAAMQ,UAAU,EAAKP,SAAA,CAAUO,UAAU;AAK/G"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
import { getNativeElementProps, resolveShorthand, useEventCallback } from '@fluentui/react-utilities';
|
|
2
|
+
import { getNativeElementProps, isResolvedShorthand, resolveShorthand, useEventCallback } from '@fluentui/react-utilities';
|
|
3
3
|
import { useAccordionItemContext_unstable } from '../AccordionItem/index';
|
|
4
4
|
import { useARIAButtonShorthand } from '@fluentui/react-aria';
|
|
5
5
|
import { useAccordionContext_unstable } from '../Accordion/AccordionContext';
|
|
@@ -42,15 +42,6 @@ export const useAccordionHeader_unstable = (props, ref) => {
|
|
|
42
42
|
// Otherwise, the chevron points down [v] when open, and right [>] (or left [<] in RTL) when closed
|
|
43
43
|
expandIconRotation = open ? 90 : dir !== 'rtl' ? 0 : 180;
|
|
44
44
|
}
|
|
45
|
-
const buttonShorthand = useARIAButtonShorthand(button, {
|
|
46
|
-
required: true,
|
|
47
|
-
defaultProps: {
|
|
48
|
-
disabled,
|
|
49
|
-
disabledFocusable,
|
|
50
|
-
'aria-expanded': open,
|
|
51
|
-
type: 'button'
|
|
52
|
-
}
|
|
53
|
-
});
|
|
54
45
|
return {
|
|
55
46
|
disabled,
|
|
56
47
|
open,
|
|
@@ -79,16 +70,28 @@ export const useAccordionHeader_unstable = (props, ref) => {
|
|
|
79
70
|
'aria-hidden': true
|
|
80
71
|
}
|
|
81
72
|
}),
|
|
82
|
-
button: {
|
|
83
|
-
...
|
|
73
|
+
button: resolveShorthand({
|
|
74
|
+
...useARIAButtonShorthand(button, {
|
|
75
|
+
required: true,
|
|
76
|
+
defaultProps: {
|
|
77
|
+
disabled,
|
|
78
|
+
disabledFocusable,
|
|
79
|
+
'aria-expanded': open,
|
|
80
|
+
type: 'button'
|
|
81
|
+
}
|
|
82
|
+
}),
|
|
84
83
|
onClick: useEventCallback(ev => {
|
|
85
|
-
|
|
86
|
-
|
|
84
|
+
if (isResolvedShorthand(button)) {
|
|
85
|
+
var _button_onClick;
|
|
86
|
+
(_button_onClick = button.onClick) === null || _button_onClick === void 0 ? void 0 : _button_onClick.call(button, ev);
|
|
87
|
+
}
|
|
87
88
|
if (!ev.defaultPrevented) {
|
|
88
89
|
onAccordionHeaderClick(ev);
|
|
89
90
|
}
|
|
90
91
|
})
|
|
91
|
-
}
|
|
92
|
+
}, {
|
|
93
|
+
required: true
|
|
94
|
+
})
|
|
92
95
|
};
|
|
93
96
|
};
|
|
94
97
|
//# sourceMappingURL=useAccordionHeader.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","getNativeElementProps","resolveShorthand","useEventCallback","useAccordionItemContext_unstable","useARIAButtonShorthand","useAccordionContext_unstable","ChevronRightRegular","useFluent_unstable","useFluent","useAccordionHeader_unstable","props","ref","as","icon","button","expandIcon","inline","size","expandIconPosition","onHeaderClick","onAccordionHeaderClick","disabled","open","disabledFocusable","ctx","collapsible","openItems","length","dir","expandIconRotation","
|
|
1
|
+
{"version":3,"names":["React","getNativeElementProps","isResolvedShorthand","resolveShorthand","useEventCallback","useAccordionItemContext_unstable","useARIAButtonShorthand","useAccordionContext_unstable","ChevronRightRegular","useFluent_unstable","useFluent","useAccordionHeader_unstable","props","ref","as","icon","button","expandIcon","inline","size","expandIconPosition","onHeaderClick","onAccordionHeaderClick","disabled","open","disabledFocusable","ctx","collapsible","openItems","length","dir","expandIconRotation","components","root","required","defaultProps","children","createElement","style","transform","type","onClick","ev","_button_onClick","call","defaultPrevented"],"sources":["../../../src/components/AccordionHeader/useAccordionHeader.tsx"],"sourcesContent":["import * as React from 'react';\nimport {\n getNativeElementProps,\n isResolvedShorthand,\n resolveShorthand,\n useEventCallback,\n} from '@fluentui/react-utilities';\nimport { useAccordionItemContext_unstable } from '../AccordionItem/index';\nimport { ARIAButtonSlotProps, useARIAButtonShorthand } from '@fluentui/react-aria';\nimport type { AccordionHeaderProps, AccordionHeaderState } from './AccordionHeader.types';\nimport { useAccordionContext_unstable } from '../Accordion/AccordionContext';\nimport { ChevronRightRegular } from '@fluentui/react-icons';\nimport { useFluent_unstable as 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 = useAccordionContext_unstable(ctx => !ctx.collapsible && ctx.openItems.length === 1 && open);\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 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 style={{ transform: `rotate(${expandIconRotation}deg)` }} />,\n 'aria-hidden': true,\n },\n }),\n button: resolveShorthand<ARIAButtonSlotProps<'a'>>(\n {\n ...useARIAButtonShorthand(button, {\n required: true,\n defaultProps: {\n disabled,\n disabledFocusable,\n 'aria-expanded': open,\n type: 'button',\n },\n }),\n onClick: useEventCallback(ev => {\n if (isResolvedShorthand(button)) {\n button.onClick?.(ev);\n }\n if (!ev.defaultPrevented) {\n onAccordionHeaderClick(ev);\n }\n }),\n },\n { required: true },\n ),\n };\n};\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SACEC,qBAAqB,EACrBC,mBAAmB,EACnBC,gBAAgB,EAChBC,gBAAgB,QACX;AACP,SAASC,gCAAgC,QAAQ;AACjD,SAA8BC,sBAAsB,QAAQ;AAE5D,SAASC,4BAA4B,QAAQ;AAC7C,SAASC,mBAAmB,QAAQ;AACpC,SAASC,kBAAA,IAAsBC,SAAS,QAAQ;AAEhD;;;;;AAKA,OAAO,MAAMC,2BAAA,GAA8BA,CACzCC,KAAA,EACAC,GAAA,KACyB;EACzB,MAAM;IAAEC,EAAA;IAAIC,IAAA;IAAMC,MAAA;IAAQC,UAAA;IAAYC,MAAA,GAAS,KAAK;IAAEC,IAAA,GAAO;IAAUC,kBAAA,GAAqB;EAAO,CAAE,GAAGR,KAAA;EACxG,MAAM;IAAES,aAAA,EAAeC,sBAAA;IAAwBC,QAAA;IAAUC;EAAI,CAAE,GAAGnB,gCAAA;EAElE;;;;EAIA,MAAMoB,iBAAA,GAAoBlB,4BAAA,CAA6BmB,GAAA,IAAO,CAACA,GAAA,CAAIC,WAAW,IAAID,GAAA,CAAIE,SAAS,CAACC,MAAM,KAAK,KAAKL,IAAA;EAEhH,MAAM;IAAEM;EAAG,CAAE,GAAGpB,SAAA;EAEhB;EACA,IAAIqB,kBAAA;EACJ,IAAIX,kBAAA,KAAuB,OAAO;IAChC;IACAW,kBAAA,GAAqBP,IAAA,GAAO,CAAC,KAAK,EAAE;EACtC,OAAO;IACL;IACAO,kBAAA,GAAqBP,IAAA,GAAO,KAAKM,GAAA,KAAQ,QAAQ,IAAI,GAAG;EAC1D;EAEA,OAAO;IACLP,QAAA;IACAC,IAAA;IACAL,IAAA;IACAD,MAAA;IACAE,kBAAA;IACAY,UAAA,EAAY;MACVC,IAAA,EAAM;MACNjB,MAAA,EAAQ;MACRC,UAAA,EAAY;MACZF,IAAA,EAAM;IACR;IACAkB,IAAA,EAAMhC,qBAAA,CAAsBa,EAAA,IAAM,OAAO;MACvCD,GAAA;MACA,GAAGD;IACL;IACAG,IAAA,EAAMZ,gBAAA,CAAiBY,IAAA;IACvBE,UAAA,EAAYd,gBAAA,CAAiBc,UAAA,EAAY;MACvCiB,QAAA,EAAU,IAAI;MACdC,YAAA,EAAc;QACZC,QAAA,eAAUpC,KAAA,CAAAqC,aAAA,CAAC7B,mBAAA;UAAoB8B,KAAA,EAAO;YAAEC,SAAA,EAAY,UAASR,kBAAmB;UAAM;;QACtF,eAAe;MACjB;IACF;IACAf,MAAA,EAAQb,gBAAA,CACN;MACE,GAAGG,sBAAA,CAAuBU,MAAA,EAAQ;QAChCkB,QAAA,EAAU,IAAI;QACdC,YAAA,EAAc;UACZZ,QAAA;UACAE,iBAAA;UACA,iBAAiBD,IAAA;UACjBgB,IAAA,EAAM;QACR;MACF,EAAE;MACFC,OAAA,EAASrC,gBAAA,CAAiBsC,EAAA,IAAM;QAC9B,IAAIxC,mBAAA,CAAoBc,MAAA,GAAS;cAC/B2B,eAAA;UAAA,CAAAA,eAAA,GAAA3B,MAAA,CAAOyB,OAAO,cAAdE,eAAA,uBAAAA,eAAA,CAAAC,IAAA,CAAA5B,MAAA,EAAiB0B,EAAA;QACnB;QACA,IAAI,CAACA,EAAA,CAAGG,gBAAgB,EAAE;UACxBvB,sBAAA,CAAuBoB,EAAA;QACzB;MACF;IACF,GACA;MAAER,QAAA,EAAU;IAAK;EAErB;AACF"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React"],"sources":["../../../src/components/AccordionItem/AccordionItem.types.ts"],"sourcesContent":["import * as React from 'react';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type AccordionItemContextValue = Required<Pick<AccordionItemProps, 'disabled'>> & {\n onHeaderClick(ev: React.MouseEvent | React.KeyboardEvent): void;\n open: boolean;\n};\n\nexport type AccordionItemContextValues = {\n accordionItem: AccordionItemContextValue;\n};\n\nexport type AccordionItemSlots = {\n root: Slot<'div'
|
|
1
|
+
{"version":3,"names":["React"],"sources":["../../../src/components/AccordionItem/AccordionItem.types.ts"],"sourcesContent":["import * as React from 'react';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type AccordionItemContextValue = Required<Pick<AccordionItemProps, 'disabled'>> & {\n onHeaderClick(ev: React.MouseEvent | React.KeyboardEvent): void;\n open: boolean;\n};\n\nexport type AccordionItemContextValues = {\n accordionItem: AccordionItemContextValue;\n};\n\nexport type AccordionItemSlots = {\n root: NonNullable<Slot<'div'>>;\n};\n\nexport type AccordionItemProps = ComponentProps<AccordionItemSlots> & {\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 AccordionItemValue = unknown;\n\nexport type AccordionItemState = ComponentState<AccordionItemSlots> & AccordionItemContextValue;\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":[],"sources":["../../../src/components/AccordionPanel/AccordionPanel.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type AccordionPanelSlots = {\n root: Slot<'div'
|
|
1
|
+
{"version":3,"names":[],"sources":["../../../src/components/AccordionPanel/AccordionPanel.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type AccordionPanelSlots = {\n root: NonNullable<Slot<'div'>>;\n};\n\nexport type AccordionPanelProps = ComponentProps<AccordionPanelSlots>;\n\nexport type AccordionPanelState = ComponentState<AccordionPanelSlots> & {\n /**\n * Internal open state, provided by context.\n */\n open: boolean;\n};\n"],"mappings":"AAAA"}
|
|
@@ -13,7 +13,7 @@ const renderAccordionHeader_unstable = (state, contextValues)=>{
|
|
|
13
13
|
const { slots , slotProps } = (0, _reactUtilities.getSlotsNext)(state);
|
|
14
14
|
return /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(_accordionHeaderContext.AccordionHeaderContext.Provider, {
|
|
15
15
|
value: contextValues.accordionHeader
|
|
16
|
-
}, /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.root, slotProps.root, /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.button, slotProps.button, state.expandIconPosition === 'start' && /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.expandIcon, slotProps.expandIcon), slots.icon && /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.icon, slotProps.icon), slotProps.root.children, state.expandIconPosition === 'end' && /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.expandIcon, slotProps.expandIcon))));
|
|
16
|
+
}, /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.root, slotProps.root, /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.button, slotProps.button, state.expandIconPosition === 'start' && slots.expandIcon && /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.expandIcon, slotProps.expandIcon), slots.icon && /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.icon, slotProps.icon), slotProps.root.children, state.expandIconPosition === 'end' && slots.expandIcon && /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.expandIcon, slotProps.expandIcon))));
|
|
17
17
|
}; //# sourceMappingURL=renderAccordionHeader.js.map
|
|
18
18
|
|
|
19
19
|
//# sourceMappingURL=renderAccordionHeader.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../lib/components/AccordionHeader/renderAccordionHeader.js"],"sourcesContent":["/** @jsxRuntime classic */ /** @jsx createElement */import { createElement } from '@fluentui/react-jsx-runtime';\nimport { getSlotsNext } from '@fluentui/react-utilities';\nimport { AccordionHeaderContext } from './AccordionHeaderContext';\n/**\n * Function that renders the final JSX of the component\n */\nexport const renderAccordionHeader_unstable = (state, contextValues) => {\n const {\n slots,\n slotProps\n } = getSlotsNext(state);\n return /*#__PURE__*/createElement(AccordionHeaderContext.Provider, {\n value: contextValues.accordionHeader\n }, /*#__PURE__*/createElement(slots.root, slotProps.root, /*#__PURE__*/createElement(slots.button, slotProps.button, state.expandIconPosition === 'start' && /*#__PURE__*/createElement(slots.expandIcon, slotProps.expandIcon), slots.icon && /*#__PURE__*/createElement(slots.icon, slotProps.icon), slotProps.root.children, state.expandIconPosition === 'end' && /*#__PURE__*/createElement(slots.expandIcon, slotProps.expandIcon))));\n};\n//# sourceMappingURL=renderAccordionHeader.js.map"],"names":["renderAccordionHeader_unstable","state","contextValues","slots","slotProps","getSlotsNext","createElement","AccordionHeaderContext","Provider","value","accordionHeader","root","button","expandIconPosition","expandIcon","icon","children"],"mappings":"AAAA,wBAAwB,GAAG,uBAAuB;;;;+BAMrCA;;aAAAA;;iCANqE;gCACrD;wCACU;AAIhC,MAAMA,iCAAiC,CAACC,OAAOC,gBAAkB;IACtE,MAAM,EACJC,MAAK,EACLC,UAAS,EACV,GAAGC,IAAAA,4BAAY,EAACJ;IACjB,OAAO,WAAW,GAAEK,IAAAA,8BAAa,EAACC,8CAAsB,CAACC,QAAQ,EAAE;QACjEC,OAAOP,cAAcQ,eAAe;IACtC,GAAG,WAAW,GAAEJ,IAAAA,8BAAa,EAACH,MAAMQ,IAAI,EAAEP,UAAUO,IAAI,EAAE,WAAW,GAAEL,IAAAA,8BAAa,EAACH,MAAMS,MAAM,EAAER,UAAUQ,MAAM,EAAEX,MAAMY,kBAAkB,KAAK,
|
|
1
|
+
{"version":3,"sources":["../../../lib/components/AccordionHeader/renderAccordionHeader.js"],"sourcesContent":["/** @jsxRuntime classic */ /** @jsx createElement */import { createElement } from '@fluentui/react-jsx-runtime';\nimport { getSlotsNext } from '@fluentui/react-utilities';\nimport { AccordionHeaderContext } from './AccordionHeaderContext';\n/**\n * Function that renders the final JSX of the component\n */\nexport const renderAccordionHeader_unstable = (state, contextValues) => {\n const {\n slots,\n slotProps\n } = getSlotsNext(state);\n return /*#__PURE__*/createElement(AccordionHeaderContext.Provider, {\n value: contextValues.accordionHeader\n }, /*#__PURE__*/createElement(slots.root, slotProps.root, /*#__PURE__*/createElement(slots.button, slotProps.button, state.expandIconPosition === 'start' && slots.expandIcon && /*#__PURE__*/createElement(slots.expandIcon, slotProps.expandIcon), slots.icon && /*#__PURE__*/createElement(slots.icon, slotProps.icon), slotProps.root.children, state.expandIconPosition === 'end' && slots.expandIcon && /*#__PURE__*/createElement(slots.expandIcon, slotProps.expandIcon))));\n};\n//# sourceMappingURL=renderAccordionHeader.js.map"],"names":["renderAccordionHeader_unstable","state","contextValues","slots","slotProps","getSlotsNext","createElement","AccordionHeaderContext","Provider","value","accordionHeader","root","button","expandIconPosition","expandIcon","icon","children"],"mappings":"AAAA,wBAAwB,GAAG,uBAAuB;;;;+BAMrCA;;aAAAA;;iCANqE;gCACrD;wCACU;AAIhC,MAAMA,iCAAiC,CAACC,OAAOC,gBAAkB;IACtE,MAAM,EACJC,MAAK,EACLC,UAAS,EACV,GAAGC,IAAAA,4BAAY,EAACJ;IACjB,OAAO,WAAW,GAAEK,IAAAA,8BAAa,EAACC,8CAAsB,CAACC,QAAQ,EAAE;QACjEC,OAAOP,cAAcQ,eAAe;IACtC,GAAG,WAAW,GAAEJ,IAAAA,8BAAa,EAACH,MAAMQ,IAAI,EAAEP,UAAUO,IAAI,EAAE,WAAW,GAAEL,IAAAA,8BAAa,EAACH,MAAMS,MAAM,EAAER,UAAUQ,MAAM,EAAEX,MAAMY,kBAAkB,KAAK,WAAWV,MAAMW,UAAU,IAAI,WAAW,GAAER,IAAAA,8BAAa,EAACH,MAAMW,UAAU,EAAEV,UAAUU,UAAU,GAAGX,MAAMY,IAAI,IAAI,WAAW,GAAET,IAAAA,8BAAa,EAACH,MAAMY,IAAI,EAAEX,UAAUW,IAAI,GAAGX,UAAUO,IAAI,CAACK,QAAQ,EAAEf,MAAMY,kBAAkB,KAAK,SAASV,MAAMW,UAAU,IAAI,WAAW,GAAER,IAAAA,8BAAa,EAACH,MAAMW,UAAU,EAAEV,UAAUU,UAAU;AACjd,GACA,iDAAiD"}
|
|
@@ -31,15 +31,6 @@ const useAccordionHeader_unstable = (props, ref)=>{
|
|
|
31
31
|
// Otherwise, the chevron points down [v] when open, and right [>] (or left [<] in RTL) when closed
|
|
32
32
|
expandIconRotation = open ? 90 : dir !== 'rtl' ? 0 : 180;
|
|
33
33
|
}
|
|
34
|
-
const buttonShorthand = (0, _reactAria.useARIAButtonShorthand)(button, {
|
|
35
|
-
required: true,
|
|
36
|
-
defaultProps: {
|
|
37
|
-
disabled,
|
|
38
|
-
disabledFocusable,
|
|
39
|
-
'aria-expanded': open,
|
|
40
|
-
type: 'button'
|
|
41
|
-
}
|
|
42
|
-
});
|
|
43
34
|
return {
|
|
44
35
|
disabled,
|
|
45
36
|
open,
|
|
@@ -68,16 +59,28 @@ const useAccordionHeader_unstable = (props, ref)=>{
|
|
|
68
59
|
'aria-hidden': true
|
|
69
60
|
}
|
|
70
61
|
}),
|
|
71
|
-
button: {
|
|
72
|
-
...
|
|
62
|
+
button: (0, _reactUtilities.resolveShorthand)({
|
|
63
|
+
...(0, _reactAria.useARIAButtonShorthand)(button, {
|
|
64
|
+
required: true,
|
|
65
|
+
defaultProps: {
|
|
66
|
+
disabled,
|
|
67
|
+
disabledFocusable,
|
|
68
|
+
'aria-expanded': open,
|
|
69
|
+
type: 'button'
|
|
70
|
+
}
|
|
71
|
+
}),
|
|
73
72
|
onClick: (0, _reactUtilities.useEventCallback)((ev)=>{
|
|
74
|
-
|
|
75
|
-
|
|
73
|
+
if ((0, _reactUtilities.isResolvedShorthand)(button)) {
|
|
74
|
+
var _button_onClick;
|
|
75
|
+
(_button_onClick = button.onClick) === null || _button_onClick === void 0 ? void 0 : _button_onClick.call(button, ev);
|
|
76
|
+
}
|
|
76
77
|
if (!ev.defaultPrevented) {
|
|
77
78
|
onAccordionHeaderClick(ev);
|
|
78
79
|
}
|
|
79
80
|
})
|
|
80
|
-
}
|
|
81
|
+
}, {
|
|
82
|
+
required: true
|
|
83
|
+
})
|
|
81
84
|
};
|
|
82
85
|
}; //# sourceMappingURL=useAccordionHeader.js.map
|
|
83
86
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../lib/components/AccordionHeader/useAccordionHeader.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, resolveShorthand, useEventCallback } from '@fluentui/react-utilities';\nimport { useAccordionItemContext_unstable } from '../AccordionItem/index';\nimport { useARIAButtonShorthand } from '@fluentui/react-aria';\nimport { useAccordionContext_unstable } from '../Accordion/AccordionContext';\nimport { ChevronRightRegular } from '@fluentui/react-icons';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\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 = (props, ref) => {\n const {\n as,\n icon,\n button,\n expandIcon,\n inline = false,\n size = 'medium',\n expandIconPosition = 'start'\n } = props;\n const {\n onHeaderClick: onAccordionHeaderClick,\n disabled,\n open\n } = useAccordionItemContext_unstable();\n /**\n * force disabled state on button if accordion isn't collapsible\n * and this is the only item opened\n */\n const disabledFocusable = useAccordionContext_unstable(ctx => !ctx.collapsible && ctx.openItems.length === 1 && open);\n const {\n dir\n } = useFluent();\n // Calculate how to rotate the expand icon [>] (ChevronRightRegular)\n let expandIconRotation;\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
|
|
1
|
+
{"version":3,"sources":["../../../lib/components/AccordionHeader/useAccordionHeader.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, isResolvedShorthand, resolveShorthand, useEventCallback } from '@fluentui/react-utilities';\nimport { useAccordionItemContext_unstable } from '../AccordionItem/index';\nimport { useARIAButtonShorthand } from '@fluentui/react-aria';\nimport { useAccordionContext_unstable } from '../Accordion/AccordionContext';\nimport { ChevronRightRegular } from '@fluentui/react-icons';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\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 = (props, ref) => {\n const {\n as,\n icon,\n button,\n expandIcon,\n inline = false,\n size = 'medium',\n expandIconPosition = 'start'\n } = props;\n const {\n onHeaderClick: onAccordionHeaderClick,\n disabled,\n open\n } = useAccordionItemContext_unstable();\n /**\n * force disabled state on button if accordion isn't collapsible\n * and this is the only item opened\n */\n const disabledFocusable = useAccordionContext_unstable(ctx => !ctx.collapsible && ctx.openItems.length === 1 && open);\n const {\n dir\n } = useFluent();\n // Calculate how to rotate the expand icon [>] (ChevronRightRegular)\n let expandIconRotation;\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 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: /*#__PURE__*/React.createElement(ChevronRightRegular, {\n style: {\n transform: `rotate(${expandIconRotation}deg)`\n }\n }),\n 'aria-hidden': true\n }\n }),\n button: resolveShorthand({\n ...useARIAButtonShorthand(button, {\n required: true,\n defaultProps: {\n disabled,\n disabledFocusable,\n 'aria-expanded': open,\n type: 'button'\n }\n }),\n onClick: useEventCallback(ev => {\n if (isResolvedShorthand(button)) {\n var _button_onClick;\n (_button_onClick = button.onClick) === null || _button_onClick === void 0 ? void 0 : _button_onClick.call(button, ev);\n }\n if (!ev.defaultPrevented) {\n onAccordionHeaderClick(ev);\n }\n })\n }, {\n required: true\n })\n };\n};\n//# sourceMappingURL=useAccordionHeader.js.map"],"names":["useAccordionHeader_unstable","props","ref","as","icon","button","expandIcon","inline","size","expandIconPosition","onHeaderClick","onAccordionHeaderClick","disabled","open","useAccordionItemContext_unstable","disabledFocusable","useAccordionContext_unstable","ctx","collapsible","openItems","length","dir","useFluent","expandIconRotation","components","root","getNativeElementProps","resolveShorthand","required","defaultProps","children","React","createElement","ChevronRightRegular","style","transform","useARIAButtonShorthand","type","onClick","useEventCallback","ev","isResolvedShorthand","_button_onClick","call","defaultPrevented"],"mappings":";;;;+BAYaA;;aAAAA;;;6DAZU;gCACwE;uBAC9C;2BACV;kCACM;4BACT;qCACY;AAMzC,MAAMA,8BAA8B,CAACC,OAAOC,MAAQ;IACzD,MAAM,EACJC,GAAE,EACFC,KAAI,EACJC,OAAM,EACNC,WAAU,EACVC,QAAS,KAAK,CAAA,EACdC,MAAO,SAAQ,EACfC,oBAAqB,QAAO,EAC7B,GAAGR;IACJ,MAAM,EACJS,eAAeC,uBAAsB,EACrCC,SAAQ,EACRC,KAAI,EACL,GAAGC,IAAAA,uCAAgC;IACpC;;;EAGA,GACA,MAAMC,oBAAoBC,IAAAA,8CAA4B,EAACC,CAAAA,MAAO,CAACA,IAAIC,WAAW,IAAID,IAAIE,SAAS,CAACC,MAAM,KAAK,KAAKP;IAChH,MAAM,EACJQ,IAAG,EACJ,GAAGC,IAAAA,uCAAS;IACb,oEAAoE;IACpE,IAAIC;IACJ,IAAId,uBAAuB,OAAO;QAChC,8FAA8F;QAC9Fc,qBAAqBV,OAAO,CAAC,KAAK,EAAE;IACtC,OAAO;QACL,mGAAmG;QACnGU,qBAAqBV,OAAO,KAAKQ,QAAQ,QAAQ,IAAI,GAAG;IAC1D,CAAC;IACD,OAAO;QACLT;QACAC;QACAL;QACAD;QACAE;QACAe,YAAY;YACVC,MAAM;YACNpB,QAAQ;YACRC,YAAY;YACZF,MAAM;QACR;QACAqB,MAAMC,IAAAA,qCAAqB,EAACvB,MAAM,OAAO;YACvCD;YACA,GAAGD,KAAK;QACV;QACAG,MAAMuB,IAAAA,gCAAgB,EAACvB;QACvBE,YAAYqB,IAAAA,gCAAgB,EAACrB,YAAY;YACvCsB,UAAU,IAAI;YACdC,cAAc;gBACZC,UAAU,WAAW,GAAEC,OAAMC,aAAa,CAACC,+BAAmB,EAAE;oBAC9DC,OAAO;wBACLC,WAAW,CAAC,OAAO,EAAEZ,mBAAmB,IAAI,CAAC;oBAC/C;gBACF;gBACA,eAAe,IAAI;YACrB;QACF;QACAlB,QAAQsB,IAAAA,gCAAgB,EAAC;YACvB,GAAGS,IAAAA,iCAAsB,EAAC/B,QAAQ;gBAChCuB,UAAU,IAAI;gBACdC,cAAc;oBACZjB;oBACAG;oBACA,iBAAiBF;oBACjBwB,MAAM;gBACR;YACF,EAAE;YACFC,SAASC,IAAAA,gCAAgB,EAACC,CAAAA,KAAM;gBAC9B,IAAIC,IAAAA,mCAAmB,EAACpC,SAAS;oBAC/B,IAAIqC;oBACHA,CAAAA,kBAAkBrC,OAAOiC,OAAO,AAAD,MAAO,IAAI,IAAII,oBAAoB,KAAK,IAAI,KAAK,IAAIA,gBAAgBC,IAAI,CAACtC,QAAQmC,GAAG;gBACvH,CAAC;gBACD,IAAI,CAACA,GAAGI,gBAAgB,EAAE;oBACxBjC,uBAAuB6B;gBACzB,CAAC;YACH;QACF,GAAG;YACDZ,UAAU,IAAI;QAChB;IACF;AACF,GACA,8CAA8C"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fluentui/react-accordion",
|
|
3
|
-
"version": "9.1.
|
|
3
|
+
"version": "9.1.14",
|
|
4
4
|
"description": "Fluent UI accordion component",
|
|
5
5
|
"main": "lib-commonjs/index.js",
|
|
6
6
|
"module": "lib/index.js",
|
|
@@ -23,7 +23,7 @@
|
|
|
23
23
|
"storybook": "start-storybook",
|
|
24
24
|
"type-check": "tsc -b tsconfig.json",
|
|
25
25
|
"generate-api": "just-scripts generate-api",
|
|
26
|
-
"test-ssr": "test-ssr ./stories/**/*.stories.tsx"
|
|
26
|
+
"test-ssr": "test-ssr \"./stories/**/*.stories.tsx\""
|
|
27
27
|
},
|
|
28
28
|
"devDependencies": {
|
|
29
29
|
"@fluentui/eslint-plugin": "*",
|
|
@@ -37,8 +37,8 @@
|
|
|
37
37
|
"@fluentui/react-context-selector": "^9.1.20",
|
|
38
38
|
"@fluentui/react-icons": "^2.0.196",
|
|
39
39
|
"@fluentui/react-jsx-runtime": "9.0.0-alpha.4",
|
|
40
|
-
"@fluentui/react-shared-contexts": "^9.
|
|
41
|
-
"@fluentui/react-tabster": "^9.7.
|
|
40
|
+
"@fluentui/react-shared-contexts": "^9.5.0",
|
|
41
|
+
"@fluentui/react-tabster": "^9.7.3",
|
|
42
42
|
"@fluentui/react-theme": "^9.1.8",
|
|
43
43
|
"@fluentui/react-utilities": "^9.9.0",
|
|
44
44
|
"@griffel/react": "^1.5.2",
|