@plumeria/core 0.9.2 → 0.9.4

package/dist/css.js

@@ -0,0 +1,135 @@
+"use strict";
+//#region rolldown:runtime
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+	if (from && typeof from === "object" || typeof from === "function") for (var keys = __getOwnPropNames(from), i = 0, n = keys.length, key; i < n; i++) {
+		key = keys[i];
+		if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+			get: ((k) => from[k]).bind(null, key),
+			enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+		});
+	}
+	return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", {
+	value: mod,
+	enumerable: true
+}) : target, mod));
+
+//#endregion
+const zss_engine = __toESM(require("zss-engine"));
+
+//#region src/processors/css.ts
+let resolvePromise_1;
+let globalPromise_1;
+const sheetQueue_1 = [];
+let isProcessing_1 = false;
+function initPromise_1() {
+	globalPromise_1 = new Promise((resolve) => {
+		resolvePromise_1 = (value) => {
+			sheetQueue_1.push(value);
+			resolve(value);
+		};
+	});
+}
+async function processQueue_1(filePath) {
+	while (sheetQueue_1.length > 0) {
+		const styleSheet = sheetQueue_1.shift();
+		if (!zss_engine.isDevelopment && styleSheet) (0, zss_engine.build)(styleSheet, filePath);
+	}
+	isProcessing_1 = false;
+}
+async function buildCreate(filePath) {
+	if (typeof globalPromise_1 === "undefined") initPromise_1();
+	if (!isProcessing_1 && sheetQueue_1.length > 0) {
+		isProcessing_1 = true;
+		processQueue_1(filePath);
+	}
+}
+let resolvePromise_2;
+let globalPromise_2;
+const sheetQueue_2 = [];
+let isProcessing_2 = false;
+function initPromise_2() {
+	globalPromise_2 = new Promise((resolve) => {
+		resolvePromise_2 = (value) => {
+			sheetQueue_2.push(value);
+			resolve(value);
+		};
+	});
+}
+async function processQueue_2(filePath) {
+	while (sheetQueue_2.length > 0) {
+		const styleSheet = sheetQueue_2.shift();
+		if (!zss_engine.isDevelopment && styleSheet) (0, zss_engine.build)(styleSheet, filePath, "--global");
+	}
+	isProcessing_2 = false;
+}
+async function buildGlobal(filePath) {
+	if (typeof globalPromise_2 === "undefined") initPromise_2();
+	if (!isProcessing_2 && sheetQueue_2.length > 0) {
+		isProcessing_2 = true;
+		processQueue_2(filePath);
+	}
+}
+
+//#endregion
+Object.defineProperty(exports, '__toESM', {
+  enumerable: true,
+  get: function () {
+    return __toESM;
+  }
+});
+Object.defineProperty(exports, 'buildCreate', {
+  enumerable: true,
+  get: function () {
+    return buildCreate;
+  }
+});
+Object.defineProperty(exports, 'buildGlobal', {
+  enumerable: true,
+  get: function () {
+    return buildGlobal;
+  }
+});
+Object.defineProperty(exports, 'globalPromise_1', {
+  enumerable: true,
+  get: function () {
+    return globalPromise_1;
+  }
+});
+Object.defineProperty(exports, 'globalPromise_2', {
+  enumerable: true,
+  get: function () {
+    return globalPromise_2;
+  }
+});
+Object.defineProperty(exports, 'initPromise_1', {
+  enumerable: true,
+  get: function () {
+    return initPromise_1;
+  }
+});
+Object.defineProperty(exports, 'initPromise_2', {
+  enumerable: true,
+  get: function () {
+    return initPromise_2;
+  }
+});
+Object.defineProperty(exports, 'resolvePromise_1', {
+  enumerable: true,
+  get: function () {
+    return resolvePromise_1;
+  }
+});
+Object.defineProperty(exports, 'resolvePromise_2', {
+  enumerable: true,
+  get: function () {
+    return resolvePromise_2;
+  }
+});

package/dist/css.mjs

