@sprlab/wccompiler 0.8.7 → 0.8.8
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/integrations/vue.js +30 -0
- package/lib/codegen.js +5 -0
- package/package.json +1 -1
package/integrations/vue.js
CHANGED
|
@@ -90,6 +90,36 @@ export function wccVuePlugin(options = {}) {
|
|
|
90
90
|
)
|
|
91
91
|
}
|
|
92
92
|
|
|
93
|
+
// ── Slot transforms ──
|
|
94
|
+
// Transform <template #name>content</template> inside custom elements
|
|
95
|
+
// → <div slot="name">content</div>
|
|
96
|
+
// This prevents Vue from intercepting the slot syntax and erroring.
|
|
97
|
+
// The WCC component's runtime slot parser detects slot="name" on regular elements.
|
|
98
|
+
|
|
99
|
+
// Handle <template #name>...</template> (shorthand)
|
|
100
|
+
prev = ''
|
|
101
|
+
while (prev !== result) {
|
|
102
|
+
prev = result
|
|
103
|
+
result = result.replace(
|
|
104
|
+
/<template\s+#(\w+)>([\s\S]*?)<\/template>/,
|
|
105
|
+
(match, slotName, content) => {
|
|
106
|
+
return `<div slot="${slotName}">${content}</div>`
|
|
107
|
+
}
|
|
108
|
+
)
|
|
109
|
+
}
|
|
110
|
+
|
|
111
|
+
// Handle <template v-slot:name>...</template> (verbose)
|
|
112
|
+
prev = ''
|
|
113
|
+
while (prev !== result) {
|
|
114
|
+
prev = result
|
|
115
|
+
result = result.replace(
|
|
116
|
+
/<template\s+v-slot:(\w+)>([\s\S]*?)<\/template>/,
|
|
117
|
+
(match, slotName, content) => {
|
|
118
|
+
return `<div slot="${slotName}">${content}</div>`
|
|
119
|
+
}
|
|
120
|
+
)
|
|
121
|
+
}
|
|
122
|
+
|
|
93
123
|
if (result !== code) return result
|
|
94
124
|
return null
|
|
95
125
|
}
|
package/lib/codegen.js
CHANGED
|
@@ -1039,6 +1039,11 @@ export function generateComponent(parseResult, options = {}) {
|
|
|
1039
1039
|
lines.push(' __slotMap[slotName] = { content: child.innerHTML, propsExpr: attr.value };');
|
|
1040
1040
|
lines.push(' }');
|
|
1041
1041
|
lines.push(' }');
|
|
1042
|
+
lines.push(" } else if (child.nodeType === 1 && child.getAttribute('slot')) {");
|
|
1043
|
+
// NEW: regular element with slot="name" (cross-framework support)
|
|
1044
|
+
lines.push(" const slotName = child.getAttribute('slot');");
|
|
1045
|
+
lines.push(" child.removeAttribute('slot');");
|
|
1046
|
+
lines.push(' __slotMap[slotName] = { content: child.outerHTML, propsExpr: \'\' };');
|
|
1042
1047
|
lines.push(" } else if (child.nodeType === 1 || (child.nodeType === 3 && child.textContent.trim())) {");
|
|
1043
1048
|
lines.push(' __defaultSlotNodes.push(child);');
|
|
1044
1049
|
lines.push(' }');
|
package/package.json
CHANGED