@tsparticles/cli-command-create 4.0.0-beta.12

package/src/plugin/create-plugin.ts

@@ -0,0 +1,198 @@
+import {
+  camelize,
+  capitalize,
+  copyEmptyTemplateFiles,
+  copyFilter,
+  dash,
+  replaceTokensInFile,
+  runBuild,
+  runInstall,
+  updatePackageDistFile,
+  updatePackageFile,
+  updateWebpackFile,
+} from "@tsparticles/cli-create-utils";
+import { cp } from "node:fs/promises";
+import path from "node:path";
+
+/**
+ * Updates the index file with the correct function name
+ * @param destPath - The path where the project is located
+ * @param name - The name of the project
+ */
+async function updateIndexFile(destPath: string, name: string): Promise<void> {
+  const capitalizedName = capitalize(name, "-", " "),
+    camelizedName = camelize(capitalizedName);
+
+  await replaceTokensInFile({
+    path: path.join(destPath, "src", "index.ts"),
+    tokens: [
+      {
+        from: /loadTemplatePlugin/g,
+        to: `load${capitalizedName}Plugin`,
+      },
+      {
+        from: /"#template#"/g,
+        to: `"${camelizedName}"`,
+      },
+    ],
+  });
+
+  await replaceTokensInFile({
+    path: path.join(destPath, "src", "index.lazy.ts"),
+    tokens: [
+      {
+        from: /loadTemplatePlugin/g,
+        to: `load${capitalizedName}Plugin`,
+      },
+      {
+        from: /"#template#"/g,
+        to: `"${camelizedName}"`,
+      },
+    ],
+  });
+}
+
+/**
+ * Updates the plugin package file
+ * @param destPath - The path where the project is located
+ * @param name - The name of the project
+ * @param description - The description of the project
+ * @param repoUrl - The repository url
+ */
+async function updatePluginPackageFile(
+  destPath: string,
+  name: string,
+  description: string,
+  repoUrl: string,
+): Promise<void> {
+  const camelizedName = camelize(camelize(name, "-"), " "),
+    dashedName = dash(camelizedName);
+
+  await updatePackageFile(
+    destPath,
+    `tsparticles-plugin-${dashedName}`,
+    description,
+    `tsparticles.plugin.${camelizedName}.min.js`,
+    repoUrl,
+  );
+}
+
+/**
+ * Updates the plugin package dist file
+ * @param destPath - The path where the project is located
+ * @param name - The name of the project
+ * @param description - The description of the project
+ * @param repoUrl - The repository url
+ */
+async function updatePluginPackageDistFile(
+  destPath: string,
+  name: string,
+  description: string,
+  repoUrl: string,
+): Promise<void> {
+  const camelizedName = camelize(camelize(name, "-"), " "),
+    dashedName = dash(camelizedName);
+
+  await updatePackageDistFile(
+    destPath,
+    `tsparticles-plugin-${dashedName}`,
+    description,
+    `tsparticles.plugin.${camelizedName}.min.js`,
+    repoUrl,
+  );
+}
+
+/**
+ * Updates the plugin readme file
+ * @param destPath - The path where the project is located
+ * @param name - The name of the project
+ * @param description - The description of the project
+ * @param repoUrl - The repository url
+ */
+async function updateReadmeFile(destPath: string, name: string, description: string, repoUrl: string): Promise<void> {
+  const readmePath = path.join(destPath, "README.md"),
+    capitalizedName = capitalize(name, "-", " "),
+    camelizedName = camelize(capitalizedName),
+    dashedName = dash(camelizedName),
+    stringSearch = "github.com",
+    trailingSlashSearch = "github.com/",
+    repoPath = repoUrl.includes(stringSearch)
+      ? repoUrl.substring(repoUrl.indexOf(trailingSlashSearch) + trailingSlashSearch.length, repoUrl.indexOf(".git"))
+      : "tsparticles/plugin-template";
+
+  await replaceTokensInFile({
+    path: readmePath,
+    tokens: [
+      {
+        from: /tsParticles Template Plugin/g,
+        to: `tsParticles ${description} Plugin`,
+      },
+      {
+        from: /tsparticles-plugin-template/g,
+        to: `tsparticles-plugin-${dashedName}`,
+      },
+      {
+        from: /tsparticles\.plugin\.template(\.bundle)?\.min\.js/g,
+        to: `tsparticles.plugin.${camelizedName}$1.min.js`,
+      },
+      {
+        from: /loadTemplatePlugin/g,
+        to: `load${capitalizedName}Plugin`,
+      },
+      {
+        from: /\[tsParticles]\(https:\/\/github.com\/matteobruni\/tsparticles\) additional template plugin\./g,
+        to: `[tsParticles](https://github.com/matteobruni/tsparticles) additional ${name} plugin.`,
+      },
+      {
+        from: /plugin\.type: "template"/g,
+        to: `plugin.type: "${camelizedName}"`,
+      },
+      {
+        from: /!\[demo]\(https:\/\/raw.githubusercontent.com\/tsparticles\/plugin-template\/main\/images\/sample.png\)/g,
+        to: `![demo](https://raw.githubusercontent.com/${repoPath}/main/images/sample.png)`,
+      },
+    ],
+  });
+}
+
+/**
+ * Updates the plugin webpack file
+ * @param destPath - The path where the project is located
+ * @param name - The name of the project
+ * @param description - The description of the project
+ */
+async function updatePluginWebpackFile(destPath: string, name: string, description: string): Promise<void> {
+  await updateWebpackFile(destPath, camelize(capitalize(name, "-", " ")), description, "loadParticlesPlugin");
+}
+
+/**
+ * Creates the plugin project
+ * @param name - The name of the project
+ * @param description - The description of the project
+ * @param repoUrl - The repository url
+ * @param destPath - The path where the project is located
+ */
+export async function createPluginTemplate(
+  name: string,
+  description: string,
+  repoUrl: string,
+  destPath: string,
+): Promise<void> {
+  const sourcePath = path.join(__dirname, "..", "..", "files", "create-plugin");
+
+  await copyEmptyTemplateFiles(destPath);
+
+  await cp(sourcePath, destPath, {
+    recursive: true,
+    force: true,
+    filter: copyFilter,
+  });
+
+  await updateIndexFile(destPath, name);
+  await updatePluginPackageFile(destPath, name, description, repoUrl);
+  await updatePluginPackageDistFile(destPath, name, description, repoUrl);
+  await updateReadmeFile(destPath, name, description, repoUrl);
+  await updatePluginWebpackFile(destPath, name, description);
+  await runInstall(destPath);
+  await runBuild(destPath);
+}

