@fluentui/react-tree 9.0.0-beta.3 → 9.0.0-beta.30

package/lib/components/TreeItemLayout/useTreeItemLayoutStyles.js

@@ -1,98 +0,0 @@
-import { __styles, mergeClasses, shorthands } from '@griffel/react';
-import { tokens, typographyStyles } from '@fluentui/react-theme';
-import { useTreeContext_unstable } from '../../contexts/treeContext';
-export const treeItemLayoutClassNames = {
-  root: 'fui-TreeItemLayout',
-  aside: 'fui-TreeItemLayout__aside',
-  iconAfter: 'fui-TreeItemLayout__iconAfter',
-  iconBefore: 'fui-TreeItemLayout__iconBefore'
-};
-/**
- * Styles for the root slot
- */
-const useRootStyles = /*#__PURE__*/__styles({
-  base: {
-    mc9l5x: "f22iagw",
-    Bt984gj: "f122n59",
-    sshi5w: "f1nxs5xn",
-    Bh6795r: "fqerorx",
-    Bnnss6s: "f1neuvcm",
-    xawz: "f1pztt34"
-  },
-  medium: {
-    i8kkvl: "f1rjii52",
-    Bahqtrf: "fk6fouc",
-    Be2twd7: "fkhj508",
-    Bhrd7zp: "figsok6",
-    Bg96gwp: "f1i3iumi"
-  },
-  small: {
-    i8kkvl: "f1ufnopg",
-    sshi5w: "f1pha7fy",
-    Bahqtrf: "fk6fouc",
-    Be2twd7: "fy9rknc",
-    Bhrd7zp: "figsok6",
-    Bg96gwp: "fwrc4pm"
-  }
-}, {
-  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;}", ".fqerorx{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}", ".f1neuvcm{-webkit-flex-shrink:1;-ms-flex-negative:1;flex-shrink:1;}", ".f1pztt34{-webkit-flex-basis:0;-ms-flex-preferred-size:0;flex-basis:0;}", ".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);}"]
-});
-/**
- * Styles for the before/after icon slot
- */
-const useIconStyles = /*#__PURE__*/__styles({
-  base: {
-    mc9l5x: "f22iagw",
-    Bt984gj: "f122n59",
-    sj55zd: "fkfq4zb",
-    Bg96gwp: "f106mvju",
-    Be2twd7: "f1pp30po"
-  }
-}, {
-  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);}"]
-});
-/**
- * Styles for the action icon slot
- */
-const useAsideStyles = /*#__PURE__*/__styles({
-  base: {
-    mc9l5x: "f22iagw",
-    Bt984gj: "f122n59",
-    Frg6f3: ["fcgxt0o", "f1ujusj6"],
-    z8tnut: "f1g0x7ka",
-    z189sj: ["fw5db7e", "f1uw59to"],
-    Byoj8tv: "f1qch9an",
-    uwmqm3: ["f1uw59to", "fw5db7e"],
-    i8kkvl: "f1ufnopg",
-    Belr9w4: "f14sijuj"
-  }
-}, {
-  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;}", ".fcgxt0o{margin-left:auto;}", ".f1ujusj6{margin-right:auto;}", ".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);}"]
-});
-/**
- * Apply styling to the TreeItemLayout slots based on the state
- */
-export const useTreeItemLayoutStyles_unstable = state => {
-  const {
-    iconAfter,
-    iconBefore,
-    aside,
-    root
-  } = state;
-  const rootStyles = useRootStyles();
-  const iconStyles = useIconStyles();
-  const asideStyles = useAsideStyles();
-  const size = useTreeContext_unstable(ctx => ctx.size);
-  root.className = mergeClasses(treeItemLayoutClassNames.root, rootStyles.base, rootStyles[size], root.className);
-  if (iconBefore) {
-    iconBefore.className = mergeClasses(treeItemLayoutClassNames.iconBefore, iconStyles.base, iconBefore.className);
-  }
-  if (iconAfter) {
-    iconAfter.className = mergeClasses(treeItemLayoutClassNames.iconAfter, iconStyles.base, iconAfter.className);
-  }
-  if (aside) {
-    aside.className = mergeClasses(treeItemLayoutClassNames.aside, asideStyles.base, aside.className);
-  }
-  return state;
-};
-//# sourceMappingURL=useTreeItemLayoutStyles.js.map

