zss-engine 0.2.5 → 0.2.7

package/dist/index.js

@@ -1 +1,32 @@
-"use strict";var __createBinding=this&&this.__createBinding||(Object.create?function(e,r,t,n){if(n===undefined)n=t;var i=Object.getOwnPropertyDescriptor(r,t);if(!i||("get"in i?!r.__esModule:i.writable||i.configurable)){i={enumerable:true,get:function(){return r[t]}}}Object.defineProperty(e,n,i)}:function(e,r,t,n){if(n===undefined)n=t;e[n]=r[t]});var __exportStar=this&&this.__exportStar||function(e,r){for(var t in e)if(t!=="default"&&!Object.prototype.hasOwnProperty.call(r,t))__createBinding(r,e,t)};Object.defineProperty(exports,"__esModule",{value:true});exports.transpiler=exports.build=exports.getServerCSS=exports.injectServerCSS=exports.injectClientGlobalCSS=exports.injectClientCSS=exports.genBase36Hash=void 0;__exportStar(require("./types"),exports);__exportStar(require("./utils/helper"),exports);var hash_1=require("./utils/hash");Object.defineProperty(exports,"genBase36Hash",{enumerable:true,get:function(){return hash_1.genBase36Hash}});var inject_client_css_1=require("./utils/inject-client-css");Object.defineProperty(exports,"injectClientCSS",{enumerable:true,get:function(){return inject_client_css_1.injectClientCSS}});var inject_client_global_css_1=require("./utils/inject-client-global-css");Object.defineProperty(exports,"injectClientGlobalCSS",{enumerable:true,get:function(){return inject_client_global_css_1.injectClientGlobalCSS}});var inject_server_css_1=require("./utils/inject-server-css");Object.defineProperty(exports,"injectServerCSS",{enumerable:true,get:function(){return inject_server_css_1.injectServerCSS}});Object.defineProperty(exports,"getServerCSS",{enumerable:true,get:function(){return inject_server_css_1.getServerCSS}});var build_1=require("./utils/build");Object.defineProperty(exports,"build",{enumerable:true,get:function(){return build_1.build}});var transpiler_1=require("./utils/transpiler");Object.defineProperty(exports,"transpiler",{enumerable:true,get:function(){return transpiler_1.transpiler}});
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.transpiler = exports.build = exports.getServerCSS = exports.injectServerCSS = exports.injectClientGlobalCSS = exports.injectClientCSS = exports.genBase36Hash = void 0;
+__exportStar(require("./types"), exports);
+__exportStar(require("./utils/helper"), exports);
+var hash_1 = require("./utils/hash");
+Object.defineProperty(exports, "genBase36Hash", { enumerable: true, get: function () { return hash_1.genBase36Hash; } });
+var inject_client_css_1 = require("./utils/inject-client-css");
+Object.defineProperty(exports, "injectClientCSS", { enumerable: true, get: function () { return inject_client_css_1.injectClientCSS; } });
+var inject_client_global_css_1 = require("./utils/inject-client-global-css");
+Object.defineProperty(exports, "injectClientGlobalCSS", { enumerable: true, get: function () { return inject_client_global_css_1.injectClientGlobalCSS; } });
+var inject_server_css_1 = require("./utils/inject-server-css");
+Object.defineProperty(exports, "injectServerCSS", { enumerable: true, get: function () { return inject_server_css_1.injectServerCSS; } });
+Object.defineProperty(exports, "getServerCSS", { enumerable: true, get: function () { return inject_server_css_1.getServerCSS; } });
+var build_1 = require("./utils/build");
+Object.defineProperty(exports, "build", { enumerable: true, get: function () { return build_1.build; } });
+var transpiler_1 = require("./utils/transpiler");
+Object.defineProperty(exports, "transpiler", { enumerable: true, get: function () { return transpiler_1.transpiler; } });

package/dist/index.mjs

@@ -1 +1,8 @@
-export*from"./types";export*from"./utils/helper";export{genBase36Hash}from"./utils/hash";export{injectClientCSS}from"./utils/inject-client-css";export{injectClientGlobalCSS}from"./utils/inject-client-global-css";export{injectServerCSS,getServerCSS}from"./utils/inject-server-css";export{build}from"./utils/build";export{transpiler}from"./utils/transpiler";
+export * from './types';
+export * from './utils/helper';
+export { genBase36Hash } from './utils/hash';
+export { injectClientCSS } from './utils/inject-client-css';
+export { injectClientGlobalCSS } from './utils/inject-client-global-css';
+export { injectServerCSS, getServerCSS } from './utils/inject-server-css';
+export { build } from './utils/build';
+export { transpiler } from './utils/transpiler';

package/dist/types/common/css-properties.js

@@ -1 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:true});
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/types/common/css-properties.mjs

@@ -1 +1 @@
-export{};
+export {};

package/dist/types/common/css-property.js

@@ -1 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:true});
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/types/common/css-property.mjs

@@ -1 +1 @@
-export{};
+export {};

package/dist/types/index.js

@@ -1 +1,21 @@
-"use strict";var __createBinding=this&&this.__createBinding||(Object.create?function(e,r,t,i){if(i===undefined)i=t;var o=Object.getOwnPropertyDescriptor(r,t);if(!o||("get"in o?!r.__esModule:o.writable||o.configurable)){o={enumerable:true,get:function(){return r[t]}}}Object.defineProperty(e,i,o)}:function(e,r,t,i){if(i===undefined)i=t;e[i]=r[t]});var __exportStar=this&&this.__exportStar||function(e,r){for(var t in e)if(t!=="default"&&!Object.prototype.hasOwnProperty.call(r,t))__createBinding(r,e,t)};Object.defineProperty(exports,"__esModule",{value:true});__exportStar(require("./common/css-properties"),exports);__exportStar(require("./common/css-property"),exports);__exportStar(require("./main/create"),exports);__exportStar(require("./main/global"),exports);__exportStar(require("./main/vars"),exports);
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./common/css-properties"), exports);
+__exportStar(require("./common/css-property"), exports);
+__exportStar(require("./main/create"), exports);
+__exportStar(require("./main/global"), exports);
+__exportStar(require("./main/vars"), exports);

