@wsxjs/wsx-core 0.0.5

package/dist/jsx.d.ts

@@ -0,0 +1,66 @@
+export { F as Fragment, h } from './jsx-runtime-pFUwL2Dz.js';
+
+/**
+ * JSX 入口点
+ * 专门为 jsxImportSource 机制提供 JSX 工厂函数
+ */
+
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            div: HTMLAttributes<HTMLDivElement>;
+            button: HTMLAttributes<HTMLButtonElement>;
+            a: HTMLAttributes<HTMLAnchorElement>;
+            span: HTMLAttributes<HTMLSpanElement>;
+            input: HTMLAttributes<HTMLInputElement>;
+            p: HTMLAttributes<HTMLParagraphElement>;
+            h1: HTMLAttributes<HTMLHeadingElement>;
+            h2: HTMLAttributes<HTMLHeadingElement>;
+            h3: HTMLAttributes<HTMLHeadingElement>;
+            ul: HTMLAttributes<HTMLUListElement>;
+            li: HTMLAttributes<HTMLLIElement>;
+            section: HTMLAttributes<HTMLElement>;
+            slot: HTMLAttributes<HTMLSlotElement>;
+        }
+        interface HTMLAttributes<T extends HTMLElement = HTMLElement> {
+            className?: string;
+            class?: string;
+            id?: string;
+            style?: string;
+            disabled?: boolean;
+            title?: string;
+            type?: string;
+            value?: string;
+            placeholder?: string;
+            src?: string;
+            alt?: string;
+            href?: string | null;
+            target?: string;
+            rel?: string;
+            download?: string;
+            ref?: (element: T) => void;
+            [dataAttr: `data-${string}`]: string;
+            onClick?: (event: Event) => void;
+            onInput?: (event: Event) => void;
+            onChange?: (event: Event) => void;
+            onMouseOver?: (event: Event) => void;
+            onMouseOut?: (event: Event) => void;
+            onFocus?: (event: Event) => void;
+            onBlur?: (event: Event) => void;
+            onMouseDown?: (event: MouseEvent) => void;
+            onKeyDown?: (event: KeyboardEvent) => void;
+            [key: string]: unknown;
+        }
+        type Element = HTMLElement;
+        interface ElementClass {
+            render(): Element;
+        }
+        interface ElementAttributesProperty {
+            props: object;
+        }
+        interface ElementChildrenAttribute {
+            children: object;
+        }
+        type LibraryManagedAttributes<_C, P> = P;
+    }
+}

package/dist/jsx.js