package/lib/components/TreeItemLayout/useTreeItemLayoutStyles.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["__styles","mergeClasses","shorthands","tokens","typographyStyles","useTreeContext_unstable","treeItemLayoutClassNames","root","aside","iconAfter","iconBefore","useRootStyles","base","mc9l5x","Bt984gj","sshi5w","Bh6795r","Bnnss6s","xawz","medium","i8kkvl","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","small","d","useIconStyles","sj55zd","useAsideStyles","Frg6f3","z8tnut","z189sj","Byoj8tv","uwmqm3","Belr9w4","useTreeItemLayoutStyles_unstable","state","rootStyles","iconStyles","asideStyles","size","ctx","className"],"sources":["../src/packages/react-components/react-tree/src/components/TreeItemLayout/useTreeItemLayoutStyles.ts"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport type { TreeItemLayoutSlots, TreeItemLayoutState } from './TreeItemLayout.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport { useTreeContext_unstable } from '../../contexts/treeContext';\n\nexport const treeItemLayoutClassNames: SlotClassNames<TreeItemLayoutSlots> = {\n  root: 'fui-TreeItemLayout',\n  aside: 'fui-TreeItemLayout__aside',\n  iconAfter: 'fui-TreeItemLayout__iconAfter',\n  iconBefore: 'fui-TreeItemLayout__iconBefore',\n};\n\n/**\n * Styles for the root slot\n */\nconst useRootStyles = makeStyles({\n  base: {\n    display: 'flex',\n    alignItems: 'center',\n    minHeight: '32px',\n    ...shorthands.flex(1),\n  },\n  medium: {\n    columnGap: tokens.spacingHorizontalSNudge,\n    ...typographyStyles.body1,\n  },\n  small: {\n    columnGap: tokens.spacingHorizontalXS,\n    minHeight: '24px',\n    ...typographyStyles.caption1,\n  },\n});\n\n/**\n * Styles for the before/after icon slot\n */\nconst useIconStyles = makeStyles({\n  base: {\n    display: 'flex',\n    alignItems: 'center',\n    color: tokens.colorNeutralForeground2,\n    lineHeight: tokens.lineHeightBase500,\n    fontSize: tokens.fontSizeBase500,\n  },\n});\n\n/**\n * Styles for the action icon slot\n */\nconst useAsideStyles = makeStyles({\n  base: {\n    display: 'flex',\n    alignItems: 'center',\n    marginLeft: 'auto',\n    ...shorthands.padding(0, tokens.spacingHorizontalM),\n    ...shorthands.gap(tokens.spacingHorizontalXS),\n  },\n});\n\n/**\n * Apply styling to the TreeItemLayout slots based on the state\n */\nexport const useTreeItemLayoutStyles_unstable = (state: TreeItemLayoutState): TreeItemLayoutState => {\n  const { iconAfter, iconBefore, aside, root } = state;\n  const rootStyles = useRootStyles();\n  const iconStyles = useIconStyles();\n  const asideStyles = useAsideStyles();\n\n  const size = useTreeContext_unstable(ctx => ctx.size);\n\n  root.className = mergeClasses(treeItemLayoutClassNames.root, rootStyles.base, rootStyles[size], root.className);\n\n  if (iconBefore) {\n    iconBefore.className = mergeClasses(treeItemLayoutClassNames.iconBefore, iconStyles.base, iconBefore.className);\n  }\n\n  if (iconAfter) {\n    iconAfter.className = mergeClasses(treeItemLayoutClassNames.iconAfter, iconStyles.base, iconAfter.className);\n  }\n\n  if (aside) {\n    aside.className = mergeClasses(treeItemLayoutClassNames.aside, asideStyles.base, aside.className);\n  }\n\n  return state;\n};\n"],"mappings":"AAAA,SAAAA,QAAA,EAAqBC,YAAY,EAAEC,UAAU,QAAQ,gBAAgB;AAGrE,SAASC,MAAM,EAAEC,gBAAgB,QAAQ,uBAAuB;AAChE,SAASC,uBAAuB,QAAQ,4BAA4B;AAEpE,OAAO,MAAMC,wBAAwB,GAAwC;EAC3EC,IAAI,EAAE,oBAAoB;EAC1BC,KAAK,EAAE,2BAA2B;EAClCC,SAAS,EAAE,+BAA+B;EAC1CC,UAAU,EAAE;CACb;AAED;;;AAGA,MAAMC,aAAa,gBAAGX,QAAA;EAAAY,IAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,IAAA;EAAA;EAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;EAAA;EAAAC,KAAA;IAAAL,MAAA;IAAAL,MAAA;IAAAM,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;EAAA;AAAA;EAAAE,CAAA;AAAA,EAgBpB;AAEF;;;AAGA,MAAMC,aAAa,gBAAG3B,QAAA;EAAAY,IAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAc,MAAA;IAAAJ,OAAA;IAAAF,OAAA;EAAA;AAAA;EAAAI,CAAA;AAAA,EAQpB;AAEF;;;AAGA,MAAMG,cAAc,gBAAG7B,QAAA;EAAAY,IAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAgB,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAd,MAAA;IAAAe,OAAA;EAAA;AAAA;EAAAT,CAAA;AAAA,EAQrB;AAEF;;;AAGA,OAAO,MAAMU,gCAAgC,GAAIC,KAA0B,IAAyB;EAClG,MAAM;IAAE5B,SAAS;IAAEC,UAAU;IAAEF,KAAK;IAAED;EAAI,CAAE,GAAG8B,KAAK;EACpD,MAAMC,UAAU,GAAG3B,aAAa,EAAE;EAClC,MAAM4B,UAAU,GAAGZ,aAAa,EAAE;EAClC,MAAMa,WAAW,GAAGX,cAAc,EAAE;EAEpC,MAAMY,IAAI,GAAGpC,uBAAuB,CAACqC,GAAG,IAAIA,GAAG,CAACD,IAAI,CAAC;EAErDlC,IAAI,CAACoC,SAAS,GAAG1C,YAAY,CAACK,wBAAwB,CAACC,IAAI,EAAE+B,UAAU,CAAC1B,IAAI,EAAE0B,UAAU,CAACG,IAAI,CAAC,EAAElC,IAAI,CAACoC,SAAS,CAAC;EAE/G,IAAIjC,UAAU,EAAE;IACdA,UAAU,CAACiC,SAAS,GAAG1C,YAAY,CAACK,wBAAwB,CAACI,UAAU,EAAE6B,UAAU,CAAC3B,IAAI,EAAEF,UAAU,CAACiC,SAAS,CAAC;;EAGjH,IAAIlC,SAAS,EAAE;IACbA,SAAS,CAACkC,SAAS,GAAG1C,YAAY,CAACK,wBAAwB,CAACG,SAAS,EAAE8B,UAAU,CAAC3B,IAAI,EAAEH,SAAS,CAACkC,SAAS,CAAC;;EAG9G,IAAInC,KAAK,EAAE;IACTA,KAAK,CAACmC,SAAS,GAAG1C,YAAY,CAACK,wBAAwB,CAACE,KAAK,EAAEgC,WAAW,CAAC5B,IAAI,EAAEJ,KAAK,CAACmC,SAAS,CAAC;;EAGnG,OAAON,KAAK;AACd,CAAC"}

package/lib/components/TreeItemPersonaLayout/useTreeItemPersonaLayoutStyles.js

@@ -1,115 +0,0 @@
-import { __styles, mergeClasses, shorthands } from '@griffel/react';
-import { tokens, typographyStyles } from '@fluentui/react-theme';
-export const treeItemPersonaLayoutClassNames = {
-  root: 'fui-TreeItemPersonaLayout',
-  media: 'fui-TreeItemPersonaLayout__media',
-  content: 'fui-TreeItemPersonaLayout__content',
-  description: 'fui-TreeItemPersonaLayout__description',
-  aside: 'fui-TreeItemPersonaLayout__aside',
-  main: 'fui-TreeItemPersonaLayout__main'
-};
-/**
- * Styles for the root slot
- */
-const useRootStyles = /*#__PURE__*/__styles({
-  base: {
-    a9b677: "fly5x3f",
-    mc9l5x: "f22iagw",
-    Bt984gj: "f122n59"
-  }
-}, {
-  d: [".fly5x3f{width:100%;}", ".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;}"]
-});
-/**
- * Styles for the expand icon slot
- */
-const useMediaStyles = /*#__PURE__*/__styles({
-  base: {
-    mc9l5x: "f22iagw",
-    Bt984gj: "f122n59",
-    a9b677: "f1szoe96",
-    Bqenvij: "f1d2rq10",
-    z8tnut: "f1g0x7ka",
-    z189sj: ["f7x41pl", "fruq291"],
-    Byoj8tv: "f1qch9an",
-    uwmqm3: ["fgiv446", "ffczdla"]
-  }
-}, {
-  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;}", ".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 useContentStyles = /*#__PURE__*/__styles({
-  base: {
-    a9b677: "fly5x3f",
-    mc9l5x: "f22iagw",
-    Beiy3e4: "f1vx9l62",
-    z8tnut: "f1ngh7ph",
-    z189sj: ["f7x41pl", "fruq291"],
-    Byoj8tv: "f5o476b",
-    uwmqm3: ["f1f5gg8d", "f1vdfbxk"],
-    i8kkvl: "f1fps8zv",
-    Belr9w4: "fws515f"
-  }
-}, {
-  d: [".fly5x3f{width:100%;}", ".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}", ".f1vx9l62{-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}", ".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);}", ".f1fps8zv{-webkit-column-gap:var(--spacingVerticalNone);column-gap:var(--spacingVerticalNone);}", ".fws515f{row-gap:var(--spacingHorizontalNone);}"]
-});
-const useMainStyles = /*#__PURE__*/__styles({
-  base: {
-    Bahqtrf: "fk6fouc",
-    Be2twd7: "fkhj508",
-    Bhrd7zp: "figsok6",
-    Bg96gwp: "f1i3iumi"
-  }
-}, {
-  d: [".fk6fouc{font-family:var(--fontFamilyBase);}", ".fkhj508{font-size:var(--fontSizeBase300);}", ".figsok6{font-weight:var(--fontWeightRegular);}", ".f1i3iumi{line-height:var(--lineHeightBase300);}"]
-});
-const useDescriptionStyles = /*#__PURE__*/__styles({
-  base: {
-    Bahqtrf: "fk6fouc",
-    Be2twd7: "fy9rknc",
-    Bhrd7zp: "figsok6",
-    Bg96gwp: "fwrc4pm"
-  }
-}, {
-  d: [".fk6fouc{font-family:var(--fontFamilyBase);}", ".fy9rknc{font-size:var(--fontSizeBase200);}", ".figsok6{font-weight:var(--fontWeightRegular);}", ".fwrc4pm{line-height:var(--lineHeightBase200);}"]
-});
-const useAsideStyles = /*#__PURE__*/__styles({
-  base: {
-    mc9l5x: "f22iagw",
-    Beiy3e4: "f1vx9l62",
-    Huce71: "fz5stix",
-    z189sj: ["fw5db7e", "f1uw59to"],
-    Bahqtrf: "fk6fouc",
-    Be2twd7: "fy9rknc",
-    Bhrd7zp: "figsok6",
-    Bg96gwp: "fwrc4pm"
-  }
-}, {
-  d: [".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}", ".f1vx9l62{-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}", ".fz5stix{white-space:nowrap;}", ".fw5db7e{padding-right:var(--spacingHorizontalM);}", ".f1uw59to{padding-left:var(--spacingHorizontalM);}", ".fk6fouc{font-family:var(--fontFamilyBase);}", ".fy9rknc{font-size:var(--fontSizeBase200);}", ".figsok6{font-weight:var(--fontWeightRegular);}", ".fwrc4pm{line-height:var(--lineHeightBase200);}"]
-});
-/**
- * Apply styling to the TreeItemPersonaLayout slots based on the state
- */
-export const useTreeItemPersonaLayoutStyles_unstable = state => {
-  const rootStyles = useRootStyles();
-  const mediaStyles = useMediaStyles();
-  const contentStyles = useContentStyles();
-  const mainStyles = useMainStyles();
-  const descriptionStyles = useDescriptionStyles();
-  const asideStyles = useAsideStyles();
-  state.root.className = mergeClasses(treeItemPersonaLayoutClassNames.root, rootStyles.base, state.root.className);
-  state.media.className = mergeClasses(treeItemPersonaLayoutClassNames.media, mediaStyles.base, state.media.className);
-  if (state.content) {
-    state.content.className = mergeClasses(treeItemPersonaLayoutClassNames.content, contentStyles.base, state.content.className);
-  }
-  if (state.main) {
-    state.main.className = mergeClasses(treeItemPersonaLayoutClassNames.main, mainStyles.base, state.main.className);
-  }
-  if (state.description) {
-    state.description.className = mergeClasses(treeItemPersonaLayoutClassNames.description, descriptionStyles.base, state.description.className);
-  }
-  if (state.aside) {
-    state.aside.className = mergeClasses(treeItemPersonaLayoutClassNames.aside, asideStyles.base, state.aside.className);
-  }
-  return state;
-};
-//# sourceMappingURL=useTreeItemPersonaLayoutStyles.js.map

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

@@ -1 +0,0 @@
-{"version":3,"names":["__styles","mergeClasses","shorthands","tokens","typographyStyles","treeItemPersonaLayoutClassNames","root","media","content","description","aside","main","useRootStyles","base","a9b677","mc9l5x","Bt984gj","d","useMediaStyles","Bqenvij","z8tnut","z189sj","Byoj8tv","uwmqm3","useContentStyles","Beiy3e4","i8kkvl","Belr9w4","useMainStyles","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","useDescriptionStyles","useAsideStyles","Huce71","useTreeItemPersonaLayoutStyles_unstable","state","rootStyles","mediaStyles","contentStyles","mainStyles","descriptionStyles","asideStyles","className"],"sources":["../src/packages/react-components/react-tree/src/components/TreeItemPersonaLayout/useTreeItemPersonaLayoutStyles.ts"],"sourcesContent":["import type { TreeItemPersonaLayoutSlots, TreeItemPersonaLayoutState } from './TreeItemPersonaLayout.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\n\nexport const treeItemPersonaLayoutClassNames: SlotClassNames<TreeItemPersonaLayoutSlots> = {\n  root: 'fui-TreeItemPersonaLayout',\n  media: 'fui-TreeItemPersonaLayout__media',\n  content: 'fui-TreeItemPersonaLayout__content',\n  description: 'fui-TreeItemPersonaLayout__description',\n  aside: 'fui-TreeItemPersonaLayout__aside',\n  main: 'fui-TreeItemPersonaLayout__main',\n};\n\n/**\n * Styles for the root slot\n */\nconst useRootStyles = makeStyles({\n  base: {\n    width: '100%',\n    display: 'flex',\n    alignItems: 'center',\n  },\n});\n\n/**\n * Styles for the expand icon slot\n */\nconst useMediaStyles = makeStyles({\n  base: {\n    display: 'flex',\n    alignItems: 'center',\n    width: '32px',\n    height: '32px',\n    ...shorthands.padding(0, tokens.spacingHorizontalXS, 0, tokens.spacingHorizontalXXS),\n  },\n});\n\nconst useContentStyles = makeStyles({\n  base: {\n    width: '100%',\n    display: 'flex',\n    flexDirection: 'column',\n    ...shorthands.padding(\n      tokens.spacingVerticalMNudge,\n      tokens.spacingHorizontalXS,\n      tokens.spacingVerticalMNudge,\n      tokens.spacingHorizontalS,\n    ),\n    ...shorthands.gap(tokens.spacingVerticalNone, tokens.spacingHorizontalNone),\n  },\n});\nconst useMainStyles = makeStyles({\n  base: {\n    ...typographyStyles.body1,\n  },\n});\nconst useDescriptionStyles = makeStyles({\n  base: {\n    ...typographyStyles.caption1,\n  },\n});\nconst useAsideStyles = makeStyles({\n  base: {\n    display: 'flex',\n    flexDirection: 'column',\n    whiteSpace: 'nowrap',\n    paddingRight: tokens.spacingHorizontalM,\n    ...typographyStyles.caption1,\n  },\n});\n\n/**\n * Apply styling to the TreeItemPersonaLayout slots based on the state\n */\nexport const useTreeItemPersonaLayoutStyles_unstable = (\n  state: TreeItemPersonaLayoutState,\n): TreeItemPersonaLayoutState => {\n  const rootStyles = useRootStyles();\n  const mediaStyles = useMediaStyles();\n  const contentStyles = useContentStyles();\n  const mainStyles = useMainStyles();\n  const descriptionStyles = useDescriptionStyles();\n  const asideStyles = useAsideStyles();\n\n  state.root.className = mergeClasses(treeItemPersonaLayoutClassNames.root, rootStyles.base, state.root.className);\n\n  state.media.className = mergeClasses(treeItemPersonaLayoutClassNames.media, mediaStyles.base, state.media.className);\n\n  if (state.content) {\n    state.content.className = mergeClasses(\n      treeItemPersonaLayoutClassNames.content,\n      contentStyles.base,\n      state.content.className,\n    );\n  }\n  if (state.main) {\n    state.main.className = mergeClasses(treeItemPersonaLayoutClassNames.main, mainStyles.base, state.main.className);\n  }\n  if (state.description) {\n    state.description.className = mergeClasses(\n      treeItemPersonaLayoutClassNames.description,\n      descriptionStyles.base,\n      state.description.className,\n    );\n  }\n  if (state.aside) {\n    state.aside.className = mergeClasses(\n      treeItemPersonaLayoutClassNames.aside,\n      asideStyles.base,\n      state.aside.className,\n    );\n  }\n\n  return state;\n};\n"],"mappings":"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"}

package/lib/hooks/index.js

@@ -1,4 +0,0 @@
-export * from './useFlatTree';
-export * from './useNestedTreeNavigation';
-export * from './useOpenItemsState';
-//# sourceMappingURL=index.js.map

package/lib/hooks/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sourceRoot":"../src/","sources":["packages/react-components/react-tree/src/hooks/index.ts"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAC;AAC9B,cAAc,2BAA2B,CAAC;AAC1C,cAAc,qBAAqB,CAAC","sourcesContent":["export * from './useFlatTree';\nexport * from './useNestedTreeNavigation';\nexport * from './useOpenItemsState';\n"]}

package/lib/hooks/useFlatTree.js

@@ -1,49 +0,0 @@
-import { useEventCallback } from '@fluentui/react-utilities';
-import * as React from 'react';
-import { createUnfilteredFlatTree } from '../utils/createUnfilteredFlatTree';
-import { createVisibleFlatTree } from '../utils/createVisibleFlatTree';
-import { useFlatTreeNavigation } from './useFlatTreeNavigation';
-import { useOpenItemsState } from './useOpenItemsState';
-/**
- * this hook provides FlatTree API to manage all required mechanisms to convert a list of items into renderable TreeItems
- * in multiple scenarios including virtualization.
- *
- * !!A flat tree is an unofficial spec for tree!!
- *
- * It should be used on cases where more complex interactions with a Tree is required.
- * On simple scenarios it is advised to simply use a nested structure instead.
- *
- * @param items - a list of tree items
- * @param options - in case control over the internal openItems is required
- */
-export function useFlatTree_unstable(items, options = {}) {
-  const [openItems, updateOpenItems] = useOpenItemsState(options);
-  const unfilteredFlatTree = React.useMemo(() => createUnfilteredFlatTree(items), [items]);
-  const [navigate, navigationRef] = useFlatTreeNavigation(unfilteredFlatTree);
-  const visibleFlatTree = React.useMemo(() => createVisibleFlatTree(unfilteredFlatTree, openItems), [unfilteredFlatTree, openItems]);
-  const handleOpenChange = useEventCallback((event, data) => {
-    event.preventDefault();
-    updateOpenItems(data);
-  });
-  const handleNavigation = useEventCallback((event, data) => {
-    event.preventDefault();
-    navigate(data);
-  });
-  const flatTree = {
-    ...visibleFlatTree,
-    getTreeProps: () => ({
-      ref: navigationRef,
-      openItems,
-      onOpenChange: handleOpenChange,
-      // eslint-disable-next-line @typescript-eslint/naming-convention
-      onNavigation_unstable: handleNavigation
-    }),
-    navigate,
-    getItem: id => {
-      var _a;
-      return (_a = unfilteredFlatTree.itemsPerId.get(id)) !== null && _a !== void 0 ? _a : null;
-    }
-  };
-  return flatTree;
-}
-//# sourceMappingURL=useFlatTree.js.map

package/lib/hooks/useFlatTree.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["useEventCallback","React","createUnfilteredFlatTree","createVisibleFlatTree","useFlatTreeNavigation","useOpenItemsState","useFlatTree_unstable","items","options","openItems","updateOpenItems","unfilteredFlatTree","useMemo","navigate","navigationRef","visibleFlatTree","handleOpenChange","event","data","preventDefault","handleNavigation","flatTree","getTreeProps","ref","onOpenChange","onNavigation_unstable","getItem","id","_a","itemsPerId","get"],"sources":["../src/packages/react-components/react-tree/src/hooks/useFlatTree.ts"],"sourcesContent":["import { useEventCallback } from '@fluentui/react-utilities';\nimport * as React from 'react';\nimport {\n  TreeNavigationData_unstable,\n  TreeNavigationEvent_unstable,\n  TreeOpenChangeData,\n  TreeOpenChangeEvent,\n  TreeProps,\n} from '../Tree';\nimport { TreeItemProps } from '../TreeItem';\nimport { createUnfilteredFlatTree } from '../utils/createUnfilteredFlatTree';\nimport { createVisibleFlatTree } from '../utils/createVisibleFlatTree';\nimport { useFlatTreeNavigation } from './useFlatTreeNavigation';\nimport { useOpenItemsState } from './useOpenItemsState';\n\nexport type FlatTreeItemProps = Required<Pick<TreeItemProps, 'id'>> &\n  TreeItemProps & {\n    parentId?: string;\n  };\n\nexport type FlatTreeItem = {\n  getTreeItemProps(): Required<Pick<TreeItemProps, 'id' | 'aria-setsize' | 'aria-level' | 'aria-posinset' | 'leaf'>> &\n    TreeItemProps;\n  parentId?: string;\n  childrenSize: number;\n  index: number;\n  id: string;\n  level: number;\n};\n\nexport type FlatTreeProps = Required<\n  Pick<TreeProps, 'openItems' | 'onOpenChange' | 'onNavigation_unstable'> & { ref: React.Ref<HTMLDivElement> }\n>;\n\n/**\n * FlatTree API to manage all required mechanisms to convert a list of items into renderable TreeItems\n * in multiple scenarios including virtualization.\n *\n * !!A flat tree is an unofficial spec for tree!!\n *\n * It should be used on cases where more complex interactions with a Tree is required.\n *\n * On simple scenarios it is advised to simply use a nested structure instead.\n */\nexport type FlatTree = {\n  /**\n   * returns the properties required for the Tree component to work properly.\n   * That includes:\n   * `openItems`, `onOpenChange`, `onNavigation_unstable` and `ref`\n   */\n  getTreeProps(): FlatTreeProps;\n  /**\n   * internal method used to react to an `onNavigation` event.\n   * This method ensures proper navigation on keyboard and mouse interaction.\n   * In case of virtualization it might be required to cancel default provided `onNavigation`\n   * event and then call this method manually.\n   *\n   * @example\n   * ```ts\n   * // react-window\n   * const handleNavigation = (event, data) => {\n   *   event.preventDefault();\n   *   const nextItem = tree.getNextNavigableItem(data);\n   *   // scroll to item using virtualization scroll mechanism\n   *   if (nextItem && !targetDocument.getElementById(nextItem.id)) {\n   *     listRef.current.scrollToItem(nextItem.index);\n   *   }\n   *   // wait for scrolling to happen and then invoke navigate method\n   *   requestAnimationFrame(() => {\n   *     tree.navigate(data);\n   *   });\n   * };\n   *```\n   */\n  navigate(data: TreeNavigationData_unstable): void;\n  /**\n   * returns next item to be focused on a navigation.\n   * This method is provided to decouple the element that needs to be focused from\n   *  the action of focusing it itself.\n   */\n  getNextNavigableItem(data: TreeNavigationData_unstable): FlatTreeItem | null;\n  /**\n   * returns a single flat tree item by id without iterating over the whole collection\n   */\n  getItem(id: string): FlatTreeItem | null;\n  /**\n   * returns an iterable containing all visually available flat tree items\n   */\n  items(): Iterable<FlatTreeItem>;\n};\n\n/**\n * this hook provides FlatTree API to manage all required mechanisms to convert a list of items into renderable TreeItems\n * in multiple scenarios including virtualization.\n *\n * !!A flat tree is an unofficial spec for tree!!\n *\n * It should be used on cases where more complex interactions with a Tree is required.\n * On simple scenarios it is advised to simply use a nested structure instead.\n *\n * @param items - a list of tree items\n * @param options - in case control over the internal openItems is required\n */\nexport function useFlatTree_unstable(\n  items: FlatTreeItemProps[],\n  options: Pick<TreeProps, 'openItems' | 'defaultOpenItems'> = {},\n): FlatTree {\n  const [openItems, updateOpenItems] = useOpenItemsState(options);\n  const unfilteredFlatTree = React.useMemo(() => createUnfilteredFlatTree(items), [items]);\n  const [navigate, navigationRef] = useFlatTreeNavigation(unfilteredFlatTree);\n  const visibleFlatTree = React.useMemo(\n    () => createVisibleFlatTree(unfilteredFlatTree, openItems),\n    [unfilteredFlatTree, openItems],\n  );\n\n  const handleOpenChange = useEventCallback((event: TreeOpenChangeEvent, data: TreeOpenChangeData) => {\n    event.preventDefault();\n    updateOpenItems(data);\n  });\n\n  const handleNavigation = useEventCallback(\n    (event: TreeNavigationEvent_unstable, data: TreeNavigationData_unstable) => {\n      event.preventDefault();\n      navigate(data);\n    },\n  );\n\n  const flatTree: FlatTree = {\n    ...visibleFlatTree,\n    getTreeProps: () => ({\n      ref: navigationRef as React.Ref<HTMLDivElement>,\n      openItems,\n      onOpenChange: handleOpenChange,\n      // eslint-disable-next-line @typescript-eslint/naming-convention\n      onNavigation_unstable: handleNavigation,\n    }),\n    navigate,\n    getItem: id => unfilteredFlatTree.itemsPerId.get(id) ?? null,\n  };\n  return flatTree;\n}\n"],"mappings":"AAAA,SAASA,gBAAgB,QAAQ,2BAA2B;AAC5D,OAAO,KAAKC,KAAK,MAAM,OAAO;AAS9B,SAASC,wBAAwB,QAAQ,mCAAmC;AAC5E,SAASC,qBAAqB,QAAQ,gCAAgC;AACtE,SAASC,qBAAqB,QAAQ,yBAAyB;AAC/D,SAASC,iBAAiB,QAAQ,qBAAqB;AA8EvD;;;;;;;;;;;;AAYA,OAAM,SAAUC,oBAAoBA,CAClCC,KAA0B,EAC1BC,OAAA,GAA6D,EAAE;EAE/D,MAAM,CAACC,SAAS,EAAEC,eAAe,CAAC,GAAGL,iBAAiB,CAACG,OAAO,CAAC;EAC/D,MAAMG,kBAAkB,GAAGV,KAAK,CAACW,OAAO,CAAC,MAAMV,wBAAwB,CAACK,KAAK,CAAC,EAAE,CAACA,KAAK,CAAC,CAAC;EACxF,MAAM,CAACM,QAAQ,EAAEC,aAAa,CAAC,GAAGV,qBAAqB,CAACO,kBAAkB,CAAC;EAC3E,MAAMI,eAAe,GAAGd,KAAK,CAACW,OAAO,CACnC,MAAMT,qBAAqB,CAACQ,kBAAkB,EAAEF,SAAS,CAAC,EAC1D,CAACE,kBAAkB,EAAEF,SAAS,CAAC,CAChC;EAED,MAAMO,gBAAgB,GAAGhB,gBAAgB,CAAC,CAACiB,KAA0B,EAAEC,IAAwB,KAAI;IACjGD,KAAK,CAACE,cAAc,EAAE;IACtBT,eAAe,CAACQ,IAAI,CAAC;EACvB,CAAC,CAAC;EAEF,MAAME,gBAAgB,GAAGpB,gBAAgB,CACvC,CAACiB,KAAmC,EAAEC,IAAiC,KAAI;IACzED,KAAK,CAACE,cAAc,EAAE;IACtBN,QAAQ,CAACK,IAAI,CAAC;EAChB,CAAC,CACF;EAED,MAAMG,QAAQ,GAAa;IACzB,GAAGN,eAAe;IAClBO,YAAY,EAAEA,CAAA,MAAO;MACnBC,GAAG,EAAET,aAA0C;MAC/CL,SAAS;MACTe,YAAY,EAAER,gBAAgB;MAC9B;MACAS,qBAAqB,EAAEL;KACxB,CAAC;IACFP,QAAQ;IACRa,OAAO,EAAEC,EAAE,IAAG;MAAA,IAAAC,EAAA;MAAC,QAAAA,EAAA,GAAAjB,kBAAkB,CAACkB,UAAU,CAACC,GAAG,CAACH,EAAE,CAAC,cAAAC,EAAA,cAAAA,EAAA,GAAI,IAAI;IAAA;GAC7D;EACD,OAAOP,QAAQ;AACjB"}