package/dist/types/index.mjs

@@ -1 +1,5 @@
-export*from"./common/css-properties";export*from"./common/css-property";export*from"./main/create";export*from"./main/global";export*from"./main/vars";
+export * from './common/css-properties';
+export * from './common/css-property';
+export * from './main/create';
+export * from './main/global';
+export * from './main/vars';

package/dist/types/main/create.js

@@ -1 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:true});
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/types/main/create.mjs

@@ -1 +1 @@
-export{};
+export {};

package/dist/types/main/global.js

@@ -1 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:true});
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/types/main/global.mjs

@@ -1 +1 @@
-export{};
+export {};

package/dist/types/main/vars.js

@@ -1 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:true});
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/types/main/vars.mjs

@@ -1 +1 @@
-export{};
+export {};

package/dist/utils/build.js

@@ -1 +1,27 @@
-"use server";"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.build=void 0;const helper_1=require("./helper");const build=async(e,r,n)=>{if(!helper_1.isServer)return;const t=require("fs");const{styleText:i}=require("util");const l=n==="--global"?i("underline",`✅Generated global CSS\n\n`):i("underline",`✅Generated create CSS\n\n`);try{if(t.existsSync(r)){const n=t.readFileSync(r,"utf-8");if(!n.includes(e)){t.appendFileSync(r,e,"utf-8");if(process.argv.includes("--log"))console.log(l+e)}}return}catch(e){console.error("Error writing to file:",e)}};exports.build=build;
+'use server';
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.build = void 0;
+const helper_1 = require("./helper");
+const build = async (styleSheet, filePath, global) => {
+    if (!helper_1.isServer)
+        return;
+    const fs = require('fs');
+    const { styleText } = require('util');
+    const message = global === '--global' ? styleText('underline', `✅Generated global CSS\n\n`) : styleText('underline', `✅Generated create CSS\n\n`);
+    try {
+        if (fs.existsSync(filePath)) {
+            const cssData = fs.readFileSync(filePath, 'utf-8');
+            if (!cssData.includes(styleSheet)) {
+                fs.appendFileSync(filePath, styleSheet, 'utf-8');
+                if (process.argv.includes('--log'))
+                    console.log(message + styleSheet);
+            }
+        }
+        return;
+    }
+    catch (error) {
+        console.error('Error writing to file:', error);
+    }
+};
+exports.build = build;

package/dist/utils/build.mjs

@@ -1 +1,23 @@
-"use server";import{isServer}from"./helper";export const build=async(e,r,n)=>{if(!isServer)return;const t=require("fs");const{styleText:i}=require("util");const o=n==="--global"?i("underline",`✅Generated global CSS\n\n`):i("underline",`✅Generated create CSS\n\n`);try{if(t.existsSync(r)){const n=t.readFileSync(r,"utf-8");if(!n.includes(e)){t.appendFileSync(r,e,"utf-8");if(process.argv.includes("--log"))console.log(o+e)}}return}catch(e){console.error("Error writing to file:",e)}};
+'use server';
+import { isServer } from './helper';
+export const build = async (styleSheet, filePath, global) => {
+    if (!isServer)
+        return;
+    const fs = require('fs');
+    const { styleText } = require('util');
+    const message = global === '--global' ? styleText('underline', `✅Generated global CSS\n\n`) : styleText('underline', `✅Generated create CSS\n\n`);
+    try {
+        if (fs.existsSync(filePath)) {
+            const cssData = fs.readFileSync(filePath, 'utf-8');
+            if (!cssData.includes(styleSheet)) {
+                fs.appendFileSync(filePath, styleSheet, 'utf-8');
+                if (process.argv.includes('--log'))
+                    console.log(message + styleSheet);
+            }
+        }
+        return;
+    }
+    catch (error) {
+        console.error('Error writing to file:', error);
+    }
+};

package/dist/utils/hash.js

@@ -1 +1,34 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.genBase36Hash=genBase36Hash;const chars="abcdefghijklmnopqrstuvwxyz0123456789";function simpleHash(e){let t=0;for(let n=0;n<e.length;n++){const s=e.charCodeAt(n);t=(t<<5)-t+s}return Math.abs(t)}function encodeBase36(e){let t="";do{t=chars[e%36]+t;e=Math.floor(e/36)}while(e>0);return t}function getStartingChar(e){const t="abcdefghijklmnopqrstuvwxyz";return t[e%t.length]}function genBase36Hash(e,t){const n=JSON.stringify(e);const s=simpleHash(n);let r=encodeBase36(s);const a=getStartingChar(s);while(r.length<t-1){r=chars[s%chars.length]+r}return a+r.slice(0,t-1)}
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.genBase36Hash = genBase36Hash;
+const chars = 'abcdefghijklmnopqrstuvwxyz0123456789';
+function simpleHash(str) {
+    let hash = 0;
+    for (let i = 0; i < str.length; i++) {
+        const char = str.charCodeAt(i);
+        hash = (hash << 5) - hash + char;
+    }
+    return Math.abs(hash);
+}
+function encodeBase36(num) {
+    let result = '';
+    do {
+        result = chars[num % 36] + result;
+        num = Math.floor(num / 36);
+    } while (num > 0);
+    return result;
+}
+function getStartingChar(hash) {
+    const chars = 'abcdefghijklmnopqrstuvwxyz';
+    return chars[hash % chars.length];
+}
+function genBase36Hash(object, n) {
+    const serialized = JSON.stringify(object);
+    const hash = simpleHash(serialized);
+    let base36Hash = encodeBase36(hash);
+    const startingChar = getStartingChar(hash);
+    while (base36Hash.length < n - 1) {
+        base36Hash = chars[hash % chars.length] + base36Hash;
+    }
+    return startingChar + base36Hash.slice(0, n - 1);
+}

