devexpress-reporting-react
Version:
DevExpress Reporting React provides the capability to develop a reporting application to create and customize reports.
27 lines (26 loc) • 1.46 kB
JavaScript
import React from 'react';
import Template from '../../../core/Template';
import { Popover } from 'devextreme-react/popover';
import { getParentContainer } from '@devexpress/analytics-core/widgets/_utils';
const PictureEditingToolbarOptions = ({ data }) => {
const ref = React.useRef();
const [popupOptions, setPopupOptions] = React.useState({});
React.useEffect(() => {
const target = data.getPositionTarget();
setPopupOptions({
container: target,
position: {
my: 'left top',
at: 'right top',
boundary: getParentContainer(ref.current),
of: target,
collision: 'flipfit fit',
offset: '-10 0'
},
});
}, []);
return (React.createElement("div", { ref: ref },
React.createElement(Popover, { className: "dx-picture-edit-popup-content", width: data.width, height: data.height, wrapperAttr: { class: 'dx-picture-edit-popup-content' }, hideOnOutsideClick: data.hideOnOutsideClick, onShown: data.onShown, onHidden: data.onHidden, onContentReady: data.onContentReady, position: popupOptions.position, container: popupOptions.container, showTitle: false, showCloseButton: false, shading: false, animation: {}, visible: data.visible },
React.createElement(Template, { template: data.contentTemplate, data: data.contentData }))));
};
export default PictureEditingToolbarOptions;