get-jsx-factory
v0.0.2
Published
Util for creating custom jsx factories.
Downloads
64
Readme
Get JSX Factory
Utils for creating and maintaining custom jsx factories.
Example usage
The following (deno) usage sets up a jsx factory that creates prosemirror nodes using the prosmirror schema from "prosemirror-schema-basic".
import { schema } from "https://esm.sh/[email protected]";
import { getJSXFactory } from "https://raw.githubusercontent.com/luke-john/get-jsx-factory/mod.ts";
declare global {
namespace JSX {
interface IntrinsicElements {
doc: Record<string, never>;
paragraph: Record<string, never>;
text: Record<string, never>;
}
}
}
const handlers: { [key: string]: any } = {};
for (const [nodeName, node] of Object.entries(schema.nodes)) {
handlers[nodeName] = ({ marks, attrs, children }: any) =>
schema.node(nodeName, attrs, children, marks);
}
handlers["text"] = ({ marks, children }: any) => schema.text(children, marks);
export const pmJsxFactory = getJSXFactory(handlers);
And can then be used as follows
/** @jsx pmJsxFactory */
import { pmJsxFactory } from "./ ... .ts";
function DemoFunction() {
return <text>This is a test</text>;
}
export const functionTest = (
<doc>
<paragraph>
<DemoFunction />
</paragraph>
</doc>
);