style-zx 0.0.6 → 0.0.8

package/dist/plugin.cjs

@@ -1,6 +1,8 @@
-"use strict";const v=require("@babel/parser"),m=require("@babel/traverse"),S=require("@babel/types"),$=require("magic-string"),b=require("crypto");function w(e){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const r in e)if(r!=="default"){const s=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,s.get?s:{enumerable:!0,get:()=>e[r]})}}return t.default=e,Object.freeze(t)}const i=w(S),E={m:["margin"],mt:["marginTop"],mr:["marginRight"],mb:["marginBottom"],ml:["marginLeft"],mx:["marginLeft","marginRight"],my:["marginTop","marginBottom"],p:["padding"],pt:["paddingTop"],pr:["paddingRight"],pb:["paddingBottom"],pl:["paddingLeft"],px:["paddingLeft","paddingRight"],py:["paddingTop","paddingBottom"],bg:["backgroundColor"]},L=new Set(["opacity","fontWeight","lineHeight","zIndex","flex","flexGrow","flexShrink","order"]);function z(e){return e.replace(/[A-Z]/g,t=>`-${t.toLowerCase()}`)}function j(e,t){return typeof t=="number"&&!L.has(e)?`${t}px`:typeof t=="string"&&t.startsWith("$theme.")?`var(${t.replace("$theme.","--theme-").replace(/\./g,"-")})`:String(t)}function x(e,t){let r=`.${t} {`,s="";for(const o in e){const c=e[o];if(o.startsWith("&")||o.startsWith(":")||o.startsWith("@")){const l=o.replace(/&/g,`.${t}`),n=x(c,"TEMP_CLASS").replace(".TEMP_CLASS",l);s+=`
-${n}`;continue}(E[o]||[o]).forEach(l=>{const n=z(l),u=j(l,c);r+=`
-  ${n}: ${u};`})}return r+=`
-}`,r+s}function O(e){return b.createHash("md5").update(e).digest("hex").slice(0,8)}function y(e){if(i.isStringLiteral(e)||i.isNumericLiteral(e)||i.isBooleanLiteral(e))return e.value;if(i.isNullLiteral(e))return null;if(i.isUnaryExpression(e)&&e.operator==="-"&&i.isNumericLiteral(e.argument))return-e.argument.value;if(i.isObjectExpression(e)){const t={};return e.properties.forEach(r=>{if(i.isObjectProperty(r)){const s=i.isIdentifier(r.key)?r.key.name:i.isStringLiteral(r.key)?r.key.value:null;if(!s)throw new Error(`Unsupported key type in zx prop: ${r.key.type}`);t[s]=y(r.value)}else throw new Error(`Unsupported property type in zx prop: ${r.type}. Only static object properties are allowed.`)}),t}throw new Error(`Dynamic expressions are not allowed in zx prop. Found: ${e.type}. Use 'style' prop for dynamic values.`)}function d(e,t){if(!e.includes("zx={"))return null;const r=v.parse(e,{sourceType:"module",plugins:["typescript","jsx"]}),s=new $(e);let o=!1,c="";return(m.default||m)(r,{JSXOpeningElement(l){const n=l.node.attributes.find(u=>i.isJSXAttribute(u)&&u.name.name==="zx");if(n&&(o=!0,i.isJSXExpressionContainer(n.value)&&i.isObjectExpression(n.value.expression))){let u={};try{u=y(n.value.expression)}catch(p){throw new Error(`Error parsing zx prop in ${t}: ${p.message}`)}const g=`zx-${O(JSON.stringify(u))}`,h=x(u,g);c+=h+`
-`;const a=l.node.attributes.find(p=>i.isJSXAttribute(p)&&p.name.name==="className");if(n.start!=null&&n.end!=null&&s.remove(n.start,n.end),a){if(i.isStringLiteral(a.value)&&a.value.start&&a.value.end)s.overwrite(a.value.start,a.value.end,`"${a.value.value} ${g}"`);else if(i.isJSXExpressionContainer(a.value)&&a.value.expression.start&&a.value.expression.end){const p=e.slice(a.value.expression.start,a.value.expression.end);s.overwrite(a.value.expression.start,a.value.expression.end,`\`\${${p}} ${g}\``)}}else s.appendLeft(n.start,` className="${g}" `)}}}),o?(s.prepend(`import '${t}.style-zx.css';
-`),{code:s.toString(),map:s.generateMap({hires:!0}),css:c,hasZx:!0}):null}function k(){const e=new Map;return{name:"vite-plugin-style-zx",enforce:"pre",resolveId(t){return t.endsWith(".style-zx.css")?t:null},load(t){if(t.endsWith(".style-zx.css")){const r=t.replace(".style-zx.css","");return e.get(r)||""}return null},transform(t,r){if(!/\.(t|j)sx?$/.test(r))return null;const s=d(t,r);return s&&s.hasZx?(e.set(r,s.css),{code:s.code,map:s.map}):null},async handleHotUpdate({file:t,modules:r,read:s,server:o}){if(!/\.(t|j)sx?$/.test(t))return;const c=await s(),f=d(c,t);if(f&&f.hasZx){e.set(t,f.css);const l=`${t}.style-zx.css`,n=o.moduleGraph.getModuleById(l);if(n)return[...r,n]}}}}module.exports=k;
+"use strict";const b=require("@babel/parser"),g=require("@babel/traverse"),S=require("@babel/types"),$=require("magic-string"),w=require("crypto");function z(e){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const n in e)if(n!=="default"){const r=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(t,n,r.get?r:{enumerable:!0,get:()=>e[n]})}}return t.default=e,Object.freeze(t)}const i=z(S),E={m:["margin"],mt:["marginTop"],mr:["marginRight"],mb:["marginBottom"],ml:["marginLeft"],mx:["marginLeft","marginRight"],my:["marginTop","marginBottom"],p:["padding"],pt:["paddingTop"],pr:["paddingRight"],pb:["paddingBottom"],pl:["paddingLeft"],px:["paddingLeft","paddingRight"],py:["paddingTop","paddingBottom"],bg:["backgroundColor"]},L=new Set(["opacity","fontWeight","lineHeight","zIndex","flex","flexGrow","flexShrink","order"]);function j(e){return e.replace(/[A-Z]/g,t=>`-${t.toLowerCase()}`)}function N(e,t){return typeof t=="number"&&!L.has(e)?`${t}px`:typeof t=="string"&&t.startsWith("$theme.")?`var(${t.replace("$theme.","--theme-").replace(/\./g,"-")})`:String(t)}function x(e,t){let n=`.${t} {`,r="";for(const s in e){const p=e[s];if(s.startsWith("&")||s.startsWith(":")||s.startsWith("@")){const u=s.replace(/&/g,`.${t}`),l=x(p,"TEMP_CLASS").replace(".TEMP_CLASS",u);r+=`
+${l}`;continue}(E[s]||[s]).forEach(u=>{const l=j(u),c=N(u,p);n+=`
+  ${l}: ${c};`})}return n+=`
+}`,n+r}function O(e){return w.createHash("md5").update(e).digest("hex").slice(0,8)}function h(e){if(i.isStringLiteral(e)||i.isNumericLiteral(e)||i.isBooleanLiteral(e))return e.value;if(i.isNullLiteral(e))return null;if(i.isUnaryExpression(e)&&e.operator==="-"&&i.isNumericLiteral(e.argument))return-e.argument.value;if(i.isObjectExpression(e)){const t={};return e.properties.forEach(n=>{if(i.isObjectProperty(n)){const r=i.isIdentifier(n.key)?n.key.name:i.isStringLiteral(n.key)?n.key.value:null;if(!r)throw new Error(`Unsupported key type in zx prop: ${n.key.type}`);t[r]=h(n.value)}else throw new Error(`Unsupported property type in zx prop: ${n.type}. Only static object properties are allowed.`)}),t}throw new Error(`Dynamic expressions are not allowed in zx prop. Found: ${e.type}. Use 'style' prop for dynamic values.`)}function y(e,t,n){if(!e.includes("zx={"))return null;const r=b.parse(e,{sourceType:"module",plugins:["typescript","jsx"]}),s=new $(e);let p=!1,a="";return(g.default||g)(r,{JSXOpeningElement(l){const c=l.node.attributes.find(f=>i.isJSXAttribute(f)&&f.name.name==="zx");if(c&&(p=!0,i.isJSXExpressionContainer(c.value)&&i.isObjectExpression(c.value.expression))){let f={};try{f=h(c.value.expression)}catch(m){throw new Error(`Error parsing zx prop in ${t}: ${m.message}`)}const d=`zx-${O(JSON.stringify(f))}`,v=x(f,d);a+=v+`
+`;const o=l.node.attributes.find(m=>i.isJSXAttribute(m)&&m.name.name==="className");if(c.start!=null&&c.end!=null&&s.remove(c.start,c.end),o){if(i.isStringLiteral(o.value)&&o.value.start&&o.value.end)s.overwrite(o.value.start,o.value.end,`"${o.value.value} ${d}"`);else if(i.isJSXExpressionContainer(o.value)&&o.value.expression.start&&o.value.expression.end){const m=e.slice(o.value.expression.start,o.value.expression.end);s.overwrite(o.value.expression.start,o.value.expression.end,`\`\${${m}} ${d}\``)}}else s.appendLeft(c.start,` className="${d}" `)}}}),p?(n&&s.prepend(`import '${t}.style-zx.css';
+`),{code:s.toString(),map:s.generateMap({hires:!0}),css:a,hasZx:!0}):null}function k(){const e=new Map;let t;const n=new Set;return[{name:"vite-plugin-style-zx",enforce:"pre",configResolved(r){t=r},resolveId(r){return r.endsWith(".style-zx.css")?r:null},load(r){if(r.endsWith(".style-zx.css")){const s=r.replace(".style-zx.css","");return e.get(s)||""}return null},transform(r,s){if(!/\.(t|j)sx?$/.test(s))return null;const p=t.command==="serve",a=y(r,s,p);return a&&a.hasZx?(e.set(s,a.css),t.command==="build"&&n.add(a.css),{code:a.code,map:a.map}):null},async handleHotUpdate({file:r,modules:s,read:p,server:a}){if(!/\.(t|j)sx?$/.test(r))return;const u=await p(),l=y(u,r,!0);if(l&&l.hasZx){e.set(r,l.css);const c=`${r}.style-zx.css`,f=a.moduleGraph.getModuleById(c);if(f)return[...s,f]}}},{name:"vite-plugin-style-zx-post",enforce:"post",generateBundle(r,s){if(t.command==="build"&&n.size>0){const p=this.emitFile({type:"asset",name:"style-zx.css",source:Array.from(n).join(`
+`)}),a=this.getFileName(p);for(const u of Object.values(s))if(u.type==="asset"&&u.fileName.endsWith(".html")){const l=u.source;l.includes("</head>")&&(u.source=l.replace("</head>",`<link rel="stylesheet" href="/${a}">
+</head>`))}}}}]}module.exports=k;

