@fluentui/react-tree 9.0.0-beta.21 → 9.0.0-beta.22
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 +78 -1
- package/CHANGELOG.md +19 -2
- package/dist/index.d.ts +9 -3
- package/lib/components/TreeItem/index.js +1 -0
- package/lib/components/TreeItem/index.js.map +1 -1
- package/lib/components/TreeItemLayout/TreeItemLayout.types.js.map +1 -1
- package/lib/components/TreeItemLayout/renderTreeItemLayout.js +1 -1
- package/lib/components/TreeItemLayout/renderTreeItemLayout.js.map +1 -1
- package/lib/components/TreeItemLayout/useTreeItemLayout.js +5 -1
- package/lib/components/TreeItemLayout/useTreeItemLayout.js.map +1 -1
- package/lib/components/TreeItemLayout/useTreeItemLayoutStyles.styles.js +61 -22
- package/lib/components/TreeItemLayout/useTreeItemLayoutStyles.styles.js.map +1 -1
- package/lib/components/TreeItemPersonaLayout/TreeItemPersonaLayout.types.js.map +1 -1
- package/lib/components/TreeItemPersonaLayout/renderTreeItemPersonaLayout.js +1 -1
- package/lib/components/TreeItemPersonaLayout/renderTreeItemPersonaLayout.js.map +1 -1
- package/lib/components/TreeItemPersonaLayout/useTreeItemPersonaLayout.js +3 -3
- package/lib/components/TreeItemPersonaLayout/useTreeItemPersonaLayout.js.map +1 -1
- package/lib/components/TreeItemPersonaLayout/useTreeItemPersonaLayoutStyles.styles.js +12 -12
- package/lib/components/TreeItemPersonaLayout/useTreeItemPersonaLayoutStyles.styles.js.map +1 -1
- package/lib/index.js +1 -1
- package/lib/index.js.map +1 -1
- package/lib-commonjs/components/TreeItem/index.js +1 -0
- package/lib-commonjs/components/TreeItem/index.js.map +1 -1
- package/lib-commonjs/components/TreeItemLayout/renderTreeItemLayout.js +1 -1
- package/lib-commonjs/components/TreeItemLayout/renderTreeItemLayout.js.map +1 -1
- package/lib-commonjs/components/TreeItemLayout/useTreeItemLayout.js +5 -1
- package/lib-commonjs/components/TreeItemLayout/useTreeItemLayout.js.map +1 -1
- package/lib-commonjs/components/TreeItemLayout/useTreeItemLayoutStyles.styles.js +96 -29
- package/lib-commonjs/components/TreeItemLayout/useTreeItemLayoutStyles.styles.js.map +1 -1
- package/lib-commonjs/components/TreeItemPersonaLayout/renderTreeItemPersonaLayout.js +1 -1
- package/lib-commonjs/components/TreeItemPersonaLayout/renderTreeItemPersonaLayout.js.map +1 -1
- package/lib-commonjs/components/TreeItemPersonaLayout/useTreeItemPersonaLayout.js +3 -3
- package/lib-commonjs/components/TreeItemPersonaLayout/useTreeItemPersonaLayout.js.map +1 -1
- package/lib-commonjs/components/TreeItemPersonaLayout/useTreeItemPersonaLayoutStyles.styles.js +15 -15
- package/lib-commonjs/components/TreeItemPersonaLayout/useTreeItemPersonaLayoutStyles.styles.js.map +1 -1
- package/lib-commonjs/index.js +1 -0
- package/lib-commonjs/index.js.map +1 -1
- package/package.json +9 -9
|
@@ -6,7 +6,7 @@ export const treeItemPersonaLayoutClassNames = {
|
|
|
6
6
|
root: 'fui-TreeItemPersonaLayout',
|
|
7
7
|
media: 'fui-TreeItemPersonaLayout__media',
|
|
8
8
|
description: 'fui-TreeItemPersonaLayout__description',
|
|
9
|
-
|
|
9
|
+
content: 'fui-TreeItemPersonaLayout__content',
|
|
10
10
|
expandIcon: 'fui-TreeItemPersonaLayout__expandIcon',
|
|
11
11
|
aside: 'fui-TreeItemPersonaLayout__aside',
|
|
12
12
|
actions: 'fui-TreeItemPersonaLayout__actions'
|
|
@@ -19,7 +19,7 @@ const useRootStyles = /*#__PURE__*/__styles({
|
|
|
19
19
|
mc9l5x: "f13qh94s",
|
|
20
20
|
wkccdc: "f1y0tuzo",
|
|
21
21
|
Budl1dq: "fellwe7",
|
|
22
|
-
zoa1oz: "
|
|
22
|
+
zoa1oz: "f86xsft",
|
|
23
23
|
Bt984gj: "f122n59",
|
|
24
24
|
Bahqtrf: "fk6fouc",
|
|
25
25
|
Be2twd7: "fkhj508",
|
|
@@ -39,7 +39,7 @@ const useRootStyles = /*#__PURE__*/__styles({
|
|
|
39
39
|
uwmqm3: ["fo100m9", "f6yw3pu"]
|
|
40
40
|
}
|
|
41
41
|
}, {
|
|
42
|
-
d: [".f13qh94s{display:grid;}", ".f1y0tuzo{grid-template-rows:1fr auto;}", ".fellwe7{grid-template-columns:auto auto 1fr auto;}", ".
|
|
42
|
+
d: [".f13qh94s{display:grid;}", ".f1y0tuzo{grid-template-rows:1fr auto;}", ".fellwe7{grid-template-columns:auto auto 1fr auto;}", ".f86xsft{grid-template-areas:\"expandIcon media content aside\" \"expandIcon media description aside\";}", ".f122n59{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}", ".fk6fouc{font-family:var(--fontFamilyBase);}", ".fkhj508{font-size:var(--fontSizeBase300);}", ".figsok6{font-weight:var(--fontWeightRegular);}", ".f1i3iumi{line-height:var(--lineHeightBase300);}", ".f1k1erfc{padding-left:calc(var(--fluent-TreeItem--level, 1) * var(--spacingHorizontalXXL));}", ".faevyjx{padding-right:calc(var(--fluent-TreeItem--level, 1) * var(--spacingHorizontalXXL));}", ".fo100m9{padding-left:calc((var(--fluent-TreeItem--level, 1) - 1) * var(--spacingHorizontalXXL));}", ".f6yw3pu{padding-right:calc((var(--fluent-TreeItem--level, 1) - 1) * var(--spacingHorizontalXXL));}"],
|
|
43
43
|
a: [".flvvhsy:active{color:var(--colorNeutralForeground2Pressed);}", ".f1wfn5kd:active{background-color:var(--colorSubtleBackgroundPressed);}", ".f5na5aj:active .fui-TreeItemPersonaLayout__expandIcon{color:var(--colorNeutralForeground3Pressed);}"],
|
|
44
44
|
h: [".fnwyq0v:hover{color:var(--colorNeutralForeground2Hover);}", ".f1t94bn6:hover{background-color:var(--colorSubtleBackgroundHover);}", ".f1oboesa:hover .fui-TreeItemPersonaLayout__expandIcon{color:var(--colorNeutralForeground3Hover);}"]
|
|
45
45
|
});
|
|
@@ -64,12 +64,12 @@ const useMediaStyles = /*#__PURE__*/__styles({
|
|
|
64
64
|
}, {
|
|
65
65
|
d: [".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}", ".f122n59{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}", ".f1szoe96{width:32px;}", ".f1d2rq10{height:32px;}", ".f11uok23{grid-row-start:media;}", ".f1qdfnnj{grid-column-start:media;}", ".f1s27gz{grid-row-end:media;}", ".f86d0yl{grid-column-end:media;}", ".f1g0x7ka{padding-top:0;}", ".f7x41pl{padding-right:var(--spacingHorizontalXS);}", ".fruq291{padding-left:var(--spacingHorizontalXS);}", ".f1qch9an{padding-bottom:0;}", ".fgiv446{padding-left:var(--spacingHorizontalXXS);}", ".ffczdla{padding-right:var(--spacingHorizontalXXS);}"]
|
|
66
66
|
});
|
|
67
|
-
const
|
|
67
|
+
const useContentStyles = /*#__PURE__*/__styles({
|
|
68
68
|
base: {
|
|
69
|
-
Ijaq50: "
|
|
70
|
-
Br312pm: "
|
|
71
|
-
nk6f5a: "
|
|
72
|
-
Bw0ie65: "
|
|
69
|
+
Ijaq50: "fxwmwwq",
|
|
70
|
+
Br312pm: "f1e0gndy",
|
|
71
|
+
nk6f5a: "f4zz6gv",
|
|
72
|
+
Bw0ie65: "f7idnck",
|
|
73
73
|
z8tnut: "f1ngh7ph",
|
|
74
74
|
z189sj: ["f7x41pl", "fruq291"],
|
|
75
75
|
Byoj8tv: "f5o476b",
|
|
@@ -82,7 +82,7 @@ const useMainStyles = /*#__PURE__*/__styles({
|
|
|
82
82
|
uwmqm3: ["f1f5gg8d", "f1vdfbxk"]
|
|
83
83
|
}
|
|
84
84
|
}, {
|
|
85
|
-
d: [".
|
|
85
|
+
d: [".fxwmwwq{grid-row-start:content;}", ".f1e0gndy{grid-column-start:content;}", ".f4zz6gv{grid-row-end:content;}", ".f7idnck{grid-column-end:content;}", ".f1ngh7ph{padding-top:var(--spacingVerticalMNudge);}", ".f7x41pl{padding-right:var(--spacingHorizontalXS);}", ".fruq291{padding-left:var(--spacingHorizontalXS);}", ".f5o476b{padding-bottom:var(--spacingVerticalMNudge);}", ".f1f5gg8d{padding-left:var(--spacingHorizontalS);}", ".f1vdfbxk{padding-right:var(--spacingHorizontalS);}", ".f1qch9an{padding-bottom:0;}"]
|
|
86
86
|
});
|
|
87
87
|
const useDescriptionStyles = /*#__PURE__*/__styles({
|
|
88
88
|
base: {
|
|
@@ -182,12 +182,12 @@ export const useTreeItemPersonaLayoutStyles_unstable = state => {
|
|
|
182
182
|
const actionsStyles = useActionsStyles();
|
|
183
183
|
const asideStyles = useAsideStyles();
|
|
184
184
|
const expandIconStyles = useExpandIconStyles();
|
|
185
|
-
const
|
|
185
|
+
const contentStyles = useContentStyles();
|
|
186
186
|
const itemType = useTreeItemContext_unstable(ctx => ctx.itemType);
|
|
187
187
|
state.root.className = mergeClasses(treeItemPersonaLayoutClassNames.root, rootStyles.base, rootStyles[itemType], state.root.className);
|
|
188
188
|
state.media.className = mergeClasses(treeItemPersonaLayoutClassNames.media, mediaStyles.base, state.media.className);
|
|
189
|
-
if (state.
|
|
190
|
-
state.
|
|
189
|
+
if (state.content) {
|
|
190
|
+
state.content.className = mergeClasses(treeItemPersonaLayoutClassNames.content, contentStyles.base, state.description && contentStyles.withDescription, state.content.className);
|
|
191
191
|
}
|
|
192
192
|
if (state.description) {
|
|
193
193
|
state.description.className = mergeClasses(treeItemPersonaLayoutClassNames.description, descriptionStyles.base, state.description.className);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["__styles","mergeClasses","shorthands","tokens","typographyStyles","treeItemLevelToken","useTreeItemContext_unstable","treeItemPersonaLayoutClassNames","root","media","description","main","expandIcon","aside","actions","useRootStyles","base","mc9l5x","wkccdc","Budl1dq","zoa1oz","Bt984gj","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","lj723h","ecr2s2","zt0xaq","Bi91k9c","Jwef8y","tbva4x","leaf","uwmqm3","branch","d","a","h","useMediaStyles","a9b677","Bqenvij","Ijaq50","Br312pm","nk6f5a","Bw0ie65","z8tnut","z189sj","Byoj8tv","useMainStyles","withDescription","useDescriptionStyles","useActionsStyles","Frg6f3","qhf8xq","Bj3rh1h","useAsideStyles","i8kkvl","Belr9w4","useExpandIconStyles","Brf1p80","Bf4jedk","B7ck84d","sj55zd","Bh6795r","Bnnss6s","xawz","useTreeItemPersonaLayoutStyles_unstable","state","rootStyles","mediaStyles","descriptionStyles","actionsStyles","asideStyles","expandIconStyles","mainStyles","itemType","ctx","className"],"sources":["useTreeItemPersonaLayoutStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport { treeItemLevelToken } from '../../utils/tokens';\nimport { useTreeItemContext_unstable } from '../../contexts/treeItemContext';\nexport const treeItemPersonaLayoutClassNames = {\n root: 'fui-TreeItemPersonaLayout',\n media: 'fui-TreeItemPersonaLayout__media',\n description: 'fui-TreeItemPersonaLayout__description',\n main: 'fui-TreeItemPersonaLayout__main',\n expandIcon: 'fui-TreeItemPersonaLayout__expandIcon',\n aside: 'fui-TreeItemPersonaLayout__aside',\n actions: 'fui-TreeItemPersonaLayout__actions'\n};\n/**\n * Styles for the root slot\n */ const useRootStyles = makeStyles({\n base: {\n display: 'grid',\n gridTemplateRows: '1fr auto',\n gridTemplateColumns: 'auto auto 1fr auto',\n gridTemplateAreas: `\n \"expandIcon media main aside\"\n \"expandIcon media description aside\"\n `,\n alignItems: 'center',\n ...typographyStyles.body1,\n ':active': {\n color: tokens.colorNeutralForeground2Pressed,\n backgroundColor: tokens.colorSubtleBackgroundPressed,\n // TODO: stop using treeItemPersonaLayoutClassNames.expandIcon for styling\n [`& .${treeItemPersonaLayoutClassNames.expandIcon}`]: {\n color: tokens.colorNeutralForeground3Pressed\n }\n },\n ':hover': {\n color: tokens.colorNeutralForeground2Hover,\n backgroundColor: tokens.colorSubtleBackgroundHover,\n // TODO: stop using treeItemPersonaLayoutClassNames.expandIcon for styling\n [`& .${treeItemPersonaLayoutClassNames.expandIcon}`]: {\n color: tokens.colorNeutralForeground3Hover\n }\n }\n },\n leaf: {\n paddingLeft: `calc(var(${treeItemLevelToken}, 1) * ${tokens.spacingHorizontalXXL})`\n },\n branch: {\n paddingLeft: `calc((var(${treeItemLevelToken}, 1) - 1) * ${tokens.spacingHorizontalXXL})`\n }\n});\n/**\n * Styles for the expand icon slot\n */ const useMediaStyles = makeStyles({\n base: {\n display: 'flex',\n alignItems: 'center',\n width: '32px',\n height: '32px',\n ...shorthands.gridArea('media'),\n ...shorthands.padding(0, tokens.spacingHorizontalXS, 0, tokens.spacingHorizontalXXS)\n }\n});\nconst useMainStyles = makeStyles({\n base: {\n ...shorthands.gridArea('main'),\n ...shorthands.padding(tokens.spacingVerticalMNudge, tokens.spacingHorizontalXS, tokens.spacingVerticalMNudge, tokens.spacingHorizontalS)\n },\n withDescription: {\n ...shorthands.padding(tokens.spacingVerticalMNudge, tokens.spacingHorizontalXS, 0, tokens.spacingHorizontalS)\n }\n});\nconst useDescriptionStyles = makeStyles({\n base: {\n ...shorthands.gridArea('description'),\n ...typographyStyles.caption1,\n ...shorthands.padding(0, tokens.spacingHorizontalXS, tokens.spacingVerticalMNudge, tokens.spacingHorizontalS)\n }\n});\n/**\n * Styles for the action icon slot\n */ const useActionsStyles = makeStyles({\n base: {\n display: 'flex',\n marginLeft: 'auto',\n position: 'relative',\n zIndex: 1,\n ...shorthands.gridArea('aside'),\n ...shorthands.padding(0, tokens.spacingHorizontalS)\n }\n});\n/**\n * Styles for the action icon slot\n */ const useAsideStyles = makeStyles({\n base: {\n display: 'flex',\n marginLeft: 'auto',\n alignItems: 'center',\n zIndex: 0,\n ...shorthands.gridArea('aside'),\n ...shorthands.padding(0, tokens.spacingHorizontalM),\n ...shorthands.gap(tokens.spacingHorizontalXS)\n }\n});\n/**\n * Styles for the expand icon slot\n */ const useExpandIconStyles = makeStyles({\n base: {\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n minWidth: '24px',\n boxSizing: 'border-box',\n color: tokens.colorNeutralForeground3,\n ...shorthands.gridArea('expandIcon'),\n ...shorthands.flex(0, 0, 'auto'),\n ...shorthands.padding(tokens.spacingVerticalXS, 0)\n }\n});\n/**\n * Apply styling to the TreeItemPersonaLayout slots based on the state\n */ export const useTreeItemPersonaLayoutStyles_unstable = (state)=>{\n const rootStyles = useRootStyles();\n const mediaStyles = useMediaStyles();\n const descriptionStyles = useDescriptionStyles();\n const actionsStyles = useActionsStyles();\n const asideStyles = useAsideStyles();\n const expandIconStyles = useExpandIconStyles();\n const mainStyles = useMainStyles();\n const itemType = useTreeItemContext_unstable((ctx)=>ctx.itemType);\n state.root.className = mergeClasses(treeItemPersonaLayoutClassNames.root, rootStyles.base, rootStyles[itemType], state.root.className);\n state.media.className = mergeClasses(treeItemPersonaLayoutClassNames.media, mediaStyles.base, state.media.className);\n if (state.main) {\n state.main.className = mergeClasses(treeItemPersonaLayoutClassNames.main, mainStyles.base, state.description && mainStyles.withDescription, state.main.className);\n }\n if (state.description) {\n state.description.className = mergeClasses(treeItemPersonaLayoutClassNames.description, descriptionStyles.base, state.description.className);\n }\n if (state.actions) {\n state.actions.className = mergeClasses(treeItemPersonaLayoutClassNames.actions, actionsStyles.base, state.actions.className);\n }\n if (state.aside) {\n state.aside.className = mergeClasses(treeItemPersonaLayoutClassNames.aside, asideStyles.base, state.aside.className);\n }\n if (state.expandIcon) {\n state.expandIcon.className = mergeClasses(treeItemPersonaLayoutClassNames.expandIcon, expandIconStyles.base, state.expandIcon.className);\n }\n return state;\n};\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"names":["__styles","mergeClasses","shorthands","tokens","typographyStyles","treeItemLevelToken","useTreeItemContext_unstable","treeItemPersonaLayoutClassNames","root","media","description","content","expandIcon","aside","actions","useRootStyles","base","mc9l5x","wkccdc","Budl1dq","zoa1oz","Bt984gj","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","lj723h","ecr2s2","zt0xaq","Bi91k9c","Jwef8y","tbva4x","leaf","uwmqm3","branch","d","a","h","useMediaStyles","a9b677","Bqenvij","Ijaq50","Br312pm","nk6f5a","Bw0ie65","z8tnut","z189sj","Byoj8tv","useContentStyles","withDescription","useDescriptionStyles","useActionsStyles","Frg6f3","qhf8xq","Bj3rh1h","useAsideStyles","i8kkvl","Belr9w4","useExpandIconStyles","Brf1p80","Bf4jedk","B7ck84d","sj55zd","Bh6795r","Bnnss6s","xawz","useTreeItemPersonaLayoutStyles_unstable","state","rootStyles","mediaStyles","descriptionStyles","actionsStyles","asideStyles","expandIconStyles","contentStyles","itemType","ctx","className"],"sources":["useTreeItemPersonaLayoutStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport { treeItemLevelToken } from '../../utils/tokens';\nimport { useTreeItemContext_unstable } from '../../contexts/treeItemContext';\nexport const treeItemPersonaLayoutClassNames = {\n root: 'fui-TreeItemPersonaLayout',\n media: 'fui-TreeItemPersonaLayout__media',\n description: 'fui-TreeItemPersonaLayout__description',\n content: 'fui-TreeItemPersonaLayout__content',\n expandIcon: 'fui-TreeItemPersonaLayout__expandIcon',\n aside: 'fui-TreeItemPersonaLayout__aside',\n actions: 'fui-TreeItemPersonaLayout__actions'\n};\n/**\n * Styles for the root slot\n */ const useRootStyles = makeStyles({\n base: {\n display: 'grid',\n gridTemplateRows: '1fr auto',\n gridTemplateColumns: 'auto auto 1fr auto',\n gridTemplateAreas: `\n \"expandIcon media content aside\"\n \"expandIcon media description aside\"\n `,\n alignItems: 'center',\n ...typographyStyles.body1,\n ':active': {\n color: tokens.colorNeutralForeground2Pressed,\n backgroundColor: tokens.colorSubtleBackgroundPressed,\n // TODO: stop using treeItemPersonaLayoutClassNames.expandIcon for styling\n [`& .${treeItemPersonaLayoutClassNames.expandIcon}`]: {\n color: tokens.colorNeutralForeground3Pressed\n }\n },\n ':hover': {\n color: tokens.colorNeutralForeground2Hover,\n backgroundColor: tokens.colorSubtleBackgroundHover,\n // TODO: stop using treeItemPersonaLayoutClassNames.expandIcon for styling\n [`& .${treeItemPersonaLayoutClassNames.expandIcon}`]: {\n color: tokens.colorNeutralForeground3Hover\n }\n }\n },\n leaf: {\n paddingLeft: `calc(var(${treeItemLevelToken}, 1) * ${tokens.spacingHorizontalXXL})`\n },\n branch: {\n paddingLeft: `calc((var(${treeItemLevelToken}, 1) - 1) * ${tokens.spacingHorizontalXXL})`\n }\n});\n/**\n * Styles for the expand icon slot\n */ const useMediaStyles = makeStyles({\n base: {\n display: 'flex',\n alignItems: 'center',\n width: '32px',\n height: '32px',\n ...shorthands.gridArea('media'),\n ...shorthands.padding(0, tokens.spacingHorizontalXS, 0, tokens.spacingHorizontalXXS)\n }\n});\nconst useContentStyles = makeStyles({\n base: {\n ...shorthands.gridArea('content'),\n ...shorthands.padding(tokens.spacingVerticalMNudge, tokens.spacingHorizontalXS, tokens.spacingVerticalMNudge, tokens.spacingHorizontalS)\n },\n withDescription: {\n ...shorthands.padding(tokens.spacingVerticalMNudge, tokens.spacingHorizontalXS, 0, tokens.spacingHorizontalS)\n }\n});\nconst useDescriptionStyles = makeStyles({\n base: {\n ...shorthands.gridArea('description'),\n ...typographyStyles.caption1,\n ...shorthands.padding(0, tokens.spacingHorizontalXS, tokens.spacingVerticalMNudge, tokens.spacingHorizontalS)\n }\n});\n/**\n * Styles for the action icon slot\n */ const useActionsStyles = makeStyles({\n base: {\n display: 'flex',\n marginLeft: 'auto',\n position: 'relative',\n zIndex: 1,\n ...shorthands.gridArea('aside'),\n ...shorthands.padding(0, tokens.spacingHorizontalS)\n }\n});\n/**\n * Styles for the action icon slot\n */ const useAsideStyles = makeStyles({\n base: {\n display: 'flex',\n marginLeft: 'auto',\n alignItems: 'center',\n zIndex: 0,\n ...shorthands.gridArea('aside'),\n ...shorthands.padding(0, tokens.spacingHorizontalM),\n ...shorthands.gap(tokens.spacingHorizontalXS)\n }\n});\n/**\n * Styles for the expand icon slot\n */ const useExpandIconStyles = makeStyles({\n base: {\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n minWidth: '24px',\n boxSizing: 'border-box',\n color: tokens.colorNeutralForeground3,\n ...shorthands.gridArea('expandIcon'),\n ...shorthands.flex(0, 0, 'auto'),\n ...shorthands.padding(tokens.spacingVerticalXS, 0)\n }\n});\n/**\n * Apply styling to the TreeItemPersonaLayout slots based on the state\n */ export const useTreeItemPersonaLayoutStyles_unstable = (state)=>{\n const rootStyles = useRootStyles();\n const mediaStyles = useMediaStyles();\n const descriptionStyles = useDescriptionStyles();\n const actionsStyles = useActionsStyles();\n const asideStyles = useAsideStyles();\n const expandIconStyles = useExpandIconStyles();\n const contentStyles = useContentStyles();\n const itemType = useTreeItemContext_unstable((ctx)=>ctx.itemType);\n state.root.className = mergeClasses(treeItemPersonaLayoutClassNames.root, rootStyles.base, rootStyles[itemType], state.root.className);\n state.media.className = mergeClasses(treeItemPersonaLayoutClassNames.media, mediaStyles.base, state.media.className);\n if (state.content) {\n state.content.className = mergeClasses(treeItemPersonaLayoutClassNames.content, contentStyles.base, state.description && contentStyles.withDescription, state.content.className);\n }\n if (state.description) {\n state.description.className = mergeClasses(treeItemPersonaLayoutClassNames.description, descriptionStyles.base, state.description.className);\n }\n if (state.actions) {\n state.actions.className = mergeClasses(treeItemPersonaLayoutClassNames.actions, actionsStyles.base, state.actions.className);\n }\n if (state.aside) {\n state.aside.className = mergeClasses(treeItemPersonaLayoutClassNames.aside, asideStyles.base, state.aside.className);\n }\n if (state.expandIcon) {\n state.expandIcon.className = mergeClasses(treeItemPersonaLayoutClassNames.expandIcon, expandIconStyles.base, state.expandIcon.className);\n }\n return state;\n};\n"],"mappings":"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"}
|
package/lib/index.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
export { Tree, treeClassNames, renderTree_unstable, useTreeStyles_unstable, useTree_unstable, useTreeContextValues_unstable } from './Tree';
|
|
2
2
|
export { TreeProvider, useTreeContext_unstable, useTreeItemContext_unstable, TreeItemProvider } from './contexts';
|
|
3
3
|
export { treeItemLevelToken } from './utils/tokens';
|
|
4
|
-
export { TreeItem, treeItemClassNames, renderTreeItem_unstable, useTreeItemStyles_unstable, useTreeItem_unstable } from './TreeItem';
|
|
4
|
+
export { TreeItem, treeItemClassNames, renderTreeItem_unstable, useTreeItemStyles_unstable, useTreeItemContextValues_unstable, useTreeItem_unstable } from './TreeItem';
|
|
5
5
|
export { TreeItemLayout, treeItemLayoutClassNames, renderTreeItemLayout_unstable, useTreeItemLayoutStyles_unstable, useTreeItemLayout_unstable } from './TreeItemLayout';
|
|
6
6
|
export { TreeItemPersonaLayout, treeItemPersonaLayoutClassNames, renderTreeItemPersonaLayout_unstable, useTreeItemPersonaLayoutStyles_unstable, useTreeItemPersonaLayout_unstable } from './TreeItemPersonaLayout';
|
|
7
7
|
export { useFlatTree_unstable } from './hooks/index';
|
package/lib/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["index.ts"],"sourcesContent":["export {\n Tree,\n treeClassNames,\n renderTree_unstable,\n useTreeStyles_unstable,\n useTree_unstable,\n useTreeContextValues_unstable,\n} from './Tree';\nexport type {\n TreeProps,\n TreeState,\n TreeSlots,\n TreeOpenChangeData,\n TreeOpenChangeEvent,\n TreeNavigationEvent_unstable,\n TreeNavigationData_unstable,\n} from './Tree';\n\nexport { TreeProvider, useTreeContext_unstable, useTreeItemContext_unstable, TreeItemProvider } from './contexts';\nexport type { TreeContextValue } from './contexts';\n\nexport { treeItemLevelToken } from './utils/tokens';\n\nexport {\n TreeItem,\n treeItemClassNames,\n renderTreeItem_unstable,\n useTreeItemStyles_unstable,\n useTreeItem_unstable,\n} from './TreeItem';\nexport type { TreeItemProps, TreeItemState, TreeItemSlots } from './TreeItem';\n\nexport {\n TreeItemLayout,\n treeItemLayoutClassNames,\n renderTreeItemLayout_unstable,\n useTreeItemLayoutStyles_unstable,\n useTreeItemLayout_unstable,\n} from './TreeItemLayout';\nexport type { TreeItemLayoutProps, TreeItemLayoutSlots, TreeItemLayoutState } from './TreeItemLayout';\n\nexport {\n TreeItemPersonaLayout,\n treeItemPersonaLayoutClassNames,\n renderTreeItemPersonaLayout_unstable,\n useTreeItemPersonaLayoutStyles_unstable,\n useTreeItemPersonaLayout_unstable,\n} from './TreeItemPersonaLayout';\nexport type {\n TreeItemPersonaLayoutProps,\n TreeItemPersonaLayoutSlots,\n TreeItemPersonaLayoutState,\n} from './TreeItemPersonaLayout';\n\nexport { useFlatTree_unstable } from './hooks/index';\nexport type { FlatTreeItem, FlatTreeItemProps, FlatTreeProps, FlatTree } from './hooks/index';\n\nexport { flattenTree_unstable } from './utils/flattenTree';\nexport type { NestedTreeItem } from './utils/flattenTree';\n"],"names":["Tree","treeClassNames","renderTree_unstable","useTreeStyles_unstable","useTree_unstable","useTreeContextValues_unstable","TreeProvider","useTreeContext_unstable","useTreeItemContext_unstable","TreeItemProvider","treeItemLevelToken","TreeItem","treeItemClassNames","renderTreeItem_unstable","useTreeItemStyles_unstable","useTreeItem_unstable","TreeItemLayout","treeItemLayoutClassNames","renderTreeItemLayout_unstable","useTreeItemLayoutStyles_unstable","useTreeItemLayout_unstable","TreeItemPersonaLayout","treeItemPersonaLayoutClassNames","renderTreeItemPersonaLayout_unstable","useTreeItemPersonaLayoutStyles_unstable","useTreeItemPersonaLayout_unstable","useFlatTree_unstable","flattenTree_unstable"],"mappings":"AAAA,SACEA,IAAI,EACJC,cAAc,EACdC,mBAAmB,EACnBC,sBAAsB,EACtBC,gBAAgB,EAChBC,6BAA6B,QACxB,SAAS;AAWhB,SAASC,YAAY,EAAEC,uBAAuB,EAAEC,2BAA2B,EAAEC,gBAAgB,QAAQ,aAAa;AAGlH,SAASC,kBAAkB,QAAQ,iBAAiB;AAEpD,SACEC,QAAQ,EACRC,kBAAkB,EAClBC,uBAAuB,EACvBC,0BAA0B,EAC1BC,oBAAoB,QACf,aAAa;AAGpB,SACEC,cAAc,EACdC,wBAAwB,EACxBC,6BAA6B,EAC7BC,gCAAgC,EAChCC,0BAA0B,QACrB,mBAAmB;AAG1B,SACEC,qBAAqB,EACrBC,+BAA+B,EAC/BC,oCAAoC,EACpCC,uCAAuC,EACvCC,iCAAiC,QAC5B,0BAA0B;AAOjC,SAASC,oBAAoB,QAAQ,gBAAgB;AAGrD,SAASC,oBAAoB,QAAQ,sBAAsB"}
|
|
1
|
+
{"version":3,"sources":["index.ts"],"sourcesContent":["export {\n Tree,\n treeClassNames,\n renderTree_unstable,\n useTreeStyles_unstable,\n useTree_unstable,\n useTreeContextValues_unstable,\n} from './Tree';\nexport type {\n TreeProps,\n TreeState,\n TreeSlots,\n TreeOpenChangeData,\n TreeOpenChangeEvent,\n TreeNavigationEvent_unstable,\n TreeNavigationData_unstable,\n} from './Tree';\n\nexport { TreeProvider, useTreeContext_unstable, useTreeItemContext_unstable, TreeItemProvider } from './contexts';\nexport type { TreeContextValue } from './contexts';\n\nexport { treeItemLevelToken } from './utils/tokens';\n\nexport {\n TreeItem,\n treeItemClassNames,\n renderTreeItem_unstable,\n useTreeItemStyles_unstable,\n useTreeItemContextValues_unstable,\n useTreeItem_unstable,\n} from './TreeItem';\nexport type { TreeItemProps, TreeItemState, TreeItemSlots } from './TreeItem';\n\nexport {\n TreeItemLayout,\n treeItemLayoutClassNames,\n renderTreeItemLayout_unstable,\n useTreeItemLayoutStyles_unstable,\n useTreeItemLayout_unstable,\n} from './TreeItemLayout';\nexport type { TreeItemLayoutProps, TreeItemLayoutSlots, TreeItemLayoutState } from './TreeItemLayout';\n\nexport {\n TreeItemPersonaLayout,\n treeItemPersonaLayoutClassNames,\n renderTreeItemPersonaLayout_unstable,\n useTreeItemPersonaLayoutStyles_unstable,\n useTreeItemPersonaLayout_unstable,\n} from './TreeItemPersonaLayout';\nexport type {\n TreeItemPersonaLayoutProps,\n TreeItemPersonaLayoutSlots,\n TreeItemPersonaLayoutState,\n} from './TreeItemPersonaLayout';\n\nexport { useFlatTree_unstable } from './hooks/index';\nexport type { FlatTreeItem, FlatTreeItemProps, FlatTreeProps, FlatTree } from './hooks/index';\n\nexport { flattenTree_unstable } from './utils/flattenTree';\nexport type { NestedTreeItem } from './utils/flattenTree';\n"],"names":["Tree","treeClassNames","renderTree_unstable","useTreeStyles_unstable","useTree_unstable","useTreeContextValues_unstable","TreeProvider","useTreeContext_unstable","useTreeItemContext_unstable","TreeItemProvider","treeItemLevelToken","TreeItem","treeItemClassNames","renderTreeItem_unstable","useTreeItemStyles_unstable","useTreeItemContextValues_unstable","useTreeItem_unstable","TreeItemLayout","treeItemLayoutClassNames","renderTreeItemLayout_unstable","useTreeItemLayoutStyles_unstable","useTreeItemLayout_unstable","TreeItemPersonaLayout","treeItemPersonaLayoutClassNames","renderTreeItemPersonaLayout_unstable","useTreeItemPersonaLayoutStyles_unstable","useTreeItemPersonaLayout_unstable","useFlatTree_unstable","flattenTree_unstable"],"mappings":"AAAA,SACEA,IAAI,EACJC,cAAc,EACdC,mBAAmB,EACnBC,sBAAsB,EACtBC,gBAAgB,EAChBC,6BAA6B,QACxB,SAAS;AAWhB,SAASC,YAAY,EAAEC,uBAAuB,EAAEC,2BAA2B,EAAEC,gBAAgB,QAAQ,aAAa;AAGlH,SAASC,kBAAkB,QAAQ,iBAAiB;AAEpD,SACEC,QAAQ,EACRC,kBAAkB,EAClBC,uBAAuB,EACvBC,0BAA0B,EAC1BC,iCAAiC,EACjCC,oBAAoB,QACf,aAAa;AAGpB,SACEC,cAAc,EACdC,wBAAwB,EACxBC,6BAA6B,EAC7BC,gCAAgC,EAChCC,0BAA0B,QACrB,mBAAmB;AAG1B,SACEC,qBAAqB,EACrBC,+BAA+B,EAC/BC,oCAAoC,EACpCC,uCAAuC,EACvCC,iCAAiC,QAC5B,0BAA0B;AAOjC,SAASC,oBAAoB,QAAQ,gBAAgB;AAGrD,SAASC,oBAAoB,QAAQ,sBAAsB"}
|
|
@@ -8,3 +8,4 @@ _exportStar(require("./TreeItem.types"), exports);
|
|
|
8
8
|
_exportStar(require("./renderTreeItem"), exports);
|
|
9
9
|
_exportStar(require("./useTreeItem"), exports);
|
|
10
10
|
_exportStar(require("./useTreeItemStyles.styles"), exports);
|
|
11
|
+
_exportStar(require("./useTreeItemContextValues"), exports);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["index.js"],"sourcesContent":["export * from './TreeItem';\nexport * from './TreeItem.types';\nexport * from './renderTreeItem';\nexport * from './useTreeItem';\nexport * from './useTreeItemStyles.styles';\n"],"names":[],"mappings":";;;;;oBAAc;oBACA;oBACA;oBACA;oBACA"}
|
|
1
|
+
{"version":3,"sources":["index.js"],"sourcesContent":["export * from './TreeItem';\nexport * from './TreeItem.types';\nexport * from './renderTreeItem';\nexport * from './useTreeItem';\nexport * from './useTreeItemStyles.styles';\nexport * from './useTreeItemContextValues';\n"],"names":[],"mappings":";;;;;oBAAc;oBACA;oBACA;oBACA;oBACA;oBACA"}
|
|
@@ -11,7 +11,7 @@ const _reactUtilities = require("@fluentui/react-utilities");
|
|
|
11
11
|
const _reactButton = require("@fluentui/react-button");
|
|
12
12
|
const renderTreeItemLayout_unstable = (state)=>{
|
|
13
13
|
const { slots , slotProps } = (0, _reactUtilities.getSlotsNext)(state);
|
|
14
|
-
return /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.root, slotProps.root, slots.expandIcon && /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.expandIcon, slotProps.expandIcon), slots.iconBefore && /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.iconBefore, slotProps.iconBefore), slotProps.root.children, slots.iconAfter && /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.iconAfter, slotProps.iconAfter), /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(_reactButton.ButtonContextProvider, {
|
|
14
|
+
return /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.root, slotProps.root, slots.expandIcon && /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.expandIcon, slotProps.expandIcon), slots.iconBefore && /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.iconBefore, slotProps.iconBefore), /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.content, slotProps.content, slotProps.root.children), slots.iconAfter && /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.iconAfter, slotProps.iconAfter), /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(_reactButton.ButtonContextProvider, {
|
|
15
15
|
value: state.buttonContextValue
|
|
16
16
|
}, slots.actions && /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.actions, slotProps.actions), slots.aside && /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.aside, slotProps.aside)));
|
|
17
17
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["renderTreeItemLayout.js"],"sourcesContent":["/** @jsxRuntime classic */ /** @jsx createElement */ import { createElement } from '@fluentui/react-jsx-runtime';\nimport { getSlotsNext } from '@fluentui/react-utilities';\nimport { ButtonContextProvider } from '@fluentui/react-button';\n/**\n * Render the final JSX of TreeItemLayout\n */ export const renderTreeItemLayout_unstable = (state)=>{\n const { slots , slotProps } = getSlotsNext(state);\n return /*#__PURE__*/ createElement(slots.root, slotProps.root, slots.expandIcon && /*#__PURE__*/ createElement(slots.expandIcon, slotProps.expandIcon), slots.iconBefore && /*#__PURE__*/ createElement(slots.iconBefore, slotProps.iconBefore), slotProps.root.children, slots.iconAfter && /*#__PURE__*/ createElement(slots.iconAfter, slotProps.iconAfter), /*#__PURE__*/ createElement(ButtonContextProvider, {\n value: state.buttonContextValue\n }, slots.actions && /*#__PURE__*/ createElement(slots.actions, slotProps.actions), slots.aside && /*#__PURE__*/ createElement(slots.aside, slotProps.aside)));\n};\n"],"names":["renderTreeItemLayout_unstable","state","slots","slotProps","getSlotsNext","createElement","root","expandIcon","iconBefore","children","iconAfter","ButtonContextProvider","value","buttonContextValue","actions","aside"],"mappings":"AAAA,wBAAwB,GAAG,uBAAuB;;;;+BAKjCA;;aAAAA;;iCALkE;gCACtD;6BACS;AAG3B,MAAMA,gCAAgC,CAACC,QAAQ;IACtD,MAAM,EAAEC,MAAK,EAAGC,UAAS,EAAG,GAAGC,IAAAA,4BAAY,EAACH;IAC5C,OAAO,WAAW,GAAGI,IAAAA,8BAAa,EAACH,MAAMI,IAAI,EAAEH,UAAUG,IAAI,EAAEJ,MAAMK,UAAU,IAAI,WAAW,GAAGF,IAAAA,8BAAa,EAACH,MAAMK,UAAU,EAAEJ,UAAUI,UAAU,GAAGL,MAAMM,UAAU,IAAI,WAAW,GAAGH,IAAAA,8BAAa,EAACH,MAAMM,UAAU,EAAEL,UAAUK,UAAU,
|
|
1
|
+
{"version":3,"sources":["renderTreeItemLayout.js"],"sourcesContent":["/** @jsxRuntime classic */ /** @jsx createElement */ import { createElement } from '@fluentui/react-jsx-runtime';\nimport { getSlotsNext } from '@fluentui/react-utilities';\nimport { ButtonContextProvider } from '@fluentui/react-button';\n/**\n * Render the final JSX of TreeItemLayout\n */ export const renderTreeItemLayout_unstable = (state)=>{\n const { slots , slotProps } = getSlotsNext(state);\n return /*#__PURE__*/ createElement(slots.root, slotProps.root, slots.expandIcon && /*#__PURE__*/ createElement(slots.expandIcon, slotProps.expandIcon), slots.iconBefore && /*#__PURE__*/ createElement(slots.iconBefore, slotProps.iconBefore), /*#__PURE__*/ createElement(slots.content, slotProps.content, slotProps.root.children), slots.iconAfter && /*#__PURE__*/ createElement(slots.iconAfter, slotProps.iconAfter), /*#__PURE__*/ createElement(ButtonContextProvider, {\n value: state.buttonContextValue\n }, slots.actions && /*#__PURE__*/ createElement(slots.actions, slotProps.actions), slots.aside && /*#__PURE__*/ createElement(slots.aside, slotProps.aside)));\n};\n"],"names":["renderTreeItemLayout_unstable","state","slots","slotProps","getSlotsNext","createElement","root","expandIcon","iconBefore","content","children","iconAfter","ButtonContextProvider","value","buttonContextValue","actions","aside"],"mappings":"AAAA,wBAAwB,GAAG,uBAAuB;;;;+BAKjCA;;aAAAA;;iCALkE;gCACtD;6BACS;AAG3B,MAAMA,gCAAgC,CAACC,QAAQ;IACtD,MAAM,EAAEC,MAAK,EAAGC,UAAS,EAAG,GAAGC,IAAAA,4BAAY,EAACH;IAC5C,OAAO,WAAW,GAAGI,IAAAA,8BAAa,EAACH,MAAMI,IAAI,EAAEH,UAAUG,IAAI,EAAEJ,MAAMK,UAAU,IAAI,WAAW,GAAGF,IAAAA,8BAAa,EAACH,MAAMK,UAAU,EAAEJ,UAAUI,UAAU,GAAGL,MAAMM,UAAU,IAAI,WAAW,GAAGH,IAAAA,8BAAa,EAACH,MAAMM,UAAU,EAAEL,UAAUK,UAAU,GAAG,WAAW,GAAGH,IAAAA,8BAAa,EAACH,MAAMO,OAAO,EAAEN,UAAUM,OAAO,EAAEN,UAAUG,IAAI,CAACI,QAAQ,GAAGR,MAAMS,SAAS,IAAI,WAAW,GAAGN,IAAAA,8BAAa,EAACH,MAAMS,SAAS,EAAER,UAAUQ,SAAS,GAAG,WAAW,GAAGN,IAAAA,8BAAa,EAACO,kCAAqB,EAAE;QAC9cC,OAAOZ,MAAMa,kBAAkB;IACnC,GAAGZ,MAAMa,OAAO,IAAI,WAAW,GAAGV,IAAAA,8BAAa,EAACH,MAAMa,OAAO,EAAEZ,UAAUY,OAAO,GAAGb,MAAMc,KAAK,IAAI,WAAW,GAAGX,IAAAA,8BAAa,EAACH,MAAMc,KAAK,EAAEb,UAAUa,KAAK;AAC9J"}
|
|
@@ -12,7 +12,7 @@ const _reactUtilities = require("@fluentui/react-utilities");
|
|
|
12
12
|
const _treeItemContext = require("../../contexts/treeItemContext");
|
|
13
13
|
const _treeItemChevron = require("../TreeItemChevron");
|
|
14
14
|
const useTreeItemLayout_unstable = (props, ref)=>{
|
|
15
|
-
const { iconAfter , iconBefore , expandIcon , as ='span' , aside , actions } = props;
|
|
15
|
+
const { content , iconAfter , iconBefore , expandIcon , as ='span' , aside , actions } = props;
|
|
16
16
|
const layoutRef = (0, _treeItemContext.useTreeItemContext_unstable)((ctx)=>ctx.layoutRef);
|
|
17
17
|
const expandIconRef = (0, _treeItemContext.useTreeItemContext_unstable)((ctx)=>ctx.expandIconRef);
|
|
18
18
|
const isActionsVisibleContext = (0, _treeItemContext.useTreeItemContext_unstable)((ctx)=>ctx.isActionsVisible);
|
|
@@ -26,6 +26,7 @@ const useTreeItemLayout_unstable = (props, ref)=>{
|
|
|
26
26
|
root: 'div',
|
|
27
27
|
expandIcon: 'div',
|
|
28
28
|
iconBefore: 'div',
|
|
29
|
+
content: 'div',
|
|
29
30
|
iconAfter: 'div',
|
|
30
31
|
actions: 'div',
|
|
31
32
|
aside: 'div'
|
|
@@ -42,6 +43,9 @@ const useTreeItemLayout_unstable = (props, ref)=>{
|
|
|
42
43
|
'aria-hidden': true
|
|
43
44
|
}
|
|
44
45
|
}),
|
|
46
|
+
content: (0, _reactUtilities.resolveShorthand)(content, {
|
|
47
|
+
required: true
|
|
48
|
+
}),
|
|
45
49
|
iconAfter: (0, _reactUtilities.resolveShorthand)(iconAfter, {
|
|
46
50
|
defaultProps: {
|
|
47
51
|
'aria-hidden': true
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["useTreeItemLayout.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, isResolvedShorthand, resolveShorthand, useMergedRefs } from '@fluentui/react-utilities';\nimport { useTreeItemContext_unstable } from '../../contexts/treeItemContext';\nimport { TreeItemChevron } from '../TreeItemChevron';\n/**\n * Create the state required to render TreeItemLayout.\n *\n * The returned state can be modified with hooks such as useTreeItemLayoutStyles_unstable,\n * before being passed to renderTreeItemLayout_unstable.\n *\n * @param props - props from this instance of TreeItemLayout\n * @param ref - reference to root HTMLElement of TreeItemLayout\n */ export const useTreeItemLayout_unstable = (props, ref)=>{\n const { iconAfter , iconBefore , expandIcon , as ='span' , aside , actions } = props;\n const layoutRef = useTreeItemContext_unstable((ctx)=>ctx.layoutRef);\n const expandIconRef = useTreeItemContext_unstable((ctx)=>ctx.expandIconRef);\n const isActionsVisibleContext = useTreeItemContext_unstable((ctx)=>ctx.isActionsVisible);\n const isAsideVisible = useTreeItemContext_unstable((ctx)=>ctx.isAsideVisible);\n var _ref;\n const isActionsVisible = (_ref = isResolvedShorthand(actions) ? actions.visible : undefined) !== null && _ref !== void 0 ? _ref : isActionsVisibleContext;\n const isBranch = useTreeItemContext_unstable((ctx)=>ctx.itemType === 'branch');\n const actionsRef = useMergedRefs(isResolvedShorthand(actions) ? actions.ref : undefined, useTreeItemContext_unstable((ctx)=>ctx.actionsRef));\n return {\n components: {\n root: 'div',\n expandIcon: 'div',\n iconBefore: 'div',\n iconAfter: 'div',\n actions: 'div',\n aside: 'div'\n },\n buttonContextValue: {\n size: 'small'\n },\n root: getNativeElementProps(as, {\n ...props,\n ref: useMergedRefs(ref, layoutRef)\n }),\n iconBefore: resolveShorthand(iconBefore, {\n defaultProps: {\n 'aria-hidden': true\n }\n }),\n iconAfter: resolveShorthand(iconAfter, {\n defaultProps: {\n 'aria-hidden': true\n }\n }),\n aside: isAsideVisible ? resolveShorthand(aside) : undefined,\n actions: isActionsVisible ? resolveShorthand(// visible props should not be propagated to the DOM\n isResolvedShorthand(actions) ? {\n ...actions,\n visible: undefined\n } : actions, {\n defaultProps: {\n ref: actionsRef\n }\n }) : undefined,\n expandIcon: resolveShorthand(expandIcon, {\n required: isBranch,\n defaultProps: {\n children: /*#__PURE__*/ React.createElement(TreeItemChevron, null),\n 'aria-hidden': true,\n ref: useMergedRefs(isResolvedShorthand(expandIcon) ? expandIcon.ref : undefined, expandIconRef)\n }\n })\n };\n};\n"],"names":["useTreeItemLayout_unstable","props","ref","iconAfter","iconBefore","expandIcon","as","aside","actions","layoutRef","useTreeItemContext_unstable","ctx","expandIconRef","isActionsVisibleContext","isActionsVisible","isAsideVisible","_ref","isResolvedShorthand","visible","undefined","isBranch","itemType","actionsRef","useMergedRefs","components","root","buttonContextValue","size","getNativeElementProps","resolveShorthand","defaultProps","required","children","React","createElement","TreeItemChevron"],"mappings":";;;;+BAYiBA;;aAAAA;;;6DAZM;gCACqE;iCAChD;iCACZ;AASrB,MAAMA,6BAA6B,CAACC,OAAOC,MAAM;IACxD,MAAM,EAAEC,UAAS,EAAGC,WAAU,EAAGC,WAAU,EAAGC,IAAI,OAAM,EAAGC,MAAK,EAAGC,QAAO,EAAG,
|
|
1
|
+
{"version":3,"sources":["useTreeItemLayout.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, isResolvedShorthand, resolveShorthand, useMergedRefs } from '@fluentui/react-utilities';\nimport { useTreeItemContext_unstable } from '../../contexts/treeItemContext';\nimport { TreeItemChevron } from '../TreeItemChevron';\n/**\n * Create the state required to render TreeItemLayout.\n *\n * The returned state can be modified with hooks such as useTreeItemLayoutStyles_unstable,\n * before being passed to renderTreeItemLayout_unstable.\n *\n * @param props - props from this instance of TreeItemLayout\n * @param ref - reference to root HTMLElement of TreeItemLayout\n */ export const useTreeItemLayout_unstable = (props, ref)=>{\n const { content , iconAfter , iconBefore , expandIcon , as ='span' , aside , actions } = props;\n const layoutRef = useTreeItemContext_unstable((ctx)=>ctx.layoutRef);\n const expandIconRef = useTreeItemContext_unstable((ctx)=>ctx.expandIconRef);\n const isActionsVisibleContext = useTreeItemContext_unstable((ctx)=>ctx.isActionsVisible);\n const isAsideVisible = useTreeItemContext_unstable((ctx)=>ctx.isAsideVisible);\n var _ref;\n const isActionsVisible = (_ref = isResolvedShorthand(actions) ? actions.visible : undefined) !== null && _ref !== void 0 ? _ref : isActionsVisibleContext;\n const isBranch = useTreeItemContext_unstable((ctx)=>ctx.itemType === 'branch');\n const actionsRef = useMergedRefs(isResolvedShorthand(actions) ? actions.ref : undefined, useTreeItemContext_unstable((ctx)=>ctx.actionsRef));\n return {\n components: {\n root: 'div',\n expandIcon: 'div',\n iconBefore: 'div',\n content: 'div',\n iconAfter: 'div',\n actions: 'div',\n aside: 'div'\n },\n buttonContextValue: {\n size: 'small'\n },\n root: getNativeElementProps(as, {\n ...props,\n ref: useMergedRefs(ref, layoutRef)\n }),\n iconBefore: resolveShorthand(iconBefore, {\n defaultProps: {\n 'aria-hidden': true\n }\n }),\n content: resolveShorthand(content, {\n required: true\n }),\n iconAfter: resolveShorthand(iconAfter, {\n defaultProps: {\n 'aria-hidden': true\n }\n }),\n aside: isAsideVisible ? resolveShorthand(aside) : undefined,\n actions: isActionsVisible ? resolveShorthand(// visible props should not be propagated to the DOM\n isResolvedShorthand(actions) ? {\n ...actions,\n visible: undefined\n } : actions, {\n defaultProps: {\n ref: actionsRef\n }\n }) : undefined,\n expandIcon: resolveShorthand(expandIcon, {\n required: isBranch,\n defaultProps: {\n children: /*#__PURE__*/ React.createElement(TreeItemChevron, null),\n 'aria-hidden': true,\n ref: useMergedRefs(isResolvedShorthand(expandIcon) ? expandIcon.ref : undefined, expandIconRef)\n }\n })\n };\n};\n"],"names":["useTreeItemLayout_unstable","props","ref","content","iconAfter","iconBefore","expandIcon","as","aside","actions","layoutRef","useTreeItemContext_unstable","ctx","expandIconRef","isActionsVisibleContext","isActionsVisible","isAsideVisible","_ref","isResolvedShorthand","visible","undefined","isBranch","itemType","actionsRef","useMergedRefs","components","root","buttonContextValue","size","getNativeElementProps","resolveShorthand","defaultProps","required","children","React","createElement","TreeItemChevron"],"mappings":";;;;+BAYiBA;;aAAAA;;;6DAZM;gCACqE;iCAChD;iCACZ;AASrB,MAAMA,6BAA6B,CAACC,OAAOC,MAAM;IACxD,MAAM,EAAEC,QAAO,EAAGC,UAAS,EAAGC,WAAU,EAAGC,WAAU,EAAGC,IAAI,OAAM,EAAGC,MAAK,EAAGC,QAAO,EAAG,GAAGR;IAC1F,MAAMS,YAAYC,IAAAA,4CAA2B,EAAC,CAACC,MAAMA,IAAIF,SAAS;IAClE,MAAMG,gBAAgBF,IAAAA,4CAA2B,EAAC,CAACC,MAAMA,IAAIC,aAAa;IAC1E,MAAMC,0BAA0BH,IAAAA,4CAA2B,EAAC,CAACC,MAAMA,IAAIG,gBAAgB;IACvF,MAAMC,iBAAiBL,IAAAA,4CAA2B,EAAC,CAACC,MAAMA,IAAII,cAAc;IAC5E,IAAIC;IACJ,MAAMF,mBAAmB,AAACE,CAAAA,OAAOC,IAAAA,mCAAmB,EAACT,WAAWA,QAAQU,OAAO,GAAGC,SAAS,AAAD,MAAO,IAAI,IAAIH,SAAS,KAAK,IAAIA,OAAOH,uBAAuB;IACzJ,MAAMO,WAAWV,IAAAA,4CAA2B,EAAC,CAACC,MAAMA,IAAIU,QAAQ,KAAK;IACrE,MAAMC,aAAaC,IAAAA,6BAAa,EAACN,IAAAA,mCAAmB,EAACT,WAAWA,QAAQP,GAAG,GAAGkB,SAAS,EAAET,IAAAA,4CAA2B,EAAC,CAACC,MAAMA,IAAIW,UAAU;IAC1I,OAAO;QACHE,YAAY;YACRC,MAAM;YACNpB,YAAY;YACZD,YAAY;YACZF,SAAS;YACTC,WAAW;YACXK,SAAS;YACTD,OAAO;QACX;QACAmB,oBAAoB;YAChBC,MAAM;QACV;QACAF,MAAMG,IAAAA,qCAAqB,EAACtB,IAAI;YAC5B,GAAGN,KAAK;YACRC,KAAKsB,IAAAA,6BAAa,EAACtB,KAAKQ;QAC5B;QACAL,YAAYyB,IAAAA,gCAAgB,EAACzB,YAAY;YACrC0B,cAAc;gBACV,eAAe,IAAI;YACvB;QACJ;QACA5B,SAAS2B,IAAAA,gCAAgB,EAAC3B,SAAS;YAC/B6B,UAAU,IAAI;QAClB;QACA5B,WAAW0B,IAAAA,gCAAgB,EAAC1B,WAAW;YACnC2B,cAAc;gBACV,eAAe,IAAI;YACvB;QACJ;QACAvB,OAAOQ,iBAAiBc,IAAAA,gCAAgB,EAACtB,SAASY,SAAS;QAC3DX,SAASM,mBAAmBe,IAAAA,gCAAgB,EAC5CZ,IAAAA,mCAAmB,EAACT,WAAW;YAC3B,GAAGA,OAAO;YACVU,SAASC;QACb,IAAIX,OAAO,EAAE;YACTsB,cAAc;gBACV7B,KAAKqB;YACT;QACJ,KAAKH,SAAS;QACdd,YAAYwB,IAAAA,gCAAgB,EAACxB,YAAY;YACrC0B,UAAUX;YACVU,cAAc;gBACVE,UAAU,WAAW,GAAGC,OAAMC,aAAa,CAACC,gCAAe,EAAE,IAAI;gBACjE,eAAe,IAAI;gBACnBlC,KAAKsB,IAAAA,6BAAa,EAACN,IAAAA,mCAAmB,EAACZ,cAAcA,WAAWJ,GAAG,GAAGkB,SAAS,EAAEP;YACrF;QACJ;IACJ;AACJ"}
|
|
@@ -18,6 +18,7 @@ const _treeItemContext = require("../../contexts/treeItemContext");
|
|
|
18
18
|
const treeItemLayoutClassNames = {
|
|
19
19
|
root: 'fui-TreeItemLayout',
|
|
20
20
|
iconBefore: 'fui-TreeItemLayout__iconBefore',
|
|
21
|
+
content: 'fui-TreeItemLayout__content',
|
|
21
22
|
iconAfter: 'fui-TreeItemLayout__iconAfter',
|
|
22
23
|
expandIcon: 'fui-TreeItemLayout__expandIcon',
|
|
23
24
|
aside: 'fui-TreeItemLayout__aside',
|
|
@@ -71,14 +72,12 @@ const treeItemLayoutClassNames = {
|
|
|
71
72
|
]
|
|
72
73
|
},
|
|
73
74
|
medium: {
|
|
74
|
-
i8kkvl: "f1rjii52",
|
|
75
75
|
Bahqtrf: "fk6fouc",
|
|
76
76
|
Be2twd7: "fkhj508",
|
|
77
77
|
Bhrd7zp: "figsok6",
|
|
78
78
|
Bg96gwp: "f1i3iumi"
|
|
79
79
|
},
|
|
80
80
|
small: {
|
|
81
|
-
i8kkvl: "f1ufnopg",
|
|
82
81
|
sshi5w: "f1pha7fy",
|
|
83
82
|
Bahqtrf: "fk6fouc",
|
|
84
83
|
Be2twd7: "fy9rknc",
|
|
@@ -113,12 +112,10 @@ const treeItemLayoutClassNames = {
|
|
|
113
112
|
".faevyjx{padding-right:calc(var(--fluent-TreeItem--level, 1) * var(--spacingHorizontalXXL));}",
|
|
114
113
|
".fo100m9{padding-left:calc((var(--fluent-TreeItem--level, 1) - 1) * var(--spacingHorizontalXXL));}",
|
|
115
114
|
".f6yw3pu{padding-right:calc((var(--fluent-TreeItem--level, 1) - 1) * var(--spacingHorizontalXXL));}",
|
|
116
|
-
".f1rjii52{-webkit-column-gap:var(--spacingHorizontalSNudge);column-gap:var(--spacingHorizontalSNudge);}",
|
|
117
115
|
".fk6fouc{font-family:var(--fontFamilyBase);}",
|
|
118
116
|
".fkhj508{font-size:var(--fontSizeBase300);}",
|
|
119
117
|
".figsok6{font-weight:var(--fontWeightRegular);}",
|
|
120
118
|
".f1i3iumi{line-height:var(--lineHeightBase300);}",
|
|
121
|
-
".f1ufnopg{-webkit-column-gap:var(--spacingHorizontalXS);column-gap:var(--spacingHorizontalXS);}",
|
|
122
119
|
".f1pha7fy{min-height:24px;}",
|
|
123
120
|
".fy9rknc{font-size:var(--fontSizeBase200);}",
|
|
124
121
|
".fwrc4pm{line-height:var(--lineHeightBase200);}",
|
|
@@ -139,27 +136,6 @@ const treeItemLayoutClassNames = {
|
|
|
139
136
|
".fjxutwb:hover{background-color:var(--colorTransparentBackgroundHover);}"
|
|
140
137
|
]
|
|
141
138
|
});
|
|
142
|
-
/**
|
|
143
|
-
* Styles for the before/after icon slot
|
|
144
|
-
*/ const useIconStyles = /*#__PURE__*/ (0, _react["__styles"])({
|
|
145
|
-
base: {
|
|
146
|
-
mc9l5x: "f22iagw",
|
|
147
|
-
Bt984gj: "f122n59",
|
|
148
|
-
sj55zd: "fkfq4zb",
|
|
149
|
-
Bg96gwp: "f106mvju",
|
|
150
|
-
Be2twd7: "f1pp30po"
|
|
151
|
-
},
|
|
152
|
-
iconBefore: {},
|
|
153
|
-
iconAfter: {}
|
|
154
|
-
}, {
|
|
155
|
-
d: [
|
|
156
|
-
".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}",
|
|
157
|
-
".f122n59{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}",
|
|
158
|
-
".fkfq4zb{color:var(--colorNeutralForeground2);}",
|
|
159
|
-
".f106mvju{line-height:var(--lineHeightBase500);}",
|
|
160
|
-
".f1pp30po{font-size:var(--fontSizeBase500);}"
|
|
161
|
-
]
|
|
162
|
-
});
|
|
163
139
|
/**
|
|
164
140
|
* Styles for the action icon slot
|
|
165
141
|
*/ const useActionsStyles = /*#__PURE__*/ (0, _react["__styles"])({
|
|
@@ -291,22 +267,113 @@ const treeItemLayoutClassNames = {
|
|
|
291
267
|
".f14wxoun{padding-bottom:var(--spacingVerticalXS);}"
|
|
292
268
|
]
|
|
293
269
|
});
|
|
270
|
+
/**
|
|
271
|
+
* Styles for the content slot
|
|
272
|
+
*/ const useContentStyles = /*#__PURE__*/ (0, _react["__styles"])({
|
|
273
|
+
base: {
|
|
274
|
+
z8tnut: "f1g0x7ka",
|
|
275
|
+
z189sj: [
|
|
276
|
+
"ffczdla",
|
|
277
|
+
"fgiv446"
|
|
278
|
+
],
|
|
279
|
+
Byoj8tv: "f1qch9an",
|
|
280
|
+
uwmqm3: [
|
|
281
|
+
"fgiv446",
|
|
282
|
+
"ffczdla"
|
|
283
|
+
]
|
|
284
|
+
}
|
|
285
|
+
}, {
|
|
286
|
+
d: [
|
|
287
|
+
".f1g0x7ka{padding-top:0;}",
|
|
288
|
+
".ffczdla{padding-right:var(--spacingHorizontalXXS);}",
|
|
289
|
+
".fgiv446{padding-left:var(--spacingHorizontalXXS);}",
|
|
290
|
+
".f1qch9an{padding-bottom:0;}"
|
|
291
|
+
]
|
|
292
|
+
});
|
|
293
|
+
/**
|
|
294
|
+
* Styles for the before/after icon slot
|
|
295
|
+
*/ const useIconStyles = /*#__PURE__*/ (0, _react["__styles"])({
|
|
296
|
+
base: {
|
|
297
|
+
mc9l5x: "f22iagw",
|
|
298
|
+
Bt984gj: "f122n59",
|
|
299
|
+
sj55zd: "fkfq4zb",
|
|
300
|
+
Bg96gwp: "f106mvju",
|
|
301
|
+
Be2twd7: "f1pp30po"
|
|
302
|
+
}
|
|
303
|
+
}, {
|
|
304
|
+
d: [
|
|
305
|
+
".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}",
|
|
306
|
+
".f122n59{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}",
|
|
307
|
+
".fkfq4zb{color:var(--colorNeutralForeground2);}",
|
|
308
|
+
".f106mvju{line-height:var(--lineHeightBase500);}",
|
|
309
|
+
".f1pp30po{font-size:var(--fontSizeBase500);}"
|
|
310
|
+
]
|
|
311
|
+
});
|
|
312
|
+
const useIconBeforeStyles = /*#__PURE__*/ (0, _react["__styles"])({
|
|
313
|
+
medium: {
|
|
314
|
+
z189sj: [
|
|
315
|
+
"f7x41pl",
|
|
316
|
+
"fruq291"
|
|
317
|
+
]
|
|
318
|
+
},
|
|
319
|
+
small: {
|
|
320
|
+
z189sj: [
|
|
321
|
+
"ffczdla",
|
|
322
|
+
"fgiv446"
|
|
323
|
+
]
|
|
324
|
+
}
|
|
325
|
+
}, {
|
|
326
|
+
d: [
|
|
327
|
+
".f7x41pl{padding-right:var(--spacingHorizontalXS);}",
|
|
328
|
+
".fruq291{padding-left:var(--spacingHorizontalXS);}",
|
|
329
|
+
".ffczdla{padding-right:var(--spacingHorizontalXXS);}",
|
|
330
|
+
".fgiv446{padding-left:var(--spacingHorizontalXXS);}"
|
|
331
|
+
]
|
|
332
|
+
});
|
|
333
|
+
const useIconAfterStyles = /*#__PURE__*/ (0, _react["__styles"])({
|
|
334
|
+
medium: {
|
|
335
|
+
uwmqm3: [
|
|
336
|
+
"fruq291",
|
|
337
|
+
"f7x41pl"
|
|
338
|
+
]
|
|
339
|
+
},
|
|
340
|
+
small: {
|
|
341
|
+
uwmqm3: [
|
|
342
|
+
"fgiv446",
|
|
343
|
+
"ffczdla"
|
|
344
|
+
]
|
|
345
|
+
}
|
|
346
|
+
}, {
|
|
347
|
+
d: [
|
|
348
|
+
".fruq291{padding-left:var(--spacingHorizontalXS);}",
|
|
349
|
+
".f7x41pl{padding-right:var(--spacingHorizontalXS);}",
|
|
350
|
+
".fgiv446{padding-left:var(--spacingHorizontalXXS);}",
|
|
351
|
+
".ffczdla{padding-right:var(--spacingHorizontalXXS);}"
|
|
352
|
+
]
|
|
353
|
+
});
|
|
294
354
|
const useTreeItemLayoutStyles_unstable = (state)=>{
|
|
295
|
-
const { iconAfter , iconBefore , root } = state;
|
|
355
|
+
const { content , iconAfter , iconBefore , expandIcon , root } = state;
|
|
296
356
|
const rootStyles = useRootStyles();
|
|
297
|
-
const iconStyles = useIconStyles();
|
|
298
357
|
const actionsStyles = useActionsStyles();
|
|
299
358
|
const asideStyles = useAsideStyles();
|
|
359
|
+
const contentStyles = useContentStyles();
|
|
300
360
|
const expandIconStyles = useExpandIconStyles();
|
|
361
|
+
const iconStyles = useIconStyles();
|
|
362
|
+
const iconBeforeStyles = useIconBeforeStyles();
|
|
363
|
+
const iconAfterStyles = useIconAfterStyles();
|
|
301
364
|
const size = (0, _treeContext.useTreeContext_unstable)((ctx)=>ctx.size);
|
|
302
365
|
const appearance = (0, _treeContext.useTreeContext_unstable)((ctx)=>ctx.appearance);
|
|
303
366
|
const itemType = (0, _treeItemContext.useTreeItemContext_unstable)((ctx)=>ctx.itemType);
|
|
304
367
|
root.className = (0, _react.mergeClasses)(treeItemLayoutClassNames.root, rootStyles.base, rootStyles[appearance], rootStyles[size], rootStyles[itemType], root.className);
|
|
368
|
+
content.className = (0, _react.mergeClasses)(treeItemLayoutClassNames.content, contentStyles.base, content.className);
|
|
369
|
+
if (expandIcon) {
|
|
370
|
+
expandIcon.className = (0, _react.mergeClasses)(treeItemLayoutClassNames.expandIcon, expandIconStyles.base, expandIcon.className);
|
|
371
|
+
}
|
|
305
372
|
if (iconBefore) {
|
|
306
|
-
iconBefore.className = (0, _react.mergeClasses)(treeItemLayoutClassNames.iconBefore, iconStyles.base,
|
|
373
|
+
iconBefore.className = (0, _react.mergeClasses)(treeItemLayoutClassNames.iconBefore, iconStyles.base, iconBeforeStyles[size], iconBefore.className);
|
|
307
374
|
}
|
|
308
375
|
if (iconAfter) {
|
|
309
|
-
iconAfter.className = (0, _react.mergeClasses)(treeItemLayoutClassNames.iconAfter, iconStyles.base,
|
|
376
|
+
iconAfter.className = (0, _react.mergeClasses)(treeItemLayoutClassNames.iconAfter, iconStyles.base, iconAfterStyles[size], iconAfter.className);
|
|
310
377
|
}
|
|
311
378
|
if (state.actions) {
|
|
312
379
|
state.actions.className = (0, _react.mergeClasses)(treeItemLayoutClassNames.actions, actionsStyles.base, state.actions.className);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["useTreeItemLayoutStyles.styles.js"],"sourcesContent":["import { __styles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport { useTreeContext_unstable } from '../../contexts/treeContext';\nimport { treeItemLevelToken } from '../../utils/tokens';\nimport { useTreeItemContext_unstable } from '../../contexts/treeItemContext';\nexport const treeItemLayoutClassNames = {\n root: 'fui-TreeItemLayout',\n iconBefore: 'fui-TreeItemLayout__iconBefore',\n iconAfter: 'fui-TreeItemLayout__iconAfter',\n expandIcon: 'fui-TreeItemLayout__expandIcon',\n aside: 'fui-TreeItemLayout__aside',\n actions: 'fui-TreeItemLayout__actions'\n};\n/**\n * Styles for the root slot\n */\nconst useRootStyles = /*#__PURE__*/__styles({\n base: {\n mc9l5x: \"f22iagw\",\n Bt984gj: \"f122n59\",\n sshi5w: \"f1nxs5xn\",\n B7ck84d: \"f1ewtqcl\",\n Ijaq50: \"f15ws6j\",\n Br312pm: \"f135tdbu\",\n nk6f5a: \"f2e2169\",\n Bw0ie65: \"f4rqp6x\",\n Bbmb7ep: [\"f1aa9q02\", \"f16jpd5f\"],\n Beyfa6y: [\"f16jpd5f\", \"f1aa9q02\"],\n B7oj6ja: [\"f1jar5jt\", \"fyu767a\"],\n Btl43ni: [\"fyu767a\", \"f1jar5jt\"],\n lj723h: \"flvvhsy\",\n ecr2s2: \"f1wfn5kd\",\n qya0sb: \"f1ih54s9\",\n Bi91k9c: \"fnwyq0v\",\n Jwef8y: \"f1t94bn6\",\n Becwuud: \"f1jk1nfw\"\n },\n leaf: {\n uwmqm3: [\"f1k1erfc\", \"faevyjx\"]\n },\n branch: {\n uwmqm3: [\"fo100m9\", \"f6yw3pu\"]\n },\n medium: {\n i8kkvl: \"f1rjii52\",\n Bahqtrf: \"fk6fouc\",\n Be2twd7: \"fkhj508\",\n Bhrd7zp: \"figsok6\",\n Bg96gwp: \"f1i3iumi\"\n },\n small: {\n i8kkvl: \"f1ufnopg\",\n sshi5w: \"f1pha7fy\",\n Bahqtrf: \"fk6fouc\",\n Be2twd7: \"fy9rknc\",\n Bhrd7zp: \"figsok6\",\n Bg96gwp: \"fwrc4pm\"\n },\n subtle: {},\n \"subtle-alpha\": {\n Jwef8y: \"f146ro5n\",\n ecr2s2: \"fkam630\"\n },\n transparent: {\n De3pzq: \"f1c21dwh\",\n Jwef8y: \"fjxutwb\",\n ecr2s2: \"fophhak\"\n }\n}, {\n d: [\".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}\", \".f122n59{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}\", \".f1nxs5xn{min-height:32px;}\", \".f1ewtqcl{box-sizing:border-box;}\", \".f15ws6j{grid-row-start:layout;}\", \".f135tdbu{grid-column-start:layout;}\", \".f2e2169{grid-row-end:layout;}\", \".f4rqp6x{grid-column-end:layout;}\", \".f1aa9q02{border-bottom-right-radius:var(--borderRadiusMedium);}\", \".f16jpd5f{border-bottom-left-radius:var(--borderRadiusMedium);}\", \".f1jar5jt{border-top-right-radius:var(--borderRadiusMedium);}\", \".fyu767a{border-top-left-radius:var(--borderRadiusMedium);}\", \".f1k1erfc{padding-left:calc(var(--fluent-TreeItem--level, 1) * var(--spacingHorizontalXXL));}\", \".faevyjx{padding-right:calc(var(--fluent-TreeItem--level, 1) * var(--spacingHorizontalXXL));}\", \".fo100m9{padding-left:calc((var(--fluent-TreeItem--level, 1) - 1) * var(--spacingHorizontalXXL));}\", \".f6yw3pu{padding-right:calc((var(--fluent-TreeItem--level, 1) - 1) * var(--spacingHorizontalXXL));}\", \".f1rjii52{-webkit-column-gap:var(--spacingHorizontalSNudge);column-gap:var(--spacingHorizontalSNudge);}\", \".fk6fouc{font-family:var(--fontFamilyBase);}\", \".fkhj508{font-size:var(--fontSizeBase300);}\", \".figsok6{font-weight:var(--fontWeightRegular);}\", \".f1i3iumi{line-height:var(--lineHeightBase300);}\", \".f1ufnopg{-webkit-column-gap:var(--spacingHorizontalXS);column-gap:var(--spacingHorizontalXS);}\", \".f1pha7fy{min-height:24px;}\", \".fy9rknc{font-size:var(--fontSizeBase200);}\", \".fwrc4pm{line-height:var(--lineHeightBase200);}\", \".f1c21dwh{background-color:var(--colorTransparentBackground);}\"],\n a: [\".flvvhsy:active{color:var(--colorNeutralForeground2Pressed);}\", \".f1wfn5kd:active{background-color:var(--colorSubtleBackgroundPressed);}\", \".f1ih54s9:active .fui-TreeItemLayout__expandIcon{color:var(--colorNeutralForeground3Pressed);}\", \".fkam630:active{background-color:var(--colorSubtleBackgroundLightAlphaPressed);}\", \".fophhak:active{background-color:var(--colorTransparentBackgroundPressed);}\"],\n h: [\".fnwyq0v:hover{color:var(--colorNeutralForeground2Hover);}\", \".f1t94bn6:hover{background-color:var(--colorSubtleBackgroundHover);}\", \".f1jk1nfw:hover .fui-TreeItemLayout__expandIcon{color:var(--colorNeutralForeground3Hover);}\", \".f146ro5n:hover{background-color:var(--colorSubtleBackgroundLightAlphaHover);}\", \".fjxutwb:hover{background-color:var(--colorTransparentBackgroundHover);}\"]\n});\n/**\n * Styles for the before/after icon slot\n */\nconst useIconStyles = /*#__PURE__*/__styles({\n base: {\n mc9l5x: \"f22iagw\",\n Bt984gj: \"f122n59\",\n sj55zd: \"fkfq4zb\",\n Bg96gwp: \"f106mvju\",\n Be2twd7: \"f1pp30po\"\n },\n iconBefore: {},\n iconAfter: {}\n}, {\n d: [\".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}\", \".f122n59{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}\", \".fkfq4zb{color:var(--colorNeutralForeground2);}\", \".f106mvju{line-height:var(--lineHeightBase500);}\", \".f1pp30po{font-size:var(--fontSizeBase500);}\"]\n});\n/**\n * Styles for the action icon slot\n */\nconst useActionsStyles = /*#__PURE__*/__styles({\n base: {\n mc9l5x: \"f22iagw\",\n Frg6f3: [\"fcgxt0o\", \"f1ujusj6\"],\n qhf8xq: \"f10pi13n\",\n Bj3rh1h: \"f19g0ac\",\n Ijaq50: \"fobksn0\",\n Br312pm: \"fmy5l6f\",\n nk6f5a: \"fzqypwc\",\n Bw0ie65: \"f1tmftl3\",\n z8tnut: \"f1g0x7ka\",\n z189sj: [\"f1vdfbxk\", \"f1f5gg8d\"],\n Byoj8tv: \"f1qch9an\",\n uwmqm3: [\"f1f5gg8d\", \"f1vdfbxk\"]\n }\n}, {\n d: [\".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}\", \".fcgxt0o{margin-left:auto;}\", \".f1ujusj6{margin-right:auto;}\", \".f10pi13n{position:relative;}\", \".f19g0ac{z-index:1;}\", \".fobksn0{grid-row-start:aside;}\", \".fmy5l6f{grid-column-start:aside;}\", \".fzqypwc{grid-row-end:aside;}\", \".f1tmftl3{grid-column-end:aside;}\", \".f1g0x7ka{padding-top:0;}\", \".f1vdfbxk{padding-right:var(--spacingHorizontalS);}\", \".f1f5gg8d{padding-left:var(--spacingHorizontalS);}\", \".f1qch9an{padding-bottom:0;}\"]\n});\n/**\n * Styles for the action icon slot\n */\nconst useAsideStyles = /*#__PURE__*/__styles({\n base: {\n mc9l5x: \"f22iagw\",\n Frg6f3: [\"fcgxt0o\", \"f1ujusj6\"],\n Bt984gj: \"f122n59\",\n Bj3rh1h: \"f11zp4z2\",\n Ijaq50: \"fobksn0\",\n Br312pm: \"fmy5l6f\",\n nk6f5a: \"fzqypwc\",\n Bw0ie65: \"f1tmftl3\",\n z8tnut: \"f1g0x7ka\",\n z189sj: [\"fw5db7e\", \"f1uw59to\"],\n Byoj8tv: \"f1qch9an\",\n uwmqm3: [\"f1uw59to\", \"fw5db7e\"],\n i8kkvl: \"f1ufnopg\",\n Belr9w4: \"f14sijuj\"\n }\n}, {\n d: [\".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}\", \".fcgxt0o{margin-left:auto;}\", \".f1ujusj6{margin-right:auto;}\", \".f122n59{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}\", \".f11zp4z2{z-index:0;}\", \".fobksn0{grid-row-start:aside;}\", \".fmy5l6f{grid-column-start:aside;}\", \".fzqypwc{grid-row-end:aside;}\", \".f1tmftl3{grid-column-end:aside;}\", \".f1g0x7ka{padding-top:0;}\", \".fw5db7e{padding-right:var(--spacingHorizontalM);}\", \".f1uw59to{padding-left:var(--spacingHorizontalM);}\", \".f1qch9an{padding-bottom:0;}\", \".f1ufnopg{-webkit-column-gap:var(--spacingHorizontalXS);column-gap:var(--spacingHorizontalXS);}\", \".f14sijuj{row-gap:var(--spacingHorizontalXS);}\"]\n});\n/**\n * Styles for the expand icon slot\n */\nconst useExpandIconStyles = /*#__PURE__*/__styles({\n base: {\n mc9l5x: \"f22iagw\",\n Bt984gj: \"f122n59\",\n Brf1p80: \"f4d9j23\",\n Bf4jedk: \"f17fgpbq\",\n B7ck84d: \"f1ewtqcl\",\n sj55zd: \"f11d4kpn\",\n Bh6795r: \"f1jhi6b8\",\n Bnnss6s: \"fi64zpg\",\n xawz: \"f1rmlqtg\",\n z8tnut: \"f1ywm7hm\",\n z189sj: [\"fhxju0i\", \"f1cnd47f\"],\n Byoj8tv: \"f14wxoun\",\n uwmqm3: [\"f1cnd47f\", \"fhxju0i\"]\n }\n}, {\n d: [\".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}\", \".f122n59{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}\", \".f4d9j23{-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;}\", \".f17fgpbq{min-width:24px;}\", \".f1ewtqcl{box-sizing:border-box;}\", \".f11d4kpn{color:var(--colorNeutralForeground3);}\", \".f1jhi6b8{-webkit-box-flex:0;-webkit-flex-grow:0;-ms-flex-positive:0;flex-grow:0;}\", \".fi64zpg{-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;}\", \".f1rmlqtg{-webkit-flex-basis:auto;-ms-flex-preferred-size:auto;flex-basis:auto;}\", \".f1ywm7hm{padding-top:var(--spacingVerticalXS);}\", \".fhxju0i{padding-right:0;}\", \".f1cnd47f{padding-left:0;}\", \".f14wxoun{padding-bottom:var(--spacingVerticalXS);}\"]\n});\n/**\n * Apply styling to the TreeItemLayout slots based on the state\n */\nexport const useTreeItemLayoutStyles_unstable = state => {\n const {\n iconAfter,\n iconBefore,\n root\n } = state;\n const rootStyles = useRootStyles();\n const iconStyles = useIconStyles();\n const actionsStyles = useActionsStyles();\n const asideStyles = useAsideStyles();\n const expandIconStyles = useExpandIconStyles();\n const size = useTreeContext_unstable(ctx => ctx.size);\n const appearance = useTreeContext_unstable(ctx => ctx.appearance);\n const itemType = useTreeItemContext_unstable(ctx => ctx.itemType);\n root.className = mergeClasses(treeItemLayoutClassNames.root, rootStyles.base, rootStyles[appearance], rootStyles[size], rootStyles[itemType], root.className);\n if (iconBefore) {\n iconBefore.className = mergeClasses(treeItemLayoutClassNames.iconBefore, iconStyles.base, iconStyles.iconBefore, iconBefore.className);\n }\n if (iconAfter) {\n iconAfter.className = mergeClasses(treeItemLayoutClassNames.iconAfter, iconStyles.base, iconStyles.iconAfter, iconAfter.className);\n }\n if (state.actions) {\n state.actions.className = mergeClasses(treeItemLayoutClassNames.actions, actionsStyles.base, state.actions.className);\n }\n if (state.aside) {\n state.aside.className = mergeClasses(treeItemLayoutClassNames.aside, asideStyles.base, state.aside.className);\n }\n if (state.expandIcon) {\n state.expandIcon.className = mergeClasses(treeItemLayoutClassNames.expandIcon, expandIconStyles.base, state.expandIcon.className);\n }\n return state;\n};\n//# sourceMappingURL=useTreeItemLayoutStyles.styles.js.map"],"names":["treeItemLayoutClassNames","useTreeItemLayoutStyles_unstable","root","iconBefore","iconAfter","expandIcon","aside","actions","useRootStyles","__styles","base","mc9l5x","Bt984gj","sshi5w","B7ck84d","Ijaq50","Br312pm","nk6f5a","Bw0ie65","Bbmb7ep","Beyfa6y","B7oj6ja","Btl43ni","lj723h","ecr2s2","qya0sb","Bi91k9c","Jwef8y","Becwuud","leaf","uwmqm3","branch","medium","i8kkvl","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","small","subtle","transparent","De3pzq","d","a","h","useIconStyles","sj55zd","useActionsStyles","Frg6f3","qhf8xq","Bj3rh1h","z8tnut","z189sj","Byoj8tv","useAsideStyles","Belr9w4","useExpandIconStyles","Brf1p80","Bf4jedk","Bh6795r","Bnnss6s","xawz","state","rootStyles","iconStyles","actionsStyles","asideStyles","expandIconStyles","size","useTreeContext_unstable","ctx","appearance","itemType","useTreeItemContext_unstable","className","mergeClasses"],"mappings":"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"}
|
|
1
|
+
{"version":3,"sources":["useTreeItemLayoutStyles.styles.js"],"sourcesContent":["import { __styles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport { useTreeContext_unstable } from '../../contexts/treeContext';\nimport { treeItemLevelToken } from '../../utils/tokens';\nimport { useTreeItemContext_unstable } from '../../contexts/treeItemContext';\nexport const treeItemLayoutClassNames = {\n root: 'fui-TreeItemLayout',\n iconBefore: 'fui-TreeItemLayout__iconBefore',\n content: 'fui-TreeItemLayout__content',\n iconAfter: 'fui-TreeItemLayout__iconAfter',\n expandIcon: 'fui-TreeItemLayout__expandIcon',\n aside: 'fui-TreeItemLayout__aside',\n actions: 'fui-TreeItemLayout__actions'\n};\n/**\n * Styles for the root slot\n */\nconst useRootStyles = /*#__PURE__*/__styles({\n base: {\n mc9l5x: \"f22iagw\",\n Bt984gj: \"f122n59\",\n sshi5w: \"f1nxs5xn\",\n B7ck84d: \"f1ewtqcl\",\n Ijaq50: \"f15ws6j\",\n Br312pm: \"f135tdbu\",\n nk6f5a: \"f2e2169\",\n Bw0ie65: \"f4rqp6x\",\n Bbmb7ep: [\"f1aa9q02\", \"f16jpd5f\"],\n Beyfa6y: [\"f16jpd5f\", \"f1aa9q02\"],\n B7oj6ja: [\"f1jar5jt\", \"fyu767a\"],\n Btl43ni: [\"fyu767a\", \"f1jar5jt\"],\n lj723h: \"flvvhsy\",\n ecr2s2: \"f1wfn5kd\",\n qya0sb: \"f1ih54s9\",\n Bi91k9c: \"fnwyq0v\",\n Jwef8y: \"f1t94bn6\",\n Becwuud: \"f1jk1nfw\"\n },\n leaf: {\n uwmqm3: [\"f1k1erfc\", \"faevyjx\"]\n },\n branch: {\n uwmqm3: [\"fo100m9\", \"f6yw3pu\"]\n },\n medium: {\n Bahqtrf: \"fk6fouc\",\n Be2twd7: \"fkhj508\",\n Bhrd7zp: \"figsok6\",\n Bg96gwp: \"f1i3iumi\"\n },\n small: {\n sshi5w: \"f1pha7fy\",\n Bahqtrf: \"fk6fouc\",\n Be2twd7: \"fy9rknc\",\n Bhrd7zp: \"figsok6\",\n Bg96gwp: \"fwrc4pm\"\n },\n subtle: {},\n \"subtle-alpha\": {\n Jwef8y: \"f146ro5n\",\n ecr2s2: \"fkam630\"\n },\n transparent: {\n De3pzq: \"f1c21dwh\",\n Jwef8y: \"fjxutwb\",\n ecr2s2: \"fophhak\"\n }\n}, {\n d: [\".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}\", \".f122n59{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}\", \".f1nxs5xn{min-height:32px;}\", \".f1ewtqcl{box-sizing:border-box;}\", \".f15ws6j{grid-row-start:layout;}\", \".f135tdbu{grid-column-start:layout;}\", \".f2e2169{grid-row-end:layout;}\", \".f4rqp6x{grid-column-end:layout;}\", \".f1aa9q02{border-bottom-right-radius:var(--borderRadiusMedium);}\", \".f16jpd5f{border-bottom-left-radius:var(--borderRadiusMedium);}\", \".f1jar5jt{border-top-right-radius:var(--borderRadiusMedium);}\", \".fyu767a{border-top-left-radius:var(--borderRadiusMedium);}\", \".f1k1erfc{padding-left:calc(var(--fluent-TreeItem--level, 1) * var(--spacingHorizontalXXL));}\", \".faevyjx{padding-right:calc(var(--fluent-TreeItem--level, 1) * var(--spacingHorizontalXXL));}\", \".fo100m9{padding-left:calc((var(--fluent-TreeItem--level, 1) - 1) * var(--spacingHorizontalXXL));}\", \".f6yw3pu{padding-right:calc((var(--fluent-TreeItem--level, 1) - 1) * var(--spacingHorizontalXXL));}\", \".fk6fouc{font-family:var(--fontFamilyBase);}\", \".fkhj508{font-size:var(--fontSizeBase300);}\", \".figsok6{font-weight:var(--fontWeightRegular);}\", \".f1i3iumi{line-height:var(--lineHeightBase300);}\", \".f1pha7fy{min-height:24px;}\", \".fy9rknc{font-size:var(--fontSizeBase200);}\", \".fwrc4pm{line-height:var(--lineHeightBase200);}\", \".f1c21dwh{background-color:var(--colorTransparentBackground);}\"],\n a: [\".flvvhsy:active{color:var(--colorNeutralForeground2Pressed);}\", \".f1wfn5kd:active{background-color:var(--colorSubtleBackgroundPressed);}\", \".f1ih54s9:active .fui-TreeItemLayout__expandIcon{color:var(--colorNeutralForeground3Pressed);}\", \".fkam630:active{background-color:var(--colorSubtleBackgroundLightAlphaPressed);}\", \".fophhak:active{background-color:var(--colorTransparentBackgroundPressed);}\"],\n h: [\".fnwyq0v:hover{color:var(--colorNeutralForeground2Hover);}\", \".f1t94bn6:hover{background-color:var(--colorSubtleBackgroundHover);}\", \".f1jk1nfw:hover .fui-TreeItemLayout__expandIcon{color:var(--colorNeutralForeground3Hover);}\", \".f146ro5n:hover{background-color:var(--colorSubtleBackgroundLightAlphaHover);}\", \".fjxutwb:hover{background-color:var(--colorTransparentBackgroundHover);}\"]\n});\n/**\n * Styles for the action icon slot\n */\nconst useActionsStyles = /*#__PURE__*/__styles({\n base: {\n mc9l5x: \"f22iagw\",\n Frg6f3: [\"fcgxt0o\", \"f1ujusj6\"],\n qhf8xq: \"f10pi13n\",\n Bj3rh1h: \"f19g0ac\",\n Ijaq50: \"fobksn0\",\n Br312pm: \"fmy5l6f\",\n nk6f5a: \"fzqypwc\",\n Bw0ie65: \"f1tmftl3\",\n z8tnut: \"f1g0x7ka\",\n z189sj: [\"f1vdfbxk\", \"f1f5gg8d\"],\n Byoj8tv: \"f1qch9an\",\n uwmqm3: [\"f1f5gg8d\", \"f1vdfbxk\"]\n }\n}, {\n d: [\".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}\", \".fcgxt0o{margin-left:auto;}\", \".f1ujusj6{margin-right:auto;}\", \".f10pi13n{position:relative;}\", \".f19g0ac{z-index:1;}\", \".fobksn0{grid-row-start:aside;}\", \".fmy5l6f{grid-column-start:aside;}\", \".fzqypwc{grid-row-end:aside;}\", \".f1tmftl3{grid-column-end:aside;}\", \".f1g0x7ka{padding-top:0;}\", \".f1vdfbxk{padding-right:var(--spacingHorizontalS);}\", \".f1f5gg8d{padding-left:var(--spacingHorizontalS);}\", \".f1qch9an{padding-bottom:0;}\"]\n});\n/**\n * Styles for the action icon slot\n */\nconst useAsideStyles = /*#__PURE__*/__styles({\n base: {\n mc9l5x: \"f22iagw\",\n Frg6f3: [\"fcgxt0o\", \"f1ujusj6\"],\n Bt984gj: \"f122n59\",\n Bj3rh1h: \"f11zp4z2\",\n Ijaq50: \"fobksn0\",\n Br312pm: \"fmy5l6f\",\n nk6f5a: \"fzqypwc\",\n Bw0ie65: \"f1tmftl3\",\n z8tnut: \"f1g0x7ka\",\n z189sj: [\"fw5db7e\", \"f1uw59to\"],\n Byoj8tv: \"f1qch9an\",\n uwmqm3: [\"f1uw59to\", \"fw5db7e\"],\n i8kkvl: \"f1ufnopg\",\n Belr9w4: \"f14sijuj\"\n }\n}, {\n d: [\".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}\", \".fcgxt0o{margin-left:auto;}\", \".f1ujusj6{margin-right:auto;}\", \".f122n59{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}\", \".f11zp4z2{z-index:0;}\", \".fobksn0{grid-row-start:aside;}\", \".fmy5l6f{grid-column-start:aside;}\", \".fzqypwc{grid-row-end:aside;}\", \".f1tmftl3{grid-column-end:aside;}\", \".f1g0x7ka{padding-top:0;}\", \".fw5db7e{padding-right:var(--spacingHorizontalM);}\", \".f1uw59to{padding-left:var(--spacingHorizontalM);}\", \".f1qch9an{padding-bottom:0;}\", \".f1ufnopg{-webkit-column-gap:var(--spacingHorizontalXS);column-gap:var(--spacingHorizontalXS);}\", \".f14sijuj{row-gap:var(--spacingHorizontalXS);}\"]\n});\n/**\n * Styles for the expand icon slot\n */\nconst useExpandIconStyles = /*#__PURE__*/__styles({\n base: {\n mc9l5x: \"f22iagw\",\n Bt984gj: \"f122n59\",\n Brf1p80: \"f4d9j23\",\n Bf4jedk: \"f17fgpbq\",\n B7ck84d: \"f1ewtqcl\",\n sj55zd: \"f11d4kpn\",\n Bh6795r: \"f1jhi6b8\",\n Bnnss6s: \"fi64zpg\",\n xawz: \"f1rmlqtg\",\n z8tnut: \"f1ywm7hm\",\n z189sj: [\"fhxju0i\", \"f1cnd47f\"],\n Byoj8tv: \"f14wxoun\",\n uwmqm3: [\"f1cnd47f\", \"fhxju0i\"]\n }\n}, {\n d: [\".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}\", \".f122n59{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}\", \".f4d9j23{-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;}\", \".f17fgpbq{min-width:24px;}\", \".f1ewtqcl{box-sizing:border-box;}\", \".f11d4kpn{color:var(--colorNeutralForeground3);}\", \".f1jhi6b8{-webkit-box-flex:0;-webkit-flex-grow:0;-ms-flex-positive:0;flex-grow:0;}\", \".fi64zpg{-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;}\", \".f1rmlqtg{-webkit-flex-basis:auto;-ms-flex-preferred-size:auto;flex-basis:auto;}\", \".f1ywm7hm{padding-top:var(--spacingVerticalXS);}\", \".fhxju0i{padding-right:0;}\", \".f1cnd47f{padding-left:0;}\", \".f14wxoun{padding-bottom:var(--spacingVerticalXS);}\"]\n});\n/**\n * Styles for the content slot\n */\nconst useContentStyles = /*#__PURE__*/__styles({\n base: {\n z8tnut: \"f1g0x7ka\",\n z189sj: [\"ffczdla\", \"fgiv446\"],\n Byoj8tv: \"f1qch9an\",\n uwmqm3: [\"fgiv446\", \"ffczdla\"]\n }\n}, {\n d: [\".f1g0x7ka{padding-top:0;}\", \".ffczdla{padding-right:var(--spacingHorizontalXXS);}\", \".fgiv446{padding-left:var(--spacingHorizontalXXS);}\", \".f1qch9an{padding-bottom:0;}\"]\n});\n/**\n * Styles for the before/after icon slot\n */\nconst useIconStyles = /*#__PURE__*/__styles({\n base: {\n mc9l5x: \"f22iagw\",\n Bt984gj: \"f122n59\",\n sj55zd: \"fkfq4zb\",\n Bg96gwp: \"f106mvju\",\n Be2twd7: \"f1pp30po\"\n }\n}, {\n d: [\".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}\", \".f122n59{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}\", \".fkfq4zb{color:var(--colorNeutralForeground2);}\", \".f106mvju{line-height:var(--lineHeightBase500);}\", \".f1pp30po{font-size:var(--fontSizeBase500);}\"]\n});\nconst useIconBeforeStyles = /*#__PURE__*/__styles({\n medium: {\n z189sj: [\"f7x41pl\", \"fruq291\"]\n },\n small: {\n z189sj: [\"ffczdla\", \"fgiv446\"]\n }\n}, {\n d: [\".f7x41pl{padding-right:var(--spacingHorizontalXS);}\", \".fruq291{padding-left:var(--spacingHorizontalXS);}\", \".ffczdla{padding-right:var(--spacingHorizontalXXS);}\", \".fgiv446{padding-left:var(--spacingHorizontalXXS);}\"]\n});\nconst useIconAfterStyles = /*#__PURE__*/__styles({\n medium: {\n uwmqm3: [\"fruq291\", \"f7x41pl\"]\n },\n small: {\n uwmqm3: [\"fgiv446\", \"ffczdla\"]\n }\n}, {\n d: [\".fruq291{padding-left:var(--spacingHorizontalXS);}\", \".f7x41pl{padding-right:var(--spacingHorizontalXS);}\", \".fgiv446{padding-left:var(--spacingHorizontalXXS);}\", \".ffczdla{padding-right:var(--spacingHorizontalXXS);}\"]\n});\n/**\n * Apply styling to the TreeItemLayout slots based on the state\n */\nexport const useTreeItemLayoutStyles_unstable = state => {\n const {\n content,\n iconAfter,\n iconBefore,\n expandIcon,\n root\n } = state;\n const rootStyles = useRootStyles();\n const actionsStyles = useActionsStyles();\n const asideStyles = useAsideStyles();\n const contentStyles = useContentStyles();\n const expandIconStyles = useExpandIconStyles();\n const iconStyles = useIconStyles();\n const iconBeforeStyles = useIconBeforeStyles();\n const iconAfterStyles = useIconAfterStyles();\n const size = useTreeContext_unstable(ctx => ctx.size);\n const appearance = useTreeContext_unstable(ctx => ctx.appearance);\n const itemType = useTreeItemContext_unstable(ctx => ctx.itemType);\n root.className = mergeClasses(treeItemLayoutClassNames.root, rootStyles.base, rootStyles[appearance], rootStyles[size], rootStyles[itemType], root.className);\n content.className = mergeClasses(treeItemLayoutClassNames.content, contentStyles.base, content.className);\n if (expandIcon) {\n expandIcon.className = mergeClasses(treeItemLayoutClassNames.expandIcon, expandIconStyles.base, expandIcon.className);\n }\n if (iconBefore) {\n iconBefore.className = mergeClasses(treeItemLayoutClassNames.iconBefore, iconStyles.base, iconBeforeStyles[size], iconBefore.className);\n }\n if (iconAfter) {\n iconAfter.className = mergeClasses(treeItemLayoutClassNames.iconAfter, iconStyles.base, iconAfterStyles[size], iconAfter.className);\n }\n if (state.actions) {\n state.actions.className = mergeClasses(treeItemLayoutClassNames.actions, actionsStyles.base, state.actions.className);\n }\n if (state.aside) {\n state.aside.className = mergeClasses(treeItemLayoutClassNames.aside, asideStyles.base, state.aside.className);\n }\n if (state.expandIcon) {\n state.expandIcon.className = mergeClasses(treeItemLayoutClassNames.expandIcon, expandIconStyles.base, state.expandIcon.className);\n }\n return state;\n};\n//# sourceMappingURL=useTreeItemLayoutStyles.styles.js.map"],"names":["treeItemLayoutClassNames","useTreeItemLayoutStyles_unstable","root","iconBefore","content","iconAfter","expandIcon","aside","actions","useRootStyles","__styles","base","mc9l5x","Bt984gj","sshi5w","B7ck84d","Ijaq50","Br312pm","nk6f5a","Bw0ie65","Bbmb7ep","Beyfa6y","B7oj6ja","Btl43ni","lj723h","ecr2s2","qya0sb","Bi91k9c","Jwef8y","Becwuud","leaf","uwmqm3","branch","medium","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","small","subtle","transparent","De3pzq","d","a","h","useActionsStyles","Frg6f3","qhf8xq","Bj3rh1h","z8tnut","z189sj","Byoj8tv","useAsideStyles","i8kkvl","Belr9w4","useExpandIconStyles","Brf1p80","Bf4jedk","sj55zd","Bh6795r","Bnnss6s","xawz","useContentStyles","useIconStyles","useIconBeforeStyles","useIconAfterStyles","state","rootStyles","actionsStyles","asideStyles","contentStyles","expandIconStyles","iconStyles","iconBeforeStyles","iconAfterStyles","size","useTreeContext_unstable","ctx","appearance","itemType","useTreeItemContext_unstable","className","mergeClasses"],"mappings":"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"}
|
|
@@ -14,7 +14,7 @@ const renderTreeItemPersonaLayout_unstable = (state, contextValues)=>{
|
|
|
14
14
|
const { slots , slotProps } = (0, _reactUtilities.getSlotsNext)(state);
|
|
15
15
|
return /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.root, slotProps.root, slots.expandIcon && /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.expandIcon, slotProps.expandIcon), /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(_reactAvatar.AvatarContextProvider, {
|
|
16
16
|
value: contextValues.avatar
|
|
17
|
-
}, /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.media, slotProps.media)), /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.
|
|
17
|
+
}, /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.media, slotProps.media)), /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.content, slotProps.content), slots.description && /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.description, slotProps.description), /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(_reactButton.ButtonContextProvider, {
|
|
18
18
|
value: state.buttonContextValue
|
|
19
19
|
}, slots.actions && /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.actions, slotProps.actions), slots.aside && /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.aside, slotProps.aside)));
|
|
20
20
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["renderTreeItemPersonaLayout.js"],"sourcesContent":["/** @jsxRuntime classic */ /** @jsx createElement */ import { createElement } from '@fluentui/react-jsx-runtime';\nimport { getSlotsNext } from '@fluentui/react-utilities';\nimport { AvatarContextProvider } from '@fluentui/react-avatar';\nimport { ButtonContextProvider } from '@fluentui/react-button';\n/**\n * Render the final JSX of TreeItemPersonaLayout\n */ export const renderTreeItemPersonaLayout_unstable = (state, contextValues)=>{\n const { slots , slotProps } = getSlotsNext(state);\n return /*#__PURE__*/ createElement(slots.root, slotProps.root, slots.expandIcon && /*#__PURE__*/ createElement(slots.expandIcon, slotProps.expandIcon), /*#__PURE__*/ createElement(AvatarContextProvider, {\n value: contextValues.avatar\n }, /*#__PURE__*/ createElement(slots.media, slotProps.media)), /*#__PURE__*/ createElement(slots.
|
|
1
|
+
{"version":3,"sources":["renderTreeItemPersonaLayout.js"],"sourcesContent":["/** @jsxRuntime classic */ /** @jsx createElement */ import { createElement } from '@fluentui/react-jsx-runtime';\nimport { getSlotsNext } from '@fluentui/react-utilities';\nimport { AvatarContextProvider } from '@fluentui/react-avatar';\nimport { ButtonContextProvider } from '@fluentui/react-button';\n/**\n * Render the final JSX of TreeItemPersonaLayout\n */ export const renderTreeItemPersonaLayout_unstable = (state, contextValues)=>{\n const { slots , slotProps } = getSlotsNext(state);\n return /*#__PURE__*/ createElement(slots.root, slotProps.root, slots.expandIcon && /*#__PURE__*/ createElement(slots.expandIcon, slotProps.expandIcon), /*#__PURE__*/ createElement(AvatarContextProvider, {\n value: contextValues.avatar\n }, /*#__PURE__*/ createElement(slots.media, slotProps.media)), /*#__PURE__*/ createElement(slots.content, slotProps.content), slots.description && /*#__PURE__*/ createElement(slots.description, slotProps.description), /*#__PURE__*/ createElement(ButtonContextProvider, {\n value: state.buttonContextValue\n }, slots.actions && /*#__PURE__*/ createElement(slots.actions, slotProps.actions), slots.aside && /*#__PURE__*/ createElement(slots.aside, slotProps.aside)));\n};\n"],"names":["renderTreeItemPersonaLayout_unstable","state","contextValues","slots","slotProps","getSlotsNext","createElement","root","expandIcon","AvatarContextProvider","value","avatar","media","content","description","ButtonContextProvider","buttonContextValue","actions","aside"],"mappings":"AAAA,wBAAwB,GAAG,uBAAuB;;;;+BAMjCA;;aAAAA;;iCANkE;gCACtD;6BACS;6BACA;AAG3B,MAAMA,uCAAuC,CAACC,OAAOC,gBAAgB;IAC5E,MAAM,EAAEC,MAAK,EAAGC,UAAS,EAAG,GAAGC,IAAAA,4BAAY,EAACJ;IAC5C,OAAO,WAAW,GAAGK,IAAAA,8BAAa,EAACH,MAAMI,IAAI,EAAEH,UAAUG,IAAI,EAAEJ,MAAMK,UAAU,IAAI,WAAW,GAAGF,IAAAA,8BAAa,EAACH,MAAMK,UAAU,EAAEJ,UAAUI,UAAU,GAAG,WAAW,GAAGF,IAAAA,8BAAa,EAACG,kCAAqB,EAAE;QACvMC,OAAOR,cAAcS,MAAM;IAC/B,GAAG,WAAW,GAAGL,IAAAA,8BAAa,EAACH,MAAMS,KAAK,EAAER,UAAUQ,KAAK,IAAI,WAAW,GAAGN,IAAAA,8BAAa,EAACH,MAAMU,OAAO,EAAET,UAAUS,OAAO,GAAGV,MAAMW,WAAW,IAAI,WAAW,GAAGR,IAAAA,8BAAa,EAACH,MAAMW,WAAW,EAAEV,UAAUU,WAAW,GAAG,WAAW,GAAGR,IAAAA,8BAAa,EAACS,kCAAqB,EAAE;QACzQL,OAAOT,MAAMe,kBAAkB;IACnC,GAAGb,MAAMc,OAAO,IAAI,WAAW,GAAGX,IAAAA,8BAAa,EAACH,MAAMc,OAAO,EAAEb,UAAUa,OAAO,GAAGd,MAAMe,KAAK,IAAI,WAAW,GAAGZ,IAAAA,8BAAa,EAACH,MAAMe,KAAK,EAAEd,UAAUc,KAAK;AAC9J"}
|
|
@@ -13,7 +13,7 @@ const _contexts = require("../../contexts");
|
|
|
13
13
|
const _tokens = require("../../utils/tokens");
|
|
14
14
|
const _useTreeItemLayout = require("../TreeItemLayout/useTreeItemLayout");
|
|
15
15
|
const useTreeItemPersonaLayout_unstable = (props, ref)=>{
|
|
16
|
-
const { media , children ,
|
|
16
|
+
const { media , children , content , description } = props;
|
|
17
17
|
const treeItemLayoutState = (0, _useTreeItemLayout.useTreeItemLayout_unstable)({
|
|
18
18
|
...props,
|
|
19
19
|
iconBefore: null,
|
|
@@ -24,7 +24,7 @@ const useTreeItemPersonaLayout_unstable = (props, ref)=>{
|
|
|
24
24
|
...treeItemLayoutState,
|
|
25
25
|
components: {
|
|
26
26
|
expandIcon: 'div',
|
|
27
|
-
|
|
27
|
+
content: 'div',
|
|
28
28
|
description: 'div',
|
|
29
29
|
root: 'div',
|
|
30
30
|
media: 'div',
|
|
@@ -32,7 +32,7 @@ const useTreeItemPersonaLayout_unstable = (props, ref)=>{
|
|
|
32
32
|
actions: 'div'
|
|
33
33
|
},
|
|
34
34
|
avatarSize: _tokens.treeAvatarSize[size],
|
|
35
|
-
|
|
35
|
+
content: (0, _reactUtilities.resolveShorthand)(content, {
|
|
36
36
|
required: true,
|
|
37
37
|
defaultProps: {
|
|
38
38
|
children
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["useTreeItemPersonaLayout.js"],"sourcesContent":["import * as React from 'react';\nimport { resolveShorthand } from '@fluentui/react-utilities';\nimport { useTreeContext_unstable } from '../../contexts';\nimport { treeAvatarSize } from '../../utils/tokens';\nimport { useTreeItemLayout_unstable } from '../TreeItemLayout/useTreeItemLayout';\n/**\n * Create the state required to render TreeItemPersonaLayout.\n *\n * The returned state can be modified with hooks such as useTreeItemPersonaLayoutStyles_unstable,\n * before being passed to renderTreeItemPersonaLayout_unstable.\n *\n * @param props - props from this instance of TreeItemPersonaLayout\n * @param ref - reference to root HTMLElement of TreeItemPersonaLayout\n */ export const useTreeItemPersonaLayout_unstable = (props, ref)=>{\n const { media , children ,
|
|
1
|
+
{"version":3,"sources":["useTreeItemPersonaLayout.js"],"sourcesContent":["import * as React from 'react';\nimport { resolveShorthand } from '@fluentui/react-utilities';\nimport { useTreeContext_unstable } from '../../contexts';\nimport { treeAvatarSize } from '../../utils/tokens';\nimport { useTreeItemLayout_unstable } from '../TreeItemLayout/useTreeItemLayout';\n/**\n * Create the state required to render TreeItemPersonaLayout.\n *\n * The returned state can be modified with hooks such as useTreeItemPersonaLayoutStyles_unstable,\n * before being passed to renderTreeItemPersonaLayout_unstable.\n *\n * @param props - props from this instance of TreeItemPersonaLayout\n * @param ref - reference to root HTMLElement of TreeItemPersonaLayout\n */ export const useTreeItemPersonaLayout_unstable = (props, ref)=>{\n const { media , children , content , description } = props;\n const treeItemLayoutState = useTreeItemLayout_unstable({\n ...props,\n iconBefore: null,\n iconAfter: null\n }, ref);\n const size = useTreeContext_unstable((ctx)=>ctx.size);\n return {\n ...treeItemLayoutState,\n components: {\n expandIcon: 'div',\n content: 'div',\n description: 'div',\n root: 'div',\n media: 'div',\n aside: 'div',\n actions: 'div'\n },\n avatarSize: treeAvatarSize[size],\n content: resolveShorthand(content, {\n required: true,\n defaultProps: {\n children\n }\n }),\n media: resolveShorthand(media, {\n required: true\n }),\n description: resolveShorthand(description)\n };\n};\n"],"names":["useTreeItemPersonaLayout_unstable","props","ref","media","children","content","description","treeItemLayoutState","useTreeItemLayout_unstable","iconBefore","iconAfter","size","useTreeContext_unstable","ctx","components","expandIcon","root","aside","actions","avatarSize","treeAvatarSize","resolveShorthand","required","defaultProps"],"mappings":";;;;+BAaiBA;;aAAAA;;;6DAbM;gCACU;0BACO;wBACT;mCACY;AAShC,MAAMA,oCAAoC,CAACC,OAAOC,MAAM;IAC/D,MAAM,EAAEC,MAAK,EAAGC,SAAQ,EAAGC,QAAO,EAAGC,YAAW,EAAG,GAAGL;IACtD,MAAMM,sBAAsBC,IAAAA,6CAA0B,EAAC;QACnD,GAAGP,KAAK;QACRQ,YAAY,IAAI;QAChBC,WAAW,IAAI;IACnB,GAAGR;IACH,MAAMS,OAAOC,IAAAA,iCAAuB,EAAC,CAACC,MAAMA,IAAIF,IAAI;IACpD,OAAO;QACH,GAAGJ,mBAAmB;QACtBO,YAAY;YACRC,YAAY;YACZV,SAAS;YACTC,aAAa;YACbU,MAAM;YACNb,OAAO;YACPc,OAAO;YACPC,SAAS;QACb;QACAC,YAAYC,sBAAc,CAACT,KAAK;QAChCN,SAASgB,IAAAA,gCAAgB,EAAChB,SAAS;YAC/BiB,UAAU,IAAI;YACdC,cAAc;gBACVnB;YACJ;QACJ;QACAD,OAAOkB,IAAAA,gCAAgB,EAAClB,OAAO;YAC3BmB,UAAU,IAAI;QAClB;QACAhB,aAAae,IAAAA,gCAAgB,EAACf;IAClC;AACJ"}
|