@react5/dom-jsx 0.1.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 react5com
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,41 @@
+# @react5/dom-jsx
+
+A small, dependency-free JSX runtime for vanilla TypeScript and JavaScript DOM projects.
+
+## Installation
+
+```sh
+npm install @react5/dom-jsx
+```
+
+For TypeScript automatic JSX, set these compiler options:
+
+```json
+{
+  "compilerOptions": {
+    "jsx": "react-jsx",
+    "jsxImportSource": "@react5/dom-jsx"
+  }
+}
+```
+
+The runtime also works with Vite. Vite discovers the package's ESM `jsx-runtime` and `jsx-dev-runtime` exports automatically when compiling TSX.
+
+## Runtime behavior
+
+Intrinsic JSX tags become DOM elements. `class` sets `className`, `style` accepts a style object, DOM properties are assigned when available, boolean attributes use presence semantics, and `onClick`-style function props become event listeners. Text, nested nodes, arrays, fragments, and function components are supported; `null`, `undefined`, and boolean children are ignored.
+
+The public entry points are:
+
+```ts
+import { jsx, jsxs, Fragment } from '@react5/dom-jsx/jsx-runtime'
+import { jsx, jsxs, jsxDEV, Fragment } from '@react5/dom-jsx/jsx-dev-runtime'
+```
+
+## Development
+
+```sh
+npm test       # Run Vitest in jsdom
+npm run typecheck
+npm run build  # Build JavaScript and declarations into dist/
+```

package/dist/jsx-dev-runtime.d.ts

@@ -0,0 +1 @@
+export { jsx, jsxs, Fragment, jsx as jsxDEV } from './jsx-runtime';

package/dist/jsx-dev-runtime.js

@@ -0,0 +1 @@
+import{Fragment as r,jsx as s,jsxs as j}from"./jsx-runtime.js";export{r as Fragment,s as jsx,s as jsxDEV,j as jsxs};

package/dist/jsx-runtime.d.ts

@@ -0,0 +1,54 @@
+export type Child = Node | string | number | boolean | null | undefined | Child[];
+export type Props = Record<string, unknown> & {
+    children?: Child | Child[];
+};
+export type Component<P = Props> = (props: P) => Node;
+export type DOMEventHandler<T extends EventTarget, E extends Event> = (event: E & {
+    currentTarget: T;
+}) => void;
+export type EventProps<T extends HTMLElement> = {
+    onClick?: DOMEventHandler<T, MouseEvent>;
+    onInput?: DOMEventHandler<T, InputEvent>;
+    onChange?: DOMEventHandler<T, Event>;
+    onFocus?: DOMEventHandler<T, FocusEvent>;
+    onBlur?: DOMEventHandler<T, FocusEvent>;
+    onKeyDown?: DOMEventHandler<T, KeyboardEvent>;
+    onKeyUp?: DOMEventHandler<T, KeyboardEvent>;
+};
+export type ElementProps<T extends HTMLElement> = Partial<Omit<T, 'children' | 'style' | 'className'>> & EventProps<T> & {
+    class?: string;
+    style?: Partial<CSSStyleDeclaration>;
+    children?: unknown;
+};
+export declare namespace JSX {
+    type Element = Node;
+    interface IntrinsicElements {
+        div: ElementProps<HTMLDivElement>;
+        span: ElementProps<HTMLSpanElement>;
+        form: ElementProps<HTMLFormElement> & {
+            onSubmit?: DOMEventHandler<HTMLFormElement, SubmitEvent>;
+        };
+        label: ElementProps<HTMLLabelElement>;
+        input: ElementProps<HTMLInputElement>;
+        textarea: ElementProps<HTMLTextAreaElement>;
+        select: ElementProps<HTMLSelectElement>;
+        option: ElementProps<HTMLOptionElement>;
+        button: ElementProps<HTMLButtonElement>;
+        a: ElementProps<HTMLAnchorElement>;
+        h1: ElementProps<HTMLHeadingElement>;
+        h2: ElementProps<HTMLHeadingElement>;
+        h3: ElementProps<HTMLHeadingElement>;
+        p: ElementProps<HTMLParagraphElement>;
+        ul: ElementProps<HTMLUListElement>;
+        ol: ElementProps<HTMLOListElement>;
+        li: ElementProps<HTMLLIElement>;
+        section: ElementProps<HTMLElement>;
+        article: ElementProps<HTMLElement>;
+        header: ElementProps<HTMLElement>;
+        footer: ElementProps<HTMLElement>;
+        main: ElementProps<HTMLElement>;
+    }
+}
+export declare function jsx(tag: string | ((props: any) => Node), props: Props | null, _key?: string | number): Node;
+export declare const jsxs: typeof jsx;
+export declare function Fragment(props: Props): DocumentFragment;

package/dist/jsx-runtime.js

@@ -0,0 +1 @@
+function e(e,t,n){return function(e,t){const n=t??{};if("function"==typeof e)return e(n);const r=document.createElement(e);for(const[i,c]of Object.entries(n))if("children"!==i)if(i.startsWith("on")&&"function"==typeof c)r.addEventListener(i.slice(2).toLowerCase(),c);else if("class"!==i){if("style"===i&&c&&"object"==typeof c)Object.assign(r.style,c);else if(null!=c)if(i.includes("-"))r.setAttribute(i,String(c));else if(!1!==c){if(i in r)try{r[i]=c;continue}catch{}r.setAttribute(i,!0===c?"":String(c))}}else r.className=String(c??"");return i(r,n.children),r}(e,t)}var t=e;function n(e){const t=document.createDocumentFragment();return i(t,e.children),t}function i(e,t){if(Array.isArray(t))for(const n of t)i(e,n);else t instanceof Node?e.appendChild(t):null!=t&&!1!==t&&!0!==t&&e.appendChild(document.createTextNode(String(t)))}export{n as Fragment,e as jsx,t as jsxs};

package/package.json

@@ -0,0 +1,48 @@
+{
+  "name": "@react5/dom-jsx",
+  "version": "0.1.0",
+  "description": "JSX runtime for vanilla TS/JS projects.",
+  "keywords": [
+    "JSX"
+  ],
+  "homepage": "https://github.com/react5com/dom-jsx#readme",
+  "bugs": {
+    "url": "https://github.com/react5com/dom-jsx/issues"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/react5com/dom-jsx.git"
+  },
+  "license": "MIT",
+  "author": "react5.com",
+  "type": "module",
+  "files": [
+    "dist",
+    "README.md",
+    "LICENSE"
+  ],
+  "exports": {
+    "./jsx-runtime": {
+      "types": "./dist/jsx-runtime.d.ts",
+      "import": "./dist/jsx-runtime.js"
+    },
+    "./jsx-dev-runtime": {
+      "types": "./dist/jsx-dev-runtime.d.ts",
+      "import": "./dist/jsx-dev-runtime.js"
+    }
+  },
+  "scripts": {
+    "build": "vite build && tsc -p tsconfig.build.json",
+    "typecheck": "tsc --noEmit",
+    "test": "vitest run"
+  },
+  "devDependencies": {
+    "@types/node": "^26.6.2",
+    "esbuild": "^0.28.2",
+    "jsdom": "^30.1.0",
+    "terser": "^5.51.2",
+    "typescript": "^7.0.2",
+    "vite": "^8.3.0",
+    "vitest": "^5.0.1"
+  }
+}