package/src/plugin/plugin.ts

@@ -0,0 +1,46 @@
+import { capitalize, getDestinationDir, getRepositoryUrl } from "@tsparticles/cli-create-utils";
+import prompts, { type PromptObject } from "prompts";
+import { Command } from "commander";
+import { createPluginTemplate } from "./create-plugin.js";
+import path from "node:path";
+
+const pluginCommand = new Command("plugin");
+
+pluginCommand.description("Create a new tsParticles plugin");
+pluginCommand.argument("<destination>", "Destination folder");
+pluginCommand.action(async (destination: string) => {
+  const destPath = await getDestinationDir(destination),
+    repoUrl = await getRepositoryUrl(),
+    initialName = destPath.split(path.sep).pop(),
+    questions: PromptObject[] = [
+      {
+        type: "text",
+        name: "name",
+        message: "What is the name of the plugin?",
+        validate: (value: string) => (value ? true : "The name can't be empty"),
+        initial: initialName,
+      },
+      {
+        type: "text",
+        name: "description",
+        message: "What is the description of the plugin?",
+        validate: (value: string) => (value ? true : "The description can't be empty"),
+        initial: capitalize(initialName ?? ""),
+      },
+      {
+        type: "text",
+        name: "repositoryUrl",
+        message: "What is the repository URL? (optional)",
+        initial: repoUrl.trim(),
+      },
+    ],
+    { name, description, repositoryUrl } = (await prompts(questions)) as {
+      description: string;
+      name: string;
+      repositoryUrl: string;
+    };
+
+  await createPluginTemplate(name.trim(), description.trim(), repositoryUrl.trim(), destPath);
+});
+
+export { pluginCommand };