package/lib/hooks/useFlatTreeNavigation.js

@@ -1,74 +0,0 @@
-import { useFluent_unstable } from '@fluentui/react-shared-contexts';
-import { useMergedRefs } from '@fluentui/react-utilities';
-import { nextTypeAheadElement } from '../utils/nextTypeAheadElement';
-import { treeDataTypes } from '../utils/tokens';
-import { treeItemFilter } from '../utils/treeItemFilter';
-import { useHTMLElementWalkerRef } from './useHTMLElementWalker';
-import { useRovingTabIndex } from './useRovingTabIndexes';
-export function useFlatTreeNavigation(flatTree) {
-  const {
-    targetDocument
-  } = useFluent_unstable();
-  const [treeItemWalkerRef, treeItemWalkerRootRef] = useHTMLElementWalkerRef(treeItemFilter);
-  const [{
-    rove
-  }, rovingRootRef] = useRovingTabIndex(treeItemFilter);
-  function getNextElement(data) {
-    if (!targetDocument || !treeItemWalkerRef.current) {
-      return null;
-    }
-    const treeItemWalker = treeItemWalkerRef.current;
-    switch (data.type) {
-      case treeDataTypes.click:
-        return data.target;
-      case treeDataTypes.typeAhead:
-        treeItemWalker.currentElement = data.target;
-        return nextTypeAheadElement(treeItemWalker, data.event.key);
-      case treeDataTypes.arrowLeft:
-        return parentElement(flatTree, data.target, targetDocument);
-      case treeDataTypes.arrowRight:
-        treeItemWalker.currentElement = data.target;
-        return firstChild(data.target, treeItemWalker);
-      case treeDataTypes.end:
-        treeItemWalker.currentElement = treeItemWalker.root;
-        return treeItemWalker.lastChild();
-      case treeDataTypes.home:
-        treeItemWalker.currentElement = treeItemWalker.root;
-        return treeItemWalker.firstChild();
-      case treeDataTypes.arrowDown:
-        treeItemWalker.currentElement = data.target;
-        return treeItemWalker.nextElement();
-      case treeDataTypes.arrowUp:
-        treeItemWalker.currentElement = data.target;
-        return treeItemWalker.previousElement();
-    }
-  }
-  function navigate(data) {
-    const nextElement = getNextElement(data);
-    if (nextElement) {
-      rove(nextElement);
-    }
-  }
-  return [navigate, useMergedRefs(treeItemWalkerRootRef, rovingRootRef)];
-}
-function firstChild(target, treeWalker) {
-  const nextElement = treeWalker.nextElement();
-  if (!nextElement) {
-    return null;
-  }
-  const nextElementAriaPosInSet = nextElement.getAttribute('aria-posinset');
-  const nextElementAriaLevel = nextElement.getAttribute('aria-level');
-  const targetAriaLevel = target.getAttribute('aria-level');
-  if (nextElementAriaPosInSet === '1' && Number(nextElementAriaLevel) === Number(targetAriaLevel) + 1) {
-    return nextElement;
-  }
-  return null;
-}
-function parentElement(flatTree, target, document) {
-  const flatTreeItem = flatTree.itemsPerId.get(target.id);
-  if (flatTreeItem && flatTreeItem.parentId) {
-    return document.getElementById(flatTreeItem.parentId);
-  }
-  return null;
-}
-//# sourceMappingURL=useFlatTreeNavigation.js.map