package/dist/utils/hash.mjs

@@ -1 +1,31 @@
-const chars="abcdefghijklmnopqrstuvwxyz0123456789";function simpleHash(t){let e=0;for(let n=0;n<t.length;n++){const r=t.charCodeAt(n);e=(e<<5)-e+r}return Math.abs(e)}function encodeBase36(t){let e="";do{e=chars[t%36]+e;t=Math.floor(t/36)}while(t>0);return e}function getStartingChar(t){const e="abcdefghijklmnopqrstuvwxyz";return e[t%e.length]}export function genBase36Hash(t,e){const n=JSON.stringify(t);const r=simpleHash(n);let s=encodeBase36(r);const a=getStartingChar(r);while(s.length<e-1){s=chars[r%chars.length]+s}return a+s.slice(0,e-1)}
+const chars = 'abcdefghijklmnopqrstuvwxyz0123456789';
+function simpleHash(str) {
+    let hash = 0;
+    for (let i = 0; i < str.length; i++) {
+        const char = str.charCodeAt(i);
+        hash = (hash << 5) - hash + char;
+    }
+    return Math.abs(hash);
+}
+function encodeBase36(num) {
+    let result = '';
+    do {
+        result = chars[num % 36] + result;
+        num = Math.floor(num / 36);
+    } while (num > 0);
+    return result;
+}
+function getStartingChar(hash) {
+    const chars = 'abcdefghijklmnopqrstuvwxyz';
+    return chars[hash % chars.length];
+}
+export function genBase36Hash(object, n) {
+    const serialized = JSON.stringify(object);
+    const hash = simpleHash(serialized);
+    let base36Hash = encodeBase36(hash);
+    const startingChar = getStartingChar(hash);
+    while (base36Hash.length < n - 1) {
+        base36Hash = chars[hash % chars.length] + base36Hash;
+    }
+    return startingChar + base36Hash.slice(0, n - 1);
+}

package/dist/utils/helper.js

@@ -1 +1,21 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.camelToKebabCase=exports.applyCssValue=exports.isDevServer=exports.isDevAndTest=exports.isDevelopment=exports.isServer=void 0;const isWindowDefined=typeof window!=="undefined";const isDocumentDefined=typeof document!=="undefined";exports.isServer=!isWindowDefined||!isDocumentDefined;exports.isDevelopment=process.env.NODE_ENV==="development";exports.isDevAndTest=process.env.NODE_ENV==="development"||process.env.NODE_ENV==="test";exports.isDevServer=exports.isDevelopment&&exports.isServer;const exception=["line-height","font-weight","opacity","scale","z-index","column-count","order","orphans","widows"];const applyCssValue=(e,s)=>{if(typeof e==="number"){return exception.includes(s)?e.toString():e+"px"}return e};exports.applyCssValue=applyCssValue;const camelToKebabCase=e=>e.replace(/([A-Z])/g,"-$1").toLowerCase();exports.camelToKebabCase=camelToKebabCase;
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.camelToKebabCase = exports.applyCssValue = exports.isDevServer = exports.isDevAndTest = exports.isDevelopment = exports.isServer = void 0;
+const isWindowDefined = typeof window !== 'undefined';
+const isDocumentDefined = typeof document !== 'undefined';
+exports.isServer = !isWindowDefined || !isDocumentDefined;
+exports.isDevelopment = process.env.NODE_ENV === 'development';
+exports.isDevAndTest = process.env.NODE_ENV === 'development' || process.env.NODE_ENV === 'test';
+exports.isDevServer = exports.isDevelopment && exports.isServer;
+const exception = ['line-height', 'font-weight', 'opacity', 'scale', 'z-index', 'column-count', 'order', 'orphans', 'widows'];
+const applyCssValue = (value, cssProp) => {
+    if (typeof value === 'number') {
+        return exception.includes(cssProp) ? value.toString() : value + 'px';
+    }
+    return value;
+};
+exports.applyCssValue = applyCssValue;
+const camelToKebabCase = (property) => {
+    return property.replace(/([A-Z])/g, '-$1').toLowerCase();
+};
+exports.camelToKebabCase = camelToKebabCase;

package/dist/utils/helper.mjs

