ui-thing 0.0.5 → 0.0.7

package/src/commands/init.ts

@@ -1,72 +1,72 @@
-import { Command } from "commander";
-import { defu } from "defu";
-import fse from "fs-extra";
-import kleur from "kleur";
-
-import { createCSS } from "../templates/css";
-import { TAILWIND_CONFIG_JS } from "../templates/tailwind";
-import { InitOptions, UIConfig } from "../types";
-import { addPrettierConfig } from "../utils/addPrettierConfig";
-import { addModuleToConfig, getNuxtConfig, getUIConfig, updateConfig } from "../utils/config";
-import { INIT_DEPS, INIT_DEV_DEPS, INIT_MODULES } from "../utils/constants";
-import { installPackages } from "../utils/installPackages";
-import { printFancyBoxMessage } from "../utils/printFancyBoxMessage";
-
-export const init = new Command()
-  .command("init")
-  .name("init")
-  .description(
-    "Initialize UI Thing in your Nuxt3 project. This will: 1. Create a tailwind.config.js file 2. Update your nuxt.config.ts file 3. Add the necessary dependencies 4. Create a ui-thing.config.ts file with the default configuration"
-  )
-  .option("-f --force", "Overwrite config file if it exists.", false)
-  .action(async (options: InitOptions) => {
-    // Get nuxt config
-    const cfg = await getNuxtConfig();
-    // Get ui config
-    let uiConfig: UIConfig = await getUIConfig(options);
-    // Add tailwindcss
-    await fse.writeFile(uiConfig.tailwindConfigLocation, TAILWIND_CONFIG_JS, "utf-8");
-    // create css path if it does not exist
-    // add css file
-    fse.writeFileSync(
-      uiConfig.tailwindCSSLocation,
-      createCSS(uiConfig.theme.toUpperCase() as any),
-      "utf-8"
-    );
-    // Add init modules ot nuxt cinfig
-    addModuleToConfig(cfg.nuxtConfig, INIT_MODULES);
-    // Configure modules in nuxt config
-    cfg.defaultExport.tailwindcss = defu(cfg.defaultExport.tailwindcss, { exposeConfig: true });
-    cfg.defaultExport.colorMode = defu(cfg.defaultExport.colorMode, { classSuffix: "" });
-    cfg.defaultExport.typescript = defu(cfg.defaultExport.typescript, { shim: false });
-    cfg.defaultExport.imports ||= {};
-    cfg.defaultExport.imports.imports ||= [];
-    const tvExists = cfg.defaultExport.imports.imports.find(
-      (i: any) => i.from === "tailwind-variants" && i.name === "tv"
-    );
-    if (!tvExists) {
-      cfg.defaultExport.imports.imports.push({ from: "tailwind-variants", name: "tv" });
-    }
-    const variantPropsExists = cfg.defaultExport.imports.imports.find(
-      (i: any) => i.from === "tailwind-variants" && i.name === "VariantProps"
-    );
-    if (!variantPropsExists) {
-      cfg.defaultExport.imports.imports.push({
-        from: "tailwind-variants",
-        name: "VariantProps",
-        type: true,
-      });
-    }
-    // Wriet changes to nuxt config
-    await updateConfig(cfg.nuxtConfig, "nuxt.config.ts");
-    // instal deps
-    await installPackages(uiConfig.packageManager, INIT_DEPS, INIT_DEV_DEPS);
-    // Add prettier config
-    await addPrettierConfig();
-
-    printFancyBoxMessage(
-      "Initialized",
-      { title: "Complete" },
-      `Feel free to start adding components with the ${kleur.bgWhite(" add ")} command.`
-    );
-  });
+import { Command } from "commander";
+import { defu } from "defu";
+import fse from "fs-extra";
+import kleur from "kleur";
+
+import { createCSS } from "../templates/css";
+import { TAILWIND_CONFIG_JS } from "../templates/tailwind";
+import { InitOptions, UIConfig } from "../types";
+import { addPrettierConfig } from "../utils/addPrettierConfig";
+import { addModuleToConfig, getNuxtConfig, getUIConfig, updateConfig } from "../utils/config";
+import { INIT_DEPS, INIT_DEV_DEPS, INIT_MODULES } from "../utils/constants";
+import { installPackages } from "../utils/installPackages";
+import { printFancyBoxMessage } from "../utils/printFancyBoxMessage";
+
+export const init = new Command()
+  .command("init")
+  .name("init")
+  .description(
+    "Initialize UI Thing in your Nuxt3 project. This will: 1. Create a tailwind.config.js file 2. Update your nuxt.config.ts file 3. Add the necessary dependencies 4. Create a ui-thing.config.ts file with the default configuration"
+  )
+  .option("-f --force", "Overwrite config file if it exists.", false)
+  .action(async (options: InitOptions) => {
+    // Get nuxt config
+    const cfg = await getNuxtConfig();
+    // Get ui config
+    let uiConfig: UIConfig = await getUIConfig(options);
+    // Add tailwindcss
+    await fse.writeFile(uiConfig.tailwindConfigLocation, TAILWIND_CONFIG_JS, "utf-8");
+    // create css path if it does not exist
+    // add css file
+    fse.writeFileSync(
+      uiConfig.tailwindCSSLocation,
+      createCSS(uiConfig.theme.toUpperCase() as any),
+      "utf-8"
+    );
+    // Add init modules ot nuxt cinfig
+    addModuleToConfig(cfg.nuxtConfig, INIT_MODULES);
+    // Configure modules in nuxt config
+    cfg.defaultExport.tailwindcss = defu(cfg.defaultExport.tailwindcss, { exposeConfig: true });
+    cfg.defaultExport.colorMode = defu(cfg.defaultExport.colorMode, { classSuffix: "" });
+    cfg.defaultExport.typescript = defu(cfg.defaultExport.typescript, { shim: false });
+    cfg.defaultExport.imports ||= {};
+    cfg.defaultExport.imports.imports ||= [];
+    const tvExists = cfg.defaultExport.imports.imports.find(
+      (i: any) => i.from === "tailwind-variants" && i.name === "tv"
+    );
+    if (!tvExists) {
+      cfg.defaultExport.imports.imports.push({ from: "tailwind-variants", name: "tv" });
+    }
+    const variantPropsExists = cfg.defaultExport.imports.imports.find(
+      (i: any) => i.from === "tailwind-variants" && i.name === "VariantProps"
+    );
+    if (!variantPropsExists) {
+      cfg.defaultExport.imports.imports.push({
+        from: "tailwind-variants",
+        name: "VariantProps",
+        type: true,
+      });
+    }
+    // Wriet changes to nuxt config
+    await updateConfig(cfg.nuxtConfig, "nuxt.config.ts");
+    // instal deps
+    await installPackages(uiConfig.packageManager, INIT_DEPS, INIT_DEV_DEPS);
+    // Add prettier config
+    await addPrettierConfig();
+
+    printFancyBoxMessage(
+      "Initialized",
+      { title: "Complete" },
+      `Feel free to start adding components with the ${kleur.bgWhite(" add ")} command.`
+    );
+  });