package/lib/hooks/useFlatTreeNavigation.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["useFluent_unstable","useMergedRefs","nextTypeAheadElement","treeDataTypes","treeItemFilter","useHTMLElementWalkerRef","useRovingTabIndex","useFlatTreeNavigation","flatTree","targetDocument","treeItemWalkerRef","treeItemWalkerRootRef","rove","rovingRootRef","getNextElement","data","current","treeItemWalker","type","click","target","typeAhead","currentElement","event","key","arrowLeft","parentElement","arrowRight","firstChild","end","root","lastChild","home","arrowDown","nextElement","arrowUp","previousElement","navigate","treeWalker","nextElementAriaPosInSet","getAttribute","nextElementAriaLevel","targetAriaLevel","Number","document","flatTreeItem","itemsPerId","get","id","parentId","getElementById"],"sources":["../src/packages/react-components/react-tree/src/hooks/useFlatTreeNavigation.ts"],"sourcesContent":["import { useFluent_unstable } from '@fluentui/react-shared-contexts';\nimport { useMergedRefs } from '@fluentui/react-utilities';\nimport { TreeNavigationData_unstable } from '../Tree';\nimport { UnfilteredFlatTree } from '../utils/createUnfilteredFlatTree';\nimport { nextTypeAheadElement } from '../utils/nextTypeAheadElement';\nimport { treeDataTypes } from '../utils/tokens';\nimport { treeItemFilter } from '../utils/treeItemFilter';\nimport { HTMLElementWalker, useHTMLElementWalkerRef } from './useHTMLElementWalker';\nimport { useRovingTabIndex } from './useRovingTabIndexes';\n\nexport function useFlatTreeNavigation(flatTree: UnfilteredFlatTree) {\n  const { targetDocument } = useFluent_unstable();\n  const [treeItemWalkerRef, treeItemWalkerRootRef] = useHTMLElementWalkerRef(treeItemFilter);\n  const [{ rove }, rovingRootRef] = useRovingTabIndex(treeItemFilter);\n\n  function getNextElement(data: TreeNavigationData_unstable) {\n    if (!targetDocument || !treeItemWalkerRef.current) {\n      return null;\n    }\n    const treeItemWalker = treeItemWalkerRef.current;\n    switch (data.type) {\n      case treeDataTypes.click:\n        return data.target;\n      case treeDataTypes.typeAhead:\n        treeItemWalker.currentElement = data.target;\n        return nextTypeAheadElement(treeItemWalker, data.event.key);\n      case treeDataTypes.arrowLeft:\n        return parentElement(flatTree, data.target, targetDocument);\n      case treeDataTypes.arrowRight:\n        treeItemWalker.currentElement = data.target;\n        return firstChild(data.target, treeItemWalker);\n      case treeDataTypes.end:\n        treeItemWalker.currentElement = treeItemWalker.root;\n        return treeItemWalker.lastChild();\n      case treeDataTypes.home:\n        treeItemWalker.currentElement = treeItemWalker.root;\n        return treeItemWalker.firstChild();\n      case treeDataTypes.arrowDown:\n        treeItemWalker.currentElement = data.target;\n        return treeItemWalker.nextElement();\n      case treeDataTypes.arrowUp:\n        treeItemWalker.currentElement = data.target;\n        return treeItemWalker.previousElement();\n    }\n  }\n  function navigate(data: TreeNavigationData_unstable) {\n    const nextElement = getNextElement(data);\n    if (nextElement) {\n      rove(nextElement);\n    }\n  }\n  return [navigate, useMergedRefs(treeItemWalkerRootRef, rovingRootRef)] as const;\n}\n\nfunction firstChild(target: HTMLElement, treeWalker: HTMLElementWalker): HTMLElement | null {\n  const nextElement = treeWalker.nextElement();\n  if (!nextElement) {\n    return null;\n  }\n  const nextElementAriaPosInSet = nextElement.getAttribute('aria-posinset');\n  const nextElementAriaLevel = nextElement.getAttribute('aria-level');\n  const targetAriaLevel = target.getAttribute('aria-level');\n  if (nextElementAriaPosInSet === '1' && Number(nextElementAriaLevel) === Number(targetAriaLevel) + 1) {\n    return nextElement;\n  }\n  return null;\n}\n\nfunction parentElement(flatTree: UnfilteredFlatTree, target: HTMLElement, document: Document) {\n  const flatTreeItem = flatTree.itemsPerId.get(target.id);\n  if (flatTreeItem && flatTreeItem.parentId) {\n    return document.getElementById(flatTreeItem.parentId);\n  }\n  return null;\n}\n"],"mappings":"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"}