@@ -1 +1,16 @@
-const isWindowDefined=typeof window!=="undefined";const isDocumentDefined=typeof document!=="undefined";export const isServer=!isWindowDefined||!isDocumentDefined;export const isDevelopment=process.env.NODE_ENV==="development";export const isDevAndTest=process.env.NODE_ENV==="development"||process.env.NODE_ENV==="test";export const isDevServer=isDevelopment&&isServer;const exception=["line-height","font-weight","opacity","scale","z-index","column-count","order","orphans","widows"];export const applyCssValue=(e,n)=>{if(typeof e==="number"){return exception.includes(n)?e.toString():e+"px"}return e};export const camelToKebabCase=e=>e.replace(/([A-Z])/g,"-$1").toLowerCase();
+const isWindowDefined = typeof window !== 'undefined';
+const isDocumentDefined = typeof document !== 'undefined';
+export const isServer = !isWindowDefined || !isDocumentDefined;
+export const isDevelopment = process.env.NODE_ENV === 'development';
+export const isDevAndTest = process.env.NODE_ENV === 'development' || process.env.NODE_ENV === 'test';
+export const isDevServer = isDevelopment && isServer;
+const exception = ['line-height', 'font-weight', 'opacity', 'scale', 'z-index', 'column-count', 'order', 'orphans', 'widows'];
+export const applyCssValue = (value, cssProp) => {
+    if (typeof value === 'number') {
+        return exception.includes(cssProp) ? value.toString() : value + 'px';
+    }
+    return value;
+};
+export const camelToKebabCase = (property) => {
+    return property.replace(/([A-Z])/g, '-$1').toLowerCase();
+};

package/dist/utils/inject-client-css.js

@@ -1 +1,51 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.createStyleElement=createStyleElement;exports.injectClientCSS=injectClientCSS;const __1=require("..");const styleSheets={};const hashCache={};function createStyleElement(e){if(document.getElementById(e))return null;const t=document.createElement("style");t.setAttribute("id",e);t.setAttribute("type","text/css");styleSheets[e]=t;document.head.appendChild(t);return styleSheets[e]}function injectClientCSS(e,t){if(__1.isServer)return;requestAnimationFrame((()=>{styleCleanUp()}));hashCache[e]=e;const n=createStyleElement(e);if(n==null)return;n.textContent=t}function styleCleanUp(){requestAnimationFrame((()=>{for(const e in hashCache){const t=document.querySelectorAll(`[class*="${e}"]`);if(t.length===0){removeStyleElement(hashCache[e])}}}))}function removeStyleElement(e){if(styleSheets[e]){delete styleSheets[e];if(hashCache.hasOwnProperty.call(hashCache,e)){delete hashCache[e]}const t=document.getElementById(e);if(t){document.head.removeChild(t)}}}
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.createStyleElement = createStyleElement;
+exports.injectClientCSS = injectClientCSS;
+const __1 = require("..");
+const styleSheets = {};
+const hashCache = {};
+function createStyleElement(hash) {
+    if (document.getElementById(hash))
+        return null;
+    const styleElement = document.createElement('style');
+    styleElement.setAttribute('id', hash);
+    styleElement.setAttribute('type', 'text/css');
+    styleSheets[hash] = styleElement;
+    document.head.appendChild(styleElement);
+    return styleSheets[hash];
+}
+function injectClientCSS(hash, sheet) {
+    if (__1.isServer)
+        return;
+    requestAnimationFrame(() => {
+        styleCleanUp();
+    });
+    hashCache[hash] = hash;
+    const styleElement = createStyleElement(hash);
+    if (styleElement == null)
+        return;
+    styleElement.textContent = sheet;
+}
+function styleCleanUp() {
+    requestAnimationFrame(() => {
+        for (const hash in hashCache) {
+            const classElements = document.querySelectorAll(`[class*="${hash}"]`);
+            if (classElements.length === 0) {
+                removeStyleElement(hashCache[hash]);
+            }
+        }
+    });
+}
+function removeStyleElement(hash) {
+    if (styleSheets[hash]) {
+        delete styleSheets[hash];
+        if (hashCache.hasOwnProperty.call(hashCache, hash)) {
+            delete hashCache[hash];
+        }
+        const styleElement = document.getElementById(hash);
+        if (styleElement) {
+            document.head.removeChild(styleElement);
+        }
+    }
+}

package/dist/utils/inject-client-css.mjs

@@ -1 +1,47 @@
-import{isServer}from"..";const styleSheets={};const hashCache={};export function createStyleElement(e){if(document.getElementById(e))return null;const t=document.createElement("style");t.setAttribute("id",e);t.setAttribute("type","text/css");styleSheets[e]=t;document.head.appendChild(t);return styleSheets[e]}export function injectClientCSS(e,t){if(isServer)return;requestAnimationFrame((()=>{styleCleanUp()}));hashCache[e]=e;const n=createStyleElement(e);if(n==null)return;n.textContent=t}function styleCleanUp(){requestAnimationFrame((()=>{for(const e in hashCache){const t=document.querySelectorAll(`[class*="${e}"]`);if(t.length===0){removeStyleElement(hashCache[e])}}}))}function removeStyleElement(e){if(styleSheets[e]){delete styleSheets[e];if(hashCache.hasOwnProperty.call(hashCache,e)){delete hashCache[e]}const t=document.getElementById(e);if(t){document.head.removeChild(t)}}}
+import { isServer } from '..';
+const styleSheets = {};
+const hashCache = {};
+export function createStyleElement(hash) {
+    if (document.getElementById(hash))
+        return null;
+    const styleElement = document.createElement('style');
+    styleElement.setAttribute('id', hash);
+    styleElement.setAttribute('type', 'text/css');
+    styleSheets[hash] = styleElement;
+    document.head.appendChild(styleElement);
+    return styleSheets[hash];
+}
+export function injectClientCSS(hash, sheet) {
+    if (isServer)
+        return;
+    requestAnimationFrame(() => {
+        styleCleanUp();
+    });
+    hashCache[hash] = hash;
+    const styleElement = createStyleElement(hash);
+    if (styleElement == null)
+        return;
+    styleElement.textContent = sheet;
+}
+function styleCleanUp() {
+    requestAnimationFrame(() => {
+        for (const hash in hashCache) {
+            const classElements = document.querySelectorAll(`[class*="${hash}"]`);
+            if (classElements.length === 0) {
+                removeStyleElement(hashCache[hash]);
+            }
+        }
+    });
+}
+function removeStyleElement(hash) {
+    if (styleSheets[hash]) {
+        delete styleSheets[hash];
+        if (hashCache.hasOwnProperty.call(hashCache, hash)) {
+            delete hashCache[hash];
+        }
+        const styleElement = document.getElementById(hash);
+        if (styleElement) {
+            document.head.removeChild(styleElement);
+        }
+    }
+}

