@unizap/unicss 2.0.8 → 2.0.10

package/LICENSE

@@ -1,9 +1,9 @@
-MIT License
-
-Copyright (c) 2025 Your Name
-
-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.
-
+MIT License
+
+Copyright (c) 2025 Your Name
+
+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

@@ -1,168 +1,168 @@
-<p></p>
-<p align="center">
-  <img src="https://ik.imagekit.io/unizap/unicss_logo.svg" alt="UniCSS Logo" height="80"/>
-</p>
-
-
-<p align="center">
-  <b>Build sleek interfaces straight from your markup.<br>
-  Fast, modern, utility-first CSS framework for rapid UI development.</b>
-</p>
-
----
-
-## 🚀 Installation
-
-```sh
-npm i @unizap/unicss
-```
-
----
-
-## ⚡ Usage
-
-### CLI Usage
-
-Generate your CSS file:
-
-```sh
-npx unicss
-```
-
-Or watch for changes and output to a custom file:
-
-```sh
-npx unicss -w -o src/output.css
-```
-
-### Vite Integration
-
-UniCSS now supports seamless integration with Vite! Add the plugin to your `vite.config.js`:
-
-```js
-import { defineConfig } from 'vite';
-import unicss from '@unizap/unicss/vite-plugin-unicss';
-
-export default defineConfig({
-  plugins: [
-    unicss({
-      output: 'src/unicss.css',  // Output path for generated CSS
-      skipBase: false             // Optional: skip base styles
-    })
-  ]
-});
-```
-
-Then import the generated CSS in your main entry file:
-
-```js
-import './unicss.css';
-```
-
-Run Vite in development mode:
-
-```sh
-npm run dev
-```
-
-The plugin will:
-- Automatically scan all `.html`, `.js`, `.jsx`, `.ts`, `.tsx`, `.vue`, and `.svelte` files
-- Generate CSS based on the utility classes found
-- Regenerate CSS on file changes with Hot Module Replacement (HMR)
-
-### PostCSS Integration (Recommended)
-
-UniCSS works seamlessly with PostCSS, similar to Tailwind CSS. This is the recommended approach for modern web applications.
-
-#### Method 1: Using @unicss Directives (Like Tailwind)
-
-Create a CSS file with UniCSS directives:
-
-```css
-/* app/globals.css or src/styles.css */
-@unicss;
-```
-
-Configure PostCSS in your project:
-
-```js
-// postcss.config.js
-module.exports = {
-  plugins: {
-    '@unizap/unicss/postcss': {},
-    autoprefixer: {}
-  }
-}
-```
-
-Import the CSS in your application:
-
-```js
-// For Next.js, Vite, or other frameworks
-import './globals.css'
-```
-
-The `@unicss` directive will be replaced with all generated utility classes. You can also split base and utilities:
-
-```css
-@unicss base;      /* Base styles and resets */
-@unicss utilities; /* Utility classes only */
-```
-
-#### Method 2: Use the Included PostCSS Config
-
-UniCSS includes a ready-to-use PostCSS configuration with these plugins:
-- `@unizap/unicss/postcss` - Generate UniCSS utilities
-- `postcss-import` - Inline @import rules
-- `postcss-nested` - Unwrap nested rules
-- `autoprefixer` - Add vendor prefixes automatically
-
-Import it directly:
-
-```js
-// postcss.config.js
-const unicssPostCSS = require('@unizap/unicss/postcss.config.js');
-module.exports = unicssPostCSS;
-```
-
----
-
-## 🧩 Features
-
-- Utility-first CSS generator
-- PostCSS plugin with @unicss directives (like Tailwind)
-- Automatic CSS filter utilities (e.g. `blur-lg`, `brightness-150`)
-- Fast, modern, and easy to integrate
-- Supports custom output paths and watch mode
-- Vite plugin for seamless integration
-- Works with Next.js, Remix, Astro, and any PostCSS-based setup
-- Hot module replacement (HMR) in development
-
----
-
-## 🔧 Development & Publishing
-
-### Building the package
-
-```sh
-npm run build
-```
-
-This creates:
-- `dist/index.js` - Node.js bundle for CLI
-- `dist/unicss.min.js` - Browser CDN bundle
-
-### Publishing to npm
-
-```sh
-npm run build
-npm publish
-```
-
-See [PUBLISHING.md](./PUBLISHING.md) for detailed instructions.
-
----
-
-## 📄 License
-
+<p></p>
+<p align="center">
+  <img src="https://ik.imagekit.io/unizap/unicss_logo.svg" alt="UniCSS Logo" height="80"/>
+</p>
+
+
+<p align="center">
+  <b>Build sleek interfaces straight from your markup.<br>
+  Fast, modern, utility-first CSS framework for rapid UI development.</b>
+</p>
+
+---
+
+## 🚀 Installation
+
+```sh
+npm i @unizap/unicss
+```
+
+---
+
+## ⚡ Usage
+
+### CLI Usage
+
+Generate your CSS file:
+
+```sh
+npx unicss
+```
+
+Or watch for changes and output to a custom file:
+
+```sh
+npx unicss -w -o src/output.css
+```
+
+### Vite Integration
+
+UniCSS now supports seamless integration with Vite! Add the plugin to your `vite.config.js`:
+
+```js
+import { defineConfig } from 'vite';
+import unicss from '@unizap/unicss/vite-plugin-unicss';
+
+export default defineConfig({
+  plugins: [
+    unicss({
+      output: 'src/unicss.css',  // Output path for generated CSS
+      skipBase: false             // Optional: skip base styles
+    })
+  ]
+});
+```
+
+Then import the generated CSS in your main entry file:
+
+```js
+import './unicss.css';
+```
+
+Run Vite in development mode:
+
+```sh
+npm run dev
+```
+
+The plugin will:
+- Automatically scan all `.html`, `.js`, `.jsx`, `.ts`, `.tsx`, `.vue`, and `.svelte` files
+- Generate CSS based on the utility classes found
+- Regenerate CSS on file changes with Hot Module Replacement (HMR)
+
+### PostCSS Integration (Recommended)
+
+UniCSS works seamlessly with PostCSS, similar to Tailwind CSS. This is the recommended approach for modern web applications.
+
+#### Method 1: Using @unicss Directives (Like Tailwind)
+
+Create a CSS file with UniCSS directives:
+
+```css
+/* app/globals.css or src/styles.css */
+@unicss;
+```
+
+Configure PostCSS in your project:
+
+```js
+// postcss.config.js
+module.exports = {
+  plugins: {
+    '@unizap/unicss/postcss': {},
+    autoprefixer: {}
+  }
+}
+```
+
+Import the CSS in your application:
+
+```js
+// For Next.js, Vite, or other frameworks
+import './globals.css'
+```
+
+The `@unicss` directive will be replaced with all generated utility classes. You can also split base and utilities:
+
+```css
+@unicss base;      /* Base styles and resets */
+@unicss utilities; /* Utility classes only */
+```
+
+#### Method 2: Use the Included PostCSS Config
+
+UniCSS includes a ready-to-use PostCSS configuration with these plugins:
+- `@unizap/unicss/postcss` - Generate UniCSS utilities
+- `postcss-import` - Inline @import rules
+- `postcss-nested` - Unwrap nested rules
+- `autoprefixer` - Add vendor prefixes automatically
+
+Import it directly:
+
+```js
+// postcss.config.js
+const unicssPostCSS = require('@unizap/unicss/postcss.config.js');
+module.exports = unicssPostCSS;
+```
+
+---
+
+## 🧩 Features
+
+- Utility-first CSS generator
+- PostCSS plugin with @unicss directives (like Tailwind)
+- Automatic CSS filter utilities (e.g. `blur-lg`, `brightness-150`)
+- Fast, modern, and easy to integrate
+- Supports custom output paths and watch mode
+- Vite plugin for seamless integration
+- Works with Next.js, Remix, Astro, and any PostCSS-based setup
+- Hot module replacement (HMR) in development
+
+---
+
+## 🔧 Development & Publishing
+
+### Building the package
+
+```sh
+npm run build
+```
+
+This creates:
+- `dist/index.js` - Node.js bundle for CLI
+- `dist/unicss.min.js` - Browser CDN bundle
+
+### Publishing to npm
+
+```sh
+npm run build
+npm publish
+```
+
+See [PUBLISHING.md](./PUBLISHING.md) for detailed instructions.
+
+---
+
+## 📄 License
+
 MIT

