tailwind-typescript-plugin 1.4.0-beta.17 → 1.4.0-beta.18

package/CHANGELOG.md

@@ -1,3 +1,9 @@
+## [1.4.0-beta.18](https://github.com/IvanRodriCalleja/tailwind-typescript-plugin/compare/v1.4.0-beta.17...v1.4.0-beta.18) (2025-12-20)
+
+### ✨ Features
+
+* add Vue Single File Component support ([1d99210](https://github.com/IvanRodriCalleja/tailwind-typescript-plugin/commit/1d99210ce1d4b206fcf4461a904af7adee24ab53))
+
 ## [1.4.0-beta.17](https://github.com/IvanRodriCalleja/tailwind-typescript-plugin/compare/v1.4.0-beta.16...v1.4.0-beta.17) (2025-12-20)
 
 ### ✨ Features

package/README.md

@@ -6,11 +6,11 @@
 [![TypeScript](https://img.shields.io/github/package-json/dependency-version/IvanRodriCalleja/tailwind-typescript-plugin/dev/typescript?label=TypeScript)](https://www.typescriptlang.org/)
 [![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg)](https://github.com/IvanRodriCalleja/tailwind-typescript-plugin/blob/main/CONTRIBUTING.md)
 
-A TypeScript Language Service plugin that catches **typos and invalid Tailwind CSS class names** in your JSX/TSX files. When you write a class name that doesn't exist in Tailwind, it won't apply any styles—this plugin detects those mistakes and shows errors directly in your editor before you ship broken styles.
+A TypeScript Language Service plugin that catches **typos and invalid Tailwind CSS class names** in your JSX/TSX and Vue files. When you write a class name that doesn't exist in Tailwind, it won't apply any styles—this plugin detects those mistakes and shows errors directly in your editor before you ship broken styles.
 
 ## What does this plugin do?
 
-Ever written `className="flex itms-center"` instead of `"flex items-center"`? That typo silently fails—Tailwind ignores invalid classes and your component looks broken. This plugin prevents that by analyzing your JSX/TSX code and validating that all Tailwind classes used in `className` attributes actually exist in your Tailwind CSS configuration. It provides real-time feedback by showing TypeScript errors for invalid or misspelled Tailwind classes, catching styling mistakes before they reach production.
+Ever written `className="flex itms-center"` instead of `"flex items-center"`? That typo silently fails—Tailwind ignores invalid classes and your component looks broken. This plugin prevents that by analyzing your JSX/TSX and Vue code, validating that all Tailwind classes used in `className`/`class` attributes actually exist in your Tailwind CSS configuration. It provides real-time feedback by showing TypeScript errors for invalid or misspelled Tailwind classes, catching styling mistakes before they reach production.
 
 ## Table of Contents
 
@@ -37,6 +37,10 @@ Ever written `className="flex itms-center"` instead of `"flex items-center"`? Th
 - **Editor integration**: Works with any editor that supports TypeScript Language Service (VS Code, WebStorm, etc.)
 - **Supports Tailwind variants**: Validates responsive (`md:`, `lg:`), state (`hover:`, `focus:`), and other variants
 - **Arbitrary values**: Correctly handles Tailwind arbitrary values like `h-[50vh]` or `bg-[#ff0000]`
+- **Vue support**: Validates classes in Vue Single File Components (`.vue` files) when used with `@vue/typescript-plugin`
+  - Static class attributes: `<div class="flex items-center">`
+  - Dynamic class bindings: `<div :class="{ 'bg-red-500': isActive }">`
+  - Object and array syntax support
 - **Variant library support**:
   - **tailwind-variants**: Validates classes in `tv()` function calls including `base`, `variants`, `compoundVariants`, `slots`, and `class`/`className` override properties
   - **class-variance-authority**: Validates classes in `cva()` function calls including base classes, `variants`, `compoundVariants`, and `class`/`className` override properties
@@ -372,6 +376,49 @@ You may need to restart the TypeScript server:
 - Open command palette
 - Type "TypeScript: Restart TS Server"
 
+#### Vue Projects
+
+For Vue Single File Components (`.vue` files), you need to configure `@vue/typescript-plugin` alongside this plugin:
+
+1. Install the Vue TypeScript plugin:
+```bash
+npm install -D @vue/typescript-plugin
+```
+
+2. Configure both plugins in your `tsconfig.json`:
+```json
+{
+  "compilerOptions": {
+    "plugins": [
+      {
+        "name": "@vue/typescript-plugin",
+        "languages": ["vue"]
+      },
+      {
+        "name": "tailwind-typescript-plugin",
+        "globalCss": "./src/global.css"
+      }
+    ]
+  }
+}
+```
+
+3. Ensure you have the [Vue - Official](https://marketplace.visualstudio.com/items?itemName=Vue.volar) extension installed in VS Code.
+
+The plugin will then validate classes in your Vue templates:
+```vue
+<template>
+  <!-- ✅ Valid classes -->
+  <div class="flex items-center">Valid</div>
+
+  <!-- ❌ Invalid class detected -->
+  <div class="invalidclass">Error shown</div>
+
+  <!-- ✅ Dynamic class bindings -->
+  <div :class="{ 'bg-red-500': isActive }">Dynamic</div>
+</template>
+```
+
 #### Other Editors
 
 Most editors that support TypeScript Language Service plugins should work automatically. Refer to your editor's documentation for TypeScript plugin configuration.

package/lib/extractors/VueAttributeExtractor.d.ts

@@ -3,16 +3,31 @@ import { ClassNameInfo, ExtractionContext } from '../core/types';
 import { BaseExtractor } from './BaseExtractor';
 /**
  * Extracts class names from Vue template class attributes
- * Assumes @vue/language-tools is configured and transforms Vue templates
  *
- * TODO: Implement Vue-specific extraction logic
- * - Handle :class (v-bind:class) dynamic bindings
- * - Handle class static attributes
- * - Handle object syntax: :class="{ 'active': isActive }"
- * - Handle array syntax: :class="['base', { 'active': isActive }]"
+ * When @vue/language-tools (Volar) transforms Vue SFC templates, it generates
+ * TypeScript code using function calls with object spreads:
+ *
+ * ```typescript
+ * __VLS_asFunctionalElement(__VLS_intrinsicElements.div)({
+ *   ...{ class: "flex items-center" },
+ * });
+ * ```
+ *
+ * For dynamic classes:
+ * ```typescript
+ * __VLS_asFunctionalElement(__VLS_intrinsicElements.div)({
+ *   ...{ class: ({ 'bg-red-500': isActive }) },
+ * });
+ * ```
+ *
+ * This extractor handles these patterns to extract class names.
  */
 export declare class VueAttributeExtractor extends BaseExtractor {
+    private expressionExtractor;
+    constructor();
     canHandle(node: ts.Node, context: ExtractionContext): boolean;
+    private hasClassSpreadProperty;
     extract(node: ts.Node, context: ExtractionContext): ClassNameInfo[];
+    private extractClassesFromValue;
 }
 //# sourceMappingURL=VueAttributeExtractor.d.ts.map

package/lib/extractors/VueAttributeExtractor.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"VueAttributeExtractor.d.ts","sourceRoot":"","sources":["../../src/extractors/VueAttributeExtractor.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,MAAM,gCAAgC,CAAC;AAErD,OAAO,EAAE,aAAa,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAC;AACjE,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAEhD;;;;;;;;;GASG;AACH,qBAAa,qBAAsB,SAAQ,aAAa;IACvD,SAAS,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,EAAE,OAAO,EAAE,iBAAiB,GAAG,OAAO;IAM7D,OAAO,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,EAAE,OAAO,EAAE,iBAAiB,GAAG,aAAa,EAAE;CAKnE"}
+{"version":3,"file":"VueAttributeExtractor.d.ts","sourceRoot":"","sources":["../../src/extractors/VueAttributeExtractor.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,MAAM,gCAAgC,CAAC;AAErD,OAAO,EAAE,aAAa,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAC;AACjE,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAGhD;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,qBAAa,qBAAsB,SAAQ,aAAa;IACvD,OAAO,CAAC,mBAAmB,CAAsB;;IAOjD,SAAS,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,EAAE,OAAO,EAAE,iBAAiB,GAAG,OAAO;IA4B7D,OAAO,CAAC,sBAAsB;IAsB9B,OAAO,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,EAAE,OAAO,EAAE,iBAAiB,GAAG,aAAa,EAAE;IA4CnE,OAAO,CAAC,uBAAuB;CA2H/B"}

package/lib/extractors/VueAttributeExtractor.js

@@ -2,26 +2,209 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.VueAttributeExtractor = void 0;
 const BaseExtractor_1 = require("./BaseExtractor");
+const ExpressionExtractor_1 = require("./ExpressionExtractor");
 /**
  * Extracts class names from Vue template class attributes
- * Assumes @vue/language-tools is configured and transforms Vue templates
  *
- * TODO: Implement Vue-specific extraction logic
- * - Handle :class (v-bind:class) dynamic bindings
- * - Handle class static attributes
- * - Handle object syntax: :class="{ 'active': isActive }"
- * - Handle array syntax: :class="['base', { 'active': isActive }]"
+ * When @vue/language-tools (Volar) transforms Vue SFC templates, it generates
+ * TypeScript code using function calls with object spreads:
+ *
+ * ```typescript
+ * __VLS_asFunctionalElement(__VLS_intrinsicElements.div)({
+ *   ...{ class: "flex items-center" },
+ * });
+ * ```
+ *
+ * For dynamic classes:
+ * ```typescript
+ * __VLS_asFunctionalElement(__VLS_intrinsicElements.div)({
+ *   ...{ class: ({ 'bg-red-500': isActive }) },
+ * });
+ * ```
+ *
+ * This extractor handles these patterns to extract class names.
  */
 class VueAttributeExtractor extends BaseExtractor_1.BaseExtractor {
+    constructor() {
+        super();
+        this.expressionExtractor = new ExpressionExtractor_1.ExpressionExtractor();
+    }
     canHandle(node, context) {
-        // TODO: Implement Vue node detection
-        // For now, return false as this is a stub
+        // We handle call expressions that look like Vue's generated element calls
+        // Pattern: __VLS_asFunctionalElement(...)({ ...{ class: ... } })
+        if (!context.typescript.isCallExpression(node)) {
+            return false;
+        }
+        // Check if this is a chained call (the outer call to the element function)
+        // The pattern is: func(...)({...}) where the result of func(...) is called again
+        const expression = node.expression;
+        if (!context.typescript.isCallExpression(expression)) {
+            return false;
+        }
+        // Check if the arguments contain an object with spread that has a 'class' property
+        if (node.arguments.length === 0) {
+            return false;
+        }
+        const firstArg = node.arguments[0];
+        if (!context.typescript.isObjectLiteralExpression(firstArg)) {
+            return false;
+        }
+        // Look for spread assignments with 'class' property
+        return this.hasClassSpreadProperty(firstArg, context);
+    }
+    hasClassSpreadProperty(obj, context) {
+        for (const prop of obj.properties) {
+            if (context.typescript.isSpreadAssignment(prop)) {
+                const spreadExpr = prop.expression;
+                if (context.typescript.isObjectLiteralExpression(spreadExpr)) {
+                    for (const innerProp of spreadExpr.properties) {
+                        if (context.typescript.isPropertyAssignment(innerProp)) {
+                            const name = innerProp.name;
+                            if (context.typescript.isIdentifier(name) && name.text === 'class') {
+                                return true;
+                            }
+                        }
+                    }
+                }
+            }
+        }
         return false;
     }
     extract(node, context) {
-        // TODO: Implement Vue class extraction
-        // This is a placeholder that will be implemented in the next phase
-        return [];
+        const classNames = [];
+        if (!context.typescript.isCallExpression(node)) {
+            return classNames;
+        }
+        const firstArg = node.arguments[0];
+        if (!firstArg || !context.typescript.isObjectLiteralExpression(firstArg)) {
+            return classNames;
+        }
+        // Find spread assignments with 'class' property
+        for (const prop of firstArg.properties) {
+            if (!context.typescript.isSpreadAssignment(prop)) {
+                continue;
+            }
+            const spreadExpr = prop.expression;
+            if (!context.typescript.isObjectLiteralExpression(spreadExpr)) {
+                continue;
+            }
+            for (const innerProp of spreadExpr.properties) {
+                if (!context.typescript.isPropertyAssignment(innerProp)) {
+                    continue;
+                }
+                const name = innerProp.name;
+                if (!context.typescript.isIdentifier(name) || name.text !== 'class') {
+                    continue;
+                }
+                const value = innerProp.initializer;
+                const attributeId = `${innerProp.getStart()}-${innerProp.getEnd()}`;
+                // Handle different class value types
+                classNames.push(...this.extractClassesFromValue(value, context, attributeId));
+            }
+        }
+        return classNames;
+    }
+    extractClassesFromValue(value, context, attributeId) {
+        const classNames = [];
+        // Static string literal: class: "flex items-center"
+        if (context.typescript.isStringLiteral(value)) {
+            const fullText = value.text;
+            if (fullText.length === 0) {
+                return classNames;
+            }
+            const stringContentStart = value.getStart() + 1;
+            let offset = 0;
+            const parts = fullText.split(/(\s+)/);
+            for (const part of parts) {
+                if (part && !/^\s+$/.test(part)) {
+                    classNames.push({
+                        className: part,
+                        absoluteStart: stringContentStart + offset,
+                        length: part.length,
+                        line: context.sourceFile.getLineAndCharacterOfPosition(stringContentStart + offset).line +
+                            1,
+                        file: context.sourceFile.fileName,
+                        attributeId
+                    });
+                }
+                offset += part.length;
+            }
+            return classNames;
+        }
+        // Object literal for dynamic classes: class: { 'bg-red-500': isActive }
+        // Or wrapped in parentheses: class: ({ 'bg-red-500': isActive })
+        let objectExpr;
+        if (context.typescript.isObjectLiteralExpression(value)) {
+            objectExpr = value;
+        }
+        else if (context.typescript.isParenthesizedExpression(value)) {
+            const inner = value.expression;
+            if (context.typescript.isObjectLiteralExpression(inner)) {
+                objectExpr = inner;
+            }
+        }
+        if (objectExpr) {
+            for (const prop of objectExpr.properties) {
+                if (context.typescript.isPropertyAssignment(prop)) {
+                    const propName = prop.name;
+                    let className;
+                    let start;
+                    // Handle string literal keys: { 'bg-red-500': true }
+                    if (context.typescript.isStringLiteral(propName)) {
+                        className = propName.text;
+                        start = propName.getStart() + 1; // Skip opening quote
+                    }
+                    // Handle identifier keys: { flex: true }
+                    else if (context.typescript.isIdentifier(propName)) {
+                        className = propName.text;
+                        start = propName.getStart();
+                    }
+                    if (className && start !== undefined) {
+                        classNames.push({
+                            className,
+                            absoluteStart: start,
+                            length: className.length,
+                            line: context.sourceFile.getLineAndCharacterOfPosition(start).line + 1,
+                            file: context.sourceFile.fileName,
+                            attributeId
+                        });
+                    }
+                }
+                // Handle shorthand properties: { flex }
+                else if (context.typescript.isShorthandPropertyAssignment(prop)) {
+                    const className = prop.name.text;
+                    const start = prop.name.getStart();
+                    classNames.push({
+                        className,
+                        absoluteStart: start,
+                        length: className.length,
+                        line: context.sourceFile.getLineAndCharacterOfPosition(start).line + 1,
+                        file: context.sourceFile.fileName,
+                        attributeId
+                    });
+                }
+            }
+            return classNames;
+        }
+        // Array literal: class: ['flex', 'items-center']
+        if (context.typescript.isArrayLiteralExpression(value)) {
+            const addAttributeId = (classes) => classes.map(c => ({ ...c, attributeId }));
+            return addAttributeId(this.expressionExtractor.extract(value, context));
+        }
+        // Template literal or other expressions - delegate to expression extractor
+        if (context.typescript.isTemplateExpression(value) ||
+            context.typescript.isNoSubstitutionTemplateLiteral(value)) {
+            const addAttributeId = (classes) => classes.map(c => ({ ...c, attributeId }));
+            return addAttributeId(this.expressionExtractor.extract(value, context));
+        }
+        // Call expression (utility functions like cn, clsx)
+        if (context.typescript.isCallExpression(value)) {
+            if (this.shouldValidateFunctionCall(value, context.utilityFunctions, context)) {
+                const addAttributeId = (classes) => classes.map(c => ({ ...c, attributeId }));
+                return addAttributeId(this.expressionExtractor.extract(value, context));
+            }
+        }
+        return classNames;
     }
 }
 exports.VueAttributeExtractor = VueAttributeExtractor;

package/lib/extractors/VueAttributeExtractor.js.map

@@ -1 +1 @@
-{"version":3,"file":"VueAttributeExtractor.js","sourceRoot":"","sources":["../../src/extractors/VueAttributeExtractor.ts"],"names":[],"mappings":";;;AAIA,mDAAgD;AAEhD;;;;;;;;;GASG;AACH,MAAa,qBAAsB,SAAQ,6BAAa;IACvD,SAAS,CAAC,IAAa,EAAE,OAA0B;QAClD,qCAAqC;QACrC,0CAA0C;QAC1C,OAAO,KAAK,CAAC;IACd,CAAC;IAED,OAAO,CAAC,IAAa,EAAE,OAA0B;QAChD,uCAAuC;QACvC,mEAAmE;QACnE,OAAO,EAAE,CAAC;IACX,CAAC;CACD;AAZD,sDAYC"}
+{"version":3,"file":"VueAttributeExtractor.js","sourceRoot":"","sources":["../../src/extractors/VueAttributeExtractor.ts"],"names":[],"mappings":"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"}

package/lib/utils/FrameworkDetector.js

@@ -20,12 +20,12 @@ var Framework;
  * @returns The detected framework or null if not supported
  */
 function detectFramework(fileName) {
-    // Vue Single File Components
-    if (fileName.endsWith('.vue')) {
+    // Vue Single File Components (including virtual .vue.ts files from Volar)
+    if (fileName.endsWith('.vue') || fileName.includes('.vue.')) {
         return Framework.VUE;
     }
-    // Svelte components
-    if (fileName.endsWith('.svelte')) {
+    // Svelte components (including virtual .svelte.ts files)
+    if (fileName.endsWith('.svelte') || fileName.includes('.svelte.')) {
         return Framework.SVELTE;
     }
     // JSX/TSX files (React, Solid, etc.)

package/lib/utils/FrameworkDetector.js.map

@@ -1 +1 @@
-{"version":3,"file":"FrameworkDetector.js","sourceRoot":"","sources":["../../src/utils/FrameworkDetector.ts"],"names":[],"mappings":";;;AAgBA,0CAwBC;AAQD,0CAEC;AAlDD;;GAEG;AACH,IAAY,SAIX;AAJD,WAAY,SAAS;IACpB,wBAAW,CAAA;IACX,wBAAW,CAAA;IACX,8BAAiB,CAAA;AAClB,CAAC,EAJW,SAAS,yBAAT,SAAS,QAIpB;AAED;;;;;;GAMG;AACH,SAAgB,eAAe,CAAC,QAAgB;IAC/C,6BAA6B;IAC7B,IAAI,QAAQ,CAAC,QAAQ,CAAC,MAAM,CAAC,EAAE,CAAC;QAC/B,OAAO,SAAS,CAAC,GAAG,CAAC;IACtB,CAAC;IAED,oBAAoB;IACpB,IAAI,QAAQ,CAAC,QAAQ,CAAC,SAAS,CAAC,EAAE,CAAC;QAClC,OAAO,SAAS,CAAC,MAAM,CAAC;IACzB,CAAC;IAED,qCAAqC;IACrC,IAAI,QAAQ,CAAC,QAAQ,CAAC,MAAM,CAAC,IAAI,QAAQ,CAAC,QAAQ,CAAC,MAAM,CAAC,EAAE,CAAC;QAC5D,OAAO,SAAS,CAAC,GAAG,CAAC;IACtB,CAAC;IAED,oDAAoD;IACpD,0CAA0C;IAC1C,IAAI,QAAQ,CAAC,QAAQ,CAAC,KAAK,CAAC,IAAI,QAAQ,CAAC,QAAQ,CAAC,KAAK,CAAC,EAAE,CAAC;QAC1D,OAAO,SAAS,CAAC,GAAG,CAAC;IACtB,CAAC;IAED,wBAAwB;IACxB,OAAO,IAAI,CAAC;AACb,CAAC;AAED;;;;;GAKG;AACH,SAAgB,eAAe,CAAC,QAAgB;IAC/C,OAAO,eAAe,CAAC,QAAQ,CAAC,KAAK,IAAI,CAAC;AAC3C,CAAC"}
+{"version":3,"file":"FrameworkDetector.js","sourceRoot":"","sources":["../../src/utils/FrameworkDetector.ts"],"names":[],"mappings":";;;AAgBA,0CAwBC;AAQD,0CAEC;AAlDD;;GAEG;AACH,IAAY,SAIX;AAJD,WAAY,SAAS;IACpB,wBAAW,CAAA;IACX,wBAAW,CAAA;IACX,8BAAiB,CAAA;AAClB,CAAC,EAJW,SAAS,yBAAT,SAAS,QAIpB;AAED;;;;;;GAMG;AACH,SAAgB,eAAe,CAAC,QAAgB;IAC/C,0EAA0E;IAC1E,IAAI,QAAQ,CAAC,QAAQ,CAAC,MAAM,CAAC,IAAI,QAAQ,CAAC,QAAQ,CAAC,OAAO,CAAC,EAAE,CAAC;QAC7D,OAAO,SAAS,CAAC,GAAG,CAAC;IACtB,CAAC;IAED,yDAAyD;IACzD,IAAI,QAAQ,CAAC,QAAQ,CAAC,SAAS,CAAC,IAAI,QAAQ,CAAC,QAAQ,CAAC,UAAU,CAAC,EAAE,CAAC;QACnE,OAAO,SAAS,CAAC,MAAM,CAAC;IACzB,CAAC;IAED,qCAAqC;IACrC,IAAI,QAAQ,CAAC,QAAQ,CAAC,MAAM,CAAC,IAAI,QAAQ,CAAC,QAAQ,CAAC,MAAM,CAAC,EAAE,CAAC;QAC5D,OAAO,SAAS,CAAC,GAAG,CAAC;IACtB,CAAC;IAED,oDAAoD;IACpD,0CAA0C;IAC1C,IAAI,QAAQ,CAAC,QAAQ,CAAC,KAAK,CAAC,IAAI,QAAQ,CAAC,QAAQ,CAAC,KAAK,CAAC,EAAE,CAAC;QAC1D,OAAO,SAAS,CAAC,GAAG,CAAC;IACtB,CAAC;IAED,wBAAwB;IACxB,OAAO,IAAI,CAAC;AACb,CAAC;AAED;;;;;GAKG;AACH,SAAgB,eAAe,CAAC,QAAgB;IAC/C,OAAO,eAAe,CAAC,QAAQ,CAAC,KAAK,IAAI,CAAC;AAC3C,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tailwind-typescript-plugin",
-  "version": "1.4.0-beta.17",
+  "version": "1.4.0-beta.18",
   "description": "TypeScript Language Service plugin that validates Tailwind CSS class names in JSX/TSX files. Catches typos and invalid classes in real-time with support for tailwind-variants and class-variance-authority.",
   "main": "lib/index.js",
   "types": "lib/index.d.ts",