package/dist/utils/inject-client-global-css.js

@@ -1 +1,18 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.injectClientGlobalCSS=injectClientGlobalCSS;const __1=require("..");function injectClientGlobalCSS(e,t){if(__1.isServer)return;const n=document.querySelector(`[data-scope="${t}"]`);if(n instanceof HTMLStyleElement){n.textContent+=e;return}const o=document.createElement("style");o.setAttribute("data-scope",t);o.setAttribute("type","text/css");o.textContent=e;document.head.appendChild(o)}
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.injectClientGlobalCSS = injectClientGlobalCSS;
+const __1 = require("..");
+function injectClientGlobalCSS(sheet, scoped) {
+    if (__1.isServer)
+        return;
+    const existingStyleElement = document.querySelector(`[data-scope="${scoped}"]`);
+    if (existingStyleElement instanceof HTMLStyleElement) {
+        existingStyleElement.textContent += sheet;
+        return;
+    }
+    const styleElement = document.createElement('style');
+    styleElement.setAttribute('data-scope', scoped);
+    styleElement.setAttribute('type', 'text/css');
+    styleElement.textContent = sheet;
+    document.head.appendChild(styleElement);
+}

package/dist/utils/inject-client-global-css.mjs

@@ -1 +1,15 @@
-import{isServer}from"..";export function injectClientGlobalCSS(t,e){if(isServer)return;const n=document.querySelector(`[data-scope="${e}"]`);if(n instanceof HTMLStyleElement){n.textContent+=t;return}const o=document.createElement("style");o.setAttribute("data-scope",e);o.setAttribute("type","text/css");o.textContent=t;document.head.appendChild(o)}
+import { isServer } from '..';
+export function injectClientGlobalCSS(sheet, scoped) {
+    if (isServer)
+        return;
+    const existingStyleElement = document.querySelector(`[data-scope="${scoped}"]`);
+    if (existingStyleElement instanceof HTMLStyleElement) {
+        existingStyleElement.textContent += sheet;
+        return;
+    }
+    const styleElement = document.createElement('style');
+    styleElement.setAttribute('data-scope', scoped);
+    styleElement.setAttribute('type', 'text/css');
+    styleElement.textContent = sheet;
+    document.head.appendChild(styleElement);
+}

package/dist/utils/inject-server-css.js

@@ -1 +1,11 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.injectServerCSS=injectServerCSS;exports.getServerCSS=getServerCSS;const styleSheets={};function injectServerCSS(e,t){styleSheets[e]=t}function getServerCSS(){return Object.values(styleSheets).join("\n")}
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.injectServerCSS = injectServerCSS;
+exports.getServerCSS = getServerCSS;
+const styleSheets = {};
+function injectServerCSS(hash, sheet) {
+    styleSheets[hash] = sheet;
+}
+function getServerCSS() {
+    return Object.values(styleSheets).join('\n');
+}

package/dist/utils/inject-server-css.mjs

@@ -1 +1,7 @@
-const styleSheets={};export function injectServerCSS(e,t){styleSheets[e]=t}export function getServerCSS(){return Object.values(styleSheets).join("\n")}
+const styleSheets = {};
+export function injectServerCSS(hash, sheet) {
+    styleSheets[hash] = sheet;
+}
+export function getServerCSS() {
+    return Object.values(styleSheets).join('\n');
+}

package/dist/utils/transpiler.js

