@plumeria/core 0.11.4 → 0.12.0

package/dist/index.d.ts

@@ -2,7 +2,7 @@ import { CSSHTML, CSSProperties, CSSProperties as CSSProperties$1, CreateKeyfram
 import { ps } from "zss-utils";
 
 declare const px: <T extends readonly string[]>(...pseudos: T) => Join<T>;
-declare const rx: (cssProperties: Readonly<CSSProperties$1>, varSet: RxVariableSet) => {
+declare const rx: (styleProps: string | Readonly<CSSProperties$1>, varSet: RxVariableSet) => {
   className: string;
   style: {
     [k: string]: string;

package/dist/index.js

@@ -8,18 +8,26 @@ function create(object) {
 	const base36Hash = (0, zss_engine.genBase36Hash)(object, 6);
 	const { styleSheet } = (0, zss_engine.transpiler)(object, base36Hash);
 	const injectCSS = zss_engine.isServer ? zss_engine.injectServerCSS : zss_engine.injectClientCSS;
+	const injectIfNeeded = () => {
+		if (zss_engine.isTestingDevelopment) injectCSS(base36Hash, styleSheet);
+	};
 	if (typeof require_css.globalPromise_1 === "undefined") require_css.initPromise_1();
 	require_css.resolvePromise_1(styleSheet);
+	const result = {};
 	Object.keys(object).forEach((key) => {
 		const cssProperties = object[key];
 		const hashedClassName = key + "_" + base36Hash;
 		objectToKeyHashMap.set(cssProperties, hashedClassName);
-		Object.defineProperty(object, key, { get: () => {
-			if (zss_engine.isTestingDevelopment) injectCSS(base36Hash, styleSheet);
+		Object.defineProperty(result, key, { get: () => {
+			injectIfNeeded();
 			return Object.freeze(cssProperties);
 		} });
+		Object.defineProperty(result, "$" + key, { get: () => {
+			injectIfNeeded();
+			return hashedClassName;
+		} });
 	});
-	return Object.freeze(object);
+	return Object.freeze(result);
 }
 
 function global(object) {
@@ -44,10 +52,13 @@ const props = (...objects) => {
 const px = (...pseudos) => {
 	return pseudos.filter(Boolean).join("");
 };
-const rx = (cssProperties, varSet) => ({
-	className: props(cssProperties),
-	style: Object.fromEntries(Object.entries(varSet).map(([key, value]) => [key, value]))
-});
+const rx = (styleProps, varSet) => {
+	const className = typeof styleProps === "string" ? styleProps : props(styleProps);
+	return {
+		className,
+		style: Object.fromEntries(Object.entries(varSet).map(([key, value]) => [key, value]))
+	};
+};
 
 const keyframes = (object) => {
 	const prefix = (0, zss_engine.genBase36Hash)(object, 8);

package/dist/index.mjs

@@ -7,18 +7,26 @@ function create(object) {
 	const base36Hash = genBase36Hash(object, 6);
 	const { styleSheet } = transpiler(object, base36Hash);
 	const injectCSS = isServer ? injectServerCSS : injectClientCSS;
+	const injectIfNeeded = () => {
+		if (isTestingDevelopment) injectCSS(base36Hash, styleSheet);
+	};
 	if (typeof globalPromise_1 === "undefined") initPromise_1();
 	resolvePromise_1(styleSheet);
+	const result = {};
 	Object.keys(object).forEach((key) => {
 		const cssProperties = object[key];
 		const hashedClassName = key + "_" + base36Hash;
 		objectToKeyHashMap.set(cssProperties, hashedClassName);
-		Object.defineProperty(object, key, { get: () => {
-			if (isTestingDevelopment) injectCSS(base36Hash, styleSheet);
+		Object.defineProperty(result, key, { get: () => {
+			injectIfNeeded();
 			return Object.freeze(cssProperties);
 		} });
+		Object.defineProperty(result, "$" + key, { get: () => {
+			injectIfNeeded();
+			return hashedClassName;
+		} });
 	});
-	return Object.freeze(object);
+	return Object.freeze(result);
 }
 
 function global(object) {
@@ -43,10 +51,13 @@ const props = (...objects) => {
 const px = (...pseudos) => {
 	return pseudos.filter(Boolean).join("");
 };
-const rx = (cssProperties, varSet) => ({
-	className: props(cssProperties),
-	style: Object.fromEntries(Object.entries(varSet).map(([key, value]) => [key, value]))
-});
+const rx = (styleProps, varSet) => {
+	const className = typeof styleProps === "string" ? styleProps : props(styleProps);
+	return {
+		className,
+		style: Object.fromEntries(Object.entries(varSet).map(([key, value]) => [key, value]))
+	};
+};
 
 const keyframes = (object) => {
 	const prefix = genBase36Hash(object, 8);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@plumeria/core",
-  "version": "0.11.4",
+  "version": "0.12.0",
   "description": "Zero-runtime, expressive CSS-in-JS library for TypeScript.",
   "keywords": [
     "css",
@@ -39,7 +39,7 @@
     "stylesheet.css"
   ],
   "dependencies": {
-    "zss-engine": "0.2.44",
+    "zss-engine": "0.2.48",
     "zss-utils": "0.2.4"
   },
   "publishConfig": {