package/dist/plugin.js

@@ -1,8 +1,8 @@
-import { parse as v } from "@babel/parser";
+import { parse as $ } from "@babel/parser";
 import g from "@babel/traverse";
 import * as i from "@babel/types";
-import $ from "magic-string";
-import S from "crypto";
+import S from "magic-string";
+import b from "crypto";
 const w = {
   m: ["margin"],
   mt: ["marginTop"],
@@ -19,7 +19,7 @@ const w = {
   px: ["paddingLeft", "paddingRight"],
   py: ["paddingTop", "paddingBottom"],
   bg: ["backgroundColor"]
-}, E = /* @__PURE__ */ new Set([
+}, z = /* @__PURE__ */ new Set([
   "opacity",
   "fontWeight",
   "lineHeight",
@@ -29,135 +29,165 @@ const w = {
   "flexShrink",
   "order"
 ]);
-function b(e) {
-  return e.replace(/[A-Z]/g, (t) => `-${t.toLowerCase()}`);
+function E(e) {
+  return e.replace(/[A-Z]/g, (r) => `-${r.toLowerCase()}`);
 }
-function L(e, t) {
-  return typeof t == "number" && !E.has(e) ? `${t}px` : typeof t == "string" && t.startsWith("$theme.") ? `var(${t.replace("$theme.", "--theme-").replace(/\./g, "-")})` : String(t);
+function L(e, r) {
+  return typeof r == "number" && !z.has(e) ? `${r}px` : typeof r == "string" && r.startsWith("$theme.") ? `var(${r.replace("$theme.", "--theme-").replace(/\./g, "-")})` : String(r);
 }
-function x(e, t) {
-  let r = `.${t} {`, s = "";
-  for (const o in e) {
-    const p = e[o];
-    if (o.startsWith("&") || o.startsWith(":") || o.startsWith("@")) {
-      const l = o.replace(/&/g, `.${t}`), n = x(p, "TEMP_CLASS").replace(".TEMP_CLASS", l);
+function y(e, r) {
+  let n = `.${r} {`, s = "";
+  for (const t in e) {
+    const p = e[t];
+    if (t.startsWith("&") || t.startsWith(":") || t.startsWith("@")) {
+      const u = t.replace(/&/g, `.${r}`), l = y(p, "TEMP_CLASS").replace(".TEMP_CLASS", u);
       s += `
-${n}`;
+${l}`;
       continue;
     }
-    (w[o] || [o]).forEach((l) => {
-      const n = b(l), u = L(l, p);
-      r += `
-  ${n}: ${u};`;
+    (w[t] || [t]).forEach((u) => {
+      const l = E(u), c = L(u, p);
+      n += `
+  ${l}: ${c};`;
     });
   }
-  return r += `
-}`, r + s;
+  return n += `
+}`, n + s;
 }
-function z(e) {
-  return S.createHash("md5").update(e).digest("hex").slice(0, 8);
+function N(e) {
+  return b.createHash("md5").update(e).digest("hex").slice(0, 8);
 }
-function y(e) {
+function h(e) {
   if (i.isStringLiteral(e) || i.isNumericLiteral(e) || i.isBooleanLiteral(e)) return e.value;
   if (i.isNullLiteral(e)) return null;
   if (i.isUnaryExpression(e) && e.operator === "-" && i.isNumericLiteral(e.argument))
     return -e.argument.value;
   if (i.isObjectExpression(e)) {
-    const t = {};
-    return e.properties.forEach((r) => {
-      if (i.isObjectProperty(r)) {
-        const s = i.isIdentifier(r.key) ? r.key.name : i.isStringLiteral(r.key) ? r.key.value : null;
+    const r = {};
+    return e.properties.forEach((n) => {
+      if (i.isObjectProperty(n)) {
+        const s = i.isIdentifier(n.key) ? n.key.name : i.isStringLiteral(n.key) ? n.key.value : null;
         if (!s)
-          throw new Error(`Unsupported key type in zx prop: ${r.key.type}`);
-        t[s] = y(r.value);
+          throw new Error(`Unsupported key type in zx prop: ${n.key.type}`);
+        r[s] = h(n.value);
       } else
-        throw new Error(`Unsupported property type in zx prop: ${r.type}. Only static object properties are allowed.`);
-    }), t;
+        throw new Error(`Unsupported property type in zx prop: ${n.type}. Only static object properties are allowed.`);
+    }), r;
   }
   throw new Error(`Dynamic expressions are not allowed in zx prop. Found: ${e.type}. Use 'style' prop for dynamic values.`);
 }
-function d(e, t) {
+function x(e, r, n) {
   if (!e.includes("zx={"))
     return null;
-  const r = v(e, {
+  const s = $(e, {
     sourceType: "module",
     plugins: ["typescript", "jsx"]
-  }), s = new $(e);
-  let o = !1, p = "";
-  return (g.default || g)(r, {
+  }), t = new S(e);
+  let p = !1, a = "";
+  return (g.default || g)(s, {
     JSXOpeningElement(l) {
-      const n = l.node.attributes.find(
-        (u) => i.isJSXAttribute(u) && u.name.name === "zx"
+      const c = l.node.attributes.find(
+        (m) => i.isJSXAttribute(m) && m.name.name === "zx"
       );
-      if (n && (o = !0, i.isJSXExpressionContainer(n.value) && i.isObjectExpression(n.value.expression))) {
-        let u = {};
+      if (c && (p = !0, i.isJSXExpressionContainer(c.value) && i.isObjectExpression(c.value.expression))) {
+        let m = {};
         try {
-          u = y(n.value.expression);
-        } catch (c) {
-          throw new Error(`Error parsing zx prop in ${t}: ${c.message}`);
+          m = h(c.value.expression);
+        } catch (f) {
+          throw new Error(`Error parsing zx prop in ${r}: ${f.message}`);
         }
-        const f = `zx-${z(JSON.stringify(u))}`, h = x(u, f);
-        p += h + `
+        const d = `zx-${N(JSON.stringify(m))}`, v = y(m, d);
+        a += v + `
 `;
-        const a = l.node.attributes.find(
-          (c) => i.isJSXAttribute(c) && c.name.name === "className"
+        const o = l.node.attributes.find(
+          (f) => i.isJSXAttribute(f) && f.name.name === "className"
         );
-        if (n.start != null && n.end != null && s.remove(n.start, n.end), a) {
-          if (i.isStringLiteral(a.value) && a.value.start && a.value.end)
-            s.overwrite(a.value.start, a.value.end, `"${a.value.value} ${f}"`);
-          else if (i.isJSXExpressionContainer(a.value) && a.value.expression.start && a.value.expression.end) {
-            const c = e.slice(a.value.expression.start, a.value.expression.end);
-            s.overwrite(a.value.expression.start, a.value.expression.end, `\`\${${c}} ${f}\``);
+        if (c.start != null && c.end != null && t.remove(c.start, c.end), o) {
+          if (i.isStringLiteral(o.value) && o.value.start && o.value.end)
+            t.overwrite(o.value.start, o.value.end, `"${o.value.value} ${d}"`);
+          else if (i.isJSXExpressionContainer(o.value) && o.value.expression.start && o.value.expression.end) {
+            const f = e.slice(o.value.expression.start, o.value.expression.end);
+            t.overwrite(o.value.expression.start, o.value.expression.end, `\`\${${f}} ${d}\``);
           }
         } else
-          s.appendLeft(n.start, ` className="${f}" `);
+          t.appendLeft(c.start, ` className="${d}" `);
       }
     }
-  }), o ? (s.prepend(`import '${t}.style-zx.css';
+  }), p ? (n && t.prepend(`import '${r}.style-zx.css';
 `), {
-    code: s.toString(),
-    map: s.generateMap({ hires: !0 }),
-    css: p,
+    code: t.toString(),
+    map: t.generateMap({ hires: !0 }),
+    css: a,
     hasZx: !0
   }) : null;
 }
-function C() {
+function I() {
   const e = /* @__PURE__ */ new Map();
-  return {
-    name: "vite-plugin-style-zx",
-    enforce: "pre",
-    resolveId(t) {
-      return t.endsWith(".style-zx.css") ? t : null;
-    },
-    load(t) {
-      if (t.endsWith(".style-zx.css")) {
-        const r = t.replace(".style-zx.css", "");
-        return e.get(r) || "";
-      }
-      return null;
-    },
-    transform(t, r) {
-      if (!/\.(t|j)sx?$/.test(r))
+  let r;
+  const n = /* @__PURE__ */ new Set();
+  return [
+    {
+      name: "vite-plugin-style-zx",
+      enforce: "pre",
+      configResolved(s) {
+        r = s;
+      },
+      resolveId(s) {
+        return s.endsWith(".style-zx.css") ? s : null;
+      },
+      load(s) {
+        if (s.endsWith(".style-zx.css")) {
+          const t = s.replace(".style-zx.css", "");
+          return e.get(t) || "";
+        }
         return null;
-      const s = d(t, r);
-      return s && s.hasZx ? (e.set(r, s.css), {
-        code: s.code,
-        map: s.map
-      }) : null;
+      },
+      transform(s, t) {
+        if (!/\.(t|j)sx?$/.test(t))
+          return null;
+        const p = r.command === "serve", a = x(s, t, p);
+        return a && a.hasZx ? (e.set(t, a.css), r.command === "build" && n.add(a.css), {
+          code: a.code,
+          map: a.map
+        }) : null;
+      },
+      async handleHotUpdate({ file: s, modules: t, read: p, server: a }) {
+        if (!/\.(t|j)sx?$/.test(s))
+          return;
+        const u = await p(), l = x(u, s, !0);
+        if (l && l.hasZx) {
+          e.set(s, l.css);
+          const c = `${s}.style-zx.css`, m = a.moduleGraph.getModuleById(c);
+          if (m)
+            return [...t, m];
+        }
+      }
     },
-    async handleHotUpdate({ file: t, modules: r, read: s, server: o }) {
-      if (!/\.(t|j)sx?$/.test(t))
-        return;
-      const p = await s(), m = d(p, t);
-      if (m && m.hasZx) {
-        e.set(t, m.css);
-        const l = `${t}.style-zx.css`, n = o.moduleGraph.getModuleById(l);
-        if (n)
-          return [...r, n];
+    {
+      name: "vite-plugin-style-zx-post",
+      enforce: "post",
+      generateBundle(s, t) {
+        if (r.command === "build" && n.size > 0) {
+          const p = this.emitFile({
+            type: "asset",
+            name: "style-zx.css",
+            source: Array.from(n).join(`
+`)
+          }), a = this.getFileName(p);
+          for (const u of Object.values(t))
+            if (u.type === "asset" && u.fileName.endsWith(".html")) {
+              const l = u.source;
+              l.includes("</head>") && (u.source = l.replace(
+                "</head>",
+                `<link rel="stylesheet" href="/${a}">
+</head>`
+              ));
+            }
+        }
       }
     }
-  };
+  ];
 }
 export {
-  C as default
+  I as default
 };

package/dist/vite-plugin-style-zx/index.d.ts

@@ -1,2 +1,2 @@
 import { Plugin } from 'vite';
-export default function styleZx(): Plugin;
+export default function styleZx(): Plugin[];

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "style-zx",
   "private": false,
-  "version": "0.0.6",
+  "version": "0.0.8",
   "license": "MIT",
   "type": "module",
   "repository": {