diff options
Diffstat (limited to 'src/frontend/render')
-rw-r--r-- | src/frontend/render/react.ts | 28 |
1 files changed, 28 insertions, 0 deletions
diff --git a/src/frontend/render/react.ts b/src/frontend/render/react.ts new file mode 100644 index 000000000..d55d30c00 --- /dev/null +++ b/src/frontend/render/react.ts @@ -0,0 +1,28 @@ +import React from 'react'; +import ReactDOMServer from 'react-dom/server'; + +export function __react_static(ReactComponent: any) { + return (attrs: Record<string, any>, ...children: any): string => { + let html = ReactDOMServer.renderToString( + React.createElement( + ReactComponent, + attrs, + children + ) + ); + return html; + }; +} + +export function __react_dynamic(ReactComponent: any, importUrl: string, reactUrl: string, reactDomUrl: string) { + const placeholderId = `placeholder_${String(Math.random())}`; + return (attrs: Record<string, string>, ...children: any) => { + return `<div id="${placeholderId}"></div><script type="module"> + import React from '${reactUrl}'; + import ReactDOM from '${reactDomUrl}'; + import Component from '${importUrl}'; + + ReactDOM.render(React.createElement(Component, ${JSON.stringify(attrs)}), document.getElementById('${placeholderId}')); + </script>`; + }; +} |