package/lib/hooks/useHTMLElementWalker.js

@@ -1,80 +0,0 @@
-import { isHTMLElement } from '@fluentui/react-utilities';
-import * as React from 'react';
-export function createHTMLElementWalker(root, filter = () => NodeFilter.FILTER_ACCEPT) {
-  let temporaryFilter;
-  const treeWalker = document.createTreeWalker(root, NodeFilter.SHOW_ELEMENT, {
-    acceptNode(node) {
-      var _a;
-      if (!isHTMLElement(node)) {
-        return NodeFilter.FILTER_REJECT;
-      }
-      const filterResult = filter(node);
-      return filterResult === NodeFilter.FILTER_ACCEPT ? (_a = temporaryFilter === null || temporaryFilter === void 0 ? void 0 : temporaryFilter(node)) !== null && _a !== void 0 ? _a : filterResult : filterResult;
-    }
-  });
-  return {
-    get root() {
-      return treeWalker.root;
-    },
-    get currentElement() {
-      return treeWalker.currentNode;
-    },
-    set currentElement(element) {
-      treeWalker.currentNode = element;
-    },
-    firstChild: localFilter => {
-      temporaryFilter = localFilter;
-      const result = treeWalker.firstChild();
-      temporaryFilter = undefined;
-      return result;
-    },
-    lastChild: localFilter => {
-      temporaryFilter = localFilter;
-      const result = treeWalker.lastChild();
-      temporaryFilter = undefined;
-      return result;
-    },
-    nextElement: localFilter => {
-      temporaryFilter = localFilter;
-      const result = treeWalker.nextNode();
-      temporaryFilter = undefined;
-      return result;
-    },
-    nextSibling: localFilter => {
-      temporaryFilter = localFilter;
-      const result = treeWalker.nextSibling();
-      temporaryFilter = undefined;
-      return result;
-    },
-    parentElement: localFilter => {
-      temporaryFilter = localFilter;
-      const result = treeWalker.parentNode();
-      temporaryFilter = undefined;
-      return result;
-    },
-    previousElement: localFilter => {
-      temporaryFilter = localFilter;
-      const result = treeWalker.previousNode();
-      temporaryFilter = undefined;
-      return result;
-    },
-    previousSibling: localFilter => {
-      temporaryFilter = localFilter;
-      const result = treeWalker.previousSibling();
-      temporaryFilter = undefined;
-      return result;
-    }
-  };
-}
-export const useHTMLElementWalkerRef = filter => {
-  const walkerRef = React.useRef();
-  const rootRefCallback = element => {
-    if (!element) {
-      walkerRef.current = undefined;
-      return;
-    }
-    walkerRef.current = createHTMLElementWalker(element, filter);
-  };
-  return [walkerRef, rootRefCallback];
-};
-//# sourceMappingURL=useHTMLElementWalker.js.map

