npm - @fluentui/react-tree - Versions diffs - 9.0.0-beta.4 → 9.0.0-beta.6 - Mend

@fluentui/react-tree 9.0.0-beta.4 → 9.0.0-beta.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (176) hide show

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

	@@ -1 +1 @@
1	- {"version":3,"names":["React","getNativeElementProps","isResolvedShorthand","resolveShorthand","useId","ChevronRight12Regular","useFluent_unstable","useEventCallback","expandIconInlineStyles","ArrowDown","ArrowLeft","ArrowRight","ArrowUp","End","Enter","Home","useMergedRefs","elementContains","useTreeContext_unstable","treeDataTypes","useTreeItem_unstable","props","ref","children","subtreeChildren","Children","toArray","contextLevel","ctx","level","content","subtree","expandIcon","leaf","isLeaf","undefined","actions","as","onClick","onKeyDown","rest","requestOpenChange","requestNavigation","id","isBranch","open","openItems","has","dir","targetDocument","expandIconRotation","actionsRef","useRef","expandIconRef","subtreeRef","handleArrowRight","event","type","arrowRight","target","currentTarget","handleArrowLeft","arrowLeft","handleEnter","enter","handleClick","isEventFromActions","current","isEventFromSubtree","isFromExpandIcon","expandIconClick","click","handleKeyDown","isDefaultPrevented","key","end","home","arrowUp","arrowDown","isTypeAheadCharacter","length","match","altKey","ctrlKey","metaKey","typeAhead","isActionsVisible","setActionsVisible","useState","showActions","hideActions","useEffect","handleFocusOut","relatedTarget","addEventListener","passive","removeEventListener","buttonSize","components","root","required","Boolean","defaultProps","tabIndex","role","onMouseOver","onFocus","onMouseOut","onBlur","createElement","style"],"sources":["../src/packages/react-components/react-tree/src/components/TreeItem/useTreeItem.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, isResolvedShorthand, resolveShorthand, useId } from '@fluentui/react-utilities';\nimport { ChevronRight12Regular } from '@fluentui/react-icons';\nimport { useFluent_unstable } from '@fluentui/react-shared-contexts';\nimport { useEventCallback } from '@fluentui/react-utilities';\nimport { expandIconInlineStyles } from './useTreeItemStyles';\nimport { ArrowDown, ArrowLeft, ArrowRight, ArrowUp, End, Enter, Home } from '@fluentui/keyboard-keys';\nimport { useMergedRefs } 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 const useTreeItem_unstable = (props: TreeItemProps, ref: React.Ref<HTMLDivElement>): TreeItemState => {\n const [children, subtreeChildren] = React.Children.toArray(props.children);\n\n const contextLevel = useTreeContext_unstable(ctx => ctx.level);\n const {\n content,\n subtree,\n expandIcon,\n leaf: isLeaf = subtreeChildren === undefined,\n actions,\n as = 'div',\n onClick,\n onKeyDown,\n ['aria-level']: level = contextLevel,\n ...rest\n } = props;\n\n const requestOpenChange = useTreeContext_unstable(ctx => ctx.requestOpenChange);\n const requestNavigation = useTreeContext_unstable(ctx => ctx.requestNavigation);\n\n const id = useId('fui-TreeItem-', props.id);\n\n const isBranch = !isLeaf;\n\n const open = useTreeContext_unstable(ctx => isBranch && ctx.openItems.has(id));\n const { dir, targetDocument } = useFluent_unstable();\n const expandIconRotation = open ? 90 : dir !== 'rtl' ? 0 : 180;\n\n const actionsRef = React.useRef<HTMLElement>(null);\n const expandIconRef = React.useRef<HTMLElement>(null);\n const subtreeRef = React.useRef<HTMLElement>(null);\n\n const handleArrowRight = (event: React.KeyboardEvent<HTMLDivElement>) => {\n if (!open && isBranch) {\n return requestOpenChange({ event, open: true, type: treeDataTypes.arrowRight, target: event.currentTarget });\n }\n if (open && isBranch) {\n return requestNavigation({ event, type: treeDataTypes.arrowRight, target: event.currentTarget });\n }\n };\n const handleArrowLeft = (event: React.KeyboardEvent<HTMLDivElement>) => {\n if (open && isBranch) {\n return requestOpenChange({ event, open: false, type: treeDataTypes.arrowLeft, target: event.currentTarget });\n }\n if (!open && level > 1) {\n return requestNavigation({ event, target: event.currentTarget, type: treeDataTypes.arrowLeft });\n }\n };\n const handleEnter = (event: React.KeyboardEvent<HTMLDivElement>) => {\n requestOpenChange({ event, open: isLeaf ? open : !open, type: treeDataTypes.enter, target: event.currentTarget });\n };\n\n const handleClick = useEventCallback((event: React.MouseEvent<HTMLDivElement>) => {\n onClick?.(event);\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 requestOpenChange({\n event,\n open: isLeaf ? open : !open,\n type: isFromExpandIcon ? treeDataTypes.expandIconClick : treeDataTypes.click,\n target: event.currentTarget,\n });\n requestNavigation({ event, target: event.currentTarget, type: treeDataTypes.click });\n });\n\n const handleKeyDown = useEventCallback((event: React.KeyboardEvent<HTMLDivElement>) => {\n onKeyDown?.(event);\n if (event.currentTarget !== event.target) {\n return;\n }\n if (event.isDefaultPrevented()) {\n return;\n }\n switch (event.key) {\n case Enter:\n return handleEnter(event);\n case ArrowRight:\n return handleArrowRight(event);\n case ArrowLeft:\n return handleArrowLeft(event);\n case End:\n return requestNavigation({ event, type: treeDataTypes.end, target: event.currentTarget });\n case Home:\n return requestNavigation({ event, type: treeDataTypes.home, target: event.currentTarget });\n case ArrowUp:\n return requestNavigation({ event, type: treeDataTypes.arrowUp, target: event.currentTarget });\n case ArrowDown:\n return requestNavigation({ event, type: treeDataTypes.arrowDown, target: event.currentTarget });\n }\n const isTypeAheadCharacter =\n event.key.length === 1 && event.key.match(/\\w/) && !event.altKey && !event.ctrlKey && !event.metaKey;\n if (isTypeAheadCharacter) {\n return requestNavigation({ event, target: event.currentTarget, type: treeDataTypes.typeAhead });\n }\n });\n\n const [isActionsVisible, setActionsVisible] = React.useState(false);\n const showActions = useEventCallback((event: React.SyntheticEvent) => {\n const isEventFromSubtree = subtreeRef.current && elementContains(subtreeRef.current, event.target as Node);\n if (!isEventFromSubtree) {\n setActionsVisible(true);\n }\n });\n const hideActions = useEventCallback((event: React.SyntheticEvent) => {\n const isEventFromSubtree = subtreeRef.current && elementContains(subtreeRef.current, event.target as Node);\n if (!isEventFromSubtree) {\n setActionsVisible(false);\n }\n });\n\n // Listens to focusout event on the document to ensure treeitem actions visibility on portal scenarios\n // TODO: find a better way to ensure this behavior\n React.useEffect(() => {\n if (actionsRef.current) {\n const handleFocusOut = (event: FocusEvent) => {\n setActionsVisible(elementContains(actionsRef.current, event.relatedTarget as Node));\n };\n targetDocument?.addEventListener('focusout', handleFocusOut, { passive: true });\n return () => {\n targetDocument?.removeEventListener('focusout', handleFocusOut);\n };\n }\n }, [targetDocument]);\n\n return {\n isLeaf,\n open,\n level,\n buttonSize: 'small',\n isActionsVisible: actions ? isActionsVisible : false,\n components: {\n content: 'div',\n root: 'div',\n expandIcon: 'span',\n actions: 'span',\n subtree: 'span',\n },\n subtree: resolveShorthand(subtree, {\n required: Boolean(subtreeChildren),\n defaultProps: {\n children: subtreeChildren,\n ref: useMergedRefs(subtreeRef, isResolvedShorthand(subtree) ? subtree.ref : undefined),\n },\n }),\n content: resolveShorthand(content, {\n required: true,\n defaultProps: {\n children,\n },\n }),\n root: getNativeElementProps(as, {\n tabIndex: -1,\n ...rest,\n id,\n ref,\n children: null,\n 'aria-level': level,\n 'aria-expanded': isBranch ? open : undefined,\n role: 'treeitem',\n onClick: handleClick,\n onKeyDown: handleKeyDown,\n onMouseOver: actions ? showActions : undefined,\n onFocus: actions ? showActions : undefined,\n onMouseOut: actions ? hideActions : undefined,\n onBlur: actions ? hideActions : undefined,\n }),\n expandIcon: resolveShorthand(expandIcon, {\n required: isBranch,\n defaultProps: {\n children: <ChevronRight12Regular style={expandIconInlineStyles[expandIconRotation]} />,\n 'aria-hidden': true,\n ref: useMergedRefs(isResolvedShorthand(expandIcon) ? expandIcon.ref : undefined, expandIconRef),\n },\n }),\n actions: resolveShorthand(actions, {\n defaultProps: {\n ref: useMergedRefs(isResolvedShorthand(actions) ? actions.ref : undefined, actionsRef),\n },\n }),\n };\n};\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,qBAAqB,EAAEC,mBAAmB,EAAEC,gBAAgB,EAAEC,KAAK,QAAQ,2BAA2B;AAC/G,SAASC,qBAAqB,QAAQ,uBAAuB;AAC7D,SAASC,kBAAkB,QAAQ,iCAAiC;AACpE,SAASC,gBAAgB,QAAQ,2BAA2B;AAC5D,SAASC,sBAAsB,QAAQ,qBAAqB;AAC5D,SAASC,SAAS,EAAEC,SAAS,EAAEC,UAAU,EAAEC,OAAO,EAAEC,GAAG,EAAEC,KAAK,EAAEC,IAAI,QAAQ,yBAAyB;AACrG,SAASC,aAAa,QAAQ,2BAA2B;AACzD,SAASC,eAAe,QAAQ,wBAAwB;AAExD,SAASC,uBAAuB,QAAQ,sBAAsB;AAC9D,SAASC,aAAa,QAAQ,oBAAoB;AAElD;;;;;;;;;AASA,OAAO,MAAMC,oBAAoB,GAAGA,CAACC,KAAoB,EAAEC,GAA8B,KAAmB;EAC1G,MAAM,CAACC,QAAQ,EAAEC,eAAe,CAAC,GAAGxB,KAAK,CAACyB,QAAQ,CAACC,OAAO,CAACL,KAAK,CAACE,QAAQ,CAAC;EAE1E,MAAMI,YAAY,GAAGT,uBAAuB,CAACU,GAAG,IAAIA,GAAG,CAACC,KAAK,CAAC;EAC9D,MAAM;IACJC,OAAO;IACPC,OAAO;IACPC,UAAU;IACVC,IAAI,EAAEC,MAAM,GAAGV,eAAe,KAAKW,SAAS;IAC5CC,OAAO;IACPC,EAAE,GAAG,KAAK;IACVC,OAAO;IACPC,SAAS;IACT,CAAC,YAAY,GAAGV,KAAK,GAAGF,YAAY;IACpC,GAAGa;EAAI,CACR,GAAGnB,KAAK;EAET,MAAMoB,iBAAiB,GAAGvB,uBAAuB,CAACU,GAAG,IAAIA,GAAG,CAACa,iBAAiB,CAAC;EAC/E,MAAMC,iBAAiB,GAAGxB,uBAAuB,CAACU,GAAG,IAAIA,GAAG,CAACc,iBAAiB,CAAC;EAE/E,MAAMC,EAAE,GAAGvC,KAAK,CAAC,eAAe,EAAEiB,KAAK,CAACsB,EAAE,CAAC;EAE3C,MAAMC,QAAQ,GAAG,CAACV,MAAM;EAExB,MAAMW,IAAI,GAAG3B,uBAAuB,CAACU,GAAG,IAAIgB,QAAQ,IAAIhB,GAAG,CAACkB,SAAS,CAACC,GAAG,CAACJ,EAAE,CAAC,CAAC;EAC9E,MAAM;IAAEK,GAAG;IAAEC;EAAc,CAAE,GAAG3C,kBAAkB,EAAE;EACpD,MAAM4C,kBAAkB,GAAGL,IAAI,GAAG,EAAE,GAAGG,GAAG,KAAK,KAAK,GAAG,CAAC,GAAG,GAAG;EAE9D,MAAMG,UAAU,GAAGnD,KAAK,CAACoD,MAAM,CAAc,IAAI,CAAC;EAClD,MAAMC,aAAa,GAAGrD,KAAK,CAACoD,MAAM,CAAc,IAAI,CAAC;EACrD,MAAME,UAAU,GAAGtD,KAAK,CAACoD,MAAM,CAAc,IAAI,CAAC;EAElD,MAAMG,gBAAgB,GAAIC,KAA0C,IAAI;IACtE,IAAI,CAACX,IAAI,IAAID,QAAQ,EAAE;MACrB,OAAOH,iBAAiB,CAAC;QAAEe,KAAK;QAAEX,IAAI,EAAE,IAAI;QAAEY,IAAI,EAAEtC,aAAa,CAACuC,UAAU;QAAEC,MAAM,EAAEH,KAAK,CAACI;MAAa,CAAE,CAAC;;IAE9G,IAAIf,IAAI,IAAID,QAAQ,EAAE;MACpB,OAAOF,iBAAiB,CAAC;QAAEc,KAAK;QAAEC,IAAI,EAAEtC,aAAa,CAACuC,UAAU;QAAEC,MAAM,EAAEH,KAAK,CAACI;MAAa,CAAE,CAAC;;EAEpG,CAAC;EACD,MAAMC,eAAe,GAAIL,KAA0C,IAAI;IACrE,IAAIX,IAAI,IAAID,QAAQ,EAAE;MACpB,OAAOH,iBAAiB,CAAC;QAAEe,KAAK;QAAEX,IAAI,EAAE,KAAK;QAAEY,IAAI,EAAEtC,aAAa,CAAC2C,SAAS;QAAEH,MAAM,EAAEH,KAAK,CAACI;MAAa,CAAE,CAAC;;IAE9G,IAAI,CAACf,IAAI,IAAIhB,KAAK,GAAG,CAAC,EAAE;MACtB,OAAOa,iBAAiB,CAAC;QAAEc,KAAK;QAAEG,MAAM,EAAEH,KAAK,CAACI,aAAa;QAAEH,IAAI,EAAEtC,aAAa,CAAC2C;MAAS,CAAE,CAAC;;EAEnG,CAAC;EACD,MAAMC,WAAW,GAAIP,KAA0C,IAAI;IACjEf,iBAAiB,CAAC;MAAEe,KAAK;MAAEX,IAAI,EAAEX,MAAM,GAAGW,IAAI,GAAG,CAACA,IAAI;MAAEY,IAAI,EAAEtC,aAAa,CAAC6C,KAAK;MAAEL,MAAM,EAAEH,KAAK,CAACI;IAAa,CAAE,CAAC;EACnH,CAAC;EAED,MAAMK,WAAW,GAAG1D,gBAAgB,CAAEiD,KAAuC,IAAI;IAC/ElB,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAGkB,KAAK,CAAC;IAEhB,MAAMU,kBAAkB,GAAGf,UAAU,CAACgB,OAAO,IAAIlD,eAAe,CAACkC,UAAU,CAACgB,OAAO,EAAEX,KAAK,CAACG,MAAc,CAAC;IAC1G,IAAIO,kBAAkB,EAAE;MACtB;;IAEF,MAAME,kBAAkB,GAAGd,UAAU,CAACa,OAAO,IAAIlD,eAAe,CAACqC,UAAU,CAACa,OAAO,EAAEX,KAAK,CAACG,MAAc,CAAC;IAC1G,IAAIS,kBAAkB,EAAE;MACtB;;IAEF,MAAMC,gBAAgB,GAAGhB,aAAa,CAACc,OAAO,IAAIlD,eAAe,CAACoC,aAAa,CAACc,OAAO,EAAEX,KAAK,CAACG,MAAc,CAAC;IAC9GlB,iBAAiB,CAAC;MAChBe,KAAK;MACLX,IAAI,EAAEX,MAAM,GAAGW,IAAI,GAAG,CAACA,IAAI;MAC3BY,IAAI,EAAEY,gBAAgB,GAAGlD,aAAa,CAACmD,eAAe,GAAGnD,aAAa,CAACoD,KAAK;MAC5EZ,MAAM,EAAEH,KAAK,CAACI;KACf,CAAC;IACFlB,iBAAiB,CAAC;MAAEc,KAAK;MAAEG,MAAM,EAAEH,KAAK,CAACI,aAAa;MAAEH,IAAI,EAAEtC,aAAa,CAACoD;IAAK,CAAE,CAAC;EACtF,CAAC,CAAC;EAEF,MAAMC,aAAa,GAAGjE,gBAAgB,CAAEiD,KAA0C,IAAI;IACpFjB,SAAS,aAATA,SAAS,uBAATA,SAAS,CAAGiB,KAAK,CAAC;IAClB,IAAIA,KAAK,CAACI,aAAa,KAAKJ,KAAK,CAACG,MAAM,EAAE;MACxC;;IAEF,IAAIH,KAAK,CAACiB,kBAAkB,EAAE,EAAE;MAC9B;;IAEF,QAAQjB,KAAK,CAACkB,GAAG;MACf,KAAK5D,KAAK;QACR,OAAOiD,WAAW,CAACP,KAAK,CAAC;MAC3B,KAAK7C,UAAU;QACb,OAAO4C,gBAAgB,CAACC,KAAK,CAAC;MAChC,KAAK9C,SAAS;QACZ,OAAOmD,eAAe,CAACL,KAAK,CAAC;MAC/B,KAAK3C,GAAG;QACN,OAAO6B,iBAAiB,CAAC;UAAEc,KAAK;UAAEC,IAAI,EAAEtC,aAAa,CAACwD,GAAG;UAAEhB,MAAM,EAAEH,KAAK,CAACI;QAAa,CAAE,CAAC;MAC3F,KAAK7C,IAAI;QACP,OAAO2B,iBAAiB,CAAC;UAAEc,KAAK;UAAEC,IAAI,EAAEtC,aAAa,CAACyD,IAAI;UAAEjB,MAAM,EAAEH,KAAK,CAACI;QAAa,CAAE,CAAC;MAC5F,KAAKhD,OAAO;QACV,OAAO8B,iBAAiB,CAAC;UAAEc,KAAK;UAAEC,IAAI,EAAEtC,aAAa,CAAC0D,OAAO;UAAElB,MAAM,EAAEH,KAAK,CAACI;QAAa,CAAE,CAAC;MAC/F,KAAKnD,SAAS;QACZ,OAAOiC,iBAAiB,CAAC;UAAEc,KAAK;UAAEC,IAAI,EAAEtC,aAAa,CAAC2D,SAAS;UAAEnB,MAAM,EAAEH,KAAK,CAACI;QAAa,CAAE,CAAC;IAAC;IAEpG,MAAMmB,oBAAoB,GACxBvB,KAAK,CAACkB,GAAG,CAACM,MAAM,KAAK,CAAC,IAAIxB,KAAK,CAACkB,GAAG,CAACO,KAAK,CAAC,IAAI,CAAC,IAAI,CAACzB,KAAK,CAAC0B,MAAM,IAAI,CAAC1B,KAAK,CAAC2B,OAAO,IAAI,CAAC3B,KAAK,CAAC4B,OAAO;IACtG,IAAIL,oBAAoB,EAAE;MACxB,OAAOrC,iBAAiB,CAAC;QAAEc,KAAK;QAAEG,MAAM,EAAEH,KAAK,CAACI,aAAa;QAAEH,IAAI,EAAEtC,aAAa,CAACkE;MAAS,CAAE,CAAC;;EAEnG,CAAC,CAAC;EAEF,MAAM,CAACC,gBAAgB,EAAEC,iBAAiB,CAAC,GAAGvF,KAAK,CAACwF,QAAQ,CAAC,KAAK,CAAC;EACnE,MAAMC,WAAW,GAAGlF,gBAAgB,CAAEiD,KAA2B,IAAI;IACnE,MAAMY,kBAAkB,GAAGd,UAAU,CAACa,OAAO,IAAIlD,eAAe,CAACqC,UAAU,CAACa,OAAO,EAAEX,KAAK,CAACG,MAAc,CAAC;IAC1G,IAAI,CAACS,kBAAkB,EAAE;MACvBmB,iBAAiB,CAAC,IAAI,CAAC;;EAE3B,CAAC,CAAC;EACF,MAAMG,WAAW,GAAGnF,gBAAgB,CAAEiD,KAA2B,IAAI;IACnE,MAAMY,kBAAkB,GAAGd,UAAU,CAACa,OAAO,IAAIlD,eAAe,CAACqC,UAAU,CAACa,OAAO,EAAEX,KAAK,CAACG,MAAc,CAAC;IAC1G,IAAI,CAACS,kBAAkB,EAAE;MACvBmB,iBAAiB,CAAC,KAAK,CAAC;;EAE5B,CAAC,CAAC;EAEF;EACA;EACAvF,KAAK,CAAC2F,SAAS,CAAC,MAAK;IACnB,IAAIxC,UAAU,CAACgB,OAAO,EAAE;MACtB,MAAMyB,cAAc,GAAIpC,KAAiB,IAAI;QAC3C+B,iBAAiB,CAACtE,eAAe,CAACkC,UAAU,CAACgB,OAAO,EAAEX,KAAK,CAACqC,aAAqB,CAAC,CAAC;MACrF,CAAC;MACD5C,cAAc,aAAdA,cAAc,uBAAdA,cAAc,CAAE6C,gBAAgB,CAAC,UAAU,EAAEF,cAAc,EAAE;QAAEG,OAAO,EAAE;MAAI,CAAE,CAAC;MAC/E,OAAO,MAAK;QACV9C,cAAc,aAAdA,cAAc,uBAAdA,cAAc,CAAE+C,mBAAmB,CAAC,UAAU,EAAEJ,cAAc,CAAC;MACjE,CAAC;;EAEL,CAAC,EAAE,CAAC3C,cAAc,CAAC,CAAC;EAEpB,OAAO;IACLf,MAAM;IACNW,IAAI;IACJhB,KAAK;IACLoE,UAAU,EAAE,OAAO;IACnBX,gBAAgB,EAAElD,OAAO,GAAGkD,gBAAgB,GAAG,KAAK;IACpDY,UAAU,EAAE;MACVpE,OAAO,EAAE,KAAK;MACdqE,IAAI,EAAE,KAAK;MACXnE,UAAU,EAAE,MAAM;MAClBI,OAAO,EAAE,MAAM;MACfL,OAAO,EAAE;KACV;IACDA,OAAO,EAAE5B,gBAAgB,CAAC4B,OAAO,EAAE;MACjCqE,QAAQ,EAAEC,OAAO,CAAC7E,eAAe,CAAC;MAClC8E,YAAY,EAAE;QACZ/E,QAAQ,EAAEC,eAAe;QACzBF,GAAG,EAAEN,aAAa,CAACsC,UAAU,EAAEpD,mBAAmB,CAAC6B,OAAO,CAAC,GAAGA,OAAO,CAACT,GAAG,GAAGa,SAAS;;KAExF,CAAC;IACFL,OAAO,EAAE3B,gBAAgB,CAAC2B,OAAO,EAAE;MACjCsE,QAAQ,EAAE,IAAI;MACdE,YAAY,EAAE;QACZ/E;;KAEH,CAAC;IACF4E,IAAI,EAAElG,qBAAqB,CAACoC,EAAE,EAAE;MAC9BkE,QAAQ,EAAE,CAAC,CAAC;MACZ,GAAG/D,IAAI;MACPG,EAAE;MACFrB,GAAG;MACHC,QAAQ,EAAE,IAAI;MACd,YAAY,EAAEM,KAAK;MACnB,eAAe,EAAEe,QAAQ,GAAGC,IAAI,GAAGV,SAAS;MAC5CqE,IAAI,EAAE,UAAU;MAChBlE,OAAO,EAAE2B,WAAW;MACpB1B,SAAS,EAAEiC,aAAa;MACxBiC,WAAW,EAAErE,OAAO,GAAGqD,WAAW,GAAGtD,SAAS;MAC9CuE,OAAO,EAAEtE,OAAO,GAAGqD,WAAW,GAAGtD,SAAS;MAC1CwE,UAAU,EAAEvE,OAAO,GAAGsD,WAAW,GAAGvD,SAAS;MAC7CyE,MAAM,EAAExE,OAAO,GAAGsD,WAAW,GAAGvD;KACjC,CAAC;IACFH,UAAU,EAAE7B,gBAAgB,CAAC6B,UAAU,EAAE;MACvCoE,QAAQ,EAAExD,QAAQ;MAClB0D,YAAY,EAAE;QACZ/E,QAAQ,eAAEvB,KAAA,CAAA6G,aAAA,CAACxG,qBAAqB;UAACyG,KAAK,EAAEtG,sBAAsB,CAAC0C,kBAAkB;QAAC,EAAI;QACtF,aAAa,EAAE,IAAI;QACnB5B,GAAG,EAAEN,aAAa,CAACd,mBAAmB,CAAC8B,UAAU,CAAC,GAAGA,UAAU,CAACV,GAAG,GAAGa,SAAS,EAAEkB,aAAa;;KAEjG,CAAC;IACFjB,OAAO,EAAEjC,gBAAgB,CAACiC,OAAO,EAAE;MACjCkE,YAAY,EAAE;QACZhF,GAAG,EAAEN,aAAa,CAACd,mBAAmB,CAACkC,OAAO,CAAC,GAAGA,OAAO,CAACd,GAAG,GAAGa,SAAS,EAAEgB,UAAU;;KAExF;GACF;AACH,CAAC"}
1	+ {"version":3,"names":["React","getNativeElementProps","isResolvedShorthand","resolveShorthand","useId","ChevronRight12Regular","useFluent_unstable","useEventCallback","expandIconInlineStyles","ArrowDown","ArrowLeft","ArrowRight","ArrowUp","End","Enter","Home","useMergedRefs","elementContains","useTreeContext_unstable","treeDataTypes","useTreeItem_unstable","props","ref","children","subtreeChildren","Children","toArray","contextLevel","ctx","level","content","subtree","expandIcon","leaf","isLeaf","undefined","actions","as","onClick","onKeyDown","rest","requestOpenChange","requestNavigation","id","isBranch","open","openItems","has","dir","targetDocument","expandIconRotation","actionsRef","useRef","expandIconRef","subtreeRef","handleArrowRight","event","type","arrowRight","target","currentTarget","handleArrowLeft","arrowLeft","handleEnter","enter","handleClick","isEventFromActions","current","isEventFromSubtree","isFromExpandIcon","expandIconClick","click","handleKeyDown","isDefaultPrevented","key","end","home","arrowUp","arrowDown","isTypeAheadCharacter","length","match","altKey","ctrlKey","metaKey","typeAhead","isActionsVisible","setActionsVisible","useState","showActions","hideActions","useEffect","handleFocusOut","relatedTarget","addEventListener","passive","removeEventListener","buttonSize","components","root","required","Boolean","defaultProps","tabIndex","role","onMouseOver","onFocus","onMouseOut","onBlur","createElement","style"],"sources":["../../../src/components/TreeItem/useTreeItem.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, isResolvedShorthand, resolveShorthand, useId } from '@fluentui/react-utilities';\nimport { ChevronRight12Regular } from '@fluentui/react-icons';\nimport { useFluent_unstable } from '@fluentui/react-shared-contexts';\nimport { useEventCallback } from '@fluentui/react-utilities';\nimport { expandIconInlineStyles } from './useTreeItemStyles';\nimport { ArrowDown, ArrowLeft, ArrowRight, ArrowUp, End, Enter, Home } from '@fluentui/keyboard-keys';\nimport { useMergedRefs } 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 const useTreeItem_unstable = (props: TreeItemProps, ref: React.Ref<HTMLDivElement>): TreeItemState => {\n const [children, subtreeChildren] = React.Children.toArray(props.children);\n\n const contextLevel = useTreeContext_unstable(ctx => ctx.level);\n const {\n content,\n subtree,\n expandIcon,\n leaf: isLeaf = subtreeChildren === undefined,\n actions,\n as = 'div',\n onClick,\n onKeyDown,\n ['aria-level']: level = contextLevel,\n ...rest\n } = props;\n\n const requestOpenChange = useTreeContext_unstable(ctx => ctx.requestOpenChange);\n const requestNavigation = useTreeContext_unstable(ctx => ctx.requestNavigation);\n\n const id = useId('fui-TreeItem-', props.id);\n\n const isBranch = !isLeaf;\n\n const open = useTreeContext_unstable(ctx => isBranch && ctx.openItems.has(id));\n const { dir, targetDocument } = useFluent_unstable();\n const expandIconRotation = open ? 90 : dir !== 'rtl' ? 0 : 180;\n\n const actionsRef = React.useRef<HTMLElement>(null);\n const expandIconRef = React.useRef<HTMLElement>(null);\n const subtreeRef = React.useRef<HTMLElement>(null);\n\n const handleArrowRight = (event: React.KeyboardEvent<HTMLDivElement>) => {\n if (!open && isBranch) {\n return requestOpenChange({ event, open: true, type: treeDataTypes.arrowRight, target: event.currentTarget });\n }\n if (open && isBranch) {\n return requestNavigation({ event, type: treeDataTypes.arrowRight, target: event.currentTarget });\n }\n };\n const handleArrowLeft = (event: React.KeyboardEvent<HTMLDivElement>) => {\n if (open && isBranch) {\n return requestOpenChange({ event, open: false, type: treeDataTypes.arrowLeft, target: event.currentTarget });\n }\n if (!open && level > 1) {\n return requestNavigation({ event, target: event.currentTarget, type: treeDataTypes.arrowLeft });\n }\n };\n const handleEnter = (event: React.KeyboardEvent<HTMLDivElement>) => {\n requestOpenChange({ event, open: isLeaf ? open : !open, type: treeDataTypes.enter, target: event.currentTarget });\n };\n\n const handleClick = useEventCallback((event: React.MouseEvent<HTMLDivElement>) => {\n onClick?.(event);\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 requestOpenChange({\n event,\n open: isLeaf ? open : !open,\n type: isFromExpandIcon ? treeDataTypes.expandIconClick : treeDataTypes.click,\n target: event.currentTarget,\n });\n requestNavigation({ event, target: event.currentTarget, type: treeDataTypes.click });\n });\n\n const handleKeyDown = useEventCallback((event: React.KeyboardEvent<HTMLDivElement>) => {\n onKeyDown?.(event);\n if (event.currentTarget !== event.target) {\n return;\n }\n if (event.isDefaultPrevented()) {\n return;\n }\n switch (event.key) {\n case Enter:\n return handleEnter(event);\n case ArrowRight:\n return handleArrowRight(event);\n case ArrowLeft:\n return handleArrowLeft(event);\n case End:\n return requestNavigation({ event, type: treeDataTypes.end, target: event.currentTarget });\n case Home:\n return requestNavigation({ event, type: treeDataTypes.home, target: event.currentTarget });\n case ArrowUp:\n return requestNavigation({ event, type: treeDataTypes.arrowUp, target: event.currentTarget });\n case ArrowDown:\n return requestNavigation({ event, type: treeDataTypes.arrowDown, target: event.currentTarget });\n }\n const isTypeAheadCharacter =\n event.key.length === 1 && event.key.match(/\\w/) && !event.altKey && !event.ctrlKey && !event.metaKey;\n if (isTypeAheadCharacter) {\n return requestNavigation({ event, target: event.currentTarget, type: treeDataTypes.typeAhead });\n }\n });\n\n const [isActionsVisible, setActionsVisible] = React.useState(false);\n const showActions = useEventCallback((event: React.SyntheticEvent) => {\n const isEventFromSubtree = subtreeRef.current && elementContains(subtreeRef.current, event.target as Node);\n if (!isEventFromSubtree) {\n setActionsVisible(true);\n }\n });\n const hideActions = useEventCallback((event: React.SyntheticEvent) => {\n const isEventFromSubtree = subtreeRef.current && elementContains(subtreeRef.current, event.target as Node);\n if (!isEventFromSubtree) {\n setActionsVisible(false);\n }\n });\n\n // Listens to focusout event on the document to ensure treeitem actions visibility on portal scenarios\n // TODO: find a better way to ensure this behavior\n React.useEffect(() => {\n if (actionsRef.current) {\n const handleFocusOut = (event: FocusEvent) => {\n setActionsVisible(elementContains(actionsRef.current, event.relatedTarget as Node));\n };\n targetDocument?.addEventListener('focusout', handleFocusOut, { passive: true });\n return () => {\n targetDocument?.removeEventListener('focusout', handleFocusOut);\n };\n }\n }, [targetDocument]);\n\n return {\n isLeaf,\n open,\n level,\n buttonSize: 'small',\n isActionsVisible: actions ? isActionsVisible : false,\n components: {\n content: 'div',\n root: 'div',\n expandIcon: 'span',\n actions: 'span',\n subtree: 'span',\n },\n subtree: resolveShorthand(subtree, {\n required: Boolean(subtreeChildren),\n defaultProps: {\n children: subtreeChildren,\n ref: useMergedRefs(subtreeRef, isResolvedShorthand(subtree) ? subtree.ref : undefined),\n },\n }),\n content: resolveShorthand(content, {\n required: true,\n defaultProps: {\n children,\n },\n }),\n root: getNativeElementProps(as, {\n tabIndex: -1,\n ...rest,\n id,\n ref,\n children: null,\n 'aria-level': level,\n 'aria-expanded': isBranch ? open : undefined,\n role: 'treeitem',\n onClick: handleClick,\n onKeyDown: handleKeyDown,\n onMouseOver: actions ? showActions : undefined,\n onFocus: actions ? showActions : undefined,\n onMouseOut: actions ? hideActions : undefined,\n onBlur: actions ? hideActions : undefined,\n }),\n expandIcon: resolveShorthand(expandIcon, {\n required: isBranch,\n defaultProps: {\n children: <ChevronRight12Regular style={expandIconInlineStyles[expandIconRotation]} />,\n 'aria-hidden': true,\n ref: useMergedRefs(isResolvedShorthand(expandIcon) ? expandIcon.ref : undefined, expandIconRef),\n },\n }),\n actions: resolveShorthand(actions, {\n defaultProps: {\n ref: useMergedRefs(isResolvedShorthand(actions) ? actions.ref : undefined, actionsRef),\n },\n }),\n };\n};\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,qBAAqB,EAAEC,mBAAmB,EAAEC,gBAAgB,EAAEC,KAAK,QAAQ;AACpF,SAASC,qBAAqB,QAAQ;AACtC,SAASC,kBAAkB,QAAQ;AACnC,SAASC,gBAAgB,QAAQ;AACjC,SAASC,sBAAsB,QAAQ;AACvC,SAASC,SAAS,EAAEC,SAAS,EAAEC,UAAU,EAAEC,OAAO,EAAEC,GAAG,EAAEC,KAAK,EAAEC,IAAI,QAAQ;AAC5E,SAASC,aAAa,QAAQ;AAC9B,SAASC,eAAe,QAAQ;AAEhC,SAASC,uBAAuB,QAAQ;AACxC,SAASC,aAAa,QAAQ;AAE9B;;;;;;;;;AASA,OAAO,MAAMC,oBAAA,GAAuBA,CAACC,KAAA,EAAsBC,GAAA,KAAkD;EAC3G,MAAM,CAACC,QAAA,EAAUC,eAAA,CAAgB,GAAGxB,KAAA,CAAMyB,QAAQ,CAACC,OAAO,CAACL,KAAA,CAAME,QAAQ;EAEzE,MAAMI,YAAA,GAAeT,uBAAA,CAAwBU,GAAA,IAAOA,GAAA,CAAIC,KAAK;EAC7D,MAAM;IACJC,OAAA;IACAC,OAAA;IACAC,UAAA;IACAC,IAAA,EAAMC,MAAA,GAASV,eAAA,KAAoBW,SAAS;IAC5CC,OAAA;IACAC,EAAA,GAAK;IACLC,OAAA;IACAC,SAAA;IACA,CAAC,eAAeV,KAAA,GAAQF,YAAY;IACpC,GAAGa;EAAA,CACJ,GAAGnB,KAAA;EAEJ,MAAMoB,iBAAA,GAAoBvB,uBAAA,CAAwBU,GAAA,IAAOA,GAAA,CAAIa,iBAAiB;EAC9E,MAAMC,iBAAA,GAAoBxB,uBAAA,CAAwBU,GAAA,IAAOA,GAAA,CAAIc,iBAAiB;EAE9E,MAAMC,EAAA,GAAKvC,KAAA,CAAM,iBAAiBiB,KAAA,CAAMsB,EAAE;EAE1C,MAAMC,QAAA,GAAW,CAACV,MAAA;EAElB,MAAMW,IAAA,GAAO3B,uBAAA,CAAwBU,GAAA,IAAOgB,QAAA,IAAYhB,GAAA,CAAIkB,SAAS,CAACC,GAAG,CAACJ,EAAA;EAC1E,MAAM;IAAEK,GAAA;IAAKC;EAAc,CAAE,GAAG3C,kBAAA;EAChC,MAAM4C,kBAAA,GAAqBL,IAAA,GAAO,KAAKG,GAAA,KAAQ,QAAQ,IAAI,GAAG;EAE9D,MAAMG,UAAA,GAAanD,KAAA,CAAMoD,MAAM,CAAc,IAAI;EACjD,MAAMC,aAAA,GAAgBrD,KAAA,CAAMoD,MAAM,CAAc,IAAI;EACpD,MAAME,UAAA,GAAatD,KAAA,CAAMoD,MAAM,CAAc,IAAI;EAEjD,MAAMG,gBAAA,GAAoBC,KAAA,IAA+C;IACvE,IAAI,CAACX,IAAA,IAAQD,QAAA,EAAU;MACrB,OAAOH,iBAAA,CAAkB;QAAEe,KAAA;QAAOX,IAAA,EAAM,IAAI;QAAEY,IAAA,EAAMtC,aAAA,CAAcuC,UAAU;QAAEC,MAAA,EAAQH,KAAA,CAAMI;MAAc;IAC5G;IACA,IAAIf,IAAA,IAAQD,QAAA,EAAU;MACpB,OAAOF,iBAAA,CAAkB;QAAEc,KAAA;QAAOC,IAAA,EAAMtC,aAAA,CAAcuC,UAAU;QAAEC,MAAA,EAAQH,KAAA,CAAMI;MAAc;IAChG;EACF;EACA,MAAMC,eAAA,GAAmBL,KAAA,IAA+C;IACtE,IAAIX,IAAA,IAAQD,QAAA,EAAU;MACpB,OAAOH,iBAAA,CAAkB;QAAEe,KAAA;QAAOX,IAAA,EAAM,KAAK;QAAEY,IAAA,EAAMtC,aAAA,CAAc2C,SAAS;QAAEH,MAAA,EAAQH,KAAA,CAAMI;MAAc;IAC5G;IACA,IAAI,CAACf,IAAA,IAAQhB,KAAA,GAAQ,GAAG;MACtB,OAAOa,iBAAA,CAAkB;QAAEc,KAAA;QAAOG,MAAA,EAAQH,KAAA,CAAMI,aAAa;QAAEH,IAAA,EAAMtC,aAAA,CAAc2C;MAAU;IAC/F;EACF;EACA,MAAMC,WAAA,GAAeP,KAAA,IAA+C;IAClEf,iBAAA,CAAkB;MAAEe,KAAA;MAAOX,IAAA,EAAMX,MAAA,GAASW,IAAA,GAAO,CAACA,IAAI;MAAEY,IAAA,EAAMtC,aAAA,CAAc6C,KAAK;MAAEL,MAAA,EAAQH,KAAA,CAAMI;IAAc;EACjH;EAEA,MAAMK,WAAA,GAAc1D,gBAAA,CAAkBiD,KAAA,IAA4C;IAChFlB,OAAA,aAAAA,OAAA,uBAAAA,OAAA,CAAUkB,KAAA;IAEV,MAAMU,kBAAA,GAAqBf,UAAA,CAAWgB,OAAO,IAAIlD,eAAA,CAAgBkC,UAAA,CAAWgB,OAAO,EAAEX,KAAA,CAAMG,MAAM;IACjG,IAAIO,kBAAA,EAAoB;MACtB;IACF;IACA,MAAME,kBAAA,GAAqBd,UAAA,CAAWa,OAAO,IAAIlD,eAAA,CAAgBqC,UAAA,CAAWa,OAAO,EAAEX,KAAA,CAAMG,MAAM;IACjG,IAAIS,kBAAA,EAAoB;MACtB;IACF;IACA,MAAMC,gBAAA,GAAmBhB,aAAA,CAAcc,OAAO,IAAIlD,eAAA,CAAgBoC,aAAA,CAAcc,OAAO,EAAEX,KAAA,CAAMG,MAAM;IACrGlB,iBAAA,CAAkB;MAChBe,KAAA;MACAX,IAAA,EAAMX,MAAA,GAASW,IAAA,GAAO,CAACA,IAAI;MAC3BY,IAAA,EAAMY,gBAAA,GAAmBlD,aAAA,CAAcmD,eAAe,GAAGnD,aAAA,CAAcoD,KAAK;MAC5EZ,MAAA,EAAQH,KAAA,CAAMI;IAChB;IACAlB,iBAAA,CAAkB;MAAEc,KAAA;MAAOG,MAAA,EAAQH,KAAA,CAAMI,aAAa;MAAEH,IAAA,EAAMtC,aAAA,CAAcoD;IAAM;EACpF;EAEA,MAAMC,aAAA,GAAgBjE,gBAAA,CAAkBiD,KAAA,IAA+C;IACrFjB,SAAA,aAAAA,SAAA,uBAAAA,SAAA,CAAYiB,KAAA;IACZ,IAAIA,KAAA,CAAMI,aAAa,KAAKJ,KAAA,CAAMG,MAAM,EAAE;MACxC;IACF;IACA,IAAIH,KAAA,CAAMiB,kBAAkB,IAAI;MAC9B;IACF;IACA,QAAQjB,KAAA,CAAMkB,GAAG;MACf,KAAK5D,KAAA;QACH,OAAOiD,WAAA,CAAYP,KAAA;MACrB,KAAK7C,UAAA;QACH,OAAO4C,gBAAA,CAAiBC,KAAA;MAC1B,KAAK9C,SAAA;QACH,OAAOmD,eAAA,CAAgBL,KAAA;MACzB,KAAK3C,GAAA;QACH,OAAO6B,iBAAA,CAAkB;UAAEc,KAAA;UAAOC,IAAA,EAAMtC,aAAA,CAAcwD,GAAG;UAAEhB,MAAA,EAAQH,KAAA,CAAMI;QAAc;MACzF,KAAK7C,IAAA;QACH,OAAO2B,iBAAA,CAAkB;UAAEc,KAAA;UAAOC,IAAA,EAAMtC,aAAA,CAAcyD,IAAI;UAAEjB,MAAA,EAAQH,KAAA,CAAMI;QAAc;MAC1F,KAAKhD,OAAA;QACH,OAAO8B,iBAAA,CAAkB;UAAEc,KAAA;UAAOC,IAAA,EAAMtC,aAAA,CAAc0D,OAAO;UAAElB,MAAA,EAAQH,KAAA,CAAMI;QAAc;MAC7F,KAAKnD,SAAA;QACH,OAAOiC,iBAAA,CAAkB;UAAEc,KAAA;UAAOC,IAAA,EAAMtC,aAAA,CAAc2D,SAAS;UAAEnB,MAAA,EAAQH,KAAA,CAAMI;QAAc;IAAA;IAEjG,MAAMmB,oBAAA,GACJvB,KAAA,CAAMkB,GAAG,CAACM,MAAM,KAAK,KAAKxB,KAAA,CAAMkB,GAAG,CAACO,KAAK,CAAC,SAAS,CAACzB,KAAA,CAAM0B,MAAM,IAAI,CAAC1B,KAAA,CAAM2B,OAAO,IAAI,CAAC3B,KAAA,CAAM4B,OAAO;IACtG,IAAIL,oBAAA,EAAsB;MACxB,OAAOrC,iBAAA,CAAkB;QAAEc,KAAA;QAAOG,MAAA,EAAQH,KAAA,CAAMI,aAAa;QAAEH,IAAA,EAAMtC,aAAA,CAAckE;MAAU;IAC/F;EACF;EAEA,MAAM,CAACC,gBAAA,EAAkBC,iBAAA,CAAkB,GAAGvF,KAAA,CAAMwF,QAAQ,CAAC,KAAK;EAClE,MAAMC,WAAA,GAAclF,gBAAA,CAAkBiD,KAAA,IAAgC;IACpE,MAAMY,kBAAA,GAAqBd,UAAA,CAAWa,OAAO,IAAIlD,eAAA,CAAgBqC,UAAA,CAAWa,OAAO,EAAEX,KAAA,CAAMG,MAAM;IACjG,IAAI,CAACS,kBAAA,EAAoB;MACvBmB,iBAAA,CAAkB,IAAI;IACxB;EACF;EACA,MAAMG,WAAA,GAAcnF,gBAAA,CAAkBiD,KAAA,IAAgC;IACpE,MAAMY,kBAAA,GAAqBd,UAAA,CAAWa,OAAO,IAAIlD,eAAA,CAAgBqC,UAAA,CAAWa,OAAO,EAAEX,KAAA,CAAMG,MAAM;IACjG,IAAI,CAACS,kBAAA,EAAoB;MACvBmB,iBAAA,CAAkB,KAAK;IACzB;EACF;EAEA;EACA;EACAvF,KAAA,CAAM2F,SAAS,CAAC,MAAM;IACpB,IAAIxC,UAAA,CAAWgB,OAAO,EAAE;MACtB,MAAMyB,cAAA,GAAkBpC,KAAA,IAAsB;QAC5C+B,iBAAA,CAAkBtE,eAAA,CAAgBkC,UAAA,CAAWgB,OAAO,EAAEX,KAAA,CAAMqC,aAAa;MAC3E;MACA5C,cAAA,aAAAA,cAAA,uBAAAA,cAAA,CAAgB6C,gBAAgB,CAAC,YAAYF,cAAA,EAAgB;QAAEG,OAAA,EAAS;MAAK;MAC7E,OAAO,MAAM;QACX9C,cAAA,aAAAA,cAAA,uBAAAA,cAAA,CAAgB+C,mBAAmB,CAAC,YAAYJ,cAAA;MAClD;IACF;EACF,GAAG,CAAC3C,cAAA,CAAe;EAEnB,OAAO;IACLf,MAAA;IACAW,IAAA;IACAhB,KAAA;IACAoE,UAAA,EAAY;IACZX,gBAAA,EAAkBlD,OAAA,GAAUkD,gBAAA,GAAmB,KAAK;IACpDY,UAAA,EAAY;MACVpE,OAAA,EAAS;MACTqE,IAAA,EAAM;MACNnE,UAAA,EAAY;MACZI,OAAA,EAAS;MACTL,OAAA,EAAS;IACX;IACAA,OAAA,EAAS5B,gBAAA,CAAiB4B,OAAA,EAAS;MACjCqE,QAAA,EAAUC,OAAA,CAAQ7E,eAAA;MAClB8E,YAAA,EAAc;QACZ/E,QAAA,EAAUC,eAAA;QACVF,GAAA,EAAKN,aAAA,CAAcsC,UAAA,EAAYpD,mBAAA,CAAoB6B,OAAA,IAAWA,OAAA,CAAQT,GAAG,GAAGa,SAAS;MACvF;IACF;IACAL,OAAA,EAAS3B,gBAAA,CAAiB2B,OAAA,EAAS;MACjCsE,QAAA,EAAU,IAAI;MACdE,YAAA,EAAc;QACZ/E;MACF;IACF;IACA4E,IAAA,EAAMlG,qBAAA,CAAsBoC,EAAA,EAAI;MAC9BkE,QAAA,EAAU,CAAC;MACX,GAAG/D,IAAI;MACPG,EAAA;MACArB,GAAA;MACAC,QAAA,EAAU,IAAI;MACd,cAAcM,KAAA;MACd,iBAAiBe,QAAA,GAAWC,IAAA,GAAOV,SAAS;MAC5CqE,IAAA,EAAM;MACNlE,OAAA,EAAS2B,WAAA;MACT1B,SAAA,EAAWiC,aAAA;MACXiC,WAAA,EAAarE,OAAA,GAAUqD,WAAA,GAActD,SAAS;MAC9CuE,OAAA,EAAStE,OAAA,GAAUqD,WAAA,GAActD,SAAS;MAC1CwE,UAAA,EAAYvE,OAAA,GAAUsD,WAAA,GAAcvD,SAAS;MAC7CyE,MAAA,EAAQxE,OAAA,GAAUsD,WAAA,GAAcvD;IAClC;IACAH,UAAA,EAAY7B,gBAAA,CAAiB6B,UAAA,EAAY;MACvCoE,QAAA,EAAUxD,QAAA;MACV0D,YAAA,EAAc;QACZ/E,QAAA,eAAUvB,KAAA,CAAA6G,aAAA,CAACxG,qBAAA;UAAsByG,KAAA,EAAOtG,sBAAsB,CAAC0C,kBAAA;;QAC/D,eAAe,IAAI;QACnB5B,GAAA,EAAKN,aAAA,CAAcd,mBAAA,CAAoB8B,UAAA,IAAcA,UAAA,CAAWV,GAAG,GAAGa,SAAS,EAAEkB,aAAA;MACnF;IACF;IACAjB,OAAA,EAASjC,gBAAA,CAAiBiC,OAAA,EAAS;MACjCkE,YAAA,EAAc;QACZhF,GAAA,EAAKN,aAAA,CAAcd,mBAAA,CAAoBkC,OAAA,IAAWA,OAAA,CAAQd,GAAG,GAAGa,SAAS,EAAEgB,UAAA;MAC7E;IACF;EACF;AACF"}

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

	@@ -1 +1 @@
1	- {"version":3,"names":["React","useTreeItemContextValues_unstable","state","buttonSize","isActionsVisible","treeItem","useMemo","button","size"],"sources":["~~../~~src/~~packages/react-~~components/~~react-tree/src/components/~~TreeItem/useTreeItemContextValues.ts"],"sourcesContent":["import * as React from 'react';\nimport type { ButtonContextValue } from '@fluentui/react-button';\nimport type { TreeItemContextValue } from '../../contexts';\nimport type { TreeItemContextValues, TreeItemState } from './TreeItem.types';\n\nexport function useTreeItemContextValues_unstable(\n state: Pick<TreeItemState, 'buttonSize' \| 'isActionsVisible'>,\n): TreeItemContextValues {\n const { buttonSize, isActionsVisible } = state;\n\n const treeItem = React.useMemo<TreeItemContextValue>(() => ({ isActionsVisible }), [isActionsVisible]);\n const button = React.useMemo<ButtonContextValue>(() => ({ size: buttonSize }), [buttonSize]);\n\n return { treeItem, button };\n}\n"],"mappings":"AAAA,~~OAAO~~,~~KAAKA~~,~~KAAK~~,~~MAAM,~~OAAO~~;AAK9B~~,~~OAAM~~,~~SAAUC~~,~~iCAAiCA~~,~~CAC/CC,KAA6D~~;~~EAE7D~~,MAAM;IAAEC,~~UAAU~~;~~IAAEC~~;EAAgB,CAAE,GAAGF,~~KAAK~~;~~EAE9C~~,MAAMG,~~QAAQ~~,~~GAAGL~~,~~KAAK~~,~~CAACM~~,OAAO,CAAuB,OAAO;IAAEF;~~EAAgB~~,~~CAAE~~,~~CAAC,EAAE,~~CAACA,~~gBAAgB~~,~~CAAC,CAAC~~;~~EACtG~~,MAAMG,~~MAAM~~,~~GAAGP~~,~~KAAK~~,~~CAACM~~,OAAO,CAAqB,OAAO;IAAEE,~~IAAI~~,~~EAAEL~~;~~EAAU~~,~~CAAE~~,~~CAAC,EAAE,~~CAACA,~~UAAU~~,~~CAAC,CAAC~~;~~EAE5F~~,OAAO;IAAEE,~~QAAQ~~;~~IAAEE~~;~~EAAM,CAAE~~;~~AAC7B~~"}
1	+ {"version":3,"names":["React","useTreeItemContextValues_unstable","state","buttonSize","isActionsVisible","treeItem","useMemo","button","size"],"sources":["../../../src/components/TreeItem/useTreeItemContextValues.ts"],"sourcesContent":["import * as React from 'react';\nimport type { ButtonContextValue } from '@fluentui/react-button';\nimport type { TreeItemContextValue } from '../../contexts';\nimport type { TreeItemContextValues, TreeItemState } from './TreeItem.types';\n\nexport function useTreeItemContextValues_unstable(\n state: Pick<TreeItemState, 'buttonSize' \| 'isActionsVisible'>,\n): TreeItemContextValues {\n const { buttonSize, isActionsVisible } = state;\n\n const treeItem = React.useMemo<TreeItemContextValue>(() => ({ isActionsVisible }), [isActionsVisible]);\n const button = React.useMemo<ButtonContextValue>(() => ({ size: buttonSize }), [buttonSize]);\n\n return { treeItem, button };\n}\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AAKvB,OAAO,SAASC,kCACdC,KAA6D,EACtC;EACvB,MAAM;IAAEC,UAAA;IAAYC;EAAgB,CAAE,GAAGF,KAAA;EAEzC,MAAMG,QAAA,GAAWL,KAAA,CAAMM,OAAO,CAAuB,OAAO;IAAEF;EAAiB,IAAI,CAACA,gBAAA,CAAiB;EACrG,MAAMG,MAAA,GAASP,KAAA,CAAMM,OAAO,CAAqB,OAAO;IAAEE,IAAA,EAAML;EAAW,IAAI,CAACA,UAAA,CAAW;EAE3F,OAAO;IAAEE,QAAA;IAAUE;EAAO;AAC5B"}

package/lib/components/TreeItem/useTreeItemStyles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["__styles","mergeClasses","shorthands","tokens","createFocusOutlineStyle","useTreeContext_unstable","treeItemLevelToken","treeItemClassNames","root","content","subtree","expandIcon","actions","useRootStyles","level1","iytv0q","level2","level3","level4","level5","level6","level7","level8","level9","level10","d","useContentStyles","base","qhf8xq","Bceei9c","mc9l5x","De3pzq","sj55zd","z189sj","uwmqm3","Bbmb7ep","Beyfa6y","B7oj6ja","Btl43ni","lj723h","ecr2s2","Ixpawx","Bi91k9c","Jwef8y","B0t702g","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","subtle","transparent","leaf","a","h","f","i","useExpandIconStyles","Bt984gj","Brf1p80","Bf4jedk","B7ck84d","z8tnut","Byoj8tv","useActionsStyles","Frg6f3","open","expandIconInlineStyles","transform","useTreeItemStyles_unstable","state","rootStyles","contentStyles","expandIconStyles","actionsStyles","appearance","ctx","isActionsVisible","showActions","level","className","isStaticallyDefinedLevel","isLeaf"],"sources":["~~../~~src/~~packages/react-~~components/~~react-tree/src/components/~~TreeItem/useTreeItemStyles.ts"],"sourcesContent":["import { GriffelStyle, makeStyles, mergeClasses, shorthands } 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 { useTreeContext_unstable } from '../../contexts/index';\nimport { treeItemLevelToken } from '../../utils/tokens';\n\nexport const treeItemClassNames: SlotClassNames<TreeItemSlots> = {\n root: 'fui-TreeItem',\n content: 'fui-TreeItem__content',\n subtree: 'fui-TreeItem__subtree',\n expandIcon: 'fui-TreeItem__expandIcon',\n actions: 'fui-TreeItem__actions',\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});\n\n/*\n Styles for the content slot\n /\nconst useContentStyles = makeStyles({\n base: {\n position: 'relative',\n cursor: 'pointer',\n display: 'flex',\n backgroundColor: tokens.colorSubtleBackground,\n color: tokens.colorNeutralForeground2,\n paddingRight: tokens.spacingHorizontalNone,\n paddingLeft: `calc((var(${treeItemLevelToken}, 1) - 1) ${tokens.spacingHorizontalXXL})`,\n ...shorthands.borderRadius(tokens.borderRadiusMedium),\n ':active': {\n color: tokens.colorNeutralForeground2Pressed,\n backgroundColor: tokens.colorSubtleBackgroundPressed,\n // TODO: stop using treeItemClassNames.expandIcon for styling\n [`& .${treeItemClassNames.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 [`& .${treeItemClassNames.expandIcon}`]: {\n color: tokens.colorNeutralForeground3Hover,\n },\n },\n },\n focusIndicator: createFocusOutlineStyle(),\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 leaf: {\n paddingLeft: `calc(var(${treeItemLevelToken}, 1) * ${tokens.spacingHorizontalXXL})`,\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.padding(tokens.spacingVerticalXS, 0),\n },\n});\n\n/\n Styles for the action icon slot\n /\nconst useActionsStyles = makeStyles({\n base: {\n display: 'none',\n marginLeft: 'auto',\n ...shorthands.padding(0, tokens.spacingHorizontalS),\n },\n open: {\n display: 'flex',\n position: 'relative',\n },\n});\n\nexport const expandIconInlineStyles = {\n 90: { transform: `rotate(90deg)` },\n 0: { transform: `rotate(0deg)` },\n 180: { transform: `rotate(180deg)` },\n} as const;\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 const contentStyles = useContentStyles();\n const expandIconStyles = useExpandIconStyles();\n const actionsStyles = useActionsStyles();\n\n const appearance = useTreeContext_unstable(ctx => ctx.appearance);\n\n const { actions, subtree, expandIcon, isActionsVisible: showActions, level } = state;\n\n state.root.className = mergeClasses(\n treeItemClassNames.root,\n isStaticallyDefinedLevel(level) && rootStyles[`level${level}` as StaticLevelProperty],\n state.root.className,\n );\n\n state.content.className = mergeClasses(\n treeItemClassNames.content,\n contentStyles.base,\n contentStyles[appearance],\n contentStyles.focusIndicator,\n state.isLeaf && contentStyles.leaf,\n state.content.className,\n );\n\n if (expandIcon) {\n expandIcon.className = mergeClasses(treeItemClassNames.expandIcon, expandIconStyles.base, expandIcon.className);\n }\n if (actions) {\n actions.className = mergeClasses(\n treeItemClassNames.actions,\n actionsStyles.base,\n showActions && actionsStyles.open,\n actions.className,\n );\n }\n if (subtree) {\n subtree.className = mergeClasses(treeItemClassNames.subtree, subtree.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,EAAEC,UAAU,QAAQ~~,gBAAgB~~;~~AAGnF~~,SAASC,MAAM,QAAQ~~,uBAAuB~~;~~AAC9C~~,SAASC,uBAAuB,QAAQ~~,yBAAyB~~;~~AACjE~~,SAASC,uBAAuB,QAAQ~~,sBAAsB~~;~~AAC9D~~,SAASC,kBAAkB,QAAQ~~,oBAAoB~~;~~AAEvD~~,OAAO,MAAMC,~~kBAAkB~~,~~GAAkC~~;EAC/DC,~~IAAI~~,~~EAAE,cAAc~~;~~EACpBC~~,~~OAAO~~,~~EAAE,uBAAuB~~;~~EAChCC~~,~~OAAO~~,~~EAAE,uBAAuB~~;~~EAChCC~~,~~UAAU~~,~~EAAE,0BAA0B~~;~~EACtCC~~,~~OAAO~~,~~EAAE~~;~~CACV~~;~~AAKD~~,MAAMC,~~aAAa~~,~~gBAAGb~~,QAAA;EAAAc,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;AAAA;EAAAU,CAAA;AAAA,~~EAOpB~~;~~AAEF~~;;;AAGA,MAAMC,~~gBAAgB~~,~~gBAAG1B~~,QAAA;EAAA2B,IAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;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;EAAAC,MAAA;EAAA;IAAAjC,MAAA;IAAAH,MAAA;EAAA;EAAAqC,WAAA;IAAA9C,MAAA;IAAAY,MAAA;IAAAH,MAAA;EAAA;EAAAsC,IAAA;IAAA5C,MAAA;EAAA;AAAA;EAAAT,CAAA;EAAAsD,CAAA;EAAAC,CAAA;EAAAC,CAAA;EAAAC,CAAA;AAAA,~~EAkDvB~~;~~AAEF~~;;;AAGA,MAAMC,~~mBAAmB~~,~~gBAAGnF~~,QAAA;EAAA2B,IAAA;IAAAG,MAAA;IAAAsD,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAvD,MAAA;IAAAwD,MAAA;IAAAvD,MAAA;IAAAwD,OAAA;IAAAvD,MAAA;EAAA;AAAA;EAAAT,CAAA;AAAA,~~EAU1B~~;~~AAEF~~;;;AAGA,MAAMiE,~~gBAAgB~~,~~gBAAG1F~~,QAAA;EAAA2B,IAAA;IAAAG,MAAA;IAAA6D,MAAA;IAAAH,MAAA;IAAAvD,MAAA;IAAAwD,OAAA;IAAAvD,MAAA;EAAA;EAAA0D,IAAA;IAAA9D,MAAA;IAAAF,MAAA;EAAA;AAAA;EAAAH,CAAA;AAAA,~~EAUvB~~;~~AAEF~~,OAAO,MAAMoE,~~sBAAsB~~,~~GAAG~~;EACpC,~~EAAE,EAAE~~;IAAEC,~~SAAS~~,~~EAAE~~;EAAe~~,CAAE~~;~~EAClC~~,~~CAAC,EAAE~~;IAAEA,~~SAAS~~,~~EAAE~~;EAAc~~,CAAE~~;~~EAChC~~,~~GAAG,EAAE~~;IAAEA,~~SAAS~~,~~EAAE~~;EAAgB;~~CAC1B~~;~~AAEV~~;;;AAGA,OAAO,MAAMC,~~0BAA0B~~,~~GAAIC~~,~~KAAoB~~,~~IAAmB~~;~~EAChF~~,MAAMC,~~UAAU~~,~~GAAGpF~~,~~aAAa,EAAE~~;~~EAClC~~,MAAMqF,~~aAAa~~,~~GAAGxE~~,~~gBAAgB,EAAE~~;~~EACxC~~,MAAMyE,~~gBAAgB~~,~~GAAGhB~~,~~mBAAmB,EAAE~~;~~EAC9C~~,MAAMiB,~~aAAa~~,~~GAAGV~~,~~gBAAgB,EAAE~~;~~EAExC~~,MAAMW,~~UAAU~~,~~GAAGhG~~,~~uBAAuB~~,~~CAACiG~~,~~GAAG~~,~~IAAIA~~,~~GAAG~~,~~CAACD~~,UAAU~~,CAAC~~;~~EAEjE~~,MAAM;IAAEzF,~~OAAO~~;~~IAAEF~~,~~OAAO~~;~~IAAEC~~,~~UAAU~~;~~IAAE4F~~,~~gBAAgB~~,~~EAAEC~~,~~WAAW~~;~~IAAEC~~;EAAK,CAAE,GAAGT,~~KAAK~~;~~EAEpFA~~,~~KAAK~~,~~CAACxF~~,IAAI,CAACkG,SAAS,GAAGzG,~~YAAY~~,~~CACjCM~~,~~kBAAkB~~,~~CAACC~~,IAAI,EACvBmG,~~wBAAwB~~,~~CAACF~~,~~KAAK~~,~~CAAC~~,~~IAAIR,~~UAAU,~~CAAC~~,~~QAAQQ~~,~~KAAK~~,~~EAAyB~~,~~CAAC~~,EACrFT,~~KAAK~~,~~CAACxF~~,IAAI,CAACkG,SAAS~~,CACrB~~;~~EAEDV~~,~~KAAK~~,~~CAACvF~~,OAAO,CAACiG,SAAS,GAAGzG,~~YAAY~~,~~CACpCM~~,~~kBAAkB~~,~~CAACE~~,OAAO,EAC1ByF,~~aAAa~~,~~CAACvE~~,IAAI,EAClBuE,aAAa,CAACG,~~UAAU~~,~~CAAC~~,EACzBH,~~aAAa~~,~~CAACrD~~,cAAc,EAC5BmD,~~KAAK~~,~~CAACY~~,MAAM,IAAIV,~~aAAa~~,~~CAACpB~~,IAAI,EAClCkB,~~KAAK~~,~~CAACvF~~,OAAO,CAACiG,SAAS~~,CACxB~~;~~EAED~~,IAAI/F,~~UAAU~~,~~EAAE~~;IACdA,~~UAAU~~,~~CAAC~~+F,SAAS,GAAGzG,~~YAAY~~,~~CAACM~~,~~kBAAkB~~,~~CAACI~~,UAAU,EAAEwF,~~gBAAgB~~,~~CAACxE~~,IAAI,EAAEhB,~~UAAU~~,~~CAAC~~+F,SAAS,~~CAAC;;EAEjH,~~IAAI9F,~~OAAO~~,~~EAAE~~;IACXA,~~OAAO~~,~~CAAC8F~~,SAAS,GAAGzG,~~YAAY~~,~~CAC9BM~~,~~kBAAkB~~,~~CAACK~~,OAAO,EAC1BwF,~~aAAa~~,~~CAACzE~~,IAAI,EAClB6E,~~WAAW~~,~~IAAIJ~~,~~aAAa~~,~~CAACR~~,IAAI,EACjChF,~~OAAO~~,~~CAAC8F~~,SAAS,~~CAClB;;EAEH,~~IAAIhG,~~OAAO~~,~~EAAE~~;IACXA,~~OAAO~~,~~CAACgG~~,SAAS,GAAGzG,~~YAAY~~,~~CAACM~~,~~kBAAkB~~,~~CAACG~~,OAAO,EAAEA,~~OAAO~~,~~CAACgG~~,SAAS,~~CAAC;;EAGjF,~~OAAOV,~~KAAK~~;~~AACd,CAAC~~;~~AAED~~,SAASW,~~wBAAwBA~~,~~CAACF~~,~~KAAa~~;~~EAC7C~~,OAAOA,~~KAAK~~,~~IAAI~~,~~CAAC~~,~~IAAIA~~,~~KAAK,IAAI,EAAE~~;~~AAClC~~"}
1	+ {"version":3,"names":["__styles","mergeClasses","shorthands","tokens","createFocusOutlineStyle","useTreeContext_unstable","treeItemLevelToken","treeItemClassNames","root","content","subtree","expandIcon","actions","useRootStyles","level1","iytv0q","level2","level3","level4","level5","level6","level7","level8","level9","level10","d","useContentStyles","base","qhf8xq","Bceei9c","mc9l5x","De3pzq","sj55zd","z189sj","uwmqm3","Bbmb7ep","Beyfa6y","B7oj6ja","Btl43ni","lj723h","ecr2s2","Ixpawx","Bi91k9c","Jwef8y","B0t702g","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","subtle","transparent","leaf","a","h","f","i","useExpandIconStyles","Bt984gj","Brf1p80","Bf4jedk","B7ck84d","z8tnut","Byoj8tv","useActionsStyles","Frg6f3","open","expandIconInlineStyles","transform","useTreeItemStyles_unstable","state","rootStyles","contentStyles","expandIconStyles","actionsStyles","appearance","ctx","isActionsVisible","showActions","level","className","isStaticallyDefinedLevel","isLeaf"],"sources":["../../../src/components/TreeItem/useTreeItemStyles.ts"],"sourcesContent":["import { GriffelStyle, makeStyles, mergeClasses, shorthands } 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 { useTreeContext_unstable } from '../../contexts/index';\nimport { treeItemLevelToken } from '../../utils/tokens';\n\nexport const treeItemClassNames: SlotClassNames<TreeItemSlots> = {\n root: 'fui-TreeItem',\n content: 'fui-TreeItem__content',\n subtree: 'fui-TreeItem__subtree',\n expandIcon: 'fui-TreeItem__expandIcon',\n actions: 'fui-TreeItem__actions',\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});\n\n/*\n Styles for the content slot\n /\nconst useContentStyles = makeStyles({\n base: {\n position: 'relative',\n cursor: 'pointer',\n display: 'flex',\n backgroundColor: tokens.colorSubtleBackground,\n color: tokens.colorNeutralForeground2,\n paddingRight: tokens.spacingHorizontalNone,\n paddingLeft: `calc((var(${treeItemLevelToken}, 1) - 1) ${tokens.spacingHorizontalXXL})`,\n ...shorthands.borderRadius(tokens.borderRadiusMedium),\n ':active': {\n color: tokens.colorNeutralForeground2Pressed,\n backgroundColor: tokens.colorSubtleBackgroundPressed,\n // TODO: stop using treeItemClassNames.expandIcon for styling\n [`& .${treeItemClassNames.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 [`& .${treeItemClassNames.expandIcon}`]: {\n color: tokens.colorNeutralForeground3Hover,\n },\n },\n },\n focusIndicator: createFocusOutlineStyle(),\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 leaf: {\n paddingLeft: `calc(var(${treeItemLevelToken}, 1) * ${tokens.spacingHorizontalXXL})`,\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.padding(tokens.spacingVerticalXS, 0),\n },\n});\n\n/\n Styles for the action icon slot\n /\nconst useActionsStyles = makeStyles({\n base: {\n display: 'none',\n marginLeft: 'auto',\n ...shorthands.padding(0, tokens.spacingHorizontalS),\n },\n open: {\n display: 'flex',\n position: 'relative',\n },\n});\n\nexport const expandIconInlineStyles = {\n 90: { transform: `rotate(90deg)` },\n 0: { transform: `rotate(0deg)` },\n 180: { transform: `rotate(180deg)` },\n} as const;\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 const contentStyles = useContentStyles();\n const expandIconStyles = useExpandIconStyles();\n const actionsStyles = useActionsStyles();\n\n const appearance = useTreeContext_unstable(ctx => ctx.appearance);\n\n const { actions, subtree, expandIcon, isActionsVisible: showActions, level } = state;\n\n state.root.className = mergeClasses(\n treeItemClassNames.root,\n isStaticallyDefinedLevel(level) && rootStyles[`level${level}` as StaticLevelProperty],\n state.root.className,\n );\n\n state.content.className = mergeClasses(\n treeItemClassNames.content,\n contentStyles.base,\n contentStyles[appearance],\n contentStyles.focusIndicator,\n state.isLeaf && contentStyles.leaf,\n state.content.className,\n );\n\n if (expandIcon) {\n expandIcon.className = mergeClasses(treeItemClassNames.expandIcon, expandIconStyles.base, expandIcon.className);\n }\n if (actions) {\n actions.className = mergeClasses(\n treeItemClassNames.actions,\n actionsStyles.base,\n showActions && actionsStyles.open,\n actions.className,\n );\n }\n if (subtree) {\n subtree.className = mergeClasses(treeItemClassNames.subtree, subtree.className);\n }\n\n return state;\n};\n\nfunction isStaticallyDefinedLevel(level: number): level is StaticLevel {\n return level >= 1 && level <= 10;\n}\n"],"mappings":"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"}

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

	@@ -1 +1 @@
1	- {"version":3,"names":["React","useTreeItemLayout_unstable","renderTreeItemLayout_unstable","useTreeItemLayoutStyles_unstable","TreeItemLayout","forwardRef","props","ref","state","displayName"],"sources":["~~../~~src/~~packages/react-~~components/~~react-tree/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';\nimport type { TreeItemLayoutProps } from './TreeItemLayout.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/*\n TreeItemLayout component - TODO: add more docs\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,~~OAAO~~,~~KAAKA~~,~~KAAK,MAAM,OAAO~~;~~AAC9B~~,SAASC,0BAA0B,QAAQ~~,qBAAqB~~;~~AAChE~~,SAASC,6BAA6B,QAAQ~~,wBAAwB~~;~~AACtE~~,SAASC,gCAAgC,QAAQ~~,2BAA2B~~;~~AAI5E~~;;;AAGA,OAAO,MAAMC,~~cAAc~~,~~gBAA6CJ~~,~~KAAK~~,~~CAACK~~,UAAU,CAAC,CAACC,~~KAAK~~,~~EAAEC~~,~~GAAG~~,~~KAAI~~;~~EACtG~~,MAAMC,~~KAAK~~,~~GAAGP~~,~~0BAA0B~~,~~CAACK~~,~~KAAK~~,~~EAAEC~~,~~GAAG,CAAC~~;~~EAEpDJ~~,~~gCAAgC~~,~~CAACK~~,~~KAAK,CAAC~~;~~EACvC~~,OAAON,~~6BAA6B~~,~~CAACM~~,~~KAAK,CAAC~~;~~AAC7C,CAAC,CAAC~~;~~AAEFJ~~,~~cAAc~~,~~CAACK~~,WAAW,GAAG~~,gBAAgB~~"}
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';\nimport type { TreeItemLayoutProps } from './TreeItemLayout.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/*\n TreeItemLayout component - TODO: add more docs\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;;;AAGA,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"}

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

	@@ -1 +1 @@
1	- {"version":3,"~~file~~":~~"TreeItemLayout.types.js"~~,"~~sourceRoot":"../src/","~~sources":["~~packages/react-components/react-tree/~~src/components/TreeItemLayout/TreeItemLayout.types.ts"],"~~names":[],"mappings":"","~~sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport { TreeItemContextValue } from '../../contexts/treeItemContext';\n\nexport type TreeItemLayoutSlots = {\n root: Slot<'div'>;\n /*\n Icon slot that renders right before main content\n /\n iconBefore?: Slot<'span'>;\n /\n Icon slot that renders right after main content\n /\n iconAfter?: Slot<'span'>;\n aside?: Slot<'span'>;\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> & TreeItemContextValue;\n"]}
1	+ {"version":3,"names":[],"sources":["../../../src/components/TreeItemLayout/TreeItemLayout.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport { TreeItemContextValue } from '../../contexts/treeItemContext';\n\nexport type TreeItemLayoutSlots = {\n root: Slot<'div'>;\n /*\n Icon slot that renders right before main content\n /\n iconBefore?: Slot<'span'>;\n /\n Icon slot that renders right after main content\n /\n iconAfter?: Slot<'span'>;\n aside?: Slot<'span'>;\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> & TreeItemContextValue;\n"],"mappings":"AAAA"}

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

	@@ -1 +1 @@
1	- {"version":3,"~~file~~":~~"index.js"~~,"~~sourceRoot":"../src/","~~sources":["~~packages/react-components/react-tree/~~src/components/TreeItemLayout/index.ts"],"~~names":[],"mappings":"AAAA,cAAc,kBAAkB,CAAC;AACjC,cAAc,wBAAwB,CAAC;AACvC,cAAc,wBAAwB,CAAC;AACvC,cAAc,qBAAqB,CAAC;AACpC,cAAc,2BAA2B,CAAC","~~sourcesContent":["export * from './TreeItemLayout';\nexport * from './TreeItemLayout.types';\nexport * from './renderTreeItemLayout';\nexport * from './useTreeItemLayout';\nexport * from './useTreeItemLayoutStyles';\n"]}
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';\n"],"mappings":"AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc"}

package/lib/components/TreeItemLayout/renderTreeItemLayout.js CHANGED Viewed

@@ -11,14 +11,6 @@ export const renderTreeItemLayout_unstable = state => {
     slots,
     slotProps
   } = getSlots(state);
-  return /*#__PURE__*/React.createElement(slots.root, {
-    ...slotProps.root
-  }, slots.iconBefore && /*#__PURE__*/React.createElement(slots.iconBefore, {
-    ...slotProps.iconBefore
-  }), slotProps.root.children, slots.iconAfter && /*#__PURE__*/React.createElement(slots.iconAfter, {
-    ...slotProps.iconAfter
-  }), !isActionsVisible && slots.aside && /*#__PURE__*/React.createElement(slots.aside, {
-    ...slotProps.aside
-  }));
+  return /*#__PURE__*/React.createElement(slots.root, slotProps.root, slots.iconBefore && /*#__PURE__*/React.createElement(slots.iconBefore, slotProps.iconBefore), slotProps.root.children, slots.iconAfter && /*#__PURE__*/React.createElement(slots.iconAfter, slotProps.iconAfter), !isActionsVisible && slots.aside && /*#__PURE__*/React.createElement(slots.aside, slotProps.aside));
 };
 //# sourceMappingURL=renderTreeItemLayout.js.map

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

	@@ -1 +1 @@
1	- {"version":3,"names":["React","getSlots","renderTreeItemLayout_unstable","state","isActionsVisible","slots","slotProps","createElement","root","iconBefore","children","iconAfter","aside"],"sources":["~~../~~src/~~packages/react-~~components/~~react-tree/src/components/~~TreeItemLayout/renderTreeItemLayout.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } 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 { isActionsVisible } = state;\n const { slots, slotProps } = getSlots<TreeItemLayoutSlots>(state);\n return (\n <slots.root {...slotProps.root}>\n {slots.iconBefore && <slots.iconBefore {...slotProps.iconBefore} />}\n {slotProps.root.children}\n {slots.iconAfter && <slots.iconAfter {...slotProps.iconAfter} />}\n {!isActionsVisible && slots.aside && <slots.aside {...slotProps.aside} />}\n </slots.root>\n );\n};\n"],"mappings":"AAAA,~~OAAO~~,~~KAAKA~~,~~KAAK,MAAM,OAAO~~;~~AAC9B~~,SAASC,QAAQ,QAAQ~~,2BAA2B~~;~~AAGpD~~;;;AAGA,OAAO,MAAMC,~~6BAA6B~~,~~GAAIC~~,~~KAA0B~~,~~IAAI~~;~~EAC1E~~,MAAM;IAAEC;EAAgB,CAAE,GAAGD,~~KAAK~~;~~EAClC~~,MAAM;IAAEE,~~KAAK~~;~~IAAEC~~;EAAS,CAAE,GAAGL,~~QAAQ~~,~~CAAsBE~~,~~KAAK,CAAC~~;~~EACjE~~,oBACEH,KAAA,CAAAO,aAAA,CAACF,~~KAAK~~,~~CAACG~~,IAAI~~;IAAA~~,~~GAAKF~~,~~SAAS~~,~~CAACE;EAAI~~,~~GAC3BH~~,~~KAAK~~,~~CAACI~~,UAAU,iBAAIT,KAAA,CAAAO,aAAA,CAACF,~~KAAK~~,~~CAACI~~,UAAU~~;IAAA~~,~~GAAKH~~,~~SAAS~~,~~CAACG;EAAU~~,~~EAAI~~,~~EAClEH~~,~~SAAS~~,~~CAACE~~,IAAI,CAACE,QAAQ,EACvBL,~~KAAK~~,~~CAACM~~,SAAS,iBAAIX,KAAA,CAAAO,aAAA,CAACF,~~KAAK~~,~~CAACM~~,SAAS~~;IAAA~~,~~GAAKL~~,~~SAAS~~,~~CAACK;EAAS~~,~~EAAI~~,~~EAC/D~~,CAACP,~~gBAAgB~~,~~IAAIC~~,~~KAAK~~,~~CAACO~~,KAAK,iBAAIZ,KAAA,CAAAO,aAAA,CAACF,~~KAAK~~,~~CAACO~~,KAAK~~;IAAA~~,~~GAAKN~~,~~SAAS~~,~~CAACM;EAAK~~,~~EAAI,CAC9D~~;~~AAEjB,CAAC~~"}
1	+ {"version":3,"names":["React","getSlots","renderTreeItemLayout_unstable","state","isActionsVisible","slots","slotProps","createElement","root","iconBefore","children","iconAfter","aside"],"sources":["../../../src/components/TreeItemLayout/renderTreeItemLayout.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } 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 { isActionsVisible } = state;\n const { slots, slotProps } = getSlots<TreeItemLayoutSlots>(state);\n return (\n <slots.root {...slotProps.root}>\n {slots.iconBefore && <slots.iconBefore {...slotProps.iconBefore} />}\n {slotProps.root.children}\n {slots.iconAfter && <slots.iconAfter {...slotProps.iconAfter} />}\n {!isActionsVisible && slots.aside && <slots.aside {...slotProps.aside} />}\n </slots.root>\n );\n};\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,QAAQ,QAAQ;AAGzB;;;AAGA,OAAO,MAAMC,6BAAA,GAAiCC,KAAA,IAA+B;EAC3E,MAAM;IAAEC;EAAgB,CAAE,GAAGD,KAAA;EAC7B,MAAM;IAAEE,KAAA;IAAOC;EAAS,CAAE,GAAGL,QAAA,CAA8BE,KAAA;EAC3D,oBACEH,KAAA,CAAAO,aAAA,CAACF,KAAA,CAAMG,IAAI,EAAKF,SAAA,CAAUE,IAAI,EAC3BH,KAAA,CAAMI,UAAU,iBAAIT,KAAA,CAAAO,aAAA,CAACF,KAAA,CAAMI,UAAU,EAAKH,SAAA,CAAUG,UAAU,GAC9DH,SAAA,CAAUE,IAAI,CAACE,QAAQ,EACvBL,KAAA,CAAMM,SAAS,iBAAIX,KAAA,CAAAO,aAAA,CAACF,KAAA,CAAMM,SAAS,EAAKL,SAAA,CAAUK,SAAS,GAC3D,CAACP,gBAAA,IAAoBC,KAAA,CAAMO,KAAK,iBAAIZ,KAAA,CAAAO,aAAA,CAACF,KAAA,CAAMO,KAAK,EAAKN,SAAA,CAAUM,KAAK;AAG3E"}

package/lib/components/TreeItemLayout/useTreeItemLayout.js CHANGED Viewed

@@ -1,3 +1,4 @@
+import * as React from 'react';
 import { getNativeElementProps, resolveShorthand } from '@fluentui/react-utilities';
 import { useTreeItemContext_unstable } from '../../contexts/treeItemContext';
 /**

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

	@@ -1 +1 @@
1	- {"version":3,"names":["getNativeElementProps","resolveShorthand","useTreeItemContext_unstable","useTreeItemLayout_unstable","props","ref","iconAfter","iconBefore","aside","as","treeItemContext","components","root","defaultProps"],"sources":["~~../~~src/~~packages/react-~~components/~~react-tree/src/components/~~TreeItemLayout/useTreeItemLayout.ts"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, resolveShorthand } from '@fluentui/react-utilities';\nimport type { TreeItemLayoutProps, TreeItemLayoutState } from './TreeItemLayout.types';\nimport { useTreeItemContext_unstable } from '../../contexts/treeItemContext';\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, aside, as = 'div' } = props;\n const treeItemContext = useTreeItemContext_unstable();\n\n return {\n ...treeItemContext,\n components: {\n root: 'div',\n iconBefore: 'span',\n iconAfter: 'span',\n aside: 'span',\n },\n root: getNativeElementProps(as, { ...props, ref }),\n iconBefore: resolveShorthand(iconBefore, { defaultProps: { 'aria-hidden': true } }),\n iconAfter: resolveShorthand(iconAfter, { defaultProps: { 'aria-hidden': true } }),\n aside: resolveShorthand(aside, { defaultProps: { 'aria-hidden': true } }),\n };\n};\n"],"mappings":"~~AACA~~,~~SAASA~~,qBAAqB,EAAEC,gBAAgB,QAAQ~~,2BAA2B~~;~~AAEnF~~,SAASC,2BAA2B,QAAQ~~,gCAAgC~~;~~AAE5E~~;;;;;;;;;AASA,OAAO,MAAMC,~~0BAA0B~~,~~GAAGA~~,CACxCC,~~KAA0B~~,~~EAC1BC~~,~~GAA2B~~,~~KACJ~~;~~EACvB~~,MAAM;IAAEC,~~SAAS~~;~~IAAEC~~,~~UAAU~~;~~IAAEC~~,~~KAAK~~;~~IAAEC~~,~~EAAE~~,~~GAAG~~;EAAK,CAAE,GAAGL,~~KAAK~~;~~EAC1D~~,MAAMM,~~eAAe~~,~~GAAGR~~,~~2BAA2B,EAAE~~;~~EAErD~~,OAAO;IACL,GAAGQ,eAAe;IAClBC,~~UAAU~~,~~EAAE~~;MACVC,~~IAAI~~,~~EAAE,KAAK~~;~~MACXL~~,~~UAAU~~,~~EAAE,MAAM~~;~~MAClBD~~,~~SAAS~~,~~EAAE,MAAM~~;~~MACjBE~~,~~KAAK~~,~~EAAE~~;~~KACR~~;~~IACDI~~,~~IAAI~~,~~EAAEZ~~,~~qBAAqB~~,~~CAACS~~,~~EAAE~~,~~EAAE~~;MAAE,GAAGL,KAAK;MAAEC;~~IAAG,CAAE,CAAC~~;~~IAClDE~~,~~UAAU~~,~~EAAEN~~,~~gBAAgB~~,~~CAACM~~,~~UAAU~~,~~EAAE~~;MAAEM,~~YAAY~~,~~EAAE~~;QAAE,~~aAAa,EAAE~~;~~MAAI~~;IAAE~~,CAAE,CAAC~~;~~IACnFP~~,~~SAAS~~,~~EAAEL~~,~~gBAAgB~~,~~CAACK~~,~~SAAS~~,~~EAAE~~;MAAEO,~~YAAY~~,~~EAAE~~;QAAE,~~aAAa,EAAE~~;~~MAAI~~;IAAE~~,CAAE,CAAC~~;~~IACjFL~~,~~KAAK~~,~~EAAEP~~,~~gBAAgB~~,~~CAACO~~,~~KAAK~~,~~EAAE~~;MAAEK,~~YAAY~~,~~EAAE~~;QAAE,~~aAAa,EAAE~~;~~MAAI~~;IAAE~~,CAAE~~;~~GACzE~~;~~AACH,CAAC~~"}
1	+ {"version":3,"names":["React","getNativeElementProps","resolveShorthand","useTreeItemContext_unstable","useTreeItemLayout_unstable","props","ref","iconAfter","iconBefore","aside","as","treeItemContext","components","root","defaultProps"],"sources":["../../../src/components/TreeItemLayout/useTreeItemLayout.ts"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, resolveShorthand } from '@fluentui/react-utilities';\nimport type { TreeItemLayoutProps, TreeItemLayoutState } from './TreeItemLayout.types';\nimport { useTreeItemContext_unstable } from '../../contexts/treeItemContext';\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, aside, as = 'div' } = props;\n const treeItemContext = useTreeItemContext_unstable();\n\n return {\n ...treeItemContext,\n components: {\n root: 'div',\n iconBefore: 'span',\n iconAfter: 'span',\n aside: 'span',\n },\n root: getNativeElementProps(as, { ...props, ref }),\n iconBefore: resolveShorthand(iconBefore, { defaultProps: { 'aria-hidden': true } }),\n iconAfter: resolveShorthand(iconAfter, { defaultProps: { 'aria-hidden': true } }),\n aside: resolveShorthand(aside, { defaultProps: { 'aria-hidden': true } }),\n };\n};\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,qBAAqB,EAAEC,gBAAgB,QAAQ;AAExD,SAASC,2BAA2B,QAAQ;AAE5C;;;;;;;;;AASA,OAAO,MAAMC,0BAAA,GAA6BA,CACxCC,KAAA,EACAC,GAAA,KACwB;EACxB,MAAM;IAAEC,SAAA;IAAWC,UAAA;IAAYC,KAAA;IAAOC,EAAA,GAAK;EAAK,CAAE,GAAGL,KAAA;EACrD,MAAMM,eAAA,GAAkBR,2BAAA;EAExB,OAAO;IACL,GAAGQ,eAAe;IAClBC,UAAA,EAAY;MACVC,IAAA,EAAM;MACNL,UAAA,EAAY;MACZD,SAAA,EAAW;MACXE,KAAA,EAAO;IACT;IACAI,IAAA,EAAMZ,qBAAA,CAAsBS,EAAA,EAAI;MAAE,GAAGL,KAAK;MAAEC;IAAI;IAChDE,UAAA,EAAYN,gBAAA,CAAiBM,UAAA,EAAY;MAAEM,YAAA,EAAc;QAAE,eAAe;MAAK;IAAE;IACjFP,SAAA,EAAWL,gBAAA,CAAiBK,SAAA,EAAW;MAAEO,YAAA,EAAc;QAAE,eAAe;MAAK;IAAE;IAC/EL,KAAA,EAAOP,gBAAA,CAAiBO,KAAA,EAAO;MAAEK,YAAA,EAAc;QAAE,eAAe;MAAK;IAAE;EACzE;AACF"}

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

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

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

	@@ -1 +1 @@
1	- {"version":3,"names":["React","useTreeItemPersonaLayout_unstable","renderTreeItemPersonaLayout_unstable","useTreeItemPersonaLayoutStyles_unstable","useTreeItemPersonaLayoutContextValues_unstable","TreeItemPersonaLayout","forwardRef","props","ref","state","contextValues","displayName"],"sources":["~~../~~src/~~packages/react-~~components/~~react-tree/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';\nimport type { TreeItemPersonaLayoutProps } from './TreeItemPersonaLayout.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useTreeItemPersonaLayoutContextValues_unstable } from './useTreeItemPersonaLayoutContextValues';\n\n/*\n TreeItemPersonaLayout component - TODO: add more docs\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,~~OAAO~~,~~KAAKA~~,~~KAAK,MAAM,OAAO~~;~~AAC9B~~,SAASC,iCAAiC,QAAQ~~,4BAA4B~~;~~AAC9E~~,SAASC,oCAAoC,QAAQ~~,+BAA+B~~;~~AACpF~~,SAASC,uCAAuC,QAAQ~~,kCAAkC~~;~~AAG1F~~,SAASC,8CAA8C,QAAQ~~,yCAAyC~~;~~AAExG~~;;;AAGA,OAAO,MAAMC,~~qBAAqB~~,~~gBAAoDL~~,~~KAAK~~,~~CAACM~~,UAAU,CAAC,CAACC,~~KAAK~~,~~EAAEC~~,~~GAAG~~,~~KAAI~~;~~EACpH~~,MAAMC,~~KAAK~~,~~GAAGR~~,~~iCAAiC~~,~~CAACM~~,~~KAAK~~,~~EAAEC~~,~~GAAG,CAAC~~;~~EAE3DL~~,~~uCAAuC~~,~~CAACM~~,~~KAAK,CAAC~~;~~EAE9C~~,MAAMC,~~aAAa~~,~~GAAGN~~,~~8CAA8C~~,~~CAACK~~,~~KAAK,CAAC~~;~~EAE3E~~,OAAOP,~~oCAAoC~~,~~CAACO~~,~~KAAK~~,~~EAAEC~~,~~aAAa,CAAC~~;~~AACnE,CAAC,CAAC~~;~~AAEFL~~,~~qBAAqB~~,~~CAACM~~,WAAW,GAAG~~,uBAAuB~~"}
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';\nimport type { TreeItemPersonaLayoutProps } from './TreeItemPersonaLayout.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useTreeItemPersonaLayoutContextValues_unstable } from './useTreeItemPersonaLayoutContextValues';\n\n/*\n TreeItemPersonaLayout component - TODO: add more docs\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;;;AAGA,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"}

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

	@@ -1 +1 @@
1	- {"version":3,"~~file~~":~~"TreeItemPersonaLayout.types.js"~~,"~~sourceRoot":"../src/","~~sources":["~~packages/react-components/react-tree/~~src/components/TreeItemPersonaLayout/TreeItemPersonaLayout.types.ts"],"~~names":[],"mappings":"","~~sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport type { AvatarContextValue, AvatarSize } from '@fluentui/react-avatar';\nimport type { TreeItemContextValue } from '../../contexts/treeItemContext';\n\nexport type TreeItemPersonaLayoutContextValues = {\n avatar: AvatarContextValue;\n};\n\nexport type TreeItemPersonaLayoutSlots = {\n root: Slot<'span'>;\n /*\n Avatar to display.\n /\n media: NonNullable<Slot<'span'>>;\n /\n Main text. Children of the root slot are automatically rendered here\n /\n main: Slot<'span'>;\n /\n Secondary text that describes or complements the main text\n /\n description?: Slot<'span'>;\n /\n aside text that works as extra textual information\n /\n aside?: Slot<'span'>;\n /\n A layout wrapper for the main and description slots\n /\n content: 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 TreeItemContextValue & {\n avatarSize: AvatarSize;\n };\n"]}
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';\nimport type { TreeItemContextValue } from '../../contexts/treeItemContext';\n\nexport type TreeItemPersonaLayoutContextValues = {\n avatar: AvatarContextValue;\n};\n\nexport type TreeItemPersonaLayoutSlots = {\n root: Slot<'span'>;\n /*\n Avatar to display.\n /\n media: NonNullable<Slot<'span'>>;\n /\n Main text. Children of the root slot are automatically rendered here\n /\n main: Slot<'span'>;\n /\n Secondary text that describes or complements the main text\n /\n description?: Slot<'span'>;\n /\n aside text that works as extra textual information\n /\n aside?: Slot<'span'>;\n /\n A layout wrapper for the main and description slots\n /\n content: 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 TreeItemContextValue & {\n avatarSize: AvatarSize;\n };\n"],"mappings":"AAAA"}

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

	@@ -1 +1 @@
1	- {"version":3,"~~file~~":~~"index.js"~~,"~~sourceRoot":"../src/","~~sources":["~~packages/react-components/react-tree/~~src/components/TreeItemPersonaLayout/index.ts"],"~~names":[],"mappings":"AAAA,cAAc,yBAAyB,CAAC;AACxC,cAAc,+BAA+B,CAAC;AAC9C,cAAc,+BAA+B,CAAC;AAC9C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,kCAAkC,CAAC","~~sourcesContent":["export * from './TreeItemPersonaLayout';\nexport * from './TreeItemPersonaLayout.types';\nexport * from './renderTreeItemPersonaLayout';\nexport * from './useTreeItemPersonaLayout';\nexport * from './useTreeItemPersonaLayoutStyles';\n"]}
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';\n"],"mappings":"AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc"}

package/lib/components/TreeItemPersonaLayout/renderTreeItemPersonaLayout.js CHANGED Viewed

@@ -12,20 +12,8 @@ export const renderTreeItemPersonaLayout_unstable = (state, contextValues) => {
     slots,
     slotProps
   } = getSlots(state);
-  return /*#__PURE__*/React.createElement(slots.root, {
-    ...slotProps.root
-  }, slots.media && /*#__PURE__*/React.createElement(AvatarContextProvider, {
+  return /*#__PURE__*/React.createElement(slots.root, slotProps.root, slots.media && /*#__PURE__*/React.createElement(AvatarContextProvider, {
     value: contextValues.avatar
-  }, /*#__PURE__*/React.createElement(slots.media, {
-    ...slotProps.media
-  })), slots.content && /*#__PURE__*/React.createElement(slots.content, {
-    ...slotProps.content
-  }, slots.main && /*#__PURE__*/React.createElement(slots.main, {
-    ...slotProps.main
-  }), slots.description && /*#__PURE__*/React.createElement(slots.description, {
-    ...slotProps.description
-  })), !isActionsVisible && slots.aside && /*#__PURE__*/React.createElement(slots.aside, {
-    ...slotProps.aside
-  }));
+  }, /*#__PURE__*/React.createElement(slots.media, slotProps.media)), slots.content && /*#__PURE__*/React.createElement(slots.content, slotProps.content, slots.main && /*#__PURE__*/React.createElement(slots.main, slotProps.main), slots.description && /*#__PURE__*/React.createElement(slots.description, slotProps.description)), !isActionsVisible && slots.aside && /*#__PURE__*/React.createElement(slots.aside, slotProps.aside));
 };
 //# sourceMappingURL=renderTreeItemPersonaLayout.js.map

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

	@@ -1 +1 @@
1	- {"version":3,"names":["React","getSlots","AvatarContextProvider","renderTreeItemPersonaLayout_unstable","state","contextValues","isActionsVisible","slots","slotProps","createElement","root","media","value","avatar","content","main","description","aside"],"sources":["~~../~~src/~~packages/react-~~components/~~react-tree/src/components/~~TreeItemPersonaLayout/renderTreeItemPersonaLayout.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } 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 { isActionsVisible } = state;\n const { slots, slotProps } = getSlots<TreeItemPersonaLayoutSlots>(state);\n\n return (\n <slots.root {...slotProps.root}>\n {slots.media && (\n <AvatarContextProvider value={contextValues.avatar}>\n <slots.media {...slotProps.media} />\n </AvatarContextProvider>\n )}\n {slots.content && (\n <slots.content {...slotProps.content}>\n {slots.main && <slots.main {...slotProps.main} />}\n {slots.description && <slots.description {...slotProps.description} />}\n </slots.content>\n )}\n {!isActionsVisible && slots.aside && <slots.aside {...slotProps.aside} />}\n </slots.root>\n );\n};\n"],"mappings":"AAAA,~~OAAO~~,~~KAAKA~~,~~KAAK,MAAM,OAAO~~;~~AAC9B~~,SAASC,QAAQ,QAAQ~~,2BAA2B~~;~~AAMpD~~,SAASC,qBAAqB,QAAQ~~,wBAAwB~~;~~AAE9D~~;;;AAGA,OAAO,MAAMC,~~oCAAoC~~,~~GAAGA~~,CAClDC,~~KAAiC~~,~~EACjCC~~,~~aAAiD~~,~~KAC/C~~;~~EACF~~,MAAM;IAAEC;EAAgB,CAAE,GAAGF,~~KAAK~~;~~EAClC~~,MAAM;IAAEG,~~KAAK~~;~~IAAEC~~;EAAS,CAAE,GAAGP,~~QAAQ~~,~~CAA6BG~~,~~KAAK,CAAC~~;~~EAExE~~,oBACEJ,KAAA,CAAAS,aAAA,CAACF,~~KAAK~~,~~CAACG~~,IAAI~~;IAAA~~,~~GAAKF~~,~~SAAS~~,~~CAACE;EAAI~~,~~GAC3BH~~,~~KAAK~~,~~CAACI~~,KAAK,iBACVX,KAAA,CAAAS,aAAA,CAACP,~~qBAAqB~~;~~IAACU~~,~~KAAK~~,~~EAAEP~~,~~aAAa~~,~~CAACQ~~;~~EAAM~~,~~gBAChDb,~~KAAA,CAAAS,aAAA,CAACF,~~KAAK~~,~~CAACI~~,KAAK~~;IAAA~~,~~GAAKH~~,~~SAAS~~,~~CAACG;EAAK~~,~~EAAI~~,~~CAEvC~~,~~EACAJ~~,~~KAAK~~,~~CAACO,~~OAAO,iBACZd,KAAA,CAAAS,aAAA,CAACF,~~KAAK~~,~~CAACO~~,OAAO~~;IAAA~~,~~GAAKN~~,~~SAAS~~,~~CAACM;EAAO~~,~~GACjCP~~,~~KAAK~~,~~CAACQ~~,IAAI,iBAAIf,KAAA,CAAAS,aAAA,CAACF,~~KAAK~~,~~CAACQ~~,IAAI~~;IAAA~~,~~GAAKP~~,~~SAAS~~,~~CAACO;EAAI~~,~~EAAI~~,~~EAChDR~~,~~KAAK~~,~~CAACS~~,WAAW,iBAAIhB,KAAA,CAAAS,aAAA,CAACF,~~KAAK~~,~~CAACS~~,WAAW~~;IAAA~~,~~GAAKR~~,~~SAAS~~,~~CAACQ;EAAW~~,~~EAAI~~,~~CAEzE~~,~~EACA,~~CAACV,~~gBAAgB~~,~~IAAIC~~,~~KAAK~~,~~CAACU~~,KAAK,iBAAIjB,KAAA,CAAAS,aAAA,CAACF,~~KAAK~~,~~CAACU~~,KAAK~~;IAAA~~,~~GAAKT~~,~~SAAS~~,~~CAACS;EAAK~~,~~EAAI,CAC9D~~;~~AAEjB,CAAC~~"}
1	+ {"version":3,"names":["React","getSlots","AvatarContextProvider","renderTreeItemPersonaLayout_unstable","state","contextValues","isActionsVisible","slots","slotProps","createElement","root","media","value","avatar","content","main","description","aside"],"sources":["../../../src/components/TreeItemPersonaLayout/renderTreeItemPersonaLayout.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } 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 { isActionsVisible } = state;\n const { slots, slotProps } = getSlots<TreeItemPersonaLayoutSlots>(state);\n\n return (\n <slots.root {...slotProps.root}>\n {slots.media && (\n <AvatarContextProvider value={contextValues.avatar}>\n <slots.media {...slotProps.media} />\n </AvatarContextProvider>\n )}\n {slots.content && (\n <slots.content {...slotProps.content}>\n {slots.main && <slots.main {...slotProps.main} />}\n {slots.description && <slots.description {...slotProps.description} />}\n </slots.content>\n )}\n {!isActionsVisible && slots.aside && <slots.aside {...slotProps.aside} />}\n </slots.root>\n );\n};\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,QAAQ,QAAQ;AAMzB,SAASC,qBAAqB,QAAQ;AAEtC;;;AAGA,OAAO,MAAMC,oCAAA,GAAuCA,CAClDC,KAAA,EACAC,aAAA,KACG;EACH,MAAM;IAAEC;EAAgB,CAAE,GAAGF,KAAA;EAC7B,MAAM;IAAEG,KAAA;IAAOC;EAAS,CAAE,GAAGP,QAAA,CAAqCG,KAAA;EAElE,oBACEJ,KAAA,CAAAS,aAAA,CAACF,KAAA,CAAMG,IAAI,EAAKF,SAAA,CAAUE,IAAI,EAC3BH,KAAA,CAAMI,KAAK,iBACVX,KAAA,CAAAS,aAAA,CAACP,qBAAA;IAAsBU,KAAA,EAAOP,aAAA,CAAcQ;kBAC1Cb,KAAA,CAAAS,aAAA,CAACF,KAAA,CAAMI,KAAK,EAAKH,SAAA,CAAUG,KAAK,IAGnCJ,KAAA,CAAMO,OAAO,iBACZd,KAAA,CAAAS,aAAA,CAACF,KAAA,CAAMO,OAAO,EAAKN,SAAA,CAAUM,OAAO,EACjCP,KAAA,CAAMQ,IAAI,iBAAIf,KAAA,CAAAS,aAAA,CAACF,KAAA,CAAMQ,IAAI,EAAKP,SAAA,CAAUO,IAAI,GAC5CR,KAAA,CAAMS,WAAW,iBAAIhB,KAAA,CAAAS,aAAA,CAACF,KAAA,CAAMS,WAAW,EAAKR,SAAA,CAAUQ,WAAW,IAGrE,CAACV,gBAAA,IAAoBC,KAAA,CAAMU,KAAK,iBAAIjB,KAAA,CAAAS,aAAA,CAACF,KAAA,CAAMU,KAAK,EAAKT,SAAA,CAAUS,KAAK;AAG3E"}

package/lib/components/TreeItemPersonaLayout/useTreeItemPersonaLayout.js CHANGED Viewed

@@ -1,3 +1,4 @@
+import * as React from 'react';
 import { getNativeElementProps, resolveShorthand } from '@fluentui/react-utilities';
 import { useTreeContext_unstable, useTreeItemContext_unstable } from '../../contexts';
 import { treeAvatarSize } from '../../utils/tokens';

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

	@@ -1 +1 @@
1	- {"version":3,"names":["getNativeElementProps","resolveShorthand","useTreeContext_unstable","useTreeItemContext_unstable","treeAvatarSize","useTreeItemPersonaLayout_unstable","props","ref","media","content","children","main","description","aside","as","size","ctx","isActionsVisible","components","root","avatarSize","required","defaultProps"],"sources":["~~../~~src/~~packages/react-~~components/~~react-tree/src/components/~~TreeItemPersonaLayout/useTreeItemPersonaLayout.ts"],"sourcesContent":["import * as React from 'react';\nimport type { TreeItemPersonaLayoutProps, TreeItemPersonaLayoutState } from './TreeItemPersonaLayout.types';\nimport { getNativeElementProps, resolveShorthand } from '@fluentui/react-utilities';\nimport { useTreeContext_unstable, useTreeItemContext_unstable } from '../../contexts';\nimport { treeAvatarSize } from '../../utils/tokens';\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, aside, as = 'span' } = props;\n const size = useTreeContext_unstable(ctx => ctx.size);\n const { isActionsVisible } = useTreeItemContext_unstable();\n return {\n components: {\n content: 'div',\n main: 'span',\n description: 'span',\n root: 'span',\n media: 'span',\n aside: 'span',\n },\n isActionsVisible,\n avatarSize: treeAvatarSize[size],\n root: getNativeElementProps(as, { ...props, ref }),\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 aside: resolveShorthand(aside),\n };\n};\n"],"mappings":"~~AAEA~~,~~SAASA~~,qBAAqB,EAAEC,gBAAgB,QAAQ~~,2BAA2B~~;~~AACnF~~,SAASC,uBAAuB,EAAEC,2BAA2B,QAAQ~~,gBAAgB~~;~~AACrF~~,SAASC,cAAc,QAAQ~~,oBAAoB~~;~~AAEnD~~;;;;;;;;;AASA,OAAO,MAAMC,~~iCAAiC~~,~~GAAGA~~,CAC/CC,~~KAAiC~~,~~EACjCC~~,~~GAA~~+B~~,KACD~~;~~EAC9B~~,MAAM;IAAEC,~~KAAK~~;~~IAAEC~~,~~OAAO~~;~~IAAEC~~,~~QAAQ~~;~~IAAEC~~,~~IAAI~~;~~IAAEC~~,~~WAAW~~;~~IAAEC~~,~~KAAK~~;~~IAAEC~~,~~EAAE~~,~~GAAG~~;EAAM,CAAE,GAAGR,~~KAAK~~;~~EACjF~~,MAAMS,~~IAAI~~,~~GAAGb~~,~~uBAAuB~~,~~CAACc~~,~~GAAG~~,~~IAAIA~~,~~GAAG~~,~~CAACD~~,IAAI~~,CAAC~~;~~EACrD~~,MAAM;IAAEE;EAAgB,CAAE,GAAGd,~~2BAA2B,EAAE~~;~~EAC1D~~,OAAO;IACLe,~~UAAU~~,~~EAAE~~;MACVT,~~OAAO~~,~~EAAE,KAAK~~;~~MACdE~~,~~IAAI~~,~~EAAE,MAAM~~;~~MACZC~~,~~WAAW~~,~~EAAE,MAAM~~;~~MACnBO~~,~~IAAI~~,~~EAAE,MAAM~~;~~MACZX~~,~~KAAK~~,~~EAAE,MAAM~~;~~MACbK~~,~~KAAK~~,~~EAAE~~;~~KACR~~;~~IACDI~~,~~gBAAgB~~;~~IAChBG~~,~~UAAU~~,~~EAAEhB~~,cAAc,CAACW,~~IAAI~~,~~CAAC~~;IAChCI,~~IAAI~~,~~EAAEnB~~,~~qBAAqB~~,~~CAACc~~,~~EAAE~~,~~EAAE~~;MAAE,GAAGR,KAAK;MAAEC;~~IAAG,CAAE,CAAC~~;~~IAClDI~~,~~IAAI~~,~~EAAEV~~,~~gBAAgB~~,~~CAACU~~,~~IAAI~~,~~EAAE~~;MAAEU,~~QAAQ~~,~~EAAE~~,IAAI;MAAEC,~~YAAY~~,~~EAAE~~;QAAEZ;~~MAAQ~~;IAAE~~,CAAE,CAAC~~;~~IAC5EF~~,~~KAAK~~,~~EAAEP~~,~~gBAAgB~~,~~CAACO~~,~~KAAK~~,~~EAAE~~;MAAEa,~~QAAQ~~,~~EAAE~~;~~IAAI,CAAE,CAAC~~;~~IAClDZ~~,~~OAAO~~,~~EAAER~~,~~gBAAgB~~,~~CAACQ~~,~~OAAO~~,~~EAAE~~;MAAEY,~~QAAQ~~,~~EAAE~~;~~IAAI,CAAE,CAAC~~;~~IACtDT~~,~~WAAW~~,~~EAAEX~~,~~gBAAgB~~,~~CAACW~~,~~WAAW,CAAC~~;~~IAC1CC~~,~~KAAK~~,~~EAAEZ~~,~~gBAAgB~~,~~CAACY~~,~~KAAK~~;~~GAC9B~~;~~AACH,CAAC~~"}
1	+ {"version":3,"names":["React","getNativeElementProps","resolveShorthand","useTreeContext_unstable","useTreeItemContext_unstable","treeAvatarSize","useTreeItemPersonaLayout_unstable","props","ref","media","content","children","main","description","aside","as","size","ctx","isActionsVisible","components","root","avatarSize","required","defaultProps"],"sources":["../../../src/components/TreeItemPersonaLayout/useTreeItemPersonaLayout.ts"],"sourcesContent":["import * as React from 'react';\nimport type { TreeItemPersonaLayoutProps, TreeItemPersonaLayoutState } from './TreeItemPersonaLayout.types';\nimport { getNativeElementProps, resolveShorthand } from '@fluentui/react-utilities';\nimport { useTreeContext_unstable, useTreeItemContext_unstable } from '../../contexts';\nimport { treeAvatarSize } from '../../utils/tokens';\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, aside, as = 'span' } = props;\n const size = useTreeContext_unstable(ctx => ctx.size);\n const { isActionsVisible } = useTreeItemContext_unstable();\n return {\n components: {\n content: 'div',\n main: 'span',\n description: 'span',\n root: 'span',\n media: 'span',\n aside: 'span',\n },\n isActionsVisible,\n avatarSize: treeAvatarSize[size],\n root: getNativeElementProps(as, { ...props, ref }),\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 aside: resolveShorthand(aside),\n };\n};\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AAEvB,SAASC,qBAAqB,EAAEC,gBAAgB,QAAQ;AACxD,SAASC,uBAAuB,EAAEC,2BAA2B,QAAQ;AACrE,SAASC,cAAc,QAAQ;AAE/B;;;;;;;;;AASA,OAAO,MAAMC,iCAAA,GAAoCA,CAC/CC,KAAA,EACAC,GAAA,KAC+B;EAC/B,MAAM;IAAEC,KAAA;IAAOC,OAAA;IAASC,QAAA;IAAUC,IAAA;IAAMC,WAAA;IAAaC,KAAA;IAAOC,EAAA,GAAK;EAAM,CAAE,GAAGR,KAAA;EAC5E,MAAMS,IAAA,GAAOb,uBAAA,CAAwBc,GAAA,IAAOA,GAAA,CAAID,IAAI;EACpD,MAAM;IAAEE;EAAgB,CAAE,GAAGd,2BAAA;EAC7B,OAAO;IACLe,UAAA,EAAY;MACVT,OAAA,EAAS;MACTE,IAAA,EAAM;MACNC,WAAA,EAAa;MACbO,IAAA,EAAM;MACNX,KAAA,EAAO;MACPK,KAAA,EAAO;IACT;IACAI,gBAAA;IACAG,UAAA,EAAYhB,cAAc,CAACW,IAAA,CAAK;IAChCI,IAAA,EAAMnB,qBAAA,CAAsBc,EAAA,EAAI;MAAE,GAAGR,KAAK;MAAEC;IAAI;IAChDI,IAAA,EAAMV,gBAAA,CAAiBU,IAAA,EAAM;MAAEU,QAAA,EAAU,IAAI;MAAEC,YAAA,EAAc;QAAEZ;MAAS;IAAE;IAC1EF,KAAA,EAAOP,gBAAA,CAAiBO,KAAA,EAAO;MAAEa,QAAA,EAAU;IAAK;IAChDZ,OAAA,EAASR,gBAAA,CAAiBQ,OAAA,EAAS;MAAEY,QAAA,EAAU;IAAK;IACpDT,WAAA,EAAaX,gBAAA,CAAiBW,WAAA;IAC9BC,KAAA,EAAOZ,gBAAA,CAAiBY,KAAA;EAC1B;AACF"}

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

	@@ -1 +1 @@
1	- {"version":3,"names":["React","useTreeItemPersonaLayoutContextValues_unstable","state","avatarSize","avatar","useMemo","size"],"sources":["~~../~~src/~~packages/react-~~components/~~react-tree/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,~~OAAO~~,~~KAAKA~~,~~KAAK~~,~~MAAM,~~OAAO~~;AAG9B~~,~~OAAM~~,~~SAAUC~~,~~8CAA8CA,CAC5DC,KAAiC~~;~~EAEjC~~,MAAM;IAAEC;EAAU,CAAE,GAAGD,~~KAAK~~;~~EAE5B~~,MAAME,~~MAAM~~,~~GAAGJ~~,~~KAAK~~,~~CAACK~~,OAAO,CAAqB,OAAO;IAAEC,~~IAAI~~,~~EAAEH~~;~~EAAU~~,~~CAAE~~,~~CAAC,EAAE,~~CAACA,~~UAAU~~,~~CAAC,CAAC~~;~~EAE5F~~,OAAO;IAAEC;~~EAAM,CAAE~~;~~AACnB~~"}
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"}

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

	@@ -1 +1 @@
1	- {"version":3,"names":["__styles","mergeClasses","shorthands","tokens","typographyStyles","treeItemPersonaLayoutClassNames","root","media","content","description","aside","main","useRootStyles","base","a9b677","mc9l5x","Bt984gj","d","useMediaStyles","Bqenvij","z8tnut","z189sj","Byoj8tv","uwmqm3","useContentStyles","Beiy3e4","i8kkvl","Belr9w4","useMainStyles","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","useDescriptionStyles","useAsideStyles","Huce71","useTreeItemPersonaLayoutStyles_unstable","state","rootStyles","mediaStyles","contentStyles","mainStyles","descriptionStyles","asideStyles","className"],"sources":["~~../~~src/~~packages/react-~~components/~~react-tree/src/components/~~TreeItemPersonaLayout/useTreeItemPersonaLayoutStyles.ts"],"sourcesContent":["import type { TreeItemPersonaLayoutSlots, TreeItemPersonaLayoutState } from './TreeItemPersonaLayout.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\n\nexport const treeItemPersonaLayoutClassNames: SlotClassNames<TreeItemPersonaLayoutSlots> = {\n root: 'fui-TreeItemPersonaLayout',\n media: 'fui-TreeItemPersonaLayout__media',\n content: 'fui-TreeItemPersonaLayout__content',\n description: 'fui-TreeItemPersonaLayout__description',\n aside: 'fui-TreeItemPersonaLayout__aside',\n main: 'fui-TreeItemPersonaLayout__main',\n};\n\n/*\n Styles for the root slot\n /\nconst useRootStyles = makeStyles({\n base: {\n width: '100%',\n display: 'flex',\n alignItems: 'center',\n },\n});\n\n/\n Styles for the expand icon slot\n /\nconst useMediaStyles = makeStyles({\n base: {\n display: 'flex',\n alignItems: 'center',\n width: '32px',\n height: '32px',\n ...shorthands.padding(0, tokens.spacingHorizontalXS, 0, tokens.spacingHorizontalXXS),\n },\n});\n\nconst useContentStyles = makeStyles({\n base: {\n width: '100%',\n display: 'flex',\n flexDirection: 'column',\n ...shorthands.padding(\n tokens.spacingVerticalMNudge,\n tokens.spacingHorizontalXS,\n tokens.spacingVerticalMNudge,\n tokens.spacingHorizontalS,\n ),\n ...shorthands.gap(tokens.spacingVerticalNone, tokens.spacingHorizontalNone),\n },\n});\nconst useMainStyles = makeStyles({\n base: {\n ...typographyStyles.body1,\n },\n});\nconst useDescriptionStyles = makeStyles({\n base: {\n ...typographyStyles.caption1,\n },\n});\nconst useAsideStyles = makeStyles({\n base: {\n display: 'flex',\n flexDirection: 'column',\n whiteSpace: 'nowrap',\n paddingRight: tokens.spacingHorizontalM,\n ...typographyStyles.caption1,\n },\n});\n\n/\n Apply styling to the TreeItemPersonaLayout slots based on the state\n */\nexport const useTreeItemPersonaLayoutStyles_unstable = (\n state: TreeItemPersonaLayoutState,\n): TreeItemPersonaLayoutState => {\n const rootStyles = useRootStyles();\n const mediaStyles = useMediaStyles();\n const contentStyles = useContentStyles();\n const mainStyles = useMainStyles();\n const descriptionStyles = useDescriptionStyles();\n const asideStyles = useAsideStyles();\n\n state.root.className = mergeClasses(treeItemPersonaLayoutClassNames.root, rootStyles.base, state.root.className);\n\n state.media.className = mergeClasses(treeItemPersonaLayoutClassNames.media, mediaStyles.base, state.media.className);\n\n if (state.content) {\n state.content.className = mergeClasses(\n treeItemPersonaLayoutClassNames.content,\n contentStyles.base,\n state.content.className,\n );\n }\n if (state.main) {\n state.main.className = mergeClasses(treeItemPersonaLayoutClassNames.main, mainStyles.base, state.main.className);\n }\n if (state.description) {\n state.description.className = mergeClasses(\n treeItemPersonaLayoutClassNames.description,\n descriptionStyles.base,\n state.description.className,\n );\n }\n if (state.aside) {\n state.aside.className = mergeClasses(\n treeItemPersonaLayoutClassNames.aside,\n asideStyles.base,\n state.aside.className,\n );\n }\n\n return state;\n};\n"],"mappings":"AAEA,SAAAA,QAAA,EAAqBC,YAAY,EAAEC,UAAU,QAAQ~~,gBAAgB~~;~~AACrE~~,SAASC,MAAM,EAAEC,gBAAgB,QAAQ~~,uBAAuB~~;~~AAEhE~~,OAAO,MAAMC,+~~BAA+B~~,~~GAA+C~~;EACzFC,~~IAAI~~,~~EAAE,2BAA2B~~;~~EACjCC~~,~~KAAK~~,~~EAAE,kCAAkC~~;~~EACzCC~~,~~OAAO~~,~~EAAE,oCAAoC~~;~~EAC7CC~~,~~WAAW~~,~~EAAE,wCAAwC~~;~~EACrDC~~,~~KAAK~~,~~EAAE,kCAAkC~~;~~EACzCC~~,~~IAAI~~,~~EAAE~~;~~CACP~~;~~AAED~~;;;AAGA,MAAMC,~~aAAa~~,~~gBAAGZ~~,QAAA;EAAAa,IAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;EAAA;AAAA;EAAAC,CAAA;AAAA,~~EAMpB~~;~~AAEF~~;;;AAGA,MAAMC,~~cAAc~~,~~gBAAGlB~~,QAAA;EAAAa,IAAA;IAAAE,MAAA;IAAAC,OAAA;IAAAF,MAAA;IAAAK,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;AAAA;EAAAN,CAAA;AAAA,~~EAQrB~~;~~AAEF~~,MAAMO,~~gBAAgB~~,~~gBAAGxB~~,QAAA;EAAAa,IAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAU,OAAA;IAAAL,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAG,MAAA;IAAAC,OAAA;EAAA;AAAA;EAAAV,CAAA;AAAA,~~EAavB~~;~~AACF~~,MAAMW,~~aAAa~~,~~gBAAG5B~~,QAAA;EAAAa,IAAA;IAAAgB,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;EAAA;AAAA;EAAAf,CAAA;AAAA,~~EAIpB~~;~~AACF~~,MAAMgB,~~oBAAoB~~,~~gBAAGjC~~,QAAA;EAAAa,IAAA;IAAAgB,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;EAAA;AAAA;EAAAf,CAAA;AAAA,~~EAI3B~~;~~AACF~~,MAAMiB,~~cAAc~~,~~gBAAGlC~~,QAAA;EAAAa,IAAA;IAAAE,MAAA;IAAAU,OAAA;IAAAU,MAAA;IAAAd,MAAA;IAAAQ,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;EAAA;AAAA;EAAAf,CAAA;AAAA,~~EAQrB~~;~~AAEF~~;;;AAGA,OAAO,MAAMmB,~~uCAAuC~~,~~GAClDC~~,~~KAAiC~~,~~IACH~~;~~EAC9B~~,MAAMC,~~UAAU~~,~~GAAG1B~~,~~aAAa,EAAE~~;~~EAClC~~,MAAM2B,~~WAAW~~,~~GAAGrB~~,~~cAAc,EAAE~~;~~EACpC~~,MAAMsB,~~aAAa~~,~~GAAGhB~~,~~gBAAgB,EAAE~~;~~EACxC~~,MAAMiB,~~UAAU~~,~~GAAGb~~,~~aAAa,EAAE~~;~~EAClC~~,MAAMc,~~iBAAiB~~,~~GAAGT~~,~~oBAAoB,EAAE~~;~~EAChD~~,MAAMU,~~WAAW~~,~~GAAGT~~,~~cAAc,EAAE~~;~~EAEpCG~~,~~KAAK~~,~~CAAC~~/B,IAAI,CAACsC,SAAS,GAAG3C,~~YAAY~~,~~CAACI~~,+~~BAA+B~~,~~CAACC~~,IAAI,EAAEgC,~~UAAU~~,~~CAACzB~~,IAAI,EAAEwB,~~KAAK~~,~~CAAC~~/B,IAAI,CAACsC,SAAS~~,CAAC~~;~~EAEhHP~~,~~KAAK~~,~~CAAC9B~~,KAAK,CAACqC,SAAS,GAAG3C,~~YAAY~~,~~CAACI~~,+~~BAA+B~~,~~CAACE~~,KAAK,EAAEgC,~~WAAW~~,~~CAAC1B~~,IAAI,EAAEwB,~~KAAK~~,~~CAAC9B~~,KAAK,CAACqC,SAAS~~,CAAC~~;~~EAEpH~~,IAAIP,~~KAAK~~,~~CAAC7B~~,OAAO,EAAE;IACjB6B,~~KAAK~~,~~CAAC7B~~,OAAO,CAACoC,SAAS,GAAG3C,~~YAAY~~,~~CACpCI~~,+~~BAA+B~~,~~CAACG~~,OAAO,EACvCgC,~~aAAa~~,~~CAAC3B~~,IAAI,EAClBwB,~~KAAK~~,~~CAAC7B~~,OAAO,CAACoC,SAAS,~~CACxB;;EAEH,~~IAAIP,~~KAAK~~,~~CAAC1B~~,IAAI,EAAE;IACd0B,~~KAAK~~,~~CAAC1B~~,IAAI,CAACiC,SAAS,GAAG3C,~~YAAY~~,~~CAACI~~,+~~BAA+B~~,~~CAACM~~,IAAI,EAAE8B,~~UAAU~~,~~CAAC5B~~,IAAI,EAAEwB,~~KAAK~~,~~CAAC1B~~,IAAI,CAACiC,SAAS,~~CAAC;;EAElH,~~IAAIP,~~KAAK~~,~~CAAC5B~~,WAAW,EAAE;IACrB4B,~~KAAK~~,~~CAAC5B~~,WAAW,CAACmC,SAAS,GAAG3C,~~YAAY~~,~~CACxCI~~,+~~BAA+B~~,~~CAACI~~,WAAW,EAC3CiC,~~iBAAiB~~,~~CAAC7B~~,IAAI,EACtBwB,~~KAAK~~,~~CAAC5B~~,WAAW,CAACmC,SAAS,~~CAC5B;;EAEH,~~IAAIP,~~KAAK~~,~~CAAC3B~~,KAAK,EAAE;IACf2B,~~KAAK~~,~~CAAC3B~~,KAAK,CAACkC,SAAS,GAAG3C,~~YAAY~~,~~CAClCI~~,+~~BAA+B~~,~~CAACK~~,KAAK,EACrCiC,~~WAAW~~,~~CAAC9B~~,IAAI,EAChBwB,~~KAAK~~,~~CAAC3B~~,KAAK,CAACkC,SAAS,~~CACtB;;EAGH,~~OAAOP,~~KAAK~~;~~AACd,CAAC~~"}
1	+ {"version":3,"names":["__styles","mergeClasses","shorthands","tokens","typographyStyles","treeItemPersonaLayoutClassNames","root","media","content","description","aside","main","useRootStyles","base","a9b677","mc9l5x","Bt984gj","d","useMediaStyles","Bqenvij","z8tnut","z189sj","Byoj8tv","uwmqm3","useContentStyles","Beiy3e4","i8kkvl","Belr9w4","useMainStyles","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","useDescriptionStyles","useAsideStyles","Huce71","useTreeItemPersonaLayoutStyles_unstable","state","rootStyles","mediaStyles","contentStyles","mainStyles","descriptionStyles","asideStyles","className"],"sources":["../../../src/components/TreeItemPersonaLayout/useTreeItemPersonaLayoutStyles.ts"],"sourcesContent":["import type { TreeItemPersonaLayoutSlots, TreeItemPersonaLayoutState } from './TreeItemPersonaLayout.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\n\nexport const treeItemPersonaLayoutClassNames: SlotClassNames<TreeItemPersonaLayoutSlots> = {\n root: 'fui-TreeItemPersonaLayout',\n media: 'fui-TreeItemPersonaLayout__media',\n content: 'fui-TreeItemPersonaLayout__content',\n description: 'fui-TreeItemPersonaLayout__description',\n aside: 'fui-TreeItemPersonaLayout__aside',\n main: 'fui-TreeItemPersonaLayout__main',\n};\n\n/*\n Styles for the root slot\n /\nconst useRootStyles = makeStyles({\n base: {\n width: '100%',\n display: 'flex',\n alignItems: 'center',\n },\n});\n\n/\n Styles for the expand icon slot\n /\nconst useMediaStyles = makeStyles({\n base: {\n display: 'flex',\n alignItems: 'center',\n width: '32px',\n height: '32px',\n ...shorthands.padding(0, tokens.spacingHorizontalXS, 0, tokens.spacingHorizontalXXS),\n },\n});\n\nconst useContentStyles = makeStyles({\n base: {\n width: '100%',\n display: 'flex',\n flexDirection: 'column',\n ...shorthands.padding(\n tokens.spacingVerticalMNudge,\n tokens.spacingHorizontalXS,\n tokens.spacingVerticalMNudge,\n tokens.spacingHorizontalS,\n ),\n ...shorthands.gap(tokens.spacingVerticalNone, tokens.spacingHorizontalNone),\n },\n});\nconst useMainStyles = makeStyles({\n base: {\n ...typographyStyles.body1,\n },\n});\nconst useDescriptionStyles = makeStyles({\n base: {\n ...typographyStyles.caption1,\n },\n});\nconst useAsideStyles = makeStyles({\n base: {\n display: 'flex',\n flexDirection: 'column',\n whiteSpace: 'nowrap',\n paddingRight: tokens.spacingHorizontalM,\n ...typographyStyles.caption1,\n },\n});\n\n/\n Apply styling to the TreeItemPersonaLayout slots based on the state\n */\nexport const useTreeItemPersonaLayoutStyles_unstable = (\n state: TreeItemPersonaLayoutState,\n): TreeItemPersonaLayoutState => {\n const rootStyles = useRootStyles();\n const mediaStyles = useMediaStyles();\n const contentStyles = useContentStyles();\n const mainStyles = useMainStyles();\n const descriptionStyles = useDescriptionStyles();\n const asideStyles = useAsideStyles();\n\n state.root.className = mergeClasses(treeItemPersonaLayoutClassNames.root, rootStyles.base, state.root.className);\n\n state.media.className = mergeClasses(treeItemPersonaLayoutClassNames.media, mediaStyles.base, state.media.className);\n\n if (state.content) {\n state.content.className = mergeClasses(\n treeItemPersonaLayoutClassNames.content,\n contentStyles.base,\n state.content.className,\n );\n }\n if (state.main) {\n state.main.className = mergeClasses(treeItemPersonaLayoutClassNames.main, mainStyles.base, state.main.className);\n }\n if (state.description) {\n state.description.className = mergeClasses(\n treeItemPersonaLayoutClassNames.description,\n descriptionStyles.base,\n state.description.className,\n );\n }\n if (state.aside) {\n state.aside.className = mergeClasses(\n treeItemPersonaLayoutClassNames.aside,\n asideStyles.base,\n state.aside.className,\n );\n }\n\n return state;\n};\n"],"mappings":"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"}

package/lib/contexts/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"~~file~~":~~"index.js"~~,"~~sourceRoot":"../src/","~~sources":["~~packages/react-components/react-tree/~~src/contexts/index.ts"],"~~names":[],"mappings":"AAAA,cAAc,eAAe,CAAC;AAC9B,cAAc,mBAAmB,CAAC","~~sourcesContent":["export * from './treeContext';\nexport * from './treeItemContext';\n"]}
1	+ {"version":3,"names":[],"sources":["../../src/contexts/index.ts"],"sourcesContent":["export * from './treeContext';\nexport * from './treeItemContext';\n"],"mappings":"AAAA,cAAc;AACd,cAAc"}

package/lib/contexts/treeContext.js CHANGED Viewed

@@ -9,8 +9,7 @@ const defaultContextValue = {
   size: 'medium'
 };
 function noop() {
-  /* noop */
-}
+  /* noop */}
 export const TreeContext = /*#__PURE__*/createContext(undefined);
 export const {
   Provider: TreeProvider

package/lib/contexts/treeContext.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["createContext","useContextSelector","emptyImmutableSet","defaultContextValue","level","openItems","requestOpenChange","noop","requestNavigation","appearance","size","TreeContext","undefined","Provider","TreeProvider","useTreeContext_unstable","selector","ctx"],"sources":["~~../~~src/~~packages/react-components/react-tree/src/~~contexts/treeContext.ts"],"sourcesContent":["import { Context, ContextSelector, createContext, useContextSelector } from '@fluentui/react-context-selector';\nimport { TreeItemId, TreeOpenChangeData, TreeNavigationData_unstable } from '../Tree';\nimport { emptyImmutableSet, ImmutableSet } from '../utils/ImmutableSet';\n\nexport type TreeContextValue = {\n level: number;\n appearance: 'subtle' \| 'subtle-alpha' \| 'transparent';\n size: 'small' \| 'medium';\n openItems: ImmutableSet<TreeItemId>;\n /*\n Requests dialog main component to update it's internal open state\n /\n requestOpenChange(data: TreeOpenChangeData): void;\n requestNavigation(data: TreeNavigationData_unstable): void;\n};\n\nconst defaultContextValue: TreeContextValue = {\n level: 0,\n openItems: emptyImmutableSet,\n requestOpenChange: noop,\n requestNavigation: noop,\n appearance: 'subtle',\n size: 'medium',\n};\n\nfunction noop() {\n / noop */\n}\n\nexport const TreeContext: Context<TreeContextValue \| undefined> = createContext<TreeContextValue \| undefined>(\n undefined,\n);\n\nexport const { Provider: TreeProvider } = TreeContext;\nexport const useTreeContext_unstable = <T>(selector: ContextSelector<TreeContextValue, T>): T =>\n useContextSelector(TreeContext, (ctx = defaultContextValue) => selector(ctx));\n"],"mappings":"AAAA,SAAmCA,aAAa,EAAEC,kBAAkB,QAAQ~~,kCAAkC~~;~~AAE9G~~,SAASC,iBAAiB,QAAsB~~,uBAAuB~~;~~AAcvE~~,MAAMC,~~mBAAmB~~,~~GAAqB~~;EAC5CC,~~KAAK~~,~~EAAE,CAAC~~;~~EACRC~~,~~SAAS~~,~~EAAEH~~,~~iBAAiB~~;~~EAC5BI~~,~~iBAAiB~~,~~EAAEC~~,~~IAAI~~;~~EACvBC~~,~~iBAAiB~~,~~EAAED~~,~~IAAI~~;~~EACvBE~~,~~UAAU~~,~~EAAE,QAAQ~~;~~EACpBC~~,~~IAAI~~,~~EAAE~~;~~CACP~~;~~AAED~~,SAASH,~~IAAIA~~,~~CAAA~~;~~EACX~~;~~AAAA;~~AAGF,OAAO,MAAMI,~~WAAW~~,~~gBAA0CX~~,~~aAAa~~,~~CAC7EY~~,~~SAAS,CACV~~;~~AAED~~,OAAO,MAAM;EAAEC,~~QAAQ~~,~~EAAEC~~;AAAY,CAAE,GAAGH,~~WAAW~~;~~AACrD~~,OAAO,MAAMI,~~uBAAuB~~,~~GAAOC~~,~~QAA8C~~,~~IACvFf~~,~~kBAAkB~~,~~CAACU~~,~~WAAW~~,~~EAAE~~,CAACM,~~GAAG~~,~~GAAGd~~,mBAAmB,KAAKa,~~QAAQ~~,~~CAACC~~,~~GAAG,CAAC,CAAC~~"}
1	+ {"version":3,"names":["createContext","useContextSelector","emptyImmutableSet","defaultContextValue","level","openItems","requestOpenChange","noop","requestNavigation","appearance","size","TreeContext","undefined","Provider","TreeProvider","useTreeContext_unstable","selector","ctx"],"sources":["../../src/contexts/treeContext.ts"],"sourcesContent":["import { Context, ContextSelector, createContext, useContextSelector } from '@fluentui/react-context-selector';\nimport { TreeItemId, TreeOpenChangeData, TreeNavigationData_unstable } from '../Tree';\nimport { emptyImmutableSet, ImmutableSet } from '../utils/ImmutableSet';\n\nexport type TreeContextValue = {\n level: number;\n appearance: 'subtle' \| 'subtle-alpha' \| 'transparent';\n size: 'small' \| 'medium';\n openItems: ImmutableSet<TreeItemId>;\n /*\n Requests dialog main component to update it's internal open state\n /\n requestOpenChange(data: TreeOpenChangeData): void;\n requestNavigation(data: TreeNavigationData_unstable): void;\n};\n\nconst defaultContextValue: TreeContextValue = {\n level: 0,\n openItems: emptyImmutableSet,\n requestOpenChange: noop,\n requestNavigation: noop,\n appearance: 'subtle',\n size: 'medium',\n};\n\nfunction noop() {\n / noop */\n}\n\nexport const TreeContext: Context<TreeContextValue \| undefined> = createContext<TreeContextValue \| undefined>(\n undefined,\n);\n\nexport const { Provider: TreeProvider } = TreeContext;\nexport const useTreeContext_unstable = <T>(selector: ContextSelector<TreeContextValue, T>): T =>\n useContextSelector(TreeContext, (ctx = defaultContextValue) => selector(ctx));\n"],"mappings":"AAAA,SAAmCA,aAAa,EAAEC,kBAAkB,QAAQ;AAE5E,SAASC,iBAAiB,QAAsB;AAchD,MAAMC,mBAAA,GAAwC;EAC5CC,KAAA,EAAO;EACPC,SAAA,EAAWH,iBAAA;EACXI,iBAAA,EAAmBC,IAAA;EACnBC,iBAAA,EAAmBD,IAAA;EACnBE,UAAA,EAAY;EACZC,IAAA,EAAM;AACR;AAEA,SAASH,KAAA,EAAO;EACd;AAGF,OAAO,MAAMI,WAAA,gBAAqDX,aAAA,CAChEY,SAAA;AAGF,OAAO,MAAM;EAAEC,QAAA,EAAUC;AAAY,CAAE,GAAGH,WAAA;AAC1C,OAAO,MAAMI,uBAAA,GAA8BC,QAAA,IACzCf,kBAAA,CAAmBU,WAAA,EAAa,CAACM,GAAA,GAAMd,mBAAmB,KAAKa,QAAA,CAASC,GAAA"}

package/lib/contexts/treeItemContext.js CHANGED Viewed

@@ -6,8 +6,6 @@ export const TreeItemContext = /*#__PURE__*/React.createContext(undefined);
 export const {
   Provider: TreeItemProvider
 } = TreeItemContext;
-export const useTreeItemContext_unstable = () => {
-  var _a;
-  return (_a = React.useContext(TreeItemContext)) !== null && _a !== void 0 ? _a : defaultContextValue;
-};
+var _React_useContext;
+export const useTreeItemContext_unstable = () => (_React_useContext = React.useContext(TreeItemContext)) !== null && _React_useContext !== void 0 ? _React_useContext : defaultContextValue;
 //# sourceMappingURL=treeItemContext.js.map

package/lib/contexts/treeItemContext.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["React","defaultContextValue","isActionsVisible","TreeItemContext","createContext","undefined","Provider","TreeItemProvider","~~useTreeItemContext_unstable~~","_a","useContext"],"sources":["~~../~~src/~~packages/react-components/react-tree/src/~~contexts/treeItemContext.ts"],"sourcesContent":["import * as React from 'react';\n\nexport type TreeItemContextValue = {\n isActionsVisible: boolean;\n};\n\nconst defaultContextValue: TreeItemContextValue = {\n isActionsVisible: false,\n};\n\nexport const TreeItemContext: React.Context<TreeItemContextValue \| undefined> = React.createContext<\n TreeItemContextValue \| undefined\n>(undefined);\n\nexport const { Provider: TreeItemProvider } = TreeItemContext;\nexport const useTreeItemContext_unstable = (): TreeItemContextValue =>\n React.useContext(TreeItemContext) ?? defaultContextValue;\n"],"mappings":"AAAA,~~OAAO~~,~~KAAKA~~,~~KAAK,MAAM,OAAO~~;~~AAM9B~~,MAAMC,~~mBAAmB~~,~~GAAyB~~;EAChDC,~~gBAAgB~~,~~EAAE~~;~~CACnB~~;~~AAED~~,OAAO,MAAMC,~~eAAe~~,~~gBAAoDH~~,~~KAAK~~,~~CAACI~~,aAAa,CAEjGC,~~SAAS,CAAC~~;~~AAEZ~~,OAAO,MAAM;EAAEC,~~QAAQ~~,~~EAAEC~~;AAAgB,CAAE,GAAGJ,~~eAAe~~;~~AAC7D~~,OAAO,~~MAAMK~~,~~2BAA2B~~,~~GAAGA~~,CAAA,~~KAA2B;EAAA~~,~~IAAAC~~,~~EAAA;EACpE~~,~~QAAAA~~,~~EAAA~~,~~GAAAT~~,~~KAAK,CAACU,~~UAAU,CAACP,~~eAAe~~,~~CAAC~~,~~cAAAM~~,~~EAAA,~~cAAAA,~~EAAA~~,~~GAAIR~~,mBAAmB~~;AAAA~~"}
1	+ {"version":3,"names":["React","defaultContextValue","isActionsVisible","TreeItemContext","createContext","undefined","Provider","TreeItemProvider","_React_useContext","useTreeItemContext_unstable","useContext"],"sources":["../../src/contexts/treeItemContext.ts"],"sourcesContent":["import * as React from 'react';\n\nexport type TreeItemContextValue = {\n isActionsVisible: boolean;\n};\n\nconst defaultContextValue: TreeItemContextValue = {\n isActionsVisible: false,\n};\n\nexport const TreeItemContext: React.Context<TreeItemContextValue \| undefined> = React.createContext<\n TreeItemContextValue \| undefined\n>(undefined);\n\nexport const { Provider: TreeItemProvider } = TreeItemContext;\nexport const useTreeItemContext_unstable = (): TreeItemContextValue =>\n React.useContext(TreeItemContext) ?? defaultContextValue;\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AAMvB,MAAMC,mBAAA,GAA4C;EAChDC,gBAAA,EAAkB;AACpB;AAEA,OAAO,MAAMC,eAAA,gBAAmEH,KAAA,CAAMI,aAAa,CAEjGC,SAAA;AAEF,OAAO,MAAM;EAAEC,QAAA,EAAUC;AAAgB,CAAE,GAAGJ,eAAA;IAE5CK,iBAAA;AADF,OAAO,MAAMC,2BAAA,GAA8BA,CAAA,KACzC,CAAAD,iBAAA,GAAAR,KAAA,CAAMU,UAAU,CAACP,eAAA,eAAjBK,iBAAA,cAAAA,iBAAA,GAAqCP,mBAAmB"}

package/lib/hooks/index.js.map CHANGED Viewed

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

package/lib/hooks/useFlatTree.js CHANGED Viewed

@@ -29,6 +29,7 @@ export function useFlatTree_unstable(items, options = {}) {
     event.preventDefault();
     navigate(data);
   });
+  var _unfilteredFlatTree_itemsPerId_get;
   const flatTree = {
     ...visibleFlatTree,
     getTreeProps: () => ({
@@ -39,10 +40,7 @@ export function useFlatTree_unstable(items, options = {}) {
       onNavigation_unstable: handleNavigation
     }),
     navigate,
-    getItem: id => {
-      var _a;
-      return (_a = unfilteredFlatTree.itemsPerId.get(id)) !== null && _a !== void 0 ? _a : null;
-    }
+    getItem: id => (_unfilteredFlatTree_itemsPerId_get = unfilteredFlatTree.itemsPerId.get(id)) !== null && _unfilteredFlatTree_itemsPerId_get !== void 0 ? _unfilteredFlatTree_itemsPerId_get : null
   };
   return flatTree;
 }