@@ -1 +1,125 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.transpiler=transpiler;const __1=require("..");const createKeyframes=(t,e)=>{let s=`${t} {\n`;for(const t in e){if(Object.prototype.hasOwnProperty.call(e,t)){const n=e[t];s+=`  ${t} {\n`;for(const t in n){if(Object.prototype.hasOwnProperty.call(n,t)){const e=(0,__1.camelToKebabCase)(t);const o=n[t];if(typeof o==="string"||typeof o==="number"){const t=(0,__1.applyCssValue)(o,e);s+=`    ${e}: ${t};\n`}}}s+=`  }\n`}}s+=`}\n`;return s};function transpiler(t,e,s){let n="";const o=[];const r=t=>s==="--global"?t:`.${t}_${e}`;const a=(t,e,s)=>{if(typeof s!=="string")return"";const n=e[s];const o=(0,__1.camelToKebabCase)(s);return`${t}${o}: ${n};\n`};const c=(t,e,s=0)=>{const n={};const r="".repeat(s);const l=" ".repeat(s+1);let i="";for(const p in e){if(Object.prototype.hasOwnProperty.call(e,p)){const f=e[p];if(typeof f==="string"||typeof f==="number"){let t=(0,__1.camelToKebabCase)(p);if(p.startsWith("ms")){t=`-${t}`}const e=(0,__1.applyCssValue)(f,t);i+=`  ${t}: ${e};\n`}else if(!p.startsWith("@")){const e=(0,__1.camelToKebabCase)(p.replace("&",""));const o=c(t+e,f,s);Object.assign(n,o)}else if(p.startsWith("@media")||p.startsWith("@container")){const e=p;let s="";let n="";for(const e in f){if(Object.prototype.hasOwnProperty.call(f,e)){const o=f[e];const r=e.startsWith(":");const c=e.startsWith("&");if(r||c){const n=(0,__1.camelToKebabCase)(e.replace("&",""));let r="";if(typeof o==="object"&&o!==null){for(const t in o){if(Object.prototype.hasOwnProperty.call(o,t)){const e=(0,__1.camelToKebabCase)(t);const s=(0,__1.applyCssValue)(o[t],e);r+=a(l+"  ",{[t]:s},t)}}}s+=`${l}${t}${n} {\n${r}${l}}\n`}else{const t=(0,__1.camelToKebabCase)(e);const s=(0,__1.applyCssValue)(o,t);n+=a(l+"  ",{[e]:s},e)}}}if(n){o.push({media:e,css:`${e} {\n${l}${t} {\n${n}  }\n${s}${r}}${r}\n`})}else{o.push({media:e,css:`${e} {\n${s}${r}}\n`})}}}}n[t]=i;return n};for(const e in t){if(e.startsWith("@keyframes")){const s=t[e];n+=createKeyframes(e,s)}const s=c(r(e),t[e],1);for(const t in s){if(!t.startsWith("@keyframes")&&s[t]){n+=t+" {\n"+s[t]+"}\n"}}}o.forEach((({css:t})=>{n+=t}));return{styleSheet:n}}
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.transpiler = transpiler;
+const __1 = require("..");
+const createKeyframes = (property, content) => {
+    let keyframesRules = `${property} {\n`;
+    for (const key in content) {
+        if (Object.prototype.hasOwnProperty.call(content, key)) {
+            const keyframeValue = content[key];
+            keyframesRules += `  ${key} {\n`;
+            for (const prop in keyframeValue) {
+                if (Object.prototype.hasOwnProperty.call(keyframeValue, prop)) {
+                    const CSSProp = (0, __1.camelToKebabCase)(prop);
+                    const value = keyframeValue[prop];
+                    if (typeof value === 'string' || typeof value === 'number') {
+                        const applyValue = (0, __1.applyCssValue)(value, CSSProp);
+                        keyframesRules += `    ${CSSProp}: ${applyValue};\n`;
+                    }
+                }
+            }
+            keyframesRules += `  }\n`;
+        }
+    }
+    keyframesRules += `}\n`;
+    return keyframesRules;
+};
+function transpiler(object, base36Hash, core) {
+    let styleSheet = '';
+    const mediaQueries = [];
+    const classNameType = (property) => {
+        return core === '--global' ? property : `.${property}_${base36Hash}`;
+    };
+    const rules = (indent, rulesValue, property) => {
+        if (typeof property !== 'string')
+            return '';
+        const value = rulesValue[property];
+        const cssProp = (0, __1.camelToKebabCase)(property);
+        return `${indent}${cssProp}: ${value};\n`;
+    };
+    const stringConverter = (className, properties, indentLevel = 0) => {
+        const classSelector = {};
+        const indent = ''.repeat(indentLevel);
+        const innerIndent = ' '.repeat(indentLevel + 1);
+        let cssRule = '';
+        for (const property in properties) {
+            if (Object.prototype.hasOwnProperty.call(properties, property)) {
+                const value = properties[property];
+                if (typeof value === 'string' || typeof value === 'number') {
+                    let CSSProp = (0, __1.camelToKebabCase)(property);
+                    if (property.startsWith('ms')) {
+                        CSSProp = `-${CSSProp}`;
+                    }
+                    const applyValue = (0, __1.applyCssValue)(value, CSSProp);
+                    cssRule += `  ${CSSProp}: ${applyValue};\n`;
+                }
+                else if (!property.startsWith('@')) {
+                    const kebabPseudoSelector = (0, __1.camelToKebabCase)(property.replace('&', ''));
+                    const styles = stringConverter(className + kebabPseudoSelector, value, indentLevel);
+                    Object.assign(classSelector, styles);
+                }
+                else if (property.startsWith('@media') || property.startsWith('@container')) {
+                    const mediaRule = property;
+                    let nestedRules = '';
+                    let regularRules = '';
+                    for (const mediaProp in value) {
+                        if (Object.prototype.hasOwnProperty.call(value, mediaProp)) {
+                            const mediaValue = value[mediaProp];
+                            const isColon = mediaProp.startsWith(':');
+                            const isAnd = mediaProp.startsWith('&');
+                            if (isColon || isAnd) {
+                                const kebabMediaProp = (0, __1.camelToKebabCase)(mediaProp.replace('&', ''));
+                                let pseudoClassRule = '';
+                                if (typeof mediaValue === 'object' && mediaValue !== null) {
+                                    for (const pseudoProp in mediaValue) {
+                                        if (Object.prototype.hasOwnProperty.call(mediaValue, pseudoProp)) {
+                                            const CSSProp = (0, __1.camelToKebabCase)(pseudoProp);
+                                            const applyValue = (0, __1.applyCssValue)(mediaValue[pseudoProp], CSSProp);
+                                            pseudoClassRule += rules(innerIndent + '  ', { [pseudoProp]: applyValue }, pseudoProp);
+                                        }
+                                    }
+                                }
+                                nestedRules += `${innerIndent}${className}${kebabMediaProp} {\n${pseudoClassRule}${innerIndent}}\n`;
+                            }
+                            else {
+                                const CSSProp = (0, __1.camelToKebabCase)(mediaProp);
+                                const applyValue = (0, __1.applyCssValue)(mediaValue, CSSProp);
+                                regularRules += rules(innerIndent + '  ', { [mediaProp]: applyValue }, mediaProp);
+                            }
+                        }
+                    }
+                    if (regularRules) {
+                        mediaQueries.push({
+                            media: mediaRule,
+                            css: `${mediaRule} {\n${innerIndent}${className} {\n${regularRules}  }\n${nestedRules}${indent}}${indent}\n`,
+                        });
+                    }
+                    else {
+                        mediaQueries.push({
+                            media: mediaRule,
+                            css: `${mediaRule} {\n${nestedRules}${indent}}\n`,
+                        });
+                    }
+                }
+            }
+        }
+        classSelector[className] = cssRule;
+        return classSelector;
+    };
+    for (const property in object) {
+        if (property.startsWith('@keyframes')) {
+            const keyframesContent = object[property];
+            styleSheet += createKeyframes(property, keyframesContent);
+        }
+        const classSelectors = stringConverter(classNameType(property), object[property], 1);
+        for (const selector in classSelectors) {
+            if (!selector.startsWith('@keyframes') && classSelectors[selector]) {
+                styleSheet += selector + ' {\n' + classSelectors[selector] + '}\n';
+            }
+        }
+    }
+    mediaQueries.forEach(({ css }) => {
+        styleSheet += css;
+    });
+    return { styleSheet };
+}

