@qwik-custom-elements/adapter-stencil 1.0.2 → 1.0.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 (56) hide show
  1. package/README.md +2 -3
  2. package/dist/bundle-graph.json +1 -1
  3. package/dist/client/client-setup.d.ts +1 -1
  4. package/dist/client/index.qwik.mjs +178 -0
  5. package/dist/client/stencil-csr.d.ts +2 -2
  6. package/dist/index.qwik.mjs +224 -191
  7. package/dist/q-manifest.json +24 -336
  8. package/dist/qwikloader-BOWbeQFD.js +101 -0
  9. package/dist/ssr/index.qwik.mjs +346 -0
  10. package/dist/ssr/stencil-ssr.d.ts +40 -7
  11. package/dist/ssr/stencil-ssr.d.ts.map +1 -1
  12. package/dist/ssr/styles-core.d.ts +2 -2
  13. package/package.json +15 -14
  14. package/dist/client/client-setup.test.d.ts +0 -2
  15. package/dist/client/client-setup.test.d.ts.map +0 -1
  16. package/dist/client/index.cjs +0 -1
  17. package/dist/client/index.js +0 -6
  18. package/dist/client/stencil-csr-props.test.d.ts +0 -2
  19. package/dist/client/stencil-csr-props.test.d.ts.map +0 -1
  20. package/dist/client-setup-C_qW_ZSR.cjs +0 -1
  21. package/dist/client-setup-D-ffVtNL.js +0 -53
  22. package/dist/client-setup.ts_createStencilClientSetup_runSetup_6wDTmOSdSbc-CPKK-h2J.js +0 -11
  23. package/dist/client-setup.ts_createStencilClientSetup_runSetup_6wDTmOSdSbc-Dz0z3zer.cjs +0 -1
  24. package/dist/core.min-Qm7Mxv6F.js +0 -1846
  25. package/dist/core.min-vJ4M2jcU.cjs +0 -2
  26. package/dist/index.qwik.cjs +0 -8
  27. package/dist/index.test.d.ts +0 -2
  28. package/dist/index.test.d.ts.map +0 -1
  29. package/dist/preloader-Bietv0BS.js +0 -118
  30. package/dist/preloader-Cqc--uBU.cjs +0 -1
  31. package/dist/qwikloader-C01zMTOC.js +0 -102
  32. package/dist/qwikloader-vFGnpgvG.cjs +0 -2
  33. package/dist/ssr/element-props-utils.test.d.ts +0 -2
  34. package/dist/ssr/element-props-utils.test.d.ts.map +0 -1
  35. package/dist/ssr/index.cjs +0 -1
  36. package/dist/ssr/index.js +0 -29
  37. package/dist/ssr/styles-core.test.d.ts +0 -2
  38. package/dist/ssr/styles-core.test.d.ts.map +0 -1
  39. package/dist/stencil-csr-B1U9s3VQ.js +0 -24
  40. package/dist/stencil-csr-D6zt1Am9.cjs +0 -1
  41. package/dist/stencil-csr.tsx_createStencilCSRComponent_component_pD3ekIZcUT0-ChAZ0hL3.js +0 -37
  42. package/dist/stencil-csr.tsx_createStencilCSRComponent_component_pD3ekIZcUT0-cGN__hqm.cjs +0 -1
  43. package/dist/stencil-csr.tsx_createStencilCSRComponent_component_useVisibleTask_1_dqWPXf9eNnk-BYiBxXW-.js +0 -34
  44. package/dist/stencil-csr.tsx_createStencilCSRComponent_component_useVisibleTask_1_dqWPXf9eNnk-sFN0uMI_.cjs +0 -1
  45. package/dist/stencil-csr.tsx_createStencilCSRComponent_component_useVisibleTask_y00qkhhKua8-BSsN2V78.cjs +0 -1
  46. package/dist/stencil-csr.tsx_createStencilCSRComponent_component_useVisibleTask_y00qkhhKua8-CF00O7hf.js +0 -19
  47. package/dist/stencil-ssr-BHjT94rd.js +0 -118
  48. package/dist/stencil-ssr-UlYtcG0-.cjs +0 -1
  49. package/dist/stencil-ssr.tsx_createStencilSSRBridgeComponent_component_IlVdOHKZfN0-46y8eTjO.cjs +0 -1
  50. package/dist/stencil-ssr.tsx_createStencilSSRBridgeComponent_component_IlVdOHKZfN0-BfqXBofh.js +0 -42
  51. package/dist/stencil-ssr.tsx_createStencilSSRBridgeComponent_component_useOnDocument_bvALMlewx7Q-DA73DRke.cjs +0 -1
  52. package/dist/stencil-ssr.tsx_createStencilSSRBridgeComponent_component_useOnDocument_bvALMlewx7Q-DdcskN1z.js +0 -10
  53. package/dist/stencil-ssr.tsx_createStencilSSRBridgeComponent_component_useTask_1_aXg7AuatGTc-61dSP-JG.cjs +0 -1
  54. package/dist/stencil-ssr.tsx_createStencilSSRBridgeComponent_component_useTask_1_aXg7AuatGTc-Byrz3fUp.js +0 -34
  55. package/dist/stencil-ssr.tsx_createStencilSSRBridgeComponent_component_useTask_IH8I3eLdwI0-BtIygb8E.js +0 -12
  56. package/dist/stencil-ssr.tsx_createStencilSSRBridgeComponent_component_useTask_IH8I3eLdwI0-DNQBT8Vc.cjs +0 -1
