@fluentui/react-tree 9.0.0-beta.11 → 9.0.0-beta.13
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 +195 -1
- package/CHANGELOG.md +46 -2
- package/dist/index.d.ts +189 -100
- package/lib/TreeItemAside.js +2 -0
- package/lib/TreeItemAside.js.map +1 -0
- package/lib/components/Tree/Tree.js +1 -1
- package/lib/components/Tree/Tree.js.map +1 -1
- package/lib/components/Tree/Tree.types.js.map +1 -1
- package/lib/components/Tree/index.js +1 -1
- package/lib/components/Tree/index.js.map +1 -1
- package/lib/components/Tree/renderTree.js +1 -1
- package/lib/components/Tree/renderTree.js.map +1 -1
- package/lib/components/Tree/useRootTree.js +160 -0
- package/lib/components/Tree/useRootTree.js.map +1 -0
- package/lib/components/Tree/useSubtree.js +40 -0
- package/lib/components/Tree/useSubtree.js.map +1 -0
- package/lib/components/Tree/useTree.js +2 -95
- package/lib/components/Tree/useTree.js.map +1 -1
- package/lib/components/Tree/useTreeContextValues.js +2 -4
- package/lib/components/Tree/useTreeContextValues.js.map +1 -1
- package/lib/components/Tree/useTreeStyles.styles.js +30 -0
- package/lib/components/Tree/useTreeStyles.styles.js.map +1 -0
- package/lib/components/TreeItem/TreeItem.js +2 -2
- package/lib/components/TreeItem/TreeItem.js.map +1 -1
- package/lib/components/TreeItem/TreeItem.types.js.map +1 -1
- package/lib/components/TreeItem/index.js +1 -1
- package/lib/components/TreeItem/index.js.map +1 -1
- package/lib/components/TreeItem/renderTreeItem.js +2 -5
- package/lib/components/TreeItem/renderTreeItem.js.map +1 -1
- package/lib/components/TreeItem/useTreeItem.js +65 -175
- package/lib/components/TreeItem/useTreeItem.js.map +1 -1
- package/lib/components/TreeItem/useTreeItemContextValues.js +25 -11
- package/lib/components/TreeItem/useTreeItemContextValues.js.map +1 -1
- package/lib/components/TreeItem/useTreeItemStyles.styles.js +102 -0
- package/lib/components/TreeItem/useTreeItemStyles.styles.js.map +1 -0
- package/lib/components/TreeItemAside/TreeItemAside.js +15 -0
- package/lib/components/TreeItemAside/TreeItemAside.js.map +1 -0
- package/lib/components/TreeItemAside/TreeItemAside.types.js +2 -0
- package/lib/components/TreeItemAside/TreeItemAside.types.js.map +1 -0
- package/lib/components/TreeItemAside/index.js +6 -0
- package/lib/components/TreeItemAside/index.js.map +1 -0
- package/lib/components/TreeItemAside/renderTreeItemAside.js +19 -0
- package/lib/components/TreeItemAside/renderTreeItemAside.js.map +1 -0
- package/lib/components/TreeItemAside/useTreeItemAside.js +35 -0
- package/lib/components/TreeItemAside/useTreeItemAside.js.map +1 -0
- package/lib/components/TreeItemAside/useTreeItemAsideStyles.styles.js +47 -0
- package/lib/components/TreeItemAside/useTreeItemAsideStyles.styles.js.map +1 -0
- package/lib/components/TreeItemChevron.js +27 -0
- package/lib/components/TreeItemChevron.js.map +1 -0
- package/lib/components/TreeItemLayout/TreeItemLayout.js +1 -1
- package/lib/components/TreeItemLayout/TreeItemLayout.js.map +1 -1
- package/lib/components/TreeItemLayout/TreeItemLayout.types.js.map +1 -1
- package/lib/components/TreeItemLayout/index.js +1 -1
- package/lib/components/TreeItemLayout/index.js.map +1 -1
- package/lib/components/TreeItemLayout/renderTreeItemLayout.js +1 -4
- package/lib/components/TreeItemLayout/renderTreeItemLayout.js.map +1 -1
- package/lib/components/TreeItemLayout/useTreeItemLayout.js +16 -11
- package/lib/components/TreeItemLayout/useTreeItemLayout.js.map +1 -1
- package/lib/components/TreeItemLayout/useTreeItemLayoutStyles.styles.js +138 -0
- package/lib/components/TreeItemLayout/useTreeItemLayoutStyles.styles.js.map +1 -0
- package/lib/components/TreeItemPersonaLayout/TreeItemPersonaLayout.js +1 -1
- package/lib/components/TreeItemPersonaLayout/TreeItemPersonaLayout.js.map +1 -1
- package/lib/components/TreeItemPersonaLayout/TreeItemPersonaLayout.types.js.map +1 -1
- package/lib/components/TreeItemPersonaLayout/index.js +1 -1
- package/lib/components/TreeItemPersonaLayout/index.js.map +1 -1
- package/lib/components/TreeItemPersonaLayout/renderTreeItemPersonaLayout.js +2 -5
- package/lib/components/TreeItemPersonaLayout/renderTreeItemPersonaLayout.js.map +1 -1
- package/lib/components/TreeItemPersonaLayout/useTreeItemPersonaLayout.js +16 -20
- package/lib/components/TreeItemPersonaLayout/useTreeItemPersonaLayout.js.map +1 -1
- package/lib/components/TreeItemPersonaLayout/{useTreeItemPersonaLayoutStyles.js → useTreeItemPersonaLayoutStyles.styles.js} +51 -30
- package/lib/components/TreeItemPersonaLayout/useTreeItemPersonaLayoutStyles.styles.js.map +1 -0
- package/lib/contexts/treeContext.js +1 -2
- package/lib/contexts/treeContext.js.map +1 -1
- package/lib/contexts/treeItemContext.js +12 -4
- package/lib/contexts/treeItemContext.js.map +1 -1
- package/lib/hooks/useFlatTree.js +9 -9
- package/lib/hooks/useFlatTree.js.map +1 -1
- package/lib/hooks/useFlatTreeNavigation.js +15 -13
- package/lib/hooks/useFlatTreeNavigation.js.map +1 -1
- package/lib/hooks/useNestedTreeNavigation.js +9 -9
- package/lib/hooks/useNestedTreeNavigation.js.map +1 -1
- package/lib/hooks/useOpenItemsState.js +3 -4
- package/lib/hooks/useOpenItemsState.js.map +1 -1
- package/lib/index.js +1 -0
- package/lib/index.js.map +1 -1
- package/lib/utils/createFlatTreeItems.js +32 -21
- package/lib/utils/createFlatTreeItems.js.map +1 -1
- package/lib/utils/flattenTree.js +4 -29
- package/lib/utils/flattenTree.js.map +1 -1
- package/lib/utils/tokens.js +11 -11
- package/lib/utils/tokens.js.map +1 -1
- package/lib-commonjs/TreeItemAside.js +9 -0
- package/lib-commonjs/TreeItemAside.js.map +1 -0
- package/lib-commonjs/components/Tree/Tree.js +2 -2
- package/lib-commonjs/components/Tree/Tree.js.map +1 -1
- package/lib-commonjs/components/Tree/index.js +1 -1
- package/lib-commonjs/components/Tree/index.js.map +1 -1
- package/lib-commonjs/components/Tree/renderTree.js +1 -1
- package/lib-commonjs/components/Tree/renderTree.js.map +1 -1
- package/lib-commonjs/components/Tree/useRootTree.js +151 -0
- package/lib-commonjs/components/Tree/useRootTree.js.map +1 -0
- package/lib-commonjs/components/Tree/useSubtree.js +41 -0
- package/lib-commonjs/components/Tree/useSubtree.js.map +1 -0
- package/lib-commonjs/components/Tree/useTree.js +4 -89
- package/lib-commonjs/components/Tree/useTree.js.map +1 -1
- package/lib-commonjs/components/Tree/useTreeContextValues.js +2 -3
- package/lib-commonjs/components/Tree/useTreeContextValues.js.map +1 -1
- package/lib-commonjs/components/Tree/{useTreeStyles.js → useTreeStyles.styles.js} +21 -4
- package/lib-commonjs/components/Tree/useTreeStyles.styles.js.map +1 -0
- package/lib-commonjs/components/TreeItem/TreeItem.js +2 -2
- package/lib-commonjs/components/TreeItem/TreeItem.js.map +1 -1
- package/lib-commonjs/components/TreeItem/index.js +1 -1
- package/lib-commonjs/components/TreeItem/index.js.map +1 -1
- package/lib-commonjs/components/TreeItem/renderTreeItem.js +2 -5
- package/lib-commonjs/components/TreeItem/renderTreeItem.js.map +1 -1
- package/lib-commonjs/components/TreeItem/useTreeItem.js +60 -165
- package/lib-commonjs/components/TreeItem/useTreeItem.js.map +1 -1
- package/lib-commonjs/components/TreeItem/useTreeItemContextValues.js +16 -15
- package/lib-commonjs/components/TreeItem/useTreeItemContextValues.js.map +1 -1
- package/lib-commonjs/components/TreeItem/useTreeItemStyles.styles.js +208 -0
- package/lib-commonjs/components/TreeItem/useTreeItemStyles.styles.js.map +1 -0
- package/lib-commonjs/components/TreeItemAside/TreeItemAside.js +21 -0
- package/lib-commonjs/components/TreeItemAside/TreeItemAside.js.map +1 -0
- package/lib-commonjs/components/TreeItemAside/TreeItemAside.types.js +7 -0
- package/lib-commonjs/components/TreeItemAside/TreeItemAside.types.js.map +1 -0
- package/lib-commonjs/components/TreeItemAside/index.js +13 -0
- package/lib-commonjs/components/TreeItemAside/index.js.map +1 -0
- package/lib-commonjs/components/TreeItemAside/renderTreeItemAside.js +22 -0
- package/lib-commonjs/components/TreeItemAside/renderTreeItemAside.js.map +1 -0
- package/lib-commonjs/components/TreeItemAside/useTreeItemAside.js +33 -0
- package/lib-commonjs/components/TreeItemAside/useTreeItemAside.js.map +1 -0
- package/lib-commonjs/components/TreeItemAside/useTreeItemAsideStyles.styles.js +92 -0
- package/lib-commonjs/components/TreeItemAside/useTreeItemAsideStyles.styles.js.map +1 -0
- package/lib-commonjs/components/TreeItemChevron.js +35 -0
- package/lib-commonjs/components/TreeItemChevron.js.map +1 -0
- package/lib-commonjs/components/TreeItemLayout/TreeItemLayout.js +2 -2
- package/lib-commonjs/components/TreeItemLayout/TreeItemLayout.js.map +1 -1
- package/lib-commonjs/components/TreeItemLayout/index.js +1 -1
- package/lib-commonjs/components/TreeItemLayout/index.js.map +1 -1
- package/lib-commonjs/components/TreeItemLayout/renderTreeItemLayout.js +1 -2
- package/lib-commonjs/components/TreeItemLayout/renderTreeItemLayout.js.map +1 -1
- package/lib-commonjs/components/TreeItemLayout/useTreeItemLayout.js +14 -9
- package/lib-commonjs/components/TreeItemLayout/useTreeItemLayout.js.map +1 -1
- package/lib-commonjs/components/TreeItemLayout/useTreeItemLayoutStyles.styles.js +223 -0
- package/lib-commonjs/components/TreeItemLayout/useTreeItemLayoutStyles.styles.js.map +1 -0
- package/lib-commonjs/components/TreeItemPersonaLayout/TreeItemPersonaLayout.js +2 -2
- package/lib-commonjs/components/TreeItemPersonaLayout/TreeItemPersonaLayout.js.map +1 -1
- package/lib-commonjs/components/TreeItemPersonaLayout/index.js +1 -1
- package/lib-commonjs/components/TreeItemPersonaLayout/index.js.map +1 -1
- package/lib-commonjs/components/TreeItemPersonaLayout/renderTreeItemPersonaLayout.js +2 -3
- package/lib-commonjs/components/TreeItemPersonaLayout/renderTreeItemPersonaLayout.js.map +1 -1
- package/lib-commonjs/components/TreeItemPersonaLayout/useTreeItemPersonaLayout.js +14 -14
- package/lib-commonjs/components/TreeItemPersonaLayout/useTreeItemPersonaLayout.js.map +1 -1
- package/lib-commonjs/components/TreeItemPersonaLayout/{useTreeItemPersonaLayoutStyles.js → useTreeItemPersonaLayoutStyles.styles.js} +91 -45
- package/lib-commonjs/components/TreeItemPersonaLayout/useTreeItemPersonaLayoutStyles.styles.js.map +1 -0
- package/lib-commonjs/contexts/treeContext.js +1 -2
- package/lib-commonjs/contexts/treeContext.js.map +1 -1
- package/lib-commonjs/contexts/treeItemContext.js +12 -4
- package/lib-commonjs/contexts/treeItemContext.js.map +1 -1
- package/lib-commonjs/hooks/useFlatTree.js +9 -9
- package/lib-commonjs/hooks/useFlatTree.js.map +1 -1
- package/lib-commonjs/hooks/useFlatTreeNavigation.js +15 -13
- package/lib-commonjs/hooks/useFlatTreeNavigation.js.map +1 -1
- package/lib-commonjs/hooks/useNestedTreeNavigation.js +9 -9
- package/lib-commonjs/hooks/useNestedTreeNavigation.js.map +1 -1
- package/lib-commonjs/hooks/useOpenItemsState.js +3 -6
- package/lib-commonjs/hooks/useOpenItemsState.js.map +1 -1
- package/lib-commonjs/index.js +6 -0
- package/lib-commonjs/index.js.map +1 -1
- package/lib-commonjs/utils/createFlatTreeItems.js +33 -25
- package/lib-commonjs/utils/createFlatTreeItems.js.map +1 -1
- package/lib-commonjs/utils/flattenTree.js +8 -37
- package/lib-commonjs/utils/flattenTree.js.map +1 -1
- package/lib-commonjs/utils/tokens.js +10 -10
- package/lib-commonjs/utils/tokens.js.map +1 -1
- package/package.json +15 -14
- package/.swcrc +0 -30
- package/lib/components/Tree/useTreeStyles.js +0 -20
- package/lib/components/Tree/useTreeStyles.js.map +0 -1
- package/lib/components/TreeItem/useTreeItemStyles.js +0 -203
- package/lib/components/TreeItem/useTreeItemStyles.js.map +0 -1
- package/lib/components/TreeItemLayout/useTreeItemLayoutStyles.js +0 -98
- package/lib/components/TreeItemLayout/useTreeItemLayoutStyles.js.map +0 -1
- package/lib/components/TreeItemPersonaLayout/useTreeItemPersonaLayoutStyles.js.map +0 -1
- package/lib-commonjs/components/Tree/useTreeStyles.js.map +0 -1
- package/lib-commonjs/components/TreeItem/useTreeItemStyles.js +0 -375
- package/lib-commonjs/components/TreeItem/useTreeItemStyles.js.map +0 -1
- package/lib-commonjs/components/TreeItemLayout/useTreeItemLayoutStyles.js +0 -143
- package/lib-commonjs/components/TreeItemLayout/useTreeItemLayoutStyles.js.map +0 -1
- package/lib-commonjs/components/TreeItemPersonaLayout/useTreeItemPersonaLayoutStyles.js.map +0 -1
|
@@ -10,10 +10,10 @@ const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildc
|
|
|
10
10
|
const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
|
|
11
11
|
const _useTreeItemLayout = require("./useTreeItemLayout");
|
|
12
12
|
const _renderTreeItemLayout = require("./renderTreeItemLayout");
|
|
13
|
-
const
|
|
13
|
+
const _useTreeItemLayoutStylesStyles = require("./useTreeItemLayoutStyles.styles");
|
|
14
14
|
const TreeItemLayout = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
|
|
15
15
|
const state = (0, _useTreeItemLayout.useTreeItemLayout_unstable)(props, ref);
|
|
16
|
-
(0,
|
|
16
|
+
(0, _useTreeItemLayoutStylesStyles.useTreeItemLayoutStyles_unstable)(state);
|
|
17
17
|
return (0, _renderTreeItemLayout.renderTreeItemLayout_unstable)(state);
|
|
18
18
|
});
|
|
19
19
|
TreeItemLayout.displayName = 'TreeItemLayout'; //# sourceMappingURL=TreeItemLayout.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../lib/components/TreeItemLayout/TreeItemLayout.js"],"sourcesContent":["import * as React from 'react';\nimport { useTreeItemLayout_unstable } from './useTreeItemLayout';\nimport { renderTreeItemLayout_unstable } from './renderTreeItemLayout';\nimport { useTreeItemLayoutStyles_unstable } from './useTreeItemLayoutStyles';\n/**\n * The `TreeItemLayout` component is used as a child of `TreeItem` to define the content and layout of a tree item.\n * It provides a consistent visual structure for tree items in a `Tree` component.\n * This component should only be used as a direct child of `TreeItem`.\n */\nexport const TreeItemLayout = /*#__PURE__*/React.forwardRef((props, ref) => {\n const state = useTreeItemLayout_unstable(props, ref);\n useTreeItemLayoutStyles_unstable(state);\n return renderTreeItemLayout_unstable(state);\n});\nTreeItemLayout.displayName = 'TreeItemLayout';\n//# sourceMappingURL=TreeItemLayout.js.map"],"names":["TreeItemLayout","React","forwardRef","props","ref","state","useTreeItemLayout_unstable","useTreeItemLayoutStyles_unstable","renderTreeItemLayout_unstable","displayName"],"mappings":";;;;+BASaA;;aAAAA;;;6DATU;mCACoB;sCACG;
|
|
1
|
+
{"version":3,"sources":["../../../lib/components/TreeItemLayout/TreeItemLayout.js"],"sourcesContent":["import * as React from 'react';\nimport { useTreeItemLayout_unstable } from './useTreeItemLayout';\nimport { renderTreeItemLayout_unstable } from './renderTreeItemLayout';\nimport { useTreeItemLayoutStyles_unstable } from './useTreeItemLayoutStyles.styles';\n/**\n * The `TreeItemLayout` component is used as a child of `TreeItem` to define the content and layout of a tree item.\n * It provides a consistent visual structure for tree items in a `Tree` component.\n * This component should only be used as a direct child of `TreeItem`.\n */\nexport const TreeItemLayout = /*#__PURE__*/React.forwardRef((props, ref) => {\n const state = useTreeItemLayout_unstable(props, ref);\n useTreeItemLayoutStyles_unstable(state);\n return renderTreeItemLayout_unstable(state);\n});\nTreeItemLayout.displayName = 'TreeItemLayout';\n//# sourceMappingURL=TreeItemLayout.js.map"],"names":["TreeItemLayout","React","forwardRef","props","ref","state","useTreeItemLayout_unstable","useTreeItemLayoutStyles_unstable","renderTreeItemLayout_unstable","displayName"],"mappings":";;;;+BASaA;;aAAAA;;;6DATU;mCACoB;sCACG;+CACG;AAM1C,MAAMA,iBAAiB,WAAW,GAAEC,OAAMC,UAAU,CAAC,CAACC,OAAOC,MAAQ;IAC1E,MAAMC,QAAQC,IAAAA,6CAA0B,EAACH,OAAOC;IAChDG,IAAAA,+DAAgC,EAACF;IACjC,OAAOG,IAAAA,mDAA6B,EAACH;AACvC;AACAL,eAAeS,WAAW,GAAG,kBAC7B,0CAA0C"}
|
|
@@ -7,7 +7,7 @@ _exportStar(require("./TreeItemLayout"), exports);
|
|
|
7
7
|
_exportStar(require("./TreeItemLayout.types"), exports);
|
|
8
8
|
_exportStar(require("./renderTreeItemLayout"), exports);
|
|
9
9
|
_exportStar(require("./useTreeItemLayout"), exports);
|
|
10
|
-
_exportStar(require("./useTreeItemLayoutStyles"), exports);
|
|
10
|
+
_exportStar(require("./useTreeItemLayoutStyles.styles"), exports);
|
|
11
11
|
//# sourceMappingURL=index.js.map
|
|
12
12
|
|
|
13
13
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../lib/components/TreeItemLayout/index.js"],"sourcesContent":["export * from './TreeItemLayout';\nexport * from './TreeItemLayout.types';\nexport * from './renderTreeItemLayout';\nexport * from './useTreeItemLayout';\nexport * from './useTreeItemLayoutStyles';\n//# sourceMappingURL=index.js.map"],"names":[],"mappings":";;;;;oBAAc;oBACA;oBACA;oBACA;oBACA;CACd,iCAAiC"}
|
|
1
|
+
{"version":3,"sources":["../../../lib/components/TreeItemLayout/index.js"],"sourcesContent":["export * from './TreeItemLayout';\nexport * from './TreeItemLayout.types';\nexport * from './renderTreeItemLayout';\nexport * from './useTreeItemLayout';\nexport * from './useTreeItemLayoutStyles.styles';\n//# sourceMappingURL=index.js.map"],"names":[],"mappings":";;;;;oBAAc;oBACA;oBACA;oBACA;oBACA;CACd,iCAAiC"}
|
|
@@ -9,9 +9,8 @@ Object.defineProperty(exports, "renderTreeItemLayout_unstable", {
|
|
|
9
9
|
const _reactJsxRuntime = require("@fluentui/react-jsx-runtime");
|
|
10
10
|
const _reactUtilities = require("@fluentui/react-utilities");
|
|
11
11
|
const renderTreeItemLayout_unstable = (state)=>{
|
|
12
|
-
const { isActionsVisible } = state;
|
|
13
12
|
const { slots , slotProps } = (0, _reactUtilities.getSlotsNext)(state);
|
|
14
|
-
return /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.root, slotProps.root, slots.
|
|
13
|
+
return /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.root, slotProps.root, slots.expandIcon && /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.expandIcon, slotProps.expandIcon), slots.iconBefore && /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.iconBefore, slotProps.iconBefore), slotProps.root.children, slots.iconAfter && /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.iconAfter, slotProps.iconAfter));
|
|
15
14
|
}; //# sourceMappingURL=renderTreeItemLayout.js.map
|
|
16
15
|
|
|
17
16
|
//# sourceMappingURL=renderTreeItemLayout.js.map
|
|
@@ -1 +1 @@
|
|
|
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
|
|
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 slots,\n slotProps\n } = getSlotsNext(state);\n return /*#__PURE__*/createElement(slots.root, slotProps.root, slots.expandIcon && /*#__PURE__*/createElement(slots.expandIcon, slotProps.expandIcon), slots.iconBefore && /*#__PURE__*/createElement(slots.iconBefore, slotProps.iconBefore), slotProps.root.children, slots.iconAfter && /*#__PURE__*/createElement(slots.iconAfter, slotProps.iconAfter));\n};\n//# sourceMappingURL=renderTreeItemLayout.js.map"],"names":["renderTreeItemLayout_unstable","state","slots","slotProps","getSlotsNext","createElement","root","expandIcon","iconBefore","children","iconAfter"],"mappings":"AAAA,wBAAwB,GAAG,uBAAuB;;;;+BAKrCA;;aAAAA;;iCALqE;gCACrD;AAItB,MAAMA,gCAAgCC,CAAAA,QAAS;IACpD,MAAM,EACJC,MAAK,EACLC,UAAS,EACV,GAAGC,IAAAA,4BAAY,EAACH;IACjB,OAAO,WAAW,GAAEI,IAAAA,8BAAa,EAACH,MAAMI,IAAI,EAAEH,UAAUG,IAAI,EAAEJ,MAAMK,UAAU,IAAI,WAAW,GAAEF,IAAAA,8BAAa,EAACH,MAAMK,UAAU,EAAEJ,UAAUI,UAAU,GAAGL,MAAMM,UAAU,IAAI,WAAW,GAAEH,IAAAA,8BAAa,EAACH,MAAMM,UAAU,EAAEL,UAAUK,UAAU,GAAGL,UAAUG,IAAI,CAACG,QAAQ,EAAEP,MAAMQ,SAAS,IAAI,WAAW,GAAEL,IAAAA,8BAAa,EAACH,MAAMQ,SAAS,EAAEP,UAAUO,SAAS;AAC3V,GACA,gDAAgD"}
|
|
@@ -10,20 +10,22 @@ const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildc
|
|
|
10
10
|
const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
|
|
11
11
|
const _reactUtilities = require("@fluentui/react-utilities");
|
|
12
12
|
const _treeItemContext = require("../../contexts/treeItemContext");
|
|
13
|
+
const _treeItemChevron = require("../TreeItemChevron");
|
|
13
14
|
const useTreeItemLayout_unstable = (props, ref)=>{
|
|
14
|
-
const { iconAfter , iconBefore ,
|
|
15
|
-
const
|
|
15
|
+
const { iconAfter , iconBefore , expandIcon , as ='span' } = props;
|
|
16
|
+
const layoutRef = (0, _treeItemContext.useTreeItemContext_unstable)((ctx)=>ctx.layoutRef);
|
|
17
|
+
const expandIconRef = (0, _treeItemContext.useTreeItemContext_unstable)((ctx)=>ctx.expandIconRef);
|
|
18
|
+
const isBranch = (0, _treeItemContext.useTreeItemContext_unstable)((ctx)=>ctx.itemType === 'branch');
|
|
16
19
|
return {
|
|
17
|
-
...treeItemContext,
|
|
18
20
|
components: {
|
|
19
21
|
root: 'div',
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
22
|
+
expandIcon: 'div',
|
|
23
|
+
iconBefore: 'div',
|
|
24
|
+
iconAfter: 'div'
|
|
23
25
|
},
|
|
24
26
|
root: (0, _reactUtilities.getNativeElementProps)(as, {
|
|
25
27
|
...props,
|
|
26
|
-
ref
|
|
28
|
+
ref: (0, _reactUtilities.useMergedRefs)(ref, layoutRef)
|
|
27
29
|
}),
|
|
28
30
|
iconBefore: (0, _reactUtilities.resolveShorthand)(iconBefore, {
|
|
29
31
|
defaultProps: {
|
|
@@ -35,9 +37,12 @@ const useTreeItemLayout_unstable = (props, ref)=>{
|
|
|
35
37
|
'aria-hidden': true
|
|
36
38
|
}
|
|
37
39
|
}),
|
|
38
|
-
|
|
40
|
+
expandIcon: (0, _reactUtilities.resolveShorthand)(expandIcon, {
|
|
41
|
+
required: isBranch,
|
|
39
42
|
defaultProps: {
|
|
40
|
-
|
|
43
|
+
children: /*#__PURE__*/ _react.createElement(_treeItemChevron.TreeItemChevron, null),
|
|
44
|
+
'aria-hidden': true,
|
|
45
|
+
ref: (0, _reactUtilities.useMergedRefs)((0, _reactUtilities.isResolvedShorthand)(expandIcon) ? expandIcon.ref : undefined, expandIconRef)
|
|
41
46
|
}
|
|
42
47
|
})
|
|
43
48
|
};
|
|
@@ -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
|
|
1
|
+
{"version":3,"sources":["../../../lib/components/TreeItemLayout/useTreeItemLayout.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, isResolvedShorthand, resolveShorthand, useMergedRefs } from '@fluentui/react-utilities';\nimport { useTreeItemContext_unstable } from '../../contexts/treeItemContext';\nimport { TreeItemChevron } from '../TreeItemChevron';\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 expandIcon,\n as = 'span'\n } = props;\n const layoutRef = useTreeItemContext_unstable(ctx => ctx.layoutRef);\n const expandIconRef = useTreeItemContext_unstable(ctx => ctx.expandIconRef);\n const isBranch = useTreeItemContext_unstable(ctx => ctx.itemType === 'branch');\n return {\n components: {\n root: 'div',\n expandIcon: 'div',\n iconBefore: 'div',\n iconAfter: 'div'\n },\n root: getNativeElementProps(as, {\n ...props,\n ref: useMergedRefs(ref, layoutRef)\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 expandIcon: resolveShorthand(expandIcon, {\n required: isBranch,\n defaultProps: {\n children: /*#__PURE__*/React.createElement(TreeItemChevron, null),\n 'aria-hidden': true,\n ref: useMergedRefs(isResolvedShorthand(expandIcon) ? expandIcon.ref : undefined, expandIconRef)\n }\n })\n };\n};\n//# sourceMappingURL=useTreeItemLayout.js.map"],"names":["useTreeItemLayout_unstable","props","ref","iconAfter","iconBefore","expandIcon","as","layoutRef","useTreeItemContext_unstable","ctx","expandIconRef","isBranch","itemType","components","root","getNativeElementProps","useMergedRefs","resolveShorthand","defaultProps","required","children","React","createElement","TreeItemChevron","isResolvedShorthand","undefined"],"mappings":";;;;+BAaaA;;aAAAA;;;6DAbU;gCACqE;iCAChD;iCACZ;AAUzB,MAAMA,6BAA6B,CAACC,OAAOC,MAAQ;IACxD,MAAM,EACJC,UAAS,EACTC,WAAU,EACVC,WAAU,EACVC,IAAK,OAAM,EACZ,GAAGL;IACJ,MAAMM,YAAYC,IAAAA,4CAA2B,EAACC,CAAAA,MAAOA,IAAIF,SAAS;IAClE,MAAMG,gBAAgBF,IAAAA,4CAA2B,EAACC,CAAAA,MAAOA,IAAIC,aAAa;IAC1E,MAAMC,WAAWH,IAAAA,4CAA2B,EAACC,CAAAA,MAAOA,IAAIG,QAAQ,KAAK;IACrE,OAAO;QACLC,YAAY;YACVC,MAAM;YACNT,YAAY;YACZD,YAAY;YACZD,WAAW;QACb;QACAW,MAAMC,IAAAA,qCAAqB,EAACT,IAAI;YAC9B,GAAGL,KAAK;YACRC,KAAKc,IAAAA,6BAAa,EAACd,KAAKK;QAC1B;QACAH,YAAYa,IAAAA,gCAAgB,EAACb,YAAY;YACvCc,cAAc;gBACZ,eAAe,IAAI;YACrB;QACF;QACAf,WAAWc,IAAAA,gCAAgB,EAACd,WAAW;YACrCe,cAAc;gBACZ,eAAe,IAAI;YACrB;QACF;QACAb,YAAYY,IAAAA,gCAAgB,EAACZ,YAAY;YACvCc,UAAUR;YACVO,cAAc;gBACZE,UAAU,WAAW,GAAEC,OAAMC,aAAa,CAACC,gCAAe,EAAE,IAAI;gBAChE,eAAe,IAAI;gBACnBrB,KAAKc,IAAAA,6BAAa,EAACQ,IAAAA,mCAAmB,EAACnB,cAAcA,WAAWH,GAAG,GAAGuB,SAAS,EAAEf;YACnF;QACF;IACF;AACF,GACA,6CAA6C"}
|
|
@@ -0,0 +1,223 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", {
|
|
3
|
+
value: true
|
|
4
|
+
});
|
|
5
|
+
function _export(target, all) {
|
|
6
|
+
for(var name in all)Object.defineProperty(target, name, {
|
|
7
|
+
enumerable: true,
|
|
8
|
+
get: all[name]
|
|
9
|
+
});
|
|
10
|
+
}
|
|
11
|
+
_export(exports, {
|
|
12
|
+
treeItemLayoutClassNames: ()=>treeItemLayoutClassNames,
|
|
13
|
+
useTreeItemLayoutStyles_unstable: ()=>useTreeItemLayoutStyles_unstable
|
|
14
|
+
});
|
|
15
|
+
const _react = require("@griffel/react");
|
|
16
|
+
const _treeContext = require("../../contexts/treeContext");
|
|
17
|
+
const _treeItemContext = require("../../contexts/treeItemContext");
|
|
18
|
+
const treeItemLayoutClassNames = {
|
|
19
|
+
root: 'fui-TreeItemLayout',
|
|
20
|
+
expandIcon: 'fui-TreeItemLayout__expandIcon',
|
|
21
|
+
iconBefore: 'fui-TreeItemLayout__iconBefore',
|
|
22
|
+
iconAfter: 'fui-TreeItemLayout__iconAfter'
|
|
23
|
+
};
|
|
24
|
+
/**
|
|
25
|
+
* Styles for the root slot
|
|
26
|
+
*/ const useRootStyles = /*#__PURE__*/ (0, _react["__styles"])({
|
|
27
|
+
base: {
|
|
28
|
+
mc9l5x: "f22iagw",
|
|
29
|
+
Bt984gj: "f122n59",
|
|
30
|
+
sshi5w: "f1nxs5xn",
|
|
31
|
+
B7ck84d: "f1ewtqcl",
|
|
32
|
+
Ijaq50: "f15ws6j",
|
|
33
|
+
Br312pm: "f135tdbu",
|
|
34
|
+
nk6f5a: "f2e2169",
|
|
35
|
+
Bw0ie65: "f4rqp6x",
|
|
36
|
+
Bbmb7ep: [
|
|
37
|
+
"f1aa9q02",
|
|
38
|
+
"f16jpd5f"
|
|
39
|
+
],
|
|
40
|
+
Beyfa6y: [
|
|
41
|
+
"f16jpd5f",
|
|
42
|
+
"f1aa9q02"
|
|
43
|
+
],
|
|
44
|
+
B7oj6ja: [
|
|
45
|
+
"f1jar5jt",
|
|
46
|
+
"fyu767a"
|
|
47
|
+
],
|
|
48
|
+
Btl43ni: [
|
|
49
|
+
"fyu767a",
|
|
50
|
+
"f1jar5jt"
|
|
51
|
+
],
|
|
52
|
+
lj723h: "flvvhsy",
|
|
53
|
+
ecr2s2: "f1wfn5kd",
|
|
54
|
+
qya0sb: "f1ih54s9",
|
|
55
|
+
Bi91k9c: "fnwyq0v",
|
|
56
|
+
Jwef8y: "f1t94bn6",
|
|
57
|
+
Becwuud: "f1jk1nfw"
|
|
58
|
+
},
|
|
59
|
+
leaf: {
|
|
60
|
+
uwmqm3: [
|
|
61
|
+
"f1k1erfc",
|
|
62
|
+
"faevyjx"
|
|
63
|
+
]
|
|
64
|
+
},
|
|
65
|
+
branch: {
|
|
66
|
+
uwmqm3: [
|
|
67
|
+
"fo100m9",
|
|
68
|
+
"f6yw3pu"
|
|
69
|
+
]
|
|
70
|
+
},
|
|
71
|
+
medium: {
|
|
72
|
+
i8kkvl: "f1rjii52",
|
|
73
|
+
Bahqtrf: "fk6fouc",
|
|
74
|
+
Be2twd7: "fkhj508",
|
|
75
|
+
Bhrd7zp: "figsok6",
|
|
76
|
+
Bg96gwp: "f1i3iumi"
|
|
77
|
+
},
|
|
78
|
+
small: {
|
|
79
|
+
i8kkvl: "f1ufnopg",
|
|
80
|
+
sshi5w: "f1pha7fy",
|
|
81
|
+
Bahqtrf: "fk6fouc",
|
|
82
|
+
Be2twd7: "fy9rknc",
|
|
83
|
+
Bhrd7zp: "figsok6",
|
|
84
|
+
Bg96gwp: "fwrc4pm"
|
|
85
|
+
},
|
|
86
|
+
subtle: {},
|
|
87
|
+
"subtle-alpha": {
|
|
88
|
+
Jwef8y: "f146ro5n",
|
|
89
|
+
ecr2s2: "fkam630"
|
|
90
|
+
},
|
|
91
|
+
transparent: {
|
|
92
|
+
De3pzq: "f1c21dwh",
|
|
93
|
+
Jwef8y: "fjxutwb",
|
|
94
|
+
ecr2s2: "fophhak"
|
|
95
|
+
}
|
|
96
|
+
}, {
|
|
97
|
+
d: [
|
|
98
|
+
".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}",
|
|
99
|
+
".f122n59{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}",
|
|
100
|
+
".f1nxs5xn{min-height:32px;}",
|
|
101
|
+
".f1ewtqcl{box-sizing:border-box;}",
|
|
102
|
+
".f15ws6j{grid-row-start:layout;}",
|
|
103
|
+
".f135tdbu{grid-column-start:layout;}",
|
|
104
|
+
".f2e2169{grid-row-end:layout;}",
|
|
105
|
+
".f4rqp6x{grid-column-end:layout;}",
|
|
106
|
+
".f1aa9q02{border-bottom-right-radius:var(--borderRadiusMedium);}",
|
|
107
|
+
".f16jpd5f{border-bottom-left-radius:var(--borderRadiusMedium);}",
|
|
108
|
+
".f1jar5jt{border-top-right-radius:var(--borderRadiusMedium);}",
|
|
109
|
+
".fyu767a{border-top-left-radius:var(--borderRadiusMedium);}",
|
|
110
|
+
".f1k1erfc{padding-left:calc(var(--fluent-TreeItem--level, 1) * var(--spacingHorizontalXXL));}",
|
|
111
|
+
".faevyjx{padding-right:calc(var(--fluent-TreeItem--level, 1) * var(--spacingHorizontalXXL));}",
|
|
112
|
+
".fo100m9{padding-left:calc((var(--fluent-TreeItem--level, 1) - 1) * var(--spacingHorizontalXXL));}",
|
|
113
|
+
".f6yw3pu{padding-right:calc((var(--fluent-TreeItem--level, 1) - 1) * var(--spacingHorizontalXXL));}",
|
|
114
|
+
".f1rjii52{-webkit-column-gap:var(--spacingHorizontalSNudge);column-gap:var(--spacingHorizontalSNudge);}",
|
|
115
|
+
".fk6fouc{font-family:var(--fontFamilyBase);}",
|
|
116
|
+
".fkhj508{font-size:var(--fontSizeBase300);}",
|
|
117
|
+
".figsok6{font-weight:var(--fontWeightRegular);}",
|
|
118
|
+
".f1i3iumi{line-height:var(--lineHeightBase300);}",
|
|
119
|
+
".f1ufnopg{-webkit-column-gap:var(--spacingHorizontalXS);column-gap:var(--spacingHorizontalXS);}",
|
|
120
|
+
".f1pha7fy{min-height:24px;}",
|
|
121
|
+
".fy9rknc{font-size:var(--fontSizeBase200);}",
|
|
122
|
+
".fwrc4pm{line-height:var(--lineHeightBase200);}",
|
|
123
|
+
".f1c21dwh{background-color:var(--colorTransparentBackground);}"
|
|
124
|
+
],
|
|
125
|
+
a: [
|
|
126
|
+
".flvvhsy:active{color:var(--colorNeutralForeground2Pressed);}",
|
|
127
|
+
".f1wfn5kd:active{background-color:var(--colorSubtleBackgroundPressed);}",
|
|
128
|
+
".f1ih54s9:active .fui-TreeItemLayout__expandIcon{color:var(--colorNeutralForeground3Pressed);}",
|
|
129
|
+
".fkam630:active{background-color:var(--colorSubtleBackgroundLightAlphaPressed);}",
|
|
130
|
+
".fophhak:active{background-color:var(--colorTransparentBackgroundPressed);}"
|
|
131
|
+
],
|
|
132
|
+
h: [
|
|
133
|
+
".fnwyq0v:hover{color:var(--colorNeutralForeground2Hover);}",
|
|
134
|
+
".f1t94bn6:hover{background-color:var(--colorSubtleBackgroundHover);}",
|
|
135
|
+
".f1jk1nfw:hover .fui-TreeItemLayout__expandIcon{color:var(--colorNeutralForeground3Hover);}",
|
|
136
|
+
".f146ro5n:hover{background-color:var(--colorSubtleBackgroundLightAlphaHover);}",
|
|
137
|
+
".fjxutwb:hover{background-color:var(--colorTransparentBackgroundHover);}"
|
|
138
|
+
]
|
|
139
|
+
});
|
|
140
|
+
/**
|
|
141
|
+
* Styles for the expand icon slot
|
|
142
|
+
*/ const useExpandIconStyles = /*#__PURE__*/ (0, _react["__styles"])({
|
|
143
|
+
base: {
|
|
144
|
+
mc9l5x: "f22iagw",
|
|
145
|
+
Bt984gj: "f122n59",
|
|
146
|
+
Brf1p80: "f4d9j23",
|
|
147
|
+
Bf4jedk: "f17fgpbq",
|
|
148
|
+
B7ck84d: "f1ewtqcl",
|
|
149
|
+
sj55zd: "f11d4kpn",
|
|
150
|
+
Bh6795r: "f1jhi6b8",
|
|
151
|
+
Bnnss6s: "fi64zpg",
|
|
152
|
+
xawz: "f1rmlqtg",
|
|
153
|
+
z8tnut: "f1ywm7hm",
|
|
154
|
+
z189sj: [
|
|
155
|
+
"fhxju0i",
|
|
156
|
+
"f1cnd47f"
|
|
157
|
+
],
|
|
158
|
+
Byoj8tv: "f14wxoun",
|
|
159
|
+
uwmqm3: [
|
|
160
|
+
"f1cnd47f",
|
|
161
|
+
"fhxju0i"
|
|
162
|
+
]
|
|
163
|
+
}
|
|
164
|
+
}, {
|
|
165
|
+
d: [
|
|
166
|
+
".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}",
|
|
167
|
+
".f122n59{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}",
|
|
168
|
+
".f4d9j23{-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;}",
|
|
169
|
+
".f17fgpbq{min-width:24px;}",
|
|
170
|
+
".f1ewtqcl{box-sizing:border-box;}",
|
|
171
|
+
".f11d4kpn{color:var(--colorNeutralForeground3);}",
|
|
172
|
+
".f1jhi6b8{-webkit-box-flex:0;-webkit-flex-grow:0;-ms-flex-positive:0;flex-grow:0;}",
|
|
173
|
+
".fi64zpg{-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;}",
|
|
174
|
+
".f1rmlqtg{-webkit-flex-basis:auto;-ms-flex-preferred-size:auto;flex-basis:auto;}",
|
|
175
|
+
".f1ywm7hm{padding-top:var(--spacingVerticalXS);}",
|
|
176
|
+
".fhxju0i{padding-right:0;}",
|
|
177
|
+
".f1cnd47f{padding-left:0;}",
|
|
178
|
+
".f14wxoun{padding-bottom:var(--spacingVerticalXS);}"
|
|
179
|
+
]
|
|
180
|
+
});
|
|
181
|
+
/**
|
|
182
|
+
* Styles for the before/after icon slot
|
|
183
|
+
*/ const useIconStyles = /*#__PURE__*/ (0, _react["__styles"])({
|
|
184
|
+
base: {
|
|
185
|
+
mc9l5x: "f22iagw",
|
|
186
|
+
Bt984gj: "f122n59",
|
|
187
|
+
sj55zd: "fkfq4zb",
|
|
188
|
+
Bg96gwp: "f106mvju",
|
|
189
|
+
Be2twd7: "f1pp30po"
|
|
190
|
+
},
|
|
191
|
+
iconBefore: {},
|
|
192
|
+
iconAfter: {}
|
|
193
|
+
}, {
|
|
194
|
+
d: [
|
|
195
|
+
".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}",
|
|
196
|
+
".f122n59{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}",
|
|
197
|
+
".fkfq4zb{color:var(--colorNeutralForeground2);}",
|
|
198
|
+
".f106mvju{line-height:var(--lineHeightBase500);}",
|
|
199
|
+
".f1pp30po{font-size:var(--fontSizeBase500);}"
|
|
200
|
+
]
|
|
201
|
+
});
|
|
202
|
+
const useTreeItemLayoutStyles_unstable = (state)=>{
|
|
203
|
+
const { iconAfter , iconBefore , expandIcon , root } = state;
|
|
204
|
+
const rootStyles = useRootStyles();
|
|
205
|
+
const iconStyles = useIconStyles();
|
|
206
|
+
const expandIconStyles = useExpandIconStyles();
|
|
207
|
+
const size = (0, _treeContext.useTreeContext_unstable)((ctx)=>ctx.size);
|
|
208
|
+
const appearance = (0, _treeContext.useTreeContext_unstable)((ctx)=>ctx.appearance);
|
|
209
|
+
const itemType = (0, _treeItemContext.useTreeItemContext_unstable)((ctx)=>ctx.itemType);
|
|
210
|
+
root.className = (0, _react.mergeClasses)(treeItemLayoutClassNames.root, rootStyles.base, rootStyles[appearance], rootStyles[size], rootStyles[itemType], root.className);
|
|
211
|
+
if (expandIcon) {
|
|
212
|
+
expandIcon.className = (0, _react.mergeClasses)(treeItemLayoutClassNames.expandIcon, expandIconStyles.base, expandIcon.className);
|
|
213
|
+
}
|
|
214
|
+
if (iconBefore) {
|
|
215
|
+
iconBefore.className = (0, _react.mergeClasses)(treeItemLayoutClassNames.iconBefore, iconStyles.base, iconStyles.iconBefore, iconBefore.className);
|
|
216
|
+
}
|
|
217
|
+
if (iconAfter) {
|
|
218
|
+
iconAfter.className = (0, _react.mergeClasses)(treeItemLayoutClassNames.iconAfter, iconStyles.base, iconStyles.iconAfter, iconAfter.className);
|
|
219
|
+
}
|
|
220
|
+
return state;
|
|
221
|
+
}; //# sourceMappingURL=useTreeItemLayoutStyles.styles.js.map
|
|
222
|
+
|
|
223
|
+
//# sourceMappingURL=useTreeItemLayoutStyles.styles.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../lib/components/TreeItemLayout/useTreeItemLayoutStyles.styles.js"],"sourcesContent":["import { __styles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport { useTreeContext_unstable } from '../../contexts/treeContext';\nimport { treeItemLevelToken } from '../../utils/tokens';\nimport { useTreeItemContext_unstable } from '../../contexts/treeItemContext';\nexport const treeItemLayoutClassNames = {\n root: 'fui-TreeItemLayout',\n expandIcon: 'fui-TreeItemLayout__expandIcon',\n iconBefore: 'fui-TreeItemLayout__iconBefore',\n iconAfter: 'fui-TreeItemLayout__iconAfter'\n};\n/**\n * Styles for the root slot\n */\nconst useRootStyles = /*#__PURE__*/__styles({\n base: {\n mc9l5x: \"f22iagw\",\n Bt984gj: \"f122n59\",\n sshi5w: \"f1nxs5xn\",\n B7ck84d: \"f1ewtqcl\",\n Ijaq50: \"f15ws6j\",\n Br312pm: \"f135tdbu\",\n nk6f5a: \"f2e2169\",\n Bw0ie65: \"f4rqp6x\",\n Bbmb7ep: [\"f1aa9q02\", \"f16jpd5f\"],\n Beyfa6y: [\"f16jpd5f\", \"f1aa9q02\"],\n B7oj6ja: [\"f1jar5jt\", \"fyu767a\"],\n Btl43ni: [\"fyu767a\", \"f1jar5jt\"],\n lj723h: \"flvvhsy\",\n ecr2s2: \"f1wfn5kd\",\n qya0sb: \"f1ih54s9\",\n Bi91k9c: \"fnwyq0v\",\n Jwef8y: \"f1t94bn6\",\n Becwuud: \"f1jk1nfw\"\n },\n leaf: {\n uwmqm3: [\"f1k1erfc\", \"faevyjx\"]\n },\n branch: {\n uwmqm3: [\"fo100m9\", \"f6yw3pu\"]\n },\n medium: {\n i8kkvl: \"f1rjii52\",\n Bahqtrf: \"fk6fouc\",\n Be2twd7: \"fkhj508\",\n Bhrd7zp: \"figsok6\",\n Bg96gwp: \"f1i3iumi\"\n },\n small: {\n i8kkvl: \"f1ufnopg\",\n sshi5w: \"f1pha7fy\",\n Bahqtrf: \"fk6fouc\",\n Be2twd7: \"fy9rknc\",\n Bhrd7zp: \"figsok6\",\n Bg96gwp: \"fwrc4pm\"\n },\n subtle: {},\n \"subtle-alpha\": {\n Jwef8y: \"f146ro5n\",\n ecr2s2: \"fkam630\"\n },\n transparent: {\n De3pzq: \"f1c21dwh\",\n Jwef8y: \"fjxutwb\",\n ecr2s2: \"fophhak\"\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;}\", \".f1nxs5xn{min-height:32px;}\", \".f1ewtqcl{box-sizing:border-box;}\", \".f15ws6j{grid-row-start:layout;}\", \".f135tdbu{grid-column-start:layout;}\", \".f2e2169{grid-row-end:layout;}\", \".f4rqp6x{grid-column-end:layout;}\", \".f1aa9q02{border-bottom-right-radius:var(--borderRadiusMedium);}\", \".f16jpd5f{border-bottom-left-radius:var(--borderRadiusMedium);}\", \".f1jar5jt{border-top-right-radius:var(--borderRadiusMedium);}\", \".fyu767a{border-top-left-radius:var(--borderRadiusMedium);}\", \".f1k1erfc{padding-left:calc(var(--fluent-TreeItem--level, 1) * var(--spacingHorizontalXXL));}\", \".faevyjx{padding-right:calc(var(--fluent-TreeItem--level, 1) * var(--spacingHorizontalXXL));}\", \".fo100m9{padding-left:calc((var(--fluent-TreeItem--level, 1) - 1) * var(--spacingHorizontalXXL));}\", \".f6yw3pu{padding-right:calc((var(--fluent-TreeItem--level, 1) - 1) * var(--spacingHorizontalXXL));}\", \".f1rjii52{-webkit-column-gap:var(--spacingHorizontalSNudge);column-gap:var(--spacingHorizontalSNudge);}\", \".fk6fouc{font-family:var(--fontFamilyBase);}\", \".fkhj508{font-size:var(--fontSizeBase300);}\", \".figsok6{font-weight:var(--fontWeightRegular);}\", \".f1i3iumi{line-height:var(--lineHeightBase300);}\", \".f1ufnopg{-webkit-column-gap:var(--spacingHorizontalXS);column-gap:var(--spacingHorizontalXS);}\", \".f1pha7fy{min-height:24px;}\", \".fy9rknc{font-size:var(--fontSizeBase200);}\", \".fwrc4pm{line-height:var(--lineHeightBase200);}\", \".f1c21dwh{background-color:var(--colorTransparentBackground);}\"],\n a: [\".flvvhsy:active{color:var(--colorNeutralForeground2Pressed);}\", \".f1wfn5kd:active{background-color:var(--colorSubtleBackgroundPressed);}\", \".f1ih54s9:active .fui-TreeItemLayout__expandIcon{color:var(--colorNeutralForeground3Pressed);}\", \".fkam630:active{background-color:var(--colorSubtleBackgroundLightAlphaPressed);}\", \".fophhak:active{background-color:var(--colorTransparentBackgroundPressed);}\"],\n h: [\".fnwyq0v:hover{color:var(--colorNeutralForeground2Hover);}\", \".f1t94bn6:hover{background-color:var(--colorSubtleBackgroundHover);}\", \".f1jk1nfw:hover .fui-TreeItemLayout__expandIcon{color:var(--colorNeutralForeground3Hover);}\", \".f146ro5n:hover{background-color:var(--colorSubtleBackgroundLightAlphaHover);}\", \".fjxutwb:hover{background-color:var(--colorTransparentBackgroundHover);}\"]\n});\n/**\n * Styles for the expand icon slot\n */\nconst useExpandIconStyles = /*#__PURE__*/__styles({\n base: {\n mc9l5x: \"f22iagw\",\n Bt984gj: \"f122n59\",\n Brf1p80: \"f4d9j23\",\n Bf4jedk: \"f17fgpbq\",\n B7ck84d: \"f1ewtqcl\",\n sj55zd: \"f11d4kpn\",\n Bh6795r: \"f1jhi6b8\",\n Bnnss6s: \"fi64zpg\",\n xawz: \"f1rmlqtg\",\n z8tnut: \"f1ywm7hm\",\n z189sj: [\"fhxju0i\", \"f1cnd47f\"],\n Byoj8tv: \"f14wxoun\",\n uwmqm3: [\"f1cnd47f\", \"fhxju0i\"]\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;}\", \".f4d9j23{-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;}\", \".f17fgpbq{min-width:24px;}\", \".f1ewtqcl{box-sizing:border-box;}\", \".f11d4kpn{color:var(--colorNeutralForeground3);}\", \".f1jhi6b8{-webkit-box-flex:0;-webkit-flex-grow:0;-ms-flex-positive:0;flex-grow:0;}\", \".fi64zpg{-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;}\", \".f1rmlqtg{-webkit-flex-basis:auto;-ms-flex-preferred-size:auto;flex-basis:auto;}\", \".f1ywm7hm{padding-top:var(--spacingVerticalXS);}\", \".fhxju0i{padding-right:0;}\", \".f1cnd47f{padding-left:0;}\", \".f14wxoun{padding-bottom:var(--spacingVerticalXS);}\"]\n});\n/**\n * Styles for the before/after icon slot\n */\nconst useIconStyles = /*#__PURE__*/__styles({\n base: {\n mc9l5x: \"f22iagw\",\n Bt984gj: \"f122n59\",\n sj55zd: \"fkfq4zb\",\n Bg96gwp: \"f106mvju\",\n Be2twd7: \"f1pp30po\"\n },\n iconBefore: {},\n iconAfter: {}\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;}\", \".fkfq4zb{color:var(--colorNeutralForeground2);}\", \".f106mvju{line-height:var(--lineHeightBase500);}\", \".f1pp30po{font-size:var(--fontSizeBase500);}\"]\n});\n/**\n * Apply styling to the TreeItemLayout slots based on the state\n */\nexport const useTreeItemLayoutStyles_unstable = state => {\n const {\n iconAfter,\n iconBefore,\n expandIcon,\n root\n } = state;\n const rootStyles = useRootStyles();\n const iconStyles = useIconStyles();\n const expandIconStyles = useExpandIconStyles();\n const size = useTreeContext_unstable(ctx => ctx.size);\n const appearance = useTreeContext_unstable(ctx => ctx.appearance);\n const itemType = useTreeItemContext_unstable(ctx => ctx.itemType);\n root.className = mergeClasses(treeItemLayoutClassNames.root, rootStyles.base, rootStyles[appearance], rootStyles[size], rootStyles[itemType], root.className);\n if (expandIcon) {\n expandIcon.className = mergeClasses(treeItemLayoutClassNames.expandIcon, expandIconStyles.base, expandIcon.className);\n }\n if (iconBefore) {\n iconBefore.className = mergeClasses(treeItemLayoutClassNames.iconBefore, iconStyles.base, iconStyles.iconBefore, iconBefore.className);\n }\n if (iconAfter) {\n iconAfter.className = mergeClasses(treeItemLayoutClassNames.iconAfter, iconStyles.base, iconStyles.iconAfter, iconAfter.className);\n }\n return state;\n};\n//# sourceMappingURL=useTreeItemLayoutStyles.styles.js.map"],"names":["treeItemLayoutClassNames","useTreeItemLayoutStyles_unstable","root","expandIcon","iconBefore","iconAfter","useRootStyles","__styles","base","mc9l5x","Bt984gj","sshi5w","B7ck84d","Ijaq50","Br312pm","nk6f5a","Bw0ie65","Bbmb7ep","Beyfa6y","B7oj6ja","Btl43ni","lj723h","ecr2s2","qya0sb","Bi91k9c","Jwef8y","Becwuud","leaf","uwmqm3","branch","medium","i8kkvl","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","small","subtle","transparent","De3pzq","d","a","h","useExpandIconStyles","Brf1p80","Bf4jedk","sj55zd","Bh6795r","Bnnss6s","xawz","z8tnut","z189sj","Byoj8tv","useIconStyles","state","rootStyles","iconStyles","expandIconStyles","size","useTreeContext_unstable","ctx","appearance","itemType","useTreeItemContext_unstable","className","mergeClasses"],"mappings":"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"}
|
|
@@ -10,11 +10,11 @@ const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildc
|
|
|
10
10
|
const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
|
|
11
11
|
const _useTreeItemPersonaLayout = require("./useTreeItemPersonaLayout");
|
|
12
12
|
const _renderTreeItemPersonaLayout = require("./renderTreeItemPersonaLayout");
|
|
13
|
-
const
|
|
13
|
+
const _useTreeItemPersonaLayoutStylesStyles = require("./useTreeItemPersonaLayoutStyles.styles");
|
|
14
14
|
const _useTreeItemPersonaLayoutContextValues = require("./useTreeItemPersonaLayoutContextValues");
|
|
15
15
|
const TreeItemPersonaLayout = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
|
|
16
16
|
const state = (0, _useTreeItemPersonaLayout.useTreeItemPersonaLayout_unstable)(props, ref);
|
|
17
|
-
(0,
|
|
17
|
+
(0, _useTreeItemPersonaLayoutStylesStyles.useTreeItemPersonaLayoutStyles_unstable)(state);
|
|
18
18
|
const contextValues = (0, _useTreeItemPersonaLayoutContextValues.useTreeItemPersonaLayoutContextValues_unstable)(state);
|
|
19
19
|
return (0, _renderTreeItemPersonaLayout.renderTreeItemPersonaLayout_unstable)(state, contextValues);
|
|
20
20
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../lib/components/TreeItemPersonaLayout/TreeItemPersonaLayout.js"],"sourcesContent":["import * as React from 'react';\nimport { useTreeItemPersonaLayout_unstable } from './useTreeItemPersonaLayout';\nimport { renderTreeItemPersonaLayout_unstable } from './renderTreeItemPersonaLayout';\nimport { useTreeItemPersonaLayoutStyles_unstable } from './useTreeItemPersonaLayoutStyles';\nimport { useTreeItemPersonaLayoutContextValues_unstable } from './useTreeItemPersonaLayoutContextValues';\n/**\n * The `TreeItemPersonaLayout` component is used as a child of `TreeItem` to display a `TreeItem` with a media (typically an avatar) and a description.\n * It provides a more visually appealing representation of a `TreeItem` and is typically used to display a list of people or topics.\n * This component should only be used as a direct child of `TreeItem`.\n */\nexport const TreeItemPersonaLayout = /*#__PURE__*/React.forwardRef((props, ref) => {\n const state = useTreeItemPersonaLayout_unstable(props, ref);\n useTreeItemPersonaLayoutStyles_unstable(state);\n const contextValues = useTreeItemPersonaLayoutContextValues_unstable(state);\n return renderTreeItemPersonaLayout_unstable(state, contextValues);\n});\nTreeItemPersonaLayout.displayName = 'TreeItemPersonaLayout';\n//# sourceMappingURL=TreeItemPersonaLayout.js.map"],"names":["TreeItemPersonaLayout","React","forwardRef","props","ref","state","useTreeItemPersonaLayout_unstable","useTreeItemPersonaLayoutStyles_unstable","contextValues","useTreeItemPersonaLayoutContextValues_unstable","renderTreeItemPersonaLayout_unstable","displayName"],"mappings":";;;;+BAUaA;;aAAAA;;;6DAVU;0CAC2B;6CACG;
|
|
1
|
+
{"version":3,"sources":["../../../lib/components/TreeItemPersonaLayout/TreeItemPersonaLayout.js"],"sourcesContent":["import * as React from 'react';\nimport { useTreeItemPersonaLayout_unstable } from './useTreeItemPersonaLayout';\nimport { renderTreeItemPersonaLayout_unstable } from './renderTreeItemPersonaLayout';\nimport { useTreeItemPersonaLayoutStyles_unstable } from './useTreeItemPersonaLayoutStyles.styles';\nimport { useTreeItemPersonaLayoutContextValues_unstable } from './useTreeItemPersonaLayoutContextValues';\n/**\n * The `TreeItemPersonaLayout` component is used as a child of `TreeItem` to display a `TreeItem` with a media (typically an avatar) and a description.\n * It provides a more visually appealing representation of a `TreeItem` and is typically used to display a list of people or topics.\n * This component should only be used as a direct child of `TreeItem`.\n */\nexport const TreeItemPersonaLayout = /*#__PURE__*/React.forwardRef((props, ref) => {\n const state = useTreeItemPersonaLayout_unstable(props, ref);\n useTreeItemPersonaLayoutStyles_unstable(state);\n const contextValues = useTreeItemPersonaLayoutContextValues_unstable(state);\n return renderTreeItemPersonaLayout_unstable(state, contextValues);\n});\nTreeItemPersonaLayout.displayName = 'TreeItemPersonaLayout';\n//# sourceMappingURL=TreeItemPersonaLayout.js.map"],"names":["TreeItemPersonaLayout","React","forwardRef","props","ref","state","useTreeItemPersonaLayout_unstable","useTreeItemPersonaLayoutStyles_unstable","contextValues","useTreeItemPersonaLayoutContextValues_unstable","renderTreeItemPersonaLayout_unstable","displayName"],"mappings":";;;;+BAUaA;;aAAAA;;;6DAVU;0CAC2B;6CACG;sDACG;uDACO;AAMxD,MAAMA,wBAAwB,WAAW,GAAEC,OAAMC,UAAU,CAAC,CAACC,OAAOC,MAAQ;IACjF,MAAMC,QAAQC,IAAAA,2DAAiC,EAACH,OAAOC;IACvDG,IAAAA,6EAAuC,EAACF;IACxC,MAAMG,gBAAgBC,IAAAA,qFAA8C,EAACJ;IACrE,OAAOK,IAAAA,iEAAoC,EAACL,OAAOG;AACrD;AACAR,sBAAsBW,WAAW,GAAG,yBACpC,iDAAiD"}
|
|
@@ -7,7 +7,7 @@ _exportStar(require("./TreeItemPersonaLayout"), exports);
|
|
|
7
7
|
_exportStar(require("./TreeItemPersonaLayout.types"), exports);
|
|
8
8
|
_exportStar(require("./renderTreeItemPersonaLayout"), exports);
|
|
9
9
|
_exportStar(require("./useTreeItemPersonaLayout"), exports);
|
|
10
|
-
_exportStar(require("./useTreeItemPersonaLayoutStyles"), exports);
|
|
10
|
+
_exportStar(require("./useTreeItemPersonaLayoutStyles.styles"), exports);
|
|
11
11
|
//# sourceMappingURL=index.js.map
|
|
12
12
|
|
|
13
13
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../lib/components/TreeItemPersonaLayout/index.js"],"sourcesContent":["export * from './TreeItemPersonaLayout';\nexport * from './TreeItemPersonaLayout.types';\nexport * from './renderTreeItemPersonaLayout';\nexport * from './useTreeItemPersonaLayout';\nexport * from './useTreeItemPersonaLayoutStyles';\n//# sourceMappingURL=index.js.map"],"names":[],"mappings":";;;;;oBAAc;oBACA;oBACA;oBACA;oBACA;CACd,iCAAiC"}
|
|
1
|
+
{"version":3,"sources":["../../../lib/components/TreeItemPersonaLayout/index.js"],"sourcesContent":["export * from './TreeItemPersonaLayout';\nexport * from './TreeItemPersonaLayout.types';\nexport * from './renderTreeItemPersonaLayout';\nexport * from './useTreeItemPersonaLayout';\nexport * from './useTreeItemPersonaLayoutStyles.styles';\n//# sourceMappingURL=index.js.map"],"names":[],"mappings":";;;;;oBAAc;oBACA;oBACA;oBACA;oBACA;CACd,iCAAiC"}
|
|
@@ -10,11 +10,10 @@ const _reactJsxRuntime = require("@fluentui/react-jsx-runtime");
|
|
|
10
10
|
const _reactUtilities = require("@fluentui/react-utilities");
|
|
11
11
|
const _reactAvatar = require("@fluentui/react-avatar");
|
|
12
12
|
const renderTreeItemPersonaLayout_unstable = (state, contextValues)=>{
|
|
13
|
-
const { isActionsVisible } = state;
|
|
14
13
|
const { slots , slotProps } = (0, _reactUtilities.getSlotsNext)(state);
|
|
15
|
-
return /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.root, slotProps.root, slots.
|
|
14
|
+
return /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.root, slotProps.root, slots.expandIcon && /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.expandIcon, slotProps.expandIcon), /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(_reactAvatar.AvatarContextProvider, {
|
|
16
15
|
value: contextValues.avatar
|
|
17
|
-
}, /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.media, slotProps.media)),
|
|
16
|
+
}, /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.media, slotProps.media)), /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.content, slotProps.content, /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.main, slotProps.main), slots.description && /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.description, slotProps.description)));
|
|
18
17
|
}; //# sourceMappingURL=renderTreeItemPersonaLayout.js.map
|
|
19
18
|
|
|
20
19
|
//# sourceMappingURL=renderTreeItemPersonaLayout.js.map
|
|
@@ -1 +1 @@
|
|
|
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
|
|
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 slots,\n slotProps\n } = getSlotsNext(state);\n return /*#__PURE__*/createElement(slots.root, slotProps.root, slots.expandIcon && /*#__PURE__*/createElement(slots.expandIcon, slotProps.expandIcon), /*#__PURE__*/createElement(AvatarContextProvider, {\n value: contextValues.avatar\n }, /*#__PURE__*/createElement(slots.media, slotProps.media)), /*#__PURE__*/createElement(slots.content, slotProps.content, /*#__PURE__*/createElement(slots.main, slotProps.main), slots.description && /*#__PURE__*/createElement(slots.description, slotProps.description)));\n};\n//# sourceMappingURL=renderTreeItemPersonaLayout.js.map"],"names":["renderTreeItemPersonaLayout_unstable","state","contextValues","slots","slotProps","getSlotsNext","createElement","root","expandIcon","AvatarContextProvider","value","avatar","media","content","main","description"],"mappings":"AAAA,wBAAwB,GAAG,uBAAuB;;;;+BAMrCA;;aAAAA;;iCANqE;gCACrD;6BACS;AAI/B,MAAMA,uCAAuC,CAACC,OAAOC,gBAAkB;IAC5E,MAAM,EACJC,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,GAAG,WAAW,GAAEF,IAAAA,8BAAa,EAACG,kCAAqB,EAAE;QACtMC,OAAOR,cAAcS,MAAM;IAC7B,GAAG,WAAW,GAAEL,IAAAA,8BAAa,EAACH,MAAMS,KAAK,EAAER,UAAUQ,KAAK,IAAI,WAAW,GAAEN,IAAAA,8BAAa,EAACH,MAAMU,OAAO,EAAET,UAAUS,OAAO,EAAE,WAAW,GAAEP,IAAAA,8BAAa,EAACH,MAAMW,IAAI,EAAEV,UAAUU,IAAI,GAAGX,MAAMY,WAAW,IAAI,WAAW,GAAET,IAAAA,8BAAa,EAACH,MAAMY,WAAW,EAAEX,UAAUW,WAAW;AAC7Q,GACA,uDAAuD"}
|
|
@@ -11,25 +11,26 @@ const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
|
|
|
11
11
|
const _reactUtilities = require("@fluentui/react-utilities");
|
|
12
12
|
const _contexts = require("../../contexts");
|
|
13
13
|
const _tokens = require("../../utils/tokens");
|
|
14
|
+
const _useTreeItemLayout = require("../TreeItemLayout/useTreeItemLayout");
|
|
14
15
|
const useTreeItemPersonaLayout_unstable = (props, ref)=>{
|
|
15
|
-
const { media , content , children , main , description
|
|
16
|
+
const { media , content , children , main , description } = props;
|
|
17
|
+
const treeItemLayoutState = (0, _useTreeItemLayout.useTreeItemLayout_unstable)({
|
|
18
|
+
...props,
|
|
19
|
+
iconBefore: null,
|
|
20
|
+
iconAfter: null
|
|
21
|
+
}, ref);
|
|
16
22
|
const size = (0, _contexts.useTreeContext_unstable)((ctx)=>ctx.size);
|
|
17
|
-
const { isActionsVisible } = (0, _contexts.useTreeItemContext_unstable)();
|
|
18
23
|
return {
|
|
24
|
+
...treeItemLayoutState,
|
|
19
25
|
components: {
|
|
26
|
+
expandIcon: 'div',
|
|
20
27
|
content: 'div',
|
|
21
|
-
main: '
|
|
22
|
-
description: '
|
|
23
|
-
root: '
|
|
24
|
-
media: '
|
|
25
|
-
aside: 'span'
|
|
28
|
+
main: 'div',
|
|
29
|
+
description: 'div',
|
|
30
|
+
root: 'div',
|
|
31
|
+
media: 'div'
|
|
26
32
|
},
|
|
27
|
-
isActionsVisible,
|
|
28
33
|
avatarSize: _tokens.treeAvatarSize[size],
|
|
29
|
-
root: (0, _reactUtilities.getNativeElementProps)(as, {
|
|
30
|
-
...props,
|
|
31
|
-
ref
|
|
32
|
-
}),
|
|
33
34
|
main: (0, _reactUtilities.resolveShorthand)(main, {
|
|
34
35
|
required: true,
|
|
35
36
|
defaultProps: {
|
|
@@ -42,8 +43,7 @@ const useTreeItemPersonaLayout_unstable = (props, ref)=>{
|
|
|
42
43
|
content: (0, _reactUtilities.resolveShorthand)(content, {
|
|
43
44
|
required: true
|
|
44
45
|
}),
|
|
45
|
-
description: (0, _reactUtilities.resolveShorthand)(description)
|
|
46
|
-
aside: (0, _reactUtilities.resolveShorthand)(aside)
|
|
46
|
+
description: (0, _reactUtilities.resolveShorthand)(description)
|
|
47
47
|
};
|
|
48
48
|
}; //# sourceMappingURL=useTreeItemPersonaLayout.js.map
|
|
49
49
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../lib/components/TreeItemPersonaLayout/useTreeItemPersonaLayout.js"],"sourcesContent":["import * as React from 'react';\nimport {
|
|
1
|
+
{"version":3,"sources":["../../../lib/components/TreeItemPersonaLayout/useTreeItemPersonaLayout.js"],"sourcesContent":["import * as React from 'react';\nimport { resolveShorthand } from '@fluentui/react-utilities';\nimport { useTreeContext_unstable } from '../../contexts';\nimport { treeAvatarSize } from '../../utils/tokens';\nimport { useTreeItemLayout_unstable } from '../TreeItemLayout/useTreeItemLayout';\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 = (props, ref) => {\n const {\n media,\n content,\n children,\n main,\n description\n } = props;\n const treeItemLayoutState = useTreeItemLayout_unstable({\n ...props,\n iconBefore: null,\n iconAfter: null\n }, ref);\n const size = useTreeContext_unstable(ctx => ctx.size);\n return {\n ...treeItemLayoutState,\n components: {\n expandIcon: 'div',\n content: 'div',\n main: 'div',\n description: 'div',\n root: 'div',\n media: 'div'\n },\n avatarSize: treeAvatarSize[size],\n main: resolveShorthand(main, {\n required: true,\n defaultProps: {\n children\n }\n }),\n media: resolveShorthand(media, {\n required: true\n }),\n content: resolveShorthand(content, {\n required: true\n }),\n description: resolveShorthand(description)\n };\n};\n//# sourceMappingURL=useTreeItemPersonaLayout.js.map"],"names":["useTreeItemPersonaLayout_unstable","props","ref","media","content","children","main","description","treeItemLayoutState","useTreeItemLayout_unstable","iconBefore","iconAfter","size","useTreeContext_unstable","ctx","components","expandIcon","root","avatarSize","treeAvatarSize","resolveShorthand","required","defaultProps"],"mappings":";;;;+BAcaA;;aAAAA;;;6DAdU;gCACU;0BACO;wBACT;mCACY;AAUpC,MAAMA,oCAAoC,CAACC,OAAOC,MAAQ;IAC/D,MAAM,EACJC,MAAK,EACLC,QAAO,EACPC,SAAQ,EACRC,KAAI,EACJC,YAAW,EACZ,GAAGN;IACJ,MAAMO,sBAAsBC,IAAAA,6CAA0B,EAAC;QACrD,GAAGR,KAAK;QACRS,YAAY,IAAI;QAChBC,WAAW,IAAI;IACjB,GAAGT;IACH,MAAMU,OAAOC,IAAAA,iCAAuB,EAACC,CAAAA,MAAOA,IAAIF,IAAI;IACpD,OAAO;QACL,GAAGJ,mBAAmB;QACtBO,YAAY;YACVC,YAAY;YACZZ,SAAS;YACTE,MAAM;YACNC,aAAa;YACbU,MAAM;YACNd,OAAO;QACT;QACAe,YAAYC,sBAAc,CAACP,KAAK;QAChCN,MAAMc,IAAAA,gCAAgB,EAACd,MAAM;YAC3Be,UAAU,IAAI;YACdC,cAAc;gBACZjB;YACF;QACF;QACAF,OAAOiB,IAAAA,gCAAgB,EAACjB,OAAO;YAC7BkB,UAAU,IAAI;QAChB;QACAjB,SAASgB,IAAAA,gCAAgB,EAAChB,SAAS;YACjCiB,UAAU,IAAI;QAChB;QACAd,aAAaa,IAAAA,gCAAgB,EAACb;IAChC;AACF,GACA,oDAAoD"}
|