yummacss 2.1.0 → 3.0.0

package/LICENSE

@@ -1,21 +1,20 @@
-MIT License
+Copyright (c) 2022-present Yumma CSS maintained by Renildo Pereira.
 
-Copyright (c) Yumma CSS
+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:
 
-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 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.
+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,31 +1,33 @@
 <div align="center">
-  <a href="https://yummacss.com" target="_blank">
+  <a href="https://yummacss.com" target="_blank" target="_blank" rel="noopener noreferrer">
     <picture>
-      <source media="(prefers-color-scheme: dark)" srcset="https://www.yummacss.com/assets/vectors/dark-logo.svg">
-      <source media="(prefers-color-scheme: light)" srcset="https://www.yummacss.com/assets/vectors/light-logo.svg">
-      <img alt="Yumma CSS" src="https://www.yummacss.com/assets/vectors/light-logo.svg" width="220" style="max-width: 100%;">
+      <source media="(prefers-color-scheme: dark)" srcset="https://www.yummacss.com/trademark/logo-dark.png">
+      <source media="(prefers-color-scheme: light)" srcset="https://www.yummacss.com/trademark/logo-light.png">
+      <img alt="Yumma CSS" src="https://www.yummacss.com/trademark/logo-light.png" width="220" style="max-width: 100%;">
     </picture>
   </a>
 </div>
 
 <p align="center">
-  All the tools you need in one package, with abbreviated utility classes — goodbye, massive codebases!
+  The CSS framework with abbreviated styles for modern design systems — no bloat!
   <br>
   <a href="https://yummacss.com"><strong>Read the documentation ↝</strong></a>
 </p>
 
----
+## Community
 
-### Support
+Join the Yumma CSS community! Share your experiences and help Yumma CSS grow and be the best it can be.
 
