@sprlab/wccompiler 0.8.3 → 0.8.5

package/adapters/vue.js

@@ -32,15 +32,21 @@
 // This enables Vue's native v-model on WCC custom elements.
 // Vue v-model on custom elements listens for `update:modelValue` by default.
 // The nodeTransform in wccVuePlugin makes v-model:propName listen for `update:propName`.
+//
+// IMPORTANT: We listen in CAPTURE phase so the update:propName event is dispatched
+// BEFORE Vue's own bubble-phase listeners process the element. This ensures Vue
+// picks up the translated event synchronously.
 
 if (typeof document !== 'undefined') {
   document.addEventListener('wcc:model', (e) => {
     const { prop, value } = e.detail;
+    // Dispatch update:propName synchronously on the target element.
+    // bubbles:false because Vue listens directly on the element via addEventListener.
     e.target.dispatchEvent(new CustomEvent(`update:${prop}`, {
       detail: value,
-      bubbles: true
+      bubbles: false
     }));
-  });
+  }, true); // ← capture phase
 }
 
 // ── Vue directive: v-wcc-model ──────────────────────────────────────

package/integrations/vue.js

@@ -60,13 +60,13 @@ function wccVModelTransform(node, context) {
   let modified = false;
 
   for (const prop of node.props) {
-    // Check if this is a v-model directive with an argument
+    // Check if this is a v-model directive (with or without argument)
     if (
       prop.type === 7 && // DIRECTIVE
-      prop.name === 'model' &&
-      prop.arg // has argument (v-model:name)
+      prop.name === 'model'
     ) {
-      const propName = prop.arg.content;
+      // Determine prop name: explicit arg or default 'modelValue'
+      const propName = prop.arg ? prop.arg.content : 'modelValue';
       const expr = prop.exp;
 
       if (!expr) {
@@ -74,12 +74,21 @@ function wccVModelTransform(node, context) {
         continue;
       }
 
+      // Create the arg node (use existing or create for modelValue)
+      const argNode = prop.arg || {
+        type: 4, // SIMPLE_EXPRESSION
+        content: 'modelValue',
+        isStatic: true,
+        constType: 3,
+        loc: prop.loc
+      };
+
       // Replace v-model:propName="expr" with:
       // :propName="expr" (bind directive)
       newProps.push({
         type: 7, // DIRECTIVE
         name: 'bind',
-        arg: prop.arg,
+        arg: argNode,
         exp: expr,
         modifiers: [],
         loc: prop.loc
@@ -98,7 +107,7 @@ function wccVModelTransform(node, context) {
         },
         exp: {
           type: 4, // SIMPLE_EXPRESSION
-          content: `$event => { ${expr.content} = $event }`,
+          content: `$event => { ${expr.content} = $event.detail ?? $event }`,
           isStatic: false,
           constType: 0,
           loc: prop.loc

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sprlab/wccompiler",
-  "version": "0.8.3",
+  "version": "0.8.5",
   "description": "Zero-runtime compiler that transforms .wcc single-file components into native web components with signals-based reactivity",
   "type": "module",
   "exports": {