@zeus-js/component-dts 0.1.0-beta.1 → 0.1.0-beta.3

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.
Files changed (5) hide show
  1. package/dist/component-dts.cjs.js +52 -10
  2. package/dist/component-dts.cjs.prod.js +52 -10
  3. package/dist/component-dts.d.ts +6 -1
  4. package/dist/component-dts.esm-bundler.js +52 -11
  5. package/package.json +6 -6
package/dist/component-dts.cjs.js CHANGED
@@ -1,5 +1,5 @@
1
1
  /**
2
- * component-dts v0.1.0-beta.1
2
+ * component-dts v0.1.0-beta.3
3
3
  * (c) 2026 baicie
4
4
  * Released under the MIT License.
5
5
  **/
@@ -82,6 +82,9 @@ function getElementTypeName(component) {
82
82
  if (component.name.endsWith("Element")) return component.name;
83
83
  return `${component.name}Element`;
84
84
  }
85
+ function toReactEventProp(eventName) {
86
+ return "on" + eventName.split("-").filter(Boolean).map((part) => part.charAt(0).toUpperCase() + part.slice(1)).join("");
87
+ }
85
88
  function getEventMapTypeName(component) {
86
89
  return `${component.name}EventMap`;
87
90
  }
@@ -110,7 +113,7 @@ function generateComponentWCDts(component) {
110
113
  lines.push("");
111
114
  lines.push(generateEventMap(component));
112
115
  lines.push("");
113
- lines.push(generateElementInterface(component));
116
+ lines.push(generateElementInterface$1(component));
114
117
  lines.push("");
115
118
  lines.push(`export declare const ${component.exportName}: {`);
116
119
  lines.push(` new (): ${elementTypeName}`);
@@ -146,7 +149,7 @@ function generateEventMap(component) {
146
149
  lines.push("}");
147
150
  return lines.join("\n");
148
151
  }
149
- function generateElementInterface(component) {
152
+ function generateElementInterface$1(component) {
150
153
  const elementTypeName = getElementTypeName(component);
151
154
  const eventMapName = getEventMapTypeName(component);
152
155
  const lines = [];
@@ -218,7 +221,7 @@ function generateComponentJsxProps(component) {
218
221
  }
219
222
  //#endregion
220
223
  //#region packages/web-c/component-dts/src/generateReactDts.ts
221
- function generateReactDts(manifest) {
224
+ function generateReactDts(manifest, options = {}) {
222
225
  const lines = [];
223
226
  lines.push("/* eslint-disable */");
224
227
  lines.push("// Generated by @zeus-js/component-dts.");
@@ -226,12 +229,12 @@ function generateReactDts(manifest) {
226
229
  lines.push(`import type * as React from 'react'`);
227
230
  lines.push("");
228
231
  for (const component of manifest.components) {
229
- lines.push(generateReactComponentDts(component));
232
+ lines.push(generateReactComponentDts(component, options));
230
233
  lines.push("");
231
234
  }
232
235
  return lines.join("\n");
233
236
  }
234
- function generateReactComponentDts(component) {
237
+ function generateReactComponentDts(component, options) {
235
238
  const propsTypeName = getPropsTypeName(component);
236
239
  const elementTypeName = getElementTypeName(component);
237
240
  const lines = [];
@@ -247,7 +250,11 @@ function generateReactComponentDts(component) {
247
250
  for (const [name, event] of Object.entries(component.events)) {
248
251
  const propName = toReactEventProp(name);
249
252
  const detailType = event.detail ? formatDetailType(event.detail) : "unknown";
250
- lines.push(` ${propName}?: (event: CustomEvent<${detailType}>) => void`);
253
+ lines.push(` ${safePropertyName(propName)}?: (event: CustomEvent<${detailType}>) => void`);
254
+ }
255
+ if (options.namedSlots !== "none") for (const name of Object.keys(component.slots)) {
256
+ if (name === "default") continue;
257
+ lines.push(` ${safePropertyName(name)}?: React.ReactNode`);
251
258
  }
252
259
  lines.push("}");
253
260
  lines.push("");
@@ -263,9 +270,6 @@ function generateReactComponentDts(component) {
263
270
  lines.push(">");
264
271
  return lines.join("\n");
265
272
  }
266
- function toReactEventProp(eventName) {
267
- return "on" + eventName.split("-").filter(Boolean).map((part) => part.charAt(0).toUpperCase() + part.slice(1)).join("");
268
- }
269
273
  //#endregion
270
274
  //#region packages/web-c/component-dts/src/generateVueDts.ts
271
275
  function generateVueDts(manifest) {
@@ -361,10 +365,48 @@ function normalizeOptions(options) {
361
365
  };
362
366
  }
363
367
  //#endregion
368
+ //#region packages/web-c/component-dts/src/generateLoaderDts.ts
369
+ function generateLoaderDts(manifest) {
370
+ const lines = [];
371
+ lines.push("/* eslint-disable */");
372
+ lines.push("// Generated by @zeus-js/component-dts.");
373
+ lines.push("");
374
+ for (const component of manifest.components) {
375
+ lines.push(generateElementInterface(component));
376
+ lines.push("");
377
+ }
378
+ lines.push("export declare function defineCustomElements(): void");
379
+ lines.push("");
380
+ lines.push("export declare const defineLazyElements: typeof defineCustomElements");
381
+ lines.push("");
382
+ lines.push("declare global {");
383
+ lines.push(" interface HTMLElementTagNameMap {");
384
+ for (const component of manifest.components) lines.push(` ${JSON.stringify(component.tag)}: ${getElementTypeName(component)}`);
385
+ lines.push(" }");
386
+ lines.push("}");
387
+ lines.push("");
388
+ lines.push("export {}");
389
+ lines.push("");
390
+ return lines.join("\n");
391
+ }
392
+ function generateElementInterface(component) {
393
+ const elementTypeName = getElementTypeName(component);
394
+ const lines = [];
395
+ lines.push(`export interface ${elementTypeName} extends HTMLElement {`);
396
+ for (const [name, prop] of Object.entries(component.props)) {
397
+ const optional = isRequiredProp(prop) ? "" : "?";
398
+ lines.push(` ${safePropertyName(name)}${optional}: ${formatPropType(prop)}`);
399
+ }
400
+ lines.push(" componentOnReady(): Promise<this>");
401
+ lines.push("}");
402
+ return lines.join("\n");
403
+ }
404
+ //#endregion
364
405
  exports.formatDetailType = formatDetailType;
365
406
  exports.formatEventType = formatEventType;
366
407
  exports.formatPropType = formatPropType;
367
408
  exports.generateComponentWCDts = generateComponentWCDts;
409
+ exports.generateLoaderDts = generateLoaderDts;
368
410
  exports.generateReactDts = generateReactDts;
369
411
  exports.generateVueDts = generateVueDts;
370
412
  exports.generateVueGlobalDts = generateVueGlobalDts;
package/dist/component-dts.cjs.prod.js CHANGED
@@ -1,5 +1,5 @@
1
1
  /**
2
- * component-dts v0.1.0-beta.1
2
+ * component-dts v0.1.0-beta.3
3
3
  * (c) 2026 baicie
4
4
  * Released under the MIT License.
5
5
  **/
@@ -82,6 +82,9 @@ function getElementTypeName(component) {
82
82
  if (component.name.endsWith("Element")) return component.name;
83
83
  return `${component.name}Element`;
84
84
  }
85
+ function toReactEventProp(eventName) {
86
+ return "on" + eventName.split("-").filter(Boolean).map((part) => part.charAt(0).toUpperCase() + part.slice(1)).join("");
87
+ }
85
88
  function getEventMapTypeName(component) {
86
89
  return `${component.name}EventMap`;
87
90
  }
@@ -110,7 +113,7 @@ function generateComponentWCDts(component) {
110
113
  lines.push("");
111
114
  lines.push(generateEventMap(component));
112
115
  lines.push("");
113
- lines.push(generateElementInterface(component));
116
+ lines.push(generateElementInterface$1(component));
114
117
  lines.push("");
115
118
  lines.push(`export declare const ${component.exportName}: {`);
116
119
  lines.push(` new (): ${elementTypeName}`);
@@ -146,7 +149,7 @@ function generateEventMap(component) {
146
149
  lines.push("}");
147
150
  return lines.join("\n");
148
151
  }
149
- function generateElementInterface(component) {
152
+ function generateElementInterface$1(component) {
150
153
  const elementTypeName = getElementTypeName(component);
151
154
  const eventMapName = getEventMapTypeName(component);
152
155
  const lines = [];
@@ -218,7 +221,7 @@ function generateComponentJsxProps(component) {
218
221
  }
219
222
  //#endregion
220
223
  //#region packages/web-c/component-dts/src/generateReactDts.ts
221
- function generateReactDts(manifest) {
224
+ function generateReactDts(manifest, options = {}) {
222
225
  const lines = [];
223
226
  lines.push("/* eslint-disable */");
224
227
  lines.push("// Generated by @zeus-js/component-dts.");
@@ -226,12 +229,12 @@ function generateReactDts(manifest) {
226
229
  lines.push(`import type * as React from 'react'`);
227
230
  lines.push("");
228
231
  for (const component of manifest.components) {
229
- lines.push(generateReactComponentDts(component));
232
+ lines.push(generateReactComponentDts(component, options));
230
233
  lines.push("");
231
234
  }
232
235
  return lines.join("\n");
233
236
  }
234
- function generateReactComponentDts(component) {
237
+ function generateReactComponentDts(component, options) {
235
238
  const propsTypeName = getPropsTypeName(component);
236
239
  const elementTypeName = getElementTypeName(component);
237
240
  const lines = [];
@@ -247,7 +250,11 @@ function generateReactComponentDts(component) {
247
250
  for (const [name, event] of Object.entries(component.events)) {
248
251
  const propName = toReactEventProp(name);
249
252
  const detailType = event.detail ? formatDetailType(event.detail) : "unknown";
250
- lines.push(` ${propName}?: (event: CustomEvent<${detailType}>) => void`);
253
+ lines.push(` ${safePropertyName(propName)}?: (event: CustomEvent<${detailType}>) => void`);
254
+ }
255
+ if (options.namedSlots !== "none") for (const name of Object.keys(component.slots)) {
256
+ if (name === "default") continue;
257
+ lines.push(` ${safePropertyName(name)}?: React.ReactNode`);
251
258
  }
252
259
  lines.push("}");
253
260
  lines.push("");
@@ -263,9 +270,6 @@ function generateReactComponentDts(component) {
263
270
  lines.push(">");
264
271
  return lines.join("\n");
265
272
  }
266
- function toReactEventProp(eventName) {
267
- return "on" + eventName.split("-").filter(Boolean).map((part) => part.charAt(0).toUpperCase() + part.slice(1)).join("");
268
- }
269
273
  //#endregion
270
274
  //#region packages/web-c/component-dts/src/generateVueDts.ts
271
275
  function generateVueDts(manifest) {
@@ -361,10 +365,48 @@ function normalizeOptions(options) {
361
365
  };
362
366
  }
363
367
  //#endregion
368
+ //#region packages/web-c/component-dts/src/generateLoaderDts.ts
369
+ function generateLoaderDts(manifest) {
370
+ const lines = [];
371
+ lines.push("/* eslint-disable */");
372
+ lines.push("// Generated by @zeus-js/component-dts.");
373
+ lines.push("");
374
+ for (const component of manifest.components) {
375
+ lines.push(generateElementInterface(component));
376
+ lines.push("");
377
+ }
378
+ lines.push("export declare function defineCustomElements(): void");
379
+ lines.push("");
380
+ lines.push("export declare const defineLazyElements: typeof defineCustomElements");
381
+ lines.push("");
382
+ lines.push("declare global {");
383
+ lines.push(" interface HTMLElementTagNameMap {");
384
+ for (const component of manifest.components) lines.push(` ${JSON.stringify(component.tag)}: ${getElementTypeName(component)}`);
385
+ lines.push(" }");
386
+ lines.push("}");
387
+ lines.push("");
388
+ lines.push("export {}");
389
+ lines.push("");
390
+ return lines.join("\n");
391
+ }
392
+ function generateElementInterface(component) {
393
+ const elementTypeName = getElementTypeName(component);
394
+ const lines = [];
395
+ lines.push(`export interface ${elementTypeName} extends HTMLElement {`);
396
+ for (const [name, prop] of Object.entries(component.props)) {
397
+ const optional = isRequiredProp(prop) ? "" : "?";
398
+ lines.push(` ${safePropertyName(name)}${optional}: ${formatPropType(prop)}`);
399
+ }
400
+ lines.push(" componentOnReady(): Promise<this>");
401
+ lines.push("}");
402
+ return lines.join("\n");
403
+ }
404
+ //#endregion
364
405
  exports.formatDetailType = formatDetailType;
365
406
  exports.formatEventType = formatEventType;
366
407
  exports.formatPropType = formatPropType;
367
408
  exports.generateComponentWCDts = generateComponentWCDts;
409
+ exports.generateLoaderDts = generateLoaderDts;
368
410
  exports.generateReactDts = generateReactDts;
369
411
  exports.generateVueDts = generateVueDts;
370
412
  exports.generateVueGlobalDts = generateVueGlobalDts;
package/dist/component-dts.d.ts CHANGED
@@ -7,7 +7,10 @@ export declare function generateWCIndexDts(manifest: ComponentManifest, options:
7
7
 
8
8
  export declare function generateWCJsxDts(manifest: ComponentManifest): string;
9
9
 
10
- export declare function generateReactDts(manifest: ComponentManifest): string;
10
+ interface GenerateReactDtsOptions {
11
+ namedSlots?: 'props' | 'none';
12
+ }
13
+ export declare function generateReactDts(manifest: ComponentManifest, options?: GenerateReactDtsOptions): string;
11
14
 
12
15
  export declare function generateVueDts(manifest: ComponentManifest): string;
13
16
  export declare function generateVueGlobalDts(manifest: ComponentManifest): string;
@@ -56,6 +59,8 @@ export interface ComponentDtsOptions {
56
59
 
57
60
  export declare function generateWCDtsFiles(manifest: ComponentManifest, options?: ComponentDtsOptions): DtsOutputFile[];
58
61
 
62
+ export declare function generateLoaderDts(manifest: ComponentManifest): string;
63
+
59
64
  export declare function formatPropType(prop: ComponentProp): string;
60
65
  export declare function formatEventType(event: ComponentEvent): string;
61
66
  export declare function formatDetailType(detail: Record<string, string>): string;
package/dist/component-dts.esm-bundler.js CHANGED
@@ -1,5 +1,5 @@
1
1
  /**
2
- * component-dts v0.1.0-beta.1
2
+ * component-dts v0.1.0-beta.3
3
3
  * (c) 2026 baicie
4
4
  * Released under the MIT License.
5
5
  **/
@@ -55,6 +55,9 @@ function getElementTypeName(component) {
55
55
  if (component.name.endsWith("Element")) return component.name;
56
56
  return `${component.name}Element`;
57
57
  }
58
+ function toReactEventProp(eventName) {
59
+ return "on" + eventName.split("-").filter(Boolean).map((part) => part.charAt(0).toUpperCase() + part.slice(1)).join("");
60
+ }
58
61
  function getEventMapTypeName(component) {
59
62
  return `${component.name}EventMap`;
60
63
  }
@@ -83,7 +86,7 @@ function generateComponentWCDts(component) {
83
86
  lines.push("");
84
87
  lines.push(generateEventMap(component));
85
88
  lines.push("");
86
- lines.push(generateElementInterface(component));
89
+ lines.push(generateElementInterface$1(component));
87
90
  lines.push("");
88
91
  lines.push(`export declare const ${component.exportName}: {`);
89
92
  lines.push(` new (): ${elementTypeName}`);
@@ -119,7 +122,7 @@ function generateEventMap(component) {
119
122
  lines.push("}");
120
123
  return lines.join("\n");
121
124
  }
122
- function generateElementInterface(component) {
125
+ function generateElementInterface$1(component) {
123
126
  const elementTypeName = getElementTypeName(component);
124
127
  const eventMapName = getEventMapTypeName(component);
125
128
  const lines = [];
@@ -191,7 +194,7 @@ function generateComponentJsxProps(component) {
191
194
  }
192
195
  //#endregion
193
196
  //#region packages/web-c/component-dts/src/generateReactDts.ts
194
- function generateReactDts(manifest) {
197
+ function generateReactDts(manifest, options = {}) {
195
198
  const lines = [];
196
199
  lines.push("/* eslint-disable */");
197
200
  lines.push("// Generated by @zeus-js/component-dts.");
@@ -199,12 +202,12 @@ function generateReactDts(manifest) {
199
202
  lines.push(`import type * as React from 'react'`);
200
203
  lines.push("");
201
204
  for (const component of manifest.components) {
202
- lines.push(generateReactComponentDts(component));
205
+ lines.push(generateReactComponentDts(component, options));
203
206
  lines.push("");
204
207
  }
205
208
  return lines.join("\n");
206
209
  }
207
- function generateReactComponentDts(component) {
210
+ function generateReactComponentDts(component, options) {
208
211
  const propsTypeName = getPropsTypeName(component);
209
212
  const elementTypeName = getElementTypeName(component);
210
213
  const lines = [];
@@ -220,7 +223,11 @@ function generateReactComponentDts(component) {
220
223
  for (const [name, event] of Object.entries(component.events)) {
221
224
  const propName = toReactEventProp(name);
222
225
  const detailType = event.detail ? formatDetailType(event.detail) : "unknown";
223
- lines.push(` ${propName}?: (event: CustomEvent<${detailType}>) => void`);
226
+ lines.push(` ${safePropertyName(propName)}?: (event: CustomEvent<${detailType}>) => void`);
227
+ }
228
+ if (options.namedSlots !== "none") for (const name of Object.keys(component.slots)) {
229
+ if (name === "default") continue;
230
+ lines.push(` ${safePropertyName(name)}?: React.ReactNode`);
224
231
  }
225
232
  lines.push("}");
226
233
  lines.push("");
@@ -236,9 +243,6 @@ function generateReactComponentDts(component) {
236
243
  lines.push(">");
237
244
  return lines.join("\n");
238
245
  }
239
- function toReactEventProp(eventName) {
240
- return "on" + eventName.split("-").filter(Boolean).map((part) => part.charAt(0).toUpperCase() + part.slice(1)).join("");
241
- }
242
246
  //#endregion
243
247
  //#region packages/web-c/component-dts/src/generateVueDts.ts
244
248
  function generateVueDts(manifest) {
@@ -334,4 +338,41 @@ function normalizeOptions(options) {
334
338
  };
335
339
  }
336
340
  //#endregion
337
- export { formatDetailType, formatEventType, formatPropType, generateComponentWCDts, generateReactDts, generateVueDts, generateVueGlobalDts, generateWCDtsFiles, generateWCIndexDts, generateWCJsxDts };
341
+ //#region packages/web-c/component-dts/src/generateLoaderDts.ts
342
+ function generateLoaderDts(manifest) {
343
+ const lines = [];
344
+ lines.push("/* eslint-disable */");
345
+ lines.push("// Generated by @zeus-js/component-dts.");
346
+ lines.push("");
347
+ for (const component of manifest.components) {
348
+ lines.push(generateElementInterface(component));
349
+ lines.push("");
350
+ }
351
+ lines.push("export declare function defineCustomElements(): void");
352
+ lines.push("");
353
+ lines.push("export declare const defineLazyElements: typeof defineCustomElements");
354
+ lines.push("");
355
+ lines.push("declare global {");
356
+ lines.push(" interface HTMLElementTagNameMap {");
357
+ for (const component of manifest.components) lines.push(` ${JSON.stringify(component.tag)}: ${getElementTypeName(component)}`);
358
+ lines.push(" }");
359
+ lines.push("}");
360
+ lines.push("");
361
+ lines.push("export {}");
362
+ lines.push("");
363
+ return lines.join("\n");
364
+ }
365
+ function generateElementInterface(component) {
366
+ const elementTypeName = getElementTypeName(component);
367
+ const lines = [];
368
+ lines.push(`export interface ${elementTypeName} extends HTMLElement {`);
369
+ for (const [name, prop] of Object.entries(component.props)) {
370
+ const optional = isRequiredProp(prop) ? "" : "?";
371
+ lines.push(` ${safePropertyName(name)}${optional}: ${formatPropType(prop)}`);
372
+ }
373
+ lines.push(" componentOnReady(): Promise<this>");
374
+ lines.push("}");
375
+ return lines.join("\n");
376
+ }
377
+ //#endregion
378
+ export { formatDetailType, formatEventType, formatPropType, generateComponentWCDts, generateLoaderDts, generateReactDts, generateVueDts, generateVueGlobalDts, generateWCDtsFiles, generateWCIndexDts, generateWCJsxDts };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@zeus-js/component-dts",
3
- "version": "0.1.0-beta.1",
3
+ "version": "0.1.0-beta.3",
4
4
  "description": "DTS generators for Zeus component manifest",
5
5
  "type": "module",
6
6
  "main": "index.js",
@@ -13,14 +13,14 @@
13
13
  "exports": {
14
14
  ".": {
15
15
  "types": "./dist/component-dts.d.ts",
16
+ "module": "./dist/component-dts.esm-bundler.js",
17
+ "import": "./dist/component-dts.esm-bundler.js",
18
+ "require": "./index.js",
16
19
  "node": {
17
20
  "production": "./dist/component-dts.cjs.prod.js",
18
21
  "development": "./dist/component-dts.cjs.js",
19
22
  "default": "./index.js"
20
- },
21
- "module": "./dist/component-dts.esm-bundler.js",
22
- "import": "./dist/component-dts.esm-bundler.js",
23
- "require": "./index.js"
23
+ }
24
24
  }
25
25
  },
26
26
  "sideEffects": false,
@@ -36,7 +36,7 @@
36
36
  ]
37
37
  },
38
38
  "dependencies": {
39
- "@zeus-js/component-analyzer": "0.1.0-beta.1"
39
+ "@zeus-js/component-analyzer": "0.1.0-beta.3"
40
40
  },
41
41
  "keywords": [
42
42
  "zeus",