package/lib/hooks/useHTMLElementWalker.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["isHTMLElement","React","createHTMLElementWalker","root","filter","NodeFilter","FILTER_ACCEPT","temporaryFilter","treeWalker","document","createTreeWalker","SHOW_ELEMENT","acceptNode","node","FILTER_REJECT","filterResult","_a","currentElement","currentNode","element","firstChild","localFilter","result","undefined","lastChild","nextElement","nextNode","nextSibling","parentElement","parentNode","previousElement","previousNode","previousSibling","useHTMLElementWalkerRef","walkerRef","useRef","rootRefCallback","current"],"sources":["../src/packages/react-components/react-tree/src/hooks/useHTMLElementWalker.ts"],"sourcesContent":["import { isHTMLElement } from '@fluentui/react-utilities';\nimport * as React from 'react';\n\nexport interface HTMLElementWalker {\n  readonly root: HTMLElement;\n  currentElement: HTMLElement;\n  firstChild(filter?: HTMLElementFilter): HTMLElement | null;\n  lastChild(filter?: HTMLElementFilter): HTMLElement | null;\n  nextElement(filter?: HTMLElementFilter): HTMLElement | null;\n  nextSibling(filter?: HTMLElementFilter): HTMLElement | null;\n  parentElement(filter?: HTMLElementFilter): HTMLElement | null;\n  previousElement(filter?: HTMLElementFilter): HTMLElement | null;\n  previousSibling(filter?: HTMLElementFilter): HTMLElement | null;\n}\n\nexport type HTMLElementFilter = (element: HTMLElement) => number;\n\nexport function createHTMLElementWalker(\n  root: HTMLElement,\n  filter: HTMLElementFilter = () => NodeFilter.FILTER_ACCEPT,\n): HTMLElementWalker {\n  let temporaryFilter: HTMLElementFilter | undefined;\n  const treeWalker = document.createTreeWalker(root, NodeFilter.SHOW_ELEMENT, {\n    acceptNode(node: Node) {\n      if (!isHTMLElement(node)) {\n        return NodeFilter.FILTER_REJECT;\n      }\n      const filterResult = filter(node);\n      return filterResult === NodeFilter.FILTER_ACCEPT ? temporaryFilter?.(node) ?? filterResult : filterResult;\n    },\n  });\n  return {\n    get root() {\n      return treeWalker.root as HTMLElement;\n    },\n    get currentElement() {\n      return treeWalker.currentNode as HTMLElement;\n    },\n    set currentElement(element) {\n      treeWalker.currentNode = element;\n    },\n    firstChild: localFilter => {\n      temporaryFilter = localFilter;\n      const result = treeWalker.firstChild() as HTMLElement | null;\n      temporaryFilter = undefined;\n      return result;\n    },\n    lastChild: localFilter => {\n      temporaryFilter = localFilter;\n      const result = treeWalker.lastChild() as HTMLElement | null;\n      temporaryFilter = undefined;\n      return result;\n    },\n    nextElement: localFilter => {\n      temporaryFilter = localFilter;\n      const result = treeWalker.nextNode() as HTMLElement | null;\n      temporaryFilter = undefined;\n      return result;\n    },\n    nextSibling: localFilter => {\n      temporaryFilter = localFilter;\n      const result = treeWalker.nextSibling() as HTMLElement | null;\n      temporaryFilter = undefined;\n      return result;\n    },\n    parentElement: localFilter => {\n      temporaryFilter = localFilter;\n      const result = treeWalker.parentNode() as HTMLElement | null;\n      temporaryFilter = undefined;\n      return result;\n    },\n    previousElement: localFilter => {\n      temporaryFilter = localFilter;\n      const result = treeWalker.previousNode() as HTMLElement | null;\n      temporaryFilter = undefined;\n      return result;\n    },\n    previousSibling: localFilter => {\n      temporaryFilter = localFilter;\n      const result = treeWalker.previousSibling() as HTMLElement | null;\n      temporaryFilter = undefined;\n      return result;\n    },\n  };\n}\n\nexport const useHTMLElementWalkerRef = (filter?: HTMLElementFilter) => {\n  const walkerRef = React.useRef<HTMLElementWalker>();\n\n  const rootRefCallback = (element?: HTMLElement) => {\n    if (!element) {\n      walkerRef.current = undefined;\n      return;\n    }\n    walkerRef.current = createHTMLElementWalker(element, filter);\n  };\n  return [walkerRef as React.RefObject<HTMLElementWalker>, rootRefCallback as React.Ref<HTMLElement>] as const;\n};\n"],"mappings":"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"}

