diff options
| author | nsfisis <nsfisis@gmail.com> | 2025-06-27 23:39:31 +0900 |
|---|---|---|
| committer | nsfisis <nsfisis@gmail.com> | 2025-06-27 23:39:31 +0900 |
| commit | 674fe965550444db87edc7937ff6932e1a918d9d (patch) | |
| tree | e8a80dd958d3e082485286bf5785a7992b6e6b0e /services/blog/nuldoc-src/jsx | |
| parent | fe4d1d625b53796c5f20399790e5ff8c7a7e1608 (diff) | |
| download | nsfisis.dev-674fe965550444db87edc7937ff6932e1a918d9d.tar.gz nsfisis.dev-674fe965550444db87edc7937ff6932e1a918d9d.tar.zst nsfisis.dev-674fe965550444db87edc7937ff6932e1a918d9d.zip | |
feat(meta): rename vhosts/ directory to services/
Diffstat (limited to 'services/blog/nuldoc-src/jsx')
| -rw-r--r-- | services/blog/nuldoc-src/jsx/jsx-runtime.ts | 27 | ||||
| -rw-r--r-- | services/blog/nuldoc-src/jsx/render.ts | 45 | ||||
| -rw-r--r-- | services/blog/nuldoc-src/jsx/types.d.ts | 83 |
3 files changed, 155 insertions, 0 deletions
diff --git a/services/blog/nuldoc-src/jsx/jsx-runtime.ts b/services/blog/nuldoc-src/jsx/jsx-runtime.ts new file mode 100644 index 00000000..9571e87d --- /dev/null +++ b/services/blog/nuldoc-src/jsx/jsx-runtime.ts @@ -0,0 +1,27 @@ +import type { Node } from "../dom.ts"; + +export type JSXElement = { + tag: string | FunctionComponent; + props: Props; +}; + +export type JSXNullNode = false | null | undefined; +export type JSXSimpleNode = JSXElement | Node | string; +export type JSXNullableSimpleNode = JSXSimpleNode | JSXNullNode; +export type JSXNode = JSXNullableSimpleNode | JSXNode[]; +export type RenderableJSXNode = JSXElement; + +type Props = { children?: JSXNode } & Record<string, unknown>; +export type FunctionComponentResult = JSXElement | Promise<JSXElement>; +type FunctionComponent = (props: Props) => FunctionComponentResult; + +export function jsx( + tag: string | FunctionComponent, + props: Props, +): JSXElement { + return { tag, props }; +} + +export { jsx as jsxs }; + +// TODO: support Fragment diff --git a/services/blog/nuldoc-src/jsx/render.ts b/services/blog/nuldoc-src/jsx/render.ts new file mode 100644 index 00000000..8603f6c3 --- /dev/null +++ b/services/blog/nuldoc-src/jsx/render.ts @@ -0,0 +1,45 @@ +import type { Element, Node } from "../dom.ts"; +import type { + JSXNode, + JSXNullableSimpleNode, + JSXSimpleNode, + RenderableJSXNode, +} from "myjsx/jsx-runtime"; + +function transformNode(node: JSXNode): Promise<Node[]> { + const flattenNodes: JSXNullableSimpleNode[] = Array.isArray(node) + // @ts-ignore prevents infinite recursion + ? (node.flat(Infinity) as JSXNullableSimpleNode[]) + : [node]; + return Promise.all( + flattenNodes + .filter((c): c is JSXSimpleNode => c != null && c !== false) + .map((c) => { + if (typeof c === "string") { + return { kind: "text", content: c, raw: false }; + } else if ("kind" in c) { + return c; + } else { + return renderToDOM(c); + } + }), + ); +} + +export async function renderToDOM( + element: RenderableJSXNode, +): Promise<Element> { + const { tag, props } = element; + if (typeof tag === "string") { + const { children, ...attrs } = props; + const attrsMap = new Map(Object.entries(attrs)) as Map<string, string>; + return { + kind: "element", + name: tag, + attributes: attrsMap, + children: await transformNode(children), + }; + } else { + return renderToDOM(await tag(props)); + } +} diff --git a/services/blog/nuldoc-src/jsx/types.d.ts b/services/blog/nuldoc-src/jsx/types.d.ts new file mode 100644 index 00000000..0e5b223f --- /dev/null +++ b/services/blog/nuldoc-src/jsx/types.d.ts @@ -0,0 +1,83 @@ +import type { + FunctionComponentResult, + JSXElement, + JSXNode, +} from "myjsx/jsx-runtime"; + +export { JSXNode }; + +interface IntrinsicElementType { + children?: JSXNode; + className?: string; + id?: string; + // My JSX runtime does not use key. It is only for linter that complains about missing key. + key?: string; +} + +declare global { + namespace JSX { + type Element = JSXElement; + type ElementType = + | string + // deno-lint-ignore no-explicit-any + | ((props: any) => FunctionComponentResult); + + // TODO: HTML 用の element と XML 用の element を分ける + interface IntrinsicElements { + // XML (Atom) + author: IntrinsicElementType; + entry: IntrinsicElementType; + feed: IntrinsicElementType & { xmlns: string }; + id: IntrinsicElementType; + name: IntrinsicElementType; + published: IntrinsicElementType; + summary: IntrinsicElementType; + updated: IntrinsicElementType; + // HTML + a: IntrinsicElementType & { + href?: string; + rel?: "noreferrer"; + target?: "_blank"; + }; + article: IntrinsicElementType; + body: IntrinsicElementType; + button: IntrinsicElementType & { type: string }; + canvas: { id?: string; "data-slide-link"?: string }; + div: IntrinsicElementType; + footer: IntrinsicElementType; + h1: IntrinsicElementType; + h2: IntrinsicElementType; + head: unknown; + header: IntrinsicElementType; + html: IntrinsicElementType & { lang?: string }; + img: { src: string }; + li: IntrinsicElementType; + link: { rel: string; href: string; type?: string }; + main: IntrinsicElementType; + meta: { + charset?: string; + name?: string; + content?: string; + property?: string; + }; + nav: IntrinsicElementType; + noscript: IntrinsicElementType; + ol: IntrinsicElementType; + p: IntrinsicElementType; + script: { src: string; type?: string; defer?: "true" }; + section: IntrinsicElementType; + time: IntrinsicElementType & { datetime?: string }; + title: IntrinsicElementType; + ul: IntrinsicElementType; + } + + interface ElementChildrenAttribute { + children: unknown; + } + + type LibraryManagedAttributes<_F, P> = P & { + // My JSX runtime does not use key. It is only for linter that complains about missing key. + key?: string; + }; + } +} |