package/src/commands/prettier.ts

@@ -1,47 +1,47 @@
-import { Command } from "commander";
-import prompts from "prompts";
-
-import { addPrettierConfig } from "../utils/addPrettierConfig";
-import { installPackages } from "../utils/installPackages";
-import { printFancyBoxMessage } from "../utils/printFancyBoxMessage";
-
-export const addPrettier = new Command()
-  .command("prettier")
-  .name("prettier")
-  .description("Add prettier to your project.")
-  .action(async () => {
-    const added = await addPrettierConfig(undefined, false);
-    if (!added) {
-      printFancyBoxMessage(
-        "Not Added",
-        { title: "Prettier Not Added", borderColor: "red" },
-        `Prettier config was not added.`
-      );
-      return;
-    }
-
-    const { pkgManager } = await prompts({
-      name: "pkgManager",
-      type: "select",
-      message: "Which package manager are you using?",
-      choices: [
-        { title: "npm", value: "npm" },
-        { title: "yarn", value: "yarn" },
-        { title: "pnpm", value: "pnpm" },
-        { title: "bun", value: "bun" },
-      ],
-    });
-    if (!pkgManager) return process.exit(0);
-
-    // install prettier dep
-    await installPackages(pkgManager, undefined, [
-      "prettier",
-      "prettier-plugin-tailwindcss",
-      "@ianvs/prettier-plugin-sort-imports",
-    ]);
-    printFancyBoxMessage(
-      "All Done!",
-      { title: "Prettier Added" },
-      `A .prettierrc file has been added to your project and the code formatted. Enjoy!`
-    );
-  });
+import { Command } from "commander";
+import prompts from "prompts";
+
+import { addPrettierConfig } from "../utils/addPrettierConfig";
+import { installPackages } from "../utils/installPackages";
+import { printFancyBoxMessage } from "../utils/printFancyBoxMessage";
+
+export const addPrettier = new Command()
+  .command("prettier")
+  .name("prettier")
+  .description("Add prettier to your project.")
+  .action(async () => {
+    const added = await addPrettierConfig(undefined, false);
+    if (!added) {
+      printFancyBoxMessage(
+        "Not Added",
+        { title: "Prettier Not Added", borderColor: "red" },
+        `Prettier config was not added.`
+      );
+      return;
+    }
+
+    const { pkgManager } = await prompts({
+      name: "pkgManager",
+      type: "select",
+      message: "Which package manager are you using?",
+      choices: [
+        { title: "npm", value: "npm" },
+        { title: "yarn", value: "yarn" },
+        { title: "pnpm", value: "pnpm" },
+        { title: "bun", value: "bun" },
+      ],
+    });
+    if (!pkgManager) return process.exit(0);
+
+    // install prettier dep
+    await installPackages(pkgManager, undefined, [
+      "prettier",
+      "prettier-plugin-tailwindcss",
+      "@ianvs/prettier-plugin-sort-imports",
+    ]);
+    printFancyBoxMessage(
+      "All Done!",
+      { title: "Prettier Added" },
+      `A .prettierrc file has been added to your project and the code formatted. Enjoy!`
+    );
+  });