package/lib/hooks/useNestedTreeNavigation.js

@@ -1,59 +0,0 @@
-import { useHTMLElementWalkerRef } from './useHTMLElementWalker';
-import { nextTypeAheadElement } from '../utils/nextTypeAheadElement';
-import { treeDataTypes } from '../utils/tokens';
-import { treeItemFilter } from '../utils/treeItemFilter';
-import { useRovingTabIndex } from './useRovingTabIndexes';
-import { useMergedRefs } from '@fluentui/react-utilities';
-export function useNestedTreeNavigation() {
-  const [{
-    rove
-  }, rovingRootRef] = useRovingTabIndex(treeItemFilter);
-  const [walkerRef, rootRef] = useHTMLElementWalkerRef(treeItemFilter);
-  const getNextElement = data => {
-    if (!walkerRef.current) {
-      return;
-    }
-    const treeItemWalker = walkerRef.current;
-    switch (data.type) {
-      case treeDataTypes.click:
-        return data.target;
-      case treeDataTypes.typeAhead:
-        treeItemWalker.currentElement = data.target;
-        return nextTypeAheadElement(treeItemWalker, data.event.key);
-      case treeDataTypes.arrowLeft:
-        treeItemWalker.currentElement = data.target;
-        return treeItemWalker.parentElement();
-      case treeDataTypes.arrowRight:
-        treeItemWalker.currentElement = data.target;
-        return treeItemWalker.firstChild();
-      case treeDataTypes.end:
-        treeItemWalker.currentElement = treeItemWalker.root;
-        return lastChildRecursive(treeItemWalker);
-      case treeDataTypes.home:
-        treeItemWalker.currentElement = treeItemWalker.root;
-        return treeItemWalker.firstChild();
-      case treeDataTypes.arrowDown:
-        treeItemWalker.currentElement = data.target;
-        return treeItemWalker.nextElement();
-      case treeDataTypes.arrowUp:
-        treeItemWalker.currentElement = data.target;
-        return treeItemWalker.previousElement();
-    }
-  };
-  function navigate(data) {
-    const nextElement = getNextElement(data);
-    if (nextElement) {
-      rove(nextElement);
-    }
-  }
-  return [navigate, useMergedRefs(rootRef, rovingRootRef)];
-}
-function lastChildRecursive(walker) {
-  let lastElement = null;
-  let nextElement = null;
-  while (nextElement = walker.lastChild()) {
-    lastElement = nextElement;
-  }
-  return lastElement;
-}
-//# sourceMappingURL=useNestedTreeNavigation.js.map

package/lib/hooks/useNestedTreeNavigation.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["useHTMLElementWalkerRef","nextTypeAheadElement","treeDataTypes","treeItemFilter","useRovingTabIndex","useMergedRefs","useNestedTreeNavigation","rove","rovingRootRef","walkerRef","rootRef","getNextElement","data","current","treeItemWalker","type","click","target","typeAhead","currentElement","event","key","arrowLeft","parentElement","arrowRight","firstChild","end","root","lastChildRecursive","home","arrowDown","nextElement","arrowUp","previousElement","navigate","walker","lastElement","lastChild"],"sources":["../src/packages/react-components/react-tree/src/hooks/useNestedTreeNavigation.ts"],"sourcesContent":["import { TreeNavigationData_unstable } from '../Tree';\nimport { HTMLElementWalker, useHTMLElementWalkerRef } from './useHTMLElementWalker';\nimport { nextTypeAheadElement } from '../utils/nextTypeAheadElement';\nimport { treeDataTypes } from '../utils/tokens';\nimport { treeItemFilter } from '../utils/treeItemFilter';\nimport { useRovingTabIndex } from './useRovingTabIndexes';\nimport { useMergedRefs } from '@fluentui/react-utilities';\n\nexport function useNestedTreeNavigation() {\n  const [{ rove }, rovingRootRef] = useRovingTabIndex(treeItemFilter);\n  const [walkerRef, rootRef] = useHTMLElementWalkerRef(treeItemFilter);\n\n  const getNextElement = (data: TreeNavigationData_unstable) => {\n    if (!walkerRef.current) {\n      return;\n    }\n    const treeItemWalker = walkerRef.current;\n    switch (data.type) {\n      case treeDataTypes.click:\n        return data.target;\n      case treeDataTypes.typeAhead:\n        treeItemWalker.currentElement = data.target;\n        return nextTypeAheadElement(treeItemWalker, data.event.key);\n      case treeDataTypes.arrowLeft:\n        treeItemWalker.currentElement = data.target;\n        return treeItemWalker.parentElement();\n      case treeDataTypes.arrowRight:\n        treeItemWalker.currentElement = data.target;\n        return treeItemWalker.firstChild();\n      case treeDataTypes.end:\n        treeItemWalker.currentElement = treeItemWalker.root;\n        return lastChildRecursive(treeItemWalker);\n      case treeDataTypes.home:\n        treeItemWalker.currentElement = treeItemWalker.root;\n        return treeItemWalker.firstChild();\n      case treeDataTypes.arrowDown:\n        treeItemWalker.currentElement = data.target;\n        return treeItemWalker.nextElement();\n      case treeDataTypes.arrowUp:\n        treeItemWalker.currentElement = data.target;\n        return treeItemWalker.previousElement();\n    }\n  };\n  function navigate(data: TreeNavigationData_unstable) {\n    const nextElement = getNextElement(data);\n    if (nextElement) {\n      rove(nextElement);\n    }\n  }\n  return [navigate, useMergedRefs(rootRef, rovingRootRef)] as const;\n}\n\nfunction lastChildRecursive(walker: HTMLElementWalker) {\n  let lastElement: HTMLElement | null = null;\n  let nextElement: HTMLElement | null = null;\n  while ((nextElement = walker.lastChild())) {\n    lastElement = nextElement;\n  }\n  return lastElement;\n}\n"],"mappings":"AACA,SAA4BA,uBAAuB,QAAQ,wBAAwB;AACnF,SAASC,oBAAoB,QAAQ,+BAA+B;AACpE,SAASC,aAAa,QAAQ,iBAAiB;AAC/C,SAASC,cAAc,QAAQ,yBAAyB;AACxD,SAASC,iBAAiB,QAAQ,uBAAuB;AACzD,SAASC,aAAa,QAAQ,2BAA2B;AAEzD,OAAM,SAAUC,uBAAuBA,CAAA;EACrC,MAAM,CAAC;IAAEC;EAAI,CAAE,EAAEC,aAAa,CAAC,GAAGJ,iBAAiB,CAACD,cAAc,CAAC;EACnE,MAAM,CAACM,SAAS,EAAEC,OAAO,CAAC,GAAGV,uBAAuB,CAACG,cAAc,CAAC;EAEpE,MAAMQ,cAAc,GAAIC,IAAiC,IAAI;IAC3D,IAAI,CAACH,SAAS,CAACI,OAAO,EAAE;MACtB;;IAEF,MAAMC,cAAc,GAAGL,SAAS,CAACI,OAAO;IACxC,QAAQD,IAAI,CAACG,IAAI;MACf,KAAKb,aAAa,CAACc,KAAK;QACtB,OAAOJ,IAAI,CAACK,MAAM;MACpB,KAAKf,aAAa,CAACgB,SAAS;QAC1BJ,cAAc,CAACK,cAAc,GAAGP,IAAI,CAACK,MAAM;QAC3C,OAAOhB,oBAAoB,CAACa,cAAc,EAAEF,IAAI,CAACQ,KAAK,CAACC,GAAG,CAAC;MAC7D,KAAKnB,aAAa,CAACoB,SAAS;QAC1BR,cAAc,CAACK,cAAc,GAAGP,IAAI,CAACK,MAAM;QAC3C,OAAOH,cAAc,CAACS,aAAa,EAAE;MACvC,KAAKrB,aAAa,CAACsB,UAAU;QAC3BV,cAAc,CAACK,cAAc,GAAGP,IAAI,CAACK,MAAM;QAC3C,OAAOH,cAAc,CAACW,UAAU,EAAE;MACpC,KAAKvB,aAAa,CAACwB,GAAG;QACpBZ,cAAc,CAACK,cAAc,GAAGL,cAAc,CAACa,IAAI;QACnD,OAAOC,kBAAkB,CAACd,cAAc,CAAC;MAC3C,KAAKZ,aAAa,CAAC2B,IAAI;QACrBf,cAAc,CAACK,cAAc,GAAGL,cAAc,CAACa,IAAI;QACnD,OAAOb,cAAc,CAACW,UAAU,EAAE;MACpC,KAAKvB,aAAa,CAAC4B,SAAS;QAC1BhB,cAAc,CAACK,cAAc,GAAGP,IAAI,CAACK,MAAM;QAC3C,OAAOH,cAAc,CAACiB,WAAW,EAAE;MACrC,KAAK7B,aAAa,CAAC8B,OAAO;QACxBlB,cAAc,CAACK,cAAc,GAAGP,IAAI,CAACK,MAAM;QAC3C,OAAOH,cAAc,CAACmB,eAAe,EAAE;IAAC;EAE9C,CAAC;EACD,SAASC,QAAQA,CAACtB,IAAiC;IACjD,MAAMmB,WAAW,GAAGpB,cAAc,CAACC,IAAI,CAAC;IACxC,IAAImB,WAAW,EAAE;MACfxB,IAAI,CAACwB,WAAW,CAAC;;EAErB;EACA,OAAO,CAACG,QAAQ,EAAE7B,aAAa,CAACK,OAAO,EAAEF,aAAa,CAAC,CAAU;AACnE;AAEA,SAASoB,kBAAkBA,CAACO,MAAyB;EACnD,IAAIC,WAAW,GAAuB,IAAI;EAC1C,IAAIL,WAAW,GAAuB,IAAI;EAC1C,OAAQA,WAAW,GAAGI,MAAM,CAACE,SAAS,EAAE,EAAG;IACzCD,WAAW,GAAGL,WAAW;;EAE3B,OAAOK,WAAW;AACpB"}