@@ -0,0 +1,224 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/jsx.ts
+var jsx_exports = {};
+__export(jsx_exports, {
+  Fragment: () => Fragment,
+  h: () => h
+});
+module.exports = __toCommonJS(jsx_exports);
+
+// src/utils/svg-utils.ts
+var SVG_NAMESPACE = "http://www.w3.org/2000/svg";
+var SVG_ONLY_ELEMENTS = /* @__PURE__ */ new Set([
+  // 结构元素 (Structural elements)
+  "svg",
+  "defs",
+  "g",
+  "symbol",
+  "use",
+  // 图形元素 (Graphics elements)
+  "circle",
+  "ellipse",
+  "line",
+  "path",
+  "polygon",
+  "polyline",
+  "rect",
+  // 文本元素 (Text elements)
+  "textPath",
+  "tspan",
+  // 渐变和模式 (Gradients and patterns)
+  "linearGradient",
+  "radialGradient",
+  "stop",
+  "pattern",
+  // 滤镜 (Filter elements)
+  "filter",
+  "feBlend",
+  "feColorMatrix",
+  "feComponentTransfer",
+  "feComposite",
+  "feConvolveMatrix",
+  "feDiffuseLighting",
+  "feDisplacementMap",
+  "feDistantLight",
+  "feDropShadow",
+  "feFlood",
+  "feFuncA",
+  "feFuncB",
+  "feFuncG",
+  "feFuncR",
+  "feGaussianBlur",
+  "feImage",
+  "feMerge",
+  "feMergeNode",
+  "feMorphology",
+  "feOffset",
+  "fePointLight",
+  "feSpecularLighting",
+  "feSpotLight",
+  "feTile",
+  "feTurbulence",
+  // 动画元素 (Animation elements)
+  "animate",
+  "animateMotion",
+  "animateTransform",
+  "set",
+  // 其他元素 (Other elements)
+  "clipPath",
+  "foreignObject",
+  "marker",
+  "mask",
+  "metadata",
+  "switch",
+  "desc"
+]);
+var DUAL_ELEMENTS = /* @__PURE__ */ new Set(["image", "style", "title", "text"]);
+var FORCE_HTML_ELEMENTS = /* @__PURE__ */ new Set(["a"]);
+var SVG_ELEMENTS = /* @__PURE__ */ new Set([
+  ...SVG_ONLY_ELEMENTS,
+  ...DUAL_ELEMENTS,
+  ...FORCE_HTML_ELEMENTS
+]);
+var svgContext = false;
+function isSVGOnlyElement(tagName) {
+  return SVG_ONLY_ELEMENTS.has(tagName);
+}
+function isDualElement(tagName) {
+  return DUAL_ELEMENTS.has(tagName);
+}
+function isForceHTMLElement(tagName) {
+  return FORCE_HTML_ELEMENTS.has(tagName);
+}
+function setSVGContext(inSVG) {
+  svgContext = inSVG;
+}
+function createElement(tagName) {
+  if (isForceHTMLElement(tagName)) {
+    return document.createElement(tagName);
+  }
+  if (isSVGOnlyElement(tagName)) {
+    setSVGContext(true);
+    return document.createElementNS(SVG_NAMESPACE, tagName);
+  }
+  if (isDualElement(tagName)) {
+    if (svgContext) {
+      return document.createElementNS(SVG_NAMESPACE, tagName);
+    }
+  }
+  return document.createElement(tagName);
+}
+function shouldUseSVGNamespace(tagName) {
+  return isSVGOnlyElement(tagName) || isDualElement(tagName) && svgContext;
+}
+var SVG_ATTRIBUTE_MAP = /* @__PURE__ */ new Map([
+  ["className", "class"],
+  ["htmlFor", "for"]
+]);
+function getSVGAttributeName(attributeName) {
+  return SVG_ATTRIBUTE_MAP.get(attributeName) || attributeName;
+}
+
+// src/jsx-factory.ts
+function h(tag, props = {}, ...children) {
+  if (typeof tag === "function") {
+    return tag(props, children);
+  }
+  const element = createElement(tag);
+  if (props) {
+    const isSVG = shouldUseSVGNamespace(tag);
+    Object.entries(props).forEach(([key, value]) => {
+      if (value === null || value === void 0 || value === false) {
+        return;
+      }
+      if (key === "ref" && typeof value === "function") {
+        value(element);
+      } else if (key === "className" || key === "class") {
+        if (isSVG) {
+          element.setAttribute("class", value);
+        } else {
+          element.className = value;
+        }
+      } else if (key === "style" && typeof value === "string") {
+        element.setAttribute("style", value);
+      } else if (key.startsWith("on") && typeof value === "function") {
+        const eventName = key.slice(2).toLowerCase();
+        element.addEventListener(eventName, value);
+      } else if (typeof value === "boolean") {
+        if (value) {
+          element.setAttribute(key, "");
+        }
+      } else {
+        const attributeName = isSVG ? getSVGAttributeName(key) : key;
+        element.setAttribute(attributeName, String(value));
+      }
+    });
+  }
+  const flatChildren = flattenChildren(children);
+  flatChildren.forEach((child) => {
+    if (child === null || child === void 0 || child === false) {
+      return;
+    }
+    if (typeof child === "string" || typeof child === "number") {
+      element.appendChild(document.createTextNode(String(child)));
+    } else if (child instanceof HTMLElement || child instanceof SVGElement) {
+      element.appendChild(child);
+    } else if (child instanceof DocumentFragment) {
+      element.appendChild(child);
+    }
+  });
+  return element;
+}
+function flattenChildren(children) {
+  const result = [];
+  for (const child of children) {
+    if (child === null || child === void 0 || child === false) {
+      continue;
+    } else if (Array.isArray(child)) {
+      result.push(...flattenChildren(child));
+    } else {
+      result.push(child);
+    }
+  }
+  return result;
+}
+function Fragment(_props, children) {
+  const fragment = document.createDocumentFragment();
+  const flatChildren = flattenChildren(children);
+  flatChildren.forEach((child) => {
+    if (child === null || child === void 0 || child === false) {
+      return;
+    }
+    if (typeof child === "string" || typeof child === "number") {
+      fragment.appendChild(document.createTextNode(String(child)));
+    } else if (child instanceof HTMLElement || child instanceof SVGElement) {
+      fragment.appendChild(child);
+    } else if (child instanceof DocumentFragment) {
+      fragment.appendChild(child);
+    }
+  });
+  return fragment;
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Fragment,
+  h
+});