package/src/preset/create-preset.ts

@@ -0,0 +1,218 @@
+import {
+  camelize,
+  capitalize,
+  copyEmptyTemplateFiles,
+  copyFilter,
+  dash,
+  replaceTokensInFile,
+  runBuild,
+  runInstall,
+  updatePackageDistFile,
+  updatePackageFile,
+  updateWebpackFile,
+} from "@tsparticles/cli-create-utils";
+import { cp } from "node:fs/promises";
+import path from "node:path";
+
+/**
+ * Updates the bundle file with the correct function name
+ * @param destPath - The path where the project is located
+ * @param name - The name of the project
+ */
+async function updateBundleFile(destPath: string, name: string): Promise<void> {
+  const capitalizedName = capitalize(name, "-", " ");
+
+  await replaceTokensInFile({
+    path: path.join(destPath, "src", "bundle.ts"),
+    tokens: [
+      {
+        from: /loadTemplatePreset/g,
+        to: `load${capitalizedName}Preset`,
+      },
+    ],
+  });
+}
+
+/**
+ * Updates the index file with the correct function name
+ * @param destPath - The path where the project is located
+ * @param name - The name of the project
+ */
+async function updateIndexFile(destPath: string, name: string): Promise<void> {
+  const capitalizedName = capitalize(name, "-", " "),
+    camelizedName = camelize(capitalizedName);
+
+  await replaceTokensInFile({
+    path: path.join(destPath, "src", "index.ts"),
+    tokens: [
+      {
+        from: /loadTemplatePreset/g,
+        to: `load${capitalizedName}Preset`,
+      },
+      {
+        from: /"#template#"/g,
+        to: `"${camelizedName}"`,
+      },
+    ],
+  });
+
+  await replaceTokensInFile({
+    path: path.join(destPath, "src", "index.lazy.ts"),
+    tokens: [
+      {
+        from: /loadTemplatePreset/g,
+        to: `load${capitalizedName}Preset`,
+      },
+      {
+        from: /"#template#"/g,
+        to: `"${camelizedName}"`,
+      },
+    ],
+  });
+}
+
+/**
+ * Updates the preset package file
+ * @param destPath - The path where the project is located
+ * @param name - The name of the project
+ * @param description - The description of the project
+ * @param repoUrl - The repository url
+ */
+async function updatePresetPackageFile(
+  destPath: string,
+  name: string,
+  description: string,
+  repoUrl: string,
+): Promise<void> {
+  const camelizedName = camelize(name, "-", " "),
+    dashedName = dash(camelizedName);
+
+  await updatePackageFile(
+    destPath,
+    `tsparticles-preset-${dashedName}`,
+    description,
+    `tsparticles.preset.${camelizedName}.min.js`,
+    repoUrl,
+  );
+}
+
+/**
+ * Updates the preset package dist file
+ * @param destPath - The path where the project is located
+ * @param name - The name of the project
+ * @param description - The description of the project
+ * @param repoUrl - The repository url
+ */
+async function updatePresetPackageDistFile(
+  destPath: string,
+  name: string,
+  description: string,
+  repoUrl: string,
+): Promise<void> {
+  const camelizedName = camelize(name, "-", " "),
+    dashedName = dash(camelizedName);
+
+  await updatePackageDistFile(
+    destPath,
+    `tsparticles-preset-${dashedName}`,
+    description,
+    `tsparticles.preset.${camelizedName}.min.js`,
+    repoUrl,
+  );
+}
+
+/**
+ * Updates the preset readme file
+ * @param destPath - The path where the project is located
+ * @param name - The name of the project
+ * @param description - The description of the project
+ * @param repoUrl - The repository url
+ */
+async function updateReadmeFile(destPath: string, name: string, description: string, repoUrl: string): Promise<void> {
+  const capitalizedName = capitalize(name, "-", " "),
+    camelizedName = camelize(capitalizedName),
+    dashedName = dash(camelizedName),
+    stringSearch = "github.com",
+    trailingSlashSearch = "github.com/",
+    repoPath = repoUrl.includes(stringSearch)
+      ? repoUrl.substring(repoUrl.indexOf(trailingSlashSearch) + trailingSlashSearch.length, repoUrl.indexOf(".git"))
+      : "tsparticles/preset-template";
+
+  await replaceTokensInFile({
+    path: path.join(destPath, "README.md"),
+    tokens: [
+      {
+        from: /tsParticles Template Preset/g,
+        to: `tsParticles ${description} Preset`,
+      },
+      {
+        from: /tsparticles-preset-template/g,
+        to: `tsparticles-preset-${dashedName}`,
+      },
+      {
+        from: /tsparticles\.preset\.template(\.bundle)?\.min\.js/g,
+        to: `tsparticles.preset.${camelizedName}$1.min.js`,
+      },
+      {
+        from: /loadTemplatePreset/g,
+        to: `load${capitalizedName}Preset`,
+      },
+      {
+        from: /\[tsParticles]\(https:\/\/github.com\/matteobruni\/tsparticles\) preset template\./g,
+        to: `[tsParticles](https://github.com/matteobruni/tsparticles) preset ${name}.`,
+      },
+      {
+        from: /preset: "template"/g,
+        to: `preset: "${camelizedName}`,
+      },
+      {
+        from: /!\[demo]\(https:\/\/raw.githubusercontent.com\/tsparticles\/preset-template\/main\/images\/sample.png\)/g,
+        to: `![demo](https://raw.githubusercontent.com/${repoPath}/main/images/sample.png)`,
+      },
+    ],
+  });
+}
+
+/**
+ * Updates the preset webpack file
+ * @param destPath - The path where the project is located
+ * @param name - The name of the project
+ * @param description - The description of the project
+ */
+async function updatePresetWebpackFile(destPath: string, name: string, description: string): Promise<void> {
+  await updateWebpackFile(destPath, camelize(capitalize(name, "-", " ")), description, "loadParticlesPreset");
+}
+
+/**
+ * Creates the preset project
+ * @param name - The name of the project
+ * @param description - The description of the project
+ * @param repoUrl - The repository url
+ * @param destPath - The path where the project is located
+ */
+export async function createPresetTemplate(
+  name: string,
+  description: string,
+  repoUrl: string,
+  destPath: string,
+): Promise<void> {
+  const sourcePath = path.join(__dirname, "..", "..", "files", "create-preset");
+
+  await copyEmptyTemplateFiles(destPath);
+
+  await cp(sourcePath, destPath, {
+    recursive: true,
+    force: true,
+    filter: copyFilter,
+  });
+
+  await updateBundleFile(destPath, name);
+  await updateIndexFile(destPath, name);
+  await updatePresetPackageFile(destPath, name, description, repoUrl);
+  await updatePresetPackageDistFile(destPath, name, description, repoUrl);
+  await updateReadmeFile(destPath, name, description, repoUrl);
+  await updatePresetWebpackFile(destPath, name, description);
+
+  await runInstall(destPath);
+  await runBuild(destPath);
+}

