UNPKG

devexpress-reporting-react

Version:

DevExpress Reporting React provides the capability to develop a reporting application to create and customize reports.

20 lines (19 loc) 1.5 kB
import React from 'react'; import Button from 'devextreme-react/button'; import ScrollView from 'devextreme-react/scroll-view'; import Template from '../../../../core/Template'; const MobileParameters = ({ data }) => { const ref = React.useRef(); React.useEffect(() => { data.cacheElementContent(ref.current); }, []); return (React.createElement("div", { className: 'dxrdp-parameters-mobile ' + data.className }, React.createElement("div", { className: "dxrdp-parameters-title" }, data.title, " "), React.createElement(ScrollView, { className: "dxrdp-parameters-scroll", showScrollbar: "onHover", useNative: false, scrollByThumb: true, bounceEnabled: false }, React.createElement(Template, { template: data.contentTemplate, data: data.model.getViewModel() })), React.createElement("div", { className: "dxrdp-parameters-buttons text-buttons", ref: ref }, data.actionButtons.map(button => (React.createElement(Button, { key: button.id, className: 'dxrdp-parameter-action ' + button.className, text: button.text, onClick: button.action, disabled: button.disabled, visible: button.visible })))), React.createElement("div", { className: "dxrdp-parameters-buttons", hidden: !data.showIcons }, data.actionIcons.map(icon => (React.createElement(Button, { key: icon.className, className: 'dxrdp-parameter-icon ' + icon.className, onClick: icon.action, disabled: icon.disabled })))))); }; export default MobileParameters;