package/dist/jsx.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/jsx.ts","../src/utils/svg-utils.ts","../src/jsx-factory.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-namespace */\n/**\n * JSX 入口点\n * 专门为 jsxImportSource 机制提供 JSX 工厂函数\n */\n\n// 导入 JSX 工厂函数\nimport { h, Fragment } from \"./jsx-factory\";\n\n// 全局 JSX 命名空间声明 - 这是 TypeScript jsxImportSource 机制的关键\ndeclare global {\n    namespace JSX {\n        interface IntrinsicElements {\n            // 标准HTML元素\n            div: HTMLAttributes<HTMLDivElement>;\n            button: HTMLAttributes<HTMLButtonElement>;\n            a: HTMLAttributes<HTMLAnchorElement>;\n            span: HTMLAttributes<HTMLSpanElement>;\n            input: HTMLAttributes<HTMLInputElement>;\n            p: HTMLAttributes<HTMLParagraphElement>;\n            h1: HTMLAttributes<HTMLHeadingElement>;\n            h2: HTMLAttributes<HTMLHeadingElement>;\n            h3: HTMLAttributes<HTMLHeadingElement>;\n            ul: HTMLAttributes<HTMLUListElement>;\n            li: HTMLAttributes<HTMLLIElement>;\n            section: HTMLAttributes<HTMLElement>;\n            // Web Components 元素\n            slot: HTMLAttributes<HTMLSlotElement>;\n        }\n\n        interface HTMLAttributes<T extends HTMLElement = HTMLElement> {\n            // 基础属性\n            className?: string;\n            class?: string;\n            id?: string;\n            style?: string;\n            disabled?: boolean;\n            title?: string;\n            type?: string;\n            value?: string;\n            placeholder?: string;\n            src?: string;\n            alt?: string;\n            href?: string | null;\n            target?: string;\n            rel?: string;\n            download?: string;\n\n            // Ref callback with proper typing\n            ref?: (element: T) => void;\n\n            // Data attributes\n            [dataAttr: `data-${string}`]: string;\n\n            // Event handlers\n            onClick?: (event: Event) => void;\n            onInput?: (event: Event) => void;\n            onChange?: (event: Event) => void;\n            onMouseOver?: (event: Event) => void;\n            onMouseOut?: (event: Event) => void;\n            onFocus?: (event: Event) => void;\n            onBlur?: (event: Event) => void;\n            onMouseDown?: (event: MouseEvent) => void;\n            onKeyDown?: (event: KeyboardEvent) => void;\n\n            // 允许任意属性\n            [key: string]: unknown;\n        }\n\n        // 核心 JSX 接口\n        type Element = HTMLElement;\n\n        interface ElementClass {\n            render(): Element;\n        }\n\n        interface ElementAttributesProperty {\n            props: object;\n        }\n\n        interface ElementChildrenAttribute {\n            children: object;\n        }\n\n        type LibraryManagedAttributes<_C, P> = P;\n    }\n}\n\n// 导出 JSX 工厂函数\nexport { h, Fragment };\n","/**\n * SVG utilities for namespace-aware element creation\n */\n\n// SVG namespace URI\nexport const SVG_NAMESPACE = \"http://www.w3.org/2000/svg\";\n\n// SVG专用元素 - 只存在于SVG中的元素\nexport const SVG_ONLY_ELEMENTS = new Set([\n    // 结构元素 (Structural elements)\n    \"svg\",\n    \"defs\",\n    \"g\",\n    \"symbol\",\n    \"use\",\n\n    // 图形元素 (Graphics elements)\n    \"circle\",\n    \"ellipse\",\n    \"line\",\n    \"path\",\n    \"polygon\",\n    \"polyline\",\n    \"rect\",\n\n    // 文本元素 (Text elements)\n    \"textPath\",\n    \"tspan\",\n\n    // 渐变和模式 (Gradients and patterns)\n    \"linearGradient\",\n    \"radialGradient\",\n    \"stop\",\n    \"pattern\",\n\n    // 滤镜 (Filter elements)\n    \"filter\",\n    \"feBlend\",\n    \"feColorMatrix\",\n    \"feComponentTransfer\",\n    \"feComposite\",\n    \"feConvolveMatrix\",\n    \"feDiffuseLighting\",\n    \"feDisplacementMap\",\n    \"feDistantLight\",\n    \"feDropShadow\",\n    \"feFlood\",\n    \"feFuncA\",\n    \"feFuncB\",\n    \"feFuncG\",\n    \"feFuncR\",\n    \"feGaussianBlur\",\n    \"feImage\",\n    \"feMerge\",\n    \"feMergeNode\",\n    \"feMorphology\",\n    \"feOffset\",\n    \"fePointLight\",\n    \"feSpecularLighting\",\n    \"feSpotLight\",\n    \"feTile\",\n    \"feTurbulence\",\n\n    // 动画元素 (Animation elements)\n    \"animate\",\n    \"animateMotion\",\n    \"animateTransform\",\n    \"set\",\n\n    // 其他元素 (Other elements)\n    \"clipPath\",\n    \"foreignObject\",\n    \"marker\",\n    \"mask\",\n    \"metadata\",\n    \"switch\",\n    \"desc\",\n]);\n\n// 既存在于HTML又存在于SVG的元素 - 默认使用HTML版本\nexport const DUAL_ELEMENTS = new Set([\"image\", \"style\", \"title\", \"text\"]);\n\n// 强制使用HTML版本的元素（即使在SVG上下文中）\nexport const FORCE_HTML_ELEMENTS = new Set([\"a\"]);\n\n// 所有SVG元素的集合\nexport const SVG_ELEMENTS = new Set([\n    ...SVG_ONLY_ELEMENTS,\n    ...DUAL_ELEMENTS,\n    ...FORCE_HTML_ELEMENTS,\n]);\n\n// SVG上下文追踪\nlet svgContext = false;\n\n/**\n * 检查标签名是否为SVG专用元素\n */\nexport function isSVGOnlyElement(tagName: string): boolean {\n    return SVG_ONLY_ELEMENTS.has(tagName);\n}\n\n/**\n * 检查标签名是否为双重元素（HTML和SVG都有）\n */\nexport function isDualElement(tagName: string): boolean {\n    return DUAL_ELEMENTS.has(tagName);\n}\n\n/**\n * 检查标签名是否为强制HTML元素\n */\nexport function isForceHTMLElement(tagName: string): boolean {\n    return FORCE_HTML_ELEMENTS.has(tagName);\n}\n\n/**\n * 检查标签名是否为SVG元素（保持向后兼容）\n */\nexport function isSVGElement(tagName: string): boolean {\n    return SVG_ELEMENTS.has(tagName);\n}\n\n/**\n * 设置SVG上下文状态\n */\nexport function setSVGContext(inSVG: boolean): void {\n    svgContext = inSVG;\n}\n\n/**\n * 获取当前SVG上下文状态\n */\nexport function getSVGContext(): boolean {\n    return svgContext;\n}\n\n/**\n * 创建元素 - 基于上下文和元素类型智能选择命名空间\n */\nexport function createElement(tagName: string): HTMLElement | SVGElement {\n    // 强制HTML元素始终使用HTML版本\n    if (isForceHTMLElement(tagName)) {\n        return document.createElement(tagName) as HTMLElement;\n    }\n\n    // SVG专用元素始终使用SVG命名空间\n    if (isSVGOnlyElement(tagName)) {\n        setSVGContext(true); // 进入SVG上下文\n        return document.createElementNS(SVG_NAMESPACE, tagName) as SVGElement;\n    }\n\n    // 双重元素根据上下文决定\n    if (isDualElement(tagName)) {\n        if (svgContext) {\n            return document.createElementNS(SVG_NAMESPACE, tagName) as SVGElement;\n        }\n    }\n\n    // 默认创建HTML元素\n    return document.createElement(tagName) as HTMLElement;\n}\n\n/**\n * 检测元素是否需要在SVG上下文中处理\n */\nexport function shouldUseSVGNamespace(tagName: string): boolean {\n    return isSVGOnlyElement(tagName) || (isDualElement(tagName) && svgContext);\n}\n\n/**\n * SVG特殊属性映射 - 处理SVG和HTML属性差异\n */\nexport const SVG_ATTRIBUTE_MAP = new Map([\n    [\"className\", \"class\"],\n    [\"htmlFor\", \"for\"],\n]);\n\n/**\n * 获取SVG元素的正确属性名\n */\nexport function getSVGAttributeName(attributeName: string): string {\n    return SVG_ATTRIBUTE_MAP.get(attributeName) || attributeName;\n}\n","/**\n * 纯原生JSX工厂 - 零依赖的EditorJS Web Component支持\n *\n * 特点：\n * - 完全独立，不依赖React或任何框架\n * - 支持标准JSX语法\n * - 原生DOM操作，性能优异\n * - 完全通用，适用于任何Web Components\n * - TypeScript类型安全\n */\n\n// JSX 类型声明已移至 types/wsx-types.d.ts\n\nimport { createElement, shouldUseSVGNamespace, getSVGAttributeName } from \"./utils/svg-utils\";\n\n// JSX子元素类型\nexport type JSXChildren =\n    | string\n    | number\n    | HTMLElement\n    | SVGElement\n    | DocumentFragment\n    | JSXChildren[]\n    | null\n    | undefined\n    | boolean;\n\n/**\n * 纯原生JSX工厂函数\n *\n * @param tag - HTML标签名或组件函数\n * @param props - 属性对象\n * @param children - 子元素\n * @returns DOM元素\n */\nexport function h(\n    tag:\n        | string\n        | ((\n              props: Record<string, unknown> | null,\n              children: JSXChildren[]\n          ) => HTMLElement | SVGElement),\n    props: Record<string, unknown> | null = {},\n    ...children: JSXChildren[]\n): HTMLElement | SVGElement {\n    // 处理组件函数\n    if (typeof tag === \"function\") {\n        return tag(props, children);\n    }\n\n    // 创建DOM元素 - 自动检测SVG命名空间\n    const element = createElement(tag);\n\n    // 处理属性\n    if (props) {\n        const isSVG = shouldUseSVGNamespace(tag);\n\n        Object.entries(props).forEach(([key, value]) => {\n            if (value === null || value === undefined || value === false) {\n                return;\n            }\n\n            // 处理ref回调\n            if (key === \"ref\" && typeof value === \"function\") {\n                value(element);\n            }\n            // 处理className和class\n            else if (key === \"className\" || key === \"class\") {\n                if (isSVG) {\n                    // SVG元素使用class属性\n                    element.setAttribute(\"class\", value as string);\n                } else {\n                    // HTML元素可以使用className\n                    (element as HTMLElement).className = value as string;\n                }\n            }\n            // 处理style\n            else if (key === \"style\" && typeof value === \"string\") {\n                element.setAttribute(\"style\", value);\n            }\n            // 处理事件监听器\n            else if (key.startsWith(\"on\") && typeof value === \"function\") {\n                const eventName = key.slice(2).toLowerCase();\n                element.addEventListener(eventName, value as EventListener);\n            }\n            // 处理布尔属性\n            else if (typeof value === \"boolean\") {\n                if (value) {\n                    element.setAttribute(key, \"\");\n                }\n            }\n            // 处理其他属性\n            else {\n                // 对SVG元素使用正确的属性名\n                const attributeName = isSVG ? getSVGAttributeName(key) : key;\n                element.setAttribute(attributeName, String(value));\n            }\n        });\n    }\n\n    // 处理子元素\n    const flatChildren = flattenChildren(children);\n    flatChildren.forEach((child) => {\n        if (child === null || child === undefined || child === false) {\n            return;\n        }\n\n        if (typeof child === \"string\" || typeof child === \"number\") {\n            element.appendChild(document.createTextNode(String(child)));\n        } else if (child instanceof HTMLElement || child instanceof SVGElement) {\n            element.appendChild(child);\n        } else if (child instanceof DocumentFragment) {\n            element.appendChild(child);\n        }\n    });\n\n    return element;\n}\n\n/**\n * 扁平化子元素数组\n */\nfunction flattenChildren(\n    children: JSXChildren[]\n): (string | number | HTMLElement | SVGElement | DocumentFragment | boolean | null | undefined)[] {\n    const result: (\n        | string\n        | number\n        | HTMLElement\n        | SVGElement\n        | DocumentFragment\n        | boolean\n        | null\n        | undefined\n    )[] = [];\n\n    for (const child of children) {\n        if (child === null || child === undefined || child === false) {\n            continue;\n        } else if (Array.isArray(child)) {\n            result.push(...flattenChildren(child));\n        } else {\n            result.push(child);\n        }\n    }\n\n    return result;\n}\n\n/**\n * JSX Fragment支持 - 用于包装多个子元素\n */\nexport function Fragment(_props: unknown, children: JSXChildren[]): DocumentFragment {\n    const fragment = document.createDocumentFragment();\n    const flatChildren = flattenChildren(children);\n\n    flatChildren.forEach((child) => {\n        if (child === null || child === undefined || child === false) {\n            return;\n        }\n\n        if (typeof child === \"string\" || typeof child === \"number\") {\n            fragment.appendChild(document.createTextNode(String(child)));\n        } else if (child instanceof HTMLElement || child instanceof SVGElement) {\n            fragment.appendChild(child);\n        } else if (child instanceof DocumentFragment) {\n            fragment.appendChild(child);\n        }\n    });\n\n    return fragment;\n}\n\n/**\n * JSX function for React's new JSX transform\n * Handles the new format: jsx(tag, { children: child, ...props })\n */\nexport function jsx(\n    tag:\n        | string\n        | ((\n              props: Record<string, unknown> | null,\n              children: JSXChildren[]\n          ) => HTMLElement | SVGElement),\n    props: Record<string, unknown> | null\n): HTMLElement | SVGElement {\n    if (!props) {\n        return h(tag, null);\n    }\n\n    const { children, ...restProps } = props;\n    if (\n        (children !== undefined && children !== null && typeof children !== \"object\") ||\n        Array.isArray(children) ||\n        typeof children === \"string\" ||\n        typeof children === \"number\" ||\n        typeof children === \"boolean\" ||\n        children instanceof HTMLElement ||\n        children instanceof SVGElement ||\n        children instanceof DocumentFragment\n    ) {\n        return h(tag, restProps, children as JSXChildren);\n    }\n    return h(tag, restProps);\n}\n\n/**\n * JSX function for multiple children in React's new JSX transform\n * Handles the new format: jsxs(tag, { children: [child1, child2], ...props })\n */\nexport function jsxs(\n    tag:\n        | string\n        | ((\n              props: Record<string, unknown> | null,\n              children: JSXChildren[]\n          ) => HTMLElement | SVGElement),\n    props: Record<string, unknown> | null\n): HTMLElement | SVGElement {\n    if (!props) {\n        return h(tag, null);\n    }\n\n    const { children, ...restProps } = props;\n    if (Array.isArray(children)) {\n        return h(tag, restProps, ...children);\n    } else if (\n        children !== undefined &&\n        children !== null &&\n        (typeof children !== \"object\" ||\n            children instanceof HTMLElement ||\n            children instanceof SVGElement ||\n            children instanceof DocumentFragment)\n    ) {\n        return h(tag, restProps, children as JSXChildren);\n    }\n    return h(tag, restProps);\n}\n"],"mappings":"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","names":[]}

