UNPKG

@adaptabletools/adaptable-cjs

Version:

Powerful data-agnostic HTML5 AG Grid extension which provides advanced, cutting-edge functionality to meet all DataGrid requirements

46 lines (45 loc) 1.92 kB
"use strict"; Object.defineProperty(exports, "__esModule", { value: true }); exports.ExternalRenderer = void 0; const tslib_1 = require("tslib"); const React = tslib_1.__importStar(require("react")); const AdaptableContext_1 = require("../AdaptableContext"); const ExternalRenderer = ({ render, frameworkComponent, componentName = 'N/A', onDestroy, ...rest }) => { const ref = React.useRef(null); const adaptable = (0, AdaptableContext_1.useAdaptable)(); const [contentsHTML, setContentsHTML] = React.useState(''); React.useLayoutEffect(() => { const element = ref.current; const adaptableApi = adaptable.api; if (render) { const html = render({ phase: 'onMount', element, ...adaptableApi.internalApi.buildBaseContext(), }); setContentsHTML(html); } else if (frameworkComponent) { adaptableApi.internalApi.createFrameworkComponent(element, frameworkComponent, 'toolbar'); } return () => { if (render) { render({ phase: 'onDestroy', element: element, ...adaptableApi.internalApi.buildBaseContext(), }); } else if (frameworkComponent) { onDestroy?.(); adaptableApi.internalApi.destroyFrameworkComponent(element, frameworkComponent, // @ts-ignore componentName); } }; }, []); const RFC = adaptable.variant === 'react' ? frameworkComponent : null; return RFC ? (React.createElement("div", { ...rest, ref: ref }, React.createElement(RFC, { adaptableApi: adaptable.api }))) : (React.createElement("div", { ...rest, dangerouslySetInnerHTML: { __html: contentsHTML }, ref: ref })); }; exports.ExternalRenderer = ExternalRenderer;