@fluentui/react-tree 9.0.0-beta.17 → 9.0.0-beta.19

package/lib/components/TreeItemAside/useTreeItemAsideStyles.styles.js.map

@@ -1 +1 @@
-{"version":3,"names":["__styles","mergeClasses","shorthands","tokens","treeItemAsideClassNames","root","useStyles","base","mc9l5x","Frg6f3","Ijaq50","Br312pm","nk6f5a","Bw0ie65","actions","qhf8xq","Bj3rh1h","z8tnut","z189sj","Byoj8tv","uwmqm3","aside","Bt984gj","i8kkvl","Belr9w4","d","useTreeItemAsideStyles_unstable","state","styles","className"],"sources":["../../../src/components/TreeItemAside/useTreeItemAsideStyles.styles.ts"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport type { TreeItemAsideSlots, TreeItemAsideState } from './TreeItemAside.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { tokens } from '@fluentui/react-theme';\n\nexport const treeItemAsideClassNames: SlotClassNames<TreeItemAsideSlots> = {\n  root: 'fui-TreeItemAside',\n};\n\n/**\n * Styles for the action icon slot\n */\nconst useStyles = makeStyles({\n  base: {\n    display: 'flex',\n    marginLeft: 'auto',\n    ...shorthands.gridArea('aside'),\n  },\n  actions: {\n    position: 'relative',\n    zIndex: 1,\n    ...shorthands.padding(0, tokens.spacingHorizontalS),\n  },\n  aside: {\n    alignItems: 'center',\n    zIndex: 0,\n    ...shorthands.padding(0, tokens.spacingHorizontalM),\n    ...shorthands.gap(tokens.spacingHorizontalXS),\n  },\n});\n\n/**\n * Apply styling to the TreeItemAside slots based on the state\n */\nexport const useTreeItemAsideStyles_unstable = (state: TreeItemAsideState): TreeItemAsideState => {\n  const styles = useStyles();\n\n  state.root.className = mergeClasses(\n    treeItemAsideClassNames.root,\n    styles.base,\n    state.actions ? styles.actions : styles.aside,\n    state.root.className,\n  );\n  return state;\n};\n"],"mappings":"AAAA,SAAAA,QAAA,EAAqBC,YAAY,EAAEC,UAAU,QAAQ;AAGrD,SAASC,MAAM,QAAQ;AAEvB,OAAO,MAAMC,uBAAA,GAA8D;EACzEC,IAAA,EAAM;AACR;AAEA;;;AAGA,MAAMC,SAAA,gBAAYN,QAAA;EAAAO,IAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;EAAA;EAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;EAAAC,KAAA;IAAAC,OAAA;IAAAN,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAG,MAAA;IAAAC,OAAA;EAAA;AAAA;EAAAC,CAAA;AAAA,EAiBlB;AAEA;;;AAGA,OAAO,MAAMC,+BAAA,GAAmCC,KAAA,IAAkD;EAChG,MAAMC,MAAA,GAAStB,SAAA;EAEfqB,KAAA,CAAMtB,IAAI,CAACwB,SAAS,GAAG5B,YAAA,CACrBG,uBAAA,CAAwBC,IAAI,EAC5BuB,MAAA,CAAOrB,IAAI,EACXoB,KAAA,CAAMb,OAAO,GAAGc,MAAA,CAAOd,OAAO,GAAGc,MAAA,CAAOP,KAAK,EAC7CM,KAAA,CAAMtB,IAAI,CAACwB,SAAS;EAEtB,OAAOF,KAAA;AACT"}
+{"version":3,"names":["__styles","mergeClasses","shorthands","tokens","treeItemAsideClassNames","root","useStyles","base","mc9l5x","Frg6f3","Ijaq50","Br312pm","nk6f5a","Bw0ie65","actions","qhf8xq","Bj3rh1h","z8tnut","z189sj","Byoj8tv","uwmqm3","aside","Bt984gj","i8kkvl","Belr9w4","d","useTreeItemAsideStyles_unstable","state","styles","className"],"sources":["useTreeItemAsideStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nexport const treeItemAsideClassNames = {\n    root: 'fui-TreeItemAside'\n};\n/**\n * Styles for the action icon slot\n */ const useStyles = makeStyles({\n    base: {\n        display: 'flex',\n        marginLeft: 'auto',\n        ...shorthands.gridArea('aside')\n    },\n    actions: {\n        position: 'relative',\n        zIndex: 1,\n        ...shorthands.padding(0, tokens.spacingHorizontalS)\n    },\n    aside: {\n        alignItems: 'center',\n        zIndex: 0,\n        ...shorthands.padding(0, tokens.spacingHorizontalM),\n        ...shorthands.gap(tokens.spacingHorizontalXS)\n    }\n});\n/**\n * Apply styling to the TreeItemAside slots based on the state\n */ export const useTreeItemAsideStyles_unstable = (state)=>{\n    const styles = useStyles();\n    state.root.className = mergeClasses(treeItemAsideClassNames.root, styles.base, state.actions ? styles.actions : styles.aside, state.root.className);\n    return state;\n};\n"],"mappings":"AAAA,SAAAA,QAAA,EAAqBC,YAAY,EAAEC,UAAU,QAAQ,gBAAgB;AACrE,SAASC,MAAM,QAAQ,uBAAuB;AAC9C,OAAO,MAAMC,uBAAuB,GAAG;EACnCC,IAAI,EAAE;AACV,CAAC;AACD;AACA;AACA;AAAI,MAAMC,SAAS,gBAAGN,QAAA;EAAAO,IAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;EAAA;EAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;EAAAC,KAAA;IAAAC,OAAA;IAAAN,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAG,MAAA;IAAAC,OAAA;EAAA;AAAA;EAAAC,CAAA;AAAA,CAiBrB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMC,+BAA+B,GAAIC,KAAK,IAAG;EACxD,MAAMC,MAAM,GAAGtB,SAAS,CAAC,CAAC;EAC1BqB,KAAK,CAACtB,IAAI,CAACwB,SAAS,GAAG5B,YAAY,CAACG,uBAAuB,CAACC,IAAI,EAAEuB,MAAM,CAACrB,IAAI,EAAEoB,KAAK,CAACb,OAAO,GAAGc,MAAM,CAACd,OAAO,GAAGc,MAAM,CAACP,KAAK,EAAEM,KAAK,CAACtB,IAAI,CAACwB,SAAS,CAAC;EACnJ,OAAOF,KAAK;AAChB,CAAC"}

package/lib/components/TreeItemChevron.js

@@ -2,26 +2,23 @@ import * as React from 'react';
 import { useFluent_unstable } from '@fluentui/react-shared-contexts';
 import { ChevronRight12Regular } from '@fluentui/react-icons';
 import { useTreeItemContext_unstable } from '../contexts/treeItemContext';
-export const TreeItemChevron = /*#__PURE__*/React.memo(() => {
-  const open = useTreeItemContext_unstable(ctx => ctx.open);
-  const {
-    dir
-  } = useFluent_unstable();
-  const expandIconRotation = open ? 90 : dir !== 'rtl' ? 0 : 180;
-  return /*#__PURE__*/React.createElement(ChevronRight12Regular, {
-    style: expandIconInlineStyles[expandIconRotation]
-  });
+export const TreeItemChevron = /*#__PURE__*/ React.memo(()=>{
+    const open = useTreeItemContext_unstable((ctx)=>ctx.open);
+    const { dir  } = useFluent_unstable();
+    const expandIconRotation = open ? 90 : dir !== 'rtl' ? 0 : 180;
+    return /*#__PURE__*/ React.createElement(ChevronRight12Regular, {
+        style: expandIconInlineStyles[expandIconRotation]
+    });
 });
 TreeItemChevron.displayName = 'TreeItemChevron';
 const expandIconInlineStyles = {
-  90: {
-    transform: `rotate(90deg)`
-  },
-  0: {
-    transform: `rotate(0deg)`
-  },
-  180: {
-    transform: `rotate(180deg)`
-  }
+    90: {
+        transform: `rotate(90deg)`
+    },
+    0: {
+        transform: `rotate(0deg)`
+    },
+    180: {
+        transform: `rotate(180deg)`
+    }
 };
-//# sourceMappingURL=TreeItemChevron.js.map

package/lib/components/TreeItemChevron.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useFluent_unstable","ChevronRight12Regular","useTreeItemContext_unstable","TreeItemChevron","memo","open","ctx","dir","expandIconRotation","createElement","style","expandIconInlineStyles","displayName","transform"],"sources":["../../src/components/TreeItemChevron.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useFluent_unstable } from '@fluentui/react-shared-contexts';\nimport { ChevronRight12Regular } from '@fluentui/react-icons';\nimport { useTreeItemContext_unstable } from '../contexts/treeItemContext';\n\nexport const TreeItemChevron = React.memo(() => {\n  const open = useTreeItemContext_unstable(ctx => ctx.open);\n\n  const { dir } = useFluent_unstable();\n\n  const expandIconRotation = open ? 90 : dir !== 'rtl' ? 0 : 180;\n  return <ChevronRight12Regular style={expandIconInlineStyles[expandIconRotation]} />;\n});\nTreeItemChevron.displayName = 'TreeItemChevron';\n\nconst expandIconInlineStyles = {\n  90: { transform: `rotate(90deg)` },\n  0: { transform: `rotate(0deg)` },\n  180: { transform: `rotate(180deg)` },\n} as const;\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,kBAAkB,QAAQ;AACnC,SAASC,qBAAqB,QAAQ;AACtC,SAASC,2BAA2B,QAAQ;AAE5C,OAAO,MAAMC,eAAA,gBAAkBJ,KAAA,CAAMK,IAAI,CAAC,MAAM;EAC9C,MAAMC,IAAA,GAAOH,2BAAA,CAA4BI,GAAA,IAAOA,GAAA,CAAID,IAAI;EAExD,MAAM;IAAEE;EAAG,CAAE,GAAGP,kBAAA;EAEhB,MAAMQ,kBAAA,GAAqBH,IAAA,GAAO,KAAKE,GAAA,KAAQ,QAAQ,IAAI,GAAG;EAC9D,oBAAOR,KAAA,CAAAU,aAAA,CAACR,qBAAA;IAAsBS,KAAA,EAAOC,sBAAsB,CAACH,kBAAA;;AAC9D;AACAL,eAAA,CAAgBS,WAAW,GAAG;AAE9B,MAAMD,sBAAA,GAAyB;EAC7B,IAAI;IAAEE,SAAA,EAAY;EAAe;EACjC,GAAG;IAAEA,SAAA,EAAY;EAAc;EAC/B,KAAK;IAAEA,SAAA,EAAY;EAAgB;AACrC"}
+{"version":3,"sources":["TreeItemChevron.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useFluent_unstable } from '@fluentui/react-shared-contexts';\nimport { ChevronRight12Regular } from '@fluentui/react-icons';\nimport { useTreeItemContext_unstable } from '../contexts/treeItemContext';\n\nexport const TreeItemChevron = React.memo(() => {\n  const open = useTreeItemContext_unstable(ctx => ctx.open);\n\n  const { dir } = useFluent_unstable();\n\n  const expandIconRotation = open ? 90 : dir !== 'rtl' ? 0 : 180;\n  return <ChevronRight12Regular style={expandIconInlineStyles[expandIconRotation]} />;\n});\nTreeItemChevron.displayName = 'TreeItemChevron';\n\nconst expandIconInlineStyles = {\n  90: { transform: `rotate(90deg)` },\n  0: { transform: `rotate(0deg)` },\n  180: { transform: `rotate(180deg)` },\n} as const;\n"],"names":["React","useFluent_unstable","ChevronRight12Regular","useTreeItemContext_unstable","TreeItemChevron","memo","open","ctx","dir","expandIconRotation","style","expandIconInlineStyles","displayName","transform"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,kBAAkB,QAAQ,kCAAkC;AACrE,SAASC,qBAAqB,QAAQ,wBAAwB;AAC9D,SAASC,2BAA2B,QAAQ,8BAA8B;AAE1E,OAAO,MAAMC,gCAAkBJ,MAAMK,IAAI,CAAC,IAAM;IAC9C,MAAMC,OAAOH,4BAA4BI,CAAAA,MAAOA,IAAID,IAAI;IAExD,MAAM,EAAEE,IAAG,EAAE,GAAGP;IAEhB,MAAMQ,qBAAqBH,OAAO,KAAKE,QAAQ,QAAQ,IAAI,GAAG;IAC9D,qBAAO,oBAACN;QAAsBQ,OAAOC,sBAAsB,CAACF,mBAAmB;;AACjF,GAAG;AACHL,gBAAgBQ,WAAW,GAAG;AAE9B,MAAMD,yBAAyB;IAC7B,IAAI;QAAEE,WAAW,CAAC,aAAa,CAAC;IAAC;IACjC,GAAG;QAAEA,WAAW,CAAC,YAAY,CAAC;IAAC;IAC/B,KAAK;QAAEA,WAAW,CAAC,cAAc,CAAC;IAAC;AACrC"}

package/lib/components/TreeItemLayout/TreeItemLayout.js

@@ -6,11 +6,9 @@ import { useTreeItemLayoutStyles_unstable } from './useTreeItemLayoutStyles.styl
  * The `TreeItemLayout` component is used as a child of `TreeItem` to define the content and layout of a tree item.
  * It provides a consistent visual structure for tree items in a `Tree` component.
  * This component should only be used as a direct child of `TreeItem`.
- */
-export const TreeItemLayout = /*#__PURE__*/React.forwardRef((props, ref) => {
-  const state = useTreeItemLayout_unstable(props, ref);
-  useTreeItemLayoutStyles_unstable(state);
-  return renderTreeItemLayout_unstable(state);
+ */ export const TreeItemLayout = /*#__PURE__*/ React.forwardRef((props, ref)=>{
+    const state = useTreeItemLayout_unstable(props, ref);
+    useTreeItemLayoutStyles_unstable(state);
+    return renderTreeItemLayout_unstable(state);
 });
 TreeItemLayout.displayName = 'TreeItemLayout';
-//# sourceMappingURL=TreeItemLayout.js.map

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

@@ -1 +1 @@
-{"version":3,"names":["React","useTreeItemLayout_unstable","renderTreeItemLayout_unstable","useTreeItemLayoutStyles_unstable","TreeItemLayout","forwardRef","props","ref","state","displayName"],"sources":["../../../src/components/TreeItemLayout/TreeItemLayout.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useTreeItemLayout_unstable } from './useTreeItemLayout';\nimport { renderTreeItemLayout_unstable } from './renderTreeItemLayout';\nimport { useTreeItemLayoutStyles_unstable } from './useTreeItemLayoutStyles.styles';\nimport type { TreeItemLayoutProps } from './TreeItemLayout.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * The `TreeItemLayout` component is used as a child of `TreeItem` to define the content and layout of a tree item.\n * It provides a consistent visual structure for tree items in a `Tree` component.\n * This component should only be used as a direct child of `TreeItem`.\n */\nexport const TreeItemLayout: ForwardRefComponent<TreeItemLayoutProps> = React.forwardRef((props, ref) => {\n  const state = useTreeItemLayout_unstable(props, ref);\n\n  useTreeItemLayoutStyles_unstable(state);\n  return renderTreeItemLayout_unstable(state);\n});\n\nTreeItemLayout.displayName = 'TreeItemLayout';\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,0BAA0B,QAAQ;AAC3C,SAASC,6BAA6B,QAAQ;AAC9C,SAASC,gCAAgC,QAAQ;AAIjD;;;;;AAKA,OAAO,MAAMC,cAAA,gBAA2DJ,KAAA,CAAMK,UAAU,CAAC,CAACC,KAAA,EAAOC,GAAA,KAAQ;EACvG,MAAMC,KAAA,GAAQP,0BAAA,CAA2BK,KAAA,EAAOC,GAAA;EAEhDJ,gCAAA,CAAiCK,KAAA;EACjC,OAAON,6BAAA,CAA8BM,KAAA;AACvC;AAEAJ,cAAA,CAAeK,WAAW,GAAG"}
+{"version":3,"sources":["TreeItemLayout.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useTreeItemLayout_unstable } from './useTreeItemLayout';\nimport { renderTreeItemLayout_unstable } from './renderTreeItemLayout';\nimport { useTreeItemLayoutStyles_unstable } from './useTreeItemLayoutStyles.styles';\nimport type { TreeItemLayoutProps } from './TreeItemLayout.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * The `TreeItemLayout` component is used as a child of `TreeItem` to define the content and layout of a tree item.\n * It provides a consistent visual structure for tree items in a `Tree` component.\n * This component should only be used as a direct child of `TreeItem`.\n */\nexport const TreeItemLayout: ForwardRefComponent<TreeItemLayoutProps> = React.forwardRef((props, ref) => {\n  const state = useTreeItemLayout_unstable(props, ref);\n\n  useTreeItemLayoutStyles_unstable(state);\n  return renderTreeItemLayout_unstable(state);\n});\n\nTreeItemLayout.displayName = 'TreeItemLayout';\n"],"names":["React","useTreeItemLayout_unstable","renderTreeItemLayout_unstable","useTreeItemLayoutStyles_unstable","TreeItemLayout","forwardRef","props","ref","state","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,0BAA0B,QAAQ,sBAAsB;AACjE,SAASC,6BAA6B,QAAQ,yBAAyB;AACvE,SAASC,gCAAgC,QAAQ,mCAAmC;AAIpF;;;;CAIC,GACD,OAAO,MAAMC,+BAA2DJ,MAAMK,UAAU,CAAC,CAACC,OAAOC,MAAQ;IACvG,MAAMC,QAAQP,2BAA2BK,OAAOC;IAEhDJ,iCAAiCK;IACjC,OAAON,8BAA8BM;AACvC,GAAG;AAEHJ,eAAeK,WAAW,GAAG"}

package/lib/components/TreeItemLayout/TreeItemLayout.types.js

@@ -1,2 +1 @@
-export {};
-//# sourceMappingURL=TreeItemLayout.types.js.map
+export { };

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

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["../../../src/components/TreeItemLayout/TreeItemLayout.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type TreeItemLayoutSlots = {\n  root: Slot<'div'>;\n  /**\n   * Expand icon slot,\n   * by default renders a chevron icon to indicate opening and closing\n   */\n  expandIcon?: Slot<'div'>;\n  /**\n   * Icon slot that renders right before main content\n   */\n  iconBefore?: Slot<'div'>;\n  /**\n   * Icon slot that renders right after main content\n   */\n  iconAfter?: Slot<'div'>;\n};\n\n/**\n * TreeItemLayout Props\n */\nexport type TreeItemLayoutProps = ComponentProps<Partial<TreeItemLayoutSlots>>;\n\n/**\n * State used in rendering TreeItemLayout\n */\nexport type TreeItemLayoutState = ComponentState<TreeItemLayoutSlots>;\n"],"mappings":"AAAA"}
+{"version":3,"sources":["TreeItemLayout.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type TreeItemLayoutSlots = {\n  root: Slot<'div'>;\n  /**\n   * Expand icon slot,\n   * by default renders a chevron icon to indicate opening and closing\n   */\n  expandIcon?: Slot<'div'>;\n  /**\n   * Icon slot that renders right before main content\n   */\n  iconBefore?: Slot<'div'>;\n  /**\n   * Icon slot that renders right after main content\n   */\n  iconAfter?: Slot<'div'>;\n};\n\n/**\n * TreeItemLayout Props\n */\nexport type TreeItemLayoutProps = ComponentProps<Partial<TreeItemLayoutSlots>>;\n\n/**\n * State used in rendering TreeItemLayout\n */\nexport type TreeItemLayoutState = ComponentState<TreeItemLayoutSlots>;\n"],"names":[],"mappings":"AAAA,WA2BsE"}

package/lib/components/TreeItemLayout/index.js

@@ -3,4 +3,3 @@ export * from './TreeItemLayout.types';
 export * from './renderTreeItemLayout';
 export * from './useTreeItemLayout';
 export * from './useTreeItemLayoutStyles.styles';
-//# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["../../../src/components/TreeItemLayout/index.ts"],"sourcesContent":["export * from './TreeItemLayout';\nexport * from './TreeItemLayout.types';\nexport * from './renderTreeItemLayout';\nexport * from './useTreeItemLayout';\nexport * from './useTreeItemLayoutStyles.styles';\n"],"mappings":"AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc"}
+{"version":3,"sources":["index.ts"],"sourcesContent":["export * from './TreeItemLayout';\nexport * from './TreeItemLayout.types';\nexport * from './renderTreeItemLayout';\nexport * from './useTreeItemLayout';\nexport * from './useTreeItemLayoutStyles.styles';\n"],"names":[],"mappings":"AAAA,cAAc,mBAAmB;AACjC,cAAc,yBAAyB;AACvC,cAAc,yBAAyB;AACvC,cAAc,sBAAsB;AACpC,cAAc,mCAAmC"}

package/lib/components/TreeItemLayout/renderTreeItemLayout.js

@@ -1,13 +1,8 @@
-/** @jsxRuntime classic */ /** @jsx createElement */import { createElement } from '@fluentui/react-jsx-runtime';
+/** @jsxRuntime classic */ /** @jsx createElement */ import { createElement } from '@fluentui/react-jsx-runtime';
 import { getSlotsNext } from '@fluentui/react-utilities';
 /**
  * Render the final JSX of TreeItemLayout
- */
-export const renderTreeItemLayout_unstable = state => {
-  const {
-    slots,
-    slotProps
-  } = getSlotsNext(state);
-  return /*#__PURE__*/createElement(slots.root, slotProps.root, slots.expandIcon && /*#__PURE__*/createElement(slots.expandIcon, slotProps.expandIcon), slots.iconBefore && /*#__PURE__*/createElement(slots.iconBefore, slotProps.iconBefore), slotProps.root.children, slots.iconAfter && /*#__PURE__*/createElement(slots.iconAfter, slotProps.iconAfter));
+ */ export const renderTreeItemLayout_unstable = (state)=>{
+    const { slots , slotProps  } = getSlotsNext(state);
+    return /*#__PURE__*/ createElement(slots.root, slotProps.root, slots.expandIcon && /*#__PURE__*/ createElement(slots.expandIcon, slotProps.expandIcon), slots.iconBefore && /*#__PURE__*/ createElement(slots.iconBefore, slotProps.iconBefore), slotProps.root.children, slots.iconAfter && /*#__PURE__*/ createElement(slots.iconAfter, slotProps.iconAfter));
 };
-//# sourceMappingURL=renderTreeItemLayout.js.map

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

@@ -1 +1 @@
-{"version":3,"names":["createElement","getSlotsNext","renderTreeItemLayout_unstable","state","slots","slotProps","root","expandIcon","iconBefore","children","iconAfter"],"sources":["../../../src/components/TreeItemLayout/renderTreeItemLayout.tsx"],"sourcesContent":["/** @jsxRuntime classic */\n/** @jsx createElement */\n\nimport { createElement } from '@fluentui/react-jsx-runtime';\nimport { getSlotsNext } from '@fluentui/react-utilities';\nimport type { TreeItemLayoutState, TreeItemLayoutSlots } from './TreeItemLayout.types';\n\n/**\n * Render the final JSX of TreeItemLayout\n */\nexport const renderTreeItemLayout_unstable = (state: TreeItemLayoutState) => {\n  const { slots, slotProps } = getSlotsNext<TreeItemLayoutSlots>(state);\n  return (\n    <slots.root {...slotProps.root}>\n      {slots.expandIcon && <slots.expandIcon {...slotProps.expandIcon} />}\n      {slots.iconBefore && <slots.iconBefore {...slotProps.iconBefore} />}\n      {slotProps.root.children}\n      {slots.iconAfter && <slots.iconAfter {...slotProps.iconAfter} />}\n    </slots.root>\n  );\n};\n"],"mappings":"AAAA,2BACA,yBAEA,SAASA,aAAa,QAAQ;AAC9B,SAASC,YAAY,QAAQ;AAG7B;;;AAGA,OAAO,MAAMC,6BAAA,GAAiCC,KAAA,IAA+B;EAC3E,MAAM;IAAEC,KAAA;IAAOC;EAAS,CAAE,GAAGJ,YAAA,CAAkCE,KAAA;EAC/D,oBACEH,aAZJ,CAYKI,KAAA,CAAME,IAAI,EAAKD,SAAA,CAAUC,IAAI,EAC3BF,KAAA,CAAMG,UAAU,iBAAIP,aAb3B,CAa4BI,KAAA,CAAMG,UAAU,EAAKF,SAAA,CAAUE,UAAU,GAC9DH,KAAA,CAAMI,UAAU,iBAAIR,aAd3B,CAc4BI,KAAA,CAAMI,UAAU,EAAKH,SAAA,CAAUG,UAAU,GAC9DH,SAAA,CAAUC,IAAI,CAACG,QAAQ,EACvBL,KAAA,CAAMM,SAAS,iBAAIV,aAhB1B,CAgB2BI,KAAA,CAAMM,SAAS,EAAKL,SAAA,CAAUK,SAAS;AAGlE"}
+{"version":3,"sources":["renderTreeItemLayout.tsx"],"sourcesContent":["/** @jsxRuntime classic */\n/** @jsx createElement */\n\nimport { createElement } from '@fluentui/react-jsx-runtime';\nimport { getSlotsNext } from '@fluentui/react-utilities';\nimport type { TreeItemLayoutState, TreeItemLayoutSlots } from './TreeItemLayout.types';\n\n/**\n * Render the final JSX of TreeItemLayout\n */\nexport const renderTreeItemLayout_unstable = (state: TreeItemLayoutState) => {\n  const { slots, slotProps } = getSlotsNext<TreeItemLayoutSlots>(state);\n  return (\n    <slots.root {...slotProps.root}>\n      {slots.expandIcon && <slots.expandIcon {...slotProps.expandIcon} />}\n      {slots.iconBefore && <slots.iconBefore {...slotProps.iconBefore} />}\n      {slotProps.root.children}\n      {slots.iconAfter && <slots.iconAfter {...slotProps.iconAfter} />}\n    </slots.root>\n  );\n};\n"],"names":["createElement","getSlotsNext","renderTreeItemLayout_unstable","state","slots","slotProps","root","expandIcon","iconBefore","children","iconAfter"],"mappings":"AAAA,wBAAwB,GACxB,uBAAuB,GAEvB,SAASA,aAAa,QAAQ,8BAA8B;AAC5D,SAASC,YAAY,QAAQ,4BAA4B;AAGzD;;CAEC,GACD,OAAO,MAAMC,gCAAgC,CAACC,QAA+B;IAC3E,MAAM,EAAEC,MAAK,EAAEC,UAAS,EAAE,GAAGJ,aAAkCE;IAC/D,qBACE,AAZJ,cAYKC,MAAME,IAAI,EAAKD,UAAUC,IAAI,EAC3BF,MAAMG,UAAU,kBAAI,AAb3B,cAa4BH,MAAMG,UAAU,EAAKF,UAAUE,UAAU,GAC9DH,MAAMI,UAAU,kBAAI,AAd3B,cAc4BJ,MAAMI,UAAU,EAAKH,UAAUG,UAAU,GAC9DH,UAAUC,IAAI,CAACG,QAAQ,EACvBL,MAAMM,SAAS,kBAAI,AAhB1B,cAgB2BN,MAAMM,SAAS,EAAKL,UAAUK,SAAS;AAGlE,EAAE"}

package/lib/components/TreeItemLayout/useTreeItemLayout.js

@@ -10,46 +10,39 @@ import { TreeItemChevron } from '../TreeItemChevron';
  *
  * @param props - props from this instance of TreeItemLayout
  * @param ref - reference to root HTMLElement of TreeItemLayout
- */
-export const useTreeItemLayout_unstable = (props, ref) => {
-  const {
-    iconAfter,
-    iconBefore,
-    expandIcon,
-    as = 'span'
-  } = props;
-  const layoutRef = useTreeItemContext_unstable(ctx => ctx.layoutRef);
-  const expandIconRef = useTreeItemContext_unstable(ctx => ctx.expandIconRef);
-  const isBranch = useTreeItemContext_unstable(ctx => ctx.itemType === 'branch');
-  return {
-    components: {
-      root: 'div',
-      expandIcon: 'div',
-      iconBefore: 'div',
-      iconAfter: 'div'
-    },
-    root: getNativeElementProps(as, {
-      ...props,
-      ref: useMergedRefs(ref, layoutRef)
-    }),
-    iconBefore: resolveShorthand(iconBefore, {
-      defaultProps: {
-        'aria-hidden': true
-      }
-    }),
-    iconAfter: resolveShorthand(iconAfter, {
-      defaultProps: {
-        'aria-hidden': true
-      }
-    }),
-    expandIcon: resolveShorthand(expandIcon, {
-      required: isBranch,
-      defaultProps: {
-        children: /*#__PURE__*/React.createElement(TreeItemChevron, null),
-        'aria-hidden': true,
-        ref: useMergedRefs(isResolvedShorthand(expandIcon) ? expandIcon.ref : undefined, expandIconRef)
-      }
-    })
-  };
+ */ export const useTreeItemLayout_unstable = (props, ref)=>{
+    const { iconAfter , iconBefore , expandIcon , as ='span'  } = props;
+    const layoutRef = useTreeItemContext_unstable((ctx)=>ctx.layoutRef);
+    const expandIconRef = useTreeItemContext_unstable((ctx)=>ctx.expandIconRef);
+    const isBranch = useTreeItemContext_unstable((ctx)=>ctx.itemType === 'branch');
+    return {
+        components: {
+            root: 'div',
+            expandIcon: 'div',
+            iconBefore: 'div',
+            iconAfter: 'div'
+        },
+        root: getNativeElementProps(as, {
+            ...props,
+            ref: useMergedRefs(ref, layoutRef)
+        }),
+        iconBefore: resolveShorthand(iconBefore, {
+            defaultProps: {
+                'aria-hidden': true
+            }
+        }),
+        iconAfter: resolveShorthand(iconAfter, {
+            defaultProps: {
+                'aria-hidden': true
+            }
+        }),
+        expandIcon: resolveShorthand(expandIcon, {
+            required: isBranch,
+            defaultProps: {
+                children: /*#__PURE__*/ React.createElement(TreeItemChevron, null),
+                'aria-hidden': true,
+                ref: useMergedRefs(isResolvedShorthand(expandIcon) ? expandIcon.ref : undefined, expandIconRef)
+            }
+        })
+    };
 };
-//# sourceMappingURL=useTreeItemLayout.js.map

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

@@ -1 +1 @@
-{"version":3,"names":["React","getNativeElementProps","isResolvedShorthand","resolveShorthand","useMergedRefs","useTreeItemContext_unstable","TreeItemChevron","useTreeItemLayout_unstable","props","ref","iconAfter","iconBefore","expandIcon","as","layoutRef","ctx","expandIconRef","isBranch","itemType","components","root","defaultProps","required","children","createElement","undefined"],"sources":["../../../src/components/TreeItemLayout/useTreeItemLayout.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, isResolvedShorthand, resolveShorthand, useMergedRefs } from '@fluentui/react-utilities';\nimport type { TreeItemLayoutProps, TreeItemLayoutState } from './TreeItemLayout.types';\nimport { useTreeItemContext_unstable } from '../../contexts/treeItemContext';\nimport { TreeItemChevron } from '../TreeItemChevron';\n\n/**\n * Create the state required to render TreeItemLayout.\n *\n * The returned state can be modified with hooks such as useTreeItemLayoutStyles_unstable,\n * before being passed to renderTreeItemLayout_unstable.\n *\n * @param props - props from this instance of TreeItemLayout\n * @param ref - reference to root HTMLElement of TreeItemLayout\n */\nexport const useTreeItemLayout_unstable = (\n  props: TreeItemLayoutProps,\n  ref: React.Ref<HTMLElement>,\n): TreeItemLayoutState => {\n  const { iconAfter, iconBefore, expandIcon, as = 'span' } = props;\n\n  const layoutRef = useTreeItemContext_unstable(ctx => ctx.layoutRef);\n  const expandIconRef = useTreeItemContext_unstable(ctx => ctx.expandIconRef);\n  const isBranch = useTreeItemContext_unstable(ctx => ctx.itemType === 'branch');\n\n  return {\n    components: {\n      root: 'div',\n      expandIcon: 'div',\n      iconBefore: 'div',\n      iconAfter: 'div',\n    },\n    root: getNativeElementProps(as, { ...props, ref: useMergedRefs(ref, layoutRef) }),\n    iconBefore: resolveShorthand(iconBefore, { defaultProps: { 'aria-hidden': true } }),\n    iconAfter: resolveShorthand(iconAfter, { defaultProps: { 'aria-hidden': true } }),\n    expandIcon: resolveShorthand(expandIcon, {\n      required: isBranch,\n      defaultProps: {\n        children: <TreeItemChevron />,\n        'aria-hidden': true,\n        ref: useMergedRefs(isResolvedShorthand(expandIcon) ? expandIcon.ref : undefined, expandIconRef),\n      },\n    }),\n  };\n};\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,qBAAqB,EAAEC,mBAAmB,EAAEC,gBAAgB,EAAEC,aAAa,QAAQ;AAE5F,SAASC,2BAA2B,QAAQ;AAC5C,SAASC,eAAe,QAAQ;AAEhC;;;;;;;;;AASA,OAAO,MAAMC,0BAAA,GAA6BA,CACxCC,KAAA,EACAC,GAAA,KACwB;EACxB,MAAM;IAAEC,SAAA;IAAWC,UAAA;IAAYC,UAAA;IAAYC,EAAA,GAAK;EAAM,CAAE,GAAGL,KAAA;EAE3D,MAAMM,SAAA,GAAYT,2BAAA,CAA4BU,GAAA,IAAOA,GAAA,CAAID,SAAS;EAClE,MAAME,aAAA,GAAgBX,2BAAA,CAA4BU,GAAA,IAAOA,GAAA,CAAIC,aAAa;EAC1E,MAAMC,QAAA,GAAWZ,2BAAA,CAA4BU,GAAA,IAAOA,GAAA,CAAIG,QAAQ,KAAK;EAErE,OAAO;IACLC,UAAA,EAAY;MACVC,IAAA,EAAM;MACNR,UAAA,EAAY;MACZD,UAAA,EAAY;MACZD,SAAA,EAAW;IACb;IACAU,IAAA,EAAMnB,qBAAA,CAAsBY,EAAA,EAAI;MAAE,GAAGL,KAAK;MAAEC,GAAA,EAAKL,aAAA,CAAcK,GAAA,EAAKK,SAAA;IAAW;IAC/EH,UAAA,EAAYR,gBAAA,CAAiBQ,UAAA,EAAY;MAAEU,YAAA,EAAc;QAAE,eAAe;MAAK;IAAE;IACjFX,SAAA,EAAWP,gBAAA,CAAiBO,SAAA,EAAW;MAAEW,YAAA,EAAc;QAAE,eAAe;MAAK;IAAE;IAC/ET,UAAA,EAAYT,gBAAA,CAAiBS,UAAA,EAAY;MACvCU,QAAA,EAAUL,QAAA;MACVI,YAAA,EAAc;QACZE,QAAA,eAAUvB,KAAA,CAAAwB,aAAA,CAAClB,eAAA;QACX,eAAe,IAAI;QACnBG,GAAA,EAAKL,aAAA,CAAcF,mBAAA,CAAoBU,UAAA,IAAcA,UAAA,CAAWH,GAAG,GAAGgB,SAAS,EAAET,aAAA;MACnF;IACF;EACF;AACF"}
+{"version":3,"sources":["useTreeItemLayout.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, isResolvedShorthand, resolveShorthand, useMergedRefs } from '@fluentui/react-utilities';\nimport type { TreeItemLayoutProps, TreeItemLayoutState } from './TreeItemLayout.types';\nimport { useTreeItemContext_unstable } from '../../contexts/treeItemContext';\nimport { TreeItemChevron } from '../TreeItemChevron';\n\n/**\n * Create the state required to render TreeItemLayout.\n *\n * The returned state can be modified with hooks such as useTreeItemLayoutStyles_unstable,\n * before being passed to renderTreeItemLayout_unstable.\n *\n * @param props - props from this instance of TreeItemLayout\n * @param ref - reference to root HTMLElement of TreeItemLayout\n */\nexport const useTreeItemLayout_unstable = (\n  props: TreeItemLayoutProps,\n  ref: React.Ref<HTMLElement>,\n): TreeItemLayoutState => {\n  const { iconAfter, iconBefore, expandIcon, as = 'span' } = props;\n\n  const layoutRef = useTreeItemContext_unstable(ctx => ctx.layoutRef);\n  const expandIconRef = useTreeItemContext_unstable(ctx => ctx.expandIconRef);\n  const isBranch = useTreeItemContext_unstable(ctx => ctx.itemType === 'branch');\n\n  return {\n    components: {\n      root: 'div',\n      expandIcon: 'div',\n      iconBefore: 'div',\n      iconAfter: 'div',\n    },\n    root: getNativeElementProps(as, { ...props, ref: useMergedRefs(ref, layoutRef) }),\n    iconBefore: resolveShorthand(iconBefore, { defaultProps: { 'aria-hidden': true } }),\n    iconAfter: resolveShorthand(iconAfter, { defaultProps: { 'aria-hidden': true } }),\n    expandIcon: resolveShorthand(expandIcon, {\n      required: isBranch,\n      defaultProps: {\n        children: <TreeItemChevron />,\n        'aria-hidden': true,\n        ref: useMergedRefs(isResolvedShorthand(expandIcon) ? expandIcon.ref : undefined, expandIconRef),\n      },\n    }),\n  };\n};\n"],"names":["React","getNativeElementProps","isResolvedShorthand","resolveShorthand","useMergedRefs","useTreeItemContext_unstable","TreeItemChevron","useTreeItemLayout_unstable","props","ref","iconAfter","iconBefore","expandIcon","as","layoutRef","ctx","expandIconRef","isBranch","itemType","components","root","defaultProps","required","children","undefined"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,qBAAqB,EAAEC,mBAAmB,EAAEC,gBAAgB,EAAEC,aAAa,QAAQ,4BAA4B;AAExH,SAASC,2BAA2B,QAAQ,iCAAiC;AAC7E,SAASC,eAAe,QAAQ,qBAAqB;AAErD;;;;;;;;CAQC,GACD,OAAO,MAAMC,6BAA6B,CACxCC,OACAC,MACwB;IACxB,MAAM,EAAEC,UAAS,EAAEC,WAAU,EAAEC,WAAU,EAAEC,IAAK,OAAM,EAAE,GAAGL;IAE3D,MAAMM,YAAYT,4BAA4BU,CAAAA,MAAOA,IAAID,SAAS;IAClE,MAAME,gBAAgBX,4BAA4BU,CAAAA,MAAOA,IAAIC,aAAa;IAC1E,MAAMC,WAAWZ,4BAA4BU,CAAAA,MAAOA,IAAIG,QAAQ,KAAK;IAErE,OAAO;QACLC,YAAY;YACVC,MAAM;YACNR,YAAY;YACZD,YAAY;YACZD,WAAW;QACb;QACAU,MAAMnB,sBAAsBY,IAAI;YAAE,GAAGL,KAAK;YAAEC,KAAKL,cAAcK,KAAKK;QAAW;QAC/EH,YAAYR,iBAAiBQ,YAAY;YAAEU,cAAc;gBAAE,eAAe,IAAI;YAAC;QAAE;QACjFX,WAAWP,iBAAiBO,WAAW;YAAEW,cAAc;gBAAE,eAAe,IAAI;YAAC;QAAE;QAC/ET,YAAYT,iBAAiBS,YAAY;YACvCU,UAAUL;YACVI,cAAc;gBACZE,wBAAU,oBAACjB;gBACX,eAAe,IAAI;gBACnBG,KAAKL,cAAcF,oBAAoBU,cAAcA,WAAWH,GAAG,GAAGe,SAAS,EAAER;YACnF;QACF;IACF;AACF,EAAE"}

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

@@ -1 +1 @@
-{"version":3,"names":["__styles","mergeClasses","shorthands","tokens","typographyStyles","useTreeContext_unstable","treeItemLevelToken","useTreeItemContext_unstable","treeItemLayoutClassNames","root","expandIcon","iconBefore","iconAfter","useRootStyles","base","mc9l5x","Bt984gj","sshi5w","B7ck84d","Ijaq50","Br312pm","nk6f5a","Bw0ie65","Bbmb7ep","Beyfa6y","B7oj6ja","Btl43ni","lj723h","ecr2s2","qya0sb","Bi91k9c","Jwef8y","Becwuud","leaf","uwmqm3","branch","medium","i8kkvl","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","small","subtle","transparent","De3pzq","d","a","h","useExpandIconStyles","Brf1p80","Bf4jedk","sj55zd","Bh6795r","Bnnss6s","xawz","z8tnut","z189sj","Byoj8tv","useIconStyles","useTreeItemLayoutStyles_unstable","state","rootStyles","iconStyles","expandIconStyles","size","ctx","appearance","itemType","className"],"sources":["../../../src/components/TreeItemLayout/useTreeItemLayoutStyles.styles.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';\nimport { treeItemLevelToken } from '../../utils/tokens';\nimport { useTreeItemContext_unstable } from '../../contexts/treeItemContext';\n\nexport const treeItemLayoutClassNames: SlotClassNames<TreeItemLayoutSlots> = {\n  root: 'fui-TreeItemLayout',\n  expandIcon: 'fui-TreeItemLayout__expandIcon',\n  iconBefore: 'fui-TreeItemLayout__iconBefore',\n  iconAfter: 'fui-TreeItemLayout__iconAfter',\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    boxSizing: 'border-box',\n    ...shorthands.gridArea('layout'),\n    ...shorthands.borderRadius(tokens.borderRadiusMedium),\n    ':active': {\n      color: tokens.colorNeutralForeground2Pressed,\n      backgroundColor: tokens.colorSubtleBackgroundPressed,\n      // TODO: stop using treeItemClassNames.expandIcon for styling\n      [`& .${treeItemLayoutClassNames.expandIcon}`]: {\n        color: tokens.colorNeutralForeground3Pressed,\n      },\n    },\n    ':hover': {\n      color: tokens.colorNeutralForeground2Hover,\n      backgroundColor: tokens.colorSubtleBackgroundHover,\n      // TODO: stop using treeItemClassNames.expandIcon  for styling\n      [`& .${treeItemLayoutClassNames.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  medium: {\n    columnGap: tokens.spacingHorizontalSNudge,\n    ...typographyStyles.body1,\n  },\n  small: {\n    columnGap: tokens.spacingHorizontalXS,\n    minHeight: '24px',\n    ...typographyStyles.caption1,\n  },\n  // Appearance variations\n  subtle: {},\n  'subtle-alpha': {\n    ':hover': {\n      backgroundColor: tokens.colorSubtleBackgroundLightAlphaHover,\n    },\n    ':active': {\n      backgroundColor: tokens.colorSubtleBackgroundLightAlphaPressed,\n    },\n  },\n  transparent: {\n    backgroundColor: tokens.colorTransparentBackground,\n    ':hover': {\n      backgroundColor: tokens.colorTransparentBackgroundHover,\n    },\n    ':active': {\n      backgroundColor: tokens.colorTransparentBackgroundPressed,\n    },\n  },\n});\n\n/**\n * Styles for the expand icon slot\n */\nconst 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.flex(0, 0, 'auto'),\n    ...shorthands.padding(tokens.spacingVerticalXS, 0),\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  iconBefore: {},\n  iconAfter: {},\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, expandIcon, root } = state;\n  const rootStyles = useRootStyles();\n  const iconStyles = useIconStyles();\n  const expandIconStyles = useExpandIconStyles();\n\n  const size = useTreeContext_unstable(ctx => ctx.size);\n  const appearance = useTreeContext_unstable(ctx => ctx.appearance);\n  const itemType = useTreeItemContext_unstable(ctx => ctx.itemType);\n\n  root.className = mergeClasses(\n    treeItemLayoutClassNames.root,\n    rootStyles.base,\n    rootStyles[appearance],\n    rootStyles[size],\n    rootStyles[itemType],\n    root.className,\n  );\n\n  if (expandIcon) {\n    expandIcon.className = mergeClasses(\n      treeItemLayoutClassNames.expandIcon,\n      expandIconStyles.base,\n      expandIcon.className,\n    );\n  }\n\n  if (iconBefore) {\n    iconBefore.className = mergeClasses(\n      treeItemLayoutClassNames.iconBefore,\n      iconStyles.base,\n      iconStyles.iconBefore,\n      iconBefore.className,\n    );\n  }\n\n  if (iconAfter) {\n    iconAfter.className = mergeClasses(\n      treeItemLayoutClassNames.iconAfter,\n      iconStyles.base,\n      iconStyles.iconAfter,\n      iconAfter.className,\n    );\n  }\n\n  return state;\n};\n"],"mappings":"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"}
+{"version":3,"names":["__styles","mergeClasses","shorthands","tokens","typographyStyles","useTreeContext_unstable","treeItemLevelToken","useTreeItemContext_unstable","treeItemLayoutClassNames","root","expandIcon","iconBefore","iconAfter","useRootStyles","base","mc9l5x","Bt984gj","sshi5w","B7ck84d","Ijaq50","Br312pm","nk6f5a","Bw0ie65","Bbmb7ep","Beyfa6y","B7oj6ja","Btl43ni","lj723h","ecr2s2","qya0sb","Bi91k9c","Jwef8y","Becwuud","leaf","uwmqm3","branch","medium","i8kkvl","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","small","subtle","transparent","De3pzq","d","a","h","useExpandIconStyles","Brf1p80","Bf4jedk","sj55zd","Bh6795r","Bnnss6s","xawz","z8tnut","z189sj","Byoj8tv","useIconStyles","useTreeItemLayoutStyles_unstable","state","rootStyles","iconStyles","expandIconStyles","size","ctx","appearance","itemType","className"],"sources":["useTreeItemLayoutStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport { useTreeContext_unstable } from '../../contexts/treeContext';\nimport { treeItemLevelToken } from '../../utils/tokens';\nimport { useTreeItemContext_unstable } from '../../contexts/treeItemContext';\nexport const treeItemLayoutClassNames = {\n    root: 'fui-TreeItemLayout',\n    expandIcon: 'fui-TreeItemLayout__expandIcon',\n    iconBefore: 'fui-TreeItemLayout__iconBefore',\n    iconAfter: 'fui-TreeItemLayout__iconAfter'\n};\n/**\n * Styles for the root slot\n */ const useRootStyles = makeStyles({\n    base: {\n        display: 'flex',\n        alignItems: 'center',\n        minHeight: '32px',\n        boxSizing: 'border-box',\n        ...shorthands.gridArea('layout'),\n        ...shorthands.borderRadius(tokens.borderRadiusMedium),\n        ':active': {\n            color: tokens.colorNeutralForeground2Pressed,\n            backgroundColor: tokens.colorSubtleBackgroundPressed,\n            // TODO: stop using treeItemClassNames.expandIcon for styling\n            [`& .${treeItemLayoutClassNames.expandIcon}`]: {\n                color: tokens.colorNeutralForeground3Pressed\n            }\n        },\n        ':hover': {\n            color: tokens.colorNeutralForeground2Hover,\n            backgroundColor: tokens.colorSubtleBackgroundHover,\n            // TODO: stop using treeItemClassNames.expandIcon  for styling\n            [`& .${treeItemLayoutClassNames.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    medium: {\n        columnGap: tokens.spacingHorizontalSNudge,\n        ...typographyStyles.body1\n    },\n    small: {\n        columnGap: tokens.spacingHorizontalXS,\n        minHeight: '24px',\n        ...typographyStyles.caption1\n    },\n    // Appearance variations\n    subtle: {},\n    'subtle-alpha': {\n        ':hover': {\n            backgroundColor: tokens.colorSubtleBackgroundLightAlphaHover\n        },\n        ':active': {\n            backgroundColor: tokens.colorSubtleBackgroundLightAlphaPressed\n        }\n    },\n    transparent: {\n        backgroundColor: tokens.colorTransparentBackground,\n        ':hover': {\n            backgroundColor: tokens.colorTransparentBackgroundHover\n        },\n        ':active': {\n            backgroundColor: tokens.colorTransparentBackgroundPressed\n        }\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.flex(0, 0, 'auto'),\n        ...shorthands.padding(tokens.spacingVerticalXS, 0)\n    }\n});\n/**\n * Styles for the before/after icon slot\n */ const useIconStyles = makeStyles({\n    base: {\n        display: 'flex',\n        alignItems: 'center',\n        color: tokens.colorNeutralForeground2,\n        lineHeight: tokens.lineHeightBase500,\n        fontSize: tokens.fontSizeBase500\n    },\n    iconBefore: {},\n    iconAfter: {}\n});\n/**\n * Apply styling to the TreeItemLayout slots based on the state\n */ export const useTreeItemLayoutStyles_unstable = (state)=>{\n    const { iconAfter , iconBefore , expandIcon , root  } = state;\n    const rootStyles = useRootStyles();\n    const iconStyles = useIconStyles();\n    const expandIconStyles = useExpandIconStyles();\n    const size = useTreeContext_unstable((ctx)=>ctx.size);\n    const appearance = useTreeContext_unstable((ctx)=>ctx.appearance);\n    const itemType = useTreeItemContext_unstable((ctx)=>ctx.itemType);\n    root.className = mergeClasses(treeItemLayoutClassNames.root, rootStyles.base, rootStyles[appearance], rootStyles[size], rootStyles[itemType], root.className);\n    if (expandIcon) {\n        expandIcon.className = mergeClasses(treeItemLayoutClassNames.expandIcon, expandIconStyles.base, expandIcon.className);\n    }\n    if (iconBefore) {\n        iconBefore.className = mergeClasses(treeItemLayoutClassNames.iconBefore, iconStyles.base, iconStyles.iconBefore, iconBefore.className);\n    }\n    if (iconAfter) {\n        iconAfter.className = mergeClasses(treeItemLayoutClassNames.iconAfter, iconStyles.base, iconStyles.iconAfter, iconAfter.className);\n    }\n    return state;\n};\n"],"mappings":"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"}

package/lib/components/TreeItemPersonaLayout/TreeItemPersonaLayout.js

@@ -7,12 +7,10 @@ import { useTreeItemPersonaLayoutContextValues_unstable } from './useTreeItemPer
  * The `TreeItemPersonaLayout` component is used as a child of `TreeItem` to display a `TreeItem` with a media (typically an avatar) and a description.
  * It provides a more visually appealing representation of a `TreeItem` and is typically used to display a list of people or topics.
  * This component should only be used as a direct child of `TreeItem`.
- */
-export const TreeItemPersonaLayout = /*#__PURE__*/React.forwardRef((props, ref) => {
-  const state = useTreeItemPersonaLayout_unstable(props, ref);
-  useTreeItemPersonaLayoutStyles_unstable(state);
-  const contextValues = useTreeItemPersonaLayoutContextValues_unstable(state);
-  return renderTreeItemPersonaLayout_unstable(state, contextValues);
+ */ export const TreeItemPersonaLayout = /*#__PURE__*/ React.forwardRef((props, ref)=>{
+    const state = useTreeItemPersonaLayout_unstable(props, ref);
+    useTreeItemPersonaLayoutStyles_unstable(state);
+    const contextValues = useTreeItemPersonaLayoutContextValues_unstable(state);
+    return renderTreeItemPersonaLayout_unstable(state, contextValues);
 });
 TreeItemPersonaLayout.displayName = 'TreeItemPersonaLayout';
-//# sourceMappingURL=TreeItemPersonaLayout.js.map

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

@@ -1 +1 @@
-{"version":3,"names":["React","useTreeItemPersonaLayout_unstable","renderTreeItemPersonaLayout_unstable","useTreeItemPersonaLayoutStyles_unstable","useTreeItemPersonaLayoutContextValues_unstable","TreeItemPersonaLayout","forwardRef","props","ref","state","contextValues","displayName"],"sources":["../../../src/components/TreeItemPersonaLayout/TreeItemPersonaLayout.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useTreeItemPersonaLayout_unstable } from './useTreeItemPersonaLayout';\nimport { renderTreeItemPersonaLayout_unstable } from './renderTreeItemPersonaLayout';\nimport { useTreeItemPersonaLayoutStyles_unstable } from './useTreeItemPersonaLayoutStyles.styles';\nimport type { TreeItemPersonaLayoutProps } from './TreeItemPersonaLayout.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useTreeItemPersonaLayoutContextValues_unstable } from './useTreeItemPersonaLayoutContextValues';\n\n/**\n * The `TreeItemPersonaLayout` component is used as a child of `TreeItem` to display a `TreeItem` with a media (typically an avatar) and a description.\n * It provides a more visually appealing representation of a `TreeItem` and is typically used to display a list of people or topics.\n * This component should only be used as a direct child of `TreeItem`.\n */\nexport const TreeItemPersonaLayout: ForwardRefComponent<TreeItemPersonaLayoutProps> = React.forwardRef((props, ref) => {\n  const state = useTreeItemPersonaLayout_unstable(props, ref);\n\n  useTreeItemPersonaLayoutStyles_unstable(state);\n\n  const contextValues = useTreeItemPersonaLayoutContextValues_unstable(state);\n\n  return renderTreeItemPersonaLayout_unstable(state, contextValues);\n});\n\nTreeItemPersonaLayout.displayName = 'TreeItemPersonaLayout';\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,iCAAiC,QAAQ;AAClD,SAASC,oCAAoC,QAAQ;AACrD,SAASC,uCAAuC,QAAQ;AAGxD,SAASC,8CAA8C,QAAQ;AAE/D;;;;;AAKA,OAAO,MAAMC,qBAAA,gBAAyEL,KAAA,CAAMM,UAAU,CAAC,CAACC,KAAA,EAAOC,GAAA,KAAQ;EACrH,MAAMC,KAAA,GAAQR,iCAAA,CAAkCM,KAAA,EAAOC,GAAA;EAEvDL,uCAAA,CAAwCM,KAAA;EAExC,MAAMC,aAAA,GAAgBN,8CAAA,CAA+CK,KAAA;EAErE,OAAOP,oCAAA,CAAqCO,KAAA,EAAOC,aAAA;AACrD;AAEAL,qBAAA,CAAsBM,WAAW,GAAG"}
+{"version":3,"sources":["TreeItemPersonaLayout.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useTreeItemPersonaLayout_unstable } from './useTreeItemPersonaLayout';\nimport { renderTreeItemPersonaLayout_unstable } from './renderTreeItemPersonaLayout';\nimport { useTreeItemPersonaLayoutStyles_unstable } from './useTreeItemPersonaLayoutStyles.styles';\nimport type { TreeItemPersonaLayoutProps } from './TreeItemPersonaLayout.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useTreeItemPersonaLayoutContextValues_unstable } from './useTreeItemPersonaLayoutContextValues';\n\n/**\n * The `TreeItemPersonaLayout` component is used as a child of `TreeItem` to display a `TreeItem` with a media (typically an avatar) and a description.\n * It provides a more visually appealing representation of a `TreeItem` and is typically used to display a list of people or topics.\n * This component should only be used as a direct child of `TreeItem`.\n */\nexport const TreeItemPersonaLayout: ForwardRefComponent<TreeItemPersonaLayoutProps> = React.forwardRef((props, ref) => {\n  const state = useTreeItemPersonaLayout_unstable(props, ref);\n\n  useTreeItemPersonaLayoutStyles_unstable(state);\n\n  const contextValues = useTreeItemPersonaLayoutContextValues_unstable(state);\n\n  return renderTreeItemPersonaLayout_unstable(state, contextValues);\n});\n\nTreeItemPersonaLayout.displayName = 'TreeItemPersonaLayout';\n"],"names":["React","useTreeItemPersonaLayout_unstable","renderTreeItemPersonaLayout_unstable","useTreeItemPersonaLayoutStyles_unstable","useTreeItemPersonaLayoutContextValues_unstable","TreeItemPersonaLayout","forwardRef","props","ref","state","contextValues","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,iCAAiC,QAAQ,6BAA6B;AAC/E,SAASC,oCAAoC,QAAQ,gCAAgC;AACrF,SAASC,uCAAuC,QAAQ,0CAA0C;AAGlG,SAASC,8CAA8C,QAAQ,0CAA0C;AAEzG;;;;CAIC,GACD,OAAO,MAAMC,sCAAyEL,MAAMM,UAAU,CAAC,CAACC,OAAOC,MAAQ;IACrH,MAAMC,QAAQR,kCAAkCM,OAAOC;IAEvDL,wCAAwCM;IAExC,MAAMC,gBAAgBN,+CAA+CK;IAErE,OAAOP,qCAAqCO,OAAOC;AACrD,GAAG;AAEHL,sBAAsBM,WAAW,GAAG"}

package/lib/components/TreeItemPersonaLayout/TreeItemPersonaLayout.types.js

@@ -1,2 +1 @@
-export {};
-//# sourceMappingURL=TreeItemPersonaLayout.types.js.map
+export { };

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

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["../../../src/components/TreeItemPersonaLayout/TreeItemPersonaLayout.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport type { AvatarContextValue, AvatarSize } from '@fluentui/react-avatar';\n\nexport type TreeItemPersonaLayoutContextValues = {\n  avatar: AvatarContextValue;\n};\n\nexport type TreeItemPersonaLayoutSlots = {\n  root: NonNullable<Slot<'div'>>;\n  /**\n   * Expand icon slot,\n   * by default renders a chevron icon to indicate opening and closing\n   */\n  expandIcon?: Slot<'div'>;\n  /**\n   * Avatar to display.\n   */\n  media: NonNullable<Slot<'div'>>;\n  /**\n   * Main text. Children of the root slot are automatically rendered here\n   */\n  main: NonNullable<Slot<'div'>>;\n  /**\n   * Secondary text that describes or complements the main text\n   */\n  description?: Slot<'div'>;\n  /**\n   * A layout wrapper for the main and description slots\n   */\n  content: NonNullable<Slot<'div'>>;\n};\n\n/**\n * TreeItemPersonaLayout Props\n */\nexport type TreeItemPersonaLayoutProps = ComponentProps<Partial<TreeItemPersonaLayoutSlots>>;\n\n/**\n * State used in rendering TreeItemPersonaLayout\n */\nexport type TreeItemPersonaLayoutState = ComponentState<TreeItemPersonaLayoutSlots> & {\n  avatarSize: AvatarSize;\n};\n"],"mappings":"AAAA"}
+{"version":3,"sources":["TreeItemPersonaLayout.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport type { AvatarContextValue, AvatarSize } from '@fluentui/react-avatar';\n\nexport type TreeItemPersonaLayoutContextValues = {\n  avatar: AvatarContextValue;\n};\n\nexport type TreeItemPersonaLayoutSlots = {\n  root: NonNullable<Slot<'div'>>;\n  /**\n   * Expand icon slot,\n   * by default renders a chevron icon to indicate opening and closing\n   */\n  expandIcon?: Slot<'div'>;\n  /**\n   * Avatar to display.\n   */\n  media: NonNullable<Slot<'div'>>;\n  /**\n   * Main text. Children of the root slot are automatically rendered here\n   */\n  main: NonNullable<Slot<'div'>>;\n  /**\n   * Secondary text that describes or complements the main text\n   */\n  description?: Slot<'div'>;\n  /**\n   * A layout wrapper for the main and description slots\n   */\n  content: NonNullable<Slot<'div'>>;\n};\n\n/**\n * TreeItemPersonaLayout Props\n */\nexport type TreeItemPersonaLayoutProps = ComponentProps<Partial<TreeItemPersonaLayoutSlots>>;\n\n/**\n * State used in rendering TreeItemPersonaLayout\n */\nexport type TreeItemPersonaLayoutState = ComponentState<TreeItemPersonaLayoutSlots> & {\n  avatarSize: AvatarSize;\n};\n"],"names":[],"mappings":"AAAA,WA0CE"}

package/lib/components/TreeItemPersonaLayout/index.js

@@ -3,4 +3,3 @@ export * from './TreeItemPersonaLayout.types';
 export * from './renderTreeItemPersonaLayout';
 export * from './useTreeItemPersonaLayout';
 export * from './useTreeItemPersonaLayoutStyles.styles';
-//# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["../../../src/components/TreeItemPersonaLayout/index.ts"],"sourcesContent":["export * from './TreeItemPersonaLayout';\nexport * from './TreeItemPersonaLayout.types';\nexport * from './renderTreeItemPersonaLayout';\nexport * from './useTreeItemPersonaLayout';\nexport * from './useTreeItemPersonaLayoutStyles.styles';\n"],"mappings":"AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc"}
+{"version":3,"sources":["index.ts"],"sourcesContent":["export * from './TreeItemPersonaLayout';\nexport * from './TreeItemPersonaLayout.types';\nexport * from './renderTreeItemPersonaLayout';\nexport * from './useTreeItemPersonaLayout';\nexport * from './useTreeItemPersonaLayoutStyles.styles';\n"],"names":[],"mappings":"AAAA,cAAc,0BAA0B;AACxC,cAAc,gCAAgC;AAC9C,cAAc,gCAAgC;AAC9C,cAAc,6BAA6B;AAC3C,cAAc,0CAA0C"}

package/lib/components/TreeItemPersonaLayout/renderTreeItemPersonaLayout.js

@@ -1,16 +1,11 @@
-/** @jsxRuntime classic */ /** @jsx createElement */import { createElement } from '@fluentui/react-jsx-runtime';
+/** @jsxRuntime classic */ /** @jsx createElement */ import { createElement } from '@fluentui/react-jsx-runtime';
 import { getSlotsNext } from '@fluentui/react-utilities';
 import { AvatarContextProvider } from '@fluentui/react-avatar';
 /**
  * Render the final JSX of TreeItemPersonaLayout
- */
-export const renderTreeItemPersonaLayout_unstable = (state, contextValues) => {
-  const {
-    slots,
-    slotProps
-  } = getSlotsNext(state);
-  return /*#__PURE__*/createElement(slots.root, slotProps.root, slots.expandIcon && /*#__PURE__*/createElement(slots.expandIcon, slotProps.expandIcon), /*#__PURE__*/createElement(AvatarContextProvider, {
-    value: contextValues.avatar
-  }, /*#__PURE__*/createElement(slots.media, slotProps.media)), /*#__PURE__*/createElement(slots.content, slotProps.content, /*#__PURE__*/createElement(slots.main, slotProps.main), slots.description && /*#__PURE__*/createElement(slots.description, slotProps.description)));
+ */ export const renderTreeItemPersonaLayout_unstable = (state, contextValues)=>{
+    const { slots , slotProps  } = getSlotsNext(state);
+    return /*#__PURE__*/ createElement(slots.root, slotProps.root, slots.expandIcon && /*#__PURE__*/ createElement(slots.expandIcon, slotProps.expandIcon), /*#__PURE__*/ createElement(AvatarContextProvider, {
+        value: contextValues.avatar
+    }, /*#__PURE__*/ createElement(slots.media, slotProps.media)), /*#__PURE__*/ createElement(slots.content, slotProps.content, /*#__PURE__*/ createElement(slots.main, slotProps.main), slots.description && /*#__PURE__*/ createElement(slots.description, slotProps.description)));
 };
-//# sourceMappingURL=renderTreeItemPersonaLayout.js.map

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

@@ -1 +1 @@
-{"version":3,"names":["createElement","getSlotsNext","AvatarContextProvider","renderTreeItemPersonaLayout_unstable","state","contextValues","slots","slotProps","root","expandIcon","value","avatar","media","content","main","description"],"sources":["../../../src/components/TreeItemPersonaLayout/renderTreeItemPersonaLayout.tsx"],"sourcesContent":["/** @jsxRuntime classic */\n/** @jsx createElement */\n\nimport { createElement } from '@fluentui/react-jsx-runtime';\nimport { getSlotsNext } from '@fluentui/react-utilities';\nimport type {\n  TreeItemPersonaLayoutState,\n  TreeItemPersonaLayoutSlots,\n  TreeItemPersonaLayoutContextValues,\n} from './TreeItemPersonaLayout.types';\nimport { AvatarContextProvider } from '@fluentui/react-avatar';\n\n/**\n * Render the final JSX of TreeItemPersonaLayout\n */\nexport const renderTreeItemPersonaLayout_unstable = (\n  state: TreeItemPersonaLayoutState,\n  contextValues: TreeItemPersonaLayoutContextValues,\n) => {\n  const { slots, slotProps } = getSlotsNext<TreeItemPersonaLayoutSlots>(state);\n\n  return (\n    <slots.root {...slotProps.root}>\n      {slots.expandIcon && <slots.expandIcon {...slotProps.expandIcon} />}\n      <AvatarContextProvider value={contextValues.avatar}>\n        <slots.media {...slotProps.media} />\n      </AvatarContextProvider>\n      <slots.content {...slotProps.content}>\n        <slots.main {...slotProps.main} />\n        {slots.description && <slots.description {...slotProps.description} />}\n      </slots.content>\n    </slots.root>\n  );\n};\n"],"mappings":"AAAA,2BACA,yBAEA,SAASA,aAAa,QAAQ;AAC9B,SAASC,YAAY,QAAQ;AAM7B,SAASC,qBAAqB,QAAQ;AAEtC;;;AAGA,OAAO,MAAMC,oCAAA,GAAuCA,CAClDC,KAAA,EACAC,aAAA,KACG;EACH,MAAM;IAAEC,KAAA;IAAOC;EAAS,CAAE,GAAGN,YAAA,CAAyCG,KAAA;EAEtE,oBACEJ,aArBJ,CAqBKM,KAAA,CAAME,IAAI,EAAKD,SAAA,CAAUC,IAAI,EAC3BF,KAAA,CAAMG,UAAU,iBAAIT,aAtB3B,CAsB4BM,KAAA,CAAMG,UAAU,EAAKF,SAAA,CAAUE,UAAU,gBAC/DT,aAvBN,CAuBOE,qBAAA;IAAsBQ,KAAA,EAAOL,aAAA,CAAcM;kBAC1CX,aAxBR,CAwBSM,KAAA,CAAMM,KAAK,EAAKL,SAAA,CAAUK,KAAK,iBAElCZ,aA1BN,CA0BOM,KAAA,CAAMO,OAAO,EAAKN,SAAA,CAAUM,OAAO,eAClCb,aA3BR,CA2BSM,KAAA,CAAMQ,IAAI,EAAKP,SAAA,CAAUO,IAAI,GAC7BR,KAAA,CAAMS,WAAW,iBAAIf,aA5B9B,CA4B+BM,KAAA,CAAMS,WAAW,EAAKR,SAAA,CAAUQ,WAAW;AAI1E"}
+{"version":3,"sources":["renderTreeItemPersonaLayout.tsx"],"sourcesContent":["/** @jsxRuntime classic */\n/** @jsx createElement */\n\nimport { createElement } from '@fluentui/react-jsx-runtime';\nimport { getSlotsNext } from '@fluentui/react-utilities';\nimport type {\n  TreeItemPersonaLayoutState,\n  TreeItemPersonaLayoutSlots,\n  TreeItemPersonaLayoutContextValues,\n} from './TreeItemPersonaLayout.types';\nimport { AvatarContextProvider } from '@fluentui/react-avatar';\n\n/**\n * Render the final JSX of TreeItemPersonaLayout\n */\nexport const renderTreeItemPersonaLayout_unstable = (\n  state: TreeItemPersonaLayoutState,\n  contextValues: TreeItemPersonaLayoutContextValues,\n) => {\n  const { slots, slotProps } = getSlotsNext<TreeItemPersonaLayoutSlots>(state);\n\n  return (\n    <slots.root {...slotProps.root}>\n      {slots.expandIcon && <slots.expandIcon {...slotProps.expandIcon} />}\n      <AvatarContextProvider value={contextValues.avatar}>\n        <slots.media {...slotProps.media} />\n      </AvatarContextProvider>\n      <slots.content {...slotProps.content}>\n        <slots.main {...slotProps.main} />\n        {slots.description && <slots.description {...slotProps.description} />}\n      </slots.content>\n    </slots.root>\n  );\n};\n"],"names":["createElement","getSlotsNext","AvatarContextProvider","renderTreeItemPersonaLayout_unstable","state","contextValues","slots","slotProps","root","expandIcon","value","avatar","media","content","main","description"],"mappings":"AAAA,wBAAwB,GACxB,uBAAuB,GAEvB,SAASA,aAAa,QAAQ,8BAA8B;AAC5D,SAASC,YAAY,QAAQ,4BAA4B;AAMzD,SAASC,qBAAqB,QAAQ,yBAAyB;AAE/D;;CAEC,GACD,OAAO,MAAMC,uCAAuC,CAClDC,OACAC,gBACG;IACH,MAAM,EAAEC,MAAK,EAAEC,UAAS,EAAE,GAAGN,aAAyCG;IAEtE,qBACE,AArBJ,cAqBKE,MAAME,IAAI,EAAKD,UAAUC,IAAI,EAC3BF,MAAMG,UAAU,kBAAI,AAtB3B,cAsB4BH,MAAMG,UAAU,EAAKF,UAAUE,UAAU,iBAC/D,AAvBN,cAuBOP;QAAsBQ,OAAOL,cAAcM,MAAM;qBAChD,AAxBR,cAwBSL,MAAMM,KAAK,EAAKL,UAAUK,KAAK,kBAElC,AA1BN,cA0BON,MAAMO,OAAO,EAAKN,UAAUM,OAAO,gBAClC,AA3BR,cA2BSP,MAAMQ,IAAI,EAAKP,UAAUO,IAAI,GAC7BR,MAAMS,WAAW,kBAAI,AA5B9B,cA4B+BT,MAAMS,WAAW,EAAKR,UAAUQ,WAAW;AAI1E,EAAE"}

package/lib/components/TreeItemPersonaLayout/useTreeItemPersonaLayout.js

@@ -11,45 +11,37 @@ import { useTreeItemLayout_unstable } from '../TreeItemLayout/useTreeItemLayout'
  *
  * @param props - props from this instance of TreeItemPersonaLayout
  * @param ref - reference to root HTMLElement of TreeItemPersonaLayout
- */
-export const useTreeItemPersonaLayout_unstable = (props, ref) => {
-  const {
-    media,
-    content,
-    children,
-    main,
-    description
-  } = props;
-  const treeItemLayoutState = useTreeItemLayout_unstable({
-    ...props,
-    iconBefore: null,
-    iconAfter: null
-  }, ref);
-  const size = useTreeContext_unstable(ctx => ctx.size);
-  return {
-    ...treeItemLayoutState,
-    components: {
-      expandIcon: 'div',
-      content: 'div',
-      main: 'div',
-      description: 'div',
-      root: 'div',
-      media: 'div'
-    },
-    avatarSize: treeAvatarSize[size],
-    main: resolveShorthand(main, {
-      required: true,
-      defaultProps: {
-        children
-      }
-    }),
-    media: resolveShorthand(media, {
-      required: true
-    }),
-    content: resolveShorthand(content, {
-      required: true
-    }),
-    description: resolveShorthand(description)
-  };
+ */ export const useTreeItemPersonaLayout_unstable = (props, ref)=>{
+    const { media , content , children , main , description  } = props;
+    const treeItemLayoutState = useTreeItemLayout_unstable({
+        ...props,
+        iconBefore: null,
+        iconAfter: null
+    }, ref);
+    const size = useTreeContext_unstable((ctx)=>ctx.size);
+    return {
+        ...treeItemLayoutState,
+        components: {
+            expandIcon: 'div',
+            content: 'div',
+            main: 'div',
+            description: 'div',
+            root: 'div',
+            media: 'div'
+        },
+        avatarSize: treeAvatarSize[size],
+        main: resolveShorthand(main, {
+            required: true,
+            defaultProps: {
+                children
+            }
+        }),
+        media: resolveShorthand(media, {
+            required: true
+        }),
+        content: resolveShorthand(content, {
+            required: true
+        }),
+        description: resolveShorthand(description)
+    };
 };
-//# sourceMappingURL=useTreeItemPersonaLayout.js.map

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

@@ -1 +1 @@
-{"version":3,"names":["React","resolveShorthand","useTreeContext_unstable","treeAvatarSize","useTreeItemLayout_unstable","useTreeItemPersonaLayout_unstable","props","ref","media","content","children","main","description","treeItemLayoutState","iconBefore","iconAfter","size","ctx","components","expandIcon","root","avatarSize","required","defaultProps"],"sources":["../../../src/components/TreeItemPersonaLayout/useTreeItemPersonaLayout.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { TreeItemPersonaLayoutProps, TreeItemPersonaLayoutState } from './TreeItemPersonaLayout.types';\nimport { resolveShorthand } from '@fluentui/react-utilities';\nimport { useTreeContext_unstable } from '../../contexts';\nimport { treeAvatarSize } from '../../utils/tokens';\nimport { useTreeItemLayout_unstable } from '../TreeItemLayout/useTreeItemLayout';\n\n/**\n * Create the state required to render TreeItemPersonaLayout.\n *\n * The returned state can be modified with hooks such as useTreeItemPersonaLayoutStyles_unstable,\n * before being passed to renderTreeItemPersonaLayout_unstable.\n *\n * @param props - props from this instance of TreeItemPersonaLayout\n * @param ref - reference to root HTMLElement of TreeItemPersonaLayout\n */\nexport const useTreeItemPersonaLayout_unstable = (\n  props: TreeItemPersonaLayoutProps,\n  ref: React.Ref<HTMLSpanElement>,\n): TreeItemPersonaLayoutState => {\n  const { media, content, children, main, description } = props;\n\n  const treeItemLayoutState = useTreeItemLayout_unstable(\n    {\n      ...props,\n      iconBefore: null,\n      iconAfter: null,\n    },\n    ref,\n  );\n\n  const size = useTreeContext_unstable(ctx => ctx.size);\n  return {\n    ...treeItemLayoutState,\n    components: {\n      expandIcon: 'div',\n      content: 'div',\n      main: 'div',\n      description: 'div',\n      root: 'div',\n      media: 'div',\n    },\n    avatarSize: treeAvatarSize[size],\n    main: resolveShorthand(main, { required: true, defaultProps: { children } }),\n    media: resolveShorthand(media, { required: true }),\n    content: resolveShorthand(content, { required: true }),\n    description: resolveShorthand(description),\n  };\n};\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AAEvB,SAASC,gBAAgB,QAAQ;AACjC,SAASC,uBAAuB,QAAQ;AACxC,SAASC,cAAc,QAAQ;AAC/B,SAASC,0BAA0B,QAAQ;AAE3C;;;;;;;;;AASA,OAAO,MAAMC,iCAAA,GAAoCA,CAC/CC,KAAA,EACAC,GAAA,KAC+B;EAC/B,MAAM;IAAEC,KAAA;IAAOC,OAAA;IAASC,QAAA;IAAUC,IAAA;IAAMC;EAAW,CAAE,GAAGN,KAAA;EAExD,MAAMO,mBAAA,GAAsBT,0BAAA,CAC1B;IACE,GAAGE,KAAK;IACRQ,UAAA,EAAY,IAAI;IAChBC,SAAA,EAAW;EACb,GACAR,GAAA;EAGF,MAAMS,IAAA,GAAOd,uBAAA,CAAwBe,GAAA,IAAOA,GAAA,CAAID,IAAI;EACpD,OAAO;IACL,GAAGH,mBAAmB;IACtBK,UAAA,EAAY;MACVC,UAAA,EAAY;MACZV,OAAA,EAAS;MACTE,IAAA,EAAM;MACNC,WAAA,EAAa;MACbQ,IAAA,EAAM;MACNZ,KAAA,EAAO;IACT;IACAa,UAAA,EAAYlB,cAAc,CAACa,IAAA,CAAK;IAChCL,IAAA,EAAMV,gBAAA,CAAiBU,IAAA,EAAM;MAAEW,QAAA,EAAU,IAAI;MAAEC,YAAA,EAAc;QAAEb;MAAS;IAAE;IAC1EF,KAAA,EAAOP,gBAAA,CAAiBO,KAAA,EAAO;MAAEc,QAAA,EAAU;IAAK;IAChDb,OAAA,EAASR,gBAAA,CAAiBQ,OAAA,EAAS;MAAEa,QAAA,EAAU;IAAK;IACpDV,WAAA,EAAaX,gBAAA,CAAiBW,WAAA;EAChC;AACF"}
+{"version":3,"sources":["useTreeItemPersonaLayout.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { TreeItemPersonaLayoutProps, TreeItemPersonaLayoutState } from './TreeItemPersonaLayout.types';\nimport { resolveShorthand } from '@fluentui/react-utilities';\nimport { useTreeContext_unstable } from '../../contexts';\nimport { treeAvatarSize } from '../../utils/tokens';\nimport { useTreeItemLayout_unstable } from '../TreeItemLayout/useTreeItemLayout';\n\n/**\n * Create the state required to render TreeItemPersonaLayout.\n *\n * The returned state can be modified with hooks such as useTreeItemPersonaLayoutStyles_unstable,\n * before being passed to renderTreeItemPersonaLayout_unstable.\n *\n * @param props - props from this instance of TreeItemPersonaLayout\n * @param ref - reference to root HTMLElement of TreeItemPersonaLayout\n */\nexport const useTreeItemPersonaLayout_unstable = (\n  props: TreeItemPersonaLayoutProps,\n  ref: React.Ref<HTMLSpanElement>,\n): TreeItemPersonaLayoutState => {\n  const { media, content, children, main, description } = props;\n\n  const treeItemLayoutState = useTreeItemLayout_unstable(\n    {\n      ...props,\n      iconBefore: null,\n      iconAfter: null,\n    },\n    ref,\n  );\n\n  const size = useTreeContext_unstable(ctx => ctx.size);\n  return {\n    ...treeItemLayoutState,\n    components: {\n      expandIcon: 'div',\n      content: 'div',\n      main: 'div',\n      description: 'div',\n      root: 'div',\n      media: 'div',\n    },\n    avatarSize: treeAvatarSize[size],\n    main: resolveShorthand(main, { required: true, defaultProps: { children } }),\n    media: resolveShorthand(media, { required: true }),\n    content: resolveShorthand(content, { required: true }),\n    description: resolveShorthand(description),\n  };\n};\n"],"names":["React","resolveShorthand","useTreeContext_unstable","treeAvatarSize","useTreeItemLayout_unstable","useTreeItemPersonaLayout_unstable","props","ref","media","content","children","main","description","treeItemLayoutState","iconBefore","iconAfter","size","ctx","components","expandIcon","root","avatarSize","required","defaultProps"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,gBAAgB,QAAQ,4BAA4B;AAC7D,SAASC,uBAAuB,QAAQ,iBAAiB;AACzD,SAASC,cAAc,QAAQ,qBAAqB;AACpD,SAASC,0BAA0B,QAAQ,sCAAsC;AAEjF;;;;;;;;CAQC,GACD,OAAO,MAAMC,oCAAoC,CAC/CC,OACAC,MAC+B;IAC/B,MAAM,EAAEC,MAAK,EAAEC,QAAO,EAAEC,SAAQ,EAAEC,KAAI,EAAEC,YAAW,EAAE,GAAGN;IAExD,MAAMO,sBAAsBT,2BAC1B;QACE,GAAGE,KAAK;QACRQ,YAAY,IAAI;QAChBC,WAAW,IAAI;IACjB,GACAR;IAGF,MAAMS,OAAOd,wBAAwBe,CAAAA,MAAOA,IAAID,IAAI;IACpD,OAAO;QACL,GAAGH,mBAAmB;QACtBK,YAAY;YACVC,YAAY;YACZV,SAAS;YACTE,MAAM;YACNC,aAAa;YACbQ,MAAM;YACNZ,OAAO;QACT;QACAa,YAAYlB,cAAc,CAACa,KAAK;QAChCL,MAAMV,iBAAiBU,MAAM;YAAEW,UAAU,IAAI;YAAEC,cAAc;gBAAEb;YAAS;QAAE;QAC1EF,OAAOP,iBAAiBO,OAAO;YAAEc,UAAU,IAAI;QAAC;QAChDb,SAASR,iBAAiBQ,SAAS;YAAEa,UAAU,IAAI;QAAC;QACpDV,aAAaX,iBAAiBW;IAChC;AACF,EAAE"}

package/lib/components/TreeItemPersonaLayout/useTreeItemPersonaLayoutContextValues.js

@@ -1,13 +1,12 @@
 import * as React from 'react';
 export function useTreeItemPersonaLayoutContextValues_unstable(state) {
-  const {
-    avatarSize
-  } = state;
-  const avatar = React.useMemo(() => ({
-    size: avatarSize
-  }), [avatarSize]);
-  return {
-    avatar
-  };
+    const { avatarSize  } = state;
+    const avatar = React.useMemo(()=>({
+            size: avatarSize
+        }), [
+        avatarSize
+    ]);
+    return {
+        avatar
+    };
 }
-//# sourceMappingURL=useTreeItemPersonaLayoutContextValues.js.map

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

@@ -1 +1 @@
-{"version":3,"names":["React","useTreeItemPersonaLayoutContextValues_unstable","state","avatarSize","avatar","useMemo","size"],"sources":["../../../src/components/TreeItemPersonaLayout/useTreeItemPersonaLayoutContextValues.ts"],"sourcesContent":["import type { AvatarContextValue } from '@fluentui/react-avatar';\nimport * as React from 'react';\nimport type { TreeItemPersonaLayoutState, TreeItemPersonaLayoutContextValues } from './TreeItemPersonaLayout.types';\n\nexport function useTreeItemPersonaLayoutContextValues_unstable(\n  state: TreeItemPersonaLayoutState,\n): TreeItemPersonaLayoutContextValues {\n  const { avatarSize } = state;\n\n  const avatar = React.useMemo<AvatarContextValue>(() => ({ size: avatarSize }), [avatarSize]);\n\n  return { avatar };\n}\n"],"mappings":"AACA,YAAYA,KAAA,MAAW;AAGvB,OAAO,SAASC,+CACdC,KAAiC,EACG;EACpC,MAAM;IAAEC;EAAU,CAAE,GAAGD,KAAA;EAEvB,MAAME,MAAA,GAASJ,KAAA,CAAMK,OAAO,CAAqB,OAAO;IAAEC,IAAA,EAAMH;EAAW,IAAI,CAACA,UAAA,CAAW;EAE3F,OAAO;IAAEC;EAAO;AAClB"}
+{"version":3,"sources":["useTreeItemPersonaLayoutContextValues.ts"],"sourcesContent":["import type { AvatarContextValue } from '@fluentui/react-avatar';\nimport * as React from 'react';\nimport type { TreeItemPersonaLayoutState, TreeItemPersonaLayoutContextValues } from './TreeItemPersonaLayout.types';\n\nexport function useTreeItemPersonaLayoutContextValues_unstable(\n  state: TreeItemPersonaLayoutState,\n): TreeItemPersonaLayoutContextValues {\n  const { avatarSize } = state;\n\n  const avatar = React.useMemo<AvatarContextValue>(() => ({ size: avatarSize }), [avatarSize]);\n\n  return { avatar };\n}\n"],"names":["React","useTreeItemPersonaLayoutContextValues_unstable","state","avatarSize","avatar","useMemo","size"],"mappings":"AACA,YAAYA,WAAW,QAAQ;AAG/B,OAAO,SAASC,+CACdC,KAAiC,EACG;IACpC,MAAM,EAAEC,WAAU,EAAE,GAAGD;IAEvB,MAAME,SAASJ,MAAMK,OAAO,CAAqB,IAAO,CAAA;YAAEC,MAAMH;QAAW,CAAA,GAAI;QAACA;KAAW;IAE3F,OAAO;QAAEC;IAAO;AAClB,CAAC"}