package/dist/jsx.mjs

@@ -0,0 +1,8 @@
+import {
+  Fragment,
+  h
+} from "./chunk-BV2V6BVN.mjs";
+export {
+  Fragment,
+  h
+};

package/dist/jsx.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/package.json

@@ -0,0 +1,49 @@
+{
+  "name": "@wsxjs/wsx-core",
+  "version": "0.0.5",
+  "description": "Core WSX Framework - Web Components with JSX syntax",
+  "main": "./dist/index.js",
+  "module": "./dist/index.mjs",
+  "types": "./types/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./types/index.d.ts",
+      "import": "./dist/index.mjs",
+      "require": "./dist/index.js"
+    },
+    "./jsx-runtime": {
+      "types": "./types/jsx-runtime.d.ts",
+      "import": "./dist/jsx-runtime.mjs",
+      "require": "./dist/jsx-runtime.js"
+    }
+  },
+  "files": [
+    "dist",
+    "src",
+    "types",
+    "!**/__tests__",
+    "!**/test"
+  ],
+  "keywords": [
+    "web-components",
+    "jsx",
+    "typescript",
+    "custom-elements"
+  ],
+  "devDependencies": {
+    "tsup": "^8.0.0",
+    "typescript": "^5.0.0",
+    "@types/node": "^20.0.0"
+  },
+  "peerDependencies": {
+    "typescript": ">=4.7.0"
+  },
+  "scripts": {
+    "build": "tsup src/index.ts src/jsx.ts src/jsx-runtime.ts --format cjs,esm",
+    "build:dev": "NODE_ENV=development tsup src/index.ts src/jsx.ts src/jsx-runtime.ts --format cjs,esm --sourcemap",
+    "dev": "NODE_ENV=development tsup src/index.ts src/jsx.ts src/jsx-runtime.ts --format cjs,esm --watch --sourcemap",
+    "test": "jest",
+    "typecheck": "tsc --noEmit",
+    "clean": "rm -rf dist"
+  }
+}