package/src/preset/preset.ts

@@ -0,0 +1,46 @@
+import { capitalize, getDestinationDir, getRepositoryUrl } from "@tsparticles/cli-create-utils";
+import prompts, { type PromptObject } from "prompts";
+import { Command } from "commander";
+import { createPresetTemplate } from "./create-preset.js";
+import path from "node:path";
+
+const presetCommand = new Command("preset");
+
+presetCommand.description("Create a new tsParticles preset");
+presetCommand.argument("<destination>", "Destination folder");
+presetCommand.action(async (destination: string) => {
+  const destPath = await getDestinationDir(destination),
+    repoUrl = await getRepositoryUrl(),
+    initialName = destPath.split(path.sep).pop(),
+    questions: PromptObject[] = [
+      {
+        type: "text",
+        name: "name",
+        message: "What is the name of the preset?",
+        validate: (value: string) => (value ? true : "The name can't be empty"),
+        initial: initialName,
+      },
+      {
+        type: "text",
+        name: "description",
+        message: "What is the description of the preset?",
+        validate: (value: string) => (value ? true : "The description can't be empty"),
+        initial: capitalize(initialName ?? ""),
+      },
+      {
+        type: "text",
+        name: "repositoryUrl",
+        message: "What is the repository URL? (optional)",
+        initial: repoUrl.trim(),
+      },
+    ],
+    { name, description, repositoryUrl } = (await prompts(questions)) as {
+      description: string;
+      name: string;
+      repositoryUrl: string;
+    };
+
+  await createPresetTemplate(name.trim(), description.trim(), repositoryUrl.trim(), destPath);
+});
+
+export { presetCommand };