package/src/commands/theme.ts

@@ -1,61 +1,61 @@
-import { Command } from "commander";
-import { consola } from "consola";
-import fse from "fs-extra";
-import _ from "lodash";
-import prompts from "prompts";
-
-import { createCSS } from "../templates/css";
-import { compareUIConfig } from "../utils/compareUIConfig";
-import { getUIConfig } from "../utils/config";
-import { CSS_THEME_OPTIONS } from "../utils/constants";
-import { printFancyBoxMessage } from "../utils/printFancyBoxMessage";
-
-export const theme = new Command()
-  .command("theme")
-  .name("theme")
-  .description("Add a new theme to your project.")
-  .action(async () => {
-    // Get ui config
-    let uiConfig = await getUIConfig();
-    let uiConfigIsCorrect = await compareUIConfig();
-    if (!uiConfigIsCorrect) {
-      uiConfig = await getUIConfig({ force: true });
-    }
-    if (_.isEmpty(uiConfig)) {
-      consola.info("Config file not set. Exiting...");
-      process.exit(0);
-    }
-    const { theme } = await prompts([
-      {
-        name: "theme",
-        type: "autocomplete",
-        message: "Which theme do you want to add?",
-        choices: CSS_THEME_OPTIONS,
-      },
-    ]);
-    if (!theme) {
-      console.log("No theme selected. Exiting...");
-      return process.exit(0);
-    }
-    if (fse.existsSync(uiConfig.tailwindCSSLocation)) {
-      const { force } = await prompts([
-        {
-          name: "force",
-          type: "confirm",
-          message: "Do you want to overwrite your current css file?",
-          initial: true,
-        },
-      ]);
-      if (!force) {
-        console.log("Exiting...");
-        return process.exit(0);
-      }
-    }
-    fse.writeFileSync(uiConfig.tailwindCSSLocation, createCSS(theme.toUpperCase() as any), "utf-8");
-
-    printFancyBoxMessage(
-      `${_.capitalize(theme)}`,
-      { title: "New Theme Added" },
-      `${_.capitalize(theme)} theme has been added to ${uiConfig.tailwindCSSLocation}`
-    );
-  });
+import { Command } from "commander";
+import { consola } from "consola";
+import fse from "fs-extra";
+import _ from "lodash";
+import prompts from "prompts";
+
+import { createCSS } from "../templates/css";
+import { compareUIConfig } from "../utils/compareUIConfig";
+import { getUIConfig } from "../utils/config";
+import { CSS_THEME_OPTIONS } from "../utils/constants";
+import { printFancyBoxMessage } from "../utils/printFancyBoxMessage";
+
+export const theme = new Command()
+  .command("theme")
+  .name("theme")
+  .description("Add a new theme to your project.")
+  .action(async () => {
+    // Get ui config
+    let uiConfig = await getUIConfig();
+    let uiConfigIsCorrect = await compareUIConfig();
+    if (!uiConfigIsCorrect) {
+      uiConfig = await getUIConfig({ force: true });
+    }
+    if (_.isEmpty(uiConfig)) {
+      consola.info("Config file not set. Exiting...");
+      process.exit(0);
+    }
+    const { theme } = await prompts([
+      {
+        name: "theme",
+        type: "autocomplete",
+        message: "Which theme do you want to add?",
+        choices: CSS_THEME_OPTIONS,
+      },
+    ]);
+    if (!theme) {
+      console.log("No theme selected. Exiting...");
+      return process.exit(0);
+    }
+    if (fse.existsSync(uiConfig.tailwindCSSLocation)) {
+      const { force } = await prompts([
+        {
+          name: "force",
+          type: "confirm",
+          message: "Do you want to overwrite your current css file?",
+          initial: true,
+        },
+      ]);
+      if (!force) {
+        console.log("Exiting...");
+        return process.exit(0);
+      }
+    }
+    fse.writeFileSync(uiConfig.tailwindCSSLocation, createCSS(theme.toUpperCase() as any), "utf-8");
+
+    printFancyBoxMessage(
+      `${_.capitalize(theme)}`,
+      { title: "New Theme Added" },
+      `${_.capitalize(theme)} theme has been added to ${uiConfig.tailwindCSSLocation}`
+    );
+  });