package/src/auto-register.ts

@@ -0,0 +1,149 @@
+/**
+ * Auto-registration decorator and utilities for web components
+ *
+ * Provides decorator-based auto-registration for web components
+ * to eliminate manual customElements.define() calls.
+ */
+
+/**
+ * Auto-registration options for web components
+ */
+export interface AutoRegistrationOptions {
+    tagName?: string; // Custom tag name, if not provided, derives from class name
+    prefix?: string; // Prefix for tag name (e.g., "my-" -> "my-component")
+}
+
+/**
+ * Auto-register decorator for web components
+ * Usage: @autoRegister() or @autoRegister({ tagName: "custom-name" })
+ *
+ * @example
+ * ```typescript
+ * @autoRegister()
+ * class MyButton extends WebComponent {
+ *   // Will be registered as "my-button-component"
+ * }
+ *
+ * @autoRegister({ tagName: "custom-button" })
+ * class MyButton extends WebComponent {
+ *   // Will be registered as "custom-button"
+ * }
+ *
+ * @autoRegister({ prefix: "ui-" })
+ * class MyButton extends WebComponent {
+ *   // Will be registered as "ui-my-button-component"
+ * }
+ * ```
+ */
+export function autoRegister(options: AutoRegistrationOptions = {}) {
+    return function <T extends CustomElementConstructor>(constructor: T): T {
+        const tagName = options.tagName || deriveTagName(constructor.name, options.prefix);
+
+        if (!customElements.get(tagName)) {
+            customElements.define(tagName, constructor);
+        }
+
+        return constructor;
+    };
+}
+
+/**
+ * Static method to auto-register a web component class
+ * Usage: registerComponent(MyComponent) or registerComponent(MyComponent, { tagName: "custom-name" })
+ *
+ * @example
+ * ```typescript
+ * class MyButton extends WebComponent {
+ *   // ...
+ * }
+ *
+ * registerComponent(MyButton); // Registers as "my-button-component"
+ * registerComponent(MyButton, { tagName: "custom-button" }); // Registers as "custom-button"
+ * ```
+ */
+export function registerComponent<T extends CustomElementConstructor>(
+    constructor: T,
+    options: AutoRegistrationOptions = {}
+): void {
+    const tagName = options.tagName || deriveTagName(constructor.name, options.prefix);
+
+    if (!customElements.get(tagName)) {
+        customElements.define(tagName, constructor);
+    }
+}
+
+/**
+ * Derive tag name from class name
+ * Converts PascalCase to kebab-case and adds optional prefix
+ * Ensures valid custom element name (must contain hyphen)
+ *
+ * @param className - The class name to convert
+ * @param prefix - Optional prefix to add
+ * @returns Valid custom element tag name
+ *
+ * @example
+ * ```typescript
+ * deriveTagName("MyButton") // "my-button-component"
+ * deriveTagName("HTMLEditor") // "htmleditor-component"
+ * deriveTagName("Button") // "button-component"
+ * deriveTagName("MyButton", "ui-") // "ui-my-button-component"
+ * ```
+ */
+function deriveTagName(className: string, prefix?: string): string {
+    // Convert PascalCase to kebab-case
+    let kebabCase = className.replace(/([a-z])([A-Z])/g, "$1-$2").toLowerCase();
+
+    // Ensure the tag name contains at least one hyphen (custom element requirement)
+    if (!kebabCase.includes("-")) {
+        kebabCase = `${kebabCase}-component`;
+    }
+
+    return prefix ? `${prefix}${kebabCase}` : kebabCase;
+}
+
+/**
+ * Register all components in a module
+ * Useful for bulk registration of multiple components
+ *
+ * @param components - Object containing component classes
+ * @param options - Default options to apply to all components
+ *
+ * @example
+ * ```typescript
+ * import * as Components from './components';
+ *
+ * registerAll(Components, { prefix: "ui-" });
+ * ```
+ */
+export function registerAll(
+    components: Record<string, CustomElementConstructor>,
+    options: AutoRegistrationOptions = {}
+): void {
+    Object.values(components).forEach((component) => {
+        if (typeof component === "function" && component.prototype instanceof HTMLElement) {
+            registerComponent(component, options);
+        }
+    });
+}
+
+/**
+ * Check if a component is already registered
+ *
+ * @param tagName - The tag name to check
+ * @returns True if the component is registered
+ */
+export function isRegistered(tagName: string): boolean {
+    return !!customElements.get(tagName);
+}
+
+/**
+ * Get the tag name that would be generated for a class
+ * Useful for testing or debugging
+ *
+ * @param className - The class name
+ * @param options - Registration options
+ * @returns The generated tag name
+ */
+export function getTagName(className: string, options: AutoRegistrationOptions = {}): string {
+    return options.tagName || deriveTagName(className, options.prefix);
+}

package/src/index.ts

@@ -0,0 +1,17 @@
+// Core exports
+export { WebComponent } from "./web-component";
+export { autoRegister, registerComponent } from "./auto-register";
+export { h, h as jsx, h as jsxs, Fragment } from "./jsx-factory";
+export { StyleManager } from "./styles/style-manager";
+export { WSXLogger, logger, createLogger } from "./utils/logger";
+
+// Reactive exports
+export { reactive, createState, ReactiveDebug } from "./utils/reactive";
+export { ReactiveWebComponent, makeReactive, createReactiveComponent } from "./reactive-component";
+
+// Type exports
+export type { WebComponentConfig } from "./web-component";
+export type { JSXChildren } from "./jsx-factory";
+export type { Logger, LogLevel } from "./utils/logger";
+export type { ReactiveCallback } from "./utils/reactive";
+export type { ReactiveWebComponentConfig } from "./reactive-component";