@fluentui/react-tree 9.0.0-beta.16 → 9.0.0-beta.18

package/lib/components/TreeItem/useTreeItem.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","getNativeElementProps","useId","useMergedRefs","useEventCallback","elementContains","useTreeContext_unstable","treeDataTypes","useTreeItem_unstable","props","ref","contextLevel","ctx","level","id","onClick","onKeyDown","as","value","itemType","rest","requestTreeResponse","isActionsVisible","setActionsVisible","useState","isAsideVisible","setAsideVisible","handleActionsRef","actions","open","openItems","has","actionsRef","useRef","expandIconRef","layoutRef","subtreeRef","handleClick","event","isDefaultPrevented","isEventFromActions","current","target","isEventFromSubtree","isFromExpandIcon","type","ExpandIconClick","Click","handleKeyDown","currentTarget","key","End","Home","Enter","ArrowUp","ArrowDown","ArrowLeft","ArrowRight","isTypeAheadCharacter","length","match","altKey","ctrlKey","metaKey","TypeAhead","handleActionsVisible","isTargetFromSubtree","Boolean","handleActionsInvisible","isRelatedTargetFromActions","relatedTarget","components","root","tabIndex","undefined","role","onMouseOver","onFocus","onMouseOut","onBlur"],"sources":["../../../src/components/TreeItem/useTreeItem.ts"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, useId, useMergedRefs } from '@fluentui/react-utilities';\nimport { useEventCallback } from '@fluentui/react-utilities';\nimport { elementContains } from '@fluentui/react-portal';\nimport type { TreeItemProps, TreeItemState } from './TreeItem.types';\nimport { useTreeContext_unstable } from '../../contexts/index';\nimport { treeDataTypes } from '../../utils/tokens';\n\n/**\n * Create the state required to render TreeItem.\n *\n * The returned state can be modified with hooks such as useTreeItemStyles_unstable,\n * before being passed to renderTreeItem_unstable.\n *\n * @param props - props from this instance of TreeItem\n * @param ref - reference to root HTMLElement of TreeItem\n */\nexport function useTreeItem_unstable<Value = string>(\n  props: TreeItemProps<Value>,\n  ref: React.Ref<HTMLDivElement>,\n): TreeItemState {\n  const contextLevel = useTreeContext_unstable(ctx => ctx.level);\n\n  const id = useId('fui-TreeItem-', props.id);\n\n  const {\n    onClick,\n    onKeyDown,\n    as = 'div',\n    value = id,\n    itemType = 'leaf',\n    'aria-level': level = contextLevel,\n    ...rest\n  } = props;\n\n  const requestTreeResponse = useTreeContext_unstable(ctx => ctx.requestTreeResponse);\n\n  const [isActionsVisible, setActionsVisible] = React.useState(false);\n  const [isAsideVisible, setAsideVisible] = React.useState(true);\n\n  const handleActionsRef = (actions: HTMLDivElement | null) => {\n    setAsideVisible(actions === null);\n  };\n\n  const open = useTreeContext_unstable(ctx => ctx.openItems.has(value));\n\n  const actionsRef = React.useRef<HTMLDivElement>(null);\n  const expandIconRef = React.useRef<HTMLDivElement>(null);\n  const layoutRef = React.useRef<HTMLDivElement>(null);\n  const subtreeRef = React.useRef<HTMLDivElement>(null);\n\n  const handleClick = useEventCallback((event: React.MouseEvent<HTMLDivElement>) => {\n    onClick?.(event);\n    if (event.isDefaultPrevented()) {\n      return;\n    }\n    const isEventFromActions = actionsRef.current && elementContains(actionsRef.current, event.target as Node);\n    if (isEventFromActions) {\n      return;\n    }\n    const isEventFromSubtree = subtreeRef.current && elementContains(subtreeRef.current, event.target as Node);\n    if (isEventFromSubtree) {\n      return;\n    }\n    const isFromExpandIcon = expandIconRef.current && elementContains(expandIconRef.current, event.target as Node);\n    requestTreeResponse({\n      event,\n      itemType,\n      value,\n      type: isFromExpandIcon ? treeDataTypes.ExpandIconClick : treeDataTypes.Click,\n    });\n  });\n\n  const handleKeyDown = useEventCallback((event: React.KeyboardEvent<HTMLDivElement>) => {\n    onKeyDown?.(event);\n    if (event.isDefaultPrevented()) {\n      return;\n    }\n    if (event.currentTarget !== event.target) {\n      return;\n    }\n    switch (event.key) {\n      case treeDataTypes.End:\n      case treeDataTypes.Home:\n      case treeDataTypes.Enter:\n      case treeDataTypes.ArrowUp:\n      case treeDataTypes.ArrowDown:\n      case treeDataTypes.ArrowLeft:\n      case treeDataTypes.ArrowRight:\n        return requestTreeResponse({ event, itemType, value, type: event.key });\n    }\n    const isTypeAheadCharacter =\n      event.key.length === 1 && event.key.match(/\\w/) && !event.altKey && !event.ctrlKey && !event.metaKey;\n    if (isTypeAheadCharacter) {\n      requestTreeResponse({ event, itemType, value, type: treeDataTypes.TypeAhead });\n    }\n  });\n\n  const handleActionsVisible = useEventCallback((event: React.FocusEvent | React.MouseEvent) => {\n    const isTargetFromSubtree = Boolean(\n      subtreeRef.current && elementContains(subtreeRef.current, event.target as Node),\n    );\n    if (!isTargetFromSubtree) {\n      setActionsVisible(true);\n    }\n  });\n\n  const handleActionsInvisible = useEventCallback((event: React.FocusEvent | React.MouseEvent) => {\n    const isTargetFromSubtree = Boolean(\n      subtreeRef.current && elementContains(subtreeRef.current, event.target as Node),\n    );\n    const isRelatedTargetFromActions = Boolean(\n      actionsRef.current && elementContains(actionsRef.current, event.relatedTarget as Node),\n    );\n    if (isRelatedTargetFromActions) {\n      return setActionsVisible(true);\n    }\n    if (!isTargetFromSubtree) {\n      return setActionsVisible(false);\n    }\n  });\n\n  return {\n    value,\n    open,\n    subtreeRef,\n    actionsRef: useMergedRefs(actionsRef, handleActionsRef),\n    expandIconRef,\n    layoutRef,\n    itemType,\n    isActionsVisible,\n    isAsideVisible,\n    level,\n    components: {\n      root: 'div',\n    },\n    root: getNativeElementProps(as, {\n      tabIndex: -1,\n      ...rest,\n      id,\n      ref,\n      'aria-level': level,\n      'aria-expanded': itemType === 'branch' ? open : undefined,\n      role: 'treeitem',\n      onClick: handleClick,\n      onKeyDown: handleKeyDown,\n      onMouseOver: handleActionsVisible,\n      onFocus: handleActionsVisible,\n      onMouseOut: handleActionsInvisible,\n      onBlur: handleActionsInvisible,\n    }),\n  };\n}\n"],"mappings":"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"}
+{"version":3,"sources":["useTreeItem.ts"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, useId, useMergedRefs } from '@fluentui/react-utilities';\nimport { useEventCallback } from '@fluentui/react-utilities';\nimport { elementContains } from '@fluentui/react-portal';\nimport type { TreeItemProps, TreeItemState } from './TreeItem.types';\nimport { useTreeContext_unstable } from '../../contexts/index';\nimport { treeDataTypes } from '../../utils/tokens';\n\n/**\n * Create the state required to render TreeItem.\n *\n * The returned state can be modified with hooks such as useTreeItemStyles_unstable,\n * before being passed to renderTreeItem_unstable.\n *\n * @param props - props from this instance of TreeItem\n * @param ref - reference to root HTMLElement of TreeItem\n */\nexport function useTreeItem_unstable<Value = string>(\n  props: TreeItemProps<Value>,\n  ref: React.Ref<HTMLDivElement>,\n): TreeItemState {\n  const contextLevel = useTreeContext_unstable(ctx => ctx.level);\n\n  const id = useId('fui-TreeItem-', props.id);\n\n  const {\n    onClick,\n    onKeyDown,\n    as = 'div',\n    value = id,\n    itemType = 'leaf',\n    'aria-level': level = contextLevel,\n    ...rest\n  } = props;\n\n  const requestTreeResponse = useTreeContext_unstable(ctx => ctx.requestTreeResponse);\n\n  const [isActionsVisible, setActionsVisible] = React.useState(false);\n  const [isAsideVisible, setAsideVisible] = React.useState(true);\n\n  const handleActionsRef = (actions: HTMLDivElement | null) => {\n    setAsideVisible(actions === null);\n  };\n\n  const open = useTreeContext_unstable(ctx => ctx.openItems.has(value));\n\n  const actionsRef = React.useRef<HTMLDivElement>(null);\n  const expandIconRef = React.useRef<HTMLDivElement>(null);\n  const layoutRef = React.useRef<HTMLDivElement>(null);\n  const subtreeRef = React.useRef<HTMLDivElement>(null);\n\n  const handleClick = useEventCallback((event: React.MouseEvent<HTMLDivElement>) => {\n    onClick?.(event);\n    if (event.isDefaultPrevented()) {\n      return;\n    }\n    const isEventFromActions = actionsRef.current && elementContains(actionsRef.current, event.target as Node);\n    if (isEventFromActions) {\n      return;\n    }\n    const isEventFromSubtree = subtreeRef.current && elementContains(subtreeRef.current, event.target as Node);\n    if (isEventFromSubtree) {\n      return;\n    }\n    const isFromExpandIcon = expandIconRef.current && elementContains(expandIconRef.current, event.target as Node);\n    requestTreeResponse({\n      event,\n      itemType,\n      value,\n      type: isFromExpandIcon ? treeDataTypes.ExpandIconClick : treeDataTypes.Click,\n    });\n  });\n\n  const handleKeyDown = useEventCallback((event: React.KeyboardEvent<HTMLDivElement>) => {\n    onKeyDown?.(event);\n    if (event.isDefaultPrevented()) {\n      return;\n    }\n    if (event.currentTarget !== event.target) {\n      return;\n    }\n    switch (event.key) {\n      case treeDataTypes.End:\n      case treeDataTypes.Home:\n      case treeDataTypes.Enter:\n      case treeDataTypes.ArrowUp:\n      case treeDataTypes.ArrowDown:\n      case treeDataTypes.ArrowLeft:\n      case treeDataTypes.ArrowRight:\n        return requestTreeResponse({ event, itemType, value, type: event.key });\n    }\n    const isTypeAheadCharacter =\n      event.key.length === 1 && event.key.match(/\\w/) && !event.altKey && !event.ctrlKey && !event.metaKey;\n    if (isTypeAheadCharacter) {\n      requestTreeResponse({ event, itemType, value, type: treeDataTypes.TypeAhead });\n    }\n  });\n\n  const handleActionsVisible = useEventCallback((event: React.FocusEvent | React.MouseEvent) => {\n    const isTargetFromSubtree = Boolean(\n      subtreeRef.current && elementContains(subtreeRef.current, event.target as Node),\n    );\n    if (!isTargetFromSubtree) {\n      setActionsVisible(true);\n    }\n  });\n\n  const handleActionsInvisible = useEventCallback((event: React.FocusEvent | React.MouseEvent) => {\n    const isTargetFromSubtree = Boolean(\n      subtreeRef.current && elementContains(subtreeRef.current, event.target as Node),\n    );\n    const isRelatedTargetFromActions = Boolean(\n      actionsRef.current && elementContains(actionsRef.current, event.relatedTarget as Node),\n    );\n    if (isRelatedTargetFromActions) {\n      return setActionsVisible(true);\n    }\n    if (!isTargetFromSubtree) {\n      return setActionsVisible(false);\n    }\n  });\n\n  return {\n    value,\n    open,\n    subtreeRef,\n    actionsRef: useMergedRefs(actionsRef, handleActionsRef),\n    expandIconRef,\n    layoutRef,\n    itemType,\n    isActionsVisible,\n    isAsideVisible,\n    level,\n    components: {\n      root: 'div',\n    },\n    root: getNativeElementProps(as, {\n      tabIndex: -1,\n      ...rest,\n      id,\n      ref,\n      'aria-level': level,\n      'aria-expanded': itemType === 'branch' ? open : undefined,\n      role: 'treeitem',\n      onClick: handleClick,\n      onKeyDown: handleKeyDown,\n      onMouseOver: handleActionsVisible,\n      onFocus: handleActionsVisible,\n      onMouseOut: handleActionsInvisible,\n      onBlur: handleActionsInvisible,\n    }),\n  };\n}\n"],"names":["React","getNativeElementProps","useId","useMergedRefs","useEventCallback","elementContains","useTreeContext_unstable","treeDataTypes","useTreeItem_unstable","props","ref","contextLevel","ctx","level","id","onClick","onKeyDown","as","value","itemType","rest","requestTreeResponse","isActionsVisible","setActionsVisible","useState","isAsideVisible","setAsideVisible","handleActionsRef","actions","open","openItems","has","actionsRef","useRef","expandIconRef","layoutRef","subtreeRef","handleClick","event","isDefaultPrevented","isEventFromActions","current","target","isEventFromSubtree","isFromExpandIcon","type","ExpandIconClick","Click","handleKeyDown","currentTarget","key","End","Home","Enter","ArrowUp","ArrowDown","ArrowLeft","ArrowRight","isTypeAheadCharacter","length","match","altKey","ctrlKey","metaKey","TypeAhead","handleActionsVisible","isTargetFromSubtree","Boolean","handleActionsInvisible","isRelatedTargetFromActions","relatedTarget","components","root","tabIndex","undefined","role","onMouseOver","onFocus","onMouseOut","onBlur"],"mappings":"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"}

package/lib/components/TreeItem/useTreeItemContextValues.js

@@ -1,32 +1,20 @@
 export function useTreeItemContextValues_unstable(state) {
-  const {
-    value,
-    isActionsVisible,
-    isAsideVisible,
-    actionsRef,
-    itemType,
-    layoutRef,
-    subtreeRef,
-    expandIconRef,
-    open
-  } = state;
-  /**
-  * This context is created with "@fluentui/react-context-selector",
-  * there is no sense to memoize it
-  */
-  const treeItem = {
-    isActionsVisible,
-    isAsideVisible,
-    value,
-    actionsRef,
-    itemType,
-    layoutRef,
-    subtreeRef,
-    expandIconRef,
-    open
-  };
-  return {
-    treeItem
-  };
+    const { value , isActionsVisible , isAsideVisible , actionsRef , itemType , layoutRef , subtreeRef , expandIconRef , open  } = state;
+    /**
+   * This context is created with "@fluentui/react-context-selector",
+   * there is no sense to memoize it
+   */ const treeItem = {
+        isActionsVisible,
+        isAsideVisible,
+        value,
+        actionsRef,
+        itemType,
+        layoutRef,
+        subtreeRef,
+        expandIconRef,
+        open
+    };
+    return {
+        treeItem
+    };
 }
-//# sourceMappingURL=useTreeItemContextValues.js.map

package/lib/components/TreeItem/useTreeItemContextValues.js.map

@@ -1 +1 @@
-{"version":3,"names":["useTreeItemContextValues_unstable","state","value","isActionsVisible","isAsideVisible","actionsRef","itemType","layoutRef","subtreeRef","expandIconRef","open","treeItem"],"sources":["../../../src/components/TreeItem/useTreeItemContextValues.ts"],"sourcesContent":["import type { TreeItemContextValue } from '../../contexts';\nimport type { TreeItemContextValues, TreeItemState } from './TreeItem.types';\n\nexport function useTreeItemContextValues_unstable(\n  state: Pick<TreeItemState, keyof TreeItemContextValue>,\n): TreeItemContextValues {\n  const { value, isActionsVisible, isAsideVisible, actionsRef, itemType, layoutRef, subtreeRef, expandIconRef, open } =\n    state;\n\n  /**\n   * This context is created with \"@fluentui/react-context-selector\",\n   * there is no sense to memoize it\n   */\n  const treeItem: TreeItemContextValue = {\n    isActionsVisible,\n    isAsideVisible,\n    value,\n    actionsRef,\n    itemType,\n    layoutRef,\n    subtreeRef,\n    expandIconRef,\n    open,\n  };\n\n  return { treeItem };\n}\n"],"mappings":"AAGA,OAAO,SAASA,kCACdC,KAAsD,EAC/B;EACvB,MAAM;IAAEC,KAAA;IAAOC,gBAAA;IAAkBC,cAAA;IAAgBC,UAAA;IAAYC,QAAA;IAAUC,SAAA;IAAWC,UAAA;IAAYC,aAAA;IAAeC;EAAI,CAAE,GACjHT,KAAA;EAEF;;;;EAIA,MAAMU,QAAA,GAAiC;IACrCR,gBAAA;IACAC,cAAA;IACAF,KAAA;IACAG,UAAA;IACAC,QAAA;IACAC,SAAA;IACAC,UAAA;IACAC,aAAA;IACAC;EACF;EAEA,OAAO;IAAEC;EAAS;AACpB"}
+{"version":3,"sources":["useTreeItemContextValues.ts"],"sourcesContent":["import type { TreeItemContextValue } from '../../contexts';\nimport type { TreeItemContextValues, TreeItemState } from './TreeItem.types';\n\nexport function useTreeItemContextValues_unstable(\n  state: Pick<TreeItemState, keyof TreeItemContextValue>,\n): TreeItemContextValues {\n  const { value, isActionsVisible, isAsideVisible, actionsRef, itemType, layoutRef, subtreeRef, expandIconRef, open } =\n    state;\n\n  /**\n   * This context is created with \"@fluentui/react-context-selector\",\n   * there is no sense to memoize it\n   */\n  const treeItem: TreeItemContextValue = {\n    isActionsVisible,\n    isAsideVisible,\n    value,\n    actionsRef,\n    itemType,\n    layoutRef,\n    subtreeRef,\n    expandIconRef,\n    open,\n  };\n\n  return { treeItem };\n}\n"],"names":["useTreeItemContextValues_unstable","state","value","isActionsVisible","isAsideVisible","actionsRef","itemType","layoutRef","subtreeRef","expandIconRef","open","treeItem"],"mappings":"AAGA,OAAO,SAASA,kCACdC,KAAsD,EAC/B;IACvB,MAAM,EAAEC,MAAK,EAAEC,iBAAgB,EAAEC,eAAc,EAAEC,WAAU,EAAEC,SAAQ,EAAEC,UAAS,EAAEC,WAAU,EAAEC,cAAa,EAAEC,KAAI,EAAE,GACjHT;IAEF;;;GAGC,GACD,MAAMU,WAAiC;QACrCR;QACAC;QACAF;QACAG;QACAC;QACAC;QACAC;QACAC;QACAC;IACF;IAEA,OAAO;QAAEC;IAAS;AACpB,CAAC"}

package/lib/components/TreeItem/useTreeItemStyles.styles.js

@@ -75,13 +75,13 @@ const useRootStyles = /*#__PURE__*/__styles({
     i03rao: ["fd0oaoj", "f1cwg4i8"],
     Boxcth7: "fjvm52t",
     Bsom6fd: ["f1cwg4i8", "fd0oaoj"],
-    J0r882: "fdiulkx",
-    Bjwuhne: "f1yalx80",
-    Ghsupd: ["fq22d5a", "f1jw7pan"],
-    Bule8hv: ["f1jw7pan", "fq22d5a"]
+    J0r882: "f57olzd",
+    Bule8hv: ["f4stah7", "fs1por5"],
+    Bjwuhne: "f480a47",
+    Ghsupd: ["fs1por5", "f4stah7"]
   }
 }, {
-  d: [".f10bgyvd{--fluent-TreeItem--level:1;}", ".f1h0rod3{--fluent-TreeItem--level:2;}", ".fgoqafk{--fluent-TreeItem--level:3;}", ".f75dvuh{--fluent-TreeItem--level:4;}", ".fqk7yw6{--fluent-TreeItem--level:5;}", ".f1r3z17b{--fluent-TreeItem--level:6;}", ".f1hrpd1h{--fluent-TreeItem--level:7;}", ".f1iy65d0{--fluent-TreeItem--level:8;}", ".ftg42e5{--fluent-TreeItem--level:9;}", ".fyat3t{--fluent-TreeItem--level:10;}", ".f10pi13n{position:relative;}", ".f1k6fduh{cursor:pointer;}", ".f13qh94s{display:grid;}", ".f1ewtqcl{box-sizing:border-box;}", ".ffh4ag3{grid-template-rows:auto auto;}", ".f1y1g942{grid-template-columns:minmax(0, 100%) minmax(0px, min-content);}", ".faz22wj{grid-template-areas:\"layout  aside\" \"subtree subtree\";}", ".fhovq9v{background-color:var(--colorSubtleBackground);}", ".fkfq4zb{color:var(--colorNeutralForeground2);}", ".flk2ux3{padding-right:var(--spacingHorizontalNone);}", ".fkl3uby{padding-left:var(--spacingHorizontalNone);}", ".f8hki3x[data-fui-focus-visible]{border-top-color:transparent;}", ".f1d2448m[data-fui-focus-visible]{border-right-color:transparent;}", ".ffh67wi[data-fui-focus-visible]{border-left-color:transparent;}", ".f1bjia2o[data-fui-focus-visible]{border-bottom-color:transparent;}", ".f15bsgw9[data-fui-focus-visible]::after{content:\"\";}", ".f14e48fq[data-fui-focus-visible]::after{position:absolute;}", ".f18yb2kv[data-fui-focus-visible]::after{pointer-events:none;}", ".fd6o370[data-fui-focus-visible]::after{z-index:1;}", ".fh1cnn4[data-fui-focus-visible]::after{border-top-style:solid;}", ".fy7oxxb[data-fui-focus-visible]::after{border-right-style:solid;}", ".f184ne2d[data-fui-focus-visible]::after{border-left-style:solid;}", ".fpukqih[data-fui-focus-visible]::after{border-bottom-style:solid;}", ".frrh606[data-fui-focus-visible]::after{border-top-width:2px;}", ".f1v5zibi[data-fui-focus-visible]::after{border-right-width:2px;}", ".fo2hd23[data-fui-focus-visible]::after{border-left-width:2px;}", ".ful5kiu[data-fui-focus-visible]::after{border-bottom-width:2px;}", ".f1jqcqds[data-fui-focus-visible]::after{border-bottom-right-radius:var(--borderRadiusMedium);}", ".ftffrms[data-fui-focus-visible]::after{border-bottom-left-radius:var(--borderRadiusMedium);}", ".f2e7qr6[data-fui-focus-visible]::after{border-top-right-radius:var(--borderRadiusMedium);}", ".fsr1zz6[data-fui-focus-visible]::after{border-top-left-radius:var(--borderRadiusMedium);}", ".f1dvezut[data-fui-focus-visible]::after{border-top-color:var(--colorStrokeFocus2);}", ".fd0oaoj[data-fui-focus-visible]::after{border-right-color:var(--colorStrokeFocus2);}", ".f1cwg4i8[data-fui-focus-visible]::after{border-left-color:var(--colorStrokeFocus2);}", ".fjvm52t[data-fui-focus-visible]::after{border-bottom-color:var(--colorStrokeFocus2);}", ".fdiulkx[data-fui-focus-visible]::after{top:-2px;}", ".f1yalx80[data-fui-focus-visible]::after{bottom:-2px;}", ".fq22d5a[data-fui-focus-visible]::after{left:-2px;}", ".f1jw7pan[data-fui-focus-visible]::after{right:-2px;}"],
+  d: [".f10bgyvd{--fluent-TreeItem--level:1;}", ".f1h0rod3{--fluent-TreeItem--level:2;}", ".fgoqafk{--fluent-TreeItem--level:3;}", ".f75dvuh{--fluent-TreeItem--level:4;}", ".fqk7yw6{--fluent-TreeItem--level:5;}", ".f1r3z17b{--fluent-TreeItem--level:6;}", ".f1hrpd1h{--fluent-TreeItem--level:7;}", ".f1iy65d0{--fluent-TreeItem--level:8;}", ".ftg42e5{--fluent-TreeItem--level:9;}", ".fyat3t{--fluent-TreeItem--level:10;}", ".f10pi13n{position:relative;}", ".f1k6fduh{cursor:pointer;}", ".f13qh94s{display:grid;}", ".f1ewtqcl{box-sizing:border-box;}", ".ffh4ag3{grid-template-rows:auto auto;}", ".f1y1g942{grid-template-columns:minmax(0, 100%) minmax(0px, min-content);}", ".faz22wj{grid-template-areas:\"layout  aside\" \"subtree subtree\";}", ".fhovq9v{background-color:var(--colorSubtleBackground);}", ".fkfq4zb{color:var(--colorNeutralForeground2);}", ".flk2ux3{padding-right:var(--spacingHorizontalNone);}", ".fkl3uby{padding-left:var(--spacingHorizontalNone);}", ".f8hki3x[data-fui-focus-visible]{border-top-color:transparent;}", ".f1d2448m[data-fui-focus-visible]{border-right-color:transparent;}", ".ffh67wi[data-fui-focus-visible]{border-left-color:transparent;}", ".f1bjia2o[data-fui-focus-visible]{border-bottom-color:transparent;}", ".f15bsgw9[data-fui-focus-visible]::after{content:\"\";}", ".f14e48fq[data-fui-focus-visible]::after{position:absolute;}", ".f18yb2kv[data-fui-focus-visible]::after{pointer-events:none;}", ".fd6o370[data-fui-focus-visible]::after{z-index:1;}", ".fh1cnn4[data-fui-focus-visible]::after{border-top-style:solid;}", ".fy7oxxb[data-fui-focus-visible]::after{border-right-style:solid;}", ".f184ne2d[data-fui-focus-visible]::after{border-left-style:solid;}", ".fpukqih[data-fui-focus-visible]::after{border-bottom-style:solid;}", ".frrh606[data-fui-focus-visible]::after{border-top-width:2px;}", ".f1v5zibi[data-fui-focus-visible]::after{border-right-width:2px;}", ".fo2hd23[data-fui-focus-visible]::after{border-left-width:2px;}", ".ful5kiu[data-fui-focus-visible]::after{border-bottom-width:2px;}", ".f1jqcqds[data-fui-focus-visible]::after{border-bottom-right-radius:var(--borderRadiusMedium);}", ".ftffrms[data-fui-focus-visible]::after{border-bottom-left-radius:var(--borderRadiusMedium);}", ".f2e7qr6[data-fui-focus-visible]::after{border-top-right-radius:var(--borderRadiusMedium);}", ".fsr1zz6[data-fui-focus-visible]::after{border-top-left-radius:var(--borderRadiusMedium);}", ".f1dvezut[data-fui-focus-visible]::after{border-top-color:var(--colorStrokeFocus2);}", ".fd0oaoj[data-fui-focus-visible]::after{border-right-color:var(--colorStrokeFocus2);}", ".f1cwg4i8[data-fui-focus-visible]::after{border-left-color:var(--colorStrokeFocus2);}", ".fjvm52t[data-fui-focus-visible]::after{border-bottom-color:var(--colorStrokeFocus2);}", ".f57olzd[data-fui-focus-visible]::after{top:calc(2px * -1);}", ".f4stah7[data-fui-focus-visible]::after{right:calc(2px * -1);}", ".fs1por5[data-fui-focus-visible]::after{left:calc(2px * -1);}", ".f480a47[data-fui-focus-visible]::after{bottom:calc(2px * -1);}"],
   f: [".ftqa4ok:focus{outline-style:none;}"],
   i: [".f2hkw1w:focus-visible{outline-style:none;}"]
 });