package/bin/index.js

@@ -1,56 +1,56 @@
-#!/usr/bin/env node
-
-const path = require("path");
-const fs = require("fs");
-const generateCSS = require("../dist/index.js");
-
-const args = process.argv.slice(2);
-let outFile = "style/unicss.css";
-let watch = false;
-let skipBase = false;
-let content = null;
-
-for (let i = 0; i < args.length; i++) {
-  if ((args[i] === "-o" || args[i] === "--output") && args[i + 1]) {
-    outFile = args[i + 1];
-    i++;
-  }
-  if (args[i] === "-w" || args[i] === "--watch") {
-    watch = true;
-  }
-  if (args[i] === "--skip-base") {
-    skipBase = true;
-  }
-  if ((args[i] === "-c" || args[i] === "--content") && args[i + 1]) {
-    // Support multiple patterns separated by comma or multiple --content flags
-    const patterns = args[i + 1].split(",").map(p => p.trim());
-    content = content ? [...content, ...patterns] : patterns;
-    i++;
-  }
-}
-
-function run() {
-  const css = generateCSS({ skipBase, content });
-  const outDir = path.dirname(outFile);
-  if (!fs.existsSync(outDir)) {
-    fs.mkdirSync(outDir, { recursive: true });
-  }
-  fs.writeFileSync(outFile, css);
-  console.log(`Unicss generated at ${outFile}`);
-}
-
-run();
-
-if (watch) {
-  const chokidar = require("chokidar");
-  // Watch content patterns or default patterns, plus the config
-  const watchPatterns = content || ["**/*.{js,jsx,ts,tsx,html,vue}"];
-  const watcher = chokidar.watch([
-    ...watchPatterns,
-    "unicss.config.js"
-  ], { ignoreInitial: true });
-  watcher.on("all", () => {
-    console.log("Change detected. Regenerating Unicss...");
-    run();
-  });
+#!/usr/bin/env node
+
+const path = require("path");
+const fs = require("fs");
+const generateCSS = require("../dist/index.js");
+
+const args = process.argv.slice(2);
+let outFile = "style/unicss.css";
+let watch = false;
+let skipBase = false;
+let content = null;
+
+for (let i = 0; i < args.length; i++) {
+  if ((args[i] === "-o" || args[i] === "--output") && args[i + 1]) {
+    outFile = args[i + 1];
+    i++;
+  }
+  if (args[i] === "-w" || args[i] === "--watch") {
+    watch = true;
+  }
+  if (args[i] === "--skip-base") {
+    skipBase = true;
+  }
+  if ((args[i] === "-c" || args[i] === "--content") && args[i + 1]) {
+    // Support multiple patterns separated by comma or multiple --content flags
+    const patterns = args[i + 1].split(",").map(p => p.trim());
+    content = content ? [...content, ...patterns] : patterns;
+    i++;
+  }
+}
+
+function run() {
+  const css = generateCSS({ skipBase, content });
+  const outDir = path.dirname(outFile);
+  if (!fs.existsSync(outDir)) {
+    fs.mkdirSync(outDir, { recursive: true });
+  }
+  fs.writeFileSync(outFile, css);
+  console.log(`Unicss generated at ${outFile}`);
+}
+
+run();
+
+if (watch) {
+  const chokidar = require("chokidar");
+  // Watch content patterns or default patterns, plus the config
+  const watchPatterns = content || ["**/*.{js,jsx,ts,tsx,html,vue}"];
+  const watcher = chokidar.watch([
+    ...watchPatterns,
+    "unicss.config.js"
+  ], { ignoreInitial: true });
+  watcher.on("all", () => {
+    console.log("Change detected. Regenerating Unicss...");
+    run();
+  });
 }