@youthfulhps/prettier-plugin-tailwindcss-normalizer 0.3.9 → 0.3.10

package/README.md

@@ -45,7 +45,7 @@ Add the plugin to your Prettier configuration:
 
 ```javascript
 module.exports = {
-  plugins: ['@youthfulhps/prettier-plugin-tailwindcss-normalizer'],
+  plugins: ["@youthfulhps/prettier-plugin-tailwindcss-normalizer"],
 };
 ```
 
@@ -59,15 +59,39 @@ npx prettier --write .
 npx prettier --write src/**/*.{tsx,jsx,html,vue}
 ```
 
+## 🔗 Using with Other Prettier Tailwind Plugins
+
+To use this plugin alongside other prettier tailwind plugins, you need to install and configure `prettier-plugin-merge`.
+
+### Installation
+
+```bash
+npm install --save-dev prettier-plugin-merge
+```
+
+### Configuration
+
+In your `.prettierrc.js` file, add `prettier-plugin-merge` as the last item in the plugins array:
+
+```javascript
+module.exports = {
+  plugins: [
+    "@youthfulhps/prettier-plugin-tailwindcss-normalizer",
+    "prettier-plugin-tailwindcss",
+    "prettier-plugin-merge",
+  ],
+};
+```
+
+> **Note**: `prettier-plugin-merge` is a plugin that enables multiple prettier plugins to work together. When using with other tailwind-related plugins, it should always be placed last in the plugins array.
+
 ## 🎯 Examples
 
 ### Before
 
 ```jsx
 <div className="p-[16px] m-[8px] bg-blue-500">
-  <span className="px-[24px] py-[12px] rounded-[6px]">
-    Button
-  </span>
+  <span className="px-[24px] py-[12px] rounded-[6px]">Button</span>
 </div>
 ```
 
@@ -75,9 +99,7 @@ npx prettier --write src/**/*.{tsx,jsx,html,vue}
 
 ```jsx
 <div className="p-4 m-2 bg-blue-500">
-  <span className="px-6 py-3 rounded-md">
-    Button
-  </span>
+  <span className="px-6 py-3 rounded-md">Button</span>
 </div>
 ```
 

package/dist/index.d.ts

@@ -1,3 +1,7 @@
-import { CompatPlugin } from "./types/prettier-compat";
-declare const plugin: CompatPlugin;
-export default plugin;
+import { CompatParser } from "./types/prettier-compat";
+declare const parsers: Record<string, CompatParser>, languages: {
+    name: string;
+    parsers: string[];
+    extensions: string[];
+}[] | undefined;
+export { parsers, languages };

package/dist/index.js

@@ -1,12 +1,12 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.languages = exports.parsers = void 0;
 const ast_transformer_1 = require("./ast-transformer");
 const version_utils_1 = require("./utils/version-utils");
 function createParser(parserName, fileType) {
     const baseParser = (0, version_utils_1.safeLoadParser)(parserName, fileType);
     return {
         ...baseParser,
-        astFormat: parserName,
         preprocess: (text, options) => {
             return (0, ast_transformer_1.transformByFileType)(text, options.filepath || `file.${fileType}`);
         },
@@ -36,46 +36,33 @@ const plugin = {
         },
         {
             name: "TypeScript",
-            parsers: ["babel-ts"],
+            parsers: ["typescript"],
             extensions: [".ts", ".tsx"],
         },
     ],
     parsers: {
-        html: createParser("html", "html"),
-        vue: createParser("html", "vue"),
-        angular: createParser("angular", "html"),
+        html: {
+            ...createParser("html", "html"),
+            astFormat: "html",
+        },
+        vue: {
+            ...createParser("html", "vue"),
+            astFormat: "vue",
+        },
+        angular: {
+            ...createParser("angular", "html"),
+            astFormat: "html",
+        },
         babel: {
-            ...createParser("babel", "jsx"),
-            parse: (text, options) => {
-                const filepath = options.filepath || "";
-                if (filepath.endsWith(".jsx") || filepath.endsWith(".tsx")) {
-                    const transformedText = (0, ast_transformer_1.transformByFileType)(text, filepath);
-                    const baseParser = (0, version_utils_1.safeLoadParser)("babel");
-                    return baseParser.parse
-                        ? baseParser.parse(transformedText, options)
-                        : text;
-                }
-                const baseParser = (0, version_utils_1.safeLoadParser)("babel");
-                return baseParser.parse ? baseParser.parse(text, options) : text;
-            },
+            ...createParser("babel", "babel"),
+            astFormat: "estree",
         },
-        "babel-ts": {
-            ...createParser("babel", "tsx"),
-            parse: (text, options) => {
-                const filepath = options.filepath || "";
-                if (filepath.endsWith(".tsx")) {
-                    const transformedText = (0, ast_transformer_1.transformByFileType)(text, filepath);
-                    const baseParser = (0, version_utils_1.safeLoadParser)("babel", "babel-ts");
-                    return baseParser.parse
-                        ? baseParser.parse(transformedText, options)
-                        : text;
-                }
-                const baseParser = (0, version_utils_1.safeLoadParser)("babel", "babel-ts");
-                return baseParser.parse ? baseParser.parse(text, options) : text;
-            },
+        typescript: {
+            ...createParser("typescript", "typescript"),
+            astFormat: "estree",
         },
     },
-    printers: {},
 };
-module.exports = plugin;
-exports.default = plugin;
+const { parsers, languages } = plugin;
+exports.parsers = parsers;
+exports.languages = languages;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@youthfulhps/prettier-plugin-tailwindcss-normalizer",
-  "version": "0.3.9",
+  "version": "0.3.10",
   "description": "A Prettier plugin that normalizes Tailwind CSS arbitrary values into standard utility classes.",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",