@itwin/presentation-components
Version:
React components based on iTwin.js Presentation library
62 lines • 4.76 kB
JavaScript
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
/*---------------------------------------------------------------------------------------------
* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
* See LICENSE.md in the project root for license terms and full copyright notice.
*--------------------------------------------------------------------------------------------*/
/* eslint-disable @typescript-eslint/no-deprecated */
/** @packageDocumentation
* @module Tree
*/
import "./PresentationTreeNodeRenderer.scss";
import classnames from "classnames";
import { TreeNodeRenderer } from "@itwin/components-react";
import { TreeNode } from "@itwin/core-react";
import { SvgCloseSmall, SvgFilter, SvgFilterHollow } from "@itwin/itwinui-icons-react";
import { Anchor, ButtonGroup, IconButton, Text } from "@itwin/itwinui-react";
import { translate } from "../../common/Utils.js";
import { InfoTreeNodeItemType, isPresentationInfoTreeNodeItem, isPresentationTreeNodeItem } from "../PresentationTreeNodeItem.js";
/**
* Component for rendering tree nodes produced by [[PresentationTreeDataProvider]]. Additionally to the default
* tree node renderer, it renders action buttons for filterable hierarchy levels and also correctly renders
* nodes that carry info messages.
* @public
* @deprecated in 5.7. All tree-related APIs have been deprecated in favor of the new generation hierarchy
* building APIs (see https://github.com/iTwin/presentation/blob/33e79ee8d77f30580a9bab81a72884bda008db25/README.md#the-packages).
*/
export function PresentationTreeNodeRenderer(props) {
const { onFilterClick, onClearFilterClick, ...restProps } = props;
const nodeItem = props.node.item;
if (isPresentationInfoTreeNodeItem(nodeItem)) {
return (
// `PresentationTreeNodeRenderer` is about to be deprecated itself, so no point in resolving the TreeNode deprecation
_jsx(TreeNode, { isLeaf: true, label: _jsx("span", { children: _jsxs(Text, { isMuted: true, className: "info-tree-node-item", children: [nodeItem.type === InfoTreeNodeItemType.ResultSetTooLarge && (_jsxs("span", { children: [_jsx("span", { children: `${translate("tree.please-provide")} ` }), _jsx(Anchor, { onClick: () => {
if (nodeItem.parentId !== undefined) {
onFilterClick(nodeItem.parentId);
}
}, children: `${translate("tree.additional-filtering")}` }), _jsx("span", { children: " - " })] })), _jsx("span", { children: nodeItem.message })] }) }), level: props.node.depth, isHoverDisabled: true }));
}
if (isPresentationTreeNodeItem(nodeItem)) {
// hide filtering buttons if filtering is disabled explicitly or node is not filtered and has no children
const filteringDisabled = nodeItem.filtering === undefined || (nodeItem.filtering.active === undefined && props.node.numChildren === 0);
return (_jsx(TreeNodeRenderer, { ...restProps, className: classnames("presentation-components-node", restProps.className), children: _jsx(PresentationTreeNodeActions, { isFiltered: nodeItem.filtering?.active !== undefined, filteringDisabled: filteringDisabled, onClearFilterClick: () => {
onClearFilterClick(nodeItem.id);
}, onFilterClick: () => {
onFilterClick(nodeItem.id);
} }) }));
}
return _jsx(TreeNodeRenderer, { ...restProps });
}
function PresentationTreeNodeActions(props) {
const { onFilterClick, onClearFilterClick, filteringDisabled, isFiltered } = props;
if (filteringDisabled) {
return null;
}
return (_jsx("div", { className: classnames("presentation-components-node-action-buttons", isFiltered && "filtered"), children: _jsxs(ButtonGroup, { children: [isFiltered ? (_jsx(IconButton, { className: "presentation-components-node-action-button", styleType: "borderless", size: "small", onMouseDown: (e) => e.stopPropagation(), onClick: (e) => {
e.stopPropagation();
onClearFilterClick();
}, label: translate("tree.clear-hierarchy-level-filter"), children: _jsx(SvgCloseSmall, {}) })) : null, _jsx(IconButton, { className: "presentation-components-node-action-button", styleType: "borderless", size: "small", onMouseDown: (e) => e.stopPropagation(), onClick: (e) => {
e.stopPropagation();
onFilterClick();
}, label: translate("tree.filter-hierarchy-level"), children: isFiltered ? _jsx(SvgFilter, {}) : _jsx(SvgFilterHollow, {}) })] }) }));
}
//# sourceMappingURL=PresentationTreeNodeRenderer.js.map