@wsxjs/wsx-core 0.0.5 → 0.0.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/{chunk-YNUVFDKT.mjs → chunk-VZQT7HU5.mjs} +4 -4
- package/dist/index.js +370 -24
- package/dist/index.mjs +370 -25
- package/dist/jsx-runtime.js +4 -3
- package/dist/jsx-runtime.mjs +1 -1
- package/dist/jsx.mjs +1 -1
- package/package.json +1 -1
- package/src/index.ts +2 -0
- package/src/jsx-factory.ts +5 -4
- package/src/light-component.ts +351 -0
- package/src/reactive-component.ts +135 -0
- package/types/index.d.ts +5 -0
- package/types/wsx-types.d.ts +4 -2
- package/dist/chunk-3CJEWYVF.mjs +0 -197
- package/dist/chunk-5JVEHB6H.mjs +0 -197
- package/dist/chunk-7E7KJQSW.mjs +0 -210
- package/dist/chunk-A5GYVTI3.mjs +0 -222
- package/dist/chunk-A5GYVTI3.mjs.map +0 -1
- package/dist/chunk-K6N3JDTI.mjs +0 -216
- package/dist/chunk-RVGKV4GP.mjs +0 -79
- package/dist/chunk-S3O776FY.mjs +0 -173
- package/dist/chunk-VNK4B3FW.mjs +0 -217
- package/dist/chunk-YNUVFDKT.mjs.map +0 -1
- package/dist/index.d.mts +0 -235
- package/dist/index.d.ts +0 -235
- package/dist/index.js.map +0 -1
- package/dist/index.mjs.map +0 -1
- package/dist/jsx-factory-pFUwL2Dz.d.mts +0 -26
- package/dist/jsx-factory-pFUwL2Dz.d.ts +0 -26
- package/dist/jsx-pFUwL2Dz.d.mts +0 -26
- package/dist/jsx-pFUwL2Dz.d.ts +0 -26
- package/dist/jsx-runtime-pFUwL2Dz.d.mts +0 -26
- package/dist/jsx-runtime-pFUwL2Dz.d.ts +0 -26
- package/dist/jsx-runtime.d.mts +0 -1
- package/dist/jsx-runtime.d.ts +0 -1
- package/dist/jsx-runtime.js.map +0 -1
- package/dist/jsx-runtime.mjs.map +0 -1
- package/dist/jsx.d.mts +0 -66
- package/dist/jsx.d.ts +0 -66
- package/dist/jsx.js.map +0 -1
- package/dist/jsx.mjs.map +0 -1
package/dist/chunk-S3O776FY.mjs
DELETED
|
@@ -1,173 +0,0 @@
|
|
|
1
|
-
// src/svg-utils.ts
|
|
2
|
-
var SVG_NAMESPACE = "http://www.w3.org/2000/svg";
|
|
3
|
-
var SVG_ELEMENTS = /* @__PURE__ */ new Set([
|
|
4
|
-
// 结构元素 (Structural elements)
|
|
5
|
-
"svg",
|
|
6
|
-
"defs",
|
|
7
|
-
"g",
|
|
8
|
-
"symbol",
|
|
9
|
-
"use",
|
|
10
|
-
// 图形元素 (Graphics elements)
|
|
11
|
-
"circle",
|
|
12
|
-
"ellipse",
|
|
13
|
-
"line",
|
|
14
|
-
"path",
|
|
15
|
-
"polygon",
|
|
16
|
-
"polyline",
|
|
17
|
-
"rect",
|
|
18
|
-
// 文本元素 (Text elements)
|
|
19
|
-
"text",
|
|
20
|
-
"textPath",
|
|
21
|
-
"tspan",
|
|
22
|
-
// 渐变和模式 (Gradients and patterns)
|
|
23
|
-
"linearGradient",
|
|
24
|
-
"radialGradient",
|
|
25
|
-
"stop",
|
|
26
|
-
"pattern",
|
|
27
|
-
// 滤镜 (Filter elements)
|
|
28
|
-
"filter",
|
|
29
|
-
"feBlend",
|
|
30
|
-
"feColorMatrix",
|
|
31
|
-
"feComponentTransfer",
|
|
32
|
-
"feComposite",
|
|
33
|
-
"feConvolveMatrix",
|
|
34
|
-
"feDiffuseLighting",
|
|
35
|
-
"feDisplacementMap",
|
|
36
|
-
"feDistantLight",
|
|
37
|
-
"feDropShadow",
|
|
38
|
-
"feFlood",
|
|
39
|
-
"feFuncA",
|
|
40
|
-
"feFuncB",
|
|
41
|
-
"feFuncG",
|
|
42
|
-
"feFuncR",
|
|
43
|
-
"feGaussianBlur",
|
|
44
|
-
"feImage",
|
|
45
|
-
"feMerge",
|
|
46
|
-
"feMergeNode",
|
|
47
|
-
"feMorphology",
|
|
48
|
-
"feOffset",
|
|
49
|
-
"fePointLight",
|
|
50
|
-
"feSpecularLighting",
|
|
51
|
-
"feSpotLight",
|
|
52
|
-
"feTile",
|
|
53
|
-
"feTurbulence",
|
|
54
|
-
// 动画元素 (Animation elements)
|
|
55
|
-
"animate",
|
|
56
|
-
"animateMotion",
|
|
57
|
-
"animateTransform",
|
|
58
|
-
"set",
|
|
59
|
-
// 其他元素 (Other elements)
|
|
60
|
-
"clipPath",
|
|
61
|
-
"foreignObject",
|
|
62
|
-
"image",
|
|
63
|
-
"marker",
|
|
64
|
-
"mask",
|
|
65
|
-
"metadata",
|
|
66
|
-
"style",
|
|
67
|
-
"switch",
|
|
68
|
-
"title",
|
|
69
|
-
"desc",
|
|
70
|
-
"a"
|
|
71
|
-
]);
|
|
72
|
-
function isSVGElement(tagName) {
|
|
73
|
-
return SVG_ELEMENTS.has(tagName);
|
|
74
|
-
}
|
|
75
|
-
function createElement(tagName) {
|
|
76
|
-
if (isSVGElement(tagName)) {
|
|
77
|
-
return document.createElementNS(SVG_NAMESPACE, tagName);
|
|
78
|
-
}
|
|
79
|
-
return document.createElement(tagName);
|
|
80
|
-
}
|
|
81
|
-
var SVG_ATTRIBUTE_MAP = /* @__PURE__ */ new Map([
|
|
82
|
-
["className", "class"],
|
|
83
|
-
["htmlFor", "for"]
|
|
84
|
-
]);
|
|
85
|
-
function getSVGAttributeName(attributeName) {
|
|
86
|
-
return SVG_ATTRIBUTE_MAP.get(attributeName) || attributeName;
|
|
87
|
-
}
|
|
88
|
-
|
|
89
|
-
// src/jsx-factory.ts
|
|
90
|
-
function h(tag, props = {}, ...children) {
|
|
91
|
-
if (typeof tag === "function") {
|
|
92
|
-
return tag(props, children);
|
|
93
|
-
}
|
|
94
|
-
const element = createElement(tag);
|
|
95
|
-
if (props) {
|
|
96
|
-
const isSVG = isSVGElement(tag);
|
|
97
|
-
Object.entries(props).forEach(([key, value]) => {
|
|
98
|
-
if (value === null || value === void 0 || value === false) {
|
|
99
|
-
return;
|
|
100
|
-
}
|
|
101
|
-
if (key === "ref" && typeof value === "function") {
|
|
102
|
-
value(element);
|
|
103
|
-
} else if (key === "className" || key === "class") {
|
|
104
|
-
if (isSVG) {
|
|
105
|
-
element.setAttribute("class", value);
|
|
106
|
-
} else {
|
|
107
|
-
element.className = value;
|
|
108
|
-
}
|
|
109
|
-
} else if (key === "style" && typeof value === "string") {
|
|
110
|
-
element.setAttribute("style", value);
|
|
111
|
-
} else if (key.startsWith("on") && typeof value === "function") {
|
|
112
|
-
const eventName = key.slice(2).toLowerCase();
|
|
113
|
-
element.addEventListener(eventName, value);
|
|
114
|
-
} else if (typeof value === "boolean") {
|
|
115
|
-
if (value) {
|
|
116
|
-
element.setAttribute(key, "");
|
|
117
|
-
}
|
|
118
|
-
} else {
|
|
119
|
-
const attributeName = isSVG ? getSVGAttributeName(key) : key;
|
|
120
|
-
element.setAttribute(attributeName, String(value));
|
|
121
|
-
}
|
|
122
|
-
});
|
|
123
|
-
}
|
|
124
|
-
const flatChildren = flattenChildren(children);
|
|
125
|
-
flatChildren.forEach((child) => {
|
|
126
|
-
if (child === null || child === void 0 || child === false) {
|
|
127
|
-
return;
|
|
128
|
-
}
|
|
129
|
-
if (typeof child === "string" || typeof child === "number") {
|
|
130
|
-
element.appendChild(document.createTextNode(String(child)));
|
|
131
|
-
} else if (child instanceof HTMLElement || child instanceof SVGElement) {
|
|
132
|
-
element.appendChild(child);
|
|
133
|
-
} else if (child instanceof DocumentFragment) {
|
|
134
|
-
element.appendChild(child);
|
|
135
|
-
}
|
|
136
|
-
});
|
|
137
|
-
return element;
|
|
138
|
-
}
|
|
139
|
-
function flattenChildren(children) {
|
|
140
|
-
const result = [];
|
|
141
|
-
for (const child of children) {
|
|
142
|
-
if (child === null || child === void 0 || child === false) {
|
|
143
|
-
continue;
|
|
144
|
-
} else if (Array.isArray(child)) {
|
|
145
|
-
result.push(...flattenChildren(child));
|
|
146
|
-
} else {
|
|
147
|
-
result.push(child);
|
|
148
|
-
}
|
|
149
|
-
}
|
|
150
|
-
return result;
|
|
151
|
-
}
|
|
152
|
-
function Fragment(_props, children) {
|
|
153
|
-
const fragment = document.createDocumentFragment();
|
|
154
|
-
const flatChildren = flattenChildren(children);
|
|
155
|
-
flatChildren.forEach((child) => {
|
|
156
|
-
if (child === null || child === void 0 || child === false) {
|
|
157
|
-
return;
|
|
158
|
-
}
|
|
159
|
-
if (typeof child === "string" || typeof child === "number") {
|
|
160
|
-
fragment.appendChild(document.createTextNode(String(child)));
|
|
161
|
-
} else if (child instanceof HTMLElement || child instanceof SVGElement) {
|
|
162
|
-
fragment.appendChild(child);
|
|
163
|
-
} else if (child instanceof DocumentFragment) {
|
|
164
|
-
fragment.appendChild(child);
|
|
165
|
-
}
|
|
166
|
-
});
|
|
167
|
-
return fragment;
|
|
168
|
-
}
|
|
169
|
-
|
|
170
|
-
export {
|
|
171
|
-
h,
|
|
172
|
-
Fragment
|
|
173
|
-
};
|
package/dist/chunk-VNK4B3FW.mjs
DELETED
|
@@ -1,217 +0,0 @@
|
|
|
1
|
-
// src/utils/svg-utils.ts
|
|
2
|
-
var SVG_NAMESPACE = "http://www.w3.org/2000/svg";
|
|
3
|
-
var SVG_ONLY_ELEMENTS = /* @__PURE__ */ new Set([
|
|
4
|
-
// 结构元素 (Structural elements)
|
|
5
|
-
"svg",
|
|
6
|
-
"defs",
|
|
7
|
-
"g",
|
|
8
|
-
"symbol",
|
|
9
|
-
"use",
|
|
10
|
-
// 图形元素 (Graphics elements)
|
|
11
|
-
"circle",
|
|
12
|
-
"ellipse",
|
|
13
|
-
"line",
|
|
14
|
-
"path",
|
|
15
|
-
"polygon",
|
|
16
|
-
"polyline",
|
|
17
|
-
"rect",
|
|
18
|
-
// 文本元素 (Text elements)
|
|
19
|
-
"textPath",
|
|
20
|
-
"tspan",
|
|
21
|
-
// 渐变和模式 (Gradients and patterns)
|
|
22
|
-
"linearGradient",
|
|
23
|
-
"radialGradient",
|
|
24
|
-
"stop",
|
|
25
|
-
"pattern",
|
|
26
|
-
// 滤镜 (Filter elements)
|
|
27
|
-
"filter",
|
|
28
|
-
"feBlend",
|
|
29
|
-
"feColorMatrix",
|
|
30
|
-
"feComponentTransfer",
|
|
31
|
-
"feComposite",
|
|
32
|
-
"feConvolveMatrix",
|
|
33
|
-
"feDiffuseLighting",
|
|
34
|
-
"feDisplacementMap",
|
|
35
|
-
"feDistantLight",
|
|
36
|
-
"feDropShadow",
|
|
37
|
-
"feFlood",
|
|
38
|
-
"feFuncA",
|
|
39
|
-
"feFuncB",
|
|
40
|
-
"feFuncG",
|
|
41
|
-
"feFuncR",
|
|
42
|
-
"feGaussianBlur",
|
|
43
|
-
"feImage",
|
|
44
|
-
"feMerge",
|
|
45
|
-
"feMergeNode",
|
|
46
|
-
"feMorphology",
|
|
47
|
-
"feOffset",
|
|
48
|
-
"fePointLight",
|
|
49
|
-
"feSpecularLighting",
|
|
50
|
-
"feSpotLight",
|
|
51
|
-
"feTile",
|
|
52
|
-
"feTurbulence",
|
|
53
|
-
// 动画元素 (Animation elements)
|
|
54
|
-
"animate",
|
|
55
|
-
"animateMotion",
|
|
56
|
-
"animateTransform",
|
|
57
|
-
"set",
|
|
58
|
-
// 其他元素 (Other elements)
|
|
59
|
-
"clipPath",
|
|
60
|
-
"foreignObject",
|
|
61
|
-
"marker",
|
|
62
|
-
"mask",
|
|
63
|
-
"metadata",
|
|
64
|
-
"switch",
|
|
65
|
-
"desc"
|
|
66
|
-
]);
|
|
67
|
-
var DUAL_ELEMENTS = /* @__PURE__ */ new Set(["image", "style", "title", "text"]);
|
|
68
|
-
var FORCE_HTML_ELEMENTS = /* @__PURE__ */ new Set(["a"]);
|
|
69
|
-
var SVG_ELEMENTS = /* @__PURE__ */ new Set([...SVG_ONLY_ELEMENTS, ...DUAL_ELEMENTS, ...FORCE_HTML_ELEMENTS]);
|
|
70
|
-
var svgContext = false;
|
|
71
|
-
function isSVGOnlyElement(tagName) {
|
|
72
|
-
return SVG_ONLY_ELEMENTS.has(tagName);
|
|
73
|
-
}
|
|
74
|
-
function isDualElement(tagName) {
|
|
75
|
-
return DUAL_ELEMENTS.has(tagName);
|
|
76
|
-
}
|
|
77
|
-
function isForceHTMLElement(tagName) {
|
|
78
|
-
return FORCE_HTML_ELEMENTS.has(tagName);
|
|
79
|
-
}
|
|
80
|
-
function setSVGContext(inSVG) {
|
|
81
|
-
svgContext = inSVG;
|
|
82
|
-
}
|
|
83
|
-
function createElement(tagName) {
|
|
84
|
-
if (isForceHTMLElement(tagName)) {
|
|
85
|
-
return document.createElement(tagName);
|
|
86
|
-
}
|
|
87
|
-
if (isSVGOnlyElement(tagName)) {
|
|
88
|
-
setSVGContext(true);
|
|
89
|
-
return document.createElementNS(SVG_NAMESPACE, tagName);
|
|
90
|
-
}
|
|
91
|
-
if (isDualElement(tagName)) {
|
|
92
|
-
if (svgContext) {
|
|
93
|
-
return document.createElementNS(SVG_NAMESPACE, tagName);
|
|
94
|
-
}
|
|
95
|
-
}
|
|
96
|
-
return document.createElement(tagName);
|
|
97
|
-
}
|
|
98
|
-
function shouldUseSVGNamespace(tagName) {
|
|
99
|
-
return isSVGOnlyElement(tagName) || isDualElement(tagName) && svgContext;
|
|
100
|
-
}
|
|
101
|
-
var SVG_ATTRIBUTE_MAP = /* @__PURE__ */ new Map([
|
|
102
|
-
["className", "class"],
|
|
103
|
-
["htmlFor", "for"]
|
|
104
|
-
]);
|
|
105
|
-
function getSVGAttributeName(attributeName) {
|
|
106
|
-
return SVG_ATTRIBUTE_MAP.get(attributeName) || attributeName;
|
|
107
|
-
}
|
|
108
|
-
|
|
109
|
-
// src/jsx-factory.ts
|
|
110
|
-
function h(tag, props = {}, ...children) {
|
|
111
|
-
if (typeof tag === "function") {
|
|
112
|
-
return tag(props, children);
|
|
113
|
-
}
|
|
114
|
-
const element = createElement(tag);
|
|
115
|
-
if (props) {
|
|
116
|
-
const isSVG = shouldUseSVGNamespace(tag);
|
|
117
|
-
Object.entries(props).forEach(([key, value]) => {
|
|
118
|
-
if (value === null || value === void 0 || value === false) {
|
|
119
|
-
return;
|
|
120
|
-
}
|
|
121
|
-
if (key === "ref" && typeof value === "function") {
|
|
122
|
-
value(element);
|
|
123
|
-
} else if (key === "className" || key === "class") {
|
|
124
|
-
if (isSVG) {
|
|
125
|
-
element.setAttribute("class", value);
|
|
126
|
-
} else {
|
|
127
|
-
element.className = value;
|
|
128
|
-
}
|
|
129
|
-
} else if (key === "style" && typeof value === "string") {
|
|
130
|
-
element.setAttribute("style", value);
|
|
131
|
-
} else if (key.startsWith("on") && typeof value === "function") {
|
|
132
|
-
const eventName = key.slice(2).toLowerCase();
|
|
133
|
-
element.addEventListener(eventName, value);
|
|
134
|
-
} else if (typeof value === "boolean") {
|
|
135
|
-
if (value) {
|
|
136
|
-
element.setAttribute(key, "");
|
|
137
|
-
}
|
|
138
|
-
} else {
|
|
139
|
-
const attributeName = isSVG ? getSVGAttributeName(key) : key;
|
|
140
|
-
element.setAttribute(attributeName, String(value));
|
|
141
|
-
}
|
|
142
|
-
});
|
|
143
|
-
}
|
|
144
|
-
const flatChildren = flattenChildren(children);
|
|
145
|
-
flatChildren.forEach((child) => {
|
|
146
|
-
if (child === null || child === void 0 || child === false) {
|
|
147
|
-
return;
|
|
148
|
-
}
|
|
149
|
-
if (typeof child === "string" || typeof child === "number") {
|
|
150
|
-
element.appendChild(document.createTextNode(String(child)));
|
|
151
|
-
} else if (child instanceof HTMLElement || child instanceof SVGElement) {
|
|
152
|
-
element.appendChild(child);
|
|
153
|
-
} else if (child instanceof DocumentFragment) {
|
|
154
|
-
element.appendChild(child);
|
|
155
|
-
}
|
|
156
|
-
});
|
|
157
|
-
return element;
|
|
158
|
-
}
|
|
159
|
-
function flattenChildren(children) {
|
|
160
|
-
const result = [];
|
|
161
|
-
for (const child of children) {
|
|
162
|
-
if (child === null || child === void 0 || child === false) {
|
|
163
|
-
continue;
|
|
164
|
-
} else if (Array.isArray(child)) {
|
|
165
|
-
result.push(...flattenChildren(child));
|
|
166
|
-
} else {
|
|
167
|
-
result.push(child);
|
|
168
|
-
}
|
|
169
|
-
}
|
|
170
|
-
return result;
|
|
171
|
-
}
|
|
172
|
-
function Fragment(_props, children) {
|
|
173
|
-
const fragment = document.createDocumentFragment();
|
|
174
|
-
const flatChildren = flattenChildren(children);
|
|
175
|
-
flatChildren.forEach((child) => {
|
|
176
|
-
if (child === null || child === void 0 || child === false) {
|
|
177
|
-
return;
|
|
178
|
-
}
|
|
179
|
-
if (typeof child === "string" || typeof child === "number") {
|
|
180
|
-
fragment.appendChild(document.createTextNode(String(child)));
|
|
181
|
-
} else if (child instanceof HTMLElement || child instanceof SVGElement) {
|
|
182
|
-
fragment.appendChild(child);
|
|
183
|
-
} else if (child instanceof DocumentFragment) {
|
|
184
|
-
fragment.appendChild(child);
|
|
185
|
-
}
|
|
186
|
-
});
|
|
187
|
-
return fragment;
|
|
188
|
-
}
|
|
189
|
-
function jsx(tag, props) {
|
|
190
|
-
if (!props) {
|
|
191
|
-
return h(tag, null);
|
|
192
|
-
}
|
|
193
|
-
const { children, ...restProps } = props;
|
|
194
|
-
if (children !== void 0) {
|
|
195
|
-
return h(tag, restProps, children);
|
|
196
|
-
}
|
|
197
|
-
return h(tag, restProps);
|
|
198
|
-
}
|
|
199
|
-
function jsxs(tag, props) {
|
|
200
|
-
if (!props) {
|
|
201
|
-
return h(tag, null);
|
|
202
|
-
}
|
|
203
|
-
const { children, ...restProps } = props;
|
|
204
|
-
if (Array.isArray(children)) {
|
|
205
|
-
return h(tag, restProps, ...children);
|
|
206
|
-
} else if (children !== void 0) {
|
|
207
|
-
return h(tag, restProps, children);
|
|
208
|
-
}
|
|
209
|
-
return h(tag, restProps);
|
|
210
|
-
}
|
|
211
|
-
|
|
212
|
-
export {
|
|
213
|
-
h,
|
|
214
|
-
Fragment,
|
|
215
|
-
jsx,
|
|
216
|
-
jsxs
|
|
217
|
-
};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/utils/svg-utils.ts","../src/jsx-factory.ts"],"sourcesContent":["/**\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 (children !== undefined) {\n return h(tag, restProps, children);\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 (children !== undefined) {\n return h(tag, restProps, children);\n }\n return h(tag, restProps);\n}\n"],"mappings":"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","names":[]}
|
package/dist/index.d.mts
DELETED
|
@@ -1,235 +0,0 @@
|
|
|
1
|
-
export { F as Fragment, J as JSXChildren, h, h as jsx, h as jsxs } from './jsx-runtime-pFUwL2Dz.mjs';
|
|
2
|
-
|
|
3
|
-
/**
|
|
4
|
-
* 通用 WSX Web Component 基础抽象类
|
|
5
|
-
*
|
|
6
|
-
* 提供JSX + CSS文件支持的通用基础类:
|
|
7
|
-
* - 抽象render方法强制子类实现JSX渲染
|
|
8
|
-
* - 自动集成StyleManager处理外部CSS
|
|
9
|
-
* - 提供完整的Web Component生命周期
|
|
10
|
-
* - 完全通用,不依赖任何特定框架
|
|
11
|
-
*/
|
|
12
|
-
|
|
13
|
-
/**
|
|
14
|
-
* Web Component 配置接口
|
|
15
|
-
*/
|
|
16
|
-
interface WebComponentConfig {
|
|
17
|
-
styles?: string;
|
|
18
|
-
styleName?: string;
|
|
19
|
-
[key: string]: unknown;
|
|
20
|
-
}
|
|
21
|
-
/**
|
|
22
|
-
* 通用 WSX Web Component 基础抽象类
|
|
23
|
-
*/
|
|
24
|
-
declare abstract class WebComponent extends HTMLElement {
|
|
25
|
-
shadowRoot: ShadowRoot;
|
|
26
|
-
protected config: WebComponentConfig;
|
|
27
|
-
/**
|
|
28
|
-
* 子类应该重写这个方法来定义观察的属性
|
|
29
|
-
* @returns 要观察的属性名数组
|
|
30
|
-
*/
|
|
31
|
-
static get observedAttributes(): string[];
|
|
32
|
-
constructor(config?: WebComponentConfig);
|
|
33
|
-
/**
|
|
34
|
-
* 抽象方法:子类必须实现JSX渲染
|
|
35
|
-
*
|
|
36
|
-
* @returns JSX元素
|
|
37
|
-
*/
|
|
38
|
-
abstract render(): HTMLElement;
|
|
39
|
-
/**
|
|
40
|
-
* Web Component生命周期:连接到DOM
|
|
41
|
-
*/
|
|
42
|
-
connectedCallback(): void;
|
|
43
|
-
/**
|
|
44
|
-
* Web Component生命周期:从DOM断开
|
|
45
|
-
*/
|
|
46
|
-
disconnectedCallback(): void;
|
|
47
|
-
/**
|
|
48
|
-
* Web Component生命周期:属性变化
|
|
49
|
-
*/
|
|
50
|
-
attributeChangedCallback(name: string, oldValue: string, newValue: string): void;
|
|
51
|
-
/**
|
|
52
|
-
* 可选生命周期钩子:组件已连接
|
|
53
|
-
*/
|
|
54
|
-
protected onConnected?(): void;
|
|
55
|
-
/**
|
|
56
|
-
* 可选生命周期钩子:组件已断开
|
|
57
|
-
*/
|
|
58
|
-
protected onDisconnected?(): void;
|
|
59
|
-
/**
|
|
60
|
-
* 可选生命周期钩子:属性已更改
|
|
61
|
-
*/
|
|
62
|
-
protected onAttributeChanged?(name: string, oldValue: string, newValue: string): void;
|
|
63
|
-
/**
|
|
64
|
-
* 查找Shadow DOM内的元素
|
|
65
|
-
*
|
|
66
|
-
* @param selector - CSS选择器
|
|
67
|
-
* @returns 元素或null
|
|
68
|
-
*/
|
|
69
|
-
querySelector<T extends HTMLElement>(selector: string): T | null;
|
|
70
|
-
/**
|
|
71
|
-
* 查找Shadow DOM内的所有匹配元素
|
|
72
|
-
*
|
|
73
|
-
* @param selector - CSS选择器
|
|
74
|
-
* @returns 元素列表
|
|
75
|
-
*/
|
|
76
|
-
querySelectorAll<T extends HTMLElement>(selector: string): NodeListOf<T>;
|
|
77
|
-
/**
|
|
78
|
-
* 重新渲染组件
|
|
79
|
-
*/
|
|
80
|
-
protected rerender(): void;
|
|
81
|
-
/**
|
|
82
|
-
* 渲染错误信息
|
|
83
|
-
*
|
|
84
|
-
* @param error - 错误对象
|
|
85
|
-
*/
|
|
86
|
-
private renderError;
|
|
87
|
-
/**
|
|
88
|
-
* 获取配置值
|
|
89
|
-
*
|
|
90
|
-
* @param key - 配置键
|
|
91
|
-
* @param defaultValue - 默认值
|
|
92
|
-
* @returns 配置值
|
|
93
|
-
*/
|
|
94
|
-
protected getConfig<T>(key: string, defaultValue?: T): T;
|
|
95
|
-
/**
|
|
96
|
-
* 设置配置值
|
|
97
|
-
*
|
|
98
|
-
* @param key - 配置键
|
|
99
|
-
* @param value - 配置值
|
|
100
|
-
*/
|
|
101
|
-
protected setConfig(key: string, value: unknown): void;
|
|
102
|
-
/**
|
|
103
|
-
* 获取属性值
|
|
104
|
-
*
|
|
105
|
-
* @param name - 属性名
|
|
106
|
-
* @param defaultValue - 默认值
|
|
107
|
-
* @returns 属性值
|
|
108
|
-
*/
|
|
109
|
-
protected getAttr(name: string, defaultValue?: string): string;
|
|
110
|
-
/**
|
|
111
|
-
* 设置属性值
|
|
112
|
-
*
|
|
113
|
-
* @param name - 属性名
|
|
114
|
-
* @param value - 属性值
|
|
115
|
-
*/
|
|
116
|
-
protected setAttr(name: string, value: string): void;
|
|
117
|
-
/**
|
|
118
|
-
* 移除属性
|
|
119
|
-
*
|
|
120
|
-
* @param name - 属性名
|
|
121
|
-
*/
|
|
122
|
-
protected removeAttr(name: string): void;
|
|
123
|
-
/**
|
|
124
|
-
* 检查是否有属性
|
|
125
|
-
*
|
|
126
|
-
* @param name - 属性名
|
|
127
|
-
* @returns 是否存在
|
|
128
|
-
*/
|
|
129
|
-
protected hasAttr(name: string): boolean;
|
|
130
|
-
}
|
|
131
|
-
|
|
132
|
-
/**
|
|
133
|
-
* Auto-registration decorator and utilities for web components
|
|
134
|
-
*
|
|
135
|
-
* Provides decorator-based auto-registration for web components
|
|
136
|
-
* to eliminate manual customElements.define() calls.
|
|
137
|
-
*/
|
|
138
|
-
/**
|
|
139
|
-
* Auto-registration options for web components
|
|
140
|
-
*/
|
|
141
|
-
interface AutoRegistrationOptions {
|
|
142
|
-
tagName?: string;
|
|
143
|
-
prefix?: string;
|
|
144
|
-
}
|
|
145
|
-
/**
|
|
146
|
-
* Auto-register decorator for web components
|
|
147
|
-
* Usage: @autoRegister() or @autoRegister({ tagName: "custom-name" })
|
|
148
|
-
*
|
|
149
|
-
* @example
|
|
150
|
-
* ```typescript
|
|
151
|
-
* @autoRegister()
|
|
152
|
-
* class MyButton extends WebComponent {
|
|
153
|
-
* // Will be registered as "my-button-component"
|
|
154
|
-
* }
|
|
155
|
-
*
|
|
156
|
-
* @autoRegister({ tagName: "custom-button" })
|
|
157
|
-
* class MyButton extends WebComponent {
|
|
158
|
-
* // Will be registered as "custom-button"
|
|
159
|
-
* }
|
|
160
|
-
*
|
|
161
|
-
* @autoRegister({ prefix: "ui-" })
|
|
162
|
-
* class MyButton extends WebComponent {
|
|
163
|
-
* // Will be registered as "ui-my-button-component"
|
|
164
|
-
* }
|
|
165
|
-
* ```
|
|
166
|
-
*/
|
|
167
|
-
declare function autoRegister(options?: AutoRegistrationOptions): <T extends CustomElementConstructor>(constructor: T) => T;
|
|
168
|
-
/**
|
|
169
|
-
* Static method to auto-register a web component class
|
|
170
|
-
* Usage: registerComponent(MyComponent) or registerComponent(MyComponent, { tagName: "custom-name" })
|
|
171
|
-
*
|
|
172
|
-
* @example
|
|
173
|
-
* ```typescript
|
|
174
|
-
* class MyButton extends WebComponent {
|
|
175
|
-
* // ...
|
|
176
|
-
* }
|
|
177
|
-
*
|
|
178
|
-
* registerComponent(MyButton); // Registers as "my-button-component"
|
|
179
|
-
* registerComponent(MyButton, { tagName: "custom-button" }); // Registers as "custom-button"
|
|
180
|
-
* ```
|
|
181
|
-
*/
|
|
182
|
-
declare function registerComponent<T extends CustomElementConstructor>(constructor: T, options?: AutoRegistrationOptions): void;
|
|
183
|
-
|
|
184
|
-
/**
|
|
185
|
-
* Style Manager for TextColorTool Components
|
|
186
|
-
*
|
|
187
|
-
* This class manages CSS styles for Web Components using modern techniques:
|
|
188
|
-
* 1. CSS imports with Vite/bundler support
|
|
189
|
-
* 2. Constructable StyleSheets for better performance
|
|
190
|
-
* 3. Shared style sheets across component instances
|
|
191
|
-
*/
|
|
192
|
-
declare class StyleManager {
|
|
193
|
-
private static styleSheets;
|
|
194
|
-
/**
|
|
195
|
-
* Create or get a cached CSSStyleSheet for a component
|
|
196
|
-
*/
|
|
197
|
-
static getStyleSheet(componentName: string, cssText: string): CSSStyleSheet;
|
|
198
|
-
/**
|
|
199
|
-
* Apply styles to a shadow root using constructable stylesheets
|
|
200
|
-
*/
|
|
201
|
-
static applyStyles(shadowRoot: ShadowRoot, componentName: string, cssText: string): void;
|
|
202
|
-
/**
|
|
203
|
-
* Fallback method for browsers that don't support constructable stylesheets
|
|
204
|
-
*/
|
|
205
|
-
static applyStylesFallback(shadowRoot: ShadowRoot, cssText: string): void;
|
|
206
|
-
}
|
|
207
|
-
|
|
208
|
-
/**
|
|
209
|
-
* WSX Framework Logger
|
|
210
|
-
*
|
|
211
|
-
* A lightweight logging utility for the WSX framework.
|
|
212
|
-
* Can be extended or replaced by consuming applications.
|
|
213
|
-
*/
|
|
214
|
-
type LogLevel = "debug" | "info" | "warn" | "error";
|
|
215
|
-
interface Logger {
|
|
216
|
-
debug(message: string, ...args: unknown[]): void;
|
|
217
|
-
info(message: string, ...args: unknown[]): void;
|
|
218
|
-
warn(message: string, ...args: unknown[]): void;
|
|
219
|
-
error(message: string, ...args: unknown[]): void;
|
|
220
|
-
}
|
|
221
|
-
declare class WSXLogger implements Logger {
|
|
222
|
-
private prefix;
|
|
223
|
-
private enabled;
|
|
224
|
-
private level;
|
|
225
|
-
constructor(prefix?: string, enabled?: boolean, level?: LogLevel);
|
|
226
|
-
private shouldLog;
|
|
227
|
-
debug(message: string, ...args: unknown[]): void;
|
|
228
|
-
info(message: string, ...args: unknown[]): void;
|
|
229
|
-
warn(message: string, ...args: unknown[]): void;
|
|
230
|
-
error(message: string, ...args: unknown[]): void;
|
|
231
|
-
}
|
|
232
|
-
declare const logger: WSXLogger;
|
|
233
|
-
declare function createLogger(componentName: string): Logger;
|
|
234
|
-
|
|
235
|
-
export { type LogLevel, type Logger, StyleManager, WSXLogger, WebComponent, type WebComponentConfig, autoRegister, createLogger, logger, registerComponent };
|