@@ -1,160 +1,178 @@
1
- import { existsSync as N } from "node:fs";
2
- import _ from "node:path";
3
- const B = {
1
+ import { existsSync } from "node:fs";
2
+ import path from "node:path";
3
+ const metadata = {
4
4
  adapterId: "stencil",
5
5
  supportedSourceTypes: [
6
6
  "CEM",
7
7
  "PACKAGE_NAME"
8
8
  ],
9
- supportsSsrProbe: !0,
9
+ supportsSsrProbe: true,
10
10
  ssrRuntimeSubpath: "./ssr"
11
11
  };
12
- function z({ packageRoot: e }) {
13
- const t = _.join(e, "dist", "collection", "collection-manifest.json");
14
- return N(t) ? " This looks like a Stencil package. To fix this, ask the library author to add the `docs-custom-elements-manifest` output target to their `stencil.config.ts`: `{ type: 'docs-custom-elements-manifest', file: 'custom-elements.json' }`. Alternatively, set source.cemPath to the path of a manually generated CEM file." : null;
12
+ function buildMissingCemHint({ packageRoot }) {
13
+ const collectionManifestPath = path.join(packageRoot, "dist", "collection", "collection-manifest.json");
14
+ if (!existsSync(collectionManifestPath)) return null;
15
+ return " This looks like a Stencil package. To fix this, ask the library author to add the `docs-custom-elements-manifest` output target to their `stencil.config.ts`: `{ type: 'docs-custom-elements-manifest', file: 'custom-elements.json' }`. Alternatively, set source.cemPath to the path of a manually generated CEM file.";
15
16
  }
16
- function H({ source: e, adapterOptions: t }) {
17
- const n = S(t?.runtime) ? t.runtime : void 0, r = y(n, "loaderImport", "QCE_STENCIL_RUNTIME_LOADER_OVERRIDE_INVALID", `Stencil ${e.type} projects must provide a non-empty adapterOptions.runtime.loaderImport override when the override is set.`);
18
- if (y(n, "hydrateImport", "QCE_STENCIL_RUNTIME_HYDRATE_OVERRIDE_INVALID", `Stencil ${e.type} projects must provide a non-empty adapterOptions.runtime.hydrateImport override when the override is set.`), e.type === "CEM" && r == null)
19
- throw g("QCE_STENCIL_RUNTIME_LOADER_REQUIRED", "Stencil CEM projects must provide adapterOptions.runtime.loaderImport.");
17
+ function validateProject({ source, adapterOptions }) {
18
+ const runtime = isRecord(adapterOptions?.runtime) ? adapterOptions.runtime : void 0;
19
+ const loaderImport = validateOptionalRuntimeOverride(runtime, "loaderImport", "QCE_STENCIL_RUNTIME_LOADER_OVERRIDE_INVALID", `Stencil ${source.type} projects must provide a non-empty adapterOptions.runtime.loaderImport override when the override is set.`);
20
+ validateOptionalRuntimeOverride(runtime, "hydrateImport", "QCE_STENCIL_RUNTIME_HYDRATE_OVERRIDE_INVALID", `Stencil ${source.type} projects must provide a non-empty adapterOptions.runtime.hydrateImport override when the override is set.`);
21
+ if (source.type !== "CEM") return;
22
+ if (loaderImport == null) throw createValidationError("QCE_STENCIL_RUNTIME_LOADER_REQUIRED", "Stencil CEM projects must provide adapterOptions.runtime.loaderImport.");
20
23
  }
21
- function J({ projectId: e, runtimeResolution: t, source: n, adapterOptions: r }) {
22
- const o = S(r?.runtime) ? r.runtime : void 0, s = y(o, "loaderImport", "QCE_STENCIL_RUNTIME_LOADER_OVERRIDE_INVALID", `Stencil ${n.type} projects must provide a non-empty adapterOptions.runtime.loaderImport override when the override is set.`), a = y(o, "hydrateImport", "QCE_STENCIL_RUNTIME_HYDRATE_OVERRIDE_INVALID", `Stencil ${n.type} projects must provide a non-empty adapterOptions.runtime.hydrateImport override when the override is set.`);
23
- if (n.type === "CEM") {
24
- if (s == null) throw g("QCE_STENCIL_RUNTIME_LOADER_REQUIRED", "Stencil CEM projects must provide adapterOptions.runtime.loaderImport.");
24
+ function resolveRuntimeImports({ projectId, runtimeResolution, source, adapterOptions }) {
25
+ const runtime = isRecord(adapterOptions?.runtime) ? adapterOptions.runtime : void 0;
26
+ const loaderImport = validateOptionalRuntimeOverride(runtime, "loaderImport", "QCE_STENCIL_RUNTIME_LOADER_OVERRIDE_INVALID", `Stencil ${source.type} projects must provide a non-empty adapterOptions.runtime.loaderImport override when the override is set.`);
27
+ const hydrateImport = validateOptionalRuntimeOverride(runtime, "hydrateImport", "QCE_STENCIL_RUNTIME_HYDRATE_OVERRIDE_INVALID", `Stencil ${source.type} projects must provide a non-empty adapterOptions.runtime.hydrateImport override when the override is set.`);
28
+ if (source.type === "CEM") {
29
+ if (loaderImport == null) throw createValidationError("QCE_STENCIL_RUNTIME_LOADER_REQUIRED", "Stencil CEM projects must provide adapterOptions.runtime.loaderImport.");
25
30
  return {
26
- loaderImport: s,
27
- hydrateImport: a
31
+ loaderImport,
32
+ hydrateImport
28
33
  };
29
34
  }
30
- const c = M(n.packageName, t), l = Q({
31
- projectId: e,
32
- packageName: n.packageName,
33
- packageRoot: c,
34
- runtimeResolution: t,
35
- specifier: s ?? `${n.packageName}/loader`,
35
+ const packageRoot = resolvePackageRootForProject(source.packageName, runtimeResolution);
36
+ const resolvedLoaderImport = resolveRequiredPackageRuntimeImport({
37
+ projectId,
38
+ packageName: source.packageName,
39
+ packageRoot,
40
+ runtimeResolution,
41
+ specifier: loaderImport ?? `${source.packageName}/loader`,
36
42
  field: "loader"
37
- }), p = [], m = U({
38
- packageName: n.packageName,
39
- packageRoot: c,
40
- runtimeResolution: t,
41
- specifier: a ?? `${n.packageName}/hydrate`,
43
+ });
44
+ const observedErrorCodes = [];
45
+ const resolvedHydrateImport = resolveOptionalPackageRuntimeImport({
46
+ packageName: source.packageName,
47
+ packageRoot,
48
+ runtimeResolution,
49
+ specifier: hydrateImport ?? `${source.packageName}/hydrate`,
42
50
  field: "hydrate",
43
- observedErrorCodes: p
44
- }), d = {
45
- loaderImport: l
51
+ observedErrorCodes
52
+ });
53
+ const runtimeImports = {
54
+ loaderImport: resolvedLoaderImport
46
55
  };
47
- return m != null && (d.hydrateImport = m), p.length === 0 ? d : {
48
- runtimeImports: d,
49
- observedErrorCodes: p,
50
- clientOnlyMode: !0
56
+ if (resolvedHydrateImport != null) runtimeImports.hydrateImport = resolvedHydrateImport;
57
+ if (observedErrorCodes.length === 0) return runtimeImports;
58
+ return {
59
+ runtimeImports,
60
+ observedErrorCodes,
61
+ clientOnlyMode: true
51
62
  };
52
63
  }
53
- async function K({ runtimeImports: e } = {}) {
54
- if (!h(e?.loaderImport)) return {
55
- available: !1
64
+ async function probeSSR({ runtimeImports } = {}) {
65
+ if (!isNonEmptyString(runtimeImports?.loaderImport)) return {
66
+ available: false
56
67
  };
57
- if (!h(e?.hydrateImport)) return {
58
- available: !1
68
+ if (!isNonEmptyString(runtimeImports?.hydrateImport)) return {
69
+ available: false
59
70
  };
60
71
  try {
72
+ const hydrateRuntimeModule = await import(
73
+ /* @vite-ignore */
74
+ runtimeImports.hydrateImport
75
+ );
61
76
  return {
62
- available: typeof (await import(
63
- /* @vite-ignore */
64
- e.hydrateImport
65
- )).renderToString == "function"
77
+ available: typeof hydrateRuntimeModule.renderToString === "function"
66
78
  };
67
79
  } catch {
68
80
  return {
69
- available: !1
81
+ available: false
70
82
  };
71
83
  }
72
84
  }
73
- async function Z({ componentDefinitions: e, runtimeImports: t }) {
74
- if (!h(t?.hydrateImport)) return e;
75
- let n;
85
+ async function augmentComponentDefinitions({ componentDefinitions, runtimeImports }) {
86
+ if (!isNonEmptyString(runtimeImports?.hydrateImport)) return componentDefinitions;
87
+ let renderToString;
76
88
  try {
77
- const o = await import(
89
+ const mod = await import(
78
90
  /* @vite-ignore */
79
- t.hydrateImport
91
+ runtimeImports.hydrateImport
80
92
  );
81
- typeof o.renderToString == "function" && (n = o.renderToString);
93
+ if (typeof mod.renderToString === "function") renderToString = mod.renderToString;
82
94
  } catch {
83
95
  }
84
- if (n == null) return e;
85
- const r = [];
86
- for (const o of e) {
87
- const s = await w(n, o.tagName), a = new Set(o.slots.map((l) => l.name)), c = s.filter((l) => !a.has(l)).map((l) => ({
88
- name: l
96
+ if (renderToString == null) return componentDefinitions;
97
+ const augmented = [];
98
+ for (const def of componentDefinitions) {
99
+ const probedNames = await probeComponentNamedSlots(renderToString, def.tagName);
100
+ const existingNames = new Set(def.slots.map((s) => s.name));
101
+ const newSlots = probedNames.filter((name) => !existingNames.has(name)).map((name) => ({
102
+ name
89
103
  }));
90
- r.push({
91
- ...o,
104
+ augmented.push({
105
+ ...def,
92
106
  slots: [
93
- ...o.slots,
94
- ...c
107
+ ...def.slots,
108
+ ...newSlots
95
109
  ]
96
110
  });
97
111
  }
98
- return r;
112
+ return augmented;
99
113
  }
100
- async function w(e, t) {
114
+ async function probeComponentNamedSlots(renderToString, tagName) {
101
115
  try {
102
- const n = await e(`<${t}></${t}>`);
103
- return P(n.html ?? "");
116
+ const result = await renderToString(`<${tagName}></${tagName}>`);
117
+ return extractNamedSlotNames(result.html ?? "");
104
118
  } catch {
105
119
  return [];
106
120
  }
107
121
  }
108
- function P(e) {
109
- const t = /<!--s\.(?:\d+\.){4}(.*?)-->/g, n = [];
110
- for (const r of e.matchAll(t)) {
111
- const o = r[1];
112
- o.length > 0 && !n.includes(o) && n.push(o);
122
+ function extractNamedSlotNames(html) {
123
+ const re = /<!--s\.(?:\d+\.){4}(.*?)-->/g;
124
+ const names = [];
125
+ for (const match of html.matchAll(re)) {
126
+ const name = match[1];
127
+ if (name.length > 0 && !names.includes(name)) names.push(name);
113
128
  }
114
- return n;
129
+ return names;
115
130
  }
116
- function F({ projectId: e, libraryName: t, componentDefinitions: n, runtimeImports: r, ssrAvailable: o }) {
117
- const s = typeof r?.loaderImport == "string" && r.loaderImport.trim() !== "" ? r.loaderImport : void 0;
118
- if (s == null) return [];
119
- const a = typeof r?.hydrateImport == "string" && r.hydrateImport.trim() !== "" ? r.hydrateImport : void 0, c = a != null, l = (n ?? []).map((m) => m.tagName), p = [
131
+ function createGeneratedOutput({ projectId, libraryName, componentDefinitions, runtimeImports, ssrAvailable: _ssrAvailable }) {
132
+ const loaderImport = typeof runtimeImports?.loaderImport === "string" && runtimeImports.loaderImport.trim() !== "" ? runtimeImports.loaderImport : void 0;
133
+ if (loaderImport == null) return [];
134
+ const hydrateImport = typeof runtimeImports?.hydrateImport === "string" && runtimeImports.hydrateImport.trim() !== "" ? runtimeImports.hydrateImport : void 0;
135
+ const hasHydrateRuntime = hydrateImport != null;
136
+ const componentTags = (componentDefinitions ?? []).map((componentDefinition) => componentDefinition.tagName);
137
+ const plannedWrites = [
120
138
  {
121
139
  relativePath: "index.ts",
122
- content: L(e, l)
140
+ content: renderGeneratedIndex(projectId, componentTags)
123
141
  },
124
142
  {
125
143
  relativePath: "runtime.ts",
126
- content: A(e, c)
144
+ content: renderRuntimeBarrelModule(projectId, hasHydrateRuntime)
127
145
  },
128
146
  {
129
147
  relativePath: "runtime-csr.generated.ts",
130
- content: T(e, s, t)
148
+ content: renderClientRuntimeModule(projectId, loaderImport, libraryName)
131
149
  }
132
150
  ];
133
- a != null && p.push({
151
+ if (hydrateImport != null) plannedWrites.push({
134
152
  relativePath: "runtime-ssr.generated.ts",
135
- content: O(e, a, t)
153
+ content: renderServerRuntimeModule(projectId, hydrateImport, libraryName)
136
154
  });
137
- for (const m of n ?? []) p.push({
138
- relativePath: `${m.tagName}.tsx`,
139
- content: b(e, m, c, t)
155
+ for (const componentDefinition of componentDefinitions ?? []) plannedWrites.push({
156
+ relativePath: `${componentDefinition.tagName}.tsx`,
157
+ content: renderStencilComponentWrapper(projectId, componentDefinition, hasHydrateRuntime, libraryName)
140
158
  });
141
- return p;
159
+ return plannedWrites;
142
160
  }
143
- function S(e) {
144
- return typeof e == "object" && e !== null && !Array.isArray(e);
161
+ function isRecord(value) {
162
+ return typeof value === "object" && value !== null && !Array.isArray(value);
145
163
  }
146
- function h(e) {
147
- return typeof e == "string" && e.trim() !== "";
164
+ function isNonEmptyString(value) {
165
+ return typeof value === "string" && value.trim() !== "";
148
166
  }
149
- function T(e, t, n) {
150
- const r = f(n, "CSR", "GeneratedStencilCSRComponent");
167
+ function renderClientRuntimeModule(projectId, loaderImport, libraryName) {
168
+ const csrBridgeName = toBridgeComponentName(libraryName, "CSR", "GeneratedStencilCSRComponent");
151
169
  return [
152
- `// Generated by @qwik-custom-elements/core. Project: ${e ?? "unknown"}.`,
170
+ `// Generated by @qwik-custom-elements/core. Project: ${projectId ?? "unknown"}.`,
153
171
  "// Do not edit this file directly. Use a manual extension layer.",
154
172
  "",
155
173
  "import { $ } from '@builder.io/qwik';",
156
174
  "import { createStencilCSRComponent, createStencilClientSetup } from '@qwik-custom-elements/adapter-stencil/client';",
157
- `import { defineCustomElements as runtimeDefineCustomElements } from '${t}';`,
175
+ `import { defineCustomElements as runtimeDefineCustomElements } from '${loaderImport}';`,
158
176
  "",
159
177
  "export const defineCustomElements = async (): Promise<void> => {",
160
178
  " await Promise.resolve(runtimeDefineCustomElements());",
@@ -163,40 +181,38 @@ function T(e, t, n) {
163
181
  "export const defineCustomElementsQrl = $(defineCustomElements);",
164
182
  "export const useStencilClientSetup =",
165
183
  " createStencilClientSetup(defineCustomElementsQrl);",
166
- `export const ${r} = createStencilCSRComponent();`,
184
+ `export const ${csrBridgeName} = createStencilCSRComponent();`,
167
185
  ""
168
- ].join(`
169
- `);
186
+ ].join("\n");
170
187
  }
171
- function L(e, t) {
172
- const n = t.map((r) => `export { ${E(r)} } from './${r}';`);
188
+ function renderGeneratedIndex(projectId, componentTags) {
189
+ const exportLines = componentTags.map((componentTag) => `export { ${toWrapperName(componentTag)} } from './${componentTag}';`);
173
190
  return [
174
- `// Generated by @qwik-custom-elements/core. Project: ${e ?? "unknown"}.`,
191
+ `// Generated by @qwik-custom-elements/core. Project: ${projectId ?? "unknown"}.`,
175
192
  "// Do not edit this file directly. Use a manual extension layer.",
176
193
  "",
177
- `export const generatedComponentTags = ${JSON.stringify(t)} as const;`,
178
- ...n,
194
+ `export const generatedComponentTags = ${JSON.stringify(componentTags)} as const;`,
195
+ ...exportLines,
179
196
  ""
180
- ].join(`
181
- `);
197
+ ].join("\n");
182
198
  }
183
- function A(e, t) {
184
- const n = [
199
+ function renderRuntimeBarrelModule(projectId, hasHydrateRuntime) {
200
+ const exportLines = [
185
201
  "export * from './runtime-csr.generated';"
186
202
  ];
187
- return t && n.push("export * from './runtime-ssr.generated';"), [
188
- `// Generated by @qwik-custom-elements/core. Project: ${e ?? "unknown"}.`,
203
+ if (hasHydrateRuntime) exportLines.push("export * from './runtime-ssr.generated';");
204
+ return [
205
+ `// Generated by @qwik-custom-elements/core. Project: ${projectId ?? "unknown"}.`,
189
206
  "// Do not edit this file directly. Use a manual extension layer.",
190
207
  "",
191
- ...n,
208
+ ...exportLines,
192
209
  ""
193
- ].join(`
194
- `);
210
+ ].join("\n");
195
211
  }
196
- function O(e, t, n) {
197
- const r = f(n, "SSR", "GeneratedStencilComponent");
212
+ function renderServerRuntimeModule(projectId, hydrateImport, libraryName) {
213
+ const ssrBridgeName = toBridgeComponentName(libraryName, "SSR", "GeneratedStencilComponent");
198
214
  return [
199
- `// Generated by @qwik-custom-elements/core. Project: ${e ?? "unknown"}.`,
215
+ `// Generated by @qwik-custom-elements/core. Project: ${projectId ?? "unknown"}.`,
200
216
  "// Do not edit this file directly. Use a manual extension layer.",
201
217
  "",
202
218
  "import { $ } from '@builder.io/qwik';",
@@ -205,40 +221,50 @@ function O(e, t, n) {
205
221
  " type StencilRenderToString,",
206
222
  "} from '@qwik-custom-elements/adapter-stencil/ssr';",
207
223
  "",
208
- `const hydrateModuleId = '${t}';`,
224
+ `const hydrateRuntimeImport = ${JSON.stringify(hydrateImport.split("/"))}.join('/');`,
209
225
  "",
210
226
  "export const renderToString: StencilRenderToString = async (input, options) => {",
211
227
  " const { renderToString: runtimeRenderToString } = await import(",
212
- " // Variable indirection + @vite-ignore: prevents Vite from bundling the Node.js-only hydrate module into the client bundle.",
213
- " /* @vite-ignore */ hydrateModuleId",
228
+ " /* @vite-ignore */",
229
+ " hydrateRuntimeImport",
214
230
  " );",
215
231
  " return runtimeRenderToString(input, options);",
216
232
  "};",
217
233
  "",
218
234
  "export const generatedStencilRenderToStringQrl = $(renderToString);",
219
- `export const ${r} = createStencilSSRBridgeComponent(`,
235
+ "",
236
+ `export const ${ssrBridgeName} = createStencilSSRBridgeComponent(`,
220
237
  " generatedStencilRenderToStringQrl,",
221
238
  ");",
222
239
  ""
223
- ].join(`
224
- `);
240
+ ].join("\n");
225
241
  }
226
- function b(e, t, n, r) {
227
- const o = E(t.tagName), s = `${o}Props`, a = n ? f(r, "SSR", "GeneratedStencilComponent") : f(r, "CSR", "GeneratedStencilCSRComponent"), c = [
242
+ function renderStencilComponentWrapper(projectId, componentDefinition, ssrAvailable, libraryName) {
243
+ const wrapperName = toWrapperName(componentDefinition.tagName);
244
+ const propsTypeName = `${wrapperName}Props`;
245
+ const generatedStencilComponentName = ssrAvailable ? toBridgeComponentName(libraryName, "SSR", "GeneratedStencilComponent") : toBridgeComponentName(libraryName, "CSR", "GeneratedStencilCSRComponent");
246
+ const slotLines = [
228
247
  " <Slot />",
229
- ...t.slots.map((i) => ` <span q:slot=${JSON.stringify(i.name)} style={{ display: 'contents' }}>
230
- <Slot name=${JSON.stringify(i.name)} />
248
+ ...componentDefinition.slots.map((slot) => ` <span q:slot=${JSON.stringify(slot.name)} style={{ display: 'contents' }}>
249
+ <Slot name=${JSON.stringify(slot.name)} />
231
250
  </span>`)
232
- ], l = t.slots.length > 0 ? JSON.stringify(t.slots.map((i) => i.name)) : "undefined", p = t.props.map((i) => {
233
- const I = x(i.name) ? i.name : `'${i.name}'`, k = i.required ? "" : "?";
234
- return ` ${I}${k}: ${i.type};`;
235
- }), m = t.events.map((i) => ` ${u(i.name)}?: QRL<(event: ${i.type}) => void>;`);
236
- p.push(...m, " [key: string]: unknown;");
237
- const d = [
251
+ ];
252
+ const slotListToken = componentDefinition.slots.length > 0 ? JSON.stringify(componentDefinition.slots.map((slot) => slot.name)) : "undefined";
253
+ const propLines = componentDefinition.props.map((prop) => {
254
+ const key = isValidIdentifier(prop.name) ? prop.name : `'${prop.name}'`;
255
+ const optionalToken = prop.required ? "" : "?";
256
+ return ` ${key}${optionalToken}: ${prop.type};`;
257
+ });
258
+ const eventPropLines = componentDefinition.events.map((event) => {
259
+ return ` ${toEventPropName(event.name)}?: QRL<(event: ${event.type}) => void>;`;
260
+ });
261
+ propLines.push(...eventPropLines, " [key: string]: unknown;");
262
+ const importLines = [
238
263
  "import { Slot, component$ } from '@builder.io/qwik';"
239
264
  ];
240
- t.events.length > 0 && d.push("import type { QRL } from '@builder.io/qwik';"), d.push(`import { ${a} } from './runtime';`);
241
- const R = [
265
+ if (componentDefinition.events.length > 0) importLines.push("import type { QRL } from '@builder.io/qwik';");
266
+ importLines.push(`import { ${generatedStencilComponentName} } from './runtime';`);
267
+ const splitPropsLines = [
242
268
  " const isEventBindingKey = (key: string) =>",
243
269
  " /^on[A-Z].*\\$$/.test(key) || key.includes(':');",
244
270
  " const eventProps: Record<string, unknown> = {};",
@@ -256,9 +282,10 @@ function b(e, t, n, r) {
256
282
  "",
257
283
  " elementProps[key] = value;",
258
284
  " }"
259
- ], $ = t.events.length > 0 ? [
285
+ ];
286
+ const mappedEventLines = componentDefinition.events.length > 0 ? [
260
287
  "",
261
- ` const mappedEventPropKeys = new Set(${JSON.stringify(t.events.map((i) => u(i.name)))});`,
288
+ ` const mappedEventPropKeys = new Set(${JSON.stringify(componentDefinition.events.map((event) => toEventPropName(event.name)))});`,
262
289
  " const passthroughEventProps = Object.fromEntries(",
263
290
  " Object.entries(eventProps).filter(",
264
291
  " ([key]) => !mappedEventPropKeys.has(key),",
@@ -266,106 +293,112 @@ function b(e, t, n, r) {
266
293
  " );",
267
294
  "",
268
295
  " const events: Record<string, QRL<(...args: any[]) => void>> = {};",
269
- ...t.events.map((i) => ` if (props.${u(i.name)}) { events['${i.name}'] = props.${u(i.name)}; }`),
296
+ ...componentDefinition.events.map((event) => ` if (props.${toEventPropName(event.name)}) { events['${event.name}'] = props.${toEventPropName(event.name)}; }`),
270
297
  " const mappedEvents = Object.keys(events).length > 0 ? events : undefined;"
271
298
  ] : [
272
299
  "",
273
300
  " const passthroughEventProps = eventProps;",
274
301
  " const mappedEvents = undefined;"
275
- ], C = [
276
- ...R,
277
- ...$,
302
+ ];
303
+ const bodyLines = [
304
+ ...splitPropsLines,
305
+ ...mappedEventLines,
278
306
  "",
279
307
  " return (",
280
- ` <${a}`,
281
- ` tagName=${JSON.stringify(t.tagName)}`,
308
+ ` <${generatedStencilComponentName}`,
309
+ ` tagName=${JSON.stringify(componentDefinition.tagName)}`,
282
310
  " props={elementProps}",
283
311
  " events={mappedEvents}",
284
- ` slots={${l}}`,
312
+ ` slots={${slotListToken}}`,
285
313
  " {...passthroughEventProps}",
286
314
  " >",
287
- ...c,
288
- ` </${a}>`,
315
+ ...slotLines,
316
+ ` </${generatedStencilComponentName}>`,
289
317
  " );"
290
318
  ];
291
319
  return [
292
- `// Generated by @qwik-custom-elements/core. Project: ${e ?? "unknown"}.`,
320
+ `// Generated by @qwik-custom-elements/core. Project: ${projectId ?? "unknown"}.`,
293
321
  "// Do not edit this file directly. Use a manual extension layer.",
294
322
  "",
295
- ...d,
323
+ ...importLines,
296
324
  "",
297
- `export interface ${s} {`,
298
- ...p,
325
+ `export interface ${propsTypeName} {`,
326
+ ...propLines,
299
327
  "}",
300
328
  "",
301
- `export const ${o} = component$<${s}>((props) => {`,
302
- ...C,
329
+ `export const ${wrapperName} = component$<${propsTypeName}>((props) => {`,
330
+ ...bodyLines,
303
331
  "});",
304
332
  ""
305
- ].join(`
306
- `);
333
+ ].join("\n");
307
334
  }
308
- function E(e) {
309
- return `Qwik${e.split("-").filter((r) => r.length > 0).map((r) => `${r.charAt(0).toUpperCase()}${r.slice(1)}`).join("")}`;
335
+ function toWrapperName(componentTag) {
336
+ const parts = componentTag.split("-").filter((part) => part.length > 0);
337
+ const normalizedName = parts.map((part) => `${part.charAt(0).toUpperCase()}${part.slice(1)}`).join("");
338
+ return `Qwik${normalizedName}`;
310
339
  }
311
- function j(e) {
312
- return e.split(/[-_]/).filter((t) => t.length > 0).map((t) => `${t.charAt(0).toUpperCase()}${t.slice(1)}`).join("");
340
+ function toPascalCase(name) {
341
+ return name.split(/[-_]/).filter((p) => p.length > 0).map((part) => `${part.charAt(0).toUpperCase()}${part.slice(1)}`).join("");
313
342
  }
314
- function f(e, t, n) {
315
- return !e || e.trim().length === 0 ? n : `${j(e)}${t}BridgeComponent`;
343
+ function toBridgeComponentName(libraryName, mode, fallback) {
344
+ if (!libraryName || libraryName.trim().length === 0) return fallback;
345
+ return `${toPascalCase(libraryName)}${mode}BridgeComponent`;
316
346
  }
317
- function x(e) {
318
- return /^[A-Za-z_$][A-Za-z0-9_$]*$/.test(e);
347
+ function isValidIdentifier(name) {
348
+ return /^[A-Za-z_$][A-Za-z0-9_$]*$/.test(name);
319
349
  }
320
- function u(e) {
321
- return `on${e.split(/[^A-Za-z0-9]+/).filter((n) => n.length > 0).map((n) => `${n.charAt(0).toUpperCase()}${n.slice(1)}`).join("")}$`;
350
+ function toEventPropName(eventName) {
351
+ const normalizedName = eventName.split(/[^A-Za-z0-9]+/).filter((part) => part.length > 0).map((part) => `${part.charAt(0).toUpperCase()}${part.slice(1)}`).join("");
352
+ return `on${normalizedName}$`;
322
353
  }
323
- function M(e, t) {
324
- return t?.resolveSourcePackageRoot?.(e ?? "");
354
+ function resolvePackageRootForProject(packageName, runtimeResolution) {
355
+ return runtimeResolution?.resolveSourcePackageRoot?.(packageName ?? "");
325
356
  }
326
- function Q(e) {
327
- const { projectId: t, packageName: n, packageRoot: r, runtimeResolution: o, specifier: s, field: a } = e;
357
+ function resolveRequiredPackageRuntimeImport(params) {
358
+ const { projectId, packageName, packageRoot, runtimeResolution, specifier, field } = params;
328
359
  try {
329
- return o?.resolveImportSpecifier?.(s, r), s;
330
- } catch (c) {
331
- throw g(v(a), D(t, `Could not resolve Stencil ${a} runtime import "${s}" for source package "${n}": ${q(c)}`));
360
+ runtimeResolution?.resolveImportSpecifier?.(specifier, packageRoot);
361
+ return specifier;
362
+ } catch (error) {
363
+ throw createValidationError(getRuntimeResolutionErrorCode(field), createProjectAwareMessage(projectId, `Could not resolve Stencil ${field} runtime import "${specifier}" for source package "${packageName}": ${toErrorMessage(error)}`));
332
364
  }
333
365
  }
334
- function U(e) {
335
- const { packageRoot: t, runtimeResolution: n, specifier: r, field: o, observedErrorCodes: s } = e;
366
+ function resolveOptionalPackageRuntimeImport(params) {
367
+ const { packageRoot, runtimeResolution, specifier, field, observedErrorCodes } = params;
336
368
  try {
337
- return n?.resolveImportSpecifier?.(r, t), r;
369
+ runtimeResolution?.resolveImportSpecifier?.(specifier, packageRoot);
370
+ return specifier;
338
371
  } catch {
339
- s.push(v(o));
340
- return;
372
+ observedErrorCodes.push(getRuntimeResolutionErrorCode(field));
373
+ return void 0;
341
374
  }
342
375
  }
343
- function v(e) {
344
- return e === "loader" ? "QCE_STENCIL_RUNTIME_LOADER_RESOLVE_FAILED" : "QCE_STENCIL_RUNTIME_HYDRATE_RESOLVE_FAILED";
376
+ function getRuntimeResolutionErrorCode(field) {
377
+ return field === "loader" ? "QCE_STENCIL_RUNTIME_LOADER_RESOLVE_FAILED" : "QCE_STENCIL_RUNTIME_HYDRATE_RESOLVE_FAILED";
345
378
  }
346
- function D(e, t) {
347
- return e == null ? t : `Project "${e}": ${t}`;
379
+ function createProjectAwareMessage(projectId, message) {
380
+ return projectId == null ? message : `Project "${projectId}": ${message}`;
348
381
  }
349
- function q(e) {
350
- return e instanceof Error ? e.message : String(e);
382
+ function toErrorMessage(error) {
383
+ return error instanceof Error ? error.message : String(error);
351
384
  }
352
- function y(e, t, n, r) {
353
- if (e == null || !(t in e)) return;
354
- const o = e[t];
355
- if (typeof o == "string" && o.trim() !== "") return o;
356
- throw g(n, r);
385
+ function validateOptionalRuntimeOverride(runtime, field, code, message) {
386
+ if (runtime == null || !(field in runtime)) return void 0;
387
+ const value = runtime[field];
388
+ if (typeof value === "string" && value.trim() !== "") return value;
389
+ throw createValidationError(code, message);
357
390
  }
358
- function g(e, t) {
359
- return Object.assign(new Error(t), {
360
- code: e
391
+ function createValidationError(code, message) {
392
+ return Object.assign(new Error(message), {
393
+ code
361
394
  });
362
395
  }
363
396
  export {
364
- Z as augmentComponentDefinitions,
365
- z as buildMissingCemHint,
366
- F as createGeneratedOutput,
367
- B as metadata,
368
- K as probeSSR,
369
- J as resolveRuntimeImports,
370
- H as validateProject
397
+ augmentComponentDefinitions,
398
+ buildMissingCemHint,
399
+ createGeneratedOutput,
400
+ metadata,
401
+ probeSSR,
402
+ resolveRuntimeImports,
403
+ validateProject
371
404
  };