@plumeria/core 0.8.10 → 0.8.12

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) zss-in-js contributer
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/{readme.md → README.md}

@@ -1,10 +1,10 @@
 # @plumeria/core
 
-Plumeria is a CSS-in-JS built with [**zss-utils**](https://www.npmjs.com/package/zss-utils) that provides a speedy development cycle.
+Plumeria is a Near zero-runtime CSS-in-JS for efficient design systems.
 
 ## Installation
 
-To start using Plumeria, Install the following two packages and the bundler package:
+To start using Plumeria, Install the following two packages:
 
 ```sh
 npm install @plumeria/core
@@ -12,32 +12,22 @@ npm install @plumeria/core
 
 ### Compiler
 
-Plumeria is designed to extract styles into static CSS stylesheets using the CLI.
-Install the following libraries to enable CLI commands: [`@plumeria/compiler`](https://www.npmjs.com/package/@plumeria/compiler)
+To compile `@plumeria/core`, for example, to use `npx css`, install  
+[`@plumeria/compiler`](https://www.npmjs.com/package/@plumeria/compiler) for static extraction through the build process.
 
 ```sh
 npm install --save-dev @plumeria/compiler
 ```
 
-For more information on compiler commnads, please see the documentation  
-[API reference](https://plumeria.dev/docs/reference/css).
-
-### Static StyleSheet
+### StyleSheet
 
 Import stylesheet in your application's entry point.  
 Applies the static stylesheet for production environments.
 
 ```ts
-// eg: main.ts or layout.tsx
 import '@plumeria/core/stylesheet';
 ```
 
-### Integrate
-
-To integrate with Next.js or Vite, you'll need one of the following packages:  
-[@plumeria/next](https://www.npmjs.com/package/@plumeria/next) or [@plumeria/vite](https://www.npmjs.com/package/@plumeria/vite).  
-See [Installation](https://plumeria.dev/docs/getting-started/installation) in the documentation for more details.
-
 ## API
 
 ### css.create()
@@ -70,7 +60,7 @@ const styles = css.create({
     },
   },
   text: {
-    color: '#333' // standard properties of that className
+    color: '#333',
     [css.pseudo.hover]: {
       color: 'skyblue',
       opacity: 0.9,

package/dist/cjs/index.js

@@ -1,7 +1,25 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.rx = exports.cx = exports.css = void 0;
-var css_js_1 = require("./css.js");
-Object.defineProperty(exports, "css", { enumerable: true, get: function () { return css_js_1.css; } });
-Object.defineProperty(exports, "cx", { enumerable: true, get: function () { return css_js_1.cx; } });
-Object.defineProperty(exports, "rx", { enumerable: true, get: function () { return css_js_1.rx; } });
+const zss_utils_1 = require("zss-utils");
+Object.defineProperty(exports, "cx", { enumerable: true, get: function () { return zss_utils_1.cx; } });
+Object.defineProperty(exports, "rx", { enumerable: true, get: function () { return zss_utils_1.rx; } });
+class css {
+    static create(object) {
+        return (0, zss_utils_1.create)(object);
+    }
+    static global(object) {
+        return (0, zss_utils_1.global)(object);
+    }
+    static defineThemeVars(object) {
+        return (0, zss_utils_1.defineThemeVars)(object);
+    }
+    static keyframes(object) {
+        return (0, zss_utils_1.keyframes)(object);
+    }
+    static media = zss_utils_1.media;
+    static pseudo = zss_utils_1.pseudo;
+    static colors = zss_utils_1.colors;
+    static container = zss_utils_1.container;
+}
+exports.css = css;

package/dist/esm/index.js

@@ -1 +1,20 @@
-export { css, cx, rx } from './css.js';
+import { create, global, keyframes, defineThemeVars, media, pseudo, colors, container, cx, rx, } from 'zss-utils';
+class css {
+    static create(object) {
+        return create(object);
+    }
+    static global(object) {
+        return global(object);
+    }
+    static defineThemeVars(object) {
+        return defineThemeVars(object);
+    }
+    static keyframes(object) {
+        return keyframes(object);
+    }
+    static media = media;
+    static pseudo = pseudo;
+    static colors = colors;
+    static container = container;
+}
+export { css, cx, rx };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@plumeria/core",
-  "version": "0.8.10",
-  "description": "Zero-runtime StyleSheet for speedy development cycle",
+  "version": "0.8.12",
+  "description": "Near Zero-runtime CSS-in-JS for efficient design systems.",
   "keywords": [
     "css",
     "css-in-js",
@@ -39,18 +39,15 @@
     "types/",
     "stylesheet/"
   ],
-  "scripts": {
-    "build": "rimraf dist types && pnpm esm && pnpm cjs",
-    "cjs": "tsc --project tsconfig.cjs.json",
-    "esm": "tsc --project tsconfig.esm.json"
-  },
   "dependencies": {
-    "zss-utils": "0.1.0"
-  },
-  "peerDependencies": {
-    "@plumeria/compiler": ">=0.8.10"
+    "zss-utils": "0.1.1"
   },
   "publishConfig": {
     "access": "public"
+  },
+  "scripts": {
+    "build": "rimraf dist types && pnpm esm && pnpm cjs",
+    "cjs": "tsc --project tsconfig.cjs.json",
+    "esm": "tsc --project tsconfig.esm.json"
   }
-}
+}

package/types/index.d.ts

@@ -1 +1,132 @@
-export { css, cx, rx } from './css.js';
+import type { CreateStyle, CustomHTMLType, CustomProperties, KeyframesDefinition, ReturnType, VarsDefinition } from 'zss-utils';
+import { cx, rx } from 'zss-utils';
+declare class css {
+    static create<T extends Record<string, CustomProperties>>(object: CreateStyle<T>): ReturnType<T>;
+    static global(object: CustomHTMLType): void;
+    static defineThemeVars<const T extends VarsDefinition>(object: T): { [K in keyof T]: `var(--${string & K})`; };
+    static keyframes(object: KeyframesDefinition): string;
+    static media: {
+        readonly min_sm: "@media (min-width: 640px)";
+        readonly min_md: "@media (min-width: 768px)";
+        readonly min_lg: "@media (min-width: 1024px)";
+        readonly min_xl: "@media (min-width: 1280px)";
+        readonly min_2xl: "@media (min-width: 1536px)";
+        readonly max_sm: "@media (max-width: 640px)";
+        readonly max_md: "@media (max-width: 768px)";
+        readonly max_lg: "@media (max-width: 1024px)";
+        readonly max_xl: "@media (max-width: 1280px)";
+        readonly max_2xl: "@media (max-width: 1536px)";
+        readonly range: (range: string) => "@media ()";
+        readonly max: (str: string) => "@media (max-)";
+        readonly min: (str: string) => "@media (min-)";
+        readonly scheme: {
+            readonly dark: "@media (prefers-color-scheme: dark)";
+            readonly light: "@media (prefers-color-scheme: light)";
+        };
+    };
+    static pseudo: {
+        readonly active: ":active";
+        readonly anyLink: ":any-link";
+        readonly autoFill: ":autofill";
+        readonly buffering: ":buffering";
+        readonly checked: ":checked";
+        readonly default: ":default";
+        readonly defined: ":defined";
+        readonly disabled: ":disabled";
+        readonly empty: ":empty";
+        readonly enabled: ":enabled";
+        readonly first: ":first";
+        readonly firstChild: ":first-child";
+        readonly firstOfType: ":first-of-type";
+        readonly focus: ":focus";
+        readonly focusVisible: ":focus-visible";
+        readonly focusWithin: ":focus-within";
+        readonly fullscreen: ":fullscreen";
+        readonly future: ":future";
+        readonly hasSlotted: ":has-slotted";
+        readonly host: ":host";
+        readonly hover: ":hover";
+        readonly inRange: ":in-range";
+        readonly indeterminate: ":indeterminate";
+        readonly invalid: ":invalid";
+        readonly lastChild: ":last-child";
+        readonly lastOfType: ":last-of-type";
+        readonly left: ":left";
+        readonly link: ":link";
+        readonly modal: ":modal";
+        readonly muted: ":muted";
+        readonly onlyChild: ":only-child";
+        readonly onlyOfType: ":only-of-type";
+        readonly open: ":open";
+        readonly optional: ":optional";
+        readonly outOfRange: ":out-of-range";
+        readonly past: ":past";
+        readonly paused: ":paused";
+        readonly pictureInPicture: ":picture-in-picture";
+        readonly placeholderShown: ":placeholder-shown";
+        readonly playing: ":playing";
+        readonly popoverOpen: ":popover-open";
+        readonly readOnly: ":read-only";
+        readonly readWrite: ":read-write";
+        readonly required: ":required";
+        readonly right: ":right";
+        readonly root: "root";
+        readonly scope: ":scope";
+        readonly seeking: ":seeking";
+        readonly stalled: ":stalled";
+        readonly target: ":target";
+        readonly userInvalid: ":user-invalid";
+        readonly userValid: ":user-valid";
+        readonly valid: ":valid";
+        readonly visited: ":visited";
+        readonly volumeLocked: ":volume-locked";
+        readonly after: "::after";
+        readonly backdrop: "::backdrop";
+        readonly before: "::before";
+        readonly cue: "::cue";
+        readonly detailsContent: "::details-content";
+        readonly firstSelectorButton: "::first-selector-button";
+        readonly firstLetter: "::first-letter";
+        readonly firstLine: "::first-line";
+        readonly grammarError: "::grammar-error";
+        readonly marker: "::marker";
+        readonly placeholder: "::placeholder";
+        readonly selection: "::selection";
+        readonly spellingError: "::spellingError";
+        readonly targetText: "::target-text";
+        readonly viewTransition: "::view-transition";
+        readonly fn: {
+            readonly cue: (str: string) => "::cue()";
+            readonly dir: (str: string) => ":dir()";
+            readonly has: (str: string) => ":has()";
+            readonly host: (str: string) => ":host()";
+            readonly hostContext: (str: string) => ":host-context()";
+            readonly is: (str: string) => ":is()";
+            readonly lang: (str: string) => ":lang()";
+            readonly nthChild: (str: string) => ":nth-child()";
+            readonly nthLastChild: (str: string) => ":nth-last-child()";
+            readonly nthLastOfType: (str: string) => ":nth-last-of-type()";
+            readonly nthOfType: (str: string) => ":nth-of-type()";
+            readonly not: (str: string) => ":not()";
+            readonly state: (str: string) => ":state()";
+            readonly where: (str: string) => ":where()";
+            readonly highlight: (str: string) => "::highlight()";
+            readonly part: (str: string) => "::part()";
+            readonly slotted: (str: string) => "::slotted()";
+            readonly viewTransitionImagePair: (str: string) => "::view-transition-image-pair()";
+            readonly viewTransitionGroup: (str: string) => "::view-transition-group()";
+            readonly viewTransitionOld: (str: string) => "::view-transition-old()";
+            readonly viewTransitionNew: (str: string) => "::view-transition-new()";
+        };
+    };
+    static colors: {
+        lighten: (color: string, amount: string | number) => string;
+        darken: (color: string, amount: string | number) => string;
+    };
+    static container: {
+        range: (range: string) => "@container ()";
+        max: (str: string) => "@container (max-)";
+        min: (str: string) => "@container (min-)";
+    };
+}
+export { css, cx, rx };

package/dist/cjs/css.js

@@ -1,25 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.rx = exports.cx = exports.css = void 0;
-const zss_utils_1 = require("zss-utils");
-Object.defineProperty(exports, "cx", { enumerable: true, get: function () { return zss_utils_1.cx; } });
-Object.defineProperty(exports, "rx", { enumerable: true, get: function () { return zss_utils_1.rx; } });
-class css {
-    static create(object) {
-        return (0, zss_utils_1.create)(object);
-    }
-    static global(object) {
-        return (0, zss_utils_1.global)(object);
-    }
-    static defineThemeVars(object) {
-        return (0, zss_utils_1.defineThemeVars)(object);
-    }
-    static keyframes(object) {
-        return (0, zss_utils_1.keyframes)(object);
-    }
-    static media = zss_utils_1.media;
-    static pseudo = zss_utils_1.pseudo;
-    static colors = zss_utils_1.colors;
-    static container = zss_utils_1.container;
-}
-exports.css = css;

package/dist/esm/css.js

@@ -1,20 +0,0 @@
-import { create, global, keyframes, defineThemeVars, media, pseudo, colors, container, cx, rx, } from 'zss-utils';
-class css {
-    static create(object) {
-        return create(object);
-    }
-    static global(object) {
-        return global(object);
-    }
-    static defineThemeVars(object) {
-        return defineThemeVars(object);
-    }
-    static keyframes(object) {
-        return keyframes(object);
-    }
-    static media = media;
-    static pseudo = pseudo;
-    static colors = colors;
-    static container = container;
-}
-export { css, cx, rx };

package/types/css.d.ts

@@ -1,132 +0,0 @@
-import type { CreateStyle, CustomHTMLType, CustomProperties, KeyframesDefinition, ReturnType, VarsDefinition } from 'zss-utils';
-import { cx, rx } from 'zss-utils';
-declare class css {
-    static create<T extends Record<string, CustomProperties>>(object: CreateStyle<T>): ReturnType<T>;
-    static global(object: CustomHTMLType): void;
-    static defineThemeVars<const T extends VarsDefinition>(object: T): { [K in keyof T]: `var(--${string & K})`; };
-    static keyframes(object: KeyframesDefinition): string;
-    static media: {
-        readonly min_sm: "@media (min-width: 640px)";
-        readonly min_md: "@media (min-width: 768px)";
-        readonly min_lg: "@media (min-width: 1024px)";
-        readonly min_xl: "@media (min-width: 1280px)";
-        readonly min_2xl: "@media (min-width: 1536px)";
-        readonly max_sm: "@media (max-width: 640px)";
-        readonly max_md: "@media (max-width: 768px)";
-        readonly max_lg: "@media (max-width: 1024px)";
-        readonly max_xl: "@media (max-width: 1280px)";
-        readonly max_2xl: "@media (max-width: 1536px)";
-        readonly range: (range: string) => "@media ()";
-        readonly max: (str: string) => "@media (max-)";
-        readonly min: (str: string) => "@media (min-)";
-        readonly scheme: {
-            readonly dark: "@media (prefers-color-scheme: dark)";
-            readonly light: "@media (prefers-color-scheme: light)";
-        };
-    };
-    static pseudo: {
-        readonly active: ":active";
-        readonly anyLink: ":any-link";
-        readonly autoFill: ":autofill";
-        readonly buffering: ":buffering";
-        readonly checked: ":checked";
-        readonly default: ":default";
-        readonly defined: ":defined";
-        readonly disabled: ":disabled";
-        readonly empty: ":empty";
-        readonly enabled: ":enabled";
-        readonly first: ":first";
-        readonly firstChild: ":first-child";
-        readonly firstOfType: ":first-of-type";
-        readonly focus: ":focus";
-        readonly focusVisible: ":focus-visible";
-        readonly focusWithin: ":focus-within";
-        readonly fullscreen: ":fullscreen";
-        readonly future: ":future";
-        readonly hasSlotted: ":has-slotted";
-        readonly host: ":host";
-        readonly hover: ":hover";
-        readonly inRange: ":in-range";
-        readonly indeterminate: ":indeterminate";
-        readonly invalid: ":invalid";
-        readonly lastChild: ":last-child";
-        readonly lastOfType: ":last-of-type";
-        readonly left: ":left";
-        readonly link: ":link";
-        readonly modal: ":modal";
-        readonly muted: ":muted";
-        readonly onlyChild: ":only-child";
-        readonly onlyOfType: ":only-of-type";
-        readonly open: ":open";
-        readonly optional: ":optional";
-        readonly outOfRange: ":out-of-range";
-        readonly past: ":past";
-        readonly paused: ":paused";
-        readonly pictureInPicture: ":picture-in-picture";
-        readonly placeholderShown: ":placeholder-shown";
-        readonly playing: ":playing";
-        readonly popoverOpen: ":popover-open";
-        readonly readOnly: ":read-only";
-        readonly readWrite: ":read-write";
-        readonly required: ":required";
-        readonly right: ":right";
-        readonly root: "root";
-        readonly scope: ":scope";
-        readonly seeking: ":seeking";
-        readonly stalled: ":stalled";
-        readonly target: ":target";
-        readonly userInvalid: ":user-invalid";
-        readonly userValid: ":user-valid";
-        readonly valid: ":valid";
-        readonly visited: ":visited";
-        readonly volumeLocked: ":volume-locked";
-        readonly after: "::after";
-        readonly backdrop: "::backdrop";
-        readonly before: "::before";
-        readonly cue: "::cue";
-        readonly detailsContent: "::details-content";
-        readonly firstSelectorButton: "::first-selector-button";
-        readonly firstLetter: "::first-letter";
-        readonly firstLine: "::first-line";
-        readonly grammarError: "::grammar-error";
-        readonly marker: "::marker";
-        readonly placeholder: "::placeholder";
-        readonly selection: "::selection";
-        readonly spellingError: "::spellingError";
-        readonly targetText: "::target-text";
-        readonly viewTransition: "::view-transition";
-        readonly fn: {
-            readonly cue: (str: string) => "::cue()";
-            readonly dir: (str: string) => ":dir()";
-            readonly has: (str: string) => ":has()";
-            readonly host: (str: string) => ":host()";
-            readonly hostContext: (str: string) => ":host-context()";
-            readonly is: (str: string) => ":is()";
-            readonly lang: (str: string) => ":lang()";
-            readonly nthChild: (str: string) => ":nth-child()";
-            readonly nthLastChild: (str: string) => ":nth-last-child()";
-            readonly nthLastOfType: (str: string) => ":nth-last-of-type()";
-            readonly nthOfType: (str: string) => ":nth-of-type()";
-            readonly not: (str: string) => ":not()";
-            readonly state: (str: string) => ":state()";
-            readonly where: (str: string) => ":where()";
-            readonly highlight: (str: string) => "::highlight()";
-            readonly part: (str: string) => "::part()";
-            readonly slotted: (str: string) => "::slotted()";
-            readonly viewTransitionImagePair: (str: string) => "::view-transition-image-pair()";
-            readonly viewTransitionGroup: (str: string) => "::view-transition-group()";
-            readonly viewTransitionOld: (str: string) => "::view-transition-old()";
-            readonly viewTransitionNew: (str: string) => "::view-transition-new()";
-        };
-    };
-    static colors: {
-        lighten: (color: string, amount: string | number) => string;
-        darken: (color: string, amount: string | number) => string;
-    };
-    static container: {
-        range: (range: string) => "@container ()";
-        max: (str: string) => "@container (max-)";
-        min: (str: string) => "@container (min-)";
-    };
-}
-export { css, cx, rx };