package/lib/components/TreeItem/useTreeItemStyles.styles.js.map

@@ -1 +1 @@
-{"version":3,"names":["__styles","mergeClasses","tokens","createFocusOutlineStyle","treeItemLevelToken","treeItemClassNames","root","useRootStyles","level1","iytv0q","level2","level3","level4","level5","level6","level7","level8","level9","level10","base","qhf8xq","Bceei9c","mc9l5x","B7ck84d","wkccdc","Budl1dq","zoa1oz","De3pzq","sj55zd","z189sj","focusIndicator","Brovlpu","B486eqv","B8q5s1w","Bci5o5g","n8qw10","Bdrgwmp","Bm4h7ae","B7ys5i9","Busjfv9","Bhk32uz","Bf4ptjt","kclons","Bhdgwq3","Blkhhs4","Bqtpl0w","clg4pj","hgwjuy","Bonggc9","B1tsrr9","Dah5zi","Bkh64rk","qqdqy8","B6dhp37","i03rao","Boxcth7","Bsom6fd","J0r882","Bjwuhne","Ghsupd","Bule8hv","d","f","i","useTreeItemStyles_unstable","state","rootStyles","level","className","isStaticallyDefinedLevel"],"sources":["../../../src/components/TreeItem/useTreeItemStyles.styles.ts"],"sourcesContent":["import { GriffelStyle, makeStyles, mergeClasses } from '@griffel/react';\nimport type { TreeItemCSSProperties, TreeItemSlots, TreeItemState } from './TreeItem.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { tokens } from '@fluentui/react-theme';\nimport { createFocusOutlineStyle } from '@fluentui/react-tabster';\nimport { treeItemLevelToken } from '../../utils/tokens';\n\nexport const treeItemClassNames: SlotClassNames<TreeItemSlots> = {\n  root: 'fui-TreeItem',\n};\n\ntype StaticLevel = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10;\ntype StaticLevelProperty = `level${StaticLevel}`;\n\nconst useRootStyles = makeStyles({\n  ...(Object.fromEntries(\n    Array.from<never, [StaticLevelProperty, TreeItemCSSProperties]>({ length: 10 }, (_, index) => [\n      `level${(index + 1) as StaticLevel}`,\n      { [treeItemLevelToken]: index + 1 },\n    ]),\n  ) as Record<StaticLevelProperty, GriffelStyle>),\n  base: {\n    position: 'relative',\n    cursor: 'pointer',\n    display: 'grid',\n    boxSizing: 'border-box',\n    gridTemplateRows: 'auto auto',\n    gridTemplateColumns: 'minmax(0, 100%) minmax(0px, min-content)',\n    gridTemplateAreas: `\n    \"layout  aside\"\n    \"subtree subtree\"\n    `,\n    backgroundColor: tokens.colorSubtleBackground,\n    color: tokens.colorNeutralForeground2,\n    paddingRight: tokens.spacingHorizontalNone,\n  },\n  focusIndicator: createFocusOutlineStyle(),\n});\n\n/**\n * Apply styling to the TreeItem slots based on the state\n */\nexport const useTreeItemStyles_unstable = (state: TreeItemState): TreeItemState => {\n  const rootStyles = useRootStyles();\n\n  const { level } = state;\n\n  state.root.className = mergeClasses(\n    treeItemClassNames.root,\n    isStaticallyDefinedLevel(level) && rootStyles[`level${level}` as StaticLevelProperty],\n    rootStyles.base,\n    rootStyles.focusIndicator,\n    state.root.className,\n  );\n\n  return state;\n};\n\nfunction isStaticallyDefinedLevel(level: number): level is StaticLevel {\n  return level >= 1 && level <= 10;\n}\n"],"mappings":"AAAA,SAAAA,QAAA,EAAmCC,YAAY,QAAQ;AAGvD,SAASC,MAAM,QAAQ;AACvB,SAASC,uBAAuB,QAAQ;AACxC,SAASC,kBAAkB,QAAQ;AAEnC,OAAO,MAAMC,kBAAA,GAAoD;EAC/DC,IAAA,EAAM;AACR;AAKA,MAAMC,aAAA,gBAAgBP,QAAA;EAAAQ,MAAA;IAAAC,MAAA;EAAA;EAAAC,MAAA;IAAAD,MAAA;EAAA;EAAAE,MAAA;IAAAF,MAAA;EAAA;EAAAG,MAAA;IAAAH,MAAA;EAAA;EAAAI,MAAA;IAAAJ,MAAA;EAAA;EAAAK,MAAA;IAAAL,MAAA;EAAA;EAAAM,MAAA;IAAAN,MAAA;EAAA;EAAAO,MAAA;IAAAP,MAAA;EAAA;EAAAQ,MAAA;IAAAR,MAAA;EAAA;EAAAS,OAAA;IAAAT,MAAA;EAAA;EAAAU,IAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;EAAA;EAAAC,cAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;EAAA;AAAA;EAAAC,CAAA;EAAAC,CAAA;EAAAC,CAAA;AAAA,EAuBtB;AAEA;;;AAGA,OAAO,MAAMC,0BAAA,GAA8BC,KAAA,IAAwC;EACjF,MAAMC,UAAA,GAAa3D,aAAA;EAEnB,MAAM;IAAE4D;EAAK,CAAE,GAAGF,KAAA;EAElBA,KAAA,CAAM3D,IAAI,CAAC8D,SAAS,GAAGnE,YAAA,CACrBI,kBAAA,CAAmBC,IAAI,EACvB+D,wBAAA,CAAyBF,KAAA,KAAUD,UAAU,CAAE,QAAOC,KAAM,EAAC,CAAwB,EACrFD,UAAA,CAAW/C,IAAI,EACf+C,UAAA,CAAWpC,cAAc,EACzBmC,KAAA,CAAM3D,IAAI,CAAC8D,SAAS;EAGtB,OAAOH,KAAA;AACT;AAEA,SAASI,yBAAyBF,KAAa,EAAwB;EACrE,OAAOA,KAAA,IAAS,KAAKA,KAAA,IAAS;AAChC"}
+{"version":3,"names":["__styles","mergeClasses","tokens","createFocusOutlineStyle","treeItemLevelToken","treeItemClassNames","root","useRootStyles","level1","iytv0q","level2","level3","level4","level5","level6","level7","level8","level9","level10","base","qhf8xq","Bceei9c","mc9l5x","B7ck84d","wkccdc","Budl1dq","zoa1oz","De3pzq","sj55zd","z189sj","focusIndicator","Brovlpu","B486eqv","B8q5s1w","Bci5o5g","n8qw10","Bdrgwmp","Bm4h7ae","B7ys5i9","Busjfv9","Bhk32uz","Bf4ptjt","kclons","Bhdgwq3","Blkhhs4","Bqtpl0w","clg4pj","hgwjuy","Bonggc9","B1tsrr9","Dah5zi","Bkh64rk","qqdqy8","B6dhp37","i03rao","Boxcth7","Bsom6fd","J0r882","Bule8hv","Bjwuhne","Ghsupd","d","f","i","useTreeItemStyles_unstable","state","rootStyles","level","className","isStaticallyDefinedLevel"],"sources":["useTreeItemStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { createFocusOutlineStyle } from '@fluentui/react-tabster';\nimport { treeItemLevelToken } from '../../utils/tokens';\nexport const treeItemClassNames = {\n    root: 'fui-TreeItem'\n};\nconst useRootStyles = makeStyles({\n    ...Object.fromEntries(Array.from({\n        length: 10\n    }, (_, index)=>[\n            `level${index + 1}`,\n            {\n                [treeItemLevelToken]: index + 1\n            }\n        ])),\n    base: {\n        position: 'relative',\n        cursor: 'pointer',\n        display: 'grid',\n        boxSizing: 'border-box',\n        gridTemplateRows: 'auto auto',\n        gridTemplateColumns: 'minmax(0, 100%) minmax(0px, min-content)',\n        gridTemplateAreas: `\n    \"layout  aside\"\n    \"subtree subtree\"\n    `,\n        backgroundColor: tokens.colorSubtleBackground,\n        color: tokens.colorNeutralForeground2,\n        paddingRight: tokens.spacingHorizontalNone\n    },\n    focusIndicator: createFocusOutlineStyle()\n});\n/**\n * Apply styling to the TreeItem slots based on the state\n */ export const useTreeItemStyles_unstable = (state)=>{\n    const rootStyles = useRootStyles();\n    const { level  } = state;\n    state.root.className = mergeClasses(treeItemClassNames.root, isStaticallyDefinedLevel(level) && rootStyles[`level${level}`], rootStyles.base, rootStyles.focusIndicator, state.root.className);\n    return state;\n};\nfunction isStaticallyDefinedLevel(level) {\n    return level >= 1 && level <= 10;\n}\n"],"mappings":"AAAA,SAAAA,QAAA,EAAqBC,YAAY,QAAQ,gBAAgB;AACzD,SAASC,MAAM,QAAQ,uBAAuB;AAC9C,SAASC,uBAAuB,QAAQ,yBAAyB;AACjE,SAASC,kBAAkB,QAAQ,oBAAoB;AACvD,OAAO,MAAMC,kBAAkB,GAAG;EAC9BC,IAAI,EAAE;AACV,CAAC;AACD,MAAMC,aAAa,gBAAGP,QAAA;EAAAQ,MAAA;IAAAC,MAAA;EAAA;EAAAC,MAAA;IAAAD,MAAA;EAAA;EAAAE,MAAA;IAAAF,MAAA;EAAA;EAAAG,MAAA;IAAAH,MAAA;EAAA;EAAAI,MAAA;IAAAJ,MAAA;EAAA;EAAAK,MAAA;IAAAL,MAAA;EAAA;EAAAM,MAAA;IAAAN,MAAA;EAAA;EAAAO,MAAA;IAAAP,MAAA;EAAA;EAAAQ,MAAA;IAAAR,MAAA;EAAA;EAAAS,OAAA;IAAAT,MAAA;EAAA;EAAAU,IAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;EAAA;EAAAC,cAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;AAAA;EAAAC,CAAA;EAAAC,CAAA;EAAAC,CAAA;AAAA,CAyBrB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMC,0BAA0B,GAAIC,KAAK,IAAG;EACnD,MAAMC,UAAU,GAAG3D,aAAa,CAAC,CAAC;EAClC,MAAM;IAAE4D;EAAO,CAAC,GAAGF,KAAK;EACxBA,KAAK,CAAC3D,IAAI,CAAC8D,SAAS,GAAGnE,YAAY,CAACI,kBAAkB,CAACC,IAAI,EAAE+D,wBAAwB,CAACF,KAAK,CAAC,IAAID,UAAU,CAAE,QAAOC,KAAM,EAAC,CAAC,EAAED,UAAU,CAAC/C,IAAI,EAAE+C,UAAU,CAACpC,cAAc,EAAEmC,KAAK,CAAC3D,IAAI,CAAC8D,SAAS,CAAC;EAC9L,OAAOH,KAAK;AAChB,CAAC;AACD,SAASI,wBAAwBA,CAACF,KAAK,EAAE;EACrC,OAAOA,KAAK,IAAI,CAAC,IAAIA,KAAK,IAAI,EAAE;AACpC"}

