devexpress-reporting-react
Version:
DevExpress Reporting React provides the capability to develop a reporting application to create and customize reports.
20 lines (19 loc) • 2.55 kB
JavaScript
import React from 'react';
import Template from '../../../../core/Template';
const TreelistHeaderItem = ({ data }) => {
const staticClasses = 'dx-treelist-item dxd-list-item-back-color dxd-back-highlighted dx-accessibility-treelist-item dx-accessibility-focus-border-accented';
return (React.createElement("div", { role: "treeitem", className: `${staticClasses} ${data.isSelected || data.isMultiSelected ? 'dxd-state-selected dx-treelist-item-selected' : ''}`, "aria-expanded": data.attr['aria-expanded'].toString() === 'true' ? true : false, "aria-selected": data.attr['aria-selected'].toString() === 'true' ? true : false, "aria-level": data.attr['aria-level'], "aria-label": data.attr['aria-label'], "aria-setsize": data.attr['aria-setsize'], "aria-posinset": data.attr['aria-posinset'], id: data.attr['id'].toString(), style: {
paddingLeft: data.padding['padding-left'] + 'px',
paddingRight: data.padding['padding-right'] + 'px'
}, onDoubleClick: data.events.dblclick, onMouseEnter: data.events.mouseenter, onMouseLeave: data.events.mouseleave },
data.hasItems && (React.createElement("div", null,
React.createElement(Template, { template: "dxrd-svg-collapsed", className: `dx-treelist-collapsedbutton ${data.hasItems ? 'dx-collapsing-image' : 'dx-image-leaf-node'} ${(data.hasItems && !data.collapsed) ? 'dx-image-expanded' : ''}`, onClick: data.toggleCollapsed }))),
React.createElement("div", { className: "dx-treelist-caption", style: { paddingLeft: data.hasItems ? '0px' : '18px' } },
data.actions && data.actions.length > 0 && React.createElement(Template, { template: data.templates.actionsContainer, data: data }),
React.createElement("div", null, data.isDraggable
? (React.createElement("div", { className: "dx-treelist-selectedcontent", onClick: data.toggleSelected, "data-bind": "event: $root.ContextMenusEnabled && $root.ContextMenusEnabled() ? { contextmenu: toggleSelected } : null, draggable: dragDropHandler" },
React.createElement(Template, { template: data.templates.headerItemContent, data: data })))
: (React.createElement("div", { className: "dx-treelist-selectedcontent", onClick: data.toggleSelected, "data-bind": "event: $root.ContextMenusEnabled && $root.ContextMenusEnabled() ? { contextmenu: toggleSelected } : null" },
React.createElement(Template, { template: data.templates.headerItemContent, data: data })))))));
};
export default TreelistHeaderItem;