package/dist/utils/transpiler.mjs

@@ -1 +1,122 @@
-import{camelToKebabCase,applyCssValue}from"..";const createKeyframes=(t,e)=>{let s=`${t} {\n`;for(const t in e){if(Object.prototype.hasOwnProperty.call(e,t)){const n=e[t];s+=`  ${t} {\n`;for(const t in n){if(Object.prototype.hasOwnProperty.call(n,t)){const e=camelToKebabCase(t);const o=n[t];if(typeof o==="string"||typeof o==="number"){const t=applyCssValue(o,e);s+=`    ${e}: ${t};\n`}}}s+=`  }\n`}}s+=`}\n`;return s};export function transpiler(t,e,s){let n="";const o=[];const a=t=>s==="--global"?t:`.${t}_${e}`;const c=(t,e,s)=>{if(typeof s!=="string")return"";const n=e[s];const o=camelToKebabCase(s);return`${t}${o}: ${n};\n`};const r=(t,e,s=0)=>{const n={};const a="".repeat(s);const l=" ".repeat(s+1);let i="";for(const p in e){if(Object.prototype.hasOwnProperty.call(e,p)){const f=e[p];if(typeof f==="string"||typeof f==="number"){let t=camelToKebabCase(p);if(p.startsWith("ms")){t=`-${t}`}const e=applyCssValue(f,t);i+=`  ${t}: ${e};\n`}else if(!p.startsWith("@")){const e=camelToKebabCase(p.replace("&",""));const o=r(t+e,f,s);Object.assign(n,o)}else if(p.startsWith("@media")||p.startsWith("@container")){const e=p;let s="";let n="";for(const e in f){if(Object.prototype.hasOwnProperty.call(f,e)){const o=f[e];const a=e.startsWith(":");const r=e.startsWith("&");if(a||r){const n=camelToKebabCase(e.replace("&",""));let a="";if(typeof o==="object"&&o!==null){for(const t in o){if(Object.prototype.hasOwnProperty.call(o,t)){const e=camelToKebabCase(t);const s=applyCssValue(o[t],e);a+=c(l+"  ",{[t]:s},t)}}}s+=`${l}${t}${n} {\n${a}${l}}\n`}else{const t=camelToKebabCase(e);const s=applyCssValue(o,t);n+=c(l+"  ",{[e]:s},e)}}}if(n){o.push({media:e,css:`${e} {\n${l}${t} {\n${n}  }\n${s}${a}}${a}\n`})}else{o.push({media:e,css:`${e} {\n${s}${a}}\n`})}}}}n[t]=i;return n};for(const e in t){if(e.startsWith("@keyframes")){const s=t[e];n+=createKeyframes(e,s)}const s=r(a(e),t[e],1);for(const t in s){if(!t.startsWith("@keyframes")&&s[t]){n+=t+" {\n"+s[t]+"}\n"}}}o.forEach((({css:t})=>{n+=t}));return{styleSheet:n}}
+import { camelToKebabCase, applyCssValue } from '..';
+const createKeyframes = (property, content) => {
+    let keyframesRules = `${property} {\n`;
+    for (const key in content) {
+        if (Object.prototype.hasOwnProperty.call(content, key)) {
+            const keyframeValue = content[key];
+            keyframesRules += `  ${key} {\n`;
+            for (const prop in keyframeValue) {
+                if (Object.prototype.hasOwnProperty.call(keyframeValue, prop)) {
+                    const CSSProp = camelToKebabCase(prop);
+                    const value = keyframeValue[prop];
+                    if (typeof value === 'string' || typeof value === 'number') {
+                        const applyValue = applyCssValue(value, CSSProp);
+                        keyframesRules += `    ${CSSProp}: ${applyValue};\n`;
+                    }
+                }
+            }
+            keyframesRules += `  }\n`;
+        }
+    }
+    keyframesRules += `}\n`;
+    return keyframesRules;
+};
+export function transpiler(object, base36Hash, core) {
+    let styleSheet = '';
+    const mediaQueries = [];
+    const classNameType = (property) => {
+        return core === '--global' ? property : `.${property}_${base36Hash}`;
+    };
+    const rules = (indent, rulesValue, property) => {
+        if (typeof property !== 'string')
+            return '';
+        const value = rulesValue[property];
+        const cssProp = camelToKebabCase(property);
+        return `${indent}${cssProp}: ${value};\n`;
+    };
+    const stringConverter = (className, properties, indentLevel = 0) => {
+        const classSelector = {};
+        const indent = ''.repeat(indentLevel);
+        const innerIndent = ' '.repeat(indentLevel + 1);
+        let cssRule = '';
+        for (const property in properties) {
+            if (Object.prototype.hasOwnProperty.call(properties, property)) {
+                const value = properties[property];
+                if (typeof value === 'string' || typeof value === 'number') {
+                    let CSSProp = camelToKebabCase(property);
+                    if (property.startsWith('ms')) {
+                        CSSProp = `-${CSSProp}`;
+                    }
+                    const applyValue = applyCssValue(value, CSSProp);
+                    cssRule += `  ${CSSProp}: ${applyValue};\n`;
+                }
+                else if (!property.startsWith('@')) {
+                    const kebabPseudoSelector = camelToKebabCase(property.replace('&', ''));
+                    const styles = stringConverter(className + kebabPseudoSelector, value, indentLevel);
+                    Object.assign(classSelector, styles);
+                }
+                else if (property.startsWith('@media') || property.startsWith('@container')) {
+                    const mediaRule = property;
+                    let nestedRules = '';
+                    let regularRules = '';
+                    for (const mediaProp in value) {
+                        if (Object.prototype.hasOwnProperty.call(value, mediaProp)) {
+                            const mediaValue = value[mediaProp];
+                            const isColon = mediaProp.startsWith(':');
+                            const isAnd = mediaProp.startsWith('&');
+                            if (isColon || isAnd) {
+                                const kebabMediaProp = camelToKebabCase(mediaProp.replace('&', ''));
+                                let pseudoClassRule = '';
+                                if (typeof mediaValue === 'object' && mediaValue !== null) {
+                                    for (const pseudoProp in mediaValue) {
+                                        if (Object.prototype.hasOwnProperty.call(mediaValue, pseudoProp)) {
+                                            const CSSProp = camelToKebabCase(pseudoProp);
+                                            const applyValue = applyCssValue(mediaValue[pseudoProp], CSSProp);
+                                            pseudoClassRule += rules(innerIndent + '  ', { [pseudoProp]: applyValue }, pseudoProp);
+                                        }
+                                    }
+                                }
+                                nestedRules += `${innerIndent}${className}${kebabMediaProp} {\n${pseudoClassRule}${innerIndent}}\n`;
+                            }
+                            else {
+                                const CSSProp = camelToKebabCase(mediaProp);
+                                const applyValue = applyCssValue(mediaValue, CSSProp);
+                                regularRules += rules(innerIndent + '  ', { [mediaProp]: applyValue }, mediaProp);
+                            }
+                        }
+                    }
+                    if (regularRules) {
+                        mediaQueries.push({
+                            media: mediaRule,
+                            css: `${mediaRule} {\n${innerIndent}${className} {\n${regularRules}  }\n${nestedRules}${indent}}${indent}\n`,
+                        });
+                    }
+                    else {
+                        mediaQueries.push({
+                            media: mediaRule,
+                            css: `${mediaRule} {\n${nestedRules}${indent}}\n`,
+                        });
+                    }
+                }
+            }
+        }
+        classSelector[className] = cssRule;
+        return classSelector;
+    };
+    for (const property in object) {
+        if (property.startsWith('@keyframes')) {
+            const keyframesContent = object[property];
+            styleSheet += createKeyframes(property, keyframesContent);
+        }
+        const classSelectors = stringConverter(classNameType(property), object[property], 1);
+        for (const selector in classSelectors) {
+            if (!selector.startsWith('@keyframes') && classSelectors[selector]) {
+                styleSheet += selector + ' {\n' + classSelectors[selector] + '}\n';
+            }
+        }
+    }
+    mediaQueries.forEach(({ css }) => {
+        styleSheet += css;
+    });
+    return { styleSheet };
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "zss-engine",
-  "version": "0.2.5",
+  "version": "0.2.7",
   "description": "Zero-runtime Style Sheet Engine",
   "keywords": [
     "zero-runtime",
@@ -15,33 +15,30 @@
   "exports": {
     "./package.json": "./package.json",
     ".": {
-      "types": "./dist/index.d.ts",
+      "types": "./types/index.d.ts",
       "import": "./dist/index.mjs",
       "default": "./dist/index.js"
     }
   },
   "main": "dist/index.js",
   "module": "dist/index.mjs",
-  "types": "dist/index.d.ts",
+  "types": "types/index.d.ts",
   "scripts": {
-    "build": "pnpm build:mjs && pnpm cjs && pnpm minify",
-    "build:mjs": "pnpm esm && for file in $(find dist -name '*.js'); do mv \"$file\" \"${file%.*}.mjs\"; done",
-    "cjs": "npx tsc --project tsconfig.cjs.json",
-    "esm": "npx tsc --project tsconfig.esm.json",
-    "minify": "for file in $(find dist -name '*.js' -o -name '*.mjs'); do terser \"$file\" -c -m -o \"$file\"; done",
+    "build": "pnpm esm && pnpm cjs",
+    "cjs": "tsc --project tsconfig.cjs.json",
+    "esm": "tsc --project tsconfig.esm.json && node build.esm.js",
     "test": "jest"
   },
   "dependencies": {
     "csstype": "^3.1.3"
   },
   "devDependencies": {
-    "@swc/core": "^1.7.42",
-    "@swc/jest": "^0.2.37",
     "@types/jest": "^29.5.14",
     "@types/node": "^22.8.5",
+    "fast-glob": "^3.3.3",
     "jest": "^29.7.0",
     "jest-environment-jsdom": "^29.7.0",
-    "terser": "^5.39.0",
+    "ts-jest": "^29.2.6",
     "typescript": "^5.6.3"
   }
 }