package/lib/hooks/useOpenItemsState.js

@@ -1,22 +0,0 @@
-import { useControllableState, useEventCallback } from '@fluentui/react-utilities';
-import * as React from 'react';
-import { createImmutableSet, emptyImmutableSet } from '../utils/ImmutableSet';
-export function useOpenItemsState(props) {
-  const [openItems, setOpenItems] = useControllableState({
-    state: React.useMemo(() => props.openItems && createImmutableSet(props.openItems), [props.openItems]),
-    defaultState: React.useMemo(() => props.defaultOpenItems && createImmutableSet(props.defaultOpenItems), [props.defaultOpenItems]),
-    initialState: emptyImmutableSet
-  });
-  const updateOpenItems = useEventCallback(data => setOpenItems(currentOpenItems => createNextOpenItems(data, currentOpenItems)));
-  return [openItems, updateOpenItems];
-}
-function createNextOpenItems(data, previousOpenItems) {
-  const id = data.target.id;
-  const previousOpenItemsHasId = previousOpenItems.has(id);
-  if (data.open ? previousOpenItemsHasId : !previousOpenItemsHasId) {
-    return previousOpenItems;
-  }
-  const nextOpenItems = createImmutableSet(previousOpenItems);
-  return data.open ? nextOpenItems.add(id) : nextOpenItems.delete(id);
-}
-//# sourceMappingURL=useOpenItemsState.js.map

package/lib/hooks/useOpenItemsState.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["useControllableState","useEventCallback","React","createImmutableSet","emptyImmutableSet","useOpenItemsState","props","openItems","setOpenItems","state","useMemo","defaultState","defaultOpenItems","initialState","updateOpenItems","data","currentOpenItems","createNextOpenItems","previousOpenItems","id","target","previousOpenItemsHasId","has","open","nextOpenItems","add","delete"],"sources":["../src/packages/react-components/react-tree/src/hooks/useOpenItemsState.ts"],"sourcesContent":["import { useControllableState, useEventCallback } from '@fluentui/react-utilities';\nimport * as React from 'react';\nimport { TreeItemId, TreeOpenChangeData, TreeProps } from '../Tree';\nimport { createImmutableSet, emptyImmutableSet, ImmutableSet } from '../utils/ImmutableSet';\n\nexport function useOpenItemsState(props: Pick<TreeProps, 'openItems' | 'defaultOpenItems'>) {\n  const [openItems, setOpenItems] = useControllableState({\n    state: React.useMemo(() => props.openItems && createImmutableSet(props.openItems), [props.openItems]),\n    defaultState: React.useMemo(\n      () => props.defaultOpenItems && createImmutableSet(props.defaultOpenItems),\n      [props.defaultOpenItems],\n    ),\n    initialState: emptyImmutableSet,\n  });\n  const updateOpenItems = useEventCallback((data: TreeOpenChangeData) =>\n    setOpenItems(currentOpenItems => createNextOpenItems(data, currentOpenItems)),\n  );\n  return [openItems, updateOpenItems] as const;\n}\n\nfunction createNextOpenItems(\n  data: TreeOpenChangeData,\n  previousOpenItems: ImmutableSet<TreeItemId>,\n): ImmutableSet<TreeItemId> {\n  const id = data.target.id;\n  const previousOpenItemsHasId = previousOpenItems.has(id);\n  if (data.open ? previousOpenItemsHasId : !previousOpenItemsHasId) {\n    return previousOpenItems;\n  }\n  const nextOpenItems = createImmutableSet(previousOpenItems);\n  return data.open ? nextOpenItems.add(id) : nextOpenItems.delete(id);\n}\n"],"mappings":"AAAA,SAASA,oBAAoB,EAAEC,gBAAgB,QAAQ,2BAA2B;AAClF,OAAO,KAAKC,KAAK,MAAM,OAAO;AAE9B,SAASC,kBAAkB,EAAEC,iBAAiB,QAAsB,uBAAuB;AAE3F,OAAM,SAAUC,iBAAiBA,CAACC,KAAwD;EACxF,MAAM,CAACC,SAAS,EAAEC,YAAY,CAAC,GAAGR,oBAAoB,CAAC;IACrDS,KAAK,EAAEP,KAAK,CAACQ,OAAO,CAAC,MAAMJ,KAAK,CAACC,SAAS,IAAIJ,kBAAkB,CAACG,KAAK,CAACC,SAAS,CAAC,EAAE,CAACD,KAAK,CAACC,SAAS,CAAC,CAAC;IACrGI,YAAY,EAAET,KAAK,CAACQ,OAAO,CACzB,MAAMJ,KAAK,CAACM,gBAAgB,IAAIT,kBAAkB,CAACG,KAAK,CAACM,gBAAgB,CAAC,EAC1E,CAACN,KAAK,CAACM,gBAAgB,CAAC,CACzB;IACDC,YAAY,EAAET;GACf,CAAC;EACF,MAAMU,eAAe,GAAGb,gBAAgB,CAAEc,IAAwB,IAChEP,YAAY,CAACQ,gBAAgB,IAAIC,mBAAmB,CAACF,IAAI,EAAEC,gBAAgB,CAAC,CAAC,CAC9E;EACD,OAAO,CAACT,SAAS,EAAEO,eAAe,CAAU;AAC9C;AAEA,SAASG,mBAAmBA,CAC1BF,IAAwB,EACxBG,iBAA2C;EAE3C,MAAMC,EAAE,GAAGJ,IAAI,CAACK,MAAM,CAACD,EAAE;EACzB,MAAME,sBAAsB,GAAGH,iBAAiB,CAACI,GAAG,CAACH,EAAE,CAAC;EACxD,IAAIJ,IAAI,CAACQ,IAAI,GAAGF,sBAAsB,GAAG,CAACA,sBAAsB,EAAE;IAChE,OAAOH,iBAAiB;;EAE1B,MAAMM,aAAa,GAAGrB,kBAAkB,CAACe,iBAAiB,CAAC;EAC3D,OAAOH,IAAI,CAACQ,IAAI,GAAGC,aAAa,CAACC,GAAG,CAACN,EAAE,CAAC,GAAGK,aAAa,CAACE,MAAM,CAACP,EAAE,CAAC;AACrE"}