postcss-elm-tailwind - npm Package Compare versions

Comparing version 0.4.0 to 0.5.0

helpers.js

@@ -39,2 +39,9 @@ function elmHeader(elmModuleName, elm_fns) {
 
+const defaultOpts = {
+  elmFile: "src/TW.elm",
+  elmModuleName: "TW",
+  prefix: "",
+  nameStyle: "snake"
+};
+
 function fixClass(cls) {
@@ -45,7 +52,13 @@ // remove the dot
   cls = cls.replace(
-    /\:(responsive|group-hover|focus-within|first|last|odd|even|hover|focus|active|visited|disabled)$/,
+    /:(responsive|group-hover|focus-within|first|last|odd|even|hover|focus|active|visited|disabled)$/,
     ""
   );
   // remove extras at end
-  cls = cls.replace(/\::(placeholder)$/, "");
+  cls = cls.replace(/::(placeholder)$/, "");
+  cls = cls.replace(/:(first|last)-child/, "");
+  cls = cls.replace(/:nth-child\((even|odd)\)/, "");
+  var tmp = cls.toString();
+  if (tmp.includes("child")) {
+    console.log(cls);
+  }
   //
@@ -64,7 +77,8 @@ cls = cls.replace(/\\\//g, "/");
 
-function toElmName(cls, prefix) {
+function toElmName(cls, opts) {
+  opts = opts || defaultOpts;
   var elm = cls;
   // handle negative with prefix
-  if (prefix) {
-    re_neg_with_prefix = new RegExp(`(${prefix})-([a-z])`);
+  if (opts.prefix) {
+    let re_neg_with_prefix = new RegExp(`(${opts.prefix})-([a-z])`);
     elm = elm.replace(re_neg_with_prefix, "$1neg_$2");
@@ -85,2 +99,9 @@ }
   elm = elm.replace(/^_/g, "");
+  // handle :nth-child(even), etc
+  elm = elm.replace(/_nth_child\(.+\)/, "");
+  elm = elm.replace(/_(last|first)_child/, "");
+
+  if (opts.nameStyle === "camel") {
+    elm = elm.replace(/(_\w)/g, g => g[1].toUpperCase());
+  }
   return elm;
@@ -90,7 +111,2 @@ }
 function cleanOpts(opts) {
-  const defaultOpts = {
-    elmFile: "src/TW.elm",
-    elmModuleName: "TW",
-    prefix: ""
-  };
   if (opts === undefined) {
@@ -108,2 +124,5 @@ opts = defaultOpts;
   }
+  if (!opts.nameStyle) {
+    opts.nameStyle = defaultOpts.nameStyle;
+  }
   return opts;
@@ -118,1 +137,2 @@ }
 exports.cleanOpts = cleanOpts;
+exports.defaultOpts = defaultOpts;

index.js

@@ -23,3 +23,3 @@ const fs = require("fs");
       cls = h.fixClass(cls);
-      elm = h.toElmName(cls, opts.prefix);
+      let elm = h.toElmName(cls, opts);
 
@@ -26,0 +26,0 @@ classes.set(cls, h.elmFunction(cls, elm));

package.json

 {
   "name": "postcss-elm-tailwind",
   "main": "./index.js",
-  "version": "0.4.0",
+  "version": "0.5.0",
   "description": "PostCSS plugin Tailwind classes for Elm",
@@ -6,0 +6,0 @@ "keywords": [

README.md

@@ -74,3 +74,4 @@ # postcss-elm-tailwind
       elmFile: "src/Tailwind.elm", // change where the generated Elm module is saved
-      elmModule: "Tailwind" // this must match the file name or Elm will complain
+      elmModule: "Tailwind", // this must match the file name or Elm will complain
+      nameStyle: "snake" // "snake" for snake case, "camel" for camel case
     })
@@ -77,0 +78,0 @@ ]

test/tests.js

@@ -9,3 +9,4 @@ const h = require("../helpers");
       elmModuleName: "TW",
-      prefix: ""
+      prefix: "",
+      nameStyle: "snake"
     });
@@ -17,3 +18,4 @@ });
       elmModuleName: "TW",
-      prefix: ""
+      prefix: "",
+      nameStyle: "snake"
     });
