style-zx 0.0.5 → 0.0.7

package/dist/index.d.ts

@@ -1 +1,2 @@
+export * from './style-zx/index'
 export {}

package/dist/plugin.cjs

@@ -1,6 +1,6 @@
-"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 $=require("@babel/parser"),x=require("@babel/traverse"),b=require("@babel/types"),w=require("magic-string"),E=require("crypto");function L(e){const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const s=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(r,t,s.get?s:{enumerable:!0,get:()=>e[t]})}}return r.default=e,Object.freeze(r)}const a=L(b),j={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"]},z=new Set(["opacity","fontWeight","lineHeight","zIndex","flex","flexGrow","flexShrink","order"]);function O(e){return e.replace(/[A-Z]/g,r=>`-${r.toLowerCase()}`)}function M(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 v(e,r){let t=`.${r} {`,s="";for(const n in e){const o=e[n];if(n.startsWith("&")||n.startsWith(":")||n.startsWith("@")){const u=n.replace(/&/g,`.${r}`),l=v(o,"TEMP_CLASS").replace(".TEMP_CLASS",u);s+=`
+${l}`;continue}(j[n]||[n]).forEach(u=>{const l=O(u),c=M(u,o);t+=`
+  ${l}: ${c};`})}return t+=`
+}`,t+s}function k(e){return E.createHash("md5").update(e).digest("hex").slice(0,8)}function S(e){if(a.isStringLiteral(e)||a.isNumericLiteral(e)||a.isBooleanLiteral(e))return e.value;if(a.isNullLiteral(e))return null;if(a.isUnaryExpression(e)&&e.operator==="-"&&a.isNumericLiteral(e.argument))return-e.argument.value;if(a.isObjectExpression(e)){const r={};return e.properties.forEach(t=>{if(a.isObjectProperty(t)){const s=a.isIdentifier(t.key)?t.key.name:a.isStringLiteral(t.key)?t.key.value:null;if(!s)throw new Error(`Unsupported key type in zx prop: ${t.key.type}`);r[s]=S(t.value)}else throw new Error(`Unsupported property type in zx prop: ${t.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.`)}const y=new Map,d=new Map;function h(e,r){if(!e.includes("zx={"))return d.has(r)?(d.delete(r),{code:e,map:null,hasZx:!1}):null;const t=$.parse(e,{sourceType:"module",plugins:["typescript","jsx"]}),s=new w(e);let n=!1;const o=new Set;return(x.default||x)(t,{JSXOpeningElement(u){const l=u.node.attributes.find(c=>a.isJSXAttribute(c)&&c.name.name==="zx");if(l&&(n=!0,a.isJSXExpressionContainer(l.value)&&a.isObjectExpression(l.value.expression))){let c={};try{c=S(l.value.expression)}catch(p){throw new Error(`Error parsing zx prop in ${r}: ${p.message}`)}const m=k(JSON.stringify(c)),g=`zx-${m}`;if(!y.has(m)){const p=v(c,g);y.set(m,p)}o.add(m);const i=u.node.attributes.find(p=>a.isJSXAttribute(p)&&p.name.name==="className");if(l.start!=null&&l.end!=null&&s.remove(l.start,l.end),i){if(a.isStringLiteral(i.value)&&i.value.start&&i.value.end)s.overwrite(i.value.start,i.value.end,`"${i.value.value} ${g}"`);else if(a.isJSXExpressionContainer(i.value)&&i.value.expression.start&&i.value.expression.end){const p=e.slice(i.value.expression.start,i.value.expression.end);s.overwrite(i.value.expression.start,i.value.expression.end,`\`\${${p}} ${g}\``)}}else s.appendLeft(l.start,` className="${g}" `)}}}),n?(d.set(r,o),s.prepend(`import 'virtual:style-zx.css';
+`),{code:s.toString(),map:s.generateMap({hires:!0}),hasZx:!0}):(d.delete(r),null)}function N(){const e="virtual:style-zx.css",r="\0"+e;return{name:"vite-plugin-style-zx",enforce:"pre",resolveId(t){return t===e?r:null},load(t){if(t===r){const s=new Set;for(const o of d.values())o.forEach(f=>s.add(f));let n="";return s.forEach(o=>{y.has(o)&&(n+=y.get(o)+`
+`)}),n}return null},transform(t,s){if(!/\.(t|j)sx?$/.test(s))return null;const n=h(t,s);return n&&n.hasZx?{code:n.code,map:n.map}:null},async handleHotUpdate({file:t,modules:s,read:n,server:o}){if(!/\.(t|j)sx?$/.test(t))return;const f=await n();h(f,t);const u=o.moduleGraph.getModuleById(r);if(u)return o.moduleGraph.invalidateModule(u),[...s,u]}}}module.exports=N;

package/dist/plugin.d.ts

@@ -1 +1,4 @@
 export {}
+import _default from './vite-plugin-style-zx/index'
+export default _default
+export {}

package/dist/plugin.js

@@ -1,9 +1,9 @@
-import { parse as v } from "@babel/parser";
-import g from "@babel/traverse";
-import * as i from "@babel/types";
-import $ from "magic-string";
-import S from "crypto";
-const w = {
+import { parse as $ } from "@babel/parser";
+import h from "@babel/traverse";
+import * as a from "@babel/types";
+import w from "magic-string";
+import E from "crypto";
+const b = {
   m: ["margin"],
   mt: ["marginTop"],
   mr: ["marginRight"],
@@ -19,7 +19,7 @@ const w = {
   px: ["paddingLeft", "paddingRight"],
   py: ["paddingTop", "paddingBottom"],
   bg: ["backgroundColor"]
-}, E = /* @__PURE__ */ new Set([
+}, L = /* @__PURE__ */ new Set([
   "opacity",
   "fontWeight",
   "lineHeight",
@@ -29,135 +29,143 @@ const w = {
   "flexShrink",
   "order"
 ]);
-function b(e) {
+function z(e) {
   return e.replace(/[A-Z]/g, (t) => `-${t.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 M(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) {
+function v(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);
+  for (const n in e) {
+    const o = e[n];
+    if (n.startsWith("&") || n.startsWith(":") || n.startsWith("@")) {
+      const u = n.replace(/&/g, `.${t}`), l = v(o, "TEMP_CLASS").replace(".TEMP_CLASS", u);
       s += `
-${n}`;
+${l}`;
       continue;
     }
-    (w[o] || [o]).forEach((l) => {
-      const n = b(l), u = L(l, p);
+    (b[n] || [n]).forEach((u) => {
+      const l = z(u), p = M(u, o);
       r += `
-  ${n}: ${u};`;
+  ${l}: ${p};`;
     });
   }
   return r += `
 }`, r + s;
 }
-function z(e) {
-  return S.createHash("md5").update(e).digest("hex").slice(0, 8);
+function k(e) {
+  return E.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))
+function S(e) {
+  if (a.isStringLiteral(e) || a.isNumericLiteral(e) || a.isBooleanLiteral(e)) return e.value;
+  if (a.isNullLiteral(e)) return null;
+  if (a.isUnaryExpression(e) && e.operator === "-" && a.isNumericLiteral(e.argument))
     return -e.argument.value;
-  if (i.isObjectExpression(e)) {
+  if (a.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 (a.isObjectProperty(r)) {
+        const s = a.isIdentifier(r.key) ? r.key.name : a.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);
+        t[s] = S(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) {
+const x = /* @__PURE__ */ new Map(), m = /* @__PURE__ */ new Map();
+function y(e, t) {
   if (!e.includes("zx={"))
-    return null;
-  const r = v(e, {
+    return m.has(t) ? (m.delete(t), { code: e, map: null, hasZx: !1 }) : null;
+  const r = $(e, {
     sourceType: "module",
     plugins: ["typescript", "jsx"]
-  }), s = new $(e);
-  let o = !1, p = "";
-  return (g.default || g)(r, {
-    JSXOpeningElement(l) {
-      const n = l.node.attributes.find(
-        (u) => i.isJSXAttribute(u) && u.name.name === "zx"
+  }), s = new w(e);
+  let n = !1;
+  const o = /* @__PURE__ */ new Set();
+  return (h.default || h)(r, {
+    JSXOpeningElement(u) {
+      const l = u.node.attributes.find(
+        (p) => a.isJSXAttribute(p) && p.name.name === "zx"
       );
-      if (n && (o = !0, i.isJSXExpressionContainer(n.value) && i.isObjectExpression(n.value.expression))) {
-        let u = {};
+      if (l && (n = !0, a.isJSXExpressionContainer(l.value) && a.isObjectExpression(l.value.expression))) {
+        let p = {};
         try {
-          u = y(n.value.expression);
+          p = S(l.value.expression);
         } catch (c) {
           throw new Error(`Error parsing zx prop in ${t}: ${c.message}`);
         }
-        const f = `zx-${z(JSON.stringify(u))}`, h = x(u, f);
-        p += h + `
-`;
-        const a = l.node.attributes.find(
-          (c) => i.isJSXAttribute(c) && c.name.name === "className"
+        const d = k(JSON.stringify(p)), g = `zx-${d}`;
+        if (!x.has(d)) {
+          const c = v(p, g);
+          x.set(d, c);
+        }
+        o.add(d);
+        const i = u.node.attributes.find(
+          (c) => a.isJSXAttribute(c) && c.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 (l.start != null && l.end != null && s.remove(l.start, l.end), i) {
+          if (a.isStringLiteral(i.value) && i.value.start && i.value.end)
+            s.overwrite(i.value.start, i.value.end, `"${i.value.value} ${g}"`);
+          else if (a.isJSXExpressionContainer(i.value) && i.value.expression.start && i.value.expression.end) {
+            const c = e.slice(i.value.expression.start, i.value.expression.end);
+            s.overwrite(i.value.expression.start, i.value.expression.end, `\`\${${c}} ${g}\``);
           }
         } else
-          s.appendLeft(n.start, ` className="${f}" `);
+          s.appendLeft(l.start, ` className="${g}" `);
       }
     }
-  }), o ? (s.prepend(`import '${t}.style-zx.css';
+  }), n ? (m.set(t, o), s.prepend(`import 'virtual:style-zx.css';
 `), {
     code: s.toString(),
     map: s.generateMap({ hires: !0 }),
-    css: p,
     hasZx: !0
-  }) : null;
+  }) : (m.delete(t), null);
 }
-function C() {
-  const e = /* @__PURE__ */ new Map();
+function I() {
+  const e = "virtual:style-zx.css", t = "\0" + e;
   return {
     name: "vite-plugin-style-zx",
     enforce: "pre",
-    resolveId(t) {
-      return t.endsWith(".style-zx.css") ? t : null;
+    resolveId(r) {
+      return r === e ? t : null;
     },
-    load(t) {
-      if (t.endsWith(".style-zx.css")) {
-        const r = t.replace(".style-zx.css", "");
-        return e.get(r) || "";
+    load(r) {
+      if (r === t) {
+        const s = /* @__PURE__ */ new Set();
+        for (const o of m.values())
+          o.forEach((f) => s.add(f));
+        let n = "";
+        return s.forEach((o) => {
+          x.has(o) && (n += x.get(o) + `
+`);
+        }), n;
       }
       return null;
     },
-    transform(t, r) {
-      if (!/\.(t|j)sx?$/.test(r))
+    transform(r, s) {
+      if (!/\.(t|j)sx?$/.test(s))
         return null;
-      const s = d(t, r);
-      return s && s.hasZx ? (e.set(r, s.css), {
-        code: s.code,
-        map: s.map
-      }) : null;
+      const n = y(r, s);
+      return n && n.hasZx ? {
+        code: n.code,
+        map: n.map
+      } : null;
     },
-    async handleHotUpdate({ file: t, modules: r, read: s, server: o }) {
-      if (!/\.(t|j)sx?$/.test(t))
+    async handleHotUpdate({ file: r, modules: s, read: n, server: o }) {
+      if (!/\.(t|j)sx?$/.test(r))
         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];
-      }
+      const f = await n();
+      y(f, r);
+      const u = o.moduleGraph.getModuleById(t);
+      if (u)
+        return o.moduleGraph.invalidateModule(u), [...s, u];
     }
   };
 }
 export {
-  C as default
+  I as default
 };

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

@@ -0,0 +1,25 @@
+import { CSSProperties } from 'react';
+export { createTheme, useTheme } from './theme';
+export interface ZxStyle extends CSSProperties {
+    [key: string]: any;
+    m?: number | string;
+    mt?: number | string;
+    mr?: number | string;
+    mb?: number | string;
+    ml?: number | string;
+    mx?: number | string;
+    my?: number | string;
+    p?: number | string;
+    pt?: number | string;
+    pr?: number | string;
+    pb?: number | string;
+    pl?: number | string;
+    px?: number | string;
+    py?: number | string;
+    bg?: string;
+}
+declare module 'react' {
+    interface HTMLAttributes<T> {
+        zx?: ZxStyle;
+    }
+}

package/dist/style-zx/theme.d.ts

@@ -0,0 +1,2 @@
+export declare function createTheme<T extends object>(themeConfig: T): T;
+export declare function useTheme<T = any>(): T;

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

@@ -0,0 +1 @@
+export declare function compileStyle(style: any, className: string): string;

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

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

package/package.json

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