package/src/shape/create-shape.ts

@@ -0,0 +1,200 @@
+import {
+  camelize,
+  capitalize,
+  copyEmptyTemplateFiles,
+  copyFilter,
+  dash,
+  replaceTokensInFile,
+  runBuild,
+  runInstall,
+  updatePackageDistFile,
+  updatePackageFile,
+  updateWebpackFile,
+} from "@tsparticles/cli-create-utils";
+import { cp } from "node:fs/promises";
+import path from "node:path";
+
+/**
+ * Updates the index file with the correct function name
+ * @param destPath - The path where the project is located
+ * @param name - The name of the project
+ */
+async function updateIndexFile(destPath: string, name: string): Promise<void> {
+  const capitalizedName = capitalize(name, "-", " "),
+    camelizedName = camelize(capitalizedName);
+
+  await replaceTokensInFile({
+    path: path.join(destPath, "src", "index.ts"),
+    tokens: [
+      {
+        from: /loadTemplateShape/g,
+        to: `load${capitalizedName}Shape`,
+      },
+    ],
+  });
+
+  await replaceTokensInFile({
+    path: path.join(destPath, "src", "index.lazy.ts"),
+    tokens: [
+      {
+        from: /loadTemplateShape/g,
+        to: `load${capitalizedName}Shape`,
+      },
+    ],
+  });
+
+  await replaceTokensInFile({
+    path: path.join(destPath, "src", "ShapeDrawer.ts"),
+    tokens: [
+      {
+        from: /"#template#"/g,
+        to: `"${camelizedName}"`,
+      },
+    ],
+  });
+}
+
+/**
+ * Updates the shape package file
+ * @param destPath - The path where the project is located
+ * @param name - The name of the project
+ * @param description - The description of the project
+ * @param repoUrl - The repository url
+ */
+async function updateShapePackageFile(
+  destPath: string,
+  name: string,
+  description: string,
+  repoUrl: string,
+): Promise<void> {
+  const camelizedName = camelize(camelize(name, "-"), " "),
+    dashedName = dash(camelizedName);
+
+  await updatePackageFile(
+    destPath,
+    `tsparticles-shape-${dashedName}`,
+    description,
+    `tsparticles.shape.${camelizedName}.min.js`,
+    repoUrl,
+  );
+}
+
+/**
+ * Updates the shape package dist file
+ * @param destPath - The path where the project is located
+ * @param name - The name of the project
+ * @param description - The description of the project
+ * @param repoUrl - The repository url
+ */
+async function updateShapePackageDistFile(
+  destPath: string,
+  name: string,
+  description: string,
+  repoUrl: string,
+): Promise<void> {
+  const camelizedName = camelize(camelize(name, "-"), " "),
+    dashedName = dash(camelizedName);
+
+  await updatePackageDistFile(
+    destPath,
+    `tsparticles-shape-${dashedName}`,
+    description,
+    `tsparticles.shape.${camelizedName}.min.js`,
+    repoUrl,
+  );
+}
+
+/**
+ * Updates the shape readme file
+ * @param destPath - The path where the project is located
+ * @param name - The name of the project
+ * @param description - The description of the project
+ * @param repoUrl - The repository url
+ */
+async function updateReadmeFile(destPath: string, name: string, description: string, repoUrl: string): Promise<void> {
+  const capitalizedName = capitalize(name, "-", " "),
+    camelizedName = camelize(capitalizedName),
+    dashedName = dash(camelizedName),
+    stringSearch = "github.com",
+    trailingSlashSearch = "github.com/",
+    repoPath = repoUrl.includes(stringSearch)
+      ? repoUrl.substring(repoUrl.indexOf(trailingSlashSearch) + trailingSlashSearch.length, repoUrl.indexOf(".git"))
+      : "tsparticles/shape-template";
+
+  await replaceTokensInFile({
+    path: path.join(destPath, "README.md"),
+    tokens: [
+      {
+        from: /tsParticles Template Shape/g,
+        to: `tsParticles ${description} Shape`,
+      },
+      {
+        from: /tsparticles-shape-template/g,
+        to: `tsparticles-shape-${dashedName}`,
+      },
+      {
+        from: /tsparticles\.shape\.template(\.bundle)?\.min\.js/g,
+        to: `tsparticles.shape.${camelizedName}$1.min.js`,
+      },
+      {
+        from: /loadTemplateShape/g,
+        to: `load${capitalizedName}Shape`,
+      },
+      {
+        from: /\[tsParticles]\(https:\/\/github.com\/matteobruni\/tsparticles\) additional template shape\./g,
+        to: `[tsParticles](https://github.com/matteobruni/tsparticles) additional ${name} shape.`,
+      },
+      {
+        from: /shape\.type: "template"/g,
+        to: `shape.type: "${camelizedName}`,
+      },
+      {
+        from: /!\[demo]\(https:\/\/raw.githubusercontent.com\/tsparticles\/shape-template\/main\/images\/sample.png\)/g,
+        to: `![demo](https://raw.githubusercontent.com/${repoPath}/main/images/sample.png)`,
+      },
+    ],
+  });
+}
+
+/**
+ * Updates the shape webpack file
+ * @param destPath - The path where the project is located
+ * @param name - The name of the project
+ * @param description - The description of the project
+ */
+async function updateShapeWebpackFile(destPath: string, name: string, description: string): Promise<void> {
+  await updateWebpackFile(destPath, camelize(capitalize(name, "-", " ")), description, "loadParticlesShape");
+}
+
+/**
+ * Creates the shape project
+ * @param name - The name of the project
+ * @param description - The description of the project
+ * @param repoUrl - The repository url
+ * @param destPath - The path where the project is located
+ */
+export async function createShapeTemplate(
+  name: string,
+  description: string,
+  repoUrl: string,
+  destPath: string,
+): Promise<void> {
+  const sourcePath = path.join(__dirname, "..", "..", "files", "create-shape");
+
+  await copyEmptyTemplateFiles(destPath);
+
+  await cp(sourcePath, destPath, {
+    recursive: true,
+    force: true,
+    filter: copyFilter,
+  });
+
+  await updateIndexFile(destPath, name);
+  await updateShapePackageFile(destPath, name, description, repoUrl);
+  await updateShapePackageDistFile(destPath, name, description, repoUrl);
+  await updateReadmeFile(destPath, name, description, repoUrl);
+  await updateShapeWebpackFile(destPath, name, description);
+
+  await runInstall(destPath);
+  await runBuild(destPath);
+}