@fluentui/react-tree 9.3.1 → 9.4.1

package/lib/components/TreeItemPersonaLayout/useTreeItemPersonaLayoutStyles.styles.js

@@ -1,4 +1,4 @@
-import { __styles, mergeClasses, shorthands } from '@griffel/react';
+import { __resetStyles, __styles, mergeClasses, shorthands } from '@griffel/react';
 import { tokens, typographyStyles } from '@fluentui/react-theme';
 import { treeItemLevelToken } from '../../utils/tokens';
 import { useTreeItemContext_unstable } from '../../contexts/treeItemContext';
@@ -12,27 +12,11 @@ export const treeItemPersonaLayoutClassNames = {
   actions: 'fui-TreeItemPersonaLayout__actions',
   selector: 'fui-TreeItemPersonaLayout__selector'
 };
+const useRootBaseStyles = /*#__PURE__*/__resetStyles("r1r98egg", null, [".r1r98egg{display:grid;grid-template-rows:1fr auto;grid-template-columns:auto auto 1fr auto;grid-template-areas:\"expandIcon media main        aside\" \"expandIcon media description aside\";align-items:center;font-family:var(--fontFamilyBase);font-size:var(--fontSizeBase300);font-weight:var(--fontWeightRegular);line-height:var(--lineHeightBase300);}", ".r1r98egg:active{color:var(--colorNeutralForeground2Pressed);background-color:var(--colorSubtleBackgroundPressed);}", ".r1r98egg:active .fui-TreeItemPersonaLayout__expandIcon{color:var(--colorNeutralForeground3Pressed);}", ".r1r98egg:hover{color:var(--colorNeutralForeground2Hover);background-color:var(--colorSubtleBackgroundHover);}", ".r1r98egg:hover .fui-TreeItemPersonaLayout__expandIcon{color:var(--colorNeutralForeground3Hover);}"]);
 /**
  * Styles for the root slot
  */
 const useRootStyles = /*#__PURE__*/__styles({
-  base: {
-    mc9l5x: "f13qh94s",
-    wkccdc: "f1y0tuzo",
-    Budl1dq: "fellwe7",
-    zoa1oz: "f1pam7zy",
-    Bt984gj: "f122n59",
-    Bahqtrf: "fk6fouc",
-    Be2twd7: "fkhj508",
-    Bhrd7zp: "figsok6",
-    Bg96gwp: "f1i3iumi",
-    lj723h: "flvvhsy",
-    ecr2s2: "f1wfn5kd",
-    zt0xaq: "f5na5aj",
-    Bi91k9c: "fnwyq0v",
-    Jwef8y: "f1t94bn6",
-    tbva4x: "f1oboesa"
-  },
   leaf: {
     uwmqm3: ["f1k1erfc", "faevyjx"]
   },
@@ -40,42 +24,14 @@ const useRootStyles = /*#__PURE__*/__styles({
     uwmqm3: ["fo100m9", "f6yw3pu"]
   }
 }, {
-  d: [".f13qh94s{display:grid;}", ".f1y0tuzo{grid-template-rows:1fr auto;}", ".fellwe7{grid-template-columns:auto auto 1fr auto;}", ".f1pam7zy{grid-template-areas:\"expandIcon media main        aside\" \"expandIcon media description aside\";}", ".f122n59{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));}"],
-  a: [".flvvhsy:active{color:var(--colorNeutralForeground2Pressed);}", ".f1wfn5kd:active{background-color:var(--colorSubtleBackgroundPressed);}", ".f5na5aj:active .fui-TreeItemPersonaLayout__expandIcon{color:var(--colorNeutralForeground3Pressed);}"],
-  h: [".fnwyq0v:hover{color:var(--colorNeutralForeground2Hover);}", ".f1t94bn6:hover{background-color:var(--colorSubtleBackgroundHover);}", ".f1oboesa:hover .fui-TreeItemPersonaLayout__expandIcon{color:var(--colorNeutralForeground3Hover);}"]
+  d: [".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));}"]
 });
 /**
  * Styles for the expand icon slot
  */
-const useMediaStyles = /*#__PURE__*/__styles({
-  base: {
-    mc9l5x: "f22iagw",
-    Bt984gj: "f122n59",
-    a9b677: "f1szoe96",
-    Bqenvij: "f1d2rq10",
-    Ijaq50: "f11uok23",
-    Br312pm: "f1qdfnnj",
-    nk6f5a: "f1s27gz",
-    Bw0ie65: "f86d0yl",
-    z8tnut: "f1g0x7ka",
-    z189sj: ["f7x41pl", "fruq291"],
-    Byoj8tv: "f1qch9an",
-    uwmqm3: ["fgiv446", "ffczdla"]
-  }
-}, {
-  d: [".f22iagw{display:flex;}", ".f122n59{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);}"]
-});
+const useMediaBaseStyles = /*#__PURE__*/__resetStyles("r1hbg5ns", "r1bmcusj", [".r1hbg5ns{display:flex;align-items:center;width:32px;height:32px;grid-row-start:media;grid-column-start:media;grid-row-end:media;grid-column-end:media;padding-top:0;padding-right:var(--spacingHorizontalXS);padding-bottom:0;padding-left:var(--spacingHorizontalXXS);}", ".r1bmcusj{display:flex;align-items:center;width:32px;height:32px;grid-row-start:media;grid-column-start:media;grid-row-end:media;grid-column-end:media;padding-top:0;padding-left:var(--spacingHorizontalXS);padding-bottom:0;padding-right:var(--spacingHorizontalXXS);}"]);
+const useMainBaseStyles = /*#__PURE__*/__resetStyles("r1b2ijmt", "rvlp80t", [".r1b2ijmt{grid-row-start:main;grid-column-start:main;grid-row-end:main;grid-column-end:main;padding-top:var(--spacingVerticalMNudge);padding-right:var(--spacingHorizontalXS);padding-bottom:var(--spacingVerticalMNudge);padding-left:var(--spacingHorizontalS);}", ".rvlp80t{grid-row-start:main;grid-column-start:main;grid-row-end:main;grid-column-end:main;padding-top:var(--spacingVerticalMNudge);padding-left:var(--spacingHorizontalXS);padding-bottom:var(--spacingVerticalMNudge);padding-right:var(--spacingHorizontalS);}"]);
 const useMainStyles = /*#__PURE__*/__styles({
-  base: {
-    Ijaq50: "f17iroih",
-    Br312pm: "fppdkoh",
-    nk6f5a: "fsb8d6n",
-    Bw0ie65: "f6k5g14",
-    z8tnut: "f1ngh7ph",
-    z189sj: ["f7x41pl", "fruq291"],
-    Byoj8tv: "f5o476b",
-    uwmqm3: ["f1f5gg8d", "f1vdfbxk"]
-  },
   withDescription: {
     z8tnut: "f1ngh7ph",
     z189sj: ["f7x41pl", "fruq291"],
@@ -83,124 +39,51 @@ const useMainStyles = /*#__PURE__*/__styles({
     uwmqm3: ["f1f5gg8d", "f1vdfbxk"]
   }
 }, {
-  d: [".f17iroih{grid-row-start:main;}", ".fppdkoh{grid-column-start:main;}", ".fsb8d6n{grid-row-end:main;}", ".f6k5g14{grid-column-end:main;}", ".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;}"]
-});
-const useDescriptionStyles = /*#__PURE__*/__styles({
-  base: {
-    Ijaq50: "ffekjdo",
-    Br312pm: "f12wtlaa",
-    nk6f5a: "f1blqr63",
-    Bw0ie65: "f2ve1i",
-    Bahqtrf: "fk6fouc",
-    Be2twd7: "fy9rknc",
-    Bhrd7zp: "figsok6",
-    Bg96gwp: "fwrc4pm",
-    z8tnut: "f1g0x7ka",
-    z189sj: ["f7x41pl", "fruq291"],
-    Byoj8tv: "f5o476b",
-    uwmqm3: ["f1f5gg8d", "f1vdfbxk"]
-  }
-}, {
-  d: [".ffekjdo{grid-row-start:description;}", ".f12wtlaa{grid-column-start:description;}", ".f1blqr63{grid-row-end:description;}", ".f2ve1i{grid-column-end:description;}", ".fk6fouc{font-family:var(--fontFamilyBase);}", ".fy9rknc{font-size:var(--fontSizeBase200);}", ".figsok6{font-weight:var(--fontWeightRegular);}", ".fwrc4pm{line-height:var(--lineHeightBase200);}", ".f1g0x7ka{padding-top:0;}", ".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);}"]
+  d: [".f1ngh7ph{padding-top:var(--spacingVerticalMNudge);}", ".f7x41pl{padding-right:var(--spacingHorizontalXS);}", ".fruq291{padding-left:var(--spacingHorizontalXS);}", ".f1qch9an{padding-bottom:0;}", ".f1f5gg8d{padding-left:var(--spacingHorizontalS);}", ".f1vdfbxk{padding-right:var(--spacingHorizontalS);}"]
 });
+const useDescriptionBaseStyles = /*#__PURE__*/__resetStyles("r12nfoo7", "r1fcaudz", [".r12nfoo7{grid-row-start:description;grid-column-start:description;grid-row-end:description;grid-column-end:description;font-family:var(--fontFamilyBase);font-size:var(--fontSizeBase200);font-weight:var(--fontWeightRegular);line-height:var(--lineHeightBase200);padding-top:0;padding-right:var(--spacingHorizontalXS);padding-bottom:var(--spacingVerticalMNudge);padding-left:var(--spacingHorizontalS);}", ".r1fcaudz{grid-row-start:description;grid-column-start:description;grid-row-end:description;grid-column-end:description;font-family:var(--fontFamilyBase);font-size:var(--fontSizeBase200);font-weight:var(--fontWeightRegular);line-height:var(--lineHeightBase200);padding-top:0;padding-left:var(--spacingHorizontalXS);padding-bottom:var(--spacingVerticalMNudge);padding-right:var(--spacingHorizontalS);}"]);
 /**
  * Styles for the action icon slot
  */
-const useActionsStyles = /*#__PURE__*/__styles({
-  base: {
-    mc9l5x: "f22iagw",
-    Frg6f3: ["fcgxt0o", "f1ujusj6"],
-    qhf8xq: "f10pi13n",
-    Bj3rh1h: "f19g0ac",
-    Ijaq50: "fobksn0",
-    Br312pm: "fmy5l6f",
-    nk6f5a: "fzqypwc",
-    Bw0ie65: "f1tmftl3",
-    z8tnut: "f1g0x7ka",
-    z189sj: ["f1vdfbxk", "f1f5gg8d"],
-    Byoj8tv: "f1qch9an",
-    uwmqm3: ["f1f5gg8d", "f1vdfbxk"]
-  }
-}, {
-  d: [".f22iagw{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;}"]
-});
+const useActionsBaseStyles = /*#__PURE__*/__resetStyles("r1i8xcbw", "r12wgp0u", [".r1i8xcbw{display:flex;margin-left:auto;position:relative;z-index:1;grid-row-start:aside;grid-column-start:aside;grid-row-end:aside;grid-column-end:aside;padding-top:0;padding-right:var(--spacingHorizontalS);padding-bottom:0;padding-left:var(--spacingHorizontalS);}", ".r12wgp0u{display:flex;margin-right:auto;position:relative;z-index:1;grid-row-start:aside;grid-column-start:aside;grid-row-end:aside;grid-column-end:aside;padding-top:0;padding-left:var(--spacingHorizontalS);padding-bottom:0;padding-right:var(--spacingHorizontalS);}"]);
 /**
  * Styles for the action icon slot
  */
-const useAsideStyles = /*#__PURE__*/__styles({
-  base: {
-    mc9l5x: "f22iagw",
-    Frg6f3: ["fcgxt0o", "f1ujusj6"],
-    Bt984gj: "f122n59",
-    Bj3rh1h: "f11zp4z2",
-    Ijaq50: "fobksn0",
-    Br312pm: "fmy5l6f",
-    nk6f5a: "fzqypwc",
-    Bw0ie65: "f1tmftl3",
-    z8tnut: "f1g0x7ka",
-    z189sj: ["fw5db7e", "f1uw59to"],
-    Byoj8tv: "f1qch9an",
-    uwmqm3: ["f1uw59to", "fw5db7e"],
-    i8kkvl: "f1ufnopg",
-    Belr9w4: "f14sijuj"
-  }
-}, {
-  d: [".f22iagw{display:flex;}", ".fcgxt0o{margin-left:auto;}", ".f1ujusj6{margin-right:auto;}", ".f122n59{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{column-gap:var(--spacingHorizontalXS);}", ".f14sijuj{row-gap:var(--spacingHorizontalXS);}"]
-});
+const useAsideBaseStyles = /*#__PURE__*/__resetStyles("rviw63k", "r1kawtgt", [".rviw63k{display:flex;margin-left:auto;align-items:center;z-index:0;grid-row-start:aside;grid-column-start:aside;grid-row-end:aside;grid-column-end:aside;padding-top:0;padding-right:var(--spacingHorizontalM);padding-bottom:0;padding-left:var(--spacingHorizontalM);column-gap:var(--spacingHorizontalXS);row-gap:var(--spacingHorizontalXS);}", ".r1kawtgt{display:flex;margin-right:auto;align-items:center;z-index:0;grid-row-start:aside;grid-column-start:aside;grid-row-end:aside;grid-column-end:aside;padding-top:0;padding-left:var(--spacingHorizontalM);padding-bottom:0;padding-right:var(--spacingHorizontalM);column-gap:var(--spacingHorizontalXS);row-gap:var(--spacingHorizontalXS);}"]);
 /**
  * Styles for the expand icon slot
  */
-const useExpandIconStyles = /*#__PURE__*/__styles({
-  base: {
-    mc9l5x: "f22iagw",
-    Bt984gj: "f122n59",
-    Brf1p80: "f4d9j23",
-    Bf4jedk: "f17fgpbq",
-    B7ck84d: "f1ewtqcl",
-    sj55zd: "f11d4kpn",
-    Ijaq50: "f1e6rimv",
-    Br312pm: "f10hsf66",
-    nk6f5a: "foflfm0",
-    Bw0ie65: "f1b3ebjb",
-    Bh6795r: "f1jhi6b8",
-    Bnnss6s: "fi64zpg",
-    xawz: "f1rmlqtg",
-    z8tnut: "f1ywm7hm",
-    z189sj: ["fhxju0i", "f1cnd47f"],
-    Byoj8tv: "f14wxoun",
-    uwmqm3: ["f1cnd47f", "fhxju0i"]
-  }
-}, {
-  d: [".f22iagw{display:flex;}", ".f122n59{align-items:center;}", ".f4d9j23{justify-content:center;}", ".f17fgpbq{min-width:24px;}", ".f1ewtqcl{box-sizing:border-box;}", ".f11d4kpn{color:var(--colorNeutralForeground3);}", ".f1e6rimv{grid-row-start:expandIcon;}", ".f10hsf66{grid-column-start:expandIcon;}", ".foflfm0{grid-row-end:expandIcon;}", ".f1b3ebjb{grid-column-end:expandIcon;}", ".f1jhi6b8{flex-grow:0;}", ".fi64zpg{flex-shrink:0;}", ".f1rmlqtg{flex-basis:auto;}", ".f1ywm7hm{padding-top:var(--spacingVerticalXS);}", ".fhxju0i{padding-right:0;}", ".f1cnd47f{padding-left:0;}", ".f14wxoun{padding-bottom:var(--spacingVerticalXS);}"]
-});
+const useExpandIconBaseStyles = /*#__PURE__*/__resetStyles("r15sjth9", "rzkr3gy", [".r15sjth9{display:flex;align-items:center;justify-content:center;min-width:24px;box-sizing:border-box;color:var(--colorNeutralForeground3);grid-row-start:expandIcon;grid-column-start:expandIcon;grid-row-end:expandIcon;grid-column-end:expandIcon;flex-grow:0;flex-shrink:0;flex-basis:auto;padding-top:var(--spacingVerticalXS);padding-right:0;padding-bottom:var(--spacingVerticalXS);padding-left:0;}", ".rzkr3gy{display:flex;align-items:center;justify-content:center;min-width:24px;box-sizing:border-box;color:var(--colorNeutralForeground3);grid-row-start:expandIcon;grid-column-start:expandIcon;grid-row-end:expandIcon;grid-column-end:expandIcon;flex-grow:0;flex-shrink:0;flex-basis:auto;padding-top:var(--spacingVerticalXS);padding-left:0;padding-bottom:var(--spacingVerticalXS);padding-right:0;}"]);
 /**
  * Apply styling to the TreeItemPersonaLayout slots based on the state
  */
 export const useTreeItemPersonaLayoutStyles_unstable = state => {
+  const rootBaseStyles = useRootBaseStyles();
   const rootStyles = useRootStyles();
-  const mediaStyles = useMediaStyles();
-  const descriptionStyles = useDescriptionStyles();
-  const actionsStyles = useActionsStyles();
-  const asideStyles = useAsideStyles();
-  const expandIconStyles = useExpandIconStyles();
+  const mediaBaseStyles = useMediaBaseStyles();
+  const descriptionBaseStyles = useDescriptionBaseStyles();
+  const actionsBaseStyles = useActionsBaseStyles();
+  const asideBaseStyles = useAsideBaseStyles();
+  const expandIconBaseStyles = useExpandIconBaseStyles();
+  const mainBaseStyles = useMainBaseStyles();
   const mainStyles = useMainStyles();
   const itemType = useTreeItemContext_unstable(ctx => ctx.itemType);
-  state.root.className = mergeClasses(treeItemPersonaLayoutClassNames.root, rootStyles.base, rootStyles[itemType], state.root.className);
-  state.media.className = mergeClasses(treeItemPersonaLayoutClassNames.media, mediaStyles.base, state.media.className);
+  state.root.className = mergeClasses(treeItemPersonaLayoutClassNames.root, rootBaseStyles, rootStyles[itemType], state.root.className);
+  state.media.className = mergeClasses(treeItemPersonaLayoutClassNames.media, mediaBaseStyles, state.media.className);
   if (state.main) {
-    state.main.className = mergeClasses(treeItemPersonaLayoutClassNames.main, mainStyles.base, state.description && mainStyles.withDescription, state.main.className);
+    state.main.className = mergeClasses(treeItemPersonaLayoutClassNames.main, mainBaseStyles, state.description && mainStyles.withDescription, state.main.className);
   }
   if (state.description) {
-    state.description.className = mergeClasses(treeItemPersonaLayoutClassNames.description, descriptionStyles.base, state.description.className);
+    state.description.className = mergeClasses(treeItemPersonaLayoutClassNames.description, descriptionBaseStyles, state.description.className);
   }
   if (state.actions) {
-    state.actions.className = mergeClasses(treeItemPersonaLayoutClassNames.actions, actionsStyles.base, state.actions.className);
+    state.actions.className = mergeClasses(treeItemPersonaLayoutClassNames.actions, actionsBaseStyles, state.actions.className);
   }
   if (state.aside) {
-    state.aside.className = mergeClasses(treeItemPersonaLayoutClassNames.aside, asideStyles.base, state.aside.className);
+    state.aside.className = mergeClasses(treeItemPersonaLayoutClassNames.aside, asideBaseStyles, state.aside.className);
   }
   if (state.expandIcon) {
-    state.expandIcon.className = mergeClasses(treeItemPersonaLayoutClassNames.expandIcon, expandIconStyles.base, state.expandIcon.className);
+    state.expandIcon.className = mergeClasses(treeItemPersonaLayoutClassNames.expandIcon, expandIconBaseStyles, state.expandIcon.className);
   }
   if (state.selector) {
     state.selector.className = mergeClasses(treeItemPersonaLayoutClassNames.selector, state.selector.className);

package/lib/components/TreeItemPersonaLayout/useTreeItemPersonaLayoutStyles.styles.js.map

@@ -1 +1 @@
-{"version":3,"names":["__styles","mergeClasses","shorthands","tokens","typographyStyles","treeItemLevelToken","useTreeItemContext_unstable","treeItemPersonaLayoutClassNames","root","media","description","main","expandIcon","aside","actions","selector","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    selector: 'fui-TreeItemPersonaLayout__selector'\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    if (state.selector) {\n        state.selector.className = mergeClasses(treeItemPersonaLayoutClassNames.selector, state.selector.className);\n    }\n    return state;\n};\n"],"mappings":"AAAA,SAAAA,QAAA,EAAqBC,YAAY,EAAEC,UAAU,QAAQ,gBAAgB;AACrE,SAASC,MAAM,EAAEC,gBAAgB,QAAQ,uBAAuB;AAChE,SAASC,kBAAkB,QAAQ,oBAAoB;AACvD,SAASC,2BAA2B,QAAQ,gCAAgC;AAC5E,OAAO,MAAMC,+BAA+B,GAAG;EAC3CC,IAAI,EAAE,2BAA2B;EACjCC,KAAK,EAAE,kCAAkC;EACzCC,WAAW,EAAE,wCAAwC;EACrDC,IAAI,EAAE,iCAAiC;EACvCC,UAAU,EAAE,uCAAuC;EACnDC,KAAK,EAAE,kCAAkC;EACzCC,OAAO,EAAE,oCAAoC;EAC7CC,QAAQ,EAAE;AACd,CAAC;AACD;AACA;AACA;AAAI,MAAMC,aAAa,gBAAGhB,QAAA;EAAAiB,IAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;EAAA;EAAAC,IAAA;IAAAC,MAAA;EAAA;EAAAC,MAAA;IAAAD,MAAA;EAAA;AAAA;EAAAE,CAAA;EAAAC,CAAA;EAAAC,CAAA;AAAA,CAkCzB,CAAC;AACF;AACA;AACA;AAAI,MAAMC,cAAc,gBAAGvC,QAAA;EAAAiB,IAAA;IAAAC,MAAA;IAAAI,OAAA;IAAAkB,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAd,MAAA;EAAA;AAAA;EAAAE,CAAA;AAAA,CAS1B,CAAC;AACF,MAAMa,aAAa,gBAAGjD,QAAA;EAAAiB,IAAA;IAAAyB,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAd,MAAA;EAAA;EAAAgB,eAAA;IAAAJ,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAd,MAAA;EAAA;AAAA;EAAAE,CAAA;AAAA,CAQrB,CAAC;AACF,MAAMe,oBAAoB,gBAAGnD,QAAA;EAAAiB,IAAA;IAAAyB,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAtB,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAoB,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAd,MAAA;EAAA;AAAA;EAAAE,CAAA;AAAA,CAM5B,CAAC;AACF;AACA;AACA;AAAI,MAAMgB,gBAAgB,gBAAGpD,QAAA;EAAAiB,IAAA;IAAAC,MAAA;IAAAmC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAb,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAd,MAAA;EAAA;AAAA;EAAAE,CAAA;AAAA,CAS5B,CAAC;AACF;AACA;AACA;AAAI,MAAMoB,cAAc,gBAAGxD,QAAA;EAAAiB,IAAA;IAAAC,MAAA;IAAAmC,MAAA;IAAA/B,OAAA;IAAAiC,OAAA;IAAAb,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAd,MAAA;IAAAuB,MAAA;IAAAC,OAAA;EAAA;AAAA;EAAAtB,CAAA;AAAA,CAU1B,CAAC;AACF;AACA;AACA;AAAI,MAAMuB,mBAAmB,gBAAG3D,QAAA;EAAAiB,IAAA;IAAAC,MAAA;IAAAI,OAAA;IAAAsC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAArB,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAmB,OAAA;IAAAC,OAAA;IAAAC,IAAA;IAAApB,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAd,MAAA;EAAA;AAAA;EAAAE,CAAA;AAAA,CAY/B,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAM+B,uCAAuC,GAAIC,KAAK,IAAG;EAChE,MAAMC,UAAU,GAAGrD,aAAa,CAAC,CAAC;EAClC,MAAMsD,WAAW,GAAG/B,cAAc,CAAC,CAAC;EACpC,MAAMgC,iBAAiB,GAAGpB,oBAAoB,CAAC,CAAC;EAChD,MAAMqB,aAAa,GAAGpB,gBAAgB,CAAC,CAAC;EACxC,MAAMqB,WAAW,GAAGjB,cAAc,CAAC,CAAC;EACpC,MAAMkB,gBAAgB,GAAGf,mBAAmB,CAAC,CAAC;EAC9C,MAAMgB,UAAU,GAAG1B,aAAa,CAAC,CAAC;EAClC,MAAM2B,QAAQ,GAAGtE,2BAA2B,CAAEuE,GAAG,IAAGA,GAAG,CAACD,QAAQ,CAAC;EACjER,KAAK,CAAC5D,IAAI,CAACsE,SAAS,GAAG7E,YAAY,CAACM,+BAA+B,CAACC,IAAI,EAAE6D,UAAU,CAACpD,IAAI,EAAEoD,UAAU,CAACO,QAAQ,CAAC,EAAER,KAAK,CAAC5D,IAAI,CAACsE,SAAS,CAAC;EACtIV,KAAK,CAAC3D,KAAK,CAACqE,SAAS,GAAG7E,YAAY,CAACM,+BAA+B,CAACE,KAAK,EAAE6D,WAAW,CAACrD,IAAI,EAAEmD,KAAK,CAAC3D,KAAK,CAACqE,SAAS,CAAC;EACpH,IAAIV,KAAK,CAACzD,IAAI,EAAE;IACZyD,KAAK,CAACzD,IAAI,CAACmE,SAAS,GAAG7E,YAAY,CAACM,+BAA+B,CAACI,IAAI,EAAEgE,UAAU,CAAC1D,IAAI,EAAEmD,KAAK,CAAC1D,WAAW,IAAIiE,UAAU,CAACzB,eAAe,EAAEkB,KAAK,CAACzD,IAAI,CAACmE,SAAS,CAAC;EACrK;EACA,IAAIV,KAAK,CAAC1D,WAAW,EAAE;IACnB0D,KAAK,CAAC1D,WAAW,CAACoE,SAAS,GAAG7E,YAAY,CAACM,+BAA+B,CAACG,WAAW,EAAE6D,iBAAiB,CAACtD,IAAI,EAAEmD,KAAK,CAAC1D,WAAW,CAACoE,SAAS,CAAC;EAChJ;EACA,IAAIV,KAAK,CAACtD,OAAO,EAAE;IACfsD,KAAK,CAACtD,OAAO,CAACgE,SAAS,GAAG7E,YAAY,CAACM,+BAA+B,CAACO,OAAO,EAAE0D,aAAa,CAACvD,IAAI,EAAEmD,KAAK,CAACtD,OAAO,CAACgE,SAAS,CAAC;EAChI;EACA,IAAIV,KAAK,CAACvD,KAAK,EAAE;IACbuD,KAAK,CAACvD,KAAK,CAACiE,SAAS,GAAG7E,YAAY,CAACM,+BAA+B,CAACM,KAAK,EAAE4D,WAAW,CAACxD,IAAI,EAAEmD,KAAK,CAACvD,KAAK,CAACiE,SAAS,CAAC;EACxH;EACA,IAAIV,KAAK,CAACxD,UAAU,EAAE;IAClBwD,KAAK,CAACxD,UAAU,CAACkE,SAAS,GAAG7E,YAAY,CAACM,+BAA+B,CAACK,UAAU,EAAE8D,gBAAgB,CAACzD,IAAI,EAAEmD,KAAK,CAACxD,UAAU,CAACkE,SAAS,CAAC;EAC5I;EACA,IAAIV,KAAK,CAACrD,QAAQ,EAAE;IAChBqD,KAAK,CAACrD,QAAQ,CAAC+D,SAAS,GAAG7E,YAAY,CAACM,+BAA+B,CAACQ,QAAQ,EAAEqD,KAAK,CAACrD,QAAQ,CAAC+D,SAAS,CAAC;EAC/G;EACA,OAAOV,KAAK;AAChB,CAAC"}
+{"version":3,"names":["__resetStyles","__styles","mergeClasses","shorthands","tokens","typographyStyles","treeItemLevelToken","useTreeItemContext_unstable","treeItemPersonaLayoutClassNames","root","media","description","main","expandIcon","aside","actions","selector","useRootBaseStyles","useRootStyles","leaf","uwmqm3","branch","d","useMediaBaseStyles","useMainBaseStyles","useMainStyles","withDescription","z8tnut","z189sj","Byoj8tv","useDescriptionBaseStyles","useActionsBaseStyles","useAsideBaseStyles","useExpandIconBaseStyles","useTreeItemPersonaLayoutStyles_unstable","state","rootBaseStyles","rootStyles","mediaBaseStyles","descriptionBaseStyles","actionsBaseStyles","asideBaseStyles","expandIconBaseStyles","mainBaseStyles","mainStyles","itemType","ctx","className"],"sources":["useTreeItemPersonaLayoutStyles.styles.js"],"sourcesContent":["import { makeResetStyles, 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    selector: 'fui-TreeItemPersonaLayout__selector'\n};\nconst useRootBaseStyles = makeResetStyles({\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/**\n * Styles for the root slot\n */ const useRootStyles = makeStyles({\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 useMediaBaseStyles = makeResetStyles({\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});\nconst useMainBaseStyles = makeResetStyles({\n    ...shorthands.gridArea('main'),\n    ...shorthands.padding(tokens.spacingVerticalMNudge, tokens.spacingHorizontalXS, tokens.spacingVerticalMNudge, tokens.spacingHorizontalS)\n});\nconst useMainStyles = makeStyles({\n    withDescription: {\n        ...shorthands.padding(tokens.spacingVerticalMNudge, tokens.spacingHorizontalXS, 0, tokens.spacingHorizontalS)\n    }\n});\nconst useDescriptionBaseStyles = makeResetStyles({\n    ...shorthands.gridArea('description'),\n    ...typographyStyles.caption1,\n    ...shorthands.padding(0, tokens.spacingHorizontalXS, tokens.spacingVerticalMNudge, tokens.spacingHorizontalS)\n});\n/**\n * Styles for the action icon slot\n */ const useActionsBaseStyles = makeResetStyles({\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 * Styles for the action icon slot\n */ const useAsideBaseStyles = makeResetStyles({\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 * Styles for the expand icon slot\n */ const useExpandIconBaseStyles = makeResetStyles({\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 * Apply styling to the TreeItemPersonaLayout slots based on the state\n */ export const useTreeItemPersonaLayoutStyles_unstable = (state)=>{\n    const rootBaseStyles = useRootBaseStyles();\n    const rootStyles = useRootStyles();\n    const mediaBaseStyles = useMediaBaseStyles();\n    const descriptionBaseStyles = useDescriptionBaseStyles();\n    const actionsBaseStyles = useActionsBaseStyles();\n    const asideBaseStyles = useAsideBaseStyles();\n    const expandIconBaseStyles = useExpandIconBaseStyles();\n    const mainBaseStyles = useMainBaseStyles();\n    const mainStyles = useMainStyles();\n    const itemType = useTreeItemContext_unstable((ctx)=>ctx.itemType);\n    state.root.className = mergeClasses(treeItemPersonaLayoutClassNames.root, rootBaseStyles, rootStyles[itemType], state.root.className);\n    state.media.className = mergeClasses(treeItemPersonaLayoutClassNames.media, mediaBaseStyles, state.media.className);\n    if (state.main) {\n        state.main.className = mergeClasses(treeItemPersonaLayoutClassNames.main, mainBaseStyles, state.description && mainStyles.withDescription, state.main.className);\n    }\n    if (state.description) {\n        state.description.className = mergeClasses(treeItemPersonaLayoutClassNames.description, descriptionBaseStyles, state.description.className);\n    }\n    if (state.actions) {\n        state.actions.className = mergeClasses(treeItemPersonaLayoutClassNames.actions, actionsBaseStyles, state.actions.className);\n    }\n    if (state.aside) {\n        state.aside.className = mergeClasses(treeItemPersonaLayoutClassNames.aside, asideBaseStyles, state.aside.className);\n    }\n    if (state.expandIcon) {\n        state.expandIcon.className = mergeClasses(treeItemPersonaLayoutClassNames.expandIcon, expandIconBaseStyles, state.expandIcon.className);\n    }\n    if (state.selector) {\n        state.selector.className = mergeClasses(treeItemPersonaLayoutClassNames.selector, state.selector.className);\n    }\n    return state;\n};\n"],"mappings":"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"}

package/lib/components/TreeProvider.js

@@ -0,0 +1,21 @@
+import * as React from 'react';
+import { SubtreeContext, TreeContext } from '../contexts';
+/**
+ * @internal
+ */ const rootSubtreeContextValue = {
+    level: 1,
+    contextType: 'subtree'
+};
+export const TreeProvider = (props)=>{
+    if (props.value.contextType === 'subtree') {
+        return /*#__PURE__*/ React.createElement(SubtreeContext.Provider, {
+            value: props.value
+        }, props.children);
+    }
+    return /*#__PURE__*/ React.createElement(TreeContext.Provider, {
+        value: props.value
+    }, /*#__PURE__*/ React.createElement(SubtreeContext.Provider, {
+        value: rootSubtreeContextValue
+    }, props.children));
+};
+TreeProvider.displayName = 'TreeProvider';

package/lib/components/TreeProvider.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["TreeProvider.tsx"],"sourcesContent":["import * as React from 'react';\nimport { SubtreeContext, SubtreeContextValue, TreeContextValue, TreeContext } from '../contexts';\n\n/**\n * @internal\n */\nconst rootSubtreeContextValue: SubtreeContextValue = {\n  level: 1,\n  contextType: 'subtree',\n};\n\nexport const TreeProvider = (props: React.ProviderProps<TreeContextValue | SubtreeContextValue>) => {\n  if (props.value.contextType === 'subtree') {\n    return <SubtreeContext.Provider value={props.value}>{props.children}</SubtreeContext.Provider>;\n  }\n  return (\n    <TreeContext.Provider value={props.value}>\n      <SubtreeContext.Provider value={rootSubtreeContextValue}>{props.children}</SubtreeContext.Provider>\n    </TreeContext.Provider>\n  );\n};\n\nTreeProvider.displayName = 'TreeProvider';\n"],"names":["React","SubtreeContext","TreeContext","rootSubtreeContextValue","level","contextType","TreeProvider","props","value","Provider","children","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,cAAc,EAAyCC,WAAW,QAAQ,cAAc;AAEjG;;CAEC,GACD,MAAMC,0BAA+C;IACnDC,OAAO;IACPC,aAAa;AACf;AAEA,OAAO,MAAMC,eAAe,CAACC;IAC3B,IAAIA,MAAMC,KAAK,CAACH,WAAW,KAAK,WAAW;QACzC,qBAAO,oBAACJ,eAAeQ,QAAQ;YAACD,OAAOD,MAAMC,KAAK;WAAGD,MAAMG,QAAQ;IACrE;IACA,qBACE,oBAACR,YAAYO,QAAQ;QAACD,OAAOD,MAAMC,KAAK;qBACtC,oBAACP,eAAeQ,QAAQ;QAACD,OAAOL;OAA0BI,MAAMG,QAAQ;AAG9E,EAAE;AAEFJ,aAAaK,WAAW,GAAG"}

package/lib/contexts/index.js

@@ -1,2 +1,3 @@
 export * from './treeContext';
+export * from './subtreeContext';
 export * from './treeItemContext';

package/lib/contexts/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["index.ts"],"sourcesContent":["export * from './treeContext';\nexport * from './treeItemContext';\n"],"names":[],"mappings":"AAAA,cAAc,gBAAgB;AAC9B,cAAc,oBAAoB"}
+{"version":3,"sources":["index.ts"],"sourcesContent":["export * from './treeContext';\nexport * from './subtreeContext';\nexport * from './treeItemContext';\n"],"names":[],"mappings":"AAAA,cAAc,gBAAgB;AAC9B,cAAc,mBAAmB;AACjC,cAAc,oBAAoB"}

package/lib/contexts/subtreeContext.js

@@ -0,0 +1,14 @@
+import * as React from 'react';
+/**
+ * @internal
+ */ const defaultSubTreeContextValue = {
+    level: 0,
+    contextType: 'subtree'
+};
+/**
+ * @internal
+ */ export const SubtreeContext = React.createContext(undefined);
+export const useSubtreeContext_unstable = ()=>{
+    var _React_useContext;
+    return (_React_useContext = React.useContext(SubtreeContext)) !== null && _React_useContext !== void 0 ? _React_useContext : defaultSubTreeContextValue;
+};

package/lib/contexts/subtreeContext.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["subtreeContext.ts"],"sourcesContent":["import * as React from 'react';\n\nexport type SubtreeContextValue = {\n  contextType: 'subtree';\n  level: number;\n};\n\n/**\n * @internal\n */\nconst defaultSubTreeContextValue: SubtreeContextValue = {\n  level: 0,\n  contextType: 'subtree',\n};\n\n/**\n * @internal\n */\nexport const SubtreeContext: React.Context<SubtreeContextValue> = React.createContext<SubtreeContextValue | undefined>(\n  undefined,\n) as React.Context<SubtreeContextValue>;\n\nexport const useSubtreeContext_unstable = () => {\n  return React.useContext(SubtreeContext) ?? defaultSubTreeContextValue;\n};\n"],"names":["React","defaultSubTreeContextValue","level","contextType","SubtreeContext","createContext","undefined","useSubtreeContext_unstable","useContext"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAO/B;;CAEC,GACD,MAAMC,6BAAkD;IACtDC,OAAO;IACPC,aAAa;AACf;AAEA;;CAEC,GACD,OAAO,MAAMC,iBAAqDJ,MAAMK,aAAa,CACnFC,WACsC;AAExC,OAAO,MAAMC,6BAA6B;QACjCP;IAAP,OAAOA,CAAAA,oBAAAA,MAAMQ,UAAU,CAACJ,6BAAjBJ,+BAAAA,oBAAoCC;AAC7C,EAAE"}

package/lib/contexts/treeContext.js

@@ -1,9 +1,12 @@
 import { createContext, useContextSelector } from '@fluentui/react-context-selector';
 import { ImmutableSet } from '../utils/ImmutableSet';
 import { ImmutableMap } from '../utils/ImmutableMap';
-const defaultContextValue = {
-    treeType: 'nested',
+/**
+ * @internal
+ */ const defaultTreeContextValue = {
     level: 0,
+    contextType: 'root',
+    treeType: 'nested',
     selectionMode: 'none',
     openItems: ImmutableSet.empty,
     checkedItems: ImmutableMap.empty,
@@ -13,6 +16,7 @@ const defaultContextValue = {
 };
 function noop() {
 /* noop */ }
-export const TreeContext = createContext(undefined);
-export const { Provider: TreeProvider } = TreeContext;
-export const useTreeContext_unstable = (selector)=>useContextSelector(TreeContext, (ctx = defaultContextValue)=>selector(ctx));
+/**
+ * @internal
+ */ export const TreeContext = createContext(undefined);
+export const useTreeContext_unstable = (selector)=>useContextSelector(TreeContext, (ctx = defaultTreeContextValue)=>selector(ctx));

package/lib/contexts/treeContext.js.map

@@ -1 +1 @@
-{"version":3,"sources":["treeContext.ts"],"sourcesContent":["import { Context, ContextSelector, createContext, useContextSelector } from '@fluentui/react-context-selector';\nimport { TreeItemType, TreeItemValue } from '../TreeItem';\nimport { SelectionMode } from '@fluentui/react-utilities';\nimport { ImmutableSet } from '../utils/ImmutableSet';\nimport { ImmutableMap } from '../utils/ImmutableMap';\nimport { TreeCheckedChangeData, TreeNavigationData_unstable, TreeOpenChangeData } from '../Tree';\n\nexport type TreeContextValue = {\n  treeType: 'nested' | 'flat';\n  level: number;\n  selectionMode: 'none' | SelectionMode;\n  appearance: 'subtle' | 'subtle-alpha' | 'transparent';\n  size: 'small' | 'medium';\n  openItems: ImmutableSet<TreeItemValue>;\n  checkedItems: ImmutableMap<TreeItemValue, 'mixed' | boolean>;\n  /**\n   * requests root Tree component to respond to some tree item event,\n   */\n  requestTreeResponse(request: TreeItemRequest): void;\n};\n\nexport type TreeItemRequest = { itemType: TreeItemType } & (\n  | (OmitWithoutExpanding<TreeOpenChangeData, 'open' | 'openItems'> & { requestType: 'open' })\n  | (TreeNavigationData_unstable & { requestType: 'navigate' })\n  | (OmitWithoutExpanding<TreeCheckedChangeData, 'selectionMode' | 'checkedItems'> & { requestType: 'selection' })\n);\n\n// helper type that avoids the expansion of unions while inferring it, should work exactly the same as Omit\ntype OmitWithoutExpanding<P, K extends string | number | symbol> = P extends unknown ? Omit<P, K> : P;\n\nconst defaultContextValue: TreeContextValue = {\n  treeType: 'nested',\n  level: 0,\n  selectionMode: 'none',\n  openItems: ImmutableSet.empty,\n  checkedItems: ImmutableMap.empty,\n  requestTreeResponse: noop,\n  appearance: 'subtle',\n  size: 'medium',\n};\n\nfunction noop() {\n  /* noop */\n}\n\nexport const TreeContext: Context<TreeContextValue | undefined> = createContext<TreeContextValue | undefined>(\n  undefined,\n);\n\nexport const { Provider: TreeProvider } = TreeContext;\nexport const useTreeContext_unstable = <T>(selector: ContextSelector<TreeContextValue, T>): T =>\n  useContextSelector(TreeContext, (ctx = defaultContextValue) => selector(ctx));\n"],"names":["createContext","useContextSelector","ImmutableSet","ImmutableMap","defaultContextValue","treeType","level","selectionMode","openItems","empty","checkedItems","requestTreeResponse","noop","appearance","size","TreeContext","undefined","Provider","TreeProvider","useTreeContext_unstable","selector","ctx"],"mappings":"AAAA,SAAmCA,aAAa,EAAEC,kBAAkB,QAAQ,mCAAmC;AAG/G,SAASC,YAAY,QAAQ,wBAAwB;AACrD,SAASC,YAAY,QAAQ,wBAAwB;AA0BrD,MAAMC,sBAAwC;IAC5CC,UAAU;IACVC,OAAO;IACPC,eAAe;IACfC,WAAWN,aAAaO,KAAK;IAC7BC,cAAcP,aAAaM,KAAK;IAChCE,qBAAqBC;IACrBC,YAAY;IACZC,MAAM;AACR;AAEA,SAASF;AACP,QAAQ,GACV;AAEA,OAAO,MAAMG,cAAqDf,cAChEgB,WACA;AAEF,OAAO,MAAM,EAAEC,UAAUC,YAAY,EAAE,GAAGH,YAAY;AACtD,OAAO,MAAMI,0BAA0B,CAAIC,WACzCnB,mBAAmBc,aAAa,CAACM,MAAMjB,mBAAmB,GAAKgB,SAASC,MAAM"}
+{"version":3,"sources":["treeContext.ts"],"sourcesContent":["import { Context, ContextSelector, createContext, useContextSelector } from '@fluentui/react-context-selector';\nimport { TreeItemType, TreeItemValue } from '../TreeItem';\nimport { SelectionMode } from '@fluentui/react-utilities';\nimport { ImmutableSet } from '../utils/ImmutableSet';\nimport { ImmutableMap } from '../utils/ImmutableMap';\nimport { TreeCheckedChangeData, TreeNavigationData_unstable, TreeOpenChangeData } from '../Tree';\n\nexport type TreeContextValue = {\n  contextType?: 'root';\n  level: number;\n  treeType: 'nested' | 'flat';\n  selectionMode: 'none' | SelectionMode;\n  appearance: 'subtle' | 'subtle-alpha' | 'transparent';\n  size: 'small' | 'medium';\n  openItems: ImmutableSet<TreeItemValue>;\n  checkedItems: ImmutableMap<TreeItemValue, 'mixed' | boolean>;\n  /**\n   * requests root Tree component to respond to some tree item event,\n   */\n  requestTreeResponse(request: TreeItemRequest): void;\n};\n\nexport type TreeItemRequest = { itemType: TreeItemType } & (\n  | (OmitWithoutExpanding<TreeOpenChangeData, 'open' | 'openItems'> & { requestType: 'open' })\n  | (TreeNavigationData_unstable & { requestType: 'navigate' })\n  | (OmitWithoutExpanding<TreeCheckedChangeData, 'selectionMode' | 'checkedItems'> & { requestType: 'selection' })\n);\n\n/**\n * helper type that avoids the expansion of unions while inferring it,\n * should work exactly the same as Omit\n */\ntype OmitWithoutExpanding<P, K extends string | number | symbol> = P extends unknown ? Omit<P, K> : P;\n\n/**\n * @internal\n */\nconst defaultTreeContextValue: TreeContextValue = {\n  level: 0,\n  contextType: 'root',\n  treeType: 'nested',\n  selectionMode: 'none',\n  openItems: ImmutableSet.empty,\n  checkedItems: ImmutableMap.empty,\n  requestTreeResponse: noop,\n  appearance: 'subtle',\n  size: 'medium',\n};\n\nfunction noop() {\n  /* noop */\n}\n\n/**\n * @internal\n */\nexport const TreeContext: Context<TreeContextValue> = createContext<TreeContextValue | undefined>(\n  undefined,\n) as Context<TreeContextValue>;\n\nexport const useTreeContext_unstable = <T>(selector: ContextSelector<TreeContextValue, T>): T =>\n  useContextSelector(TreeContext, (ctx = defaultTreeContextValue) => selector(ctx));\n"],"names":["createContext","useContextSelector","ImmutableSet","ImmutableMap","defaultTreeContextValue","level","contextType","treeType","selectionMode","openItems","empty","checkedItems","requestTreeResponse","noop","appearance","size","TreeContext","undefined","useTreeContext_unstable","selector","ctx"],"mappings":"AAAA,SAAmCA,aAAa,EAAEC,kBAAkB,QAAQ,mCAAmC;AAG/G,SAASC,YAAY,QAAQ,wBAAwB;AACrD,SAASC,YAAY,QAAQ,wBAAwB;AA8BrD;;CAEC,GACD,MAAMC,0BAA4C;IAChDC,OAAO;IACPC,aAAa;IACbC,UAAU;IACVC,eAAe;IACfC,WAAWP,aAAaQ,KAAK;IAC7BC,cAAcR,aAAaO,KAAK;IAChCE,qBAAqBC;IACrBC,YAAY;IACZC,MAAM;AACR;AAEA,SAASF;AACP,QAAQ,GACV;AAEA;;CAEC,GACD,OAAO,MAAMG,cAAyChB,cACpDiB,WAC6B;AAE/B,OAAO,MAAMC,0BAA0B,CAAIC,WACzClB,mBAAmBe,aAAa,CAACI,MAAMhB,uBAAuB,GAAKe,SAASC,MAAM"}

package/lib/hooks/useRootTree.js

@@ -65,6 +65,7 @@ import { createNextOpenItems } from './useControllableOpenItems';
         components: {
             root: 'div'
         },
+        contextType: 'root',
         selectionMode,
         open: true,
         appearance,

package/lib/hooks/useRootTree.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useRootTree.ts"],"sourcesContent":["import { SelectionMode, getNativeElementProps, useEventCallback, slot } from '@fluentui/react-utilities';\nimport type {\n  TreeCheckedChangeData,\n  TreeNavigationData_unstable,\n  TreeOpenChangeData,\n  TreeProps,\n  TreeState,\n} from '../Tree';\nimport * as React from 'react';\nimport { TreeItemRequest } from '../contexts/treeContext';\nimport { createOpenItems } from '../utils/createOpenItems';\nimport { createCheckedItems } from '../utils/createCheckedItems';\nimport { treeDataTypes } from '../utils/tokens';\nimport { createNextOpenItems } from './useControllableOpenItems';\n\n/**\n * Create the state required to render the root level tree.\n *\n * @param props - props from this instance of tree\n * @param ref - reference to root HTMLElement of tree\n */\nexport function useRootTree(\n  props: Pick<\n    TreeProps,\n    | 'selectionMode'\n    | 'appearance'\n    | 'size'\n    | 'openItems'\n    | 'checkedItems'\n    | 'onOpenChange'\n    | 'onCheckedChange'\n    | 'onNavigation'\n    | 'aria-label'\n    | 'aria-labelledby'\n  >,\n\n  ref: React.Ref<HTMLElement>,\n): Omit<TreeState, 'treeType'> {\n  warnIfNoProperPropsRootTree(props);\n\n  const { appearance = 'subtle', size = 'medium', selectionMode = 'none' } = props;\n\n  const openItems = React.useMemo(() => createOpenItems(props.openItems), [props.openItems]);\n  const checkedItems = React.useMemo(() => createCheckedItems(props.checkedItems), [props.checkedItems]);\n  const requestOpenChange = (data: TreeOpenChangeData) => {\n    const nextOpenItems = createNextOpenItems(data, openItems);\n    props.onOpenChange?.(data.event, {\n      ...data,\n      openItems: nextOpenItems.dangerouslyGetInternalSet_unstable(),\n    });\n  };\n\n  const requestCheckedChange = (data: TreeCheckedChangeData) => props.onCheckedChange?.(data.event, data);\n\n  const requestNavigation = (data: TreeNavigationData_unstable) => {\n    props.onNavigation?.(data.event, data);\n    switch (data.type) {\n      case treeDataTypes.ArrowDown:\n      case treeDataTypes.ArrowUp:\n      case treeDataTypes.Home:\n      case treeDataTypes.End:\n        // stop the default behavior of the event\n        // which is to scroll the page\n        data.event.preventDefault();\n    }\n  };\n\n  const requestTreeResponse = useEventCallback((request: TreeItemRequest) => {\n    switch (request.requestType) {\n      case 'navigate':\n        return requestNavigation(request);\n      case 'open':\n        return requestOpenChange({\n          ...request,\n          open: request.itemType === 'branch' && !openItems.has(request.value),\n          openItems: openItems.dangerouslyGetInternalSet_unstable(),\n        });\n      case 'selection':\n        return requestCheckedChange({\n          ...request,\n          selectionMode: selectionMode as SelectionMode,\n          checkedItems: checkedItems.dangerouslyGetInternalMap_unstable(),\n        } as TreeCheckedChangeData);\n    }\n  });\n\n  return {\n    components: {\n      root: 'div',\n    },\n    selectionMode,\n    open: true,\n    appearance,\n    size,\n    level: 1,\n    openItems,\n    checkedItems,\n    requestTreeResponse,\n    root: slot.always(\n      getNativeElementProps('div', {\n        ref,\n        role: 'tree',\n        'aria-multiselectable': selectionMode === 'multiselect' ? true : undefined,\n        ...props,\n      }),\n      { elementType: 'div' },\n    ),\n  };\n}\n\nfunction warnIfNoProperPropsRootTree(props: Pick<TreeProps, 'aria-label' | 'aria-labelledby'>) {\n  if (process.env.NODE_ENV === 'development') {\n    if (!props['aria-label'] && !props['aria-labelledby']) {\n      // eslint-disable-next-line no-console\n      console.warn(/* #__DE-INDENT__ */ `\n        @fluentui/react-tree [useRootTree]:\n        Tree must have either a \\`aria-label\\` or \\`aria-labelledby\\` property defined\n      `);\n    }\n  }\n}\n"],"names":["getNativeElementProps","useEventCallback","slot","React","createOpenItems","createCheckedItems","treeDataTypes","createNextOpenItems","useRootTree","props","ref","warnIfNoProperPropsRootTree","appearance","size","selectionMode","openItems","useMemo","checkedItems","requestOpenChange","data","nextOpenItems","onOpenChange","event","dangerouslyGetInternalSet_unstable","requestCheckedChange","onCheckedChange","requestNavigation","onNavigation","type","ArrowDown","ArrowUp","Home","End","preventDefault","requestTreeResponse","request","requestType","open","itemType","has","value","dangerouslyGetInternalMap_unstable","components","root","level","always","role","undefined","elementType","process","env","NODE_ENV","console","warn"],"mappings":"AAAA,SAAwBA,qBAAqB,EAAEC,gBAAgB,EAAEC,IAAI,QAAQ,4BAA4B;AAQzG,YAAYC,WAAW,QAAQ;AAE/B,SAASC,eAAe,QAAQ,2BAA2B;AAC3D,SAASC,kBAAkB,QAAQ,8BAA8B;AACjE,SAASC,aAAa,QAAQ,kBAAkB;AAChD,SAASC,mBAAmB,QAAQ,6BAA6B;AAEjE;;;;;CAKC,GACD,OAAO,SAASC,YACdC,KAYC,EAEDC,GAA2B;IAE3BC,4BAA4BF;IAE5B,MAAM,EAAEG,aAAa,QAAQ,EAAEC,OAAO,QAAQ,EAAEC,gBAAgB,MAAM,EAAE,GAAGL;IAE3E,MAAMM,YAAYZ,MAAMa,OAAO,CAAC,IAAMZ,gBAAgBK,MAAMM,SAAS,GAAG;QAACN,MAAMM,SAAS;KAAC;IACzF,MAAME,eAAed,MAAMa,OAAO,CAAC,IAAMX,mBAAmBI,MAAMQ,YAAY,GAAG;QAACR,MAAMQ,YAAY;KAAC;IACrG,MAAMC,oBAAoB,CAACC;YAEzBV;QADA,MAAMW,gBAAgBb,oBAAoBY,MAAMJ;SAChDN,sBAAAA,MAAMY,YAAY,cAAlBZ,0CAAAA,yBAAAA,OAAqBU,KAAKG,KAAK,EAAE;YAC/B,GAAGH,IAAI;YACPJ,WAAWK,cAAcG,kCAAkC;QAC7D;IACF;IAEA,MAAMC,uBAAuB,CAACL;YAAgCV;gBAAAA,yBAAAA,MAAMgB,eAAe,cAArBhB,6CAAAA,4BAAAA,OAAwBU,KAAKG,KAAK,EAAEH;;IAElG,MAAMO,oBAAoB,CAACP;YACzBV;SAAAA,sBAAAA,MAAMkB,YAAY,cAAlBlB,0CAAAA,yBAAAA,OAAqBU,KAAKG,KAAK,EAAEH;QACjC,OAAQA,KAAKS,IAAI;YACf,KAAKtB,cAAcuB,SAAS;YAC5B,KAAKvB,cAAcwB,OAAO;YAC1B,KAAKxB,cAAcyB,IAAI;YACvB,KAAKzB,cAAc0B,GAAG;gBACpB,yCAAyC;gBACzC,8BAA8B;gBAC9Bb,KAAKG,KAAK,CAACW,cAAc;QAC7B;IACF;IAEA,MAAMC,sBAAsBjC,iBAAiB,CAACkC;QAC5C,OAAQA,QAAQC,WAAW;YACzB,KAAK;gBACH,OAAOV,kBAAkBS;YAC3B,KAAK;gBACH,OAAOjB,kBAAkB;oBACvB,GAAGiB,OAAO;oBACVE,MAAMF,QAAQG,QAAQ,KAAK,YAAY,CAACvB,UAAUwB,GAAG,CAACJ,QAAQK,KAAK;oBACnEzB,WAAWA,UAAUQ,kCAAkC;gBACzD;YACF,KAAK;gBACH,OAAOC,qBAAqB;oBAC1B,GAAGW,OAAO;oBACVrB,eAAeA;oBACfG,cAAcA,aAAawB,kCAAkC;gBAC/D;QACJ;IACF;IAEA,OAAO;QACLC,YAAY;YACVC,MAAM;QACR;QACA7B;QACAuB,MAAM;QACNzB;QACAC;QACA+B,OAAO;QACP7B;QACAE;QACAiB;QACAS,MAAMzC,KAAK2C,MAAM,CACf7C,sBAAsB,OAAO;YAC3BU;YACAoC,MAAM;YACN,wBAAwBhC,kBAAkB,gBAAgB,OAAOiC;YACjE,GAAGtC,KAAK;QACV,IACA;YAAEuC,aAAa;QAAM;IAEzB;AACF;AAEA,SAASrC,4BAA4BF,KAAwD;IAC3F,IAAIwC,QAAQC,GAAG,CAACC,QAAQ,KAAK,eAAe;QAC1C,IAAI,CAAC1C,KAAK,CAAC,aAAa,IAAI,CAACA,KAAK,CAAC,kBAAkB,EAAE;YACrD,sCAAsC;YACtC2C,QAAQC,IAAI,CAAsB,CAAC;8EAGnC,CAAC;QACH;IACF;AACF"}
+{"version":3,"sources":["useRootTree.ts"],"sourcesContent":["import { SelectionMode, getNativeElementProps, useEventCallback, slot } from '@fluentui/react-utilities';\nimport type {\n  TreeCheckedChangeData,\n  TreeNavigationData_unstable,\n  TreeOpenChangeData,\n  TreeProps,\n  TreeState,\n} from '../Tree';\nimport * as React from 'react';\nimport { TreeContextValue, TreeItemRequest } from '../contexts/treeContext';\nimport { createOpenItems } from '../utils/createOpenItems';\nimport { createCheckedItems } from '../utils/createCheckedItems';\nimport { treeDataTypes } from '../utils/tokens';\nimport { createNextOpenItems } from './useControllableOpenItems';\n\n/**\n * Create the state required to render the root level tree.\n *\n * @param props - props from this instance of tree\n * @param ref - reference to root HTMLElement of tree\n */\nexport function useRootTree(\n  props: Pick<\n    TreeProps,\n    | 'selectionMode'\n    | 'appearance'\n    | 'size'\n    | 'openItems'\n    | 'checkedItems'\n    | 'onOpenChange'\n    | 'onCheckedChange'\n    | 'onNavigation'\n    | 'aria-label'\n    | 'aria-labelledby'\n  >,\n\n  ref: React.Ref<HTMLElement>,\n): Omit<TreeState & TreeContextValue, 'treeType'> {\n  warnIfNoProperPropsRootTree(props);\n\n  const { appearance = 'subtle', size = 'medium', selectionMode = 'none' } = props;\n\n  const openItems = React.useMemo(() => createOpenItems(props.openItems), [props.openItems]);\n  const checkedItems = React.useMemo(() => createCheckedItems(props.checkedItems), [props.checkedItems]);\n  const requestOpenChange = (data: TreeOpenChangeData) => {\n    const nextOpenItems = createNextOpenItems(data, openItems);\n    props.onOpenChange?.(data.event, {\n      ...data,\n      openItems: nextOpenItems.dangerouslyGetInternalSet_unstable(),\n    });\n  };\n\n  const requestCheckedChange = (data: TreeCheckedChangeData) => props.onCheckedChange?.(data.event, data);\n\n  const requestNavigation = (data: TreeNavigationData_unstable) => {\n    props.onNavigation?.(data.event, data);\n    switch (data.type) {\n      case treeDataTypes.ArrowDown:\n      case treeDataTypes.ArrowUp:\n      case treeDataTypes.Home:\n      case treeDataTypes.End:\n        // stop the default behavior of the event\n        // which is to scroll the page\n        data.event.preventDefault();\n    }\n  };\n\n  const requestTreeResponse = useEventCallback((request: TreeItemRequest) => {\n    switch (request.requestType) {\n      case 'navigate':\n        return requestNavigation(request);\n      case 'open':\n        return requestOpenChange({\n          ...request,\n          open: request.itemType === 'branch' && !openItems.has(request.value),\n          openItems: openItems.dangerouslyGetInternalSet_unstable(),\n        });\n      case 'selection':\n        return requestCheckedChange({\n          ...request,\n          selectionMode: selectionMode as SelectionMode,\n          checkedItems: checkedItems.dangerouslyGetInternalMap_unstable(),\n        } as TreeCheckedChangeData);\n    }\n  });\n\n  return {\n    components: {\n      root: 'div',\n    },\n    contextType: 'root',\n    selectionMode,\n    open: true,\n    appearance,\n    size,\n    level: 1,\n    openItems,\n    checkedItems,\n    requestTreeResponse,\n    root: slot.always(\n      getNativeElementProps('div', {\n        ref,\n        role: 'tree',\n        'aria-multiselectable': selectionMode === 'multiselect' ? true : undefined,\n        ...props,\n      }),\n      { elementType: 'div' },\n    ),\n  };\n}\n\nfunction warnIfNoProperPropsRootTree(props: Pick<TreeProps, 'aria-label' | 'aria-labelledby'>) {\n  if (process.env.NODE_ENV === 'development') {\n    if (!props['aria-label'] && !props['aria-labelledby']) {\n      // eslint-disable-next-line no-console\n      console.warn(/* #__DE-INDENT__ */ `\n        @fluentui/react-tree [useRootTree]:\n        Tree must have either a \\`aria-label\\` or \\`aria-labelledby\\` property defined\n      `);\n    }\n  }\n}\n"],"names":["getNativeElementProps","useEventCallback","slot","React","createOpenItems","createCheckedItems","treeDataTypes","createNextOpenItems","useRootTree","props","ref","warnIfNoProperPropsRootTree","appearance","size","selectionMode","openItems","useMemo","checkedItems","requestOpenChange","data","nextOpenItems","onOpenChange","event","dangerouslyGetInternalSet_unstable","requestCheckedChange","onCheckedChange","requestNavigation","onNavigation","type","ArrowDown","ArrowUp","Home","End","preventDefault","requestTreeResponse","request","requestType","open","itemType","has","value","dangerouslyGetInternalMap_unstable","components","root","contextType","level","always","role","undefined","elementType","process","env","NODE_ENV","console","warn"],"mappings":"AAAA,SAAwBA,qBAAqB,EAAEC,gBAAgB,EAAEC,IAAI,QAAQ,4BAA4B;AAQzG,YAAYC,WAAW,QAAQ;AAE/B,SAASC,eAAe,QAAQ,2BAA2B;AAC3D,SAASC,kBAAkB,QAAQ,8BAA8B;AACjE,SAASC,aAAa,QAAQ,kBAAkB;AAChD,SAASC,mBAAmB,QAAQ,6BAA6B;AAEjE;;;;;CAKC,GACD,OAAO,SAASC,YACdC,KAYC,EAEDC,GAA2B;IAE3BC,4BAA4BF;IAE5B,MAAM,EAAEG,aAAa,QAAQ,EAAEC,OAAO,QAAQ,EAAEC,gBAAgB,MAAM,EAAE,GAAGL;IAE3E,MAAMM,YAAYZ,MAAMa,OAAO,CAAC,IAAMZ,gBAAgBK,MAAMM,SAAS,GAAG;QAACN,MAAMM,SAAS;KAAC;IACzF,MAAME,eAAed,MAAMa,OAAO,CAAC,IAAMX,mBAAmBI,MAAMQ,YAAY,GAAG;QAACR,MAAMQ,YAAY;KAAC;IACrG,MAAMC,oBAAoB,CAACC;YAEzBV;QADA,MAAMW,gBAAgBb,oBAAoBY,MAAMJ;SAChDN,sBAAAA,MAAMY,YAAY,cAAlBZ,0CAAAA,yBAAAA,OAAqBU,KAAKG,KAAK,EAAE;YAC/B,GAAGH,IAAI;YACPJ,WAAWK,cAAcG,kCAAkC;QAC7D;IACF;IAEA,MAAMC,uBAAuB,CAACL;YAAgCV;gBAAAA,yBAAAA,MAAMgB,eAAe,cAArBhB,6CAAAA,4BAAAA,OAAwBU,KAAKG,KAAK,EAAEH;;IAElG,MAAMO,oBAAoB,CAACP;YACzBV;SAAAA,sBAAAA,MAAMkB,YAAY,cAAlBlB,0CAAAA,yBAAAA,OAAqBU,KAAKG,KAAK,EAAEH;QACjC,OAAQA,KAAKS,IAAI;YACf,KAAKtB,cAAcuB,SAAS;YAC5B,KAAKvB,cAAcwB,OAAO;YAC1B,KAAKxB,cAAcyB,IAAI;YACvB,KAAKzB,cAAc0B,GAAG;gBACpB,yCAAyC;gBACzC,8BAA8B;gBAC9Bb,KAAKG,KAAK,CAACW,cAAc;QAC7B;IACF;IAEA,MAAMC,sBAAsBjC,iBAAiB,CAACkC;QAC5C,OAAQA,QAAQC,WAAW;YACzB,KAAK;gBACH,OAAOV,kBAAkBS;YAC3B,KAAK;gBACH,OAAOjB,kBAAkB;oBACvB,GAAGiB,OAAO;oBACVE,MAAMF,QAAQG,QAAQ,KAAK,YAAY,CAACvB,UAAUwB,GAAG,CAACJ,QAAQK,KAAK;oBACnEzB,WAAWA,UAAUQ,kCAAkC;gBACzD;YACF,KAAK;gBACH,OAAOC,qBAAqB;oBAC1B,GAAGW,OAAO;oBACVrB,eAAeA;oBACfG,cAAcA,aAAawB,kCAAkC;gBAC/D;QACJ;IACF;IAEA,OAAO;QACLC,YAAY;YACVC,MAAM;QACR;QACAC,aAAa;QACb9B;QACAuB,MAAM;QACNzB;QACAC;QACAgC,OAAO;QACP9B;QACAE;QACAiB;QACAS,MAAMzC,KAAK4C,MAAM,CACf9C,sBAAsB,OAAO;YAC3BU;YACAqC,MAAM;YACN,wBAAwBjC,kBAAkB,gBAAgB,OAAOkC;YACjE,GAAGvC,KAAK;QACV,IACA;YAAEwC,aAAa;QAAM;IAEzB;AACF;AAEA,SAAStC,4BAA4BF,KAAwD;IAC3F,IAAIyC,QAAQC,GAAG,CAACC,QAAQ,KAAK,eAAe;QAC1C,IAAI,CAAC3C,KAAK,CAAC,aAAa,IAAI,CAACA,KAAK,CAAC,kBAAkB,EAAE;YACrD,sCAAsC;YACtC4C,QAAQC,IAAI,CAAsB,CAAC;8EAGnC,CAAC;QACH;IACF;AACF"}

package/lib/hooks/useSubtree.js

@@ -7,24 +7,15 @@ import { getNativeElementProps, useMergedRefs, slot } from '@fluentui/react-util
  * @param props - props from this instance of tree
  * @param ref - reference to root HTMLElement of tree
  */ export function useSubtree(props, ref) {
-    const contextAppearance = useTreeContext_unstable((ctx)=>ctx.appearance);
-    const contextSize = useTreeContext_unstable((ctx)=>ctx.size);
     const subtreeRef = useTreeItemContext_unstable((ctx)=>ctx.subtreeRef);
-    const { appearance = contextAppearance !== null && contextAppearance !== void 0 ? contextAppearance : 'subtle', size = contextSize !== null && contextSize !== void 0 ? contextSize : 'medium' } = props;
     const parentLevel = useTreeContext_unstable((ctx)=>ctx.level);
-    const selectionMode = useTreeContext_unstable((ctx)=>ctx.selectionMode);
-    const openItems = useTreeContext_unstable((ctx)=>ctx.openItems);
-    const checkedItems = useTreeContext_unstable((ctx)=>ctx.checkedItems);
-    const requestTreeResponse = useTreeContext_unstable((ctx)=>ctx.requestTreeResponse);
     const open = useTreeItemContext_unstable((ctx)=>ctx.open);
     return {
+        contextType: 'subtree',
         open,
         components: {
             root: 'div'
         },
-        appearance,
-        size,
-        selectionMode,
         level: parentLevel + 1,
         root: slot.always(getNativeElementProps('div', {
             ref: useMergedRefs(ref, subtreeRef),
@@ -32,9 +23,6 @@ import { getNativeElementProps, useMergedRefs, slot } from '@fluentui/react-util
             ...props
         }), {
             elementType: 'div'
-        }),
-        openItems,
-        checkedItems,
-        requestTreeResponse
+        })
     };
 }

package/lib/hooks/useSubtree.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useSubtree.ts"],"sourcesContent":["import * as React from 'react';\nimport { TreeProps, TreeState } from '../Tree';\nimport { useTreeContext_unstable, useTreeItemContext_unstable } from '../contexts/index';\nimport { getNativeElementProps, useMergedRefs, slot } from '@fluentui/react-utilities';\n\n/**\n * Create the state required to render a sub-level tree.\n *\n * @param props - props from this instance of tree\n * @param ref - reference to root HTMLElement of tree\n */\nexport function useSubtree(\n  props: Pick<TreeProps, 'appearance' | 'size'>,\n  ref: React.Ref<HTMLElement>,\n): Omit<TreeState, 'treeType'> {\n  const contextAppearance = useTreeContext_unstable(ctx => ctx.appearance);\n  const contextSize = useTreeContext_unstable(ctx => ctx.size);\n  const subtreeRef = useTreeItemContext_unstable(ctx => ctx.subtreeRef);\n\n  const { appearance = contextAppearance ?? 'subtle', size = contextSize ?? 'medium' } = props;\n\n  const parentLevel = useTreeContext_unstable(ctx => ctx.level);\n  const selectionMode = useTreeContext_unstable(ctx => ctx.selectionMode);\n  const openItems = useTreeContext_unstable(ctx => ctx.openItems);\n  const checkedItems = useTreeContext_unstable(ctx => ctx.checkedItems);\n  const requestTreeResponse = useTreeContext_unstable(ctx => ctx.requestTreeResponse);\n\n  const open = useTreeItemContext_unstable(ctx => ctx.open);\n\n  return {\n    open,\n    components: {\n      root: 'div',\n    },\n    appearance,\n    size,\n    selectionMode,\n    level: parentLevel + 1,\n    root: slot.always(\n      getNativeElementProps('div', {\n        ref: useMergedRefs(ref, subtreeRef),\n        role: 'group',\n        ...props,\n      }),\n      { elementType: 'div' },\n    ),\n    openItems,\n    checkedItems,\n    requestTreeResponse,\n  };\n}\n"],"names":["React","useTreeContext_unstable","useTreeItemContext_unstable","getNativeElementProps","useMergedRefs","slot","useSubtree","props","ref","contextAppearance","ctx","appearance","contextSize","size","subtreeRef","parentLevel","level","selectionMode","openItems","checkedItems","requestTreeResponse","open","components","root","always","role","elementType"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,uBAAuB,EAAEC,2BAA2B,QAAQ,oBAAoB;AACzF,SAASC,qBAAqB,EAAEC,aAAa,EAAEC,IAAI,QAAQ,4BAA4B;AAEvF;;;;;CAKC,GACD,OAAO,SAASC,WACdC,KAA6C,EAC7CC,GAA2B;IAE3B,MAAMC,oBAAoBR,wBAAwBS,CAAAA,MAAOA,IAAIC,UAAU;IACvE,MAAMC,cAAcX,wBAAwBS,CAAAA,MAAOA,IAAIG,IAAI;IAC3D,MAAMC,aAAaZ,4BAA4BQ,CAAAA,MAAOA,IAAII,UAAU;IAEpE,MAAM,EAAEH,aAAaF,8BAAAA,+BAAAA,oBAAqB,QAAQ,EAAEI,OAAOD,wBAAAA,yBAAAA,cAAe,QAAQ,EAAE,GAAGL;IAEvF,MAAMQ,cAAcd,wBAAwBS,CAAAA,MAAOA,IAAIM,KAAK;IAC5D,MAAMC,gBAAgBhB,wBAAwBS,CAAAA,MAAOA,IAAIO,aAAa;IACtE,MAAMC,YAAYjB,wBAAwBS,CAAAA,MAAOA,IAAIQ,SAAS;IAC9D,MAAMC,eAAelB,wBAAwBS,CAAAA,MAAOA,IAAIS,YAAY;IACpE,MAAMC,sBAAsBnB,wBAAwBS,CAAAA,MAAOA,IAAIU,mBAAmB;IAElF,MAAMC,OAAOnB,4BAA4BQ,CAAAA,MAAOA,IAAIW,IAAI;IAExD,OAAO;QACLA;QACAC,YAAY;YACVC,MAAM;QACR;QACAZ;QACAE;QACAI;QACAD,OAAOD,cAAc;QACrBQ,MAAMlB,KAAKmB,MAAM,CACfrB,sBAAsB,OAAO;YAC3BK,KAAKJ,cAAcI,KAAKM;YACxBW,MAAM;YACN,GAAGlB,KAAK;QACV,IACA;YAAEmB,aAAa;QAAM;QAEvBR;QACAC;QACAC;IACF;AACF"}
+{"version":3,"sources":["useSubtree.ts"],"sourcesContent":["import * as React from 'react';\nimport { TreeProps, TreeState } from '../Tree';\nimport { SubtreeContextValue, useTreeContext_unstable, useTreeItemContext_unstable } from '../contexts/index';\nimport { getNativeElementProps, useMergedRefs, slot } from '@fluentui/react-utilities';\n\n/**\n * Create the state required to render a sub-level tree.\n *\n * @param props - props from this instance of tree\n * @param ref - reference to root HTMLElement of tree\n */\nexport function useSubtree(\n  props: Pick<TreeProps, 'appearance' | 'size'>,\n  ref: React.Ref<HTMLElement>,\n): Omit<TreeState & SubtreeContextValue, 'treeType'> {\n  const subtreeRef = useTreeItemContext_unstable(ctx => ctx.subtreeRef);\n\n  const parentLevel = useTreeContext_unstable(ctx => ctx.level);\n\n  const open = useTreeItemContext_unstable(ctx => ctx.open);\n\n  return {\n    contextType: 'subtree',\n    open,\n    components: {\n      root: 'div',\n    },\n    level: parentLevel + 1,\n    root: slot.always(\n      getNativeElementProps('div', {\n        ref: useMergedRefs(ref, subtreeRef),\n        role: 'group',\n        ...props,\n      }),\n      { elementType: 'div' },\n    ),\n  };\n}\n"],"names":["React","useTreeContext_unstable","useTreeItemContext_unstable","getNativeElementProps","useMergedRefs","slot","useSubtree","props","ref","subtreeRef","ctx","parentLevel","level","open","contextType","components","root","always","role","elementType"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,SAA8BC,uBAAuB,EAAEC,2BAA2B,QAAQ,oBAAoB;AAC9G,SAASC,qBAAqB,EAAEC,aAAa,EAAEC,IAAI,QAAQ,4BAA4B;AAEvF;;;;;CAKC,GACD,OAAO,SAASC,WACdC,KAA6C,EAC7CC,GAA2B;IAE3B,MAAMC,aAAaP,4BAA4BQ,CAAAA,MAAOA,IAAID,UAAU;IAEpE,MAAME,cAAcV,wBAAwBS,CAAAA,MAAOA,IAAIE,KAAK;IAE5D,MAAMC,OAAOX,4BAA4BQ,CAAAA,MAAOA,IAAIG,IAAI;IAExD,OAAO;QACLC,aAAa;QACbD;QACAE,YAAY;YACVC,MAAM;QACR;QACAJ,OAAOD,cAAc;QACrBK,MAAMX,KAAKY,MAAM,CACfd,sBAAsB,OAAO;YAC3BK,KAAKJ,cAAcI,KAAKC;YACxBS,MAAM;YACN,GAAGX,KAAK;QACV,IACA;YAAEY,aAAa;QAAM;IAEzB;AACF"}

package/lib/index.js

@@ -1,6 +1,7 @@
 export { Tree, treeClassNames, useTree_unstable, useTreeStyles_unstable, useTreeContextValues_unstable, renderTree_unstable } from './Tree';
 export { FlatTree, flatTreeClassNames, useFlatTree_unstable, useFlatTreeStyles_unstable, useFlatTreeContextValues_unstable, renderFlatTree_unstable } from './FlatTree';
-export { useTreeContext_unstable, useTreeItemContext_unstable, TreeItemProvider, TreeProvider } from './contexts';
+export { TreeProvider } from './components/TreeProvider';
+export { useTreeContext_unstable, useTreeItemContext_unstable, useSubtreeContext_unstable, TreeItemProvider } from './contexts';
 export { treeItemLevelToken } from './utils/tokens';
 export { useHeadlessFlatTree_unstable } from './components/FlatTree/useHeadlessFlatTree';
 export { TreeItem, treeItemClassNames, renderTreeItem_unstable, useTreeItemStyles_unstable, useTreeItemContextValues_unstable, useTreeItem_unstable } from './TreeItem';

package/lib/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["index.ts"],"sourcesContent":["export {\n  Tree,\n  treeClassNames,\n  useTree_unstable,\n  useTreeStyles_unstable,\n  useTreeContextValues_unstable,\n  renderTree_unstable,\n} from './Tree';\n\nexport type {\n  TreeSlots,\n  TreeProps,\n  TreeState,\n  TreeContextValues,\n  TreeOpenChangeData,\n  TreeSelectionValue,\n  TreeOpenChangeEvent,\n  TreeCheckedChangeData,\n  TreeCheckedChangeEvent,\n  TreeNavigationData_unstable,\n  TreeNavigationEvent_unstable,\n} from './Tree';\n\nexport {\n  FlatTree,\n  flatTreeClassNames,\n  useFlatTree_unstable,\n  useFlatTreeStyles_unstable,\n  useFlatTreeContextValues_unstable,\n  renderFlatTree_unstable,\n} from './FlatTree';\n\nexport type { FlatTreeSlots, FlatTreeProps, FlatTreeState } from './FlatTree';\n\nexport { useTreeContext_unstable, useTreeItemContext_unstable, TreeItemProvider, TreeProvider } from './contexts';\nexport type { TreeContextValue, TreeItemContextValue } from './contexts';\n\nexport { treeItemLevelToken } from './utils/tokens';\n\nexport { useHeadlessFlatTree_unstable } from './components/FlatTree/useHeadlessFlatTree';\nexport type {\n  HeadlessFlatTree,\n  HeadlessFlatTreeItem,\n  HeadlessFlatTreeItemProps,\n  HeadlessFlatTreeOptions,\n} from './components/FlatTree/useHeadlessFlatTree';\n\nexport {\n  TreeItem,\n  treeItemClassNames,\n  renderTreeItem_unstable,\n  useTreeItemStyles_unstable,\n  useTreeItemContextValues_unstable,\n  useTreeItem_unstable,\n} from './TreeItem';\nexport type {\n  TreeItemProps,\n  TreeItemState,\n  TreeItemSlots,\n  TreeItemValue,\n  TreeItemOpenChangeData,\n  TreeItemOpenChangeEvent,\n} from './TreeItem';\n\nexport { FlatTreeItem } from './FlatTreeItem';\nexport type { FlatTreeItemProps } from './FlatTreeItem';\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 { flattenTree_unstable } from './utils/flattenTree';\nexport type { FlattenTreeItem } from './utils/flattenTree';\n"],"names":["Tree","treeClassNames","useTree_unstable","useTreeStyles_unstable","useTreeContextValues_unstable","renderTree_unstable","FlatTree","flatTreeClassNames","useFlatTree_unstable","useFlatTreeStyles_unstable","useFlatTreeContextValues_unstable","renderFlatTree_unstable","useTreeContext_unstable","useTreeItemContext_unstable","TreeItemProvider","TreeProvider","treeItemLevelToken","useHeadlessFlatTree_unstable","TreeItem","treeItemClassNames","renderTreeItem_unstable","useTreeItemStyles_unstable","useTreeItemContextValues_unstable","useTreeItem_unstable","FlatTreeItem","TreeItemLayout","treeItemLayoutClassNames","renderTreeItemLayout_unstable","useTreeItemLayoutStyles_unstable","useTreeItemLayout_unstable","TreeItemPersonaLayout","treeItemPersonaLayoutClassNames","renderTreeItemPersonaLayout_unstable","useTreeItemPersonaLayoutStyles_unstable","useTreeItemPersonaLayout_unstable","flattenTree_unstable"],"mappings":"AAAA,SACEA,IAAI,EACJC,cAAc,EACdC,gBAAgB,EAChBC,sBAAsB,EACtBC,6BAA6B,EAC7BC,mBAAmB,QACd,SAAS;AAgBhB,SACEC,QAAQ,EACRC,kBAAkB,EAClBC,oBAAoB,EACpBC,0BAA0B,EAC1BC,iCAAiC,EACjCC,uBAAuB,QAClB,aAAa;AAIpB,SAASC,uBAAuB,EAAEC,2BAA2B,EAAEC,gBAAgB,EAAEC,YAAY,QAAQ,aAAa;AAGlH,SAASC,kBAAkB,QAAQ,iBAAiB;AAEpD,SAASC,4BAA4B,QAAQ,4CAA4C;AAQzF,SACEC,QAAQ,EACRC,kBAAkB,EAClBC,uBAAuB,EACvBC,0BAA0B,EAC1BC,iCAAiC,EACjCC,oBAAoB,QACf,aAAa;AAUpB,SAASC,YAAY,QAAQ,iBAAiB;AAG9C,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,sBAAsB"}
+{"version":3,"sources":["index.ts"],"sourcesContent":["export {\n  Tree,\n  treeClassNames,\n  useTree_unstable,\n  useTreeStyles_unstable,\n  useTreeContextValues_unstable,\n  renderTree_unstable,\n} from './Tree';\n\nexport type {\n  TreeSlots,\n  TreeProps,\n  TreeState,\n  TreeContextValues,\n  TreeOpenChangeData,\n  TreeSelectionValue,\n  TreeOpenChangeEvent,\n  TreeCheckedChangeData,\n  TreeCheckedChangeEvent,\n  TreeNavigationData_unstable,\n  TreeNavigationEvent_unstable,\n} from './Tree';\n\nexport {\n  FlatTree,\n  flatTreeClassNames,\n  useFlatTree_unstable,\n  useFlatTreeStyles_unstable,\n  useFlatTreeContextValues_unstable,\n  renderFlatTree_unstable,\n} from './FlatTree';\n\nexport type { FlatTreeSlots, FlatTreeProps, FlatTreeState } from './FlatTree';\n\nexport { TreeProvider } from './components/TreeProvider';\n\nexport {\n  useTreeContext_unstable,\n  useTreeItemContext_unstable,\n  useSubtreeContext_unstable,\n  TreeItemProvider,\n} from './contexts';\nexport type { TreeContextValue, SubtreeContextValue, TreeItemContextValue } from './contexts';\n\nexport { treeItemLevelToken } from './utils/tokens';\n\nexport { useHeadlessFlatTree_unstable } from './components/FlatTree/useHeadlessFlatTree';\nexport type {\n  HeadlessFlatTree,\n  HeadlessFlatTreeItem,\n  HeadlessFlatTreeItemProps,\n  HeadlessFlatTreeOptions,\n} from './components/FlatTree/useHeadlessFlatTree';\n\nexport {\n  TreeItem,\n  treeItemClassNames,\n  renderTreeItem_unstable,\n  useTreeItemStyles_unstable,\n  useTreeItemContextValues_unstable,\n  useTreeItem_unstable,\n} from './TreeItem';\nexport type {\n  TreeItemProps,\n  TreeItemState,\n  TreeItemSlots,\n  TreeItemValue,\n  TreeItemOpenChangeData,\n  TreeItemOpenChangeEvent,\n} from './TreeItem';\n\nexport { FlatTreeItem } from './FlatTreeItem';\nexport type { FlatTreeItemProps } from './FlatTreeItem';\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 { flattenTree_unstable } from './utils/flattenTree';\nexport type { FlattenTreeItem } from './utils/flattenTree';\n"],"names":["Tree","treeClassNames","useTree_unstable","useTreeStyles_unstable","useTreeContextValues_unstable","renderTree_unstable","FlatTree","flatTreeClassNames","useFlatTree_unstable","useFlatTreeStyles_unstable","useFlatTreeContextValues_unstable","renderFlatTree_unstable","TreeProvider","useTreeContext_unstable","useTreeItemContext_unstable","useSubtreeContext_unstable","TreeItemProvider","treeItemLevelToken","useHeadlessFlatTree_unstable","TreeItem","treeItemClassNames","renderTreeItem_unstable","useTreeItemStyles_unstable","useTreeItemContextValues_unstable","useTreeItem_unstable","FlatTreeItem","TreeItemLayout","treeItemLayoutClassNames","renderTreeItemLayout_unstable","useTreeItemLayoutStyles_unstable","useTreeItemLayout_unstable","TreeItemPersonaLayout","treeItemPersonaLayoutClassNames","renderTreeItemPersonaLayout_unstable","useTreeItemPersonaLayoutStyles_unstable","useTreeItemPersonaLayout_unstable","flattenTree_unstable"],"mappings":"AAAA,SACEA,IAAI,EACJC,cAAc,EACdC,gBAAgB,EAChBC,sBAAsB,EACtBC,6BAA6B,EAC7BC,mBAAmB,QACd,SAAS;AAgBhB,SACEC,QAAQ,EACRC,kBAAkB,EAClBC,oBAAoB,EACpBC,0BAA0B,EAC1BC,iCAAiC,EACjCC,uBAAuB,QAClB,aAAa;AAIpB,SAASC,YAAY,QAAQ,4BAA4B;AAEzD,SACEC,uBAAuB,EACvBC,2BAA2B,EAC3BC,0BAA0B,EAC1BC,gBAAgB,QACX,aAAa;AAGpB,SAASC,kBAAkB,QAAQ,iBAAiB;AAEpD,SAASC,4BAA4B,QAAQ,4CAA4C;AAQzF,SACEC,QAAQ,EACRC,kBAAkB,EAClBC,uBAAuB,EACvBC,0BAA0B,EAC1BC,iCAAiC,EACjCC,oBAAoB,QACf,aAAa;AAUpB,SAASC,YAAY,QAAQ,iBAAiB;AAG9C,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,sBAAsB"}

package/lib-commonjs/components/FlatTree/useFlatTree.js

@@ -18,6 +18,8 @@ const _treeItemFilter = require("../../utils/treeItemFilter");
 const _reactutilities = require("@fluentui/react-utilities");
 const _treeContext = require("../../contexts/treeContext");
 const _useSubtree = require("../../hooks/useSubtree");
+const _ImmutableSet = require("../../utils/ImmutableSet");
+const _ImmutableMap = require("../../utils/ImmutableMap");
 const useFlatTree_unstable = (props, ref)=>{
     const level = (0, _treeContext.useTreeContext_unstable)((ctx)=>ctx.level);
     // as level is static, this doesn't break rule of hooks
@@ -62,13 +64,25 @@ You cannot use a <FlatTree> component inside of another <FlatTree> component.`);
     }
     return {
         ...(0, _useSubtree.useSubtree)(props, ref),
+        // ------ defaultTreeContextValue
+        level: 0,
+        contextType: 'root',
+        treeType: 'nested',
+        selectionMode: 'none',
+        openItems: _ImmutableSet.ImmutableSet.empty,
+        checkedItems: _ImmutableMap.ImmutableMap.empty,
+        requestTreeResponse: noop,
+        appearance: 'subtle',
+        size: 'medium',
+        // ------ defaultTreeContextValue
         open: false,
-        treeType: 'flat',
         components: {
             root: _react.Fragment
         },
-        root: _reactutilities.slot.always(undefined, {
+        root: _reactutilities.slot.always(props, {
             elementType: _react.Fragment
         })
     };
 }
+function noop() {
+/* do nothing */ }

package/lib-commonjs/components/FlatTree/useFlatTree.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useFlatTree.js"],"sourcesContent":["import * as React from 'react';\nimport { useRootTree } from '../../hooks/useRootTree';\nimport { useFlatTreeNavigation } from './useFlatTreeNavigation';\nimport { createHTMLElementWalker } from '../../utils/createHTMLElementWalker';\nimport { useFluent_unstable } from '@fluentui/react-shared-contexts';\nimport { treeItemFilter } from '../../utils/treeItemFilter';\nimport { slot, useEventCallback, useMergedRefs } from '@fluentui/react-utilities';\nimport { useTreeContext_unstable } from '../../contexts/treeContext';\nimport { useSubtree } from '../../hooks/useSubtree';\nexport const useFlatTree_unstable = (props, ref)=>{\n    const level = useTreeContext_unstable((ctx)=>ctx.level);\n    // as level is static, this doesn't break rule of hooks\n    // and if this becomes an issue later on, this can be easily converted\n    // eslint-disable-next-line react-hooks/rules-of-hooks\n    return level > 1 ? useSubFlatTree(props, ref) : useRootFlatTree(props, ref);\n};\nfunction useRootFlatTree(props, ref) {\n    const { navigate, initialize } = useFlatTreeNavigation();\n    const walkerRef = React.useRef();\n    const { targetDocument } = useFluent_unstable();\n    const initializeWalker = React.useCallback((root)=>{\n        if (root && targetDocument) {\n            walkerRef.current = createHTMLElementWalker(root, targetDocument, treeItemFilter);\n            initialize(walkerRef.current);\n        }\n    }, [\n        initialize,\n        targetDocument\n    ]);\n    const handleNavigation = useEventCallback((event, data)=>{\n        var _props_onNavigation;\n        (_props_onNavigation = props.onNavigation) === null || _props_onNavigation === void 0 ? void 0 : _props_onNavigation.call(props, event, data);\n        if (walkerRef.current && !event.isDefaultPrevented()) {\n            navigate(data, walkerRef.current);\n        }\n    });\n    return {\n        treeType: 'flat',\n        ...useRootTree({\n            ...props,\n            onNavigation: handleNavigation\n        }, useMergedRefs(ref, initializeWalker))\n    };\n}\nfunction useSubFlatTree(props, ref) {\n    if (process.env.NODE_ENV === 'development') {\n        // eslint-disable-next-line no-console\n        console.error(`@fluentui/react-tree [useFlatTree]:\nSubtrees are not allowed in a FlatTree!\nYou cannot use a <FlatTree> component inside of another <FlatTree> component.`);\n    }\n    return {\n        ...useSubtree(props, ref),\n        open: false,\n        treeType: 'flat',\n        components: {\n            root: React.Fragment\n        },\n        root: slot.always(undefined, {\n            elementType: React.Fragment\n        })\n    };\n}\n"],"names":["useFlatTree_unstable","props","ref","level","useTreeContext_unstable","ctx","useSubFlatTree","useRootFlatTree","navigate","initialize","useFlatTreeNavigation","walkerRef","React","useRef","targetDocument","useFluent_unstable","initializeWalker","useCallback","root","current","createHTMLElementWalker","treeItemFilter","handleNavigation","useEventCallback","event","data","_props_onNavigation","onNavigation","call","isDefaultPrevented","treeType","useRootTree","useMergedRefs","process","env","NODE_ENV","console","error","useSubtree","open","components","Fragment","slot","always","undefined","elementType"],"mappings":";;;;+BASaA;;;eAAAA;;;;iEATU;6BACK;uCACU;yCACE;qCACL;gCACJ;gCACuB;6BACd;4BACb;AACpB,MAAMA,uBAAuB,CAACC,OAAOC;IACxC,MAAMC,QAAQC,IAAAA,oCAAuB,EAAC,CAACC,MAAMA,IAAIF,KAAK;IACtD,uDAAuD;IACvD,sEAAsE;IACtE,sDAAsD;IACtD,OAAOA,QAAQ,IAAIG,eAAeL,OAAOC,OAAOK,gBAAgBN,OAAOC;AAC3E;AACA,SAASK,gBAAgBN,KAAK,EAAEC,GAAG;IAC/B,MAAM,EAAEM,QAAQ,EAAEC,UAAU,EAAE,GAAGC,IAAAA,4CAAqB;IACtD,MAAMC,YAAYC,OAAMC,MAAM;IAC9B,MAAM,EAAEC,cAAc,EAAE,GAAGC,IAAAA,uCAAkB;IAC7C,MAAMC,mBAAmBJ,OAAMK,WAAW,CAAC,CAACC;QACxC,IAAIA,QAAQJ,gBAAgB;YACxBH,UAAUQ,OAAO,GAAGC,IAAAA,gDAAuB,EAACF,MAAMJ,gBAAgBO,8BAAc;YAChFZ,WAAWE,UAAUQ,OAAO;QAChC;IACJ,GAAG;QACCV;QACAK;KACH;IACD,MAAMQ,mBAAmBC,IAAAA,gCAAgB,EAAC,CAACC,OAAOC;QAC9C,IAAIC;QACHA,CAAAA,sBAAsBzB,MAAM0B,YAAY,AAAD,MAAO,QAAQD,wBAAwB,KAAK,IAAI,KAAK,IAAIA,oBAAoBE,IAAI,CAAC3B,OAAOuB,OAAOC;QACxI,IAAId,UAAUQ,OAAO,IAAI,CAACK,MAAMK,kBAAkB,IAAI;YAClDrB,SAASiB,MAAMd,UAAUQ,OAAO;QACpC;IACJ;IACA,OAAO;QACHW,UAAU;QACV,GAAGC,IAAAA,wBAAW,EAAC;YACX,GAAG9B,KAAK;YACR0B,cAAcL;QAClB,GAAGU,IAAAA,6BAAa,EAAC9B,KAAKc,kBAAkB;IAC5C;AACJ;AACA,SAASV,eAAeL,KAAK,EAAEC,GAAG;IAC9B,IAAI+B,QAAQC,GAAG,CAACC,QAAQ,KAAK,eAAe;QACxC,sCAAsC;QACtCC,QAAQC,KAAK,CAAC,CAAC;;6EAEsD,CAAC;IAC1E;IACA,OAAO;QACH,GAAGC,IAAAA,sBAAU,EAACrC,OAAOC,IAAI;QACzBqC,MAAM;QACNT,UAAU;QACVU,YAAY;YACRtB,MAAMN,OAAM6B,QAAQ;QACxB;QACAvB,MAAMwB,oBAAI,CAACC,MAAM,CAACC,WAAW;YACzBC,aAAajC,OAAM6B,QAAQ;QAC/B;IACJ;AACJ"}
+{"version":3,"sources":["useFlatTree.js"],"sourcesContent":["import * as React from 'react';\nimport { useRootTree } from '../../hooks/useRootTree';\nimport { useFlatTreeNavigation } from './useFlatTreeNavigation';\nimport { createHTMLElementWalker } from '../../utils/createHTMLElementWalker';\nimport { useFluent_unstable } from '@fluentui/react-shared-contexts';\nimport { treeItemFilter } from '../../utils/treeItemFilter';\nimport { slot, useEventCallback, useMergedRefs } from '@fluentui/react-utilities';\nimport { useTreeContext_unstable } from '../../contexts/treeContext';\nimport { useSubtree } from '../../hooks/useSubtree';\nimport { ImmutableSet } from '../../utils/ImmutableSet';\nimport { ImmutableMap } from '../../utils/ImmutableMap';\nexport const useFlatTree_unstable = (props, ref)=>{\n    const level = useTreeContext_unstable((ctx)=>ctx.level);\n    // as level is static, this doesn't break rule of hooks\n    // and if this becomes an issue later on, this can be easily converted\n    // eslint-disable-next-line react-hooks/rules-of-hooks\n    return level > 1 ? useSubFlatTree(props, ref) : useRootFlatTree(props, ref);\n};\nfunction useRootFlatTree(props, ref) {\n    const { navigate, initialize } = useFlatTreeNavigation();\n    const walkerRef = React.useRef();\n    const { targetDocument } = useFluent_unstable();\n    const initializeWalker = React.useCallback((root)=>{\n        if (root && targetDocument) {\n            walkerRef.current = createHTMLElementWalker(root, targetDocument, treeItemFilter);\n            initialize(walkerRef.current);\n        }\n    }, [\n        initialize,\n        targetDocument\n    ]);\n    const handleNavigation = useEventCallback((event, data)=>{\n        var _props_onNavigation;\n        (_props_onNavigation = props.onNavigation) === null || _props_onNavigation === void 0 ? void 0 : _props_onNavigation.call(props, event, data);\n        if (walkerRef.current && !event.isDefaultPrevented()) {\n            navigate(data, walkerRef.current);\n        }\n    });\n    return {\n        treeType: 'flat',\n        ...useRootTree({\n            ...props,\n            onNavigation: handleNavigation\n        }, useMergedRefs(ref, initializeWalker))\n    };\n}\nfunction useSubFlatTree(props, ref) {\n    if (process.env.NODE_ENV === 'development') {\n        // eslint-disable-next-line no-console\n        console.error(`@fluentui/react-tree [useFlatTree]:\nSubtrees are not allowed in a FlatTree!\nYou cannot use a <FlatTree> component inside of another <FlatTree> component.`);\n    }\n    return {\n        ...useSubtree(props, ref),\n        // ------ defaultTreeContextValue\n        level: 0,\n        contextType: 'root',\n        treeType: 'nested',\n        selectionMode: 'none',\n        openItems: ImmutableSet.empty,\n        checkedItems: ImmutableMap.empty,\n        requestTreeResponse: noop,\n        appearance: 'subtle',\n        size: 'medium',\n        // ------ defaultTreeContextValue\n        open: false,\n        components: {\n            root: React.Fragment\n        },\n        root: slot.always(props, {\n            elementType: React.Fragment\n        })\n    };\n}\nfunction noop() {\n/* do nothing */ }\n"],"names":["useFlatTree_unstable","props","ref","level","useTreeContext_unstable","ctx","useSubFlatTree","useRootFlatTree","navigate","initialize","useFlatTreeNavigation","walkerRef","React","useRef","targetDocument","useFluent_unstable","initializeWalker","useCallback","root","current","createHTMLElementWalker","treeItemFilter","handleNavigation","useEventCallback","event","data","_props_onNavigation","onNavigation","call","isDefaultPrevented","treeType","useRootTree","useMergedRefs","process","env","NODE_ENV","console","error","useSubtree","contextType","selectionMode","openItems","ImmutableSet","empty","checkedItems","ImmutableMap","requestTreeResponse","noop","appearance","size","open","components","Fragment","slot","always","elementType"],"mappings":";;;;+BAWaA;;;eAAAA;;;;iEAXU;6BACK;uCACU;yCACE;qCACL;gCACJ;gCACuB;6BACd;4BACb;8BACE;8BACA;AACtB,MAAMA,uBAAuB,CAACC,OAAOC;IACxC,MAAMC,QAAQC,IAAAA,oCAAuB,EAAC,CAACC,MAAMA,IAAIF,KAAK;IACtD,uDAAuD;IACvD,sEAAsE;IACtE,sDAAsD;IACtD,OAAOA,QAAQ,IAAIG,eAAeL,OAAOC,OAAOK,gBAAgBN,OAAOC;AAC3E;AACA,SAASK,gBAAgBN,KAAK,EAAEC,GAAG;IAC/B,MAAM,EAAEM,QAAQ,EAAEC,UAAU,EAAE,GAAGC,IAAAA,4CAAqB;IACtD,MAAMC,YAAYC,OAAMC,MAAM;IAC9B,MAAM,EAAEC,cAAc,EAAE,GAAGC,IAAAA,uCAAkB;IAC7C,MAAMC,mBAAmBJ,OAAMK,WAAW,CAAC,CAACC;QACxC,IAAIA,QAAQJ,gBAAgB;YACxBH,UAAUQ,OAAO,GAAGC,IAAAA,gDAAuB,EAACF,MAAMJ,gBAAgBO,8BAAc;YAChFZ,WAAWE,UAAUQ,OAAO;QAChC;IACJ,GAAG;QACCV;QACAK;KACH;IACD,MAAMQ,mBAAmBC,IAAAA,gCAAgB,EAAC,CAACC,OAAOC;QAC9C,IAAIC;QACHA,CAAAA,sBAAsBzB,MAAM0B,YAAY,AAAD,MAAO,QAAQD,wBAAwB,KAAK,IAAI,KAAK,IAAIA,oBAAoBE,IAAI,CAAC3B,OAAOuB,OAAOC;QACxI,IAAId,UAAUQ,OAAO,IAAI,CAACK,MAAMK,kBAAkB,IAAI;YAClDrB,SAASiB,MAAMd,UAAUQ,OAAO;QACpC;IACJ;IACA,OAAO;QACHW,UAAU;QACV,GAAGC,IAAAA,wBAAW,EAAC;YACX,GAAG9B,KAAK;YACR0B,cAAcL;QAClB,GAAGU,IAAAA,6BAAa,EAAC9B,KAAKc,kBAAkB;IAC5C;AACJ;AACA,SAASV,eAAeL,KAAK,EAAEC,GAAG;IAC9B,IAAI+B,QAAQC,GAAG,CAACC,QAAQ,KAAK,eAAe;QACxC,sCAAsC;QACtCC,QAAQC,KAAK,CAAC,CAAC;;6EAEsD,CAAC;IAC1E;IACA,OAAO;QACH,GAAGC,IAAAA,sBAAU,EAACrC,OAAOC,IAAI;QACzB,iCAAiC;QACjCC,OAAO;QACPoC,aAAa;QACbT,UAAU;QACVU,eAAe;QACfC,WAAWC,0BAAY,CAACC,KAAK;QAC7BC,cAAcC,0BAAY,CAACF,KAAK;QAChCG,qBAAqBC;QACrBC,YAAY;QACZC,MAAM;QACN,iCAAiC;QACjCC,MAAM;QACNC,YAAY;YACRjC,MAAMN,OAAMwC,QAAQ;QACxB;QACAlC,MAAMmC,oBAAI,CAACC,MAAM,CAACrD,OAAO;YACrBsD,aAAa3C,OAAMwC,QAAQ;QAC/B;IACJ;AACJ;AACA,SAASL;AACT,cAAc,GAAG"}