package/lib/components/TreeItemAside/TreeItemAside.js

@@ -5,11 +5,9 @@ import { useTreeItemAsideStyles_unstable } from './useTreeItemAsideStyles.styles
 /**
  * TreeItemAside component - represents a custom set of actionable elements that will be visible when a certain
  * `TreeItem` is currently "active".
- */
-export const TreeItemAside = /*#__PURE__*/React.forwardRef((props, ref) => {
-  const state = useTreeItemAside_unstable(props, ref);
-  useTreeItemAsideStyles_unstable(state);
-  return renderTreeItemAside_unstable(state);
+ */ export const TreeItemAside = /*#__PURE__*/ React.forwardRef((props, ref)=>{
+    const state = useTreeItemAside_unstable(props, ref);
+    useTreeItemAsideStyles_unstable(state);
+    return renderTreeItemAside_unstable(state);
 });
 TreeItemAside.displayName = 'TreeItemAside';
-//# sourceMappingURL=TreeItemAside.js.map

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

@@ -1 +1 @@
-{"version":3,"names":["React","useTreeItemAside_unstable","renderTreeItemAside_unstable","useTreeItemAsideStyles_unstable","TreeItemAside","forwardRef","props","ref","state","displayName"],"sources":["../../../src/components/TreeItemAside/TreeItemAside.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useTreeItemAside_unstable } from './useTreeItemAside';\nimport { renderTreeItemAside_unstable } from './renderTreeItemAside';\nimport { useTreeItemAsideStyles_unstable } from './useTreeItemAsideStyles.styles';\nimport type { TreeItemAsideProps } from './TreeItemAside.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * TreeItemAside component - represents a custom set of actionable elements that will be visible when a certain\n * `TreeItem` is currently \"active\".\n */\nexport const TreeItemAside: ForwardRefComponent<TreeItemAsideProps> = React.forwardRef((props, ref) => {\n  const state = useTreeItemAside_unstable(props, ref);\n\n  useTreeItemAsideStyles_unstable(state);\n  return renderTreeItemAside_unstable(state);\n});\n\nTreeItemAside.displayName = 'TreeItemAside';\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,yBAAyB,QAAQ;AAC1C,SAASC,4BAA4B,QAAQ;AAC7C,SAASC,+BAA+B,QAAQ;AAIhD;;;;AAIA,OAAO,MAAMC,aAAA,gBAAyDJ,KAAA,CAAMK,UAAU,CAAC,CAACC,KAAA,EAAOC,GAAA,KAAQ;EACrG,MAAMC,KAAA,GAAQP,yBAAA,CAA0BK,KAAA,EAAOC,GAAA;EAE/CJ,+BAAA,CAAgCK,KAAA;EAChC,OAAON,4BAAA,CAA6BM,KAAA;AACtC;AAEAJ,aAAA,CAAcK,WAAW,GAAG"}
+{"version":3,"sources":["TreeItemAside.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useTreeItemAside_unstable } from './useTreeItemAside';\nimport { renderTreeItemAside_unstable } from './renderTreeItemAside';\nimport { useTreeItemAsideStyles_unstable } from './useTreeItemAsideStyles.styles';\nimport type { TreeItemAsideProps } from './TreeItemAside.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * TreeItemAside component - represents a custom set of actionable elements that will be visible when a certain\n * `TreeItem` is currently \"active\".\n */\nexport const TreeItemAside: ForwardRefComponent<TreeItemAsideProps> = React.forwardRef((props, ref) => {\n  const state = useTreeItemAside_unstable(props, ref);\n\n  useTreeItemAsideStyles_unstable(state);\n  return renderTreeItemAside_unstable(state);\n});\n\nTreeItemAside.displayName = 'TreeItemAside';\n"],"names":["React","useTreeItemAside_unstable","renderTreeItemAside_unstable","useTreeItemAsideStyles_unstable","TreeItemAside","forwardRef","props","ref","state","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,yBAAyB,QAAQ,qBAAqB;AAC/D,SAASC,4BAA4B,QAAQ,wBAAwB;AACrE,SAASC,+BAA+B,QAAQ,kCAAkC;AAIlF;;;CAGC,GACD,OAAO,MAAMC,8BAAyDJ,MAAMK,UAAU,CAAC,CAACC,OAAOC,MAAQ;IACrG,MAAMC,QAAQP,0BAA0BK,OAAOC;IAE/CJ,gCAAgCK;IAChC,OAAON,6BAA6BM;AACtC,GAAG;AAEHJ,cAAcK,WAAW,GAAG"}

package/lib/components/TreeItemAside/TreeItemAside.types.js

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

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

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["../../../src/components/TreeItemAside/TreeItemAside.types.ts"],"sourcesContent":["import { ButtonContextValue } from '@fluentui/react-button';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type TreeItemAsideSlots = {\n  root: Slot<'div'>;\n};\n\n/**\n * TreeItemAside Props\n */\nexport type TreeItemAsideProps = ComponentProps<TreeItemAsideSlots> & {\n  /**\n   * boolean indicating if the aside content should behave as \"actions\"\n   *\n   * actionable elements are normally buttons, menus, or other focusable elements.\n   * Those elements are only visibly available if the given tree item is currently active.\n   */\n  actions?: boolean;\n  /**\n   * Forces visibility of the aside content, even if they're actions\n   */\n  visible?: true;\n};\n\n/**\n * State used in rendering TreeItemAside\n */\nexport type TreeItemAsideState = ComponentState<TreeItemAsideSlots> & {\n  actions: boolean;\n  visible: boolean;\n  buttonContextValue: ButtonContextValue;\n};\n"],"mappings":"AAAA"}
+{"version":3,"sources":["TreeItemAside.types.ts"],"sourcesContent":["import { ButtonContextValue } from '@fluentui/react-button';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type TreeItemAsideSlots = {\n  root: Slot<'div'>;\n};\n\n/**\n * TreeItemAside Props\n */\nexport type TreeItemAsideProps = ComponentProps<TreeItemAsideSlots> & {\n  /**\n   * boolean indicating if the aside content should behave as \"actions\"\n   *\n   * actionable elements are normally buttons, menus, or other focusable elements.\n   * Those elements are only visibly available if the given tree item is currently active.\n   */\n  actions?: boolean;\n  /**\n   * Forces visibility of the aside content, even if they're actions\n   */\n  visible?: true;\n};\n\n/**\n * State used in rendering TreeItemAside\n */\nexport type TreeItemAsideState = ComponentState<TreeItemAsideSlots> & {\n  actions: boolean;\n  visible: boolean;\n  buttonContextValue: ButtonContextValue;\n};\n"],"names":[],"mappings":"AAAA,WA+BE"}

package/lib/components/TreeItemAside/index.js

@@ -3,4 +3,3 @@ export * from './TreeItemAside.types';
 export * from './renderTreeItemAside';
 export * from './useTreeItemAside';
 export * from './useTreeItemAsideStyles.styles';
-//# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["../../../src/components/TreeItemAside/index.ts"],"sourcesContent":["export * from './TreeItemAside';\nexport * from './TreeItemAside.types';\nexport * from './renderTreeItemAside';\nexport * from './useTreeItemAside';\nexport * from './useTreeItemAsideStyles.styles';\n"],"mappings":"AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc"}
+{"version":3,"sources":["index.ts"],"sourcesContent":["export * from './TreeItemAside';\nexport * from './TreeItemAside.types';\nexport * from './renderTreeItemAside';\nexport * from './useTreeItemAside';\nexport * from './useTreeItemAsideStyles.styles';\n"],"names":[],"mappings":"AAAA,cAAc,kBAAkB;AAChC,cAAc,wBAAwB;AACtC,cAAc,wBAAwB;AACtC,cAAc,qBAAqB;AACnC,cAAc,kCAAkC"}

package/lib/components/TreeItemAside/renderTreeItemAside.js

@@ -1,19 +1,14 @@
-/** @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 { ButtonContextProvider } from '@fluentui/react-button';
 /**
  * Render the final JSX of TreeItemAside
- */
-export const renderTreeItemAside_unstable = state => {
-  const {
-    slots,
-    slotProps
-  } = getSlotsNext(state);
-  if (!state.visible) {
-    return null;
-  }
-  return /*#__PURE__*/createElement(slots.root, slotProps.root, /*#__PURE__*/createElement(ButtonContextProvider, {
-    value: state.buttonContextValue
-  }, slotProps.root.children));
+ */ export const renderTreeItemAside_unstable = (state)=>{
+    const { slots , slotProps  } = getSlotsNext(state);
+    if (!state.visible) {
+        return null;
+    }
+    return /*#__PURE__*/ createElement(slots.root, slotProps.root, /*#__PURE__*/ createElement(ButtonContextProvider, {
+        value: state.buttonContextValue
+    }, slotProps.root.children));
 };
-//# sourceMappingURL=renderTreeItemAside.js.map

package/lib/components/TreeItemAside/renderTreeItemAside.js.map

@@ -1 +1 @@
-{"version":3,"names":["createElement","getSlotsNext","ButtonContextProvider","renderTreeItemAside_unstable","state","slots","slotProps","visible","root","value","buttonContextValue","children"],"sources":["../../../src/components/TreeItemAside/renderTreeItemAside.tsx"],"sourcesContent":["/** @jsxRuntime classic */\n/** @jsx createElement */\n\nimport { createElement } from '@fluentui/react-jsx-runtime';\nimport { getSlotsNext } from '@fluentui/react-utilities';\nimport { ButtonContextProvider } from '@fluentui/react-button';\nimport type { TreeItemAsideState, TreeItemAsideSlots } from './TreeItemAside.types';\n\n/**\n * Render the final JSX of TreeItemAside\n */\nexport const renderTreeItemAside_unstable = (state: TreeItemAsideState) => {\n  const { slots, slotProps } = getSlotsNext<TreeItemAsideSlots>(state);\n\n  if (!state.visible) {\n    return null;\n  }\n\n  return (\n    <slots.root {...slotProps.root}>\n      <ButtonContextProvider value={state.buttonContextValue}>{slotProps.root.children}</ButtonContextProvider>\n    </slots.root>\n  );\n};\n"],"mappings":"AAAA,2BACA,yBAEA,SAASA,aAAa,QAAQ;AAC9B,SAASC,YAAY,QAAQ;AAC7B,SAASC,qBAAqB,QAAQ;AAGtC;;;AAGA,OAAO,MAAMC,4BAAA,GAAgCC,KAAA,IAA8B;EACzE,MAAM;IAAEC,KAAA;IAAOC;EAAS,CAAE,GAAGL,YAAA,CAAiCG,KAAA;EAE9D,IAAI,CAACA,KAAA,CAAMG,OAAO,EAAE;IAClB,OAAO,IAAI;EACb;EAEA,oBACEP,aAlBJ,CAkBKK,KAAA,CAAMG,IAAI,EAAKF,SAAA,CAAUE,IAAI,eAC5BR,aAnBN,CAmBOE,qBAAA;IAAsBO,KAAA,EAAOL,KAAA,CAAMM;KAAqBJ,SAAA,CAAUE,IAAI,CAACG,QAAQ;AAGtF"}
+{"version":3,"sources":["renderTreeItemAside.tsx"],"sourcesContent":["/** @jsxRuntime classic */\n/** @jsx createElement */\n\nimport { createElement } from '@fluentui/react-jsx-runtime';\nimport { getSlotsNext } from '@fluentui/react-utilities';\nimport { ButtonContextProvider } from '@fluentui/react-button';\nimport type { TreeItemAsideState, TreeItemAsideSlots } from './TreeItemAside.types';\n\n/**\n * Render the final JSX of TreeItemAside\n */\nexport const renderTreeItemAside_unstable = (state: TreeItemAsideState) => {\n  const { slots, slotProps } = getSlotsNext<TreeItemAsideSlots>(state);\n\n  if (!state.visible) {\n    return null;\n  }\n\n  return (\n    <slots.root {...slotProps.root}>\n      <ButtonContextProvider value={state.buttonContextValue}>{slotProps.root.children}</ButtonContextProvider>\n    </slots.root>\n  );\n};\n"],"names":["createElement","getSlotsNext","ButtonContextProvider","renderTreeItemAside_unstable","state","slots","slotProps","visible","root","value","buttonContextValue","children"],"mappings":"AAAA,wBAAwB,GACxB,uBAAuB,GAEvB,SAASA,aAAa,QAAQ,8BAA8B;AAC5D,SAASC,YAAY,QAAQ,4BAA4B;AACzD,SAASC,qBAAqB,QAAQ,yBAAyB;AAG/D;;CAEC,GACD,OAAO,MAAMC,+BAA+B,CAACC,QAA8B;IACzE,MAAM,EAAEC,MAAK,EAAEC,UAAS,EAAE,GAAGL,aAAiCG;IAE9D,IAAI,CAACA,MAAMG,OAAO,EAAE;QAClB,OAAO,IAAI;IACb,CAAC;IAED,qBACE,AAlBJ,cAkBKF,MAAMG,IAAI,EAAKF,UAAUE,IAAI,gBAC5B,AAnBN,cAmBON;QAAsBO,OAAOL,MAAMM,kBAAkB;OAAGJ,UAAUE,IAAI,CAACG,QAAQ;AAGtF,EAAE"}

package/lib/components/TreeItemAside/useTreeItemAside.js

@@ -9,27 +9,22 @@ import { useTreeItemContext_unstable } from '../../contexts/treeItemContext';
  *
  * @param props - props from this instance of TreeItemAside
  * @param ref - reference to root HTMLElement of TreeItemAside
- */
-export const useTreeItemAside_unstable = (props, ref) => {
-  const actionsRef = useTreeItemContext_unstable(ctx => ctx.actionsRef);
-  const contextVisible = useTreeItemContext_unstable(ctx => props.actions ? ctx.isActionsVisible : ctx.isAsideVisible);
-  const {
-    actions = false,
-    visible = contextVisible
-  } = props;
-  return {
-    actions,
-    visible,
-    buttonContextValue: {
-      size: 'small'
-    },
-    components: {
-      root: 'div'
-    },
-    root: getNativeElementProps('div', {
-      ref: useMergedRefs(ref, actions ? actionsRef : undefined),
-      ...props
-    })
-  };
+ */ export const useTreeItemAside_unstable = (props, ref)=>{
+    const actionsRef = useTreeItemContext_unstable((ctx)=>ctx.actionsRef);
+    const contextVisible = useTreeItemContext_unstable((ctx)=>props.actions ? ctx.isActionsVisible : ctx.isAsideVisible);
+    const { actions =false , visible =contextVisible  } = props;
+    return {
+        actions,
+        visible,
+        buttonContextValue: {
+            size: 'small'
+        },
+        components: {
+            root: 'div'
+        },
+        root: getNativeElementProps('div', {
+            ref: useMergedRefs(ref, actions ? actionsRef : undefined),
+            ...props
+        })
+    };
 };
-//# sourceMappingURL=useTreeItemAside.js.map

package/lib/components/TreeItemAside/useTreeItemAside.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","getNativeElementProps","useMergedRefs","useTreeItemContext_unstable","useTreeItemAside_unstable","props","ref","actionsRef","ctx","contextVisible","actions","isActionsVisible","isAsideVisible","visible","buttonContextValue","size","components","root","undefined"],"sources":["../../../src/components/TreeItemAside/useTreeItemAside.ts"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, useMergedRefs } from '@fluentui/react-utilities';\nimport type { TreeItemAsideProps, TreeItemAsideState } from './TreeItemAside.types';\nimport { useTreeItemContext_unstable } from '../../contexts/treeItemContext';\n\n/**\n * Create the state required to render TreeItemAside.\n *\n * The returned state can be modified with hooks such as useTreeItemAsideStyles_unstable,\n * before being passed to renderTreeItemAside_unstable.\n *\n * @param props - props from this instance of TreeItemAside\n * @param ref - reference to root HTMLElement of TreeItemAside\n */\nexport const useTreeItemAside_unstable = (\n  props: TreeItemAsideProps,\n  ref: React.Ref<HTMLElement>,\n): TreeItemAsideState => {\n  const actionsRef = useTreeItemContext_unstable(ctx => ctx.actionsRef);\n  const contextVisible = useTreeItemContext_unstable(ctx =>\n    props.actions ? ctx.isActionsVisible : ctx.isAsideVisible,\n  );\n  const { actions = false, visible = contextVisible } = props;\n\n  return {\n    actions,\n    visible,\n    buttonContextValue: { size: 'small' },\n    components: {\n      root: 'div',\n    },\n    root: getNativeElementProps('div', {\n      ref: useMergedRefs(ref, actions ? actionsRef : undefined),\n      ...props,\n    }),\n  };\n};\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,qBAAqB,EAAEC,aAAa,QAAQ;AAErD,SAASC,2BAA2B,QAAQ;AAE5C;;;;;;;;;AASA,OAAO,MAAMC,yBAAA,GAA4BA,CACvCC,KAAA,EACAC,GAAA,KACuB;EACvB,MAAMC,UAAA,GAAaJ,2BAAA,CAA4BK,GAAA,IAAOA,GAAA,CAAID,UAAU;EACpE,MAAME,cAAA,GAAiBN,2BAAA,CAA4BK,GAAA,IACjDH,KAAA,CAAMK,OAAO,GAAGF,GAAA,CAAIG,gBAAgB,GAAGH,GAAA,CAAII,cAAc;EAE3D,MAAM;IAAEF,OAAA,GAAU,KAAK;IAAEG,OAAA,GAAUJ;EAAc,CAAE,GAAGJ,KAAA;EAEtD,OAAO;IACLK,OAAA;IACAG,OAAA;IACAC,kBAAA,EAAoB;MAAEC,IAAA,EAAM;IAAQ;IACpCC,UAAA,EAAY;MACVC,IAAA,EAAM;IACR;IACAA,IAAA,EAAMhB,qBAAA,CAAsB,OAAO;MACjCK,GAAA,EAAKJ,aAAA,CAAcI,GAAA,EAAKI,OAAA,GAAUH,UAAA,GAAaW,SAAS;MACxD,GAAGb;IACL;EACF;AACF"}
+{"version":3,"sources":["useTreeItemAside.ts"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, useMergedRefs } from '@fluentui/react-utilities';\nimport type { TreeItemAsideProps, TreeItemAsideState } from './TreeItemAside.types';\nimport { useTreeItemContext_unstable } from '../../contexts/treeItemContext';\n\n/**\n * Create the state required to render TreeItemAside.\n *\n * The returned state can be modified with hooks such as useTreeItemAsideStyles_unstable,\n * before being passed to renderTreeItemAside_unstable.\n *\n * @param props - props from this instance of TreeItemAside\n * @param ref - reference to root HTMLElement of TreeItemAside\n */\nexport const useTreeItemAside_unstable = (\n  props: TreeItemAsideProps,\n  ref: React.Ref<HTMLElement>,\n): TreeItemAsideState => {\n  const actionsRef = useTreeItemContext_unstable(ctx => ctx.actionsRef);\n  const contextVisible = useTreeItemContext_unstable(ctx =>\n    props.actions ? ctx.isActionsVisible : ctx.isAsideVisible,\n  );\n  const { actions = false, visible = contextVisible } = props;\n\n  return {\n    actions,\n    visible,\n    buttonContextValue: { size: 'small' },\n    components: {\n      root: 'div',\n    },\n    root: getNativeElementProps('div', {\n      ref: useMergedRefs(ref, actions ? actionsRef : undefined),\n      ...props,\n    }),\n  };\n};\n"],"names":["React","getNativeElementProps","useMergedRefs","useTreeItemContext_unstable","useTreeItemAside_unstable","props","ref","actionsRef","ctx","contextVisible","actions","isActionsVisible","isAsideVisible","visible","buttonContextValue","size","components","root","undefined"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,qBAAqB,EAAEC,aAAa,QAAQ,4BAA4B;AAEjF,SAASC,2BAA2B,QAAQ,iCAAiC;AAE7E;;;;;;;;CAQC,GACD,OAAO,MAAMC,4BAA4B,CACvCC,OACAC,MACuB;IACvB,MAAMC,aAAaJ,4BAA4BK,CAAAA,MAAOA,IAAID,UAAU;IACpE,MAAME,iBAAiBN,4BAA4BK,CAAAA,MACjDH,MAAMK,OAAO,GAAGF,IAAIG,gBAAgB,GAAGH,IAAII,cAAc;IAE3D,MAAM,EAAEF,SAAU,KAAK,CAAA,EAAEG,SAAUJ,eAAc,EAAE,GAAGJ;IAEtD,OAAO;QACLK;QACAG;QACAC,oBAAoB;YAAEC,MAAM;QAAQ;QACpCC,YAAY;YACVC,MAAM;QACR;QACAA,MAAMhB,sBAAsB,OAAO;YACjCK,KAAKJ,cAAcI,KAAKI,UAAUH,aAAaW,SAAS;YACxD,GAAGb,KAAK;QACV;IACF;AACF,EAAE"}

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