@@ -25,3 +27,4 @@ });
       elmModuleName: "TW",
-      prefix: "tw--"
+      prefix: "tw--",
+      nameStyle: "snake"
     });
@@ -56,5 +59,21 @@ });
   });
+  // regression tests for github issue #7:
+  it("handle variants", () => {
+    assert.equal(
+      h.fixClass(".xl:odd:tw-bg-pink-700:nth-child(odd)"),
+      "xl:odd:tw-bg-pink-700"
+    );
+    assert.equal(
+      h.fixClass(".lg:even:bg-pink-700:nth-child(even)"),
+      "lg:even:bg-pink-700"
+    );
+    assert.equal(
+      h.fixClass(".last:tw-bg-transparent:last-child"),
+      "last:tw-bg-transparent"
+    );
+  });
 });
 
 describe("fixClass -> toElmName", () => {
+  const camelCaseOpts = { ...h.defaultOpts, nameStyle: "camel" };
   it("should let container pass through", () => {
@@ -66,2 +85,5 @@ assert.equal(h.toElmName(h.fixClass("container")), "container");
   });
+  it("should let mx-auto pass through camel case", () => {
+    assert.equal(h.toElmName(h.fixClass("mx-auto"), camelCaseOpts), "mxAuto");
+  });
   it("responsive", () => {
@@ -86,3 +108,6 @@ assert.equal(h.toElmName(h.fixClass("sm:mx-auto")), "sm_mx_auto");
   it("negative with variant .sm:-translate-x-1", () => {
-    assert.equal(h.toElmName(h.fixClass(".sm:-translate-x-1")), "sm_neg_translate_x_1");
+    assert.equal(
+      h.toElmName(h.fixClass(".sm:-translate-x-1")),
+      "sm_neg_translate_x_1"
+    );
   });
@@ -97,18 +122,48 @@ it("with prefix", () => {
     assert.equal(
-      h.toElmName(h.fixClass(".xl:tw--my-64"), "tw-"),
+      h.toElmName(h.fixClass(".xl:tw--my-64"), {
+        ...h.defaultOpts,
+        prefix: "tw-"
+      }),
       "xl_tw_neg_my_64"
     );
   });
+  it("negative with prefix and variant .xl:tw--my-64 camel", () => {
+    assert.equal(
+      h.toElmName(h.fixClass(".xl:tw--my-64"), {
+        ...camelCaseOpts,
+        prefix: "tw-"
+      }),
+      "xlTwNegMy64"
+    );
+  });
   it("not-negative with prefix .xl:tw-my-64", () => {
-    assert.equal(h.toElmName(h.fixClass(".xl:tw-my-64"), "-tw"), "xl_tw_my_64");
+    assert.equal(
+      h.toElmName(h.fixClass(".xl:tw-my-64"), {
+        ...h.defaultOpts,
+        prefix: "-tw"
+      }),
+      "xl_tw_my_64"
+    );
   });
   it("cursor-pointer", () => {
+    assert.equal(h.toElmName(h.fixClass(".cursor-pointer")), "cursor_pointer");
+  });
+  it("font-medium", () => {
+    assert.equal(h.toElmName(h.fixClass(".font-medium")), "font_medium");
+  });
+  // regression tests for github issue #7:
+  it("handle variants", () => {
     assert.equal(
-      h.toElmName(h.fixClass(".cursor-pointer"), ""),
-      "cursor_pointer"
+      h.toElmName(h.fixClass(".xl\:odd\:tw-bg-pink-700:nth-child(odd)")),
+      "xl_odd_tw_bg_pink_700"
     );
+    assert.equal(
+      h.toElmName(h.fixClass(".lg\:even\:tw-bg-pink-700:nth-child(even)")),
+      "lg_even_tw_bg_pink_700"
+    );
+    assert.equal(
+      h.toElmName(h.fixClass(".last\:tw-bg-transparent:last-child")),
+      "last_tw_bg_transparent"
+    );
   });
-  it("font-medium", () => {
-    assert.equal(h.toElmName(h.fixClass(".font-medium"), ""), "font_medium");
-  });
 });

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

13889

increased by22.11%

Number of package files

8

increased by14.29%

Lines of code

307

increased by31.2%

Number of lines in readme file

89

increased by1.14%

No dependency changes