@@ -0,0 +1,58 @@
+import { build, isDevelopment } from "zss-engine";
+
+//#region src/processors/css.ts
+let resolvePromise_1;
+let globalPromise_1;
+const sheetQueue_1 = [];
+let isProcessing_1 = false;
+function initPromise_1() {
+	globalPromise_1 = new Promise((resolve) => {
+		resolvePromise_1 = (value) => {
+			sheetQueue_1.push(value);
+			resolve(value);
+		};
+	});
+}
+async function processQueue_1(filePath) {
+	while (sheetQueue_1.length > 0) {
+		const styleSheet = sheetQueue_1.shift();
+		if (!isDevelopment && styleSheet) build(styleSheet, filePath);
+	}
+	isProcessing_1 = false;
+}
+async function buildCreate(filePath) {
+	if (typeof globalPromise_1 === "undefined") initPromise_1();
+	if (!isProcessing_1 && sheetQueue_1.length > 0) {
+		isProcessing_1 = true;
+		processQueue_1(filePath);
+	}
+}
+let resolvePromise_2;
+let globalPromise_2;
+const sheetQueue_2 = [];
+let isProcessing_2 = false;
+function initPromise_2() {
+	globalPromise_2 = new Promise((resolve) => {
+		resolvePromise_2 = (value) => {
+			sheetQueue_2.push(value);
+			resolve(value);
+		};
+	});
+}
+async function processQueue_2(filePath) {
+	while (sheetQueue_2.length > 0) {
+		const styleSheet = sheetQueue_2.shift();
+		if (!isDevelopment && styleSheet) build(styleSheet, filePath, "--global");
+	}
+	isProcessing_2 = false;
+}
+async function buildGlobal(filePath) {
+	if (typeof globalPromise_2 === "undefined") initPromise_2();
+	if (!isProcessing_2 && sheetQueue_2.length > 0) {
+		isProcessing_2 = true;
+		processQueue_2(filePath);
+	}
+}
+
+//#endregion
+export { buildCreate, buildGlobal, globalPromise_1, globalPromise_2, initPromise_1, initPromise_2, resolvePromise_1, resolvePromise_2 };

package/dist/index.d.ts

