@fluentui/react-accordion 9.0.11 → 9.0.13
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 +69 -1
- package/CHANGELOG.md +25 -2
- package/lib-amd/Accordion.js +6 -0
- package/lib-amd/Accordion.js.map +1 -0
- package/lib-amd/AccordionHeader.js +6 -0
- package/lib-amd/AccordionHeader.js.map +1 -0
- package/lib-amd/AccordionItem.js +6 -0
- package/lib-amd/AccordionItem.js.map +1 -0
- package/lib-amd/AccordionPanel.js +6 -0
- package/lib-amd/AccordionPanel.js.map +1 -0
- package/lib-amd/components/Accordion/Accordion.js +16 -0
- package/lib-amd/components/Accordion/Accordion.js.map +1 -0
- package/lib-amd/components/Accordion/Accordion.types.js +5 -0
- package/lib-amd/components/Accordion/Accordion.types.js.map +1 -0
- package/lib-amd/components/Accordion/AccordionContext.js +22 -0
- package/lib-amd/components/Accordion/AccordionContext.js.map +1 -0
- package/lib-amd/components/Accordion/index.js +12 -0
- package/lib-amd/components/Accordion/index.js.map +1 -0
- package/lib-amd/components/Accordion/renderAccordion.js +15 -0
- package/lib-amd/components/Accordion/renderAccordion.js.map +1 -0
- package/lib-amd/components/Accordion/useAccordion.js +83 -0
- package/lib-amd/components/Accordion/useAccordion.js.map +1 -0
- package/lib-amd/components/Accordion/useAccordionContextValues.js +18 -0
- package/lib-amd/components/Accordion/useAccordionContextValues.js.map +1 -0
- package/lib-amd/components/Accordion/useAccordionStyles.js +14 -0
- package/lib-amd/components/Accordion/useAccordionStyles.js.map +1 -0
- package/lib-amd/components/AccordionHeader/AccordionHeader.js +17 -0
- package/lib-amd/components/AccordionHeader/AccordionHeader.js.map +1 -0
- package/lib-amd/components/AccordionHeader/AccordionHeader.types.js +5 -0
- package/lib-amd/components/AccordionHeader/AccordionHeader.types.js.map +1 -0
- package/lib-amd/components/AccordionHeader/AccordionHeaderContext.js +15 -0
- package/lib-amd/components/AccordionHeader/AccordionHeaderContext.js.map +1 -0
- package/lib-amd/components/AccordionHeader/index.js +11 -0
- package/lib-amd/components/AccordionHeader/index.js.map +1 -0
- package/lib-amd/components/AccordionHeader/renderAccordionHeader.js +20 -0
- package/lib-amd/components/AccordionHeader/renderAccordionHeader.js.map +1 -0
- package/lib-amd/components/AccordionHeader/useAccordionHeader.js +70 -0
- package/lib-amd/components/AccordionHeader/useAccordionHeader.js.map +1 -0
- package/lib-amd/components/AccordionHeader/useAccordionHeaderContextValues.js +17 -0
- package/lib-amd/components/AccordionHeader/useAccordionHeaderContextValues.js.map +1 -0
- package/lib-amd/components/AccordionHeader/useAccordionHeaderStyles.js +87 -0
- package/lib-amd/components/AccordionHeader/useAccordionHeaderStyles.js.map +1 -0
- package/lib-amd/components/AccordionItem/AccordionItem.js +16 -0
- package/lib-amd/components/AccordionItem/AccordionItem.js.map +1 -0
- package/lib-amd/components/AccordionItem/AccordionItem.types.js +5 -0
- package/lib-amd/components/AccordionItem/AccordionItem.types.js.map +1 -0
- package/lib-amd/components/AccordionItem/AccordionItemContext.js +17 -0
- package/lib-amd/components/AccordionItem/AccordionItemContext.js.map +1 -0
- package/lib-amd/components/AccordionItem/index.js +12 -0
- package/lib-amd/components/AccordionItem/index.js.map +1 -0
- package/lib-amd/components/AccordionItem/renderAccordionItem.js +15 -0
- package/lib-amd/components/AccordionItem/renderAccordionItem.js.map +1 -0
- package/lib-amd/components/AccordionItem/useAccordionItem.js +30 -0
- package/lib-amd/components/AccordionItem/useAccordionItem.js.map +1 -0
- package/lib-amd/components/AccordionItem/useAccordionItemContextValues.js +16 -0
- package/lib-amd/components/AccordionItem/useAccordionItemContextValues.js.map +1 -0
- package/lib-amd/components/AccordionItem/useAccordionItemStyles.js +14 -0
- package/lib-amd/components/AccordionItem/useAccordionItemStyles.js.map +1 -0
- package/lib-amd/components/AccordionPanel/AccordionPanel.js +15 -0
- package/lib-amd/components/AccordionPanel/AccordionPanel.js.map +1 -0
- package/lib-amd/components/AccordionPanel/AccordionPanel.types.js +5 -0
- package/lib-amd/components/AccordionPanel/AccordionPanel.types.js.map +1 -0
- package/lib-amd/components/AccordionPanel/index.js +10 -0
- package/lib-amd/components/AccordionPanel/index.js.map +1 -0
- package/lib-amd/components/AccordionPanel/renderAccordionPanel.js +14 -0
- package/lib-amd/components/AccordionPanel/renderAccordionPanel.js.map +1 -0
- package/lib-amd/components/AccordionPanel/useAccordionPanel.js +24 -0
- package/lib-amd/components/AccordionPanel/useAccordionPanel.js.map +1 -0
- package/lib-amd/components/AccordionPanel/useAccordionPanelStyles.js +22 -0
- package/lib-amd/components/AccordionPanel/useAccordionPanelStyles.js.map +1 -0
- package/lib-amd/index.js +33 -0
- package/lib-amd/index.js.map +1 -0
- package/package.json +7 -7
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useAccordionHeader.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-accordion/src/components/AccordionHeader/useAccordionHeader.tsx"],"names":[],"mappings":";;;;IASA;;;;OAIG;IACI,IAAM,2BAA2B,GAAG,UACzC,KAA2B,EAC3B,GAA2B;QAEnB,IAAA,EAAE,GAA8F,KAAK,GAAnG,EAAE,IAAI,GAAwF,KAAK,KAA7F,EAAE,MAAM,GAAgF,KAAK,OAArF,EAAE,UAAU,GAAoE,KAAK,WAAzE,EAAE,KAAkE,KAAK,OAAzD,EAAd,MAAM,mBAAG,KAAK,KAAA,EAAE,KAAkD,KAAK,KAAxC,EAAf,IAAI,mBAAG,QAAQ,KAAA,EAAE,KAAiC,KAAK,mBAAV,EAA5B,kBAAkB,mBAAG,OAAO,KAAA,CAAW;QACxG,IAAA,KAA4D,wCAAgC,EAAE,EAA7E,sBAAsB,mBAAA,EAAE,QAAQ,cAAA,EAAE,IAAI,UAAuC,CAAC;QAErG;;;WAGG;QACH,IAAM,iBAAiB,GAAG,+CAA4B,CAAC,UAAA,GAAG,IAAI,OAAA,CAAC,GAAG,CAAC,WAAW,IAAI,GAAG,CAAC,SAAS,CAAC,MAAM,KAAK,CAAC,IAAI,IAAI,EAAtD,CAAsD,CAAC,CAAC;QAE9G,IAAA,GAAG,GAAK,0CAAS,EAAE,IAAhB,CAAiB;QAE5B,oEAAoE;QACpE,IAAI,kBAAsC,CAAC;QAC3C,IAAI,kBAAkB,KAAK,KAAK,EAAE;YAChC,8FAA8F;YAC9F,kBAAkB,GAAG,IAAI,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;SACtC;aAAM;YACL,mGAAmG;YACnG,kBAAkB,GAAG,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,GAAG,KAAK,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC;SAC1D;QAED,IAAM,eAAe,GAAG,mCAAsB,CAAC,MAAM,EAAE;YACrD,QAAQ,EAAE,IAAI;YACd,YAAY,EAAE;gBACZ,QAAQ,UAAA;gBACR,iBAAiB,mBAAA;gBACjB,eAAe,EAAE,IAAI;gBACrB,IAAI,EAAE,QAAQ;aACf;SACF,CAAC,CAAC;QAEH,OAAO;YACL,QAAQ,UAAA;YACR,IAAI,MAAA;YACJ,IAAI,MAAA;YACJ,MAAM,QAAA;YACN,kBAAkB,oBAAA;YAClB,UAAU,EAAE;gBACV,IAAI,EAAE,KAAK;gBACX,MAAM,EAAE,QAAQ;gBAChB,UAAU,EAAE,MAAM;gBAClB,IAAI,EAAE,KAAK;aACZ;YACD,IAAI,EAAE,uCAAqB,CAAC,EAAE,IAAI,KAAK,qBACrC,GAAG,KAAA,IACA,KAAK,EACR;YACF,IAAI,EAAE,kCAAgB,CAAC,IAAI,CAAC;YAC5B,UAAU,EAAE,kCAAgB,CAAC,UAAU,EAAE;gBACvC,QAAQ,EAAE,IAAI;gBACd,YAAY,EAAE;oBACZ,QAAQ,EAAE,oBAAC,iCAAmB,IAAC,KAAK,EAAE,EAAE,SAAS,EAAE,YAAU,kBAAkB,SAAM,EAAE,GAAI;oBAC3F,aAAa,EAAE,IAAI;iBACpB;aACF,CAAC;YACF,MAAM,wCACD,eAAe,KAClB,OAAO,EAAE,kCAAgB,CACvB,UAAC,EAA8F;;oBAC7F,MAAA,eAAe,CAAC,OAAO,+CAAvB,eAAe,EAAW,EAAE,CAAC,CAAC;oBAC9B,IAAI,CAAC,EAAE,CAAC,gBAAgB,EAAE;wBACxB,sBAAsB,CAAC,EAAE,CAAC,CAAC;qBAC5B;gBACH,CAAC,CACF,GACF;SACF,CAAC;IACJ,CAAC,CAAC;IAvEW,QAAA,2BAA2B,+BAuEtC","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 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 const buttonShorthand = useARIAButtonShorthand(button, {\n required: true,\n defaultProps: {\n disabled,\n disabledFocusable,\n 'aria-expanded': open,\n type: 'button',\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 style={{ transform: `rotate(${expandIconRotation}deg)` }} />,\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"]}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
define(["require", "exports", "react"], function (require, exports, React) {
|
|
2
|
+
"use strict";
|
|
3
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
4
|
+
exports.useAccordionHeaderContextValues_unstable = void 0;
|
|
5
|
+
function useAccordionHeaderContextValues_unstable(state) {
|
|
6
|
+
var disabled = state.disabled, expandIconPosition = state.expandIconPosition, open = state.open, size = state.size;
|
|
7
|
+
var accordionHeader = React.useMemo(function () { return ({
|
|
8
|
+
disabled: disabled,
|
|
9
|
+
expandIconPosition: expandIconPosition,
|
|
10
|
+
open: open,
|
|
11
|
+
size: size,
|
|
12
|
+
}); }, [disabled, expandIconPosition, open, size]);
|
|
13
|
+
return { accordionHeader: accordionHeader };
|
|
14
|
+
}
|
|
15
|
+
exports.useAccordionHeaderContextValues_unstable = useAccordionHeaderContextValues_unstable;
|
|
16
|
+
});
|
|
17
|
+
//# sourceMappingURL=useAccordionHeaderContextValues.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useAccordionHeaderContextValues.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-accordion/src/components/AccordionHeader/useAccordionHeaderContextValues.ts"],"names":[],"mappings":";;;;IAOA,SAAgB,wCAAwC,CAAC,KAA2B;QAC1E,IAAA,QAAQ,GAAqC,KAAK,SAA1C,EAAE,kBAAkB,GAAiB,KAAK,mBAAtB,EAAE,IAAI,GAAW,KAAK,KAAhB,EAAE,IAAI,GAAK,KAAK,KAAV,CAAW;QAE3D,IAAM,eAAe,GAAG,KAAK,CAAC,OAAO,CACnC,cAAM,OAAA,CAAC;YACL,QAAQ,UAAA;YACR,kBAAkB,oBAAA;YAClB,IAAI,MAAA;YACJ,IAAI,MAAA;SACL,CAAC,EALI,CAKJ,EACF,CAAC,QAAQ,EAAE,kBAAkB,EAAE,IAAI,EAAE,IAAI,CAAC,CAC3C,CAAC;QAEF,OAAO,EAAE,eAAe,iBAAA,EAAE,CAAC;IAC7B,CAAC;IAdD,4FAcC","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"]}
|
|
@@ -0,0 +1,87 @@
|
|
|
1
|
+
define(["require", "exports", "tslib", "@griffel/react", "@fluentui/react-tabster", "@fluentui/react-theme"], function (require, exports, tslib_1, react_1, react_tabster_1, react_theme_1) {
|
|
2
|
+
"use strict";
|
|
3
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
4
|
+
exports.useAccordionHeaderStyles_unstable = exports.accordionHeaderClassNames = void 0;
|
|
5
|
+
exports.accordionHeaderClassNames = {
|
|
6
|
+
root: 'fui-AccordionHeader',
|
|
7
|
+
button: 'fui-AccordionHeader__button',
|
|
8
|
+
expandIcon: 'fui-AccordionHeader__expandIcon',
|
|
9
|
+
icon: 'fui-AccordionHeader__icon',
|
|
10
|
+
};
|
|
11
|
+
var useStyles = react_1.makeStyles({
|
|
12
|
+
// TODO: this should be extracted to another package
|
|
13
|
+
resetButton: tslib_1.__assign(tslib_1.__assign(tslib_1.__assign({ boxSizing: 'content-box', backgroundColor: 'inherit', color: 'inherit', fontFamily: 'inherit', fontSize: 'inherit', lineHeight: 'normal' }, react_1.shorthands.overflow('visible')), react_1.shorthands.padding(0)), { WebkitAppearance: 'button', textAlign: 'unset' }),
|
|
14
|
+
focusIndicator: react_tabster_1.createFocusOutlineStyle(),
|
|
15
|
+
root: tslib_1.__assign(tslib_1.__assign({ color: react_theme_1.tokens.colorNeutralForeground1, backgroundColor: react_theme_1.tokens.colorTransparentBackground }, react_1.shorthands.margin(0)), react_1.shorthands.borderRadius(react_theme_1.tokens.borderRadiusMedium)),
|
|
16
|
+
rootDisabled: {
|
|
17
|
+
backgroundImage: 'none',
|
|
18
|
+
color: react_theme_1.tokens.colorNeutralForegroundDisabled,
|
|
19
|
+
},
|
|
20
|
+
rootInline: {
|
|
21
|
+
display: 'inline-block',
|
|
22
|
+
},
|
|
23
|
+
button: tslib_1.__assign(tslib_1.__assign(tslib_1.__assign(tslib_1.__assign(tslib_1.__assign({ position: 'relative', width: '100%' }, react_1.shorthands.border('1px', 'solid', 'transparent')), react_1.shorthands.padding(0, react_theme_1.tokens.spacingHorizontalM, 0, react_theme_1.tokens.spacingHorizontalMNudge)), { height: '44px', display: 'flex', alignItems: 'center', cursor: 'pointer' }), react_theme_1.typographyStyles.body1), { boxSizing: 'border-box' }),
|
|
24
|
+
buttonSmall: {
|
|
25
|
+
height: '32px',
|
|
26
|
+
fontSize: react_theme_1.tokens.fontSizeBase200,
|
|
27
|
+
},
|
|
28
|
+
buttonLarge: {
|
|
29
|
+
lineHeight: react_theme_1.tokens.lineHeightBase400,
|
|
30
|
+
fontSize: react_theme_1.tokens.fontSizeBase400,
|
|
31
|
+
},
|
|
32
|
+
buttonExtraLarge: {
|
|
33
|
+
lineHeight: react_theme_1.tokens.lineHeightBase500,
|
|
34
|
+
fontSize: react_theme_1.tokens.fontSizeBase500,
|
|
35
|
+
},
|
|
36
|
+
buttonInline: {
|
|
37
|
+
display: 'inline-flex',
|
|
38
|
+
},
|
|
39
|
+
buttonExpandIconEndNoIcon: {
|
|
40
|
+
paddingLeft: react_theme_1.tokens.spacingHorizontalM,
|
|
41
|
+
},
|
|
42
|
+
buttonExpandIconEnd: {
|
|
43
|
+
paddingRight: react_theme_1.tokens.spacingHorizontalMNudge,
|
|
44
|
+
},
|
|
45
|
+
expandIcon: {
|
|
46
|
+
height: '100%',
|
|
47
|
+
display: 'flex',
|
|
48
|
+
alignItems: 'center',
|
|
49
|
+
lineHeight: react_theme_1.tokens.lineHeightBase500,
|
|
50
|
+
fontSize: react_theme_1.tokens.fontSizeBase500,
|
|
51
|
+
},
|
|
52
|
+
expandIconStart: {
|
|
53
|
+
paddingRight: react_theme_1.tokens.spacingHorizontalS,
|
|
54
|
+
},
|
|
55
|
+
expandIconEnd: {
|
|
56
|
+
flexGrow: 1,
|
|
57
|
+
flexShrink: 1,
|
|
58
|
+
flexBasis: '0%',
|
|
59
|
+
display: 'flex',
|
|
60
|
+
justifyContent: 'flex-end',
|
|
61
|
+
paddingLeft: react_theme_1.tokens.spacingHorizontalS,
|
|
62
|
+
},
|
|
63
|
+
icon: {
|
|
64
|
+
height: '100%',
|
|
65
|
+
display: 'flex',
|
|
66
|
+
alignItems: 'center',
|
|
67
|
+
paddingRight: react_theme_1.tokens.spacingHorizontalS,
|
|
68
|
+
lineHeight: react_theme_1.tokens.lineHeightBase500,
|
|
69
|
+
fontSize: react_theme_1.tokens.fontSizeBase500,
|
|
70
|
+
},
|
|
71
|
+
});
|
|
72
|
+
/** Applies style classnames to slots */
|
|
73
|
+
var useAccordionHeaderStyles_unstable = function (state) {
|
|
74
|
+
var styles = useStyles();
|
|
75
|
+
state.root.className = react_1.mergeClasses(exports.accordionHeaderClassNames.root, styles.root, state.inline && styles.rootInline, state.disabled && styles.rootDisabled, state.root.className);
|
|
76
|
+
state.button.className = react_1.mergeClasses(exports.accordionHeaderClassNames.button, styles.resetButton, styles.button, styles.focusIndicator, state.expandIconPosition === 'end' && !state.icon && styles.buttonExpandIconEndNoIcon, state.expandIconPosition === 'end' && styles.buttonExpandIconEnd, state.inline && styles.buttonInline, state.size === 'small' && styles.buttonSmall, state.size === 'large' && styles.buttonLarge, state.size === 'extra-large' && styles.buttonExtraLarge, state.button.className);
|
|
77
|
+
if (state.expandIcon) {
|
|
78
|
+
state.expandIcon.className = react_1.mergeClasses(exports.accordionHeaderClassNames.expandIcon, styles.expandIcon, state.expandIconPosition === 'start' && styles.expandIconStart, state.expandIconPosition === 'end' && styles.expandIconEnd, state.expandIcon.className);
|
|
79
|
+
}
|
|
80
|
+
if (state.icon) {
|
|
81
|
+
state.icon.className = react_1.mergeClasses(exports.accordionHeaderClassNames.icon, styles.icon, state.icon.className);
|
|
82
|
+
}
|
|
83
|
+
return state;
|
|
84
|
+
};
|
|
85
|
+
exports.useAccordionHeaderStyles_unstable = useAccordionHeaderStyles_unstable;
|
|
86
|
+
});
|
|
87
|
+
//# sourceMappingURL=useAccordionHeaderStyles.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useAccordionHeaderStyles.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-accordion/src/components/AccordionHeader/useAccordionHeaderStyles.ts"],"names":[],"mappings":"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","sourcesContent":["import { shorthands, makeStyles, mergeClasses } from '@griffel/react';\nimport { createFocusOutlineStyle } from '@fluentui/react-tabster';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport type { AccordionHeaderSlots, AccordionHeaderState } from './AccordionHeader.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const accordionHeaderClassNames: SlotClassNames<AccordionHeaderSlots> = {\n root: 'fui-AccordionHeader',\n button: 'fui-AccordionHeader__button',\n expandIcon: 'fui-AccordionHeader__expandIcon',\n icon: 'fui-AccordionHeader__icon',\n};\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 textAlign: 'unset',\n },\n focusIndicator: createFocusOutlineStyle(),\n root: {\n color: tokens.colorNeutralForeground1,\n backgroundColor: tokens.colorTransparentBackground,\n ...shorthands.margin(0),\n ...shorthands.borderRadius(tokens.borderRadiusMedium),\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: '100%',\n ...shorthands.border('1px', 'solid', 'transparent'),\n ...shorthands.padding(0, tokens.spacingHorizontalM, 0, tokens.spacingHorizontalMNudge),\n height: '44px',\n display: 'flex',\n alignItems: 'center',\n cursor: 'pointer',\n ...typographyStyles.body1,\n boxSizing: 'border-box',\n },\n buttonSmall: {\n height: '32px',\n fontSize: tokens.fontSizeBase200,\n },\n buttonLarge: {\n lineHeight: tokens.lineHeightBase400,\n fontSize: tokens.fontSizeBase400,\n },\n buttonExtraLarge: {\n lineHeight: tokens.lineHeightBase500,\n fontSize: tokens.fontSizeBase500,\n },\n buttonInline: {\n display: 'inline-flex',\n },\n buttonExpandIconEndNoIcon: {\n paddingLeft: tokens.spacingHorizontalM,\n },\n buttonExpandIconEnd: {\n paddingRight: tokens.spacingHorizontalMNudge,\n },\n expandIcon: {\n height: '100%',\n display: 'flex',\n alignItems: 'center',\n lineHeight: tokens.lineHeightBase500,\n fontSize: tokens.fontSizeBase500,\n },\n expandIconStart: {\n paddingRight: tokens.spacingHorizontalS,\n },\n expandIconEnd: {\n flexGrow: 1,\n flexShrink: 1,\n flexBasis: '0%',\n display: 'flex',\n justifyContent: 'flex-end',\n paddingLeft: tokens.spacingHorizontalS,\n },\n icon: {\n height: '100%',\n display: 'flex',\n alignItems: 'center',\n paddingRight: tokens.spacingHorizontalS,\n lineHeight: tokens.lineHeightBase500,\n fontSize: tokens.fontSizeBase500,\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 accordionHeaderClassNames.root,\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 accordionHeaderClassNames.button,\n styles.resetButton,\n styles.button,\n styles.focusIndicator,\n state.expandIconPosition === 'end' && !state.icon && styles.buttonExpandIconEndNoIcon,\n state.expandIconPosition === 'end' && styles.buttonExpandIconEnd,\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 accordionHeaderClassNames.expandIcon,\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(accordionHeaderClassNames.icon, styles.icon, state.icon.className);\n }\n return state;\n};\n"]}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
define(["require", "exports", "react", "./useAccordionItem", "./useAccordionItemContextValues", "./renderAccordionItem", "./useAccordionItemStyles"], function (require, exports, React, useAccordionItem_1, useAccordionItemContextValues_1, renderAccordionItem_1, useAccordionItemStyles_1) {
|
|
2
|
+
"use strict";
|
|
3
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
4
|
+
exports.AccordionItem = void 0;
|
|
5
|
+
/**
|
|
6
|
+
* Define a styled AccordionItem, using the `useAccordionItem_unstable` and `useAccordionItemStyles_unstable` hooks.
|
|
7
|
+
*/
|
|
8
|
+
exports.AccordionItem = React.forwardRef(function (props, ref) {
|
|
9
|
+
var state = useAccordionItem_1.useAccordionItem_unstable(props, ref);
|
|
10
|
+
var contextValues = useAccordionItemContextValues_1.useAccordionItemContextValues_unstable(state);
|
|
11
|
+
useAccordionItemStyles_1.useAccordionItemStyles_unstable(state);
|
|
12
|
+
return renderAccordionItem_1.renderAccordionItem_unstable(state, contextValues);
|
|
13
|
+
});
|
|
14
|
+
exports.AccordionItem.displayName = 'AccordionItem';
|
|
15
|
+
});
|
|
16
|
+
//# sourceMappingURL=AccordionItem.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AccordionItem.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-accordion/src/components/AccordionItem/AccordionItem.tsx"],"names":[],"mappings":";;;;IAQA;;OAEG;IACU,QAAA,aAAa,GAA4C,KAAK,CAAC,UAAU,CAAC,UAAC,KAAK,EAAE,GAAG;QAChG,IAAM,KAAK,GAAG,4CAAyB,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC;QACpD,IAAM,aAAa,GAAG,sEAAsC,CAAC,KAAK,CAAC,CAAC;QAEpE,wDAA+B,CAAC,KAAK,CAAC,CAAC;QAEvC,OAAO,kDAA4B,CAAC,KAAK,EAAE,aAAa,CAAC,CAAC;IAC5D,CAAC,CAAC,CAAC;IAEH,qBAAa,CAAC,WAAW,GAAG,eAAe,CAAC","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"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AccordionItem.types.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-accordion/src/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 = 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'>;\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"]}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
define(["require", "exports", "react"], function (require, exports, React) {
|
|
2
|
+
"use strict";
|
|
3
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
4
|
+
exports.useAccordionItemContext_unstable = exports.AccordionItemProvider = exports.AccordionItemContext = void 0;
|
|
5
|
+
exports.AccordionItemContext = React.createContext(undefined);
|
|
6
|
+
var accordionItemContextDefaultValue = {
|
|
7
|
+
onHeaderClick: function () {
|
|
8
|
+
/** */
|
|
9
|
+
},
|
|
10
|
+
open: false,
|
|
11
|
+
disabled: false,
|
|
12
|
+
};
|
|
13
|
+
exports.AccordionItemProvider = exports.AccordionItemContext.Provider;
|
|
14
|
+
var useAccordionItemContext_unstable = function () { var _a; return (_a = React.useContext(exports.AccordionItemContext)) !== null && _a !== void 0 ? _a : accordionItemContextDefaultValue; };
|
|
15
|
+
exports.useAccordionItemContext_unstable = useAccordionItemContext_unstable;
|
|
16
|
+
});
|
|
17
|
+
//# sourceMappingURL=AccordionItemContext.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AccordionItemContext.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-accordion/src/components/AccordionItem/AccordionItemContext.ts"],"names":[],"mappings":";;;;IAGa,QAAA,oBAAoB,GAAG,KAAK,CAAC,aAAa,CACrD,SAAS,CACkC,CAAC;IAE9C,IAAM,gCAAgC,GAA8B;QAClE,aAAa;YACX,MAAM;QACR,CAAC;QACD,IAAI,EAAE,KAAK;QACX,QAAQ,EAAE,KAAK;KAChB,CAAC;IAEW,QAAA,qBAAqB,GAAG,4BAAoB,CAAC,QAAQ,CAAC;IAE5D,IAAM,gCAAgC,GAAG,sBAC9C,OAAA,MAAA,KAAK,CAAC,UAAU,CAAC,4BAAoB,CAAC,mCAAI,gCAAgC,CAAA,EAAA,CAAC;IADhE,QAAA,gCAAgC,oCACgC","sourcesContent":["import * as React from 'react';\nimport type { AccordionItemContextValue } from './AccordionItem.types';\n\nexport const AccordionItemContext = React.createContext<AccordionItemContextValue | undefined>(\n undefined,\n) as React.Context<AccordionItemContextValue>;\n\nconst accordionItemContextDefaultValue: AccordionItemContextValue = {\n onHeaderClick() {\n /** */\n },\n open: false,\n disabled: false,\n};\n\nexport const AccordionItemProvider = AccordionItemContext.Provider;\n\nexport const useAccordionItemContext_unstable = () =>\n React.useContext(AccordionItemContext) ?? accordionItemContextDefaultValue;\n"]}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
define(["require", "exports", "tslib", "./AccordionItem", "./AccordionItem.types", "./renderAccordionItem", "./useAccordionItem", "./useAccordionItemContextValues", "./AccordionItemContext", "./useAccordionItemStyles"], function (require, exports, tslib_1, AccordionItem_1, AccordionItem_types_1, renderAccordionItem_1, useAccordionItem_1, useAccordionItemContextValues_1, AccordionItemContext_1, useAccordionItemStyles_1) {
|
|
2
|
+
"use strict";
|
|
3
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
4
|
+
tslib_1.__exportStar(AccordionItem_1, exports);
|
|
5
|
+
tslib_1.__exportStar(AccordionItem_types_1, exports);
|
|
6
|
+
tslib_1.__exportStar(renderAccordionItem_1, exports);
|
|
7
|
+
tslib_1.__exportStar(useAccordionItem_1, exports);
|
|
8
|
+
tslib_1.__exportStar(useAccordionItemContextValues_1, exports);
|
|
9
|
+
tslib_1.__exportStar(AccordionItemContext_1, exports);
|
|
10
|
+
tslib_1.__exportStar(useAccordionItemStyles_1, exports);
|
|
11
|
+
});
|
|
12
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-accordion/src/components/AccordionItem/index.ts"],"names":[],"mappings":";;;IAAA,+CAAgC;IAChC,qDAAsC;IACtC,qDAAsC;IACtC,kDAAmC;IACnC,+DAAgD;IAChD,sDAAuC;IACvC,wDAAyC","sourcesContent":["export * from './AccordionItem';\nexport * from './AccordionItem.types';\nexport * from './renderAccordionItem';\nexport * from './useAccordionItem';\nexport * from './useAccordionItemContextValues';\nexport * from './AccordionItemContext';\nexport * from './useAccordionItemStyles';\n"]}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
define(["require", "exports", "tslib", "react", "@fluentui/react-utilities", "./AccordionItemContext"], function (require, exports, tslib_1, React, react_utilities_1, AccordionItemContext_1) {
|
|
2
|
+
"use strict";
|
|
3
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
4
|
+
exports.renderAccordionItem_unstable = void 0;
|
|
5
|
+
/**
|
|
6
|
+
* Function that renders the final JSX of the component
|
|
7
|
+
*/
|
|
8
|
+
var renderAccordionItem_unstable = function (state, contextValues) {
|
|
9
|
+
var _a = react_utilities_1.getSlots(state), slots = _a.slots, slotProps = _a.slotProps;
|
|
10
|
+
return (React.createElement(slots.root, tslib_1.__assign({}, slotProps.root),
|
|
11
|
+
React.createElement(AccordionItemContext_1.AccordionItemContext.Provider, { value: contextValues.accordionItem }, slotProps.root.children)));
|
|
12
|
+
};
|
|
13
|
+
exports.renderAccordionItem_unstable = renderAccordionItem_unstable;
|
|
14
|
+
});
|
|
15
|
+
//# sourceMappingURL=renderAccordionItem.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"renderAccordionItem.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-accordion/src/components/AccordionItem/renderAccordionItem.tsx"],"names":[],"mappings":";;;;IAKA;;OAEG;IACI,IAAM,4BAA4B,GAAG,UAAC,KAAyB,EAAE,aAAyC;QACzG,IAAA,KAAuB,0BAAQ,CAAqB,KAAK,CAAC,EAAxD,KAAK,WAAA,EAAE,SAAS,eAAwC,CAAC;QAEjE,OAAO,CACL,oBAAC,KAAK,CAAC,IAAI,uBAAK,SAAS,CAAC,IAAI;YAC5B,oBAAC,2CAAoB,CAAC,QAAQ,IAAC,KAAK,EAAE,aAAa,CAAC,aAAa,IAC9D,SAAS,CAAC,IAAI,CAAC,QAAQ,CACM,CACrB,CACd,CAAC;IACJ,CAAC,CAAC;IAVW,QAAA,4BAA4B,gCAUvC","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"]}
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
define(["require", "exports", "tslib", "react", "@fluentui/react-utilities", "../Accordion/AccordionContext"], function (require, exports, tslib_1, React, react_utilities_1, AccordionContext_1) {
|
|
2
|
+
"use strict";
|
|
3
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
4
|
+
exports.useAccordionItem_unstable = void 0;
|
|
5
|
+
/**
|
|
6
|
+
* Returns the props and state required to render the component
|
|
7
|
+
* @param props - AccordionItem properties
|
|
8
|
+
* @param ref - reference to root HTMLElement of AccordionItem
|
|
9
|
+
*/
|
|
10
|
+
var useAccordionItem_unstable = function (props, ref) {
|
|
11
|
+
var value = props.value, _a = props.disabled, disabled = _a === void 0 ? false : _a;
|
|
12
|
+
var requestToggle = AccordionContext_1.useAccordionContext_unstable(function (ctx) { return ctx.requestToggle; });
|
|
13
|
+
var open = AccordionContext_1.useAccordionContext_unstable(function (ctx) { return ctx.openItems.includes(value); });
|
|
14
|
+
var onAccordionHeaderClick = React.useCallback(function (ev) { return requestToggle(ev, { value: value }); }, [
|
|
15
|
+
requestToggle,
|
|
16
|
+
value,
|
|
17
|
+
]);
|
|
18
|
+
return {
|
|
19
|
+
open: open,
|
|
20
|
+
disabled: disabled,
|
|
21
|
+
onHeaderClick: onAccordionHeaderClick,
|
|
22
|
+
components: {
|
|
23
|
+
root: 'div',
|
|
24
|
+
},
|
|
25
|
+
root: react_utilities_1.getNativeElementProps('div', tslib_1.__assign({ ref: ref }, props)),
|
|
26
|
+
};
|
|
27
|
+
};
|
|
28
|
+
exports.useAccordionItem_unstable = useAccordionItem_unstable;
|
|
29
|
+
});
|
|
30
|
+
//# sourceMappingURL=useAccordionItem.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useAccordionItem.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-accordion/src/components/AccordionItem/useAccordionItem.ts"],"names":[],"mappings":";;;;IAMA;;;;OAIG;IACI,IAAM,yBAAyB,GAAG,UACvC,KAAyB,EACzB,GAA2B;QAEnB,IAAA,KAAK,GAAuB,KAAK,MAA5B,EAAE,KAAqB,KAAK,SAAV,EAAhB,QAAQ,mBAAG,KAAK,KAAA,CAAW;QAE1C,IAAM,aAAa,GAAG,+CAA4B,CAAC,UAAA,GAAG,IAAI,OAAA,GAAG,CAAC,aAAa,EAAjB,CAAiB,CAAC,CAAC;QAC7E,IAAM,IAAI,GAAG,+CAA4B,CAAC,UAAA,GAAG,IAAI,OAAA,GAAG,CAAC,SAAS,CAAC,QAAQ,CAAC,KAAK,CAAC,EAA7B,CAA6B,CAAC,CAAC;QAChF,IAAM,sBAAsB,GAAG,KAAK,CAAC,WAAW,CAAC,UAAC,EAAwB,IAAK,OAAA,aAAa,CAAC,EAAE,EAAE,EAAE,KAAK,OAAA,EAAE,CAAC,EAA5B,CAA4B,EAAE;YAC3G,aAAa;YACb,KAAK;SACN,CAAC,CAAC;QAEH,OAAO;YACL,IAAI,MAAA;YACJ,QAAQ,UAAA;YACR,aAAa,EAAE,sBAAsB;YACrC,UAAU,EAAE;gBACV,IAAI,EAAE,KAAK;aACZ;YACD,IAAI,EAAE,uCAAqB,CAAC,KAAK,qBAC/B,GAAG,EAAE,GAAG,IACL,KAAK,EACR;SACH,CAAC;IACJ,CAAC,CAAC;IAzBW,QAAA,yBAAyB,6BAyBpC","sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps } from '@fluentui/react-utilities';\nimport { useAccordionContext_unstable } from '../Accordion/AccordionContext';\nimport type { AccordionItemProps, AccordionItemState } from './AccordionItem.types';\nimport type { AccordionToggleEvent } from '../Accordion/Accordion.types';\n\n/**\n * Returns the props and state required to render the component\n * @param props - AccordionItem properties\n * @param ref - reference to root HTMLElement of AccordionItem\n */\nexport const useAccordionItem_unstable = (\n props: AccordionItemProps,\n ref: React.Ref<HTMLElement>,\n): AccordionItemState => {\n const { value, disabled = false } = props;\n\n const requestToggle = useAccordionContext_unstable(ctx => ctx.requestToggle);\n const open = useAccordionContext_unstable(ctx => ctx.openItems.includes(value));\n const onAccordionHeaderClick = React.useCallback((ev: AccordionToggleEvent) => requestToggle(ev, { value }), [\n requestToggle,\n value,\n ]);\n\n return {\n open,\n disabled,\n onHeaderClick: onAccordionHeaderClick,\n components: {\n root: 'div',\n },\n root: getNativeElementProps('div', {\n ref: ref,\n ...props,\n }),\n };\n};\n"]}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
define(["require", "exports", "react"], function (require, exports, React) {
|
|
2
|
+
"use strict";
|
|
3
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
4
|
+
exports.useAccordionItemContextValues_unstable = void 0;
|
|
5
|
+
function useAccordionItemContextValues_unstable(state) {
|
|
6
|
+
var disabled = state.disabled, onHeaderClick = state.onHeaderClick, open = state.open;
|
|
7
|
+
var accordionItem = React.useMemo(function () { return ({ disabled: disabled, onHeaderClick: onHeaderClick, open: open }); }, [
|
|
8
|
+
disabled,
|
|
9
|
+
onHeaderClick,
|
|
10
|
+
open,
|
|
11
|
+
]);
|
|
12
|
+
return { accordionItem: accordionItem };
|
|
13
|
+
}
|
|
14
|
+
exports.useAccordionItemContextValues_unstable = useAccordionItemContextValues_unstable;
|
|
15
|
+
});
|
|
16
|
+
//# sourceMappingURL=useAccordionItemContextValues.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useAccordionItemContextValues.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-accordion/src/components/AccordionItem/useAccordionItemContextValues.ts"],"names":[],"mappings":";;;;IAGA,SAAgB,sCAAsC,CAAC,KAAyB;QACtE,IAAA,QAAQ,GAA0B,KAAK,SAA/B,EAAE,aAAa,GAAW,KAAK,cAAhB,EAAE,IAAI,GAAK,KAAK,KAAV,CAAW;QAChD,IAAM,aAAa,GAAG,KAAK,CAAC,OAAO,CAA4B,cAAM,OAAA,CAAC,EAAE,QAAQ,UAAA,EAAE,aAAa,eAAA,EAAE,IAAI,MAAA,EAAE,CAAC,EAAnC,CAAmC,EAAE;YACxG,QAAQ;YACR,aAAa;YACb,IAAI;SACL,CAAC,CAAC;QAEH,OAAO,EAAE,aAAa,eAAA,EAAE,CAAC;IAC3B,CAAC;IATD,wFASC","sourcesContent":["import * as React from 'react';\nimport type { AccordionItemContextValue, AccordionItemContextValues, AccordionItemState } from './AccordionItem.types';\n\nexport function useAccordionItemContextValues_unstable(state: AccordionItemState): AccordionItemContextValues {\n const { disabled, onHeaderClick, open } = state;\n const accordionItem = React.useMemo<AccordionItemContextValue>(() => ({ disabled, onHeaderClick, open }), [\n disabled,\n onHeaderClick,\n open,\n ]);\n\n return { accordionItem };\n}\n"]}
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
define(["require", "exports", "@griffel/react"], function (require, exports, react_1) {
|
|
2
|
+
"use strict";
|
|
3
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
4
|
+
exports.useAccordionItemStyles_unstable = exports.accordionItemClassNames = void 0;
|
|
5
|
+
exports.accordionItemClassNames = {
|
|
6
|
+
root: 'fui-AccordionItem',
|
|
7
|
+
};
|
|
8
|
+
var useAccordionItemStyles_unstable = function (state) {
|
|
9
|
+
state.root.className = react_1.mergeClasses(exports.accordionItemClassNames.root, state.root.className);
|
|
10
|
+
return state;
|
|
11
|
+
};
|
|
12
|
+
exports.useAccordionItemStyles_unstable = useAccordionItemStyles_unstable;
|
|
13
|
+
});
|
|
14
|
+
//# sourceMappingURL=useAccordionItemStyles.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useAccordionItemStyles.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-accordion/src/components/AccordionItem/useAccordionItemStyles.ts"],"names":[],"mappings":";;;;IAIa,QAAA,uBAAuB,GAAuC;QACzE,IAAI,EAAE,mBAAmB;KAC1B,CAAC;IAEK,IAAM,+BAA+B,GAAG,UAAC,KAAyB;QACvE,KAAK,CAAC,IAAI,CAAC,SAAS,GAAG,oBAAY,CAAC,+BAAuB,CAAC,IAAI,EAAE,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;QAExF,OAAO,KAAK,CAAC;IACf,CAAC,CAAC;IAJW,QAAA,+BAA+B,mCAI1C","sourcesContent":["import type { SlotClassNames } from '@fluentui/react-utilities';\nimport { mergeClasses } from '@griffel/react';\nimport type { AccordionItemSlots, AccordionItemState } from './AccordionItem.types';\n\nexport const accordionItemClassNames: SlotClassNames<AccordionItemSlots> = {\n root: 'fui-AccordionItem',\n};\n\nexport const useAccordionItemStyles_unstable = (state: AccordionItemState) => {\n state.root.className = mergeClasses(accordionItemClassNames.root, state.root.className);\n\n return state;\n};\n"]}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
define(["require", "exports", "react", "./useAccordionPanel", "./renderAccordionPanel", "./useAccordionPanelStyles"], function (require, exports, React, useAccordionPanel_1, renderAccordionPanel_1, useAccordionPanelStyles_1) {
|
|
2
|
+
"use strict";
|
|
3
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
4
|
+
exports.AccordionPanel = void 0;
|
|
5
|
+
/**
|
|
6
|
+
* Define a styled AccordionPanel, using the `useAccordionPanel_unstable` and `useAccordionPanelStyles_unstable` hooks.
|
|
7
|
+
*/
|
|
8
|
+
exports.AccordionPanel = React.forwardRef(function (props, ref) {
|
|
9
|
+
var state = useAccordionPanel_1.useAccordionPanel_unstable(props, ref);
|
|
10
|
+
useAccordionPanelStyles_1.useAccordionPanelStyles_unstable(state);
|
|
11
|
+
return renderAccordionPanel_1.renderAccordionPanel_unstable(state);
|
|
12
|
+
});
|
|
13
|
+
exports.AccordionPanel.displayName = 'AccordionPanel';
|
|
14
|
+
});
|
|
15
|
+
//# sourceMappingURL=AccordionPanel.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AccordionPanel.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-accordion/src/components/AccordionPanel/AccordionPanel.tsx"],"names":[],"mappings":";;;;IAOA;;OAEG;IACU,QAAA,cAAc,GAA6C,KAAK,CAAC,UAAU,CAAC,UAAC,KAAK,EAAE,GAAG;QAClG,IAAM,KAAK,GAAG,8CAA0B,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC;QAErD,0DAAgC,CAAC,KAAK,CAAC,CAAC;QACxC,OAAO,oDAA6B,CAAC,KAAK,CAAC,CAAC;IAC9C,CAAC,CAAC,CAAC;IAEH,sBAAc,CAAC,WAAW,GAAG,gBAAgB,CAAC","sourcesContent":["import * as React from 'react';\nimport { useAccordionPanel_unstable } from './useAccordionPanel';\nimport { renderAccordionPanel_unstable } from './renderAccordionPanel';\nimport { useAccordionPanelStyles_unstable } from './useAccordionPanelStyles';\nimport type { AccordionPanelProps } from './AccordionPanel.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * Define a styled AccordionPanel, using the `useAccordionPanel_unstable` and `useAccordionPanelStyles_unstable` hooks.\n */\nexport const AccordionPanel: ForwardRefComponent<AccordionPanelProps> = React.forwardRef((props, ref) => {\n const state = useAccordionPanel_unstable(props, ref);\n\n useAccordionPanelStyles_unstable(state);\n return renderAccordionPanel_unstable(state);\n});\n\nAccordionPanel.displayName = 'AccordionPanel';\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AccordionPanel.types.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-accordion/src/components/AccordionPanel/AccordionPanel.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type AccordionPanelSlots = {\n root: 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"]}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
define(["require", "exports", "tslib", "./AccordionPanel", "./AccordionPanel.types", "./renderAccordionPanel", "./useAccordionPanel", "./useAccordionPanelStyles"], function (require, exports, tslib_1, AccordionPanel_1, AccordionPanel_types_1, renderAccordionPanel_1, useAccordionPanel_1, useAccordionPanelStyles_1) {
|
|
2
|
+
"use strict";
|
|
3
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
4
|
+
tslib_1.__exportStar(AccordionPanel_1, exports);
|
|
5
|
+
tslib_1.__exportStar(AccordionPanel_types_1, exports);
|
|
6
|
+
tslib_1.__exportStar(renderAccordionPanel_1, exports);
|
|
7
|
+
tslib_1.__exportStar(useAccordionPanel_1, exports);
|
|
8
|
+
tslib_1.__exportStar(useAccordionPanelStyles_1, exports);
|
|
9
|
+
});
|
|
10
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-accordion/src/components/AccordionPanel/index.ts"],"names":[],"mappings":";;;IAAA,gDAAiC;IACjC,sDAAuC;IACvC,sDAAuC;IACvC,mDAAoC;IACpC,yDAA0C","sourcesContent":["export * from './AccordionPanel';\nexport * from './AccordionPanel.types';\nexport * from './renderAccordionPanel';\nexport * from './useAccordionPanel';\nexport * from './useAccordionPanelStyles';\n"]}
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
define(["require", "exports", "tslib", "react", "@fluentui/react-utilities"], function (require, exports, tslib_1, React, react_utilities_1) {
|
|
2
|
+
"use strict";
|
|
3
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
4
|
+
exports.renderAccordionPanel_unstable = void 0;
|
|
5
|
+
/**
|
|
6
|
+
* Function that renders the final JSX of the component
|
|
7
|
+
*/
|
|
8
|
+
var renderAccordionPanel_unstable = function (state) {
|
|
9
|
+
var _a = react_utilities_1.getSlots(state), slots = _a.slots, slotProps = _a.slotProps;
|
|
10
|
+
return state.open ? React.createElement(slots.root, tslib_1.__assign({}, slotProps.root), slotProps.root.children) : null;
|
|
11
|
+
};
|
|
12
|
+
exports.renderAccordionPanel_unstable = renderAccordionPanel_unstable;
|
|
13
|
+
});
|
|
14
|
+
//# sourceMappingURL=renderAccordionPanel.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"renderAccordionPanel.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-accordion/src/components/AccordionPanel/renderAccordionPanel.tsx"],"names":[],"mappings":";;;;IAIA;;OAEG;IACI,IAAM,6BAA6B,GAAG,UAAC,KAA0B;QAChE,IAAA,KAAuB,0BAAQ,CAAsB,KAAK,CAAC,EAAzD,KAAK,WAAA,EAAE,SAAS,eAAyC,CAAC;QAClE,OAAO,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,oBAAC,KAAK,CAAC,IAAI,uBAAK,SAAS,CAAC,IAAI,GAAG,SAAS,CAAC,IAAI,CAAC,QAAQ,CAAc,CAAC,CAAC,CAAC,IAAI,CAAC;IACpG,CAAC,CAAC;IAHW,QAAA,6BAA6B,iCAGxC","sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { AccordionPanelState, AccordionPanelSlots } from './AccordionPanel.types';\n\n/**\n * Function that renders the final JSX of the component\n */\nexport const renderAccordionPanel_unstable = (state: AccordionPanelState) => {\n const { slots, slotProps } = getSlots<AccordionPanelSlots>(state);\n return state.open ? <slots.root {...slotProps.root}>{slotProps.root.children}</slots.root> : null;\n};\n"]}
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
define(["require", "exports", "tslib", "@fluentui/react-utilities", "@fluentui/react-tabster", "../AccordionItem/index", "../Accordion/AccordionContext"], function (require, exports, tslib_1, react_utilities_1, react_tabster_1, index_1, AccordionContext_1) {
|
|
2
|
+
"use strict";
|
|
3
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
4
|
+
exports.useAccordionPanel_unstable = void 0;
|
|
5
|
+
/**
|
|
6
|
+
* Returns the props and state required to render the component
|
|
7
|
+
* @param props - AccordionPanel properties
|
|
8
|
+
* @param ref - reference to root HTMLElement of AccordionPanel
|
|
9
|
+
*/
|
|
10
|
+
var useAccordionPanel_unstable = function (props, ref) {
|
|
11
|
+
var open = index_1.useAccordionItemContext_unstable().open;
|
|
12
|
+
var focusableProps = react_tabster_1.useTabsterAttributes({ focusable: { excludeFromMover: true } });
|
|
13
|
+
var navigation = AccordionContext_1.useAccordionContext_unstable(function (ctx) { return ctx.navigation; });
|
|
14
|
+
return {
|
|
15
|
+
open: open,
|
|
16
|
+
components: {
|
|
17
|
+
root: 'div',
|
|
18
|
+
},
|
|
19
|
+
root: react_utilities_1.getNativeElementProps('div', tslib_1.__assign(tslib_1.__assign({ ref: ref }, props), (navigation && focusableProps))),
|
|
20
|
+
};
|
|
21
|
+
};
|
|
22
|
+
exports.useAccordionPanel_unstable = useAccordionPanel_unstable;
|
|
23
|
+
});
|
|
24
|
+
//# sourceMappingURL=useAccordionPanel.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useAccordionPanel.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-accordion/src/components/AccordionPanel/useAccordionPanel.ts"],"names":[],"mappings":";;;;IAOA;;;;OAIG;IACI,IAAM,0BAA0B,GAAG,UACxC,KAA0B,EAC1B,GAA2B;QAEnB,IAAA,IAAI,GAAK,wCAAgC,EAAE,KAAvC,CAAwC;QACpD,IAAM,cAAc,GAAG,oCAAoB,CAAC,EAAE,SAAS,EAAE,EAAE,gBAAgB,EAAE,IAAI,EAAE,EAAE,CAAC,CAAC;QACvF,IAAM,UAAU,GAAG,+CAA4B,CAAC,UAAA,GAAG,IAAI,OAAA,GAAG,CAAC,UAAU,EAAd,CAAc,CAAC,CAAC;QAEvE,OAAO;YACL,IAAI,MAAA;YACJ,UAAU,EAAE;gBACV,IAAI,EAAE,KAAK;aACZ;YACD,IAAI,EAAE,uCAAqB,CAAC,KAAK,sCAC/B,GAAG,KAAA,IACA,KAAK,GACL,CAAC,UAAU,IAAI,cAAc,CAAC,EACjC;SACH,CAAC;IACJ,CAAC,CAAC;IAnBW,QAAA,0BAA0B,8BAmBrC","sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps } from '@fluentui/react-utilities';\nimport { useTabsterAttributes } from '@fluentui/react-tabster';\nimport { useAccordionItemContext_unstable } from '../AccordionItem/index';\nimport { useAccordionContext_unstable } from '../Accordion/AccordionContext';\nimport type { AccordionPanelProps, AccordionPanelState } from './AccordionPanel.types';\n\n/**\n * Returns the props and state required to render the component\n * @param props - AccordionPanel properties\n * @param ref - reference to root HTMLElement of AccordionPanel\n */\nexport const useAccordionPanel_unstable = (\n props: AccordionPanelProps,\n ref: React.Ref<HTMLElement>,\n): AccordionPanelState => {\n const { open } = useAccordionItemContext_unstable();\n const focusableProps = useTabsterAttributes({ focusable: { excludeFromMover: true } });\n const navigation = useAccordionContext_unstable(ctx => ctx.navigation);\n\n return {\n open,\n components: {\n root: 'div',\n },\n root: getNativeElementProps('div', {\n ref,\n ...props,\n ...(navigation && focusableProps),\n }),\n };\n};\n"]}
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
define(["require", "exports", "tslib", "@griffel/react", "@fluentui/react-theme"], function (require, exports, tslib_1, react_1, react_theme_1) {
|
|
2
|
+
"use strict";
|
|
3
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
4
|
+
exports.useAccordionPanelStyles_unstable = exports.accordionPanelClassNames = void 0;
|
|
5
|
+
exports.accordionPanelClassNames = {
|
|
6
|
+
root: 'fui-AccordionPanel',
|
|
7
|
+
};
|
|
8
|
+
/**
|
|
9
|
+
* Styles for the root slot
|
|
10
|
+
*/
|
|
11
|
+
var useStyles = react_1.makeStyles({
|
|
12
|
+
root: tslib_1.__assign({}, react_1.shorthands.margin(0, react_theme_1.tokens.spacingHorizontalM)),
|
|
13
|
+
});
|
|
14
|
+
/** Applies style classnames to slots */
|
|
15
|
+
var useAccordionPanelStyles_unstable = function (state) {
|
|
16
|
+
var styles = useStyles();
|
|
17
|
+
state.root.className = react_1.mergeClasses(exports.accordionPanelClassNames.root, styles.root, state.root.className);
|
|
18
|
+
return state;
|
|
19
|
+
};
|
|
20
|
+
exports.useAccordionPanelStyles_unstable = useAccordionPanelStyles_unstable;
|
|
21
|
+
});
|
|
22
|
+
//# sourceMappingURL=useAccordionPanelStyles.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useAccordionPanelStyles.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-accordion/src/components/AccordionPanel/useAccordionPanelStyles.ts"],"names":[],"mappings":";;;;IAMa,QAAA,wBAAwB,GAAwC;QAC3E,IAAI,EAAE,oBAAoB;KAC3B,CAAC;IAEF;;OAEG;IACH,IAAM,SAAS,GAAG,kBAAU,CAAC;QAC3B,IAAI,uBACC,kBAAU,CAAC,MAAM,CAAC,CAAC,EAAE,oBAAM,CAAC,kBAAkB,CAAC,CACnD;KACF,CAAC,CAAC;IAEH,wCAAwC;IACjC,IAAM,gCAAgC,GAAG,UAAC,KAA0B;QACzE,IAAM,MAAM,GAAG,SAAS,EAAE,CAAC;QAC3B,KAAK,CAAC,IAAI,CAAC,SAAS,GAAG,oBAAY,CAAC,gCAAwB,CAAC,IAAI,EAAE,MAAM,CAAC,IAAI,EAAE,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;QAEtG,OAAO,KAAK,CAAC;IACf,CAAC,CAAC;IALW,QAAA,gCAAgC,oCAK3C","sourcesContent":["import type { SlotClassNames } from '@fluentui/react-utilities';\nimport { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\n\nimport type { AccordionPanelSlots, AccordionPanelState } from './AccordionPanel.types';\n\nexport const accordionPanelClassNames: SlotClassNames<AccordionPanelSlots> = {\n root: 'fui-AccordionPanel',\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n root: {\n ...shorthands.margin(0, tokens.spacingHorizontalM),\n },\n});\n\n/** Applies style classnames to slots */\nexport const useAccordionPanelStyles_unstable = (state: AccordionPanelState) => {\n const styles = useStyles();\n state.root.className = mergeClasses(accordionPanelClassNames.root, styles.root, state.root.className);\n\n return state;\n};\n"]}
|
package/lib-amd/index.js
ADDED
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
define(["require", "exports", "./Accordion", "./AccordionItem", "./AccordionHeader", "./AccordionPanel"], function (require, exports, Accordion_1, AccordionItem_1, AccordionHeader_1, AccordionPanel_1) {
|
|
2
|
+
"use strict";
|
|
3
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
4
|
+
exports.useAccordionPanel_unstable = exports.useAccordionPanelStyles_unstable = exports.renderAccordionPanel_unstable = exports.accordionPanelClassNames = exports.AccordionPanel = exports.useAccordionHeader_unstable = exports.useAccordionHeaderStyles_unstable = exports.useAccordionHeaderContextValues_unstable = exports.renderAccordionHeader_unstable = exports.accordionHeaderClassNames = exports.AccordionHeader = exports.useAccordionItem_unstable = exports.useAccordionItemStyles_unstable = exports.useAccordionItemContext_unstable = exports.useAccordionItemContextValues_unstable = exports.renderAccordionItem_unstable = exports.accordionItemClassNames = exports.AccordionItemProvider = exports.AccordionItem = exports.useAccordion_unstable = exports.useAccordionStyles_unstable = exports.useAccordionContextValues_unstable = exports.useAccordionContext_unstable = exports.renderAccordion_unstable = exports.accordionClassNames = exports.AccordionProvider = exports.Accordion = void 0;
|
|
5
|
+
Object.defineProperty(exports, "Accordion", { enumerable: true, get: function () { return Accordion_1.Accordion; } });
|
|
6
|
+
Object.defineProperty(exports, "AccordionProvider", { enumerable: true, get: function () { return Accordion_1.AccordionProvider; } });
|
|
7
|
+
Object.defineProperty(exports, "accordionClassNames", { enumerable: true, get: function () { return Accordion_1.accordionClassNames; } });
|
|
8
|
+
Object.defineProperty(exports, "renderAccordion_unstable", { enumerable: true, get: function () { return Accordion_1.renderAccordion_unstable; } });
|
|
9
|
+
Object.defineProperty(exports, "useAccordionContext_unstable", { enumerable: true, get: function () { return Accordion_1.useAccordionContext_unstable; } });
|
|
10
|
+
Object.defineProperty(exports, "useAccordionContextValues_unstable", { enumerable: true, get: function () { return Accordion_1.useAccordionContextValues_unstable; } });
|
|
11
|
+
Object.defineProperty(exports, "useAccordionStyles_unstable", { enumerable: true, get: function () { return Accordion_1.useAccordionStyles_unstable; } });
|
|
12
|
+
Object.defineProperty(exports, "useAccordion_unstable", { enumerable: true, get: function () { return Accordion_1.useAccordion_unstable; } });
|
|
13
|
+
Object.defineProperty(exports, "AccordionItem", { enumerable: true, get: function () { return AccordionItem_1.AccordionItem; } });
|
|
14
|
+
Object.defineProperty(exports, "AccordionItemProvider", { enumerable: true, get: function () { return AccordionItem_1.AccordionItemProvider; } });
|
|
15
|
+
Object.defineProperty(exports, "accordionItemClassNames", { enumerable: true, get: function () { return AccordionItem_1.accordionItemClassNames; } });
|
|
16
|
+
Object.defineProperty(exports, "renderAccordionItem_unstable", { enumerable: true, get: function () { return AccordionItem_1.renderAccordionItem_unstable; } });
|
|
17
|
+
Object.defineProperty(exports, "useAccordionItemContextValues_unstable", { enumerable: true, get: function () { return AccordionItem_1.useAccordionItemContextValues_unstable; } });
|
|
18
|
+
Object.defineProperty(exports, "useAccordionItemContext_unstable", { enumerable: true, get: function () { return AccordionItem_1.useAccordionItemContext_unstable; } });
|
|
19
|
+
Object.defineProperty(exports, "useAccordionItemStyles_unstable", { enumerable: true, get: function () { return AccordionItem_1.useAccordionItemStyles_unstable; } });
|
|
20
|
+
Object.defineProperty(exports, "useAccordionItem_unstable", { enumerable: true, get: function () { return AccordionItem_1.useAccordionItem_unstable; } });
|
|
21
|
+
Object.defineProperty(exports, "AccordionHeader", { enumerable: true, get: function () { return AccordionHeader_1.AccordionHeader; } });
|
|
22
|
+
Object.defineProperty(exports, "accordionHeaderClassNames", { enumerable: true, get: function () { return AccordionHeader_1.accordionHeaderClassNames; } });
|
|
23
|
+
Object.defineProperty(exports, "renderAccordionHeader_unstable", { enumerable: true, get: function () { return AccordionHeader_1.renderAccordionHeader_unstable; } });
|
|
24
|
+
Object.defineProperty(exports, "useAccordionHeaderContextValues_unstable", { enumerable: true, get: function () { return AccordionHeader_1.useAccordionHeaderContextValues_unstable; } });
|
|
25
|
+
Object.defineProperty(exports, "useAccordionHeaderStyles_unstable", { enumerable: true, get: function () { return AccordionHeader_1.useAccordionHeaderStyles_unstable; } });
|
|
26
|
+
Object.defineProperty(exports, "useAccordionHeader_unstable", { enumerable: true, get: function () { return AccordionHeader_1.useAccordionHeader_unstable; } });
|
|
27
|
+
Object.defineProperty(exports, "AccordionPanel", { enumerable: true, get: function () { return AccordionPanel_1.AccordionPanel; } });
|
|
28
|
+
Object.defineProperty(exports, "accordionPanelClassNames", { enumerable: true, get: function () { return AccordionPanel_1.accordionPanelClassNames; } });
|
|
29
|
+
Object.defineProperty(exports, "renderAccordionPanel_unstable", { enumerable: true, get: function () { return AccordionPanel_1.renderAccordionPanel_unstable; } });
|
|
30
|
+
Object.defineProperty(exports, "useAccordionPanelStyles_unstable", { enumerable: true, get: function () { return AccordionPanel_1.useAccordionPanelStyles_unstable; } });
|
|
31
|
+
Object.defineProperty(exports, "useAccordionPanel_unstable", { enumerable: true, get: function () { return AccordionPanel_1.useAccordionPanel_unstable; } });
|
|
32
|
+
});
|
|
33
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../packages/react-components/react-accordion/src/index.ts"],"names":[],"mappings":";;;;IACE,sGAAA,SAAS,OAAA;IACT,8GAAA,iBAAiB,OAAA;IACjB,gHAAA,mBAAmB,OAAA;IACnB,qHAAA,wBAAwB,OAAA;IACxB,yHAAA,4BAA4B,OAAA;IAC5B,+HAAA,kCAAkC,OAAA;IAClC,wHAAA,2BAA2B,OAAA;IAC3B,kHAAA,qBAAqB,OAAA;IAcrB,8GAAA,aAAa,OAAA;IACb,sHAAA,qBAAqB,OAAA;IACrB,wHAAA,uBAAuB,OAAA;IACvB,6HAAA,4BAA4B,OAAA;IAC5B,uIAAA,sCAAsC,OAAA;IACtC,iIAAA,gCAAgC,OAAA;IAChC,gIAAA,+BAA+B,OAAA;IAC/B,0HAAA,yBAAyB,OAAA;IAWzB,kHAAA,eAAe,OAAA;IACf,4HAAA,yBAAyB,OAAA;IACzB,iIAAA,8BAA8B,OAAA;IAC9B,2IAAA,wCAAwC,OAAA;IACxC,oIAAA,iCAAiC,OAAA;IACjC,8HAAA,2BAA2B,OAAA;IAY3B,gHAAA,cAAc,OAAA;IACd,0HAAA,wBAAwB,OAAA;IACxB,+HAAA,6BAA6B,OAAA;IAC7B,kIAAA,gCAAgC,OAAA;IAChC,4HAAA,0BAA0B,OAAA","sourcesContent":["export {\n Accordion,\n AccordionProvider,\n accordionClassNames,\n renderAccordion_unstable,\n useAccordionContext_unstable,\n useAccordionContextValues_unstable,\n useAccordionStyles_unstable,\n useAccordion_unstable,\n} from './Accordion';\nexport type {\n AccordionContextValue,\n AccordionContextValues,\n AccordionIndex,\n AccordionProps,\n AccordionSlots,\n AccordionState,\n AccordionToggleData,\n AccordionToggleEvent,\n AccordionToggleEventHandler,\n} from './Accordion';\nexport {\n AccordionItem,\n AccordionItemProvider,\n accordionItemClassNames,\n renderAccordionItem_unstable,\n useAccordionItemContextValues_unstable,\n useAccordionItemContext_unstable,\n useAccordionItemStyles_unstable,\n useAccordionItem_unstable,\n} from './AccordionItem';\nexport type {\n AccordionItemContextValue,\n AccordionItemContextValues,\n AccordionItemProps,\n AccordionItemSlots,\n AccordionItemState,\n AccordionItemValue,\n} from './AccordionItem';\nexport {\n AccordionHeader,\n accordionHeaderClassNames,\n renderAccordionHeader_unstable,\n useAccordionHeaderContextValues_unstable,\n useAccordionHeaderStyles_unstable,\n useAccordionHeader_unstable,\n} from './AccordionHeader';\nexport type {\n AccordionHeaderContextValue,\n AccordionHeaderContextValues,\n AccordionHeaderExpandIconPosition,\n AccordionHeaderProps,\n AccordionHeaderSize,\n AccordionHeaderSlots,\n AccordionHeaderState,\n} from './AccordionHeader';\nexport {\n AccordionPanel,\n accordionPanelClassNames,\n renderAccordionPanel_unstable,\n useAccordionPanelStyles_unstable,\n useAccordionPanel_unstable,\n} from './AccordionPanel';\nexport type { AccordionPanelProps, AccordionPanelSlots, AccordionPanelState } from './AccordionPanel';\n"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fluentui/react-accordion",
|
|
3
|
-
"version": "9.0.
|
|
3
|
+
"version": "9.0.13",
|
|
4
4
|
"description": "Fluent UI accordion component",
|
|
5
5
|
"main": "lib-commonjs/index.js",
|
|
6
6
|
"module": "lib/index.js",
|
|
@@ -31,13 +31,13 @@
|
|
|
31
31
|
"@fluentui/scripts": "^1.0.0"
|
|
32
32
|
},
|
|
33
33
|
"dependencies": {
|
|
34
|
-
"@fluentui/react-aria": "^9.3.
|
|
35
|
-
"@fluentui/react-context-selector": "^9.1.
|
|
34
|
+
"@fluentui/react-aria": "^9.3.2",
|
|
35
|
+
"@fluentui/react-context-selector": "^9.1.2",
|
|
36
36
|
"@fluentui/react-icons": "^2.0.175",
|
|
37
|
-
"@fluentui/react-shared-contexts": "^9.1.
|
|
38
|
-
"@fluentui/react-tabster": "^9.3.
|
|
39
|
-
"@fluentui/react-theme": "^9.1.
|
|
40
|
-
"@fluentui/react-utilities": "^9.2.
|
|
37
|
+
"@fluentui/react-shared-contexts": "^9.1.2",
|
|
38
|
+
"@fluentui/react-tabster": "^9.3.2",
|
|
39
|
+
"@fluentui/react-theme": "^9.1.3",
|
|
40
|
+
"@fluentui/react-utilities": "^9.2.2",
|
|
41
41
|
"@griffel/react": "^1.4.2",
|
|
42
42
|
"tslib": "^2.1.0"
|
|
43
43
|
},
|