-[Join our Discord server](https://discord.gg/CGw5vyqmQ6). To get support just createa post in the `#help` channel with the <kbd>yummacss</kbd> tag.
+- Follow [@yummacss on X (Twitter)](https://x.com/yummacss)
+- Subscribe to [@yummacss on YouTube](https://www.youtube.com/@yummacss)
+- Join discussions on [`#yummacss` Discord](https://discord.gg/Zd2y6yVqgK)
 
-### Contributing
+## Built with
 
-I'd love your help with Yumma CSS. I've included some links below which you might find useful.
+- [Gulp](https://gulpjs.com/) — A toolkit to automate & enhance your workflow.
+- [SCSS](https://sass-lang.com/documentation/syntax/) — CSS with superpowers.
+- [Typescript](https://www.typescriptlang.org/) — A superset of JavaScript.
 
-- [Join us on the `#yummacss` channel on Discord](https://discord.gg/V6s5jg5TfX)
-  
-### Licensing
+## Licensing
 
-MIT — Copyright (c) 2023–present [Renildo Pereira](https://github.com/yumma-lib/yumma-css/graphs/contributors).
+MIT — Copyright (c) 2022–present

package/dist/cli/commands/build.js

@@ -0,0 +1,44 @@
+import { writeFileSync } from "fs";
+import { compileSCSS } from "../services/scssCompiler.js";
+import { purgeCSS } from "../services/purgeService.js";
+import { minifyCSS } from "../services/minifyService.js";
+import { loadConfig } from "../services/configLoader.js";
+import { cli } from "../utils/cli-ui.js";
+let cache = {};
+export async function build(existingConfig, forceRebuild = false) {
+    const buildSpinner = cli.startSpinner("Starting build process...");
+    const startTime = Date.now();
+    try {
+        const config = existingConfig || (await loadConfig());
+        const configHash = JSON.stringify(config);
+        const configChanged = cache.configHash !== configHash;
+        let css;
+        if (forceRebuild || configChanged || !cache.css) {
+            buildSpinner.text = "Compiling SCSS...";
+            const result = await compileSCSS(config);
+            css = result.css;
+            cache = {
+                css: result.css,
+                dependencies: result.dependencies,
+                configHash,
+            };
+        }
+        else {
+            css = cache.css;
+            buildSpinner.text = "Using cached SCSS...";
+        }
+        buildSpinner.text = "Purging unused styles...";
+        const purgedCSS = await purgeCSS(css, config);
+        buildSpinner.text = "Minifying CSS...";
+        const finalCSS = minifyCSS(purgedCSS, config);
+        writeFileSync(config.output, finalCSS);
+        buildSpinner.succeed("Build completed successfully!");
+        cli.success(`Styles written to: ${config.output}`);
+        cli.info(`Total time: ${Date.now() - startTime}ms`);
+    }
+    catch (error) {
+        buildSpinner.fail("Build failed!");
+        cli.error(error instanceof Error ? error.message : "Unknown error occurred");
+        process.exit(1);
+    }
+}

package/dist/cli/commands/init.js

@@ -0,0 +1,17 @@
+import { writeFileSync } from "fs";
+import { defaultConfig } from "../config/defaultConfig.js";
+import { cli } from "../utils/cli-ui.js";
+export function init() {
+    const initSpinner = cli.startSpinner("Creating config file...");
+    try {
+        const configContent = `export default ${JSON.stringify(defaultConfig, null, 2)}`;
+        writeFileSync("yumma.config.js", configContent);
+        initSpinner.succeed("Config file created!");
+        cli.success("yumma.config.js successfully created");
+    }
+    catch (error) {
+        initSpinner.fail("Failed to create config file!");
+        cli.error(error instanceof Error ? error.message : "Unknown error occurred");
+        process.exit(1);
+    }
+}

package/dist/cli/commands/watch.js

@@ -0,0 +1,36 @@
+import chok from "chokidar";
+import { build } from "./build.js";
+import { loadConfig } from "../services/configLoader.js";
+import { cli } from "../utils/cli-ui.js";
+import { globby } from "globby";
+let currentConfig;
+export async function watch() {
+    const watchSpinner = cli.startSpinner("Initializing watch mode...");
+    try {
+        currentConfig = await loadConfig();
+        watchSpinner.start("Watching for changes...");
+        await build(currentConfig, true);
+        const files = await globby(currentConfig.source);
+        const watcher = chok.watch(files, {
+            awaitWriteFinish: {
+                pollInterval: 50,
+                stabilityThreshold: 200,
+            },
+            ignored: /(^|[/\\])\../,
+            ignoreInitial: true,
+            persistent: true,
+        });
+        watcher
+            .on("add", (path) => handleChange(path, "added"))
+            .on("change", (path) => handleChange(path, "changed"))
+            .on("unlink", (path) => handleChange(path, "removed"));
+        async function handleChange(path, event) {
+            await build(currentConfig, true);
+        }
+    }
+    catch (error) {
+        watchSpinner.fail("Watch failed!");
+        cli.error(error instanceof Error ? error.message : "Unknown error occurred");
+        process.exit(1);
+    }
+}

package/dist/cli/config/defaultConfig.js

@@ -0,0 +1,8 @@
+export const defaultConfig = {
+    source: [""],
+    output: "",
+    buildOptions: {
+        reset: true,
+        minify: false,
+    },
+};

package/dist/cli/services/configLoader.js

@@ -0,0 +1,16 @@
+import { join } from "path";
+import { pathToFileURL } from "url";
+import { defaultConfig } from "../config/defaultConfig.js";
+export async function loadConfig() {
+    const configPath = join(process.cwd(), "yumma.config.js");
+    const configUrl = pathToFileURL(configPath).href;
+    const { default: userConfig } = (await import(configUrl));
+    return {
+        ...defaultConfig,
+        ...userConfig,
+        buildOptions: {
+            ...defaultConfig.buildOptions,
+            ...userConfig.buildOptions,
+        },
+    };
+}

package/dist/cli/services/minifyService.js

@@ -0,0 +1,16 @@
+import { transform } from "lightningcss";
+export function minifyCSS(css, config) {
+    try {
+        const result = transform({
+            filename: "style.css",
+            code: Buffer.from(css),
+            minify: config.buildOptions.minify,
+            sourceMap: false,
+        });
+        return result.code.toString();
+    }
+    catch (error) {
+        console.error("Minification error:", error);
+        throw error;
+    }
+}

package/dist/cli/services/purgeService.js

@@ -0,0 +1,12 @@
+import { PurgeCSS } from "purgecss";
+import { globby } from "globby";
+export async function purgeCSS(css, config) {
+    const purgeCSSResult = await new PurgeCSS().purge({
+        content: await globby(config.source),
+        css: [{ raw: css }],
+        defaultExtractor: (content) => {
+            return content.match(/[\w-/\\:]+/g) || [];
+        },
+    });
+    return purgeCSSResult[0].css;
+}

package/dist/cli/services/scssCompiler.js

@@ -0,0 +1,34 @@
+import * as sass from "sass-embedded";
+import { fileURLToPath } from "url";
+import { dirname, join } from "path";
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = dirname(__filename);
+const packageRoot = join(__dirname, "../../..");
+export async function compileSCSS(config) {
+    const scssFile = config.buildOptions.reset
+        ? "yummacss.scss"
+        : "yummacss-core.scss";
+    try {
+        const result = await sass.compileAsync(join(packageRoot, "src", scssFile), {
+            style: "expanded",
+            loadPaths: [join(packageRoot, "src")],
+            importers: [
+                {
+                    findFileUrl(url) {
+                        return new URL(url, `file://${join(packageRoot, "src/")}`);
+                    },
+                },
+            ],
+        });
+        return {
+            css: result.css,
+            dependencies: result.loadedUrls
+                .filter((url) => url.protocol === "file:")
+                .map((url) => fileURLToPath(url)),
+        };
+    }
+    catch (error) {
+        console.error("SCSS compilation error:", error);
+        throw error;
+    }
+}

package/dist/cli/src/cli.js

@@ -0,0 +1,19 @@
+import { Command } from "commander";
+import { init } from "../commands/init.js";
+import { build } from "../commands/build.js";
+import { watch } from "../commands/watch.js";
+const program = new Command();
+program.name("yummacss").description("Yumma CSS CLI").version("3.0.0");
+program
+    .command("init")
+    .description("Create a default config file")
+    .action(init);
+program
+    .command("build")
+    .description("Compile CSS with optional minification")
+    .action(() => build().catch(() => process.exit(1)));
+program
+    .command("watch")
+    .description("Watch files and rebuild on changes")
+    .action(() => watch().catch(() => process.exit(1)));
+program.parse(process.argv);

package/dist/cli/utils/cli-ui.js

@@ -0,0 +1,13 @@
+import ora from "ora";
+export const spinner = ora({
+    spinner: "sand",
+});
+export const cli = {
+    success: (msg) => console.log(`✔ ${msg}`),
+    info: (msg) => console.log(`ℹ ${msg}`),
+    error: (msg) => console.log(`✗ ${msg}`),
+    startSpinner: (text) => {
+        const spinner = ora({ spinner: "sand", color: "white" }).start(text);
+        return spinner;
+    },
+};

package/dist/cli/utils/ui.js

@@ -0,0 +1,15 @@
+import ora from "ora";
+import chalk from "chalk";
+export const spinner = ora();
+const { green, yellow, cyan, red } = chalk;
+export const ui = {
+    success: (msg) => console.log(green(`✓ ${msg}`)),
+    warn: (msg) => console.log(yellow(`⚠ ${msg}`)),
+    info: (msg) => console.log(cyan(`ℹ ${msg}`)),
+    error: (msg) => console.log(red(`✗ ${msg}`)),
+    startSpinner: (text) => {
+        spinner.text = text;
+        spinner.start();
+        return spinner;
+    },
+};