@@ -0,0 +1,295 @@
+import { CSSHTML, CSSProperties, CreateKeyframes, CreateStyle, CreateStyleType, CreateTheme, CreateVars, ReturnType } from "zss-engine";
+
+//#region src/css.d.ts
+declare class css {
+  static create<T extends Record<string, CSSProperties>>(object: CreateStyleType<T>): ReturnType<T>;
+  static global(object: CSSHTML): void;
+  static defineVars<const T extends CreateVars>(object: T): { [K in keyof T]: `var(--${string})` };
+  static defineTheme<const T extends CreateTheme>(object: T): { [K in keyof T]: `var(--${string})` };
+  static keyframes(object: CreateKeyframes): string;
+  static media: {
+    dark: "@media (prefers-color-scheme: dark)";
+    light: "@media (prefers-color-scheme: light)";
+    range: <S extends string>(range: S) => `@media (${S})`;
+    maxWidth: <V extends string | number>(value: V) => `@media (max-width: ${V}px)`;
+    maxHeight: <V extends string | number>(value: V) => `@media (max-height: ${V}px)`;
+    minWidth: <V extends string | number>(value: V) => `@media (min-width: ${V}px)`;
+    minHeight: <V extends string | number>(value: V) => `@media (min-height: ${V}px)`;
+  };
+  static container: {
+    range: <S extends string>(range: S) => `@container (${S})`;
+    maxWidth: <V extends string | number>(value: V) => V extends number ? `@container (max-width: ${V}px)` : `@container (max-width: ${V})`;
+    maxHeight: <V extends string | number>(value: V) => V extends number ? `@container (max-height: ${V}px)` : `@container (max-height: ${V})`;
+    minWidth: <V extends string | number>(value: V) => V extends number ? `@container (min-width: ${V}px)` : `@container (min-width: ${V})`;
+    minHeight: <V extends string | number>(value: V) => V extends number ? `@container (min-height: ${V}px)` : `@container (min-height: ${V})`;
+  };
+  static pseudo: {
+    fn: {
+      cue: <S extends string>(str: S) => `::cue(${S})`;
+      dir: <S extends string>(str: S) => `:dir(${S})`;
+      has: <S extends string>(str: S) => `:has(${S})`;
+      host: <S extends string>(str: S) => `:host(${S})`;
+      hostContext: <S extends string>(str: S) => `:host-context(${S})`;
+      is: <S extends string>(str: S) => `:is(${S})`;
+      lang: <S extends string>(str: S) => `:lang(${S})`;
+      nthChild: <S extends string>(str: S) => `:nth-child(${S})`;
+      nthLastChild: <S extends string>(str: S) => `:nth-last-child(${S})`;
+      nthLastOfType: <S extends string>(str: S) => `:nth-last-of-type(${S})`;
+      nthOfType: <S extends string>(str: S) => `:nth-of-type(${S})`;
+      not: <S extends string>(str: S) => `:not(${S})`;
+      state: <S extends string>(str: S) => `:state(${S})`;
+      where: <S extends string>(str: S) => `:where(${S})`;
+      highlight: <S extends string>(str: S) => `::highlight(${S})`;
+      part: <S extends string>(str: S) => `::part(${S})`;
+      slotted: <S extends string>(str: S) => `::slotted(${S})`;
+      viewTransitionImagePair: <S extends string>(str: S) => `::view-transition-image-pair(${S})`;
+      viewTransitionGroup: <S extends string>(str: S) => `::view-transition-group(${S})`;
+      viewTransitionOld: <S extends string>(str: S) => `::view-transition-old(${S})`;
+      viewTransitionNew: <S extends string>(str: S) => `::view-transition-new(${S})`;
+    };
+    active: ":active";
+    anyLink: ":any-link";
+    autoFill: ":autofill";
+    buffering: ":buffering";
+    checked: ":checked";
+    default: ":default";
+    defined: ":defined";
+    disabled: ":disabled";
+    empty: ":empty";
+    enabled: ":enabled";
+    first: ":first";
+    firstChild: ":first-child";
+    firstOfType: ":first-of-type";
+    focus: ":focus";
+    focusVisible: ":focus-visible";
+    focusWithin: ":focus-within";
+    fullscreen: ":fullscreen";
+    future: ":future";
+    hasSlotted: ":has-slotted";
+    host: ":host";
+    hover: ":hover";
+    inRange: ":in-range";
+    indeterminate: ":indeterminate";
+    invalid: ":invalid";
+    lastChild: ":last-child";
+    lastOfType: ":last-of-type";
+    left: ":left";
+    link: ":link";
+    modal: ":modal";
+    muted: ":muted";
+    onlyChild: ":only-child";
+    onlyOfType: ":only-of-type";
+    open: ":open";
+    optional: ":optional";
+    outOfRange: ":out-of-range";
+    past: ":past";
+    paused: ":paused";
+    pictureInPicture: ":picture-in-picture";
+    placeholderShown: ":placeholder-shown";
+    playing: ":playing";
+    popoverOpen: ":popover-open";
+    readOnly: ":read-only";
+    readWrite: ":read-write";
+    required: ":required";
+    right: ":right";
+    root: ":root";
+    scope: ":scope";
+    seeking: ":seeking";
+    stalled: ":stalled";
+    target: ":target";
+    userInvalid: ":user-invalid";
+    userValid: ":user-valid";
+    valid: ":valid";
+    visited: ":visited";
+    volumeLocked: ":volume-locked";
+    after: "::after";
+    backdrop: "::backdrop";
+    before: "::before";
+    cue: "::cue";
+    detailsContent: "::details-content";
+    firstSelectorButton: "::first-selector-button";
+    firstLetter: "::first-letter";
+    firstLine: "::first-line";
+    grammarError: "::grammar-error";
+    marker: "::marker";
+    placeholder: "::placeholder";
+    selection: "::selection";
+    spellingError: "::spellingError";
+    targetText: "::target-text";
+    viewTransition: "::view-transition";
+  };
+  static color: {
+    lighten: (color: string, amount: string | number) => `color-mix(in srgb, ${string}, white ${number}%)`;
+    darken: (color: string, amount: string | number) => `color-mix(in srgb, ${string}, black ${number}%)`;
+    primary: "#0070f3";
+    secondary: "#ff4081";
+    success: "#2e7d32";
+    warning: "#ed6c02";
+    error: "#d32f2f";
+    aliceblue: "aliceblue";
+    antiquewhite: "antiquewhite";
+    aqua: "aqua";
+    aquamarine: "aquamarine";
+    azure: "azure";
+    beige: "beige";
+    bisque: "bisque";
+    black: "black";
+    blanchedalmond: "blanchedalmond";
+    blue: "blue";
+    blueviolet: "blueviolet";
+    brown: "brown";
+    burlywood: "burlywood";
+    cadetblue: "cadetblue";
+    chartreuse: "chartreuse";
+    chocolate: "chocolate";
+    coral: "coral";
+    cornflowerblue: "cornflowerblue";
+    cornsilk: "cornsilk";
+    crimson: "crimson";
+    cyan: "cyan";
+    darkblue: "darkblue";
+    darkcyan: "darkcyan";
+    darkgoldenrod: "darkgoldenrod";
+    darkgray: "darkgray";
+    darkgreen: "darkgreen";
+    darkgrey: "darkgrey";
+    darkkhaki: "darkkhaki";
+    darkmagenta: "darkmagenta";
+    darkolivegreen: "darkolivegreen";
+    darkorange: "darkorange";
+    darkorchid: "darkorchid";
+    darkred: "darkred";
+    darksalmon: "darksalmon";
+    darkseagreen: "darkseagreen";
+    darkslateblue: "darkslateblue";
+    darkslategray: "darkslategray";
+    darkslategrey: "darkslategrey";
+    darkturquoise: "darkturquoise";
+    darkviolet: "darkviolet";
+    deeppink: "deeppink";
+    deepskyblue: "deepskyblue";
+    dimgray: "dimgray";
+    dimgrey: "dimgrey";
+    dodgerblue: "dodgerblue";
+    firebrick: "firebrick";
+    floralwhite: "floralwhite";
+    forestgreen: "forestgreen";
+    fuchsia: "fuchsia";
+    gainsboro: "gainsboro";
+    ghostwhite: "ghostwhite";
+    gold: "gold";
+    goldenrod: "goldenrod";
+    gray: "gray";
+    green: "green";
+    greenyellow: "greenyellow";
+    grey: "grey";
+    honeydew: "honeydew";
+    hotpink: "hotpink";
+    indianred: "indianred";
+    indigo: "indigo";
+    ivory: "ivory";
+    khaki: "khaki";
+    lavender: "lavender";
+    lavenderblush: "lavenderblush";
+    lawngreen: "lawngreen";
+    lemonchiffon: "lemonchiffon";
+    lightblue: "lightblue";
+    lightcoral: "lightcoral";
+    lightcyan: "lightcyan";
+    lightgoldenrodyellow: "lightgoldenrodyellow";
+    lightgray: "lightgray";
+    lightgreen: "lightgreen";
+    lightgrey: "lightgrey";
+    lightpink: "lightpink";
+    lightsalmon: "lightsalmon";
+    lightseagreen: "lightseagreen";
+    lightskyblue: "lightskyblue";
+    lightslategray: "lightslategray";
+    lightslategrey: "lightslategrey";
+    lightsteelblue: "lightsteelblue";
+    lightyellow: "lightyellow";
+    lime: "lime";
+    limegreen: "limegreen";
+    linen: "linen";
+    magenta: "magenta";
+    maroon: "maroon";
+    mediumaquamarine: "mediumaquamarine";
+    mediumblue: "mediumblue";
+    mediumorchid: "mediumorchid";
+    mediumpurple: "mediumpurple";
+    mediumseagreen: "mediumseagreen";
+    mediumslateblue: "mediumslateblue";
+    mediumspringgreen: "mediumspringgreen";
+    mediumturquoise: "mediumturquoise";
+    mediumvioletred: "mediumvioletred";
+    midnightblue: "midnightblue";
+    mintcream: "mintcream";
+    mistyrose: "mistyrose";
+    moccasin: "moccasin";
+    navajowhite: "navajowhite";
+    navy: "navy";
+    oldlace: "oldlace";
+    olive: "olive";
+    olivedrab: "olivedrab";
+    orange: "orange";
+    orangered: "orangered";
+    orchid: "orchid";
+    palegoldenrod: "palegoldenrod";
+    palegreen: "palegreen";
+    paleturquoise: "paleturquoise";
+    palevioletred: "palevioletred";
+    papayawhip: "papayawhip";
+    peachpuff: "peachpuff";
+    peru: "peru";
+    pink: "pink";
+    plum: "plum";
+    powderblue: "powderblue";
+    purple: "purple";
+    rebeccapurple: "rebeccapurple";
+    red: "red";
+    rosybrown: "rosybrown";
+    royalblue: "royalblue";
+    saddlebrown: "saddlebrown";
+    salmon: "salmon";
+    sandybrown: "sandybrown";
+    seagreen: "seagreen";
+    seashell: "seashell";
+    sienna: "sienna";
+    silver: "silver";
+    skyblue: "skyblue";
+    slateblue: "slateblue";
+    slategray: "slategray";
+    slategrey: "slategrey";
+    snow: "snow";
+    springgreen: "springgreen";
+    steelblue: "steelblue";
+    tan: "tan";
+    teal: "teal";
+    thistle: "thistle";
+    tomato: "tomato";
+    transparent: "transparent";
+    turquoise: "turquoise";
+    violet: "violet";
+    wheat: "wheat";
+    white: "white";
+    whitesmoke: "whitesmoke";
+    yellow: "yellow";
+    yellowgreen: "yellowgreen";
+  };
+} //#endregion
+//#region src/cx.d.ts
+declare const cx: (...strings: Array<string | null | undefined | false>) => string & ":";
+
+//#endregion
+//#region src/rx.d.ts
+declare const rx: (className: string, varSet: {
+  [key: `--${string}`]: string;
+}) => {
+  className: string;
+  style: {
+    [k: string]: string;
+  };
+};
+
+//#endregion
+export { CSSHTML, CSSProperties, CreateStyle, css, cx, rx };

