@fluentui/react-accordion 0.0.0-nightlycc44f3625c20211220.1 → 0.0.0-nightlyd80c90385320220216.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.json +186 -25
- package/CHANGELOG.md +43 -14
- package/Spec.md +36 -4
- package/dist/react-accordion.d.ts +40 -58
- package/lib/components/Accordion/Accordion.d.ts +1 -1
- package/lib/components/Accordion/Accordion.js +9 -9
- package/lib/components/Accordion/Accordion.js.map +1 -1
- package/lib/components/Accordion/Accordion.types.d.ts +7 -5
- package/lib/components/Accordion/AccordionContext.js +0 -1
- package/lib/components/Accordion/AccordionContext.js.map +1 -1
- package/lib/components/Accordion/renderAccordion.d.ts +1 -1
- package/lib/components/Accordion/renderAccordion.js +1 -1
- package/lib/components/Accordion/renderAccordion.js.map +1 -1
- package/lib/components/Accordion/useAccordion.d.ts +2 -3
- package/lib/components/Accordion/useAccordion.js +17 -20
- package/lib/components/Accordion/useAccordion.js.map +1 -1
- package/lib/components/Accordion/useAccordionContextValues.d.ts +1 -1
- package/lib/components/Accordion/useAccordionContextValues.js +3 -3
- package/lib/components/Accordion/useAccordionContextValues.js.map +1 -1
- package/lib/components/Accordion/useAccordionStyles.d.ts +1 -1
- package/lib/components/Accordion/useAccordionStyles.js +2 -2
- package/lib/components/Accordion/useAccordionStyles.js.map +1 -1
- package/lib/components/AccordionHeader/AccordionHeader.d.ts +2 -1
- package/lib/components/AccordionHeader/AccordionHeader.js +10 -9
- package/lib/components/AccordionHeader/AccordionHeader.js.map +1 -1
- package/lib/components/AccordionHeader/AccordionHeader.types.d.ts +12 -11
- package/lib/components/AccordionHeader/index.d.ts +0 -1
- package/lib/components/AccordionHeader/index.js +0 -1
- package/lib/components/AccordionHeader/index.js.map +1 -1
- package/lib/components/AccordionHeader/renderAccordionHeader.d.ts +1 -1
- package/lib/components/AccordionHeader/renderAccordionHeader.js +4 -6
- package/lib/components/AccordionHeader/renderAccordionHeader.js.map +1 -1
- package/lib/components/AccordionHeader/useAccordionHeader.d.ts +2 -6
- package/lib/components/AccordionHeader/useAccordionHeader.js +28 -19
- package/lib/components/AccordionHeader/useAccordionHeader.js.map +1 -1
- package/lib/components/AccordionHeader/useAccordionHeaderContextValues.d.ts +1 -1
- package/lib/components/AccordionHeader/useAccordionHeaderContextValues.js +1 -1
- package/lib/components/AccordionHeader/useAccordionHeaderContextValues.js.map +1 -1
- package/lib/components/AccordionHeader/useAccordionHeaderStyles.d.ts +1 -1
- package/lib/components/AccordionHeader/useAccordionHeaderStyles.js +27 -45
- package/lib/components/AccordionHeader/useAccordionHeaderStyles.js.map +1 -1
- package/lib/components/AccordionItem/AccordionItem.d.ts +1 -1
- package/lib/components/AccordionItem/AccordionItem.js +9 -9
- package/lib/components/AccordionItem/AccordionItem.js.map +1 -1
- package/lib/components/AccordionItem/AccordionItem.types.d.ts +4 -3
- package/lib/components/AccordionItem/AccordionItemContext.d.ts +1 -1
- package/lib/components/AccordionItem/AccordionItemContext.js +1 -1
- package/lib/components/AccordionItem/AccordionItemContext.js.map +1 -1
- package/lib/components/AccordionItem/renderAccordionItem.d.ts +1 -1
- package/lib/components/AccordionItem/renderAccordionItem.js +2 -3
- package/lib/components/AccordionItem/renderAccordionItem.js.map +1 -1
- package/lib/components/AccordionItem/useAccordionItem.d.ts +2 -6
- package/lib/components/AccordionItem/useAccordionItem.js +9 -13
- package/lib/components/AccordionItem/useAccordionItem.js.map +1 -1
- package/lib/components/AccordionItem/useAccordionItemContextValues.d.ts +1 -1
- package/lib/components/AccordionItem/useAccordionItemContextValues.js +1 -1
- package/lib/components/AccordionItem/useAccordionItemContextValues.js.map +1 -1
- package/lib/components/AccordionItem/useAccordionItemStyles.d.ts +1 -1
- package/lib/components/AccordionItem/useAccordionItemStyles.js +2 -2
- package/lib/components/AccordionItem/useAccordionItemStyles.js.map +1 -1
- package/lib/components/AccordionPanel/AccordionPanel.d.ts +1 -1
- package/lib/components/AccordionPanel/AccordionPanel.js +7 -7
- package/lib/components/AccordionPanel/AccordionPanel.js.map +1 -1
- package/lib/components/AccordionPanel/AccordionPanel.types.d.ts +2 -2
- package/lib/components/AccordionPanel/renderAccordionPanel.d.ts +1 -1
- package/lib/components/AccordionPanel/renderAccordionPanel.js +2 -3
- package/lib/components/AccordionPanel/renderAccordionPanel.js.map +1 -1
- package/lib/components/AccordionPanel/useAccordionPanel.d.ts +2 -6
- package/lib/components/AccordionPanel/useAccordionPanel.js +6 -9
- package/lib/components/AccordionPanel/useAccordionPanel.js.map +1 -1
- package/lib/components/AccordionPanel/useAccordionPanelStyles.d.ts +1 -1
- package/lib/components/AccordionPanel/useAccordionPanelStyles.js +2 -2
- package/lib/components/AccordionPanel/useAccordionPanelStyles.js.map +1 -1
- package/lib-commonjs/components/Accordion/Accordion.d.ts +1 -1
- package/lib-commonjs/components/Accordion/Accordion.js +5 -5
- package/lib-commonjs/components/Accordion/Accordion.js.map +1 -1
- package/lib-commonjs/components/Accordion/Accordion.types.d.ts +7 -5
- package/lib-commonjs/components/Accordion/AccordionContext.js +0 -1
- package/lib-commonjs/components/Accordion/AccordionContext.js.map +1 -1
- package/lib-commonjs/components/Accordion/renderAccordion.d.ts +1 -1
- package/lib-commonjs/components/Accordion/renderAccordion.js +3 -3
- package/lib-commonjs/components/Accordion/renderAccordion.js.map +1 -1
- package/lib-commonjs/components/Accordion/useAccordion.d.ts +2 -3
- package/lib-commonjs/components/Accordion/useAccordion.js +20 -22
- package/lib-commonjs/components/Accordion/useAccordion.js.map +1 -1
- package/lib-commonjs/components/Accordion/useAccordionContextValues.d.ts +1 -1
- package/lib-commonjs/components/Accordion/useAccordionContextValues.js +5 -5
- package/lib-commonjs/components/Accordion/useAccordionContextValues.js.map +1 -1
- package/lib-commonjs/components/Accordion/useAccordionStyles.d.ts +1 -1
- package/lib-commonjs/components/Accordion/useAccordionStyles.js +5 -5
- package/lib-commonjs/components/Accordion/useAccordionStyles.js.map +1 -1
- package/lib-commonjs/components/AccordionHeader/AccordionHeader.d.ts +2 -1
- package/lib-commonjs/components/AccordionHeader/AccordionHeader.js +6 -5
- package/lib-commonjs/components/AccordionHeader/AccordionHeader.js.map +1 -1
- package/lib-commonjs/components/AccordionHeader/AccordionHeader.types.d.ts +12 -11
- package/lib-commonjs/components/AccordionHeader/index.d.ts +0 -1
- package/lib-commonjs/components/AccordionHeader/index.js +0 -2
- package/lib-commonjs/components/AccordionHeader/index.js.map +1 -1
- package/lib-commonjs/components/AccordionHeader/renderAccordionHeader.d.ts +1 -1
- package/lib-commonjs/components/AccordionHeader/renderAccordionHeader.js +6 -9
- package/lib-commonjs/components/AccordionHeader/renderAccordionHeader.js.map +1 -1
- package/lib-commonjs/components/AccordionHeader/useAccordionHeader.d.ts +2 -6
- package/lib-commonjs/components/AccordionHeader/useAccordionHeader.js +31 -20
- package/lib-commonjs/components/AccordionHeader/useAccordionHeader.js.map +1 -1
- package/lib-commonjs/components/AccordionHeader/useAccordionHeaderContextValues.d.ts +1 -1
- package/lib-commonjs/components/AccordionHeader/useAccordionHeaderContextValues.js +3 -3
- package/lib-commonjs/components/AccordionHeader/useAccordionHeaderContextValues.js.map +1 -1
- package/lib-commonjs/components/AccordionHeader/useAccordionHeaderStyles.d.ts +1 -1
- package/lib-commonjs/components/AccordionHeader/useAccordionHeaderStyles.js +34 -51
- package/lib-commonjs/components/AccordionHeader/useAccordionHeaderStyles.js.map +1 -1
- package/lib-commonjs/components/AccordionItem/AccordionItem.d.ts +1 -1
- package/lib-commonjs/components/AccordionItem/AccordionItem.js +5 -5
- package/lib-commonjs/components/AccordionItem/AccordionItem.js.map +1 -1
- package/lib-commonjs/components/AccordionItem/AccordionItem.types.d.ts +4 -3
- package/lib-commonjs/components/AccordionItem/AccordionItemContext.d.ts +1 -1
- package/lib-commonjs/components/AccordionItem/AccordionItemContext.js +3 -3
- package/lib-commonjs/components/AccordionItem/AccordionItemContext.js.map +1 -1
- package/lib-commonjs/components/AccordionItem/renderAccordionItem.d.ts +1 -1
- package/lib-commonjs/components/AccordionItem/renderAccordionItem.js +4 -6
- package/lib-commonjs/components/AccordionItem/renderAccordionItem.js.map +1 -1
- package/lib-commonjs/components/AccordionItem/useAccordionItem.d.ts +2 -6
- package/lib-commonjs/components/AccordionItem/useAccordionItem.js +11 -15
- package/lib-commonjs/components/AccordionItem/useAccordionItem.js.map +1 -1
- package/lib-commonjs/components/AccordionItem/useAccordionItemContextValues.d.ts +1 -1
- package/lib-commonjs/components/AccordionItem/useAccordionItemContextValues.js +3 -3
- package/lib-commonjs/components/AccordionItem/useAccordionItemContextValues.js.map +1 -1
- package/lib-commonjs/components/AccordionItem/useAccordionItemStyles.d.ts +1 -1
- package/lib-commonjs/components/AccordionItem/useAccordionItemStyles.js +5 -5
- package/lib-commonjs/components/AccordionItem/useAccordionItemStyles.js.map +1 -1
- package/lib-commonjs/components/AccordionPanel/AccordionPanel.d.ts +1 -1
- package/lib-commonjs/components/AccordionPanel/AccordionPanel.js +4 -4
- package/lib-commonjs/components/AccordionPanel/AccordionPanel.js.map +1 -1
- package/lib-commonjs/components/AccordionPanel/AccordionPanel.types.d.ts +2 -2
- package/lib-commonjs/components/AccordionPanel/renderAccordionPanel.d.ts +1 -1
- package/lib-commonjs/components/AccordionPanel/renderAccordionPanel.js +4 -6
- package/lib-commonjs/components/AccordionPanel/renderAccordionPanel.js.map +1 -1
- package/lib-commonjs/components/AccordionPanel/useAccordionPanel.d.ts +2 -6
- package/lib-commonjs/components/AccordionPanel/useAccordionPanel.js +8 -11
- package/lib-commonjs/components/AccordionPanel/useAccordionPanel.js.map +1 -1
- package/lib-commonjs/components/AccordionPanel/useAccordionPanelStyles.d.ts +1 -1
- package/lib-commonjs/components/AccordionPanel/useAccordionPanelStyles.js +6 -6
- package/lib-commonjs/components/AccordionPanel/useAccordionPanelStyles.js.map +1 -1
- package/package.json +15 -16
- package/lib/components/AccordionHeader/AccordionHeaderExpandIcon.d.ts +0 -3
- package/lib/components/AccordionHeader/AccordionHeaderExpandIcon.js +0 -41
- package/lib/components/AccordionHeader/AccordionHeaderExpandIcon.js.map +0 -1
- package/lib-commonjs/components/AccordionHeader/AccordionHeaderExpandIcon.d.ts +0 -3
- package/lib-commonjs/components/AccordionHeader/AccordionHeaderExpandIcon.js +0 -50
- package/lib-commonjs/components/AccordionHeader/AccordionHeaderExpandIcon.js.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/Accordion/Accordion.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,mBAAA,CAAA;;AACA,MAAA,cAAA,gBAAA,OAAA,CAAA,gBAAA,CAAA;;AACA,MAAA,2BAAA,gBAAA,OAAA,CAAA,6BAAA,CAAA;;AAGA,MAAA,oBAAA,gBAAA,OAAA,CAAA,sBAAA,CAAA;AAEA;;AAEG;;;AACU,OAAA,CAAA,SAAA,gBAAiD,KAAK,CAAC,UAAN,CAC5D,CAAC,KAAD,EAAQ,GAAR,KAAe;AACb,QAAM,KAAK,GAAG,cAAA,CAAA,
|
|
1
|
+
{"version":3,"sources":["../../../src/components/Accordion/Accordion.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,mBAAA,CAAA;;AACA,MAAA,cAAA,gBAAA,OAAA,CAAA,gBAAA,CAAA;;AACA,MAAA,2BAAA,gBAAA,OAAA,CAAA,6BAAA,CAAA;;AAGA,MAAA,oBAAA,gBAAA,OAAA,CAAA,sBAAA,CAAA;AAEA;;AAEG;;;AACU,OAAA,CAAA,SAAA,gBAAiD,KAAK,CAAC,UAAN,CAC5D,CAAC,KAAD,EAAQ,GAAR,KAAe;AACb,QAAM,KAAK,GAAG,cAAA,CAAA,qBAAA,CAAsB,KAAtB,EAA6B,GAA7B,CAAd;AACA,QAAM,aAAa,GAAG,2BAAA,CAAA,kCAAA,CAAmC,KAAnC,CAAtB;AAEA,EAAA,oBAAA,CAAA,2BAAA,CAA4B,KAA5B;AAEA,SAAO,iBAAA,CAAA,wBAAA,CAAyB,KAAzB,EAAgC,aAAhC,CAAP;AACD,CAR2D,CAAjD;AAWb,OAAA,CAAA,SAAA,CAAU,WAAV,GAAwB,WAAxB","sourceRoot":""}
|
|
@@ -1,14 +1,15 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
import type { ComponentProps, ComponentState,
|
|
2
|
+
import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';
|
|
3
3
|
import type { AccordionItemValue } from '../AccordionItem/AccordionItem.types';
|
|
4
4
|
export declare type AccordionIndex = number | number[];
|
|
5
5
|
export declare type AccordionToggleEvent<E = HTMLElement> = React.MouseEvent<E> | React.KeyboardEvent<E>;
|
|
6
6
|
export declare type AccordionToggleEventHandler = (event: AccordionToggleEvent, data: AccordionToggleData) => void;
|
|
7
|
-
|
|
7
|
+
declare type AccordionCommons = {
|
|
8
8
|
/**
|
|
9
|
-
* Indicates if keyboard navigation is available
|
|
9
|
+
* Indicates if keyboard navigation is available and gives two options,
|
|
10
|
+
* linear or circular navigation
|
|
10
11
|
*/
|
|
11
|
-
|
|
12
|
+
navigation?: 'linear' | 'circular';
|
|
12
13
|
/**
|
|
13
14
|
* Indicates if Accordion support multiple Panels opened at the same time
|
|
14
15
|
*/
|
|
@@ -33,7 +34,7 @@ export declare type AccordionContextValues = {
|
|
|
33
34
|
accordion: AccordionContextValue;
|
|
34
35
|
};
|
|
35
36
|
export declare type AccordionSlots = {
|
|
36
|
-
root:
|
|
37
|
+
root: Slot<'div'>;
|
|
37
38
|
};
|
|
38
39
|
export declare type AccordionToggleData = {
|
|
39
40
|
value: AccordionItemValue;
|
|
@@ -50,3 +51,4 @@ export declare type AccordionProps = ComponentProps<AccordionSlots> & Partial<Ac
|
|
|
50
51
|
onToggle?: AccordionToggleEventHandler;
|
|
51
52
|
};
|
|
52
53
|
export declare type AccordionState = ComponentState<AccordionSlots> & AccordionCommons & AccordionContextValue;
|
|
54
|
+
export {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/Accordion/AccordionContext.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,wBAAA,gBAAA,OAAA,CAAA,kCAAA,CAAA;;AAIa,OAAA,CAAA,gBAAA,gBAAmD,wBAAA,CAAA,aAAA,CAAqC;AACnG,EAAA,SAAS,EAAE,EADwF;AAEnG,EAAA,
|
|
1
|
+
{"version":3,"sources":["../../../src/components/Accordion/AccordionContext.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,wBAAA,gBAAA,OAAA,CAAA,kCAAA,CAAA;;AAIa,OAAA,CAAA,gBAAA,gBAAmD,wBAAA,CAAA,aAAA,CAAqC;AACnG,EAAA,SAAS,EAAE,EADwF;AAEnG,EAAA,WAAW,EAAE,KAFsF;;AAGnG,EAAA,aAAa,GAAA;AACX;AACD;;AALkG,CAArC,CAAnD","sourceRoot":""}
|
|
@@ -2,4 +2,4 @@ import type { AccordionState, AccordionContextValues } from './Accordion.types';
|
|
|
2
2
|
/**
|
|
3
3
|
* Function that renders the final JSX of the component
|
|
4
4
|
*/
|
|
5
|
-
export declare const
|
|
5
|
+
export declare const renderAccordion_unstable: (state: AccordionState, contextValues: AccordionContextValues) => JSX.Element;
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.
|
|
6
|
+
exports.renderAccordion_unstable = void 0;
|
|
7
7
|
|
|
8
8
|
const React = /*#__PURE__*/require("react");
|
|
9
9
|
|
|
@@ -15,7 +15,7 @@ const AccordionContext_1 = /*#__PURE__*/require("./AccordionContext");
|
|
|
15
15
|
*/
|
|
16
16
|
|
|
17
17
|
|
|
18
|
-
const
|
|
18
|
+
const renderAccordion_unstable = (state, contextValues) => {
|
|
19
19
|
const {
|
|
20
20
|
slots,
|
|
21
21
|
slotProps
|
|
@@ -26,5 +26,5 @@ const renderAccordion = (state, contextValues) => {
|
|
|
26
26
|
}, slotProps.root.children));
|
|
27
27
|
};
|
|
28
28
|
|
|
29
|
-
exports.
|
|
29
|
+
exports.renderAccordion_unstable = renderAccordion_unstable;
|
|
30
30
|
//# sourceMappingURL=renderAccordion.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/Accordion/renderAccordion.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;;AAEA,MAAA,kBAAA,gBAAA,OAAA,CAAA,oBAAA,CAAA;AAGA;;AAEG;;;AACI,MAAM,
|
|
1
|
+
{"version":3,"sources":["../../../src/components/Accordion/renderAccordion.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;;AAEA,MAAA,kBAAA,gBAAA,OAAA,CAAA,oBAAA,CAAA;AAGA;;AAEG;;;AACI,MAAM,wBAAwB,GAAG,CAAC,KAAD,EAAwB,aAAxB,KAAiE;AACvG,QAAM;AAAE,IAAA,KAAF;AAAS,IAAA;AAAT,MAAuB,iBAAA,CAAA,QAAA,CAAyB,KAAzB,CAA7B;AAEA,SACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;AAAf,GAAX,EACE,KAAA,CAAA,aAAA,CAAC,kBAAA,CAAA,gBAAA,CAAiB,QAAlB,EAA0B;AAAC,IAAA,KAAK,EAAE,aAAa,CAAC;AAAtB,GAA1B,EAA4D,SAAS,CAAC,IAAV,CAAe,QAA3E,CADF,CADF;AAKD,CARM;;AAAM,OAAA,CAAA,wBAAA,GAAwB,wBAAxB","sourceRoot":""}
|
|
@@ -1,9 +1,8 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
import type { AccordionProps,
|
|
3
|
-
export declare const accordionShorthandProps: Array<keyof AccordionSlots>;
|
|
2
|
+
import type { AccordionProps, AccordionState } from './Accordion.types';
|
|
4
3
|
/**
|
|
5
4
|
* Returns the props and state required to render the component
|
|
6
5
|
* @param props - Accordion properties
|
|
7
6
|
* @param ref - reference to root HTMLElement of Accordion
|
|
8
7
|
*/
|
|
9
|
-
export declare const
|
|
8
|
+
export declare const useAccordion_unstable: (props: AccordionProps, ref: React.Ref<HTMLElement>) => AccordionState;
|
|
@@ -3,67 +3,71 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.
|
|
6
|
+
exports.useAccordion_unstable = void 0;
|
|
7
7
|
|
|
8
8
|
const React = /*#__PURE__*/require("react");
|
|
9
9
|
|
|
10
10
|
const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
|
|
11
11
|
|
|
12
|
-
|
|
12
|
+
const react_tabster_1 = /*#__PURE__*/require("@fluentui/react-tabster");
|
|
13
13
|
/**
|
|
14
14
|
* Returns the props and state required to render the component
|
|
15
15
|
* @param props - Accordion properties
|
|
16
16
|
* @param ref - reference to root HTMLElement of Accordion
|
|
17
17
|
*/
|
|
18
18
|
|
|
19
|
-
|
|
19
|
+
|
|
20
|
+
const useAccordion_unstable = (props, ref) => {
|
|
20
21
|
const {
|
|
21
22
|
openItems: controlledOpenItems,
|
|
22
23
|
defaultOpenItems,
|
|
23
24
|
multiple = false,
|
|
24
25
|
collapsible = false,
|
|
25
26
|
onToggle,
|
|
26
|
-
|
|
27
|
+
navigation
|
|
27
28
|
} = props;
|
|
28
29
|
const [openItems, setOpenItems] = react_utilities_1.useControllableState({
|
|
29
30
|
state: React.useMemo(() => normalizeValues(controlledOpenItems), [controlledOpenItems]),
|
|
30
31
|
defaultState: () => initializeUncontrolledOpenItems({
|
|
31
|
-
collapsible,
|
|
32
32
|
defaultOpenItems,
|
|
33
33
|
multiple
|
|
34
34
|
}),
|
|
35
35
|
initialState: []
|
|
36
36
|
});
|
|
37
|
+
const arrowNavigationProps = react_tabster_1.useArrowNavigationGroup({
|
|
38
|
+
circular: navigation === 'circular'
|
|
39
|
+
});
|
|
37
40
|
const requestToggle = react_utilities_1.useEventCallback((event, data) => {
|
|
38
41
|
onToggle === null || onToggle === void 0 ? void 0 : onToggle(event, data);
|
|
39
|
-
setOpenItems(previousOpenItems => {
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
});
|
|
44
|
-
});
|
|
42
|
+
setOpenItems(previousOpenItems => updateOpenItems(data.value, previousOpenItems, {
|
|
43
|
+
collapsible,
|
|
44
|
+
multiple
|
|
45
|
+
}));
|
|
45
46
|
});
|
|
46
47
|
return {
|
|
47
48
|
multiple,
|
|
48
49
|
collapsible,
|
|
49
|
-
|
|
50
|
+
navigation,
|
|
50
51
|
openItems,
|
|
51
52
|
requestToggle,
|
|
53
|
+
components: {
|
|
54
|
+
root: 'div'
|
|
55
|
+
},
|
|
52
56
|
root: react_utilities_1.getNativeElementProps('div', { ...props,
|
|
57
|
+
...(navigation ? arrowNavigationProps : {}),
|
|
53
58
|
ref
|
|
54
59
|
})
|
|
55
60
|
};
|
|
56
61
|
};
|
|
57
62
|
|
|
58
|
-
exports.
|
|
63
|
+
exports.useAccordion_unstable = useAccordion_unstable;
|
|
59
64
|
/**
|
|
60
65
|
* Initial value for the uncontrolled case of the list of open indexes
|
|
61
66
|
*/
|
|
62
67
|
|
|
63
68
|
function initializeUncontrolledOpenItems({
|
|
64
69
|
defaultOpenItems,
|
|
65
|
-
multiple
|
|
66
|
-
collapsible
|
|
70
|
+
multiple
|
|
67
71
|
}) {
|
|
68
72
|
if (defaultOpenItems !== undefined) {
|
|
69
73
|
if (Array.isArray(defaultOpenItems)) {
|
|
@@ -72,14 +76,8 @@ function initializeUncontrolledOpenItems({
|
|
|
72
76
|
|
|
73
77
|
return [defaultOpenItems];
|
|
74
78
|
}
|
|
75
|
-
/**
|
|
76
|
-
* TODO: since the dropping of descendants API due to performance issues,
|
|
77
|
-
* the default behavior of Accordion has been compromised and [0] makes no sense
|
|
78
|
-
* indexes are not used anymore to ensure the position of the element which should be opened by default
|
|
79
|
-
*/
|
|
80
|
-
|
|
81
79
|
|
|
82
|
-
return
|
|
80
|
+
return [];
|
|
83
81
|
}
|
|
84
82
|
/**
|
|
85
83
|
* Updates the list of open indexes based on an index that changes
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/Accordion/useAccordion.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;;
|
|
1
|
+
{"version":3,"sources":["../../../src/components/Accordion/useAccordion.ts"],"names":[],"mappings":"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","sourceRoot":""}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
import type { AccordionContextValues, AccordionState } from './Accordion.types';
|
|
2
|
-
export declare function
|
|
2
|
+
export declare function useAccordionContextValues_unstable(state: AccordionState): AccordionContextValues;
|
|
@@ -3,18 +3,18 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.
|
|
6
|
+
exports.useAccordionContextValues_unstable = void 0;
|
|
7
7
|
|
|
8
|
-
function
|
|
8
|
+
function useAccordionContextValues_unstable(state) {
|
|
9
9
|
const {
|
|
10
|
-
|
|
10
|
+
navigation,
|
|
11
11
|
openItems,
|
|
12
12
|
requestToggle,
|
|
13
13
|
collapsible
|
|
14
14
|
} = state; // This context is created with "@fluentui/react-context-selector", these is no sense to memoize it
|
|
15
15
|
|
|
16
16
|
const accordion = {
|
|
17
|
-
|
|
17
|
+
navigation,
|
|
18
18
|
openItems,
|
|
19
19
|
requestToggle,
|
|
20
20
|
collapsible
|
|
@@ -24,5 +24,5 @@ function useAccordionContextValues(state) {
|
|
|
24
24
|
};
|
|
25
25
|
}
|
|
26
26
|
|
|
27
|
-
exports.
|
|
27
|
+
exports.useAccordionContextValues_unstable = useAccordionContextValues_unstable;
|
|
28
28
|
//# sourceMappingURL=useAccordionContextValues.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/Accordion/useAccordionContextValues.ts"],"names":[],"mappings":";;;;;;;AAEA,SAAgB,
|
|
1
|
+
{"version":3,"sources":["../../../src/components/Accordion/useAccordionContextValues.ts"],"names":[],"mappings":";;;;;;;AAEA,SAAgB,kCAAhB,CAAmD,KAAnD,EAAwE;AACtE,QAAM;AAAE,IAAA,UAAF;AAAc,IAAA,SAAd;AAAyB,IAAA,aAAzB;AAAwC,IAAA;AAAxC,MAAwD,KAA9D,CADsE,CAGtE;;AACA,QAAM,SAAS,GAA0B;AACvC,IAAA,UADuC;AAEvC,IAAA,SAFuC;AAGvC,IAAA,aAHuC;AAIvC,IAAA;AAJuC,GAAzC;AAOA,SAAO;AAAE,IAAA;AAAF,GAAP;AACD;;AAZD,OAAA,CAAA,kCAAA,GAAA,kCAAA","sourceRoot":""}
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import type { AccordionState } from './Accordion.types';
|
|
2
2
|
export declare const accordionClassName = "fui-Accordion";
|
|
3
|
-
export declare const
|
|
3
|
+
export declare const useAccordionStyles_unstable: (state: AccordionState) => AccordionState;
|
|
@@ -3,16 +3,16 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.
|
|
6
|
+
exports.useAccordionStyles_unstable = exports.accordionClassName = void 0;
|
|
7
7
|
|
|
8
|
-
const
|
|
8
|
+
const react_1 = /*#__PURE__*/require("@griffel/react");
|
|
9
9
|
|
|
10
10
|
exports.accordionClassName = 'fui-Accordion';
|
|
11
11
|
|
|
12
|
-
const
|
|
13
|
-
state.root.className =
|
|
12
|
+
const useAccordionStyles_unstable = state => {
|
|
13
|
+
state.root.className = react_1.mergeClasses(exports.accordionClassName, state.root.className);
|
|
14
14
|
return state;
|
|
15
15
|
};
|
|
16
16
|
|
|
17
|
-
exports.
|
|
17
|
+
exports.useAccordionStyles_unstable = useAccordionStyles_unstable;
|
|
18
18
|
//# sourceMappingURL=useAccordionStyles.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/Accordion/useAccordionStyles.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,
|
|
1
|
+
{"version":3,"sources":["../../../src/components/Accordion/useAccordionStyles.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,OAAA,gBAAA,OAAA,CAAA,gBAAA,CAAA;;AAGa,OAAA,CAAA,kBAAA,GAAqB,eAArB;;AAEN,MAAM,2BAA2B,GAAI,KAAD,IAA0B;AACnE,EAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,OAAA,CAAA,YAAA,CAAa,OAAA,CAAA,kBAAb,EAAiC,KAAK,CAAC,IAAN,CAAW,SAA5C,CAAvB;AAEA,SAAO,KAAP;AACD,CAJM;;AAAM,OAAA,CAAA,2BAAA,GAA2B,2BAA3B","sourceRoot":""}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import type { AccordionHeaderProps } from './AccordionHeader.types';
|
|
2
2
|
import type { ForwardRefComponent } from '@fluentui/react-utilities';
|
|
3
3
|
/**
|
|
4
|
-
* Define a styled AccordionHeader, using the `
|
|
4
|
+
* Define a styled AccordionHeader, using the `useAccordionHeader_unstable` and `useAccordionHeaderStyles_unstable`
|
|
5
|
+
* hooks.
|
|
5
6
|
*/
|
|
6
7
|
export declare const AccordionHeader: ForwardRefComponent<AccordionHeaderProps>;
|
|
@@ -15,15 +15,16 @@ const useAccordionHeaderStyles_1 = /*#__PURE__*/require("./useAccordionHeaderSty
|
|
|
15
15
|
|
|
16
16
|
const useAccordionHeaderContextValues_1 = /*#__PURE__*/require("./useAccordionHeaderContextValues");
|
|
17
17
|
/**
|
|
18
|
-
* Define a styled AccordionHeader, using the `
|
|
18
|
+
* Define a styled AccordionHeader, using the `useAccordionHeader_unstable` and `useAccordionHeaderStyles_unstable`
|
|
19
|
+
* hooks.
|
|
19
20
|
*/
|
|
20
21
|
|
|
21
22
|
|
|
22
23
|
exports.AccordionHeader = /*#__PURE__*/React.forwardRef((props, ref) => {
|
|
23
|
-
const state = useAccordionHeader_1.
|
|
24
|
-
const contextValues = useAccordionHeaderContextValues_1.
|
|
25
|
-
useAccordionHeaderStyles_1.
|
|
26
|
-
return renderAccordionHeader_1.
|
|
24
|
+
const state = useAccordionHeader_1.useAccordionHeader_unstable(props, ref);
|
|
25
|
+
const contextValues = useAccordionHeaderContextValues_1.useAccordionHeaderContextValues_unstable(state);
|
|
26
|
+
useAccordionHeaderStyles_1.useAccordionHeaderStyles_unstable(state);
|
|
27
|
+
return renderAccordionHeader_1.renderAccordionHeader_unstable(state, contextValues);
|
|
27
28
|
});
|
|
28
29
|
exports.AccordionHeader.displayName = 'AccordionHeader';
|
|
29
30
|
//# sourceMappingURL=AccordionHeader.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/AccordionHeader/AccordionHeader.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,oBAAA,gBAAA,OAAA,CAAA,sBAAA,CAAA;;AACA,MAAA,uBAAA,gBAAA,OAAA,CAAA,yBAAA,CAAA;;AACA,MAAA,0BAAA,gBAAA,OAAA,CAAA,4BAAA,CAAA;;AACA,MAAA,iCAAA,gBAAA,OAAA,CAAA,mCAAA,CAAA;AAIA
|
|
1
|
+
{"version":3,"sources":["../../../src/components/AccordionHeader/AccordionHeader.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,oBAAA,gBAAA,OAAA,CAAA,sBAAA,CAAA;;AACA,MAAA,uBAAA,gBAAA,OAAA,CAAA,yBAAA,CAAA;;AACA,MAAA,0BAAA,gBAAA,OAAA,CAAA,4BAAA,CAAA;;AACA,MAAA,iCAAA,gBAAA,OAAA,CAAA,mCAAA,CAAA;AAIA;;;AAGG;;;AACU,OAAA,CAAA,eAAA,gBAA6D,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;AACxG,QAAM,KAAK,GAAG,oBAAA,CAAA,2BAAA,CAA4B,KAA5B,EAAmC,GAAnC,CAAd;AACA,QAAM,aAAa,GAAG,iCAAA,CAAA,wCAAA,CAAyC,KAAzC,CAAtB;AAEA,EAAA,0BAAA,CAAA,iCAAA,CAAkC,KAAlC;AAEA,SAAO,uBAAA,CAAA,8BAAA,CAA+B,KAA/B,EAAsC,aAAtC,CAAP;AACD,CAPyE,CAA7D;AASb,OAAA,CAAA,eAAA,CAAgB,WAAhB,GAA8B,iBAA9B","sourceRoot":""}
|
|
@@ -1,7 +1,5 @@
|
|
|
1
|
-
import
|
|
2
|
-
import type {
|
|
3
|
-
import type { AccordionHeaderExpandIconProps } from './AccordionHeaderExpandIcon';
|
|
4
|
-
import type { ARIAButtonShorthandProps } from '@fluentui/react-aria';
|
|
1
|
+
import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';
|
|
2
|
+
import type { ARIAButtonSlotProps } from '@fluentui/react-aria';
|
|
5
3
|
export declare type AccordionHeaderSize = 'small' | 'medium' | 'large' | 'extra-large';
|
|
6
4
|
export declare type AccordionHeaderExpandIconPosition = 'start' | 'end';
|
|
7
5
|
export declare type AccordionHeaderContextValue = {
|
|
@@ -14,22 +12,24 @@ export declare type AccordionHeaderContextValues = {
|
|
|
14
12
|
accordionHeader: AccordionHeaderContextValue;
|
|
15
13
|
};
|
|
16
14
|
export declare type AccordionHeaderSlots = {
|
|
17
|
-
|
|
15
|
+
/**
|
|
16
|
+
* The element wrapping the button. By default this is a div, but can be a heading.
|
|
17
|
+
*/
|
|
18
|
+
root: Slot<'div', 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6'>;
|
|
18
19
|
/**
|
|
19
20
|
* The component to be used as button in heading
|
|
20
21
|
*/
|
|
21
|
-
button:
|
|
22
|
+
button: NonNullable<Slot<ARIAButtonSlotProps>>;
|
|
22
23
|
/**
|
|
23
24
|
* Expand icon slot rendered before (or after) children content in heading
|
|
24
25
|
*/
|
|
25
|
-
expandIcon:
|
|
26
|
+
expandIcon: Slot<'span'>;
|
|
26
27
|
/**
|
|
27
28
|
* Expand icon slot rendered before (or after) children content in heading
|
|
28
29
|
*/
|
|
29
|
-
icon?:
|
|
30
|
-
children: ObjectShorthandProps<React.HTMLAttributes<HTMLElement>>;
|
|
30
|
+
icon?: Slot<'div'>;
|
|
31
31
|
};
|
|
32
|
-
|
|
32
|
+
declare type AccordionHeaderCommons = {
|
|
33
33
|
/**
|
|
34
34
|
* Size of spacing in the heading
|
|
35
35
|
*/
|
|
@@ -43,5 +43,6 @@ export declare type AccordionHeaderCommons = {
|
|
|
43
43
|
*/
|
|
44
44
|
inline: boolean;
|
|
45
45
|
};
|
|
46
|
-
export declare type AccordionHeaderProps = ComponentProps<AccordionHeaderSlots
|
|
46
|
+
export declare type AccordionHeaderProps = ComponentProps<Partial<AccordionHeaderSlots>> & Partial<AccordionHeaderCommons>;
|
|
47
47
|
export declare type AccordionHeaderState = ComponentState<AccordionHeaderSlots> & AccordionHeaderCommons & AccordionHeaderContextValue;
|
|
48
|
+
export {};
|
|
@@ -8,8 +8,6 @@ const tslib_1 = /*#__PURE__*/require("tslib");
|
|
|
8
8
|
|
|
9
9
|
tslib_1.__exportStar(require("./AccordionHeader"), exports);
|
|
10
10
|
|
|
11
|
-
tslib_1.__exportStar(require("./AccordionHeaderExpandIcon"), exports);
|
|
12
|
-
|
|
13
11
|
tslib_1.__exportStar(require("./AccordionHeader.types"), exports);
|
|
14
12
|
|
|
15
13
|
tslib_1.__exportStar(require("./renderAccordionHeader"), exports);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/AccordionHeader/index.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,mBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,
|
|
1
|
+
{"version":3,"sources":["../../../src/components/AccordionHeader/index.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,mBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,yBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,yBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,sBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,mCAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,4BAAA,CAAA,EAAA,OAAA","sourceRoot":""}
|
|
@@ -2,4 +2,4 @@ import type { AccordionHeaderState, AccordionHeaderContextValues } from './Accor
|
|
|
2
2
|
/**
|
|
3
3
|
* Function that renders the final JSX of the component
|
|
4
4
|
*/
|
|
5
|
-
export declare const
|
|
5
|
+
export declare const renderAccordionHeader_unstable: (state: AccordionHeaderState, contextValues: AccordionHeaderContextValues) => JSX.Element;
|
|
@@ -3,35 +3,32 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.
|
|
6
|
+
exports.renderAccordionHeader_unstable = void 0;
|
|
7
7
|
|
|
8
8
|
const React = /*#__PURE__*/require("react");
|
|
9
9
|
|
|
10
10
|
const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
|
|
11
11
|
|
|
12
|
-
const useAccordionHeader_1 = /*#__PURE__*/require("./useAccordionHeader");
|
|
13
|
-
|
|
14
12
|
const AccordionHeaderContext_1 = /*#__PURE__*/require("./AccordionHeaderContext");
|
|
15
13
|
/**
|
|
16
14
|
* Function that renders the final JSX of the component
|
|
17
15
|
*/
|
|
18
16
|
|
|
19
17
|
|
|
20
|
-
const
|
|
18
|
+
const renderAccordionHeader_unstable = (state, contextValues) => {
|
|
21
19
|
const {
|
|
22
20
|
slots,
|
|
23
21
|
slotProps
|
|
24
|
-
} = react_utilities_1.getSlots(state
|
|
22
|
+
} = react_utilities_1.getSlots(state);
|
|
25
23
|
return React.createElement(AccordionHeaderContext_1.AccordionHeaderContext.Provider, {
|
|
26
24
|
value: contextValues.accordionHeader
|
|
27
25
|
}, React.createElement(slots.root, { ...slotProps.root
|
|
28
26
|
}, React.createElement(slots.button, { ...slotProps.button
|
|
29
27
|
}, state.expandIconPosition === 'start' && React.createElement(slots.expandIcon, { ...slotProps.expandIcon
|
|
30
|
-
}), React.createElement(slots.icon, { ...slotProps.icon
|
|
31
|
-
}), React.createElement(slots.
|
|
32
|
-
}), state.expandIconPosition === 'end' && React.createElement(slots.expandIcon, { ...slotProps.expandIcon
|
|
28
|
+
}), slots.icon && React.createElement(slots.icon, { ...slotProps.icon
|
|
29
|
+
}), slotProps.root.children, state.expandIconPosition === 'end' && React.createElement(slots.expandIcon, { ...slotProps.expandIcon
|
|
33
30
|
}))));
|
|
34
31
|
};
|
|
35
32
|
|
|
36
|
-
exports.
|
|
33
|
+
exports.renderAccordionHeader_unstable = renderAccordionHeader_unstable;
|
|
37
34
|
//# sourceMappingURL=renderAccordionHeader.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/AccordionHeader/renderAccordionHeader.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;;AACA,MAAA,
|
|
1
|
+
{"version":3,"sources":["../../../src/components/AccordionHeader/renderAccordionHeader.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;;AACA,MAAA,wBAAA,gBAAA,OAAA,CAAA,0BAAA,CAAA;AAGA;;AAEG;;;AACI,MAAM,8BAA8B,GAAG,CAC5C,KAD4C,EAE5C,aAF4C,KAG1C;AACF,QAAM;AAAE,IAAA,KAAF;AAAS,IAAA;AAAT,MAAuB,iBAAA,CAAA,QAAA,CAA+B,KAA/B,CAA7B;AAEA,SACE,KAAA,CAAA,aAAA,CAAC,wBAAA,CAAA,sBAAA,CAAuB,QAAxB,EAAgC;AAAC,IAAA,KAAK,EAAE,aAAa,CAAC;AAAtB,GAAhC,EACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;AAAf,GAAX,EACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,MAAP,EAAa,EAAA,GAAK,SAAS,CAAC;AAAf,GAAb,EACG,KAAK,CAAC,kBAAN,KAA6B,OAA7B,IAAwC,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,UAAP,EAAiB,EAAA,GAAK,SAAS,CAAC;AAAf,GAAjB,CAD3C,EAEG,KAAK,CAAC,IAAN,IAAc,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;AAAf,GAAX,CAFjB,EAGG,SAAS,CAAC,IAAV,CAAe,QAHlB,EAIG,KAAK,CAAC,kBAAN,KAA6B,KAA7B,IAAsC,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,UAAP,EAAiB,EAAA,GAAK,SAAS,CAAC;AAAf,GAAjB,CAJzC,CADF,CADF,CADF;AAYD,CAlBM;;AAAM,OAAA,CAAA,8BAAA,GAA8B,8BAA9B","sourceRoot":""}
|
|
@@ -1,12 +1,8 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
import type { AccordionHeaderProps, AccordionHeaderState
|
|
3
|
-
/**
|
|
4
|
-
* Const listing which props are shorthand props.
|
|
5
|
-
*/
|
|
6
|
-
export declare const accordionHeaderShorthandProps: Array<keyof AccordionHeaderSlots>;
|
|
2
|
+
import type { AccordionHeaderProps, AccordionHeaderState } from './AccordionHeader.types';
|
|
7
3
|
/**
|
|
8
4
|
* Returns the props and state required to render the component
|
|
9
5
|
* @param props - AccordionHeader properties
|
|
10
6
|
* @param ref - reference to root HTMLElement of AccordionHeader
|
|
11
7
|
*/
|
|
12
|
-
export declare const
|
|
8
|
+
export declare const useAccordionHeader_unstable: (props: AccordionHeaderProps, ref: React.Ref<HTMLElement>) => AccordionHeaderState;
|
|
@@ -3,36 +3,35 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.
|
|
6
|
+
exports.useAccordionHeader_unstable = void 0;
|
|
7
|
+
|
|
8
|
+
const React = /*#__PURE__*/require("react");
|
|
7
9
|
|
|
8
10
|
const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
|
|
9
11
|
|
|
10
12
|
const index_1 = /*#__PURE__*/require("../AccordionItem/index");
|
|
11
13
|
|
|
12
|
-
const AccordionHeaderExpandIcon_1 = /*#__PURE__*/require("./AccordionHeaderExpandIcon");
|
|
13
|
-
|
|
14
14
|
const react_aria_1 = /*#__PURE__*/require("@fluentui/react-aria");
|
|
15
15
|
|
|
16
16
|
const react_context_selector_1 = /*#__PURE__*/require("@fluentui/react-context-selector");
|
|
17
17
|
|
|
18
18
|
const AccordionContext_1 = /*#__PURE__*/require("../Accordion/AccordionContext");
|
|
19
|
-
/**
|
|
20
|
-
* Const listing which props are shorthand props.
|
|
21
|
-
*/
|
|
22
19
|
|
|
20
|
+
const react_icons_1 = /*#__PURE__*/require("@fluentui/react-icons");
|
|
23
21
|
|
|
24
|
-
|
|
22
|
+
const react_shared_contexts_1 = /*#__PURE__*/require("@fluentui/react-shared-contexts");
|
|
25
23
|
/**
|
|
26
24
|
* Returns the props and state required to render the component
|
|
27
25
|
* @param props - AccordionHeader properties
|
|
28
26
|
* @param ref - reference to root HTMLElement of AccordionHeader
|
|
29
27
|
*/
|
|
30
28
|
|
|
31
|
-
|
|
29
|
+
|
|
30
|
+
const useAccordionHeader_unstable = (props, ref) => {
|
|
32
31
|
const {
|
|
32
|
+
as,
|
|
33
33
|
icon,
|
|
34
34
|
button,
|
|
35
|
-
children,
|
|
36
35
|
expandIcon,
|
|
37
36
|
inline = false,
|
|
38
37
|
size = 'medium',
|
|
@@ -42,13 +41,27 @@ const useAccordionHeader = (props, ref) => {
|
|
|
42
41
|
onHeaderClick: onAccordionHeaderClick,
|
|
43
42
|
disabled,
|
|
44
43
|
open
|
|
45
|
-
} = index_1.
|
|
44
|
+
} = index_1.useAccordionItemContext_unstable();
|
|
46
45
|
/**
|
|
47
46
|
* force disabled state on button if accordion isn't collapsible
|
|
48
47
|
* and this is the only item opened
|
|
49
48
|
*/
|
|
50
49
|
|
|
51
50
|
const disabledFocusable = react_context_selector_1.useContextSelector(AccordionContext_1.AccordionContext, ctx => !ctx.collapsible && ctx.openItems.length === 1 && open);
|
|
51
|
+
const {
|
|
52
|
+
dir
|
|
53
|
+
} = react_shared_contexts_1.useFluent(); // Calculate how to rotate the expand icon [>] (ChevronRightRegular)
|
|
54
|
+
|
|
55
|
+
let expandIconRotation;
|
|
56
|
+
|
|
57
|
+
if (expandIconPosition === 'end') {
|
|
58
|
+
// If expand icon is at the end, the chevron points up [^] when open, and down [v] when closed
|
|
59
|
+
expandIconRotation = open ? -90 : 90;
|
|
60
|
+
} else {
|
|
61
|
+
// Otherwise, the chevron points down [v] when open, and right [>] (or left [<] in RTL) when closed
|
|
62
|
+
expandIconRotation = open ? 90 : dir !== 'rtl' ? 0 : 180;
|
|
63
|
+
}
|
|
64
|
+
|
|
52
65
|
const buttonShorthand = react_aria_1.useARIAButton(button, {
|
|
53
66
|
required: true,
|
|
54
67
|
defaultProps: {
|
|
@@ -66,19 +79,20 @@ const useAccordionHeader = (props, ref) => {
|
|
|
66
79
|
components: {
|
|
67
80
|
root: 'div',
|
|
68
81
|
button: 'button',
|
|
69
|
-
expandIcon:
|
|
70
|
-
icon: 'div'
|
|
71
|
-
children: 'div'
|
|
82
|
+
expandIcon: 'span',
|
|
83
|
+
icon: 'div'
|
|
72
84
|
},
|
|
73
|
-
root: react_utilities_1.getNativeElementProps('div', {
|
|
85
|
+
root: react_utilities_1.getNativeElementProps(as || 'div', {
|
|
74
86
|
ref,
|
|
75
|
-
role: 'heading',
|
|
76
87
|
...props
|
|
77
88
|
}),
|
|
78
89
|
icon: react_utilities_1.resolveShorthand(icon),
|
|
79
90
|
expandIcon: react_utilities_1.resolveShorthand(expandIcon, {
|
|
80
91
|
required: true,
|
|
81
92
|
defaultProps: {
|
|
93
|
+
children: React.createElement(react_icons_1.ChevronRightRegular, {
|
|
94
|
+
transform: `rotate(${expandIconRotation})`
|
|
95
|
+
}),
|
|
82
96
|
'aria-hidden': true
|
|
83
97
|
}
|
|
84
98
|
}),
|
|
@@ -92,12 +106,9 @@ const useAccordionHeader = (props, ref) => {
|
|
|
92
106
|
onAccordionHeaderClick(ev);
|
|
93
107
|
}
|
|
94
108
|
})
|
|
95
|
-
}
|
|
96
|
-
children: react_utilities_1.resolveShorthand(children, {
|
|
97
|
-
required: true
|
|
98
|
-
})
|
|
109
|
+
}
|
|
99
110
|
};
|
|
100
111
|
};
|
|
101
112
|
|
|
102
|
-
exports.
|
|
113
|
+
exports.useAccordionHeader_unstable = useAccordionHeader_unstable;
|
|
103
114
|
//# sourceMappingURL=useAccordionHeader.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/AccordionHeader/useAccordionHeader.
|
|
1
|
+
{"version":3,"sources":["../../../src/components/AccordionHeader/useAccordionHeader.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;;AACA,MAAA,OAAA,gBAAA,OAAA,CAAA,wBAAA,CAAA;;AACA,MAAA,YAAA,gBAAA,OAAA,CAAA,sBAAA,CAAA;;AAEA,MAAA,wBAAA,gBAAA,OAAA,CAAA,kCAAA,CAAA;;AACA,MAAA,kBAAA,gBAAA,OAAA,CAAA,+BAAA,CAAA;;AACA,MAAA,aAAA,gBAAA,OAAA,CAAA,uBAAA,CAAA;;AACA,MAAA,uBAAA,gBAAA,OAAA,CAAA,iCAAA,CAAA;AAEA;;;;AAIG;;;AACI,MAAM,2BAA2B,GAAG,CACzC,KADyC,EAEzC,GAFyC,KAGjB;AACxB,QAAM;AAAE,IAAA,EAAF;AAAM,IAAA,IAAN;AAAY,IAAA,MAAZ;AAAoB,IAAA,UAApB;AAAgC,IAAA,MAAM,GAAG,KAAzC;AAAgD,IAAA,IAAI,GAAG,QAAvD;AAAiE,IAAA,kBAAkB,GAAG;AAAtF,MAAkG,KAAxG;AACA,QAAM;AAAE,IAAA,aAAa,EAAE,sBAAjB;AAAyC,IAAA,QAAzC;AAAmD,IAAA;AAAnD,MAA4D,OAAA,CAAA,gCAAA,EAAlE;AAEA;;;AAGG;;AACH,QAAM,iBAAiB,GAAG,wBAAA,CAAA,kBAAA,CACxB,kBAAA,CAAA,gBADwB,EAExB,GAAG,IAAI,CAAC,GAAG,CAAC,WAAL,IAAoB,GAAG,CAAC,SAAJ,CAAc,MAAd,KAAyB,CAA7C,IAAkD,IAFjC,CAA1B;AAKA,QAAM;AAAE,IAAA;AAAF,MAAU,uBAAA,CAAA,SAAA,EAAhB,CAbwB,CAexB;;AACA,MAAI,kBAAJ;;AACA,MAAI,kBAAkB,KAAK,KAA3B,EAAkC;AAChC;AACA,IAAA,kBAAkB,GAAG,IAAI,GAAG,CAAC,EAAJ,GAAS,EAAlC;AACD,GAHD,MAGO;AACL;AACA,IAAA,kBAAkB,GAAG,IAAI,GAAG,EAAH,GAAQ,GAAG,KAAK,KAAR,GAAgB,CAAhB,GAAoB,GAArD;AACD;;AAED,QAAM,eAAe,GAAG,YAAA,CAAA,aAAA,CAAc,MAAd,EAAsB;AAC5C,IAAA,QAAQ,EAAE,IADkC;AAE5C,IAAA,YAAY,EAAE;AACZ,MAAA,QADY;AAEZ,MAAA,iBAFY;AAGZ,uBAAiB;AAHL;AAF8B,GAAtB,CAAxB;AASA,SAAO;AACL,IAAA,QADK;AAEL,IAAA,IAFK;AAGL,IAAA,IAHK;AAIL,IAAA,MAJK;AAKL,IAAA,kBALK;AAML,IAAA,UAAU,EAAE;AACV,MAAA,IAAI,EAAE,KADI;AAEV,MAAA,MAAM,EAAE,QAFE;AAGV,MAAA,UAAU,EAAE,MAHF;AAIV,MAAA,IAAI,EAAE;AAJI,KANP;AAYL,IAAA,IAAI,EAAE,iBAAA,CAAA,qBAAA,CAAsB,EAAE,IAAI,KAA5B,EAAmC;AACvC,MAAA,GADuC;AAEvC,SAAG;AAFoC,KAAnC,CAZD;AAgBL,IAAA,IAAI,EAAE,iBAAA,CAAA,gBAAA,CAAiB,IAAjB,CAhBD;AAiBL,IAAA,UAAU,EAAE,iBAAA,CAAA,gBAAA,CAAiB,UAAjB,EAA6B;AACvC,MAAA,QAAQ,EAAE,IAD6B;AAEvC,MAAA,YAAY,EAAE;AACZ,QAAA,QAAQ,EAAE,KAAA,CAAA,aAAA,CAAC,aAAA,CAAA,mBAAD,EAAoB;AAAC,UAAA,SAAS,EAAE,UAAU,kBAAkB;AAAxC,SAApB,CADE;AAEZ,uBAAe;AAFH;AAFyB,KAA7B,CAjBP;AAwBL,IAAA,MAAM,EAAE,EACN,GAAG,eADG;AAEN,MAAA,OAAO,EAAE,iBAAA,CAAA,gBAAA,CACN,EAAD,IAAmG;;;AACjG,SAAA,EAAA,GAAA,eAAe,CAAC,OAAhB,MAAuB,IAAvB,IAAuB,EAAA,KAAA,KAAA,CAAvB,GAAuB,KAAA,CAAvB,GAAuB,EAAA,CAAA,IAAA,CAAvB,eAAuB,EAAG,EAAH,CAAvB;;AACA,YAAI,CAAC,EAAE,CAAC,gBAAR,EAA0B;AACxB,UAAA,sBAAsB,CAAC,EAAD,CAAtB;AACD;AACF,OANM;AAFH;AAxBH,GAAP;AAoCD,CAzEM;;AAAM,OAAA,CAAA,2BAAA,GAA2B,2BAA3B","sourceRoot":""}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
import type { AccordionHeaderState, AccordionHeaderContextValues } from './AccordionHeader.types';
|
|
2
|
-
export declare function
|
|
2
|
+
export declare function useAccordionHeaderContextValues_unstable(state: AccordionHeaderState): AccordionHeaderContextValues;
|