tailwind-to-style 1.0.1 → 1.0.3

package/index.js

@@ -2015,7 +2015,11 @@ function generator$1$(configOptions = {}) {
       const key = keyTmp.toLowerCase() !== "default" ? `-${keyTmp}` : "";
       return `
           ${prefix}${key} {
-            border-width: ${value};
+            border-style: solid;
+            border-top-width: ${value};
+            border-bottom-width: ${value};
+            border-left-width: ${value};
+            border-right-width: ${value};
           }
           ${prefix}-x${key} {
             border-left-width: ${value};
@@ -5679,7 +5683,15 @@ function replaceAndRemoveCSSVariables(styleString) {
   return updatedStyleString;
 }
 
-function twss(classNames, convertToJson) {
+const breakpoints = {
+  sm: "@media (min-width: 640px)",
+  md: "@media (min-width: 768px)",
+  lg: "@media (min-width: 1024px)",
+  xl: "@media (min-width: 1280px)",
+  "2xl": "@media (min-width: 1536px)",
+};
+
+function tws(classNames, convertToJson) {
   const cssString = generateTailwindCssString().replace(/\s\s+/g, " ");
 
   const cssClasses = generateCssClasses(cssString);
@@ -5701,4 +5713,43 @@ function twss(classNames, convertToJson) {
   return cssResult;
 }
 
-module.exports = twss;
+function twsx(selectorsConfig) {
+  return Object.entries(selectorsConfig)
+    .map(([selector, [baseStyles, extensions = {}]]) => {
+      let baseCSS = `${selector} { ${tws(baseStyles)} }`;
+      let extendedCSS = "";
+
+      for (const [key, value] of Object.entries(extensions)) {
+        if (breakpoints[key]) {
+          const mediaQuery = breakpoints[key];
+          extendedCSS += `
+                ${mediaQuery} {
+                  ${selector} {
+                    ${tws(value)}
+                  }
+                }
+              `;
+        } else if (key.startsWith("@media")) {
+          extendedCSS += `
+                ${key} {
+                  ${selector} {
+                    ${tws(value)}
+                  }
+                }
+              `;
+        } else {
+          extendedCSS += `
+                ${selector}${key} {
+                  ${tws(value)}
+                }
+              `;
+        }
+      }
+
+      return `${baseCSS} ${extendedCSS}`;
+    })
+    .join(" ");
+}
+
+exports.tws = tws;
+exports.twsx = twsx;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tailwind-to-style",
-  "version": "1.0.1",
+  "version": "1.0.3",
   "description": "Convert tailwind classes to inline style",
   "main": "index.js",
   "scripts": {