package/dist/index.js

@@ -0,0 +1,116 @@
+"use strict";
+const require_css = require('./css.js');
+const zss_engine = require_css.__toESM(require("zss-engine"));
+const zss_utils = require_css.__toESM(require("zss-utils"));
+
+//#region src/css.ts
+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;
+	if (typeof require_css.globalPromise_1 === "undefined") require_css.initPromise_1();
+	require_css.resolvePromise_1(styleSheet);
+	Object.keys(object).forEach((key) => {
+		Object.defineProperty(object, key, { get: () => {
+			const className = key + "_" + base36Hash;
+			if (zss_engine.isDevAndTest) injectCSS(base36Hash, styleSheet);
+			return className;
+		} });
+	});
+	return Object.freeze(object);
+}
+function global(object) {
+	const base36Hash = (0, zss_engine.genBase36Hash)(object, 8);
+	const { styleSheet } = (0, zss_engine.transpiler)(object, void 0, "--global");
+	if (typeof require_css.globalPromise_2 === "undefined") require_css.initPromise_2();
+	require_css.resolvePromise_2(styleSheet);
+	if (zss_engine.isDevAndTest) zss_engine.isServer ? (0, zss_engine.injectServerCSS)(base36Hash, styleSheet) : (0, zss_engine.injectClientGlobalCSS)(styleSheet);
+}
+const defineVars = (object) => {
+	const styles = { ":root": {} };
+	const result = {};
+	Object.entries(object).forEach(([key, value]) => {
+		const kebabKey = (0, zss_engine.camelToKebabCase)(key);
+		result[key] = `var(--${kebabKey})`;
+		styles[":root"][`--${key}`] = value;
+	});
+	global(styles);
+	return result;
+};
+const defineTheme = (object) => {
+	const styles = {};
+	const result = {};
+	Object.entries(object).forEach(([key, value]) => {
+		const kebabKey = (0, zss_engine.camelToKebabCase)(key);
+		result[key] = `var(--${kebabKey})`;
+		Object.entries(value).forEach(([subKey, subValue]) => {
+			if (subKey.startsWith("@media")) {
+				styles[":root"] ||= {};
+				styles[":root"][subKey] ||= {};
+				styles[":root"][subKey][`--${key}`] = subValue;
+			} else {
+				const themeSelector = subKey === "default" ? ":root" : `:root[data-theme="${subKey}"]`;
+				styles[themeSelector] ||= {};
+				styles[themeSelector][`--${key}`] = subValue;
+			}
+		});
+	});
+	global(styles);
+	return result;
+};
+const keyframes = (object) => {
+	const prefix = (0, zss_engine.genBase36Hash)(object, 8);
+	global({ [`@keyframes ${prefix}`]: object });
+	return prefix;
+};
+var css = class {
+	static create(object) {
+		return create(object);
+	}
+	static global(object) {
+		return global(object);
+	}
+	static defineVars(object) {
+		return defineVars(object);
+	}
+	static defineTheme(object) {
+		return defineTheme(object);
+	}
+	static keyframes(object) {
+		return keyframes(object);
+	}
+	static media = zss_utils.media;
+	static container = zss_utils.container;
+	static pseudo = zss_utils.pseudo;
+	static color = zss_utils.color;
+};
+var css_default = css;
+
+//#endregion
+//#region src/cx.ts
+const cx = (...strings) => {
+	let result = "";
+	let isFirst = true;
+	strings.filter(Boolean).forEach((str) => {
+		if (str?.toString().startsWith(":")) result += str.toString();
+		else if (typeof str === "string") if (isFirst) {
+			result += str;
+			isFirst = false;
+		} else result += ` ${str}`;
+	});
+	return result;
+};
+var cx_default = cx;
+
+//#endregion
+//#region src/rx.ts
+const rx = (className, varSet) => ({
+	className,
+	style: Object.fromEntries(Object.entries(varSet).map(([key, value]) => [key, value]))
+});
+var rx_default = rx;
+
+//#endregion
+exports.css = css_default;
+exports.cx = cx_default;
+exports.rx = rx_default;