lwc-convert 1.0.0 → 1.0.1

package/dist/transformers/vf-to-lwc/data-binding.js

@@ -123,25 +123,25 @@ function convertGlobalVariable(expression, lmsBinding) {
         const nameMatch = expr.match(/\$CurrentPage\.Name/i);
         if (paramMatch) {
             const paramName = paramMatch[1];
-            code = `// Access URL parameter: ${paramName}
-@wire(CurrentPageReference)
-pageRef;
-
-get ${paramName}() {
-    return this.pageRef?.state?.${paramName};
+            code = `// Access URL parameter: ${paramName}
+@wire(CurrentPageReference)
+pageRef;
+
+get ${paramName}() {
+    return this.pageRef?.state?.${paramName};
 }`;
         }
         else if (nameMatch) {
-            code = `// Access current page name
-@wire(CurrentPageReference)
-pageRef;
-
-get pageName() {
-    return this.pageRef?.attributes?.name || this.pageRef?.state?.c__pageName || '';
+            code = `// Access current page name
+@wire(CurrentPageReference)
+pageRef;
+
+get pageName() {
+    return this.pageRef?.attributes?.name || this.pageRef?.state?.c__pageName || '';
 }`;
         }
         else {
-            code = `@wire(CurrentPageReference)
+            code = `@wire(CurrentPageReference)
 pageRef;`;
         }
     }
@@ -156,65 +156,65 @@ pageRef;`;
         // Generate handleMessage body based on LMS binding analysis
         let handleMessageBody;
         if (lmsBinding) {
-            handleMessageBody = `// Auto-detected from VF: calls ${lmsBinding.actionFunctionName} with message.${lmsBinding.messageProperty}
-    if (message.${lmsBinding.messageProperty}) {
-        this.${lmsBinding.actionFunctionName}(message.${lmsBinding.messageProperty})
-            .then(result => {
-                // Update component state with result
-                // Example: this.contactRecord = result;
-            })
-            .catch(error => {
-                this.handleError(error);
-            });
+            handleMessageBody = `// Auto-detected from VF: calls ${lmsBinding.actionFunctionName} with message.${lmsBinding.messageProperty}
+    if (message.${lmsBinding.messageProperty}) {
+        this.${lmsBinding.actionFunctionName}(message.${lmsBinding.messageProperty})
+            .then(result => {
+                // Update component state with result
+                // Example: this.contactRecord = result;
+            })
+            .catch(error => {
+                this.handleError(error);
+            });
     }`;
             warnings.push(`LMS handleMessage auto-wired to ${lmsBinding.actionFunctionName}(message.${lmsBinding.messageProperty})`);
         }
         else {
-            handleMessageBody = `// TODO: Handle message payload
+            handleMessageBody = `// TODO: Handle message payload
     // Example: this.recordId = message.recordId;`;
         }
-        code = `// Lightning Message Service: ${channelName}
-@wire(MessageContext)
-messageContext;
-
-// Subscription reference for cleanup
-_subscription = null;
-
-// Lifecycle: Subscribe to message channel
-connectedCallback() {
-    this.subscribeToMessageChannel();
-}
-
-// Lifecycle: Cleanup subscription
-disconnectedCallback() {
-    this.unsubscribeFromMessageChannel();
-}
-
-// Subscribe to messages
-subscribeToMessageChannel() {
-    if (!this._subscription) {
-        this._subscription = subscribe(
-            this.messageContext,
-            ${channelVar},
-            (message) => this.handleMessage(message)
-        );
-    }
-}
-
-// Unsubscribe from messages
-unsubscribeFromMessageChannel() {
-    unsubscribe(this._subscription);
-    this._subscription = null;
-}
-
-// Handle incoming messages
-handleMessage(message) {
-    ${handleMessageBody}
-}
-
-// Publish a message
-publishMessage(payload) {
-    publish(this.messageContext, ${channelVar}, payload);
+        code = `// Lightning Message Service: ${channelName}
+@wire(MessageContext)
+messageContext;
+
+// Subscription reference for cleanup
+_subscription = null;
+
+// Lifecycle: Subscribe to message channel
+connectedCallback() {
+    this.subscribeToMessageChannel();
+}
+
+// Lifecycle: Cleanup subscription
+disconnectedCallback() {
+    this.unsubscribeFromMessageChannel();
+}
+
+// Subscribe to messages
+subscribeToMessageChannel() {
+    if (!this._subscription) {
+        this._subscription = subscribe(
+            this.messageContext,
+            ${channelVar},
+            (message) => this.handleMessage(message)
+        );
+    }
+}
+
+// Unsubscribe from messages
+unsubscribeFromMessageChannel() {
+    unsubscribe(this._subscription);
+    this._subscription = null;
+}
+
+// Handle incoming messages
+handleMessage(message) {
+    ${handleMessageBody}
+}
+
+// Publish a message
+publishMessage(payload) {
+    publish(this.messageContext, ${channelVar}, payload);
 }`;
         warnings.push(`Lightning Message Service detected: ${channelName} - connectedCallback/disconnectedCallback auto-generated`);
     }
@@ -226,19 +226,19 @@ publishMessage(payload) {
             const field = fieldMatch[1];
             if (field === 'Id') {
                 imports.push("import userId from '@salesforce/user/Id';");
-                code = `// Current user ID
+                code = `// Current user ID
 userId = userId;`;
             }
             else {
                 imports.push("import { getRecord } from 'lightning/uiRecordApi';");
                 imports.push("import userId from '@salesforce/user/Id';");
                 imports.push(`import USER_${field.toUpperCase()}_FIELD from '@salesforce/schema/User.${field}';`);
-                code = `// Current user ${field}
-@wire(getRecord, { recordId: userId, fields: [USER_${field.toUpperCase()}_FIELD] })
-user;
-
-get user${field}() {
-    return this.user?.data?.fields?.${field}?.value;
+                code = `// Current user ${field}
+@wire(getRecord, { recordId: userId, fields: [USER_${field.toUpperCase()}_FIELD] })
+user;
+
+get user${field}() {
+    return this.user?.data?.fields?.${field}?.value;
 }`;
                 pattern = 'wire';
             }
@@ -251,9 +251,9 @@ get user${field}() {
         if (labelMatch) {
             const [, namespace, labelName] = labelMatch;
             imports.push(`import ${labelName} from '@salesforce/label/${namespace}.${labelName}';`);
-            code = `// Label: ${namespace}.${labelName}
-label = {
-    ${labelName}
+            code = `// Label: ${namespace}.${labelName}
+label = {
+    ${labelName}
 };`;
         }
     }
@@ -264,7 +264,7 @@ label = {
         if (resourceMatch) {
             const resourceName = resourceMatch[1];
             imports.push(`import ${resourceName} from '@salesforce/resourceUrl/${resourceName}';`);
-            code = `// Static resource: ${resourceName}
+            code = `// Static resource: ${resourceName}
 ${resourceName}Url = ${resourceName};`;
         }
     }
@@ -273,10 +273,10 @@ ${resourceName}Url = ${resourceName};`;
         pattern = 'imperative';
         warnings.push('$Action expressions need NavigationMixin for navigation');
         imports.push("import { NavigationMixin } from 'lightning/navigation';");
-        code = `// Navigation action - use NavigationMixin
-// Example: this[NavigationMixin.Navigate]({
-//     type: 'standard__recordPage',
-//     attributes: { recordId: id, actionName: 'view' }
+        code = `// Navigation action - use NavigationMixin
+// Example: this[NavigationMixin.Navigate]({
+//     type: 'standard__recordPage',
+//     attributes: { recordId: id, actionName: 'view' }
 // });`;
     }
     // $ObjectType
@@ -286,7 +286,7 @@ ${resourceName}Url = ${resourceName};`;
         if (objectMatch) {
             const [, objectName, fieldName] = objectMatch;
             imports.push(`import ${fieldName.toUpperCase()}_FIELD from '@salesforce/schema/${objectName}.${fieldName}';`);
-            code = `// Field reference: ${objectName}.${fieldName}
+            code = `// Field reference: ${objectName}.${fieldName}
 // Use in wire adapter or getFieldValue`;
         }
     }
@@ -311,28 +311,28 @@ function convertControllerProperty(property, controllerName) {
     let code = '';
     if (isWireCandidate) {
         // Use wire adapter
-        code = `// Property: ${property.name} (from ${controllerName})
-// Option 1: Wire to Apex getter
-@wire(get${capitalize(property.name)})
-${property.name};
-
-// Option 2: Simple reactive property
-${property.name};
-
-// If using wire, add this to imports:
+        code = `// Property: ${property.name} (from ${controllerName})
+// Option 1: Wire to Apex getter
+@wire(get${capitalize(property.name)})
+${property.name};
+
+// Option 2: Simple reactive property
+${property.name};
+
+// If using wire, add this to imports:
 // import get${capitalize(property.name)} from '@salesforce/apex/${controllerName}.get${capitalize(property.name)}';`;
     }
     else {
         // Use imperative or reactive property
-        code = `// Property: ${property.name}
+        code = `// Property: ${property.name}
 ${property.name}${property.initialValue ? ` = ${property.initialValue}` : ''};`;
         if (property.hasSetter) {
-            code += `
-
-// This property had a setter in VF - update via method call
-async update${capitalize(property.name)}(value) {
-    this.${property.name} = value;
-    // TODO: If this needs to persist, call Apex method
+            code += `
+
+// This property had a setter in VF - update via method call
+async update${capitalize(property.name)}(value) {
+    this.${property.name} = value;
+    // TODO: If this needs to persist, call Apex method
 }`;
         }
     }
@@ -359,16 +359,16 @@ function convertControllerMethod(method, controllerName) {
     if (isWireCandidate) {
         // Generate wire-based code
         if (method.parameters.length === 0) {
-            code = `// Wired Apex method: ${method.name}
-@wire(${method.name})
-${method.name}Result;
-
-get ${method.name}Data() {
-    return this.${method.name}Result?.data;
-}
-
-get ${method.name}Error() {
-    return this.${method.name}Result?.error;
+            code = `// Wired Apex method: ${method.name}
+@wire(${method.name})
+${method.name}Result;
+
+get ${method.name}Data() {
+    return this.${method.name}Result?.data;
+}
+
+get ${method.name}Error() {
+    return this.${method.name}Result?.error;
 }`;
         }
         else {
@@ -376,15 +376,15 @@ get ${method.name}Error() {
             const params = method.parameters
                 .map((p) => `${p.name}: this.${p.name}`)
                 .join(', ');
-            code = `// Wired Apex method: ${method.name}
-@wire(${method.name}, { ${params} })
+            code = `// Wired Apex method: ${method.name}
+@wire(${method.name}, { ${params} })
 ${method.name}Result;`;
         }
         if (method.isCacheable) {
-            code += `
-
-// Note: This method is cacheable. Use refreshApex() to refresh:
-// import { refreshApex } from '@salesforce/apex';
+            code += `
+
+// Note: This method is cacheable. Use refreshApex() to refresh:
+// import { refreshApex } from '@salesforce/apex';
 // await refreshApex(this.${method.name}Result);`;
         }
     }
@@ -394,15 +394,15 @@ ${method.name}Result;`;
         const paramObj = method.parameters.length > 0
             ? `{ ${method.parameters.map((p) => p.name).join(', ')} }`
             : '';
-        code = `// Imperative Apex call: ${method.name}
-async call${capitalize(method.name)}(${params}) {
-    try {
-        const result = await ${method.name}(${paramObj});
-        return result;
-    } catch (error) {
-        console.error('Error calling ${method.name}:', error);
-        throw error;
-    }
+        code = `// Imperative Apex call: ${method.name}
+async call${capitalize(method.name)}(${params}) {
+    try {
+        const result = await ${method.name}(${paramObj});
+        return result;
+    } catch (error) {
+        console.error('Error calling ${method.name}:', error);
+        throw error;
+    }
 }`;
     }
     return {
@@ -460,20 +460,20 @@ function generateDataAccessLayer(vfPage, apexController) {
         for (const ro of remoteObjects) {
             const objectNameLower = ro.objectName.toLowerCase();
             // Generate wire adapter scaffolding
-            wireDeclarations.push(`// Wire adapter for ${ro.objectName} (converted from apex:remoteObjectModel)
-// TODO: Create Apex controller method to replace Remote Objects
-//
-// Example Apex controller:
-// @AuraEnabled(cacheable=true)
-// public static List<${ro.objectName}> get${ro.objectName}s() {
-//     return [SELECT ${ro.fields} FROM ${ro.objectName} LIMIT 10];
-// }
-//
-// @wire(get${ro.objectName}s)
-// ${objectNameLower}s;
-//
-// Or use lightning/uiRecordApi for standard objects:
-// import { getRecords } from 'lightning/uiRecordApi';
+            wireDeclarations.push(`// Wire adapter for ${ro.objectName} (converted from apex:remoteObjectModel)
+// TODO: Create Apex controller method to replace Remote Objects
+//
+// Example Apex controller:
+// @AuraEnabled(cacheable=true)
+// public static List<${ro.objectName}> get${ro.objectName}s() {
+//     return [SELECT ${ro.fields} FROM ${ro.objectName} LIMIT 10];
+// }
+//
+// @wire(get${ro.objectName}s)
+// ${objectNameLower}s;
+//
+// Or use lightning/uiRecordApi for standard objects:
+// import { getRecords } from 'lightning/uiRecordApi';
 `);
             imports.push(`// import get${ro.objectName}s from '@salesforce/apex/YourController.get${ro.objectName}s';`);
             warnings.push(`Remote Object "${ro.objectName}" detected - create Apex controller method to replace`);
@@ -534,21 +534,21 @@ function generateDataAccessLayer(vfPage, apexController) {
                 : '';
             // Extract the method name from the action (e.g., "{!doSomething}" -> "doSomething")
             const methodName = extractMethodFromAction(af.action);
-            methods.push(`// Converted from apex:actionFunction "${af.name}" (imperative - has parameters)
-// Parameters: ${paramNames.join(', ')}
-async ${af.name}(${paramDeclaration}) {
-    this.isLoading = true;
-    try {
-        const result = await ${methodName || af.name}(${paramObject});
-        ${af.rerender ? `// Originally rerendered: ${af.rerender} - update reactive properties to trigger re-render` : ''}
-        ${af.oncomplete ? `// Original oncomplete callback: ${af.oncomplete}` : ''}
-        return result;
-    } catch (error) {
-        console.error('Error calling ${af.name}:', error);
-        throw error;
-    } finally {
-        this.isLoading = false;
-    }
+            methods.push(`// Converted from apex:actionFunction "${af.name}" (imperative - has parameters)
+// Parameters: ${paramNames.join(', ')}
+async ${af.name}(${paramDeclaration}) {
+    this.isLoading = true;
+    try {
+        const result = await ${methodName || af.name}(${paramObject});
+        ${af.rerender ? `// Originally rerendered: ${af.rerender} - update reactive properties to trigger re-render` : ''}
+        ${af.oncomplete ? `// Original oncomplete callback: ${af.oncomplete}` : ''}
+        return result;
+    } catch (error) {
+        console.error('Error calling ${af.name}:', error);
+        throw error;
+    } finally {
+        this.isLoading = false;
+    }
 }`);
             // Add import for the Apex method if we can determine the controller
             if (methodName && apexController) {
@@ -561,19 +561,19 @@ async ${af.name}(${paramDeclaration}) {
         }
         else {
             // Simple action function without params can potentially use wire (but still default to imperative for consistency)
-            methods.push(`// Converted from apex:actionFunction "${af.name}"
-async ${af.name}() {
-    this.isLoading = true;
-    try {
-        // TODO: Implement - original action: ${af.action}
-        ${af.rerender ? `// Originally rerendered: ${af.rerender}` : ''}
-        ${af.oncomplete ? `// Had oncomplete: ${af.oncomplete}` : ''}
-    } catch (error) {
-        console.error('Error calling ${af.name}:', error);
-        throw error;
-    } finally {
-        this.isLoading = false;
-    }
+            methods.push(`// Converted from apex:actionFunction "${af.name}"
+async ${af.name}() {
+    this.isLoading = true;
+    try {
+        // TODO: Implement - original action: ${af.action}
+        ${af.rerender ? `// Originally rerendered: ${af.rerender}` : ''}
+        ${af.oncomplete ? `// Had oncomplete: ${af.oncomplete}` : ''}
+    } catch (error) {
+        console.error('Error calling ${af.name}:', error);
+        throw error;
+    } finally {
+        this.isLoading = false;
+    }
 }`);
         }
     }

package/dist/utils/file-io.js

@@ -182,21 +182,21 @@ async function writeLwcBundle(outputDir, bundle, dryRun = false) {
  */
 async function writeConversionNotes(outputDir, componentName, notes, dryRun = false) {
     const notesPath = path.join(outputDir, componentName, `${componentName}-conversion-notes.md`);
-    const content = `# Conversion Notes for ${componentName}
-
-This file documents items that require manual attention after automated conversion.
-
-## Action Items
-
-${notes.map((note, i) => `${i + 1}. ${note}`).join('\n')}
-
-## Verification Checklist
-
-- [ ] Review all TODO comments in the generated code
-- [ ] Verify Apex method imports and wire adapters
-- [ ] Test event handling and data flow
-- [ ] Validate styling matches original component
-- [ ] Deploy to scratch org and test functionality
+    const content = `# Conversion Notes for ${componentName}
+
+This file documents items that require manual attention after automated conversion.
+
+## Action Items
+
+${notes.map((note, i) => `${i + 1}. ${note}`).join('\n')}
+
+## Verification Checklist
+
+- [ ] Review all TODO comments in the generated code
+- [ ] Verify Apex method imports and wire adapters
+- [ ] Test event handling and data flow
+- [ ] Validate styling matches original component
+- [ ] Deploy to scratch org and test functionality
 `;
     if (dryRun) {
         logger_1.logger.info(`[DRY RUN] Would write conversion notes: ${notesPath}`);

package/dist/utils/preview-generator.d.ts

@@ -0,0 +1,20 @@
+/**
+ * Preview Generator - Creates standalone HTML previews of converted LWC components
+ *
+ * This allows users to evaluate the UI of their converted components in a browser
+ * without needing a full Salesforce deployment.
+ */
+import { LwcBundle } from './file-io';
+/**
+ * Generate a complete preview HTML document
+ */
+export declare function generatePreviewHtml(bundle: LwcBundle, componentCss?: string): string;
+/**
+ * Write the preview HTML file
+ */
+export declare function writePreviewFile(outputDir: string, bundle: LwcBundle, dryRun?: boolean): Promise<string>;
+/**
+ * Open the preview file in the default browser
+ */
+export declare function openPreview(previewPath: string): Promise<void>;
+//# sourceMappingURL=preview-generator.d.ts.map

package/dist/utils/preview-generator.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"preview-generator.d.ts","sourceRoot":"","sources":["../../src/utils/preview-generator.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAKH,OAAO,EAAE,SAAS,EAAE,MAAM,WAAW,CAAC;AAqdtC;;GAEG;AACH,wBAAgB,mBAAmB,CAAC,MAAM,EAAE,SAAS,EAAE,YAAY,CAAC,EAAE,MAAM,GAAG,MAAM,CAkSpF;AAED;;GAEG;AACH,wBAAsB,gBAAgB,CACpC,SAAS,EAAE,MAAM,EACjB,MAAM,EAAE,SAAS,EACjB,MAAM,GAAE,OAAe,GACtB,OAAO,CAAC,MAAM,CAAC,CAcjB;AAED;;GAEG;AACH,wBAAsB,WAAW,CAAC,WAAW,EAAE,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC,CAuBpE"}