@fluentui/react-tree 9.0.0-beta.10 → 9.0.0-beta.12
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.
- package/CHANGELOG.json +122 -8
- package/CHANGELOG.md +41 -9
- package/dist/index.d.ts +73 -45
- package/lib/components/Tree/Tree.js.map +1 -1
- package/lib/components/Tree/Tree.types.js.map +1 -1
- package/lib/components/Tree/renderTree.js +5 -5
- package/lib/components/Tree/renderTree.js.map +1 -1
- package/lib/components/TreeItem/TreeItem.js +1 -1
- package/lib/components/TreeItem/TreeItem.js.map +1 -1
- package/lib/components/TreeItem/TreeItem.types.js.map +1 -1
- package/lib/components/TreeItem/renderTreeItem.js +6 -6
- package/lib/components/TreeItem/renderTreeItem.js.map +1 -1
- package/lib/components/TreeItem/useTreeItem.js +17 -4
- package/lib/components/TreeItem/useTreeItem.js.map +1 -1
- package/lib/components/TreeItemLayout/TreeItemLayout.types.js.map +1 -1
- package/lib/components/TreeItemLayout/renderTreeItemLayout.js +4 -4
- package/lib/components/TreeItemLayout/renderTreeItemLayout.js.map +1 -1
- package/lib/components/TreeItemLayout/useTreeItemLayout.js +2 -2
- package/lib/components/TreeItemLayout/useTreeItemLayout.js.map +1 -1
- package/lib/components/TreeItemPersonaLayout/renderTreeItemPersonaLayout.js +5 -5
- package/lib/components/TreeItemPersonaLayout/renderTreeItemPersonaLayout.js.map +1 -1
- package/lib/components/TreeItemPersonaLayout/useTreeItemPersonaLayoutStyles.js +7 -14
- package/lib/components/TreeItemPersonaLayout/useTreeItemPersonaLayoutStyles.js.map +1 -1
- package/lib/contexts/treeContext.js.map +1 -1
- package/lib/hooks/useFlatTree.js +2 -2
- package/lib/hooks/useFlatTree.js.map +1 -1
- package/lib/hooks/useFlatTreeNavigation.js +7 -5
- package/lib/hooks/useFlatTreeNavigation.js.map +1 -1
- package/lib/hooks/useNestedTreeNavigation.js +1 -1
- package/lib/hooks/useNestedTreeNavigation.js.map +1 -1
- package/lib/hooks/useOpenItemsState.js +2 -3
- package/lib/hooks/useOpenItemsState.js.map +1 -1
- package/lib/index.js.map +1 -1
- package/lib/utils/createFlatTreeItems.js +26 -17
- package/lib/utils/createFlatTreeItems.js.map +1 -1
- package/lib/utils/flattenTree.js +8 -4
- package/lib/utils/flattenTree.js.map +1 -1
- package/lib-commonjs/components/Tree/renderTree.js +5 -6
- package/lib-commonjs/components/Tree/renderTree.js.map +1 -1
- package/lib-commonjs/components/TreeItem/TreeItem.js.map +1 -1
- package/lib-commonjs/components/TreeItem/renderTreeItem.js +6 -7
- package/lib-commonjs/components/TreeItem/renderTreeItem.js.map +1 -1
- package/lib-commonjs/components/TreeItem/useTreeItem.js +17 -5
- package/lib-commonjs/components/TreeItem/useTreeItem.js.map +1 -1
- package/lib-commonjs/components/TreeItemLayout/renderTreeItemLayout.js +4 -5
- package/lib-commonjs/components/TreeItemLayout/renderTreeItemLayout.js.map +1 -1
- package/lib-commonjs/components/TreeItemLayout/useTreeItemLayout.js +2 -2
- package/lib-commonjs/components/TreeItemLayout/useTreeItemLayout.js.map +1 -1
- package/lib-commonjs/components/TreeItemPersonaLayout/renderTreeItemPersonaLayout.js +5 -6
- package/lib-commonjs/components/TreeItemPersonaLayout/renderTreeItemPersonaLayout.js.map +1 -1
- package/lib-commonjs/components/TreeItemPersonaLayout/useTreeItemPersonaLayoutStyles.js +11 -19
- package/lib-commonjs/components/TreeItemPersonaLayout/useTreeItemPersonaLayoutStyles.js.map +1 -1
- package/lib-commonjs/hooks/useFlatTree.js +2 -2
- package/lib-commonjs/hooks/useFlatTree.js.map +1 -1
- package/lib-commonjs/hooks/useFlatTreeNavigation.js +7 -5
- package/lib-commonjs/hooks/useFlatTreeNavigation.js.map +1 -1
- package/lib-commonjs/hooks/useNestedTreeNavigation.js +1 -1
- package/lib-commonjs/hooks/useNestedTreeNavigation.js.map +1 -1
- package/lib-commonjs/hooks/useOpenItemsState.js +2 -3
- package/lib-commonjs/hooks/useOpenItemsState.js.map +1 -1
- package/lib-commonjs/utils/createFlatTreeItems.js +26 -20
- package/lib-commonjs/utils/createFlatTreeItems.js.map +1 -1
- package/lib-commonjs/utils/flattenTree.js +8 -4
- package/lib-commonjs/utils/flattenTree.js.map +1 -1
- package/package.json +9 -8
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../lib/components/TreeItem/useTreeItem.js"],"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 { useTreeContext_unstable } from '../../contexts/index';\nimport { treeDataTypes } from '../../utils/tokens';\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, ref) => {\n const [children, subtreeChildren] = React.Children.toArray(props.children);\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 const requestOpenChange = useTreeContext_unstable(ctx => ctx.requestOpenChange);\n const requestNavigation = useTreeContext_unstable(ctx => ctx.requestNavigation);\n const id = useId('fui-TreeItem-', props.id);\n const isBranch = !isLeaf;\n const open = useTreeContext_unstable(ctx => isBranch && ctx.openItems.has(id));\n const {\n dir,\n targetDocument\n } = useFluent_unstable();\n const expandIconRotation = open ? 90 : dir !== 'rtl' ? 0 : 180;\n const actionsRef = React.useRef(null);\n const expandIconRef = React.useRef(null);\n const subtreeRef = React.useRef(null);\n const handleArrowRight = event => {\n if (!open && isBranch) {\n return requestOpenChange({\n event,\n open: true,\n type: treeDataTypes.arrowRight,\n target: event.currentTarget\n });\n }\n if (open && isBranch) {\n return requestNavigation({\n event,\n type: treeDataTypes.arrowRight,\n target: event.currentTarget\n });\n }\n };\n const handleArrowLeft = event => {\n if (open && isBranch) {\n return requestOpenChange({\n event,\n open: false,\n type: treeDataTypes.arrowLeft,\n target: event.currentTarget\n });\n }\n if (!open && level > 1) {\n return requestNavigation({\n event,\n target: event.currentTarget,\n type: treeDataTypes.arrowLeft\n });\n }\n };\n const handleEnter = event => {\n requestOpenChange({\n event,\n open: isLeaf ? open : !open,\n type: treeDataTypes.enter,\n target: event.currentTarget\n });\n };\n const handleClick = useEventCallback(event => {\n onClick === null || onClick === void 0 ? void 0 : onClick(event);\n const isEventFromActions = actionsRef.current && elementContains(actionsRef.current, event.target);\n if (isEventFromActions) {\n return;\n }\n const isEventFromSubtree = subtreeRef.current && elementContains(subtreeRef.current, event.target);\n if (isEventFromSubtree) {\n return;\n }\n const isFromExpandIcon = expandIconRef.current && elementContains(expandIconRef.current, event.target);\n requestOpenChange({\n event,\n open: isLeaf ? open : !open,\n type: isFromExpandIcon ? treeDataTypes.expandIconClick : treeDataTypes.click,\n target: event.currentTarget\n });\n requestNavigation({\n event,\n target: event.currentTarget,\n type: treeDataTypes.click\n });\n });\n const handleKeyDown = useEventCallback(event => {\n onKeyDown === null || onKeyDown === void 0 ? void 0 : 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({\n event,\n type: treeDataTypes.end,\n target: event.currentTarget\n });\n case Home:\n return requestNavigation({\n event,\n type: treeDataTypes.home,\n target: event.currentTarget\n });\n case ArrowUp:\n return requestNavigation({\n event,\n type: treeDataTypes.arrowUp,\n target: event.currentTarget\n });\n case ArrowDown:\n return requestNavigation({\n event,\n type: treeDataTypes.arrowDown,\n target: event.currentTarget\n });\n }\n const isTypeAheadCharacter = event.key.length === 1 && event.key.match(/\\w/) && !event.altKey && !event.ctrlKey && !event.metaKey;\n if (isTypeAheadCharacter) {\n return requestNavigation({\n event,\n target: event.currentTarget,\n type: treeDataTypes.typeAhead\n });\n }\n });\n const [isActionsVisible, setActionsVisible] = React.useState(false);\n const showActions = useEventCallback(event => {\n const isEventFromSubtree = subtreeRef.current && elementContains(subtreeRef.current, event.target);\n if (!isEventFromSubtree) {\n setActionsVisible(true);\n }\n });\n const hideActions = useEventCallback(event => {\n const isEventFromSubtree = subtreeRef.current && elementContains(subtreeRef.current, event.target);\n if (!isEventFromSubtree) {\n setActionsVisible(false);\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 => {\n setActionsVisible(elementContains(actionsRef.current, event.relatedTarget));\n };\n targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.addEventListener('focusout', handleFocusOut, {\n passive: true\n });\n return () => {\n targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.removeEventListener('focusout', handleFocusOut);\n };\n }\n }, [targetDocument]);\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: /*#__PURE__*/React.createElement(ChevronRight12Regular, {\n style: expandIconInlineStyles[expandIconRotation]\n }),\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//# sourceMappingURL=useTreeItem.js.map"],"names":["useTreeItem_unstable","props","ref","children","subtreeChildren","React","Children","toArray","contextLevel","useTreeContext_unstable","ctx","level","content","subtree","expandIcon","leaf","isLeaf","undefined","actions","as","onClick","onKeyDown","rest","requestOpenChange","requestNavigation","id","useId","isBranch","open","openItems","has","dir","targetDocument","useFluent_unstable","expandIconRotation","actionsRef","useRef","expandIconRef","subtreeRef","handleArrowRight","event","type","treeDataTypes","arrowRight","target","currentTarget","handleArrowLeft","arrowLeft","handleEnter","enter","handleClick","useEventCallback","isEventFromActions","current","elementContains","isEventFromSubtree","isFromExpandIcon","expandIconClick","click","handleKeyDown","isDefaultPrevented","key","Enter","ArrowRight","ArrowLeft","End","end","Home","home","ArrowUp","arrowUp","ArrowDown","arrowDown","isTypeAheadCharacter","length","match","altKey","ctrlKey","metaKey","typeAhead","isActionsVisible","setActionsVisible","useState","showActions","hideActions","useEffect","handleFocusOut","relatedTarget","addEventListener","passive","removeEventListener","buttonSize","components","root","resolveShorthand","required","Boolean","defaultProps","useMergedRefs","isResolvedShorthand","getNativeElementProps","tabIndex","role","onMouseOver","onFocus","onMouseOut","onBlur","createElement","ChevronRight12Regular","style","expandIconInlineStyles"],"mappings":"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"}
|
|
1
|
+
{"version":3,"sources":["../../../lib/components/TreeItem/useTreeItem.js"],"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 { useTreeContext_unstable } from '../../contexts/index';\nimport { treeDataTypes } from '../../utils/tokens';\n/**\n * Create the state required to render TreeItem.\n *\n * The returned state can be modified with hooks such as useTreeItemStyles_unstable,\n * before being passed to renderTreeItem_unstable.\n *\n * @param props - props from this instance of TreeItem\n * @param ref - reference to root HTMLElement of TreeItem\n */\nexport function useTreeItem_unstable(props, ref) {\n const [children, subtreeChildren] = React.Children.toArray(props.children);\n const contextLevel = useTreeContext_unstable(ctx => ctx.level);\n const id = useId('fui-TreeItem-', props.id);\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 value = id,\n ...rest\n } = props;\n const requestOpenChange = useTreeContext_unstable(ctx => ctx.requestOpenChange);\n const requestNavigation = useTreeContext_unstable(ctx => ctx.requestNavigation);\n const isBranch = !isLeaf;\n const open = useTreeContext_unstable(ctx => isBranch && ctx.openItems.has(value));\n const {\n dir,\n targetDocument\n } = useFluent_unstable();\n const expandIconRotation = open ? 90 : dir !== 'rtl' ? 0 : 180;\n const actionsRef = React.useRef(null);\n const expandIconRef = React.useRef(null);\n const subtreeRef = React.useRef(null);\n const handleArrowRight = event => {\n if (!open && isBranch) {\n return requestOpenChange({\n event,\n value,\n open: true,\n type: treeDataTypes.arrowRight,\n target: event.currentTarget\n });\n }\n if (open && isBranch) {\n return requestNavigation({\n event,\n value,\n type: treeDataTypes.arrowRight,\n target: event.currentTarget\n });\n }\n };\n const handleArrowLeft = event => {\n if (open && isBranch) {\n return requestOpenChange({\n event,\n value,\n open: false,\n type: treeDataTypes.arrowLeft,\n target: event.currentTarget\n });\n }\n if (!open && level > 1) {\n return requestNavigation({\n event,\n value,\n target: event.currentTarget,\n type: treeDataTypes.arrowLeft\n });\n }\n };\n const handleEnter = event => {\n requestOpenChange({\n event,\n value,\n open: isLeaf ? open : !open,\n type: treeDataTypes.enter,\n target: event.currentTarget\n });\n };\n const handleClick = useEventCallback(event => {\n onClick === null || onClick === void 0 ? void 0 : onClick(event);\n const isEventFromActions = actionsRef.current && elementContains(actionsRef.current, event.target);\n if (isEventFromActions) {\n return;\n }\n const isEventFromSubtree = subtreeRef.current && elementContains(subtreeRef.current, event.target);\n if (isEventFromSubtree) {\n return;\n }\n const isFromExpandIcon = expandIconRef.current && elementContains(expandIconRef.current, event.target);\n requestOpenChange({\n event,\n value,\n open: isLeaf ? open : !open,\n type: isFromExpandIcon ? treeDataTypes.expandIconClick : treeDataTypes.click,\n target: event.currentTarget\n });\n requestNavigation({\n event,\n value,\n target: event.currentTarget,\n type: treeDataTypes.click\n });\n });\n const handleKeyDown = useEventCallback(event => {\n onKeyDown === null || onKeyDown === void 0 ? void 0 : 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({\n event,\n value,\n type: treeDataTypes.end,\n target: event.currentTarget\n });\n case Home:\n return requestNavigation({\n event,\n value,\n type: treeDataTypes.home,\n target: event.currentTarget\n });\n case ArrowUp:\n return requestNavigation({\n event,\n value,\n type: treeDataTypes.arrowUp,\n target: event.currentTarget\n });\n case ArrowDown:\n return requestNavigation({\n event,\n value,\n type: treeDataTypes.arrowDown,\n target: event.currentTarget\n });\n }\n const isTypeAheadCharacter = event.key.length === 1 && event.key.match(/\\w/) && !event.altKey && !event.ctrlKey && !event.metaKey;\n if (isTypeAheadCharacter) {\n return requestNavigation({\n event,\n value,\n target: event.currentTarget,\n type: treeDataTypes.typeAhead\n });\n }\n });\n const [isActionsVisible, setActionsVisible] = React.useState(false);\n const showActions = useEventCallback(event => {\n const isEventFromSubtree = subtreeRef.current && elementContains(subtreeRef.current, event.target);\n if (!isEventFromSubtree) {\n setActionsVisible(true);\n }\n });\n const hideActions = useEventCallback(event => {\n const isEventFromSubtree = subtreeRef.current && elementContains(subtreeRef.current, event.target);\n if (!isEventFromSubtree) {\n setActionsVisible(false);\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 => {\n setActionsVisible(elementContains(actionsRef.current, event.relatedTarget));\n };\n targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.addEventListener('focusout', handleFocusOut, {\n passive: true\n });\n return () => {\n targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.removeEventListener('focusout', handleFocusOut);\n };\n }\n }, [targetDocument]);\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: /*#__PURE__*/React.createElement(ChevronRight12Regular, {\n style: expandIconInlineStyles[expandIconRotation]\n }),\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//# sourceMappingURL=useTreeItem.js.map"],"names":["useTreeItem_unstable","props","ref","children","subtreeChildren","React","Children","toArray","contextLevel","useTreeContext_unstable","ctx","level","id","useId","content","subtree","expandIcon","leaf","isLeaf","undefined","actions","as","onClick","onKeyDown","value","rest","requestOpenChange","requestNavigation","isBranch","open","openItems","has","dir","targetDocument","useFluent_unstable","expandIconRotation","actionsRef","useRef","expandIconRef","subtreeRef","handleArrowRight","event","type","treeDataTypes","arrowRight","target","currentTarget","handleArrowLeft","arrowLeft","handleEnter","enter","handleClick","useEventCallback","isEventFromActions","current","elementContains","isEventFromSubtree","isFromExpandIcon","expandIconClick","click","handleKeyDown","isDefaultPrevented","key","Enter","ArrowRight","ArrowLeft","End","end","Home","home","ArrowUp","arrowUp","ArrowDown","arrowDown","isTypeAheadCharacter","length","match","altKey","ctrlKey","metaKey","typeAhead","isActionsVisible","setActionsVisible","useState","showActions","hideActions","useEffect","handleFocusOut","relatedTarget","addEventListener","passive","removeEventListener","buttonSize","components","root","resolveShorthand","required","Boolean","defaultProps","useMergedRefs","isResolvedShorthand","getNativeElementProps","tabIndex","role","onMouseOver","onFocus","onMouseOut","onBlur","createElement","ChevronRight12Regular","style","expandIconInlineStyles"],"mappings":"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"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";
|
|
1
|
+
/** @jsxRuntime classic */ /** @jsx createElement */ "use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", {
|
|
3
3
|
value: true
|
|
4
4
|
});
|
|
@@ -6,13 +6,12 @@ Object.defineProperty(exports, "renderTreeItemLayout_unstable", {
|
|
|
6
6
|
enumerable: true,
|
|
7
7
|
get: ()=>renderTreeItemLayout_unstable
|
|
8
8
|
});
|
|
9
|
-
const
|
|
10
|
-
const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
|
|
9
|
+
const _reactJsxRuntime = require("@fluentui/react-jsx-runtime");
|
|
11
10
|
const _reactUtilities = require("@fluentui/react-utilities");
|
|
12
11
|
const renderTreeItemLayout_unstable = (state)=>{
|
|
13
12
|
const { isActionsVisible } = state;
|
|
14
|
-
const { slots , slotProps } = (0, _reactUtilities.
|
|
15
|
-
return /*#__PURE__*/
|
|
13
|
+
const { slots , slotProps } = (0, _reactUtilities.getSlotsNext)(state);
|
|
14
|
+
return /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.root, slotProps.root, slots.iconBefore && /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.iconBefore, slotProps.iconBefore), slotProps.root.children, slots.iconAfter && /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.iconAfter, slotProps.iconAfter), !isActionsVisible && slots.aside && /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.aside, slotProps.aside));
|
|
16
15
|
}; //# sourceMappingURL=renderTreeItemLayout.js.map
|
|
17
16
|
|
|
18
17
|
//# sourceMappingURL=renderTreeItemLayout.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../lib/components/TreeItemLayout/renderTreeItemLayout.js"],"sourcesContent":["import
|
|
1
|
+
{"version":3,"sources":["../../../lib/components/TreeItemLayout/renderTreeItemLayout.js"],"sourcesContent":["/** @jsxRuntime classic */ /** @jsx createElement */import { createElement } from '@fluentui/react-jsx-runtime';\nimport { getSlotsNext } from '@fluentui/react-utilities';\n/**\n * Render the final JSX of TreeItemLayout\n */\nexport const renderTreeItemLayout_unstable = state => {\n const {\n isActionsVisible\n } = state;\n const {\n slots,\n slotProps\n } = getSlotsNext(state);\n return /*#__PURE__*/createElement(slots.root, slotProps.root, slots.iconBefore && /*#__PURE__*/createElement(slots.iconBefore, slotProps.iconBefore), slotProps.root.children, slots.iconAfter && /*#__PURE__*/createElement(slots.iconAfter, slotProps.iconAfter), !isActionsVisible && slots.aside && /*#__PURE__*/createElement(slots.aside, slotProps.aside));\n};\n//# sourceMappingURL=renderTreeItemLayout.js.map"],"names":["renderTreeItemLayout_unstable","state","isActionsVisible","slots","slotProps","getSlotsNext","createElement","root","iconBefore","children","iconAfter","aside"],"mappings":"AAAA,wBAAwB,GAAG,uBAAuB;;;;+BAKrCA;;aAAAA;;iCALqE;gCACrD;AAItB,MAAMA,gCAAgCC,CAAAA,QAAS;IACpD,MAAM,EACJC,iBAAgB,EACjB,GAAGD;IACJ,MAAM,EACJE,MAAK,EACLC,UAAS,EACV,GAAGC,IAAAA,4BAAY,EAACJ;IACjB,OAAO,WAAW,GAAEK,IAAAA,8BAAa,EAACH,MAAMI,IAAI,EAAEH,UAAUG,IAAI,EAAEJ,MAAMK,UAAU,IAAI,WAAW,GAAEF,IAAAA,8BAAa,EAACH,MAAMK,UAAU,EAAEJ,UAAUI,UAAU,GAAGJ,UAAUG,IAAI,CAACE,QAAQ,EAAEN,MAAMO,SAAS,IAAI,WAAW,GAAEJ,IAAAA,8BAAa,EAACH,MAAMO,SAAS,EAAEN,UAAUM,SAAS,GAAG,CAACR,oBAAoBC,MAAMQ,KAAK,IAAI,WAAW,GAAEL,IAAAA,8BAAa,EAACH,MAAMQ,KAAK,EAAEP,UAAUO,KAAK;AACjW,GACA,gDAAgD"}
|
|
@@ -11,12 +11,12 @@ const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
|
|
|
11
11
|
const _reactUtilities = require("@fluentui/react-utilities");
|
|
12
12
|
const _treeItemContext = require("../../contexts/treeItemContext");
|
|
13
13
|
const useTreeItemLayout_unstable = (props, ref)=>{
|
|
14
|
-
const { iconAfter , iconBefore , aside , as ='
|
|
14
|
+
const { iconAfter , iconBefore , aside , as ='span' } = props;
|
|
15
15
|
const treeItemContext = (0, _treeItemContext.useTreeItemContext_unstable)();
|
|
16
16
|
return {
|
|
17
17
|
...treeItemContext,
|
|
18
18
|
components: {
|
|
19
|
-
root: '
|
|
19
|
+
root: 'span',
|
|
20
20
|
iconBefore: 'span',
|
|
21
21
|
iconAfter: 'span',
|
|
22
22
|
aside: 'span'
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../lib/components/TreeItemLayout/useTreeItemLayout.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, resolveShorthand } from '@fluentui/react-utilities';\nimport { useTreeItemContext_unstable } from '../../contexts/treeItemContext';\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 = (props, ref) => {\n const {\n iconAfter,\n iconBefore,\n aside,\n as = '
|
|
1
|
+
{"version":3,"sources":["../../../lib/components/TreeItemLayout/useTreeItemLayout.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, resolveShorthand } from '@fluentui/react-utilities';\nimport { useTreeItemContext_unstable } from '../../contexts/treeItemContext';\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 = (props, ref) => {\n const {\n iconAfter,\n iconBefore,\n aside,\n as = 'span'\n } = props;\n const treeItemContext = useTreeItemContext_unstable();\n return {\n ...treeItemContext,\n components: {\n root: 'span',\n iconBefore: 'span',\n iconAfter: 'span',\n aside: 'span'\n },\n root: getNativeElementProps(as, {\n ...props,\n ref\n }),\n iconBefore: resolveShorthand(iconBefore, {\n defaultProps: {\n 'aria-hidden': true\n }\n }),\n iconAfter: resolveShorthand(iconAfter, {\n defaultProps: {\n 'aria-hidden': true\n }\n }),\n aside: resolveShorthand(aside, {\n defaultProps: {\n 'aria-hidden': true\n }\n })\n };\n};\n//# sourceMappingURL=useTreeItemLayout.js.map"],"names":["useTreeItemLayout_unstable","props","ref","iconAfter","iconBefore","aside","as","treeItemContext","useTreeItemContext_unstable","components","root","getNativeElementProps","resolveShorthand","defaultProps"],"mappings":";;;;+BAYaA;;aAAAA;;;6DAZU;gCACiC;iCACZ;AAUrC,MAAMA,6BAA6B,CAACC,OAAOC,MAAQ;IACxD,MAAM,EACJC,UAAS,EACTC,WAAU,EACVC,MAAK,EACLC,IAAK,OAAM,EACZ,GAAGL;IACJ,MAAMM,kBAAkBC,IAAAA,4CAA2B;IACnD,OAAO;QACL,GAAGD,eAAe;QAClBE,YAAY;YACVC,MAAM;YACNN,YAAY;YACZD,WAAW;YACXE,OAAO;QACT;QACAK,MAAMC,IAAAA,qCAAqB,EAACL,IAAI;YAC9B,GAAGL,KAAK;YACRC;QACF;QACAE,YAAYQ,IAAAA,gCAAgB,EAACR,YAAY;YACvCS,cAAc;gBACZ,eAAe,IAAI;YACrB;QACF;QACAV,WAAWS,IAAAA,gCAAgB,EAACT,WAAW;YACrCU,cAAc;gBACZ,eAAe,IAAI;YACrB;QACF;QACAR,OAAOO,IAAAA,gCAAgB,EAACP,OAAO;YAC7BQ,cAAc;gBACZ,eAAe,IAAI;YACrB;QACF;IACF;AACF,GACA,6CAA6C"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";
|
|
1
|
+
/** @jsxRuntime classic */ /** @jsx createElement */ "use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", {
|
|
3
3
|
value: true
|
|
4
4
|
});
|
|
@@ -6,16 +6,15 @@ Object.defineProperty(exports, "renderTreeItemPersonaLayout_unstable", {
|
|
|
6
6
|
enumerable: true,
|
|
7
7
|
get: ()=>renderTreeItemPersonaLayout_unstable
|
|
8
8
|
});
|
|
9
|
-
const
|
|
10
|
-
const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
|
|
9
|
+
const _reactJsxRuntime = require("@fluentui/react-jsx-runtime");
|
|
11
10
|
const _reactUtilities = require("@fluentui/react-utilities");
|
|
12
11
|
const _reactAvatar = require("@fluentui/react-avatar");
|
|
13
12
|
const renderTreeItemPersonaLayout_unstable = (state, contextValues)=>{
|
|
14
13
|
const { isActionsVisible } = state;
|
|
15
|
-
const { slots , slotProps } = (0, _reactUtilities.
|
|
16
|
-
return /*#__PURE__*/
|
|
14
|
+
const { slots , slotProps } = (0, _reactUtilities.getSlotsNext)(state);
|
|
15
|
+
return /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.root, slotProps.root, slots.media && /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(_reactAvatar.AvatarContextProvider, {
|
|
17
16
|
value: contextValues.avatar
|
|
18
|
-
}, /*#__PURE__*/
|
|
17
|
+
}, /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.media, slotProps.media)), slots.content && /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.content, slotProps.content, slots.main && /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.main, slotProps.main), slots.description && /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.description, slotProps.description)), !isActionsVisible && slots.aside && /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.aside, slotProps.aside));
|
|
19
18
|
}; //# sourceMappingURL=renderTreeItemPersonaLayout.js.map
|
|
20
19
|
|
|
21
20
|
//# sourceMappingURL=renderTreeItemPersonaLayout.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../lib/components/TreeItemPersonaLayout/renderTreeItemPersonaLayout.js"],"sourcesContent":["import
|
|
1
|
+
{"version":3,"sources":["../../../lib/components/TreeItemPersonaLayout/renderTreeItemPersonaLayout.js"],"sourcesContent":["/** @jsxRuntime classic */ /** @jsx createElement */import { createElement } from '@fluentui/react-jsx-runtime';\nimport { getSlotsNext } from '@fluentui/react-utilities';\nimport { AvatarContextProvider } from '@fluentui/react-avatar';\n/**\n * Render the final JSX of TreeItemPersonaLayout\n */\nexport const renderTreeItemPersonaLayout_unstable = (state, contextValues) => {\n const {\n isActionsVisible\n } = state;\n const {\n slots,\n slotProps\n } = getSlotsNext(state);\n return /*#__PURE__*/createElement(slots.root, slotProps.root, slots.media && /*#__PURE__*/createElement(AvatarContextProvider, {\n value: contextValues.avatar\n }, /*#__PURE__*/createElement(slots.media, slotProps.media)), slots.content && /*#__PURE__*/createElement(slots.content, slotProps.content, slots.main && /*#__PURE__*/createElement(slots.main, slotProps.main), slots.description && /*#__PURE__*/createElement(slots.description, slotProps.description)), !isActionsVisible && slots.aside && /*#__PURE__*/createElement(slots.aside, slotProps.aside));\n};\n//# sourceMappingURL=renderTreeItemPersonaLayout.js.map"],"names":["renderTreeItemPersonaLayout_unstable","state","contextValues","isActionsVisible","slots","slotProps","getSlotsNext","createElement","root","media","AvatarContextProvider","value","avatar","content","main","description","aside"],"mappings":"AAAA,wBAAwB,GAAG,uBAAuB;;;;+BAMrCA;;aAAAA;;iCANqE;gCACrD;6BACS;AAI/B,MAAMA,uCAAuC,CAACC,OAAOC,gBAAkB;IAC5E,MAAM,EACJC,iBAAgB,EACjB,GAAGF;IACJ,MAAM,EACJG,MAAK,EACLC,UAAS,EACV,GAAGC,IAAAA,4BAAY,EAACL;IACjB,OAAO,WAAW,GAAEM,IAAAA,8BAAa,EAACH,MAAMI,IAAI,EAAEH,UAAUG,IAAI,EAAEJ,MAAMK,KAAK,IAAI,WAAW,GAAEF,IAAAA,8BAAa,EAACG,kCAAqB,EAAE;QAC7HC,OAAOT,cAAcU,MAAM;IAC7B,GAAG,WAAW,GAAEL,IAAAA,8BAAa,EAACH,MAAMK,KAAK,EAAEJ,UAAUI,KAAK,IAAIL,MAAMS,OAAO,IAAI,WAAW,GAAEN,IAAAA,8BAAa,EAACH,MAAMS,OAAO,EAAER,UAAUQ,OAAO,EAAET,MAAMU,IAAI,IAAI,WAAW,GAAEP,IAAAA,8BAAa,EAACH,MAAMU,IAAI,EAAET,UAAUS,IAAI,GAAGV,MAAMW,WAAW,IAAI,WAAW,GAAER,IAAAA,8BAAa,EAACH,MAAMW,WAAW,EAAEV,UAAUU,WAAW,IAAI,CAACZ,oBAAoBC,MAAMY,KAAK,IAAI,WAAW,GAAET,IAAAA,8BAAa,EAACH,MAAMY,KAAK,EAAEX,UAAUW,KAAK;AAC3Y,GACA,uDAAuD"}
|
|
@@ -27,13 +27,21 @@ const treeItemPersonaLayoutClassNames = {
|
|
|
27
27
|
base: {
|
|
28
28
|
a9b677: "fly5x3f",
|
|
29
29
|
mc9l5x: "f22iagw",
|
|
30
|
-
Bt984gj: "f122n59"
|
|
30
|
+
Bt984gj: "f122n59",
|
|
31
|
+
Bahqtrf: "fk6fouc",
|
|
32
|
+
Be2twd7: "fkhj508",
|
|
33
|
+
Bhrd7zp: "figsok6",
|
|
34
|
+
Bg96gwp: "f1i3iumi"
|
|
31
35
|
}
|
|
32
36
|
}, {
|
|
33
37
|
d: [
|
|
34
38
|
".fly5x3f{width:100%;}",
|
|
35
39
|
".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}",
|
|
36
|
-
".f122n59{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}"
|
|
40
|
+
".f122n59{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}",
|
|
41
|
+
".fk6fouc{font-family:var(--fontFamilyBase);}",
|
|
42
|
+
".fkhj508{font-size:var(--fontSizeBase300);}",
|
|
43
|
+
".figsok6{font-weight:var(--fontWeightRegular);}",
|
|
44
|
+
".f1i3iumi{line-height:var(--lineHeightBase300);}"
|
|
37
45
|
]
|
|
38
46
|
});
|
|
39
47
|
/**
|
|
@@ -102,21 +110,6 @@ const useContentStyles = /*#__PURE__*/ (0, _react["__styles"])({
|
|
|
102
110
|
".fws515f{row-gap:var(--spacingHorizontalNone);}"
|
|
103
111
|
]
|
|
104
112
|
});
|
|
105
|
-
const useMainStyles = /*#__PURE__*/ (0, _react["__styles"])({
|
|
106
|
-
base: {
|
|
107
|
-
Bahqtrf: "fk6fouc",
|
|
108
|
-
Be2twd7: "fkhj508",
|
|
109
|
-
Bhrd7zp: "figsok6",
|
|
110
|
-
Bg96gwp: "f1i3iumi"
|
|
111
|
-
}
|
|
112
|
-
}, {
|
|
113
|
-
d: [
|
|
114
|
-
".fk6fouc{font-family:var(--fontFamilyBase);}",
|
|
115
|
-
".fkhj508{font-size:var(--fontSizeBase300);}",
|
|
116
|
-
".figsok6{font-weight:var(--fontWeightRegular);}",
|
|
117
|
-
".f1i3iumi{line-height:var(--lineHeightBase300);}"
|
|
118
|
-
]
|
|
119
|
-
});
|
|
120
113
|
const useDescriptionStyles = /*#__PURE__*/ (0, _react["__styles"])({
|
|
121
114
|
base: {
|
|
122
115
|
Bahqtrf: "fk6fouc",
|
|
@@ -163,7 +156,6 @@ const useTreeItemPersonaLayoutStyles_unstable = (state)=>{
|
|
|
163
156
|
const rootStyles = useRootStyles();
|
|
164
157
|
const mediaStyles = useMediaStyles();
|
|
165
158
|
const contentStyles = useContentStyles();
|
|
166
|
-
const mainStyles = useMainStyles();
|
|
167
159
|
const descriptionStyles = useDescriptionStyles();
|
|
168
160
|
const asideStyles = useAsideStyles();
|
|
169
161
|
state.root.className = (0, _react.mergeClasses)(treeItemPersonaLayoutClassNames.root, rootStyles.base, state.root.className);
|
|
@@ -172,7 +164,7 @@ const useTreeItemPersonaLayoutStyles_unstable = (state)=>{
|
|
|
172
164
|
state.content.className = (0, _react.mergeClasses)(treeItemPersonaLayoutClassNames.content, contentStyles.base, state.content.className);
|
|
173
165
|
}
|
|
174
166
|
if (state.main) {
|
|
175
|
-
state.main.className = (0, _react.mergeClasses)(treeItemPersonaLayoutClassNames.main,
|
|
167
|
+
state.main.className = (0, _react.mergeClasses)(treeItemPersonaLayoutClassNames.main, state.main.className);
|
|
176
168
|
}
|
|
177
169
|
if (state.description) {
|
|
178
170
|
state.description.className = (0, _react.mergeClasses)(treeItemPersonaLayoutClassNames.description, descriptionStyles.base, state.description.className);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../lib/components/TreeItemPersonaLayout/useTreeItemPersonaLayoutStyles.js"],"sourcesContent":["import { __styles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nexport const treeItemPersonaLayoutClassNames = {\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 * Styles for the root slot\n */\nconst useRootStyles = /*#__PURE__*/__styles({\n base: {\n a9b677: \"fly5x3f\",\n mc9l5x: \"f22iagw\",\n Bt984gj: \"f122n59\"\n }\n}, {\n d: [\".fly5x3f{width:100%;}\", \".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}\", \".f122n59{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}\"]\n});\n/**\n * Styles for the expand icon slot\n */\nconst useMediaStyles = /*#__PURE__*/__styles({\n base: {\n mc9l5x: \"f22iagw\",\n Bt984gj: \"f122n59\",\n a9b677: \"f1szoe96\",\n Bqenvij: \"f1d2rq10\",\n z8tnut: \"f1g0x7ka\",\n z189sj: [\"f7x41pl\", \"fruq291\"],\n Byoj8tv: \"f1qch9an\",\n uwmqm3: [\"fgiv446\", \"ffczdla\"]\n }\n}, {\n d: [\".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}\", \".f122n59{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}\", \".f1szoe96{width:32px;}\", \".f1d2rq10{height:32px;}\", \".f1g0x7ka{padding-top:0;}\", \".f7x41pl{padding-right:var(--spacingHorizontalXS);}\", \".fruq291{padding-left:var(--spacingHorizontalXS);}\", \".f1qch9an{padding-bottom:0;}\", \".fgiv446{padding-left:var(--spacingHorizontalXXS);}\", \".ffczdla{padding-right:var(--spacingHorizontalXXS);}\"]\n});\nconst useContentStyles = /*#__PURE__*/__styles({\n base: {\n a9b677: \"fly5x3f\",\n mc9l5x: \"f22iagw\",\n Beiy3e4: \"f1vx9l62\",\n z8tnut: \"f1ngh7ph\",\n z189sj: [\"f7x41pl\", \"fruq291\"],\n Byoj8tv: \"f5o476b\",\n uwmqm3: [\"f1f5gg8d\", \"f1vdfbxk\"],\n i8kkvl: \"f1fps8zv\",\n Belr9w4: \"fws515f\"\n }\n}, {\n d: [\".fly5x3f{width:100%;}\", \".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}\", \".f1vx9l62{-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}\", \".f1ngh7ph{padding-top:var(--spacingVerticalMNudge);}\", \".f7x41pl{padding-right:var(--spacingHorizontalXS);}\", \".fruq291{padding-left:var(--spacingHorizontalXS);}\", \".f5o476b{padding-bottom:var(--spacingVerticalMNudge);}\", \".f1f5gg8d{padding-left:var(--spacingHorizontalS);}\", \".f1vdfbxk{padding-right:var(--spacingHorizontalS);}\", \".f1fps8zv{-webkit-column-gap:var(--spacingVerticalNone);column-gap:var(--spacingVerticalNone);}\", \".fws515f{row-gap:var(--spacingHorizontalNone);}\"]\n});\nconst
|
|
1
|
+
{"version":3,"sources":["../../../lib/components/TreeItemPersonaLayout/useTreeItemPersonaLayoutStyles.js"],"sourcesContent":["import { __styles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nexport const treeItemPersonaLayoutClassNames = {\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 * Styles for the root slot\n */\nconst useRootStyles = /*#__PURE__*/__styles({\n base: {\n a9b677: \"fly5x3f\",\n mc9l5x: \"f22iagw\",\n Bt984gj: \"f122n59\",\n Bahqtrf: \"fk6fouc\",\n Be2twd7: \"fkhj508\",\n Bhrd7zp: \"figsok6\",\n Bg96gwp: \"f1i3iumi\"\n }\n}, {\n d: [\".fly5x3f{width:100%;}\", \".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}\", \".f122n59{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}\", \".fk6fouc{font-family:var(--fontFamilyBase);}\", \".fkhj508{font-size:var(--fontSizeBase300);}\", \".figsok6{font-weight:var(--fontWeightRegular);}\", \".f1i3iumi{line-height:var(--lineHeightBase300);}\"]\n});\n/**\n * Styles for the expand icon slot\n */\nconst useMediaStyles = /*#__PURE__*/__styles({\n base: {\n mc9l5x: \"f22iagw\",\n Bt984gj: \"f122n59\",\n a9b677: \"f1szoe96\",\n Bqenvij: \"f1d2rq10\",\n z8tnut: \"f1g0x7ka\",\n z189sj: [\"f7x41pl\", \"fruq291\"],\n Byoj8tv: \"f1qch9an\",\n uwmqm3: [\"fgiv446\", \"ffczdla\"]\n }\n}, {\n d: [\".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}\", \".f122n59{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}\", \".f1szoe96{width:32px;}\", \".f1d2rq10{height:32px;}\", \".f1g0x7ka{padding-top:0;}\", \".f7x41pl{padding-right:var(--spacingHorizontalXS);}\", \".fruq291{padding-left:var(--spacingHorizontalXS);}\", \".f1qch9an{padding-bottom:0;}\", \".fgiv446{padding-left:var(--spacingHorizontalXXS);}\", \".ffczdla{padding-right:var(--spacingHorizontalXXS);}\"]\n});\nconst useContentStyles = /*#__PURE__*/__styles({\n base: {\n a9b677: \"fly5x3f\",\n mc9l5x: \"f22iagw\",\n Beiy3e4: \"f1vx9l62\",\n z8tnut: \"f1ngh7ph\",\n z189sj: [\"f7x41pl\", \"fruq291\"],\n Byoj8tv: \"f5o476b\",\n uwmqm3: [\"f1f5gg8d\", \"f1vdfbxk\"],\n i8kkvl: \"f1fps8zv\",\n Belr9w4: \"fws515f\"\n }\n}, {\n d: [\".fly5x3f{width:100%;}\", \".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}\", \".f1vx9l62{-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}\", \".f1ngh7ph{padding-top:var(--spacingVerticalMNudge);}\", \".f7x41pl{padding-right:var(--spacingHorizontalXS);}\", \".fruq291{padding-left:var(--spacingHorizontalXS);}\", \".f5o476b{padding-bottom:var(--spacingVerticalMNudge);}\", \".f1f5gg8d{padding-left:var(--spacingHorizontalS);}\", \".f1vdfbxk{padding-right:var(--spacingHorizontalS);}\", \".f1fps8zv{-webkit-column-gap:var(--spacingVerticalNone);column-gap:var(--spacingVerticalNone);}\", \".fws515f{row-gap:var(--spacingHorizontalNone);}\"]\n});\nconst useDescriptionStyles = /*#__PURE__*/__styles({\n base: {\n Bahqtrf: \"fk6fouc\",\n Be2twd7: \"fy9rknc\",\n Bhrd7zp: \"figsok6\",\n Bg96gwp: \"fwrc4pm\"\n }\n}, {\n d: [\".fk6fouc{font-family:var(--fontFamilyBase);}\", \".fy9rknc{font-size:var(--fontSizeBase200);}\", \".figsok6{font-weight:var(--fontWeightRegular);}\", \".fwrc4pm{line-height:var(--lineHeightBase200);}\"]\n});\nconst useAsideStyles = /*#__PURE__*/__styles({\n base: {\n mc9l5x: \"f22iagw\",\n Beiy3e4: \"f1vx9l62\",\n Huce71: \"fz5stix\",\n z189sj: [\"fw5db7e\", \"f1uw59to\"],\n Bahqtrf: \"fk6fouc\",\n Be2twd7: \"fy9rknc\",\n Bhrd7zp: \"figsok6\",\n Bg96gwp: \"fwrc4pm\"\n }\n}, {\n d: [\".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}\", \".f1vx9l62{-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}\", \".fz5stix{white-space:nowrap;}\", \".fw5db7e{padding-right:var(--spacingHorizontalM);}\", \".f1uw59to{padding-left:var(--spacingHorizontalM);}\", \".fk6fouc{font-family:var(--fontFamilyBase);}\", \".fy9rknc{font-size:var(--fontSizeBase200);}\", \".figsok6{font-weight:var(--fontWeightRegular);}\", \".fwrc4pm{line-height:var(--lineHeightBase200);}\"]\n});\n/**\n * Apply styling to the TreeItemPersonaLayout slots based on the state\n */\nexport const useTreeItemPersonaLayoutStyles_unstable = state => {\n const rootStyles = useRootStyles();\n const mediaStyles = useMediaStyles();\n const contentStyles = useContentStyles();\n const descriptionStyles = useDescriptionStyles();\n const asideStyles = useAsideStyles();\n state.root.className = mergeClasses(treeItemPersonaLayoutClassNames.root, rootStyles.base, state.root.className);\n state.media.className = mergeClasses(treeItemPersonaLayoutClassNames.media, mediaStyles.base, state.media.className);\n if (state.content) {\n state.content.className = mergeClasses(treeItemPersonaLayoutClassNames.content, contentStyles.base, state.content.className);\n }\n if (state.main) {\n state.main.className = mergeClasses(treeItemPersonaLayoutClassNames.main, state.main.className);\n }\n if (state.description) {\n state.description.className = mergeClasses(treeItemPersonaLayoutClassNames.description, descriptionStyles.base, state.description.className);\n }\n if (state.aside) {\n state.aside.className = mergeClasses(treeItemPersonaLayoutClassNames.aside, asideStyles.base, state.aside.className);\n }\n return state;\n};\n//# sourceMappingURL=useTreeItemPersonaLayoutStyles.js.map"],"names":["treeItemPersonaLayoutClassNames","useTreeItemPersonaLayoutStyles_unstable","root","media","content","description","aside","main","useRootStyles","__styles","base","a9b677","mc9l5x","Bt984gj","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","d","useMediaStyles","Bqenvij","z8tnut","z189sj","Byoj8tv","uwmqm3","useContentStyles","Beiy3e4","i8kkvl","Belr9w4","useDescriptionStyles","useAsideStyles","Huce71","state","rootStyles","mediaStyles","contentStyles","descriptionStyles","asideStyles","className","mergeClasses"],"mappings":"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"}
|
|
@@ -36,13 +36,13 @@ function useFlatTree_unstable(flatTreeItemProps, options = {}) {
|
|
|
36
36
|
event.preventDefault();
|
|
37
37
|
});
|
|
38
38
|
const getNextNavigableItem = (0, _reactUtilities.useEventCallback)((visibleItems, data)=>{
|
|
39
|
-
const item = flatTreeItems.get(data.
|
|
39
|
+
const item = flatTreeItems.get(data.value);
|
|
40
40
|
if (item) {
|
|
41
41
|
switch(data.type){
|
|
42
42
|
case _tokens.treeDataTypes.typeAhead:
|
|
43
43
|
return item;
|
|
44
44
|
case _tokens.treeDataTypes.arrowLeft:
|
|
45
|
-
return flatTreeItems.get(item.
|
|
45
|
+
return flatTreeItems.get(item.parentValue);
|
|
46
46
|
case _tokens.treeDataTypes.arrowRight:
|
|
47
47
|
return visibleItems[item.index + 1];
|
|
48
48
|
case _tokens.treeDataTypes.end:
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../lib/hooks/useFlatTree.js"],"sourcesContent":["import { useEventCallback } from '@fluentui/react-utilities';\nimport * as React from 'react';\nimport { createFlatTreeItems, VisibleFlatTreeItemGenerator } from '../utils/createFlatTreeItems';\nimport { treeDataTypes } from '../utils/tokens';\nimport { useFlatTreeNavigation } from './useFlatTreeNavigation';\nimport { useOpenItemsState } from './useOpenItemsState';\n/**\n * this hook provides FlatTree API to manage all required mechanisms to convert a list of items into renderable TreeItems\n * in multiple scenarios including virtualization.\n *\n * !!A flat tree is an unofficial spec for tree!!\n *\n * It should be used on cases where more complex interactions with a Tree is required.\n * On simple scenarios it is advised to simply use a nested structure instead.\n *\n * @param flatTreeItemProps - a list of tree items\n * @param options - in case control over the internal openItems is required\n */\nexport function useFlatTree_unstable(flatTreeItemProps, options = {}) {\n const [openItems, updateOpenItems] = useOpenItemsState(options);\n const flatTreeItems = React.useMemo(() => createFlatTreeItems(flatTreeItemProps), [flatTreeItemProps]);\n const [navigate, navigationRef] = useFlatTreeNavigation(flatTreeItems);\n const handleOpenChange = useEventCallback((event, data) => {\n var _options_onOpenChange;\n (_options_onOpenChange = options.onOpenChange) === null || _options_onOpenChange === void 0 ? void 0 : _options_onOpenChange.call(options, event, data);\n if (!event.isDefaultPrevented()) {\n updateOpenItems(data);\n }\n event.preventDefault();\n });\n const handleNavigation = useEventCallback((event, data) => {\n var _options_onNavigation_unstable;\n (_options_onNavigation_unstable = options.onNavigation_unstable) === null || _options_onNavigation_unstable === void 0 ? void 0 : _options_onNavigation_unstable.call(options, event, data);\n if (!event.isDefaultPrevented()) {\n navigate(data);\n }\n event.preventDefault();\n });\n const getNextNavigableItem = useEventCallback((visibleItems, data) => {\n const item = flatTreeItems.get(data.
|
|
1
|
+
{"version":3,"sources":["../../lib/hooks/useFlatTree.js"],"sourcesContent":["import { useEventCallback } from '@fluentui/react-utilities';\nimport * as React from 'react';\nimport { createFlatTreeItems, VisibleFlatTreeItemGenerator } from '../utils/createFlatTreeItems';\nimport { treeDataTypes } from '../utils/tokens';\nimport { useFlatTreeNavigation } from './useFlatTreeNavigation';\nimport { useOpenItemsState } from './useOpenItemsState';\n/**\n * this hook provides FlatTree API to manage all required mechanisms to convert a list of items into renderable TreeItems\n * in multiple scenarios including virtualization.\n *\n * !!A flat tree is an unofficial spec for tree!!\n *\n * It should be used on cases where more complex interactions with a Tree is required.\n * On simple scenarios it is advised to simply use a nested structure instead.\n *\n * @param flatTreeItemProps - a list of tree items\n * @param options - in case control over the internal openItems is required\n */\nexport function useFlatTree_unstable(flatTreeItemProps, options = {}) {\n const [openItems, updateOpenItems] = useOpenItemsState(options);\n const flatTreeItems = React.useMemo(() => createFlatTreeItems(flatTreeItemProps), [flatTreeItemProps]);\n const [navigate, navigationRef] = useFlatTreeNavigation(flatTreeItems);\n const handleOpenChange = useEventCallback((event, data) => {\n var _options_onOpenChange;\n (_options_onOpenChange = options.onOpenChange) === null || _options_onOpenChange === void 0 ? void 0 : _options_onOpenChange.call(options, event, data);\n if (!event.isDefaultPrevented()) {\n updateOpenItems(data);\n }\n event.preventDefault();\n });\n const handleNavigation = useEventCallback((event, data) => {\n var _options_onNavigation_unstable;\n (_options_onNavigation_unstable = options.onNavigation_unstable) === null || _options_onNavigation_unstable === void 0 ? void 0 : _options_onNavigation_unstable.call(options, event, data);\n if (!event.isDefaultPrevented()) {\n navigate(data);\n }\n event.preventDefault();\n });\n const getNextNavigableItem = useEventCallback((visibleItems, data) => {\n const item = flatTreeItems.get(data.value);\n if (item) {\n switch (data.type) {\n case treeDataTypes.typeAhead:\n return item;\n case treeDataTypes.arrowLeft:\n return flatTreeItems.get(item.parentValue);\n case treeDataTypes.arrowRight:\n return visibleItems[item.index + 1];\n case treeDataTypes.end:\n return visibleItems[visibleItems.length - 1];\n case treeDataTypes.home:\n return visibleItems[0];\n case treeDataTypes.arrowDown:\n return visibleItems[item.index + 1];\n case treeDataTypes.arrowUp:\n return visibleItems[item.index - 1];\n }\n }\n });\n const getTreeProps = React.useCallback(() => ({\n ref: navigationRef,\n openItems,\n onOpenChange: handleOpenChange,\n // eslint-disable-next-line @typescript-eslint/naming-convention\n onNavigation_unstable: handleNavigation\n }),\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [openItems]);\n const items = React.useCallback(() => VisibleFlatTreeItemGenerator(openItems, flatTreeItems), [openItems, flatTreeItems]);\n return React.useMemo(() => ({\n navigate,\n getTreeProps,\n getNextNavigableItem,\n items\n }), [navigate, getTreeProps, getNextNavigableItem, items]);\n}\n//# sourceMappingURL=useFlatTree.js.map"],"names":["useFlatTree_unstable","flatTreeItemProps","options","openItems","updateOpenItems","useOpenItemsState","flatTreeItems","React","useMemo","createFlatTreeItems","navigate","navigationRef","useFlatTreeNavigation","handleOpenChange","useEventCallback","event","data","_options_onOpenChange","onOpenChange","call","isDefaultPrevented","preventDefault","handleNavigation","_options_onNavigation_unstable","onNavigation_unstable","getNextNavigableItem","visibleItems","item","get","value","type","treeDataTypes","typeAhead","arrowLeft","parentValue","arrowRight","index","end","length","home","arrowDown","arrowUp","getTreeProps","useCallback","ref","items","VisibleFlatTreeItemGenerator"],"mappings":";;;;+BAkBgBA;;aAAAA;;;gCAlBiB;6DACV;qCAC2C;wBACpC;uCACQ;mCACJ;AAa3B,SAASA,qBAAqBC,iBAAiB,EAAEC,UAAU,CAAC,CAAC,EAAE;IACpE,MAAM,CAACC,WAAWC,gBAAgB,GAAGC,IAAAA,oCAAiB,EAACH;IACvD,MAAMI,gBAAgBC,OAAMC,OAAO,CAAC,IAAMC,IAAAA,wCAAmB,EAACR,oBAAoB;QAACA;KAAkB;IACrG,MAAM,CAACS,UAAUC,cAAc,GAAGC,IAAAA,4CAAqB,EAACN;IACxD,MAAMO,mBAAmBC,IAAAA,gCAAgB,EAAC,CAACC,OAAOC,OAAS;QACzD,IAAIC;QACHA,CAAAA,wBAAwBf,QAAQgB,YAAY,AAAD,MAAO,IAAI,IAAID,0BAA0B,KAAK,IAAI,KAAK,IAAIA,sBAAsBE,IAAI,CAACjB,SAASa,OAAOC,KAAK;QACvJ,IAAI,CAACD,MAAMK,kBAAkB,IAAI;YAC/BhB,gBAAgBY;QAClB,CAAC;QACDD,MAAMM,cAAc;IACtB;IACA,MAAMC,mBAAmBR,IAAAA,gCAAgB,EAAC,CAACC,OAAOC,OAAS;QACzD,IAAIO;QACHA,CAAAA,iCAAiCrB,QAAQsB,qBAAqB,AAAD,MAAO,IAAI,IAAID,mCAAmC,KAAK,IAAI,KAAK,IAAIA,+BAA+BJ,IAAI,CAACjB,SAASa,OAAOC,KAAK;QAC3L,IAAI,CAACD,MAAMK,kBAAkB,IAAI;YAC/BV,SAASM;QACX,CAAC;QACDD,MAAMM,cAAc;IACtB;IACA,MAAMI,uBAAuBX,IAAAA,gCAAgB,EAAC,CAACY,cAAcV,OAAS;QACpE,MAAMW,OAAOrB,cAAcsB,GAAG,CAACZ,KAAKa,KAAK;QACzC,IAAIF,MAAM;YACR,OAAQX,KAAKc,IAAI;gBACf,KAAKC,qBAAa,CAACC,SAAS;oBAC1B,OAAOL;gBACT,KAAKI,qBAAa,CAACE,SAAS;oBAC1B,OAAO3B,cAAcsB,GAAG,CAACD,KAAKO,WAAW;gBAC3C,KAAKH,qBAAa,CAACI,UAAU;oBAC3B,OAAOT,YAAY,CAACC,KAAKS,KAAK,GAAG,EAAE;gBACrC,KAAKL,qBAAa,CAACM,GAAG;oBACpB,OAAOX,YAAY,CAACA,aAAaY,MAAM,GAAG,EAAE;gBAC9C,KAAKP,qBAAa,CAACQ,IAAI;oBACrB,OAAOb,YAAY,CAAC,EAAE;gBACxB,KAAKK,qBAAa,CAACS,SAAS;oBAC1B,OAAOd,YAAY,CAACC,KAAKS,KAAK,GAAG,EAAE;gBACrC,KAAKL,qBAAa,CAACU,OAAO;oBACxB,OAAOf,YAAY,CAACC,KAAKS,KAAK,GAAG,EAAE;YACvC;QACF,CAAC;IACH;IACA,MAAMM,eAAenC,OAAMoC,WAAW,CAAC,IAAO,CAAA;YAC5CC,KAAKjC;YACLR;YACAe,cAAcL;YACd,gEAAgE;YAChEW,uBAAuBF;QACzB,CAAA,GACA,uDAAuD;IACvD;QAACnB;KAAU;IACX,MAAM0C,QAAQtC,OAAMoC,WAAW,CAAC,IAAMG,IAAAA,iDAA4B,EAAC3C,WAAWG,gBAAgB;QAACH;QAAWG;KAAc;IACxH,OAAOC,OAAMC,OAAO,CAAC,IAAO,CAAA;YAC1BE;YACAgC;YACAjB;YACAoB;QACF,CAAA,GAAI;QAACnC;QAAUgC;QAAcjB;QAAsBoB;KAAM;AAC3D,EACA,uCAAuC"}
|
|
@@ -29,7 +29,7 @@ function useFlatTreeNavigation(flatTreeItems) {
|
|
|
29
29
|
treeItemWalker.currentElement = data.target;
|
|
30
30
|
return (0, _nextTypeAheadElement.nextTypeAheadElement)(treeItemWalker, data.event.key);
|
|
31
31
|
case _tokens.treeDataTypes.arrowLeft:
|
|
32
|
-
return parentElement(flatTreeItems, data.
|
|
32
|
+
return parentElement(flatTreeItems, data.value);
|
|
33
33
|
case _tokens.treeDataTypes.arrowRight:
|
|
34
34
|
treeItemWalker.currentElement = data.target;
|
|
35
35
|
return firstChild(data.target, treeItemWalker);
|
|
@@ -71,10 +71,12 @@ function firstChild(target, treeWalker) {
|
|
|
71
71
|
}
|
|
72
72
|
return null;
|
|
73
73
|
}
|
|
74
|
-
function parentElement(flatTreeItems,
|
|
75
|
-
const flatTreeItem = flatTreeItems.get(
|
|
76
|
-
if (flatTreeItem
|
|
77
|
-
|
|
74
|
+
function parentElement(flatTreeItems, value) {
|
|
75
|
+
const flatTreeItem = flatTreeItems.get(value);
|
|
76
|
+
if (flatTreeItem === null || flatTreeItem === void 0 ? void 0 : flatTreeItem.parentValue) {
|
|
77
|
+
const parentItem = flatTreeItems.get(flatTreeItem.parentValue);
|
|
78
|
+
var _parentItem_ref_current;
|
|
79
|
+
return (_parentItem_ref_current = parentItem === null || parentItem === void 0 ? void 0 : parentItem.ref.current) !== null && _parentItem_ref_current !== void 0 ? _parentItem_ref_current : null;
|
|
78
80
|
}
|
|
79
81
|
return null;
|
|
80
82
|
} //# sourceMappingURL=useFlatTreeNavigation.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../lib/hooks/useFlatTreeNavigation.js"],"sourcesContent":["import { useFluent_unstable } from '@fluentui/react-shared-contexts';\nimport { useEventCallback, useMergedRefs } from '@fluentui/react-utilities';\nimport { nextTypeAheadElement } from '../utils/nextTypeAheadElement';\nimport { treeDataTypes } from '../utils/tokens';\nimport { treeItemFilter } from '../utils/treeItemFilter';\nimport { useHTMLElementWalkerRef } from './useHTMLElementWalker';\nimport { useRovingTabIndex } from './useRovingTabIndexes';\nexport function useFlatTreeNavigation(flatTreeItems) {\n const {\n targetDocument\n } = useFluent_unstable();\n const [treeItemWalkerRef, treeItemWalkerRootRef] = useHTMLElementWalkerRef(treeItemFilter);\n const [{\n rove\n }, rovingRootRef] = useRovingTabIndex(treeItemFilter);\n function getNextElement(data) {\n if (!targetDocument || !treeItemWalkerRef.current) {\n return null;\n }\n const treeItemWalker = treeItemWalkerRef.current;\n switch (data.type) {\n case treeDataTypes.click:\n return data.target;\n case treeDataTypes.typeAhead:\n treeItemWalker.currentElement = data.target;\n return nextTypeAheadElement(treeItemWalker, data.event.key);\n case treeDataTypes.arrowLeft:\n return parentElement(flatTreeItems, data.
|
|
1
|
+
{"version":3,"sources":["../../lib/hooks/useFlatTreeNavigation.js"],"sourcesContent":["import { useFluent_unstable } from '@fluentui/react-shared-contexts';\nimport { useEventCallback, useMergedRefs } from '@fluentui/react-utilities';\nimport { nextTypeAheadElement } from '../utils/nextTypeAheadElement';\nimport { treeDataTypes } from '../utils/tokens';\nimport { treeItemFilter } from '../utils/treeItemFilter';\nimport { useHTMLElementWalkerRef } from './useHTMLElementWalker';\nimport { useRovingTabIndex } from './useRovingTabIndexes';\nexport function useFlatTreeNavigation(flatTreeItems) {\n const {\n targetDocument\n } = useFluent_unstable();\n const [treeItemWalkerRef, treeItemWalkerRootRef] = useHTMLElementWalkerRef(treeItemFilter);\n const [{\n rove\n }, rovingRootRef] = useRovingTabIndex(treeItemFilter);\n function getNextElement(data) {\n if (!targetDocument || !treeItemWalkerRef.current) {\n return null;\n }\n const treeItemWalker = treeItemWalkerRef.current;\n switch (data.type) {\n case treeDataTypes.click:\n return data.target;\n case treeDataTypes.typeAhead:\n treeItemWalker.currentElement = data.target;\n return nextTypeAheadElement(treeItemWalker, data.event.key);\n case treeDataTypes.arrowLeft:\n return parentElement(flatTreeItems, data.value);\n case treeDataTypes.arrowRight:\n treeItemWalker.currentElement = data.target;\n return firstChild(data.target, treeItemWalker);\n case treeDataTypes.end:\n treeItemWalker.currentElement = treeItemWalker.root;\n return treeItemWalker.lastChild();\n case treeDataTypes.home:\n treeItemWalker.currentElement = treeItemWalker.root;\n return treeItemWalker.firstChild();\n case treeDataTypes.arrowDown:\n treeItemWalker.currentElement = data.target;\n return treeItemWalker.nextElement();\n case treeDataTypes.arrowUp:\n treeItemWalker.currentElement = data.target;\n return treeItemWalker.previousElement();\n }\n }\n const navigate = useEventCallback(data => {\n const nextElement = getNextElement(data);\n if (nextElement) {\n rove(nextElement);\n }\n });\n return [navigate, useMergedRefs(treeItemWalkerRootRef, rovingRootRef)];\n}\nfunction firstChild(target, treeWalker) {\n const nextElement = treeWalker.nextElement();\n if (!nextElement) {\n return null;\n }\n const nextElementAriaPosInSet = nextElement.getAttribute('aria-posinset');\n const nextElementAriaLevel = nextElement.getAttribute('aria-level');\n const targetAriaLevel = target.getAttribute('aria-level');\n if (nextElementAriaPosInSet === '1' && Number(nextElementAriaLevel) === Number(targetAriaLevel) + 1) {\n return nextElement;\n }\n return null;\n}\nfunction parentElement(flatTreeItems, value) {\n const flatTreeItem = flatTreeItems.get(value);\n if (flatTreeItem === null || flatTreeItem === void 0 ? void 0 : flatTreeItem.parentValue) {\n const parentItem = flatTreeItems.get(flatTreeItem.parentValue);\n var _parentItem_ref_current;\n return (_parentItem_ref_current = parentItem === null || parentItem === void 0 ? void 0 : parentItem.ref.current) !== null && _parentItem_ref_current !== void 0 ? _parentItem_ref_current : null;\n }\n return null;\n}\n//# sourceMappingURL=useFlatTreeNavigation.js.map"],"names":["useFlatTreeNavigation","flatTreeItems","targetDocument","useFluent_unstable","treeItemWalkerRef","treeItemWalkerRootRef","useHTMLElementWalkerRef","treeItemFilter","rove","rovingRootRef","useRovingTabIndex","getNextElement","data","current","treeItemWalker","type","treeDataTypes","click","target","typeAhead","currentElement","nextTypeAheadElement","event","key","arrowLeft","parentElement","value","arrowRight","firstChild","end","root","lastChild","home","arrowDown","nextElement","arrowUp","previousElement","navigate","useEventCallback","useMergedRefs","treeWalker","nextElementAriaPosInSet","getAttribute","nextElementAriaLevel","targetAriaLevel","Number","flatTreeItem","get","parentValue","parentItem","_parentItem_ref_current","ref"],"mappings":"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"}
|
|
@@ -6,12 +6,12 @@ Object.defineProperty(exports, "useNestedTreeNavigation", {
|
|
|
6
6
|
enumerable: true,
|
|
7
7
|
get: ()=>useNestedTreeNavigation
|
|
8
8
|
});
|
|
9
|
+
const _reactUtilities = require("@fluentui/react-utilities");
|
|
9
10
|
const _useHTMLElementWalker = require("./useHTMLElementWalker");
|
|
10
11
|
const _nextTypeAheadElement = require("../utils/nextTypeAheadElement");
|
|
11
12
|
const _tokens = require("../utils/tokens");
|
|
12
13
|
const _treeItemFilter = require("../utils/treeItemFilter");
|
|
13
14
|
const _useRovingTabIndexes = require("./useRovingTabIndexes");
|
|
14
|
-
const _reactUtilities = require("@fluentui/react-utilities");
|
|
15
15
|
function useNestedTreeNavigation() {
|
|
16
16
|
const [{ rove }, rovingRootRef] = (0, _useRovingTabIndexes.useRovingTabIndex)(_treeItemFilter.treeItemFilter);
|
|
17
17
|
const [walkerRef, rootRef] = (0, _useHTMLElementWalker.useHTMLElementWalkerRef)(_treeItemFilter.treeItemFilter);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../lib/hooks/useNestedTreeNavigation.js"],"sourcesContent":["import { useHTMLElementWalkerRef } from './useHTMLElementWalker';\nimport { nextTypeAheadElement } from '../utils/nextTypeAheadElement';\nimport { treeDataTypes } from '../utils/tokens';\nimport { treeItemFilter } from '../utils/treeItemFilter';\nimport { useRovingTabIndex } from './useRovingTabIndexes';\
|
|
1
|
+
{"version":3,"sources":["../../lib/hooks/useNestedTreeNavigation.js"],"sourcesContent":["import { useMergedRefs } from '@fluentui/react-utilities';\nimport { useHTMLElementWalkerRef } from './useHTMLElementWalker';\nimport { nextTypeAheadElement } from '../utils/nextTypeAheadElement';\nimport { treeDataTypes } from '../utils/tokens';\nimport { treeItemFilter } from '../utils/treeItemFilter';\nimport { useRovingTabIndex } from './useRovingTabIndexes';\nexport function useNestedTreeNavigation() {\n const [{\n rove\n }, rovingRootRef] = useRovingTabIndex(treeItemFilter);\n const [walkerRef, rootRef] = useHTMLElementWalkerRef(treeItemFilter);\n const getNextElement = data => {\n if (!walkerRef.current) {\n return;\n }\n const treeItemWalker = walkerRef.current;\n switch (data.type) {\n case treeDataTypes.click:\n return data.target;\n case treeDataTypes.typeAhead:\n treeItemWalker.currentElement = data.target;\n return nextTypeAheadElement(treeItemWalker, data.event.key);\n case treeDataTypes.arrowLeft:\n treeItemWalker.currentElement = data.target;\n return treeItemWalker.parentElement();\n case treeDataTypes.arrowRight:\n treeItemWalker.currentElement = data.target;\n return treeItemWalker.firstChild();\n case treeDataTypes.end:\n treeItemWalker.currentElement = treeItemWalker.root;\n return lastChildRecursive(treeItemWalker);\n case treeDataTypes.home:\n treeItemWalker.currentElement = treeItemWalker.root;\n return treeItemWalker.firstChild();\n case treeDataTypes.arrowDown:\n treeItemWalker.currentElement = data.target;\n return treeItemWalker.nextElement();\n case treeDataTypes.arrowUp:\n treeItemWalker.currentElement = data.target;\n return treeItemWalker.previousElement();\n }\n };\n function navigate(data) {\n const nextElement = getNextElement(data);\n if (nextElement) {\n rove(nextElement);\n }\n }\n return [navigate, useMergedRefs(rootRef, rovingRootRef)];\n}\nfunction lastChildRecursive(walker) {\n let lastElement = null;\n let nextElement = null;\n while (nextElement = walker.lastChild()) {\n lastElement = nextElement;\n }\n return lastElement;\n}\n//# sourceMappingURL=useNestedTreeNavigation.js.map"],"names":["useNestedTreeNavigation","rove","rovingRootRef","useRovingTabIndex","treeItemFilter","walkerRef","rootRef","useHTMLElementWalkerRef","getNextElement","data","current","treeItemWalker","type","treeDataTypes","click","target","typeAhead","currentElement","nextTypeAheadElement","event","key","arrowLeft","parentElement","arrowRight","firstChild","end","root","lastChildRecursive","home","arrowDown","nextElement","arrowUp","previousElement","navigate","useMergedRefs","walker","lastElement","lastChild"],"mappings":";;;;+BAMgBA;;aAAAA;;gCANc;sCACU;sCACH;wBACP;gCACC;qCACG;AAC3B,SAASA,0BAA0B;IACxC,MAAM,CAAC,EACLC,KAAI,EACL,EAAEC,cAAc,GAAGC,IAAAA,sCAAiB,EAACC,8BAAc;IACpD,MAAM,CAACC,WAAWC,QAAQ,GAAGC,IAAAA,6CAAuB,EAACH,8BAAc;IACnE,MAAMI,iBAAiBC,CAAAA,OAAQ;QAC7B,IAAI,CAACJ,UAAUK,OAAO,EAAE;YACtB;QACF,CAAC;QACD,MAAMC,iBAAiBN,UAAUK,OAAO;QACxC,OAAQD,KAAKG,IAAI;YACf,KAAKC,qBAAa,CAACC,KAAK;gBACtB,OAAOL,KAAKM,MAAM;YACpB,KAAKF,qBAAa,CAACG,SAAS;gBAC1BL,eAAeM,cAAc,GAAGR,KAAKM,MAAM;gBAC3C,OAAOG,IAAAA,0CAAoB,EAACP,gBAAgBF,KAAKU,KAAK,CAACC,GAAG;YAC5D,KAAKP,qBAAa,CAACQ,SAAS;gBAC1BV,eAAeM,cAAc,GAAGR,KAAKM,MAAM;gBAC3C,OAAOJ,eAAeW,aAAa;YACrC,KAAKT,qBAAa,CAACU,UAAU;gBAC3BZ,eAAeM,cAAc,GAAGR,KAAKM,MAAM;gBAC3C,OAAOJ,eAAea,UAAU;YAClC,KAAKX,qBAAa,CAACY,GAAG;gBACpBd,eAAeM,cAAc,GAAGN,eAAee,IAAI;gBACnD,OAAOC,mBAAmBhB;YAC5B,KAAKE,qBAAa,CAACe,IAAI;gBACrBjB,eAAeM,cAAc,GAAGN,eAAee,IAAI;gBACnD,OAAOf,eAAea,UAAU;YAClC,KAAKX,qBAAa,CAACgB,SAAS;gBAC1BlB,eAAeM,cAAc,GAAGR,KAAKM,MAAM;gBAC3C,OAAOJ,eAAemB,WAAW;YACnC,KAAKjB,qBAAa,CAACkB,OAAO;gBACxBpB,eAAeM,cAAc,GAAGR,KAAKM,MAAM;gBAC3C,OAAOJ,eAAeqB,eAAe;QACzC;IACF;IACA,SAASC,SAASxB,IAAI,EAAE;QACtB,MAAMqB,cAActB,eAAeC;QACnC,IAAIqB,aAAa;YACf7B,KAAK6B;QACP,CAAC;IACH;IACA,OAAO;QAACG;QAAUC,IAAAA,6BAAa,EAAC5B,SAASJ;KAAe;AAC1D;AACA,SAASyB,mBAAmBQ,MAAM,EAAE;IAClC,IAAIC,cAAc,IAAI;IACtB,IAAIN,cAAc,IAAI;IACtB,MAAOA,cAAcK,OAAOE,SAAS,GAAI;QACvCD,cAAcN;IAChB;IACA,OAAOM;AACT,EACA,mDAAmD"}
|
|
@@ -27,13 +27,12 @@ function useOpenItemsState(props) {
|
|
|
27
27
|
];
|
|
28
28
|
}
|
|
29
29
|
function createNextOpenItems(data, previousOpenItems) {
|
|
30
|
-
const
|
|
31
|
-
const previousOpenItemsHasId = previousOpenItems.has(id);
|
|
30
|
+
const previousOpenItemsHasId = previousOpenItems.has(data.value);
|
|
32
31
|
if (data.open ? previousOpenItemsHasId : !previousOpenItemsHasId) {
|
|
33
32
|
return previousOpenItems;
|
|
34
33
|
}
|
|
35
34
|
const nextOpenItems = (0, _immutableSet.createImmutableSet)(previousOpenItems);
|
|
36
|
-
return data.open ? nextOpenItems.add(
|
|
35
|
+
return data.open ? nextOpenItems.add(data.value) : nextOpenItems.delete(data.value);
|
|
37
36
|
} //# sourceMappingURL=useOpenItemsState.js.map
|
|
38
37
|
|
|
39
38
|
//# sourceMappingURL=useOpenItemsState.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../lib/hooks/useOpenItemsState.js"],"sourcesContent":["import { useControllableState, useEventCallback } from '@fluentui/react-utilities';\nimport * as React from 'react';\nimport { createImmutableSet, emptyImmutableSet } from '../utils/ImmutableSet';\nexport function useOpenItemsState(props) {\n const [openItems, setOpenItems] = useControllableState({\n state: React.useMemo(() => props.openItems && createImmutableSet(props.openItems), [props.openItems]),\n defaultState: React.useMemo(() => props.defaultOpenItems && createImmutableSet(props.defaultOpenItems), [props.defaultOpenItems]),\n initialState: emptyImmutableSet\n });\n const updateOpenItems = useEventCallback(data => setOpenItems(currentOpenItems => createNextOpenItems(data, currentOpenItems)));\n return [openItems, updateOpenItems];\n}\nfunction createNextOpenItems(data, previousOpenItems) {\n const
|
|
1
|
+
{"version":3,"sources":["../../lib/hooks/useOpenItemsState.js"],"sourcesContent":["import { useControllableState, useEventCallback } from '@fluentui/react-utilities';\nimport * as React from 'react';\nimport { createImmutableSet, emptyImmutableSet } from '../utils/ImmutableSet';\nexport function useOpenItemsState(props) {\n const [openItems, setOpenItems] = useControllableState({\n state: React.useMemo(() => props.openItems && createImmutableSet(props.openItems), [props.openItems]),\n defaultState: React.useMemo(() => props.defaultOpenItems && createImmutableSet(props.defaultOpenItems), [props.defaultOpenItems]),\n initialState: emptyImmutableSet\n });\n const updateOpenItems = useEventCallback(data => setOpenItems(currentOpenItems => createNextOpenItems(data, currentOpenItems)));\n return [openItems, updateOpenItems];\n}\nfunction createNextOpenItems(data, previousOpenItems) {\n const previousOpenItemsHasId = previousOpenItems.has(data.value);\n if (data.open ? previousOpenItemsHasId : !previousOpenItemsHasId) {\n return previousOpenItems;\n }\n const nextOpenItems = createImmutableSet(previousOpenItems);\n return data.open ? nextOpenItems.add(data.value) : nextOpenItems.delete(data.value);\n}\n//# sourceMappingURL=useOpenItemsState.js.map"],"names":["useOpenItemsState","props","openItems","setOpenItems","useControllableState","state","React","useMemo","createImmutableSet","defaultState","defaultOpenItems","initialState","emptyImmutableSet","updateOpenItems","useEventCallback","data","currentOpenItems","createNextOpenItems","previousOpenItems","previousOpenItemsHasId","has","value","open","nextOpenItems","add","delete"],"mappings":";;;;+BAGgBA;;aAAAA;;;gCAHuC;6DAChC;8BAC+B;AAC/C,SAASA,kBAAkBC,KAAK,EAAE;IACvC,MAAM,CAACC,WAAWC,aAAa,GAAGC,IAAAA,oCAAoB,EAAC;QACrDC,OAAOC,OAAMC,OAAO,CAAC,IAAMN,MAAMC,SAAS,IAAIM,IAAAA,gCAAkB,EAACP,MAAMC,SAAS,GAAG;YAACD,MAAMC,SAAS;SAAC;QACpGO,cAAcH,OAAMC,OAAO,CAAC,IAAMN,MAAMS,gBAAgB,IAAIF,IAAAA,gCAAkB,EAACP,MAAMS,gBAAgB,GAAG;YAACT,MAAMS,gBAAgB;SAAC;QAChIC,cAAcC,+BAAiB;IACjC;IACA,MAAMC,kBAAkBC,IAAAA,gCAAgB,EAACC,CAAAA,OAAQZ,aAAaa,CAAAA,mBAAoBC,oBAAoBF,MAAMC;IAC5G,OAAO;QAACd;QAAWW;KAAgB;AACrC;AACA,SAASI,oBAAoBF,IAAI,EAAEG,iBAAiB,EAAE;IACpD,MAAMC,yBAAyBD,kBAAkBE,GAAG,CAACL,KAAKM,KAAK;IAC/D,IAAIN,KAAKO,IAAI,GAAGH,yBAAyB,CAACA,sBAAsB,EAAE;QAChE,OAAOD;IACT,CAAC;IACD,MAAMK,gBAAgBf,IAAAA,gCAAkB,EAACU;IACzC,OAAOH,KAAKO,IAAI,GAAGC,cAAcC,GAAG,CAACT,KAAKM,KAAK,IAAIE,cAAcE,MAAM,CAACV,KAAKM,KAAK,CAAC;AACrF,EACA,6CAA6C"}
|