create-conformal 0.1.3

package/.eslintrc.cjs

@@ -0,0 +1,9 @@
+module.exports = {
+  root: true,
+  extends: ["eslint-config-custom"],
+  parserOptions: {
+    project: ["./tsconfig.json"],
+    tsconfigRootDir: __dirname,
+  },
+  ignorePatterns: ["template/**"],
+};

package/.prettierignore

@@ -0,0 +1 @@
+template

package/package.json

@@ -0,0 +1,21 @@
+{
+  "name": "create-conformal",
+  "version": "0.1.3",
+  "description": "Project generator script for conformal projects",
+  "homepage": "https://github.com/russellmcc/conformal",
+  "bugs": "https://github.com/russellmcc/conformal/issues",
+  "license": "ISC",
+  "scripts": {
+    "lint": "tsc && eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
+    "check-format": "prettier -c .",
+    "format": "prettier --write ."
+  },
+  "bin": "./src/index.ts",
+  "type": "module",
+  "dependencies": {
+    "@commander-js/extra-typings": "^12.1.0",
+    "@inquirer/prompts": "^5.3.8",
+    "commander": "^12.1.0",
+    "handlebars": "^4.7.8"
+  }
+}

package/package.json.bak

@@ -0,0 +1,21 @@
+{
+  "name": "create-conformal",
+  "version": "0.1.3",
+  "description": "Project generator script for conformal projects",
+  "homepage": "https://github.com/russellmcc/conformal",
+  "bugs": "https://github.com/russellmcc/conformal/issues",
+  "license": "ISC",
+  "scripts": {
+    "lint": "tsc && eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
+    "check-format": "prettier -c .",
+    "format": "prettier --write ."
+  },
+  "bin": "./src/index.ts",
+  "type": "module",
+  "dependencies": {
+    "@commander-js/extra-typings": "^12.1.0",
+    "@inquirer/prompts": "^5.3.8",
+    "commander": "^12.1.0",
+    "handlebars": "^4.7.8"
+  }
+}

package/src/config.ts

@@ -0,0 +1,97 @@
+import { Command } from "@commander-js/extra-typings";
+import { input } from "@inquirer/prompts";
+import uuidHex from "./uuid";
+
+export type Config = {
+  proj_slug: string;
+  plug_slug: string;
+  plug_name: string;
+  vendor_name: string;
+};
+
+type ConfigMetadata = {
+  key: keyof Config;
+  prompt: string;
+  description: string;
+  default?: string;
+};
+
+export const toEnv = (
+  config: Config,
+  { skipTodo } = { skipTodo: false },
+): Record<string, string> => ({
+  ...config,
+  class_id: uuidHex(),
+  edit_class_id: uuidHex(),
+  task_marker: skipTodo ? "DONE" : "TOD" + "O",
+});
+
+const metadatas: ConfigMetadata[] = [
+  {
+    key: "proj_slug",
+    prompt: "Project slug (lower snake_case, e.g. `my_project`)",
+    description: "Slug for the project in lower snake_case, e.g. `my_project`",
+    default: "my_project",
+  },
+  {
+    key: "plug_slug",
+    prompt: "Plug-in slug (lower snake_case, e.g. `my_plugin`)",
+    description:
+      "The name of the first plug-in in lower snake_case, e.g. `my_plugin`",
+    default: "my_plugin",
+  },
+  {
+    key: "vendor_name",
+    prompt:
+      'Human-readable vendor name (DAWs often present plug-ins grouped by vendor).  e.g., "My Project"?',
+    description:
+      "Human-readable vendor name, e.g. `My Project`. DAWs often present plug-ins grouped by vendor",
+    default: "My Project",
+  },
+  {
+    key: "plug_name",
+    prompt: "Human-readable plug-in name (e.g. `My Plug-in`)?",
+    description: "Human-readable vendor name, e.g. `My Plug-in`",
+    default: "My Plug-in",
+  },
+];
+
+const fromCli = async (argv?: readonly string[]): Promise<Partial<Config>> => {
+  const command = new Command();
+  for (const { key, description } of metadatas) {
+    if (key !== "proj_slug") {
+      command.option(`--${key} <${key}>`, description);
+    } else {
+      // Name is a positional argument
+      command.argument("<proj_slug>", description);
+    }
+  }
+  const processed = await command.parseAsync(argv);
+
+  const ret = Object.fromEntries(
+    Object.entries(processed.opts()).filter(([_, v]) => v !== undefined),
+  );
+  if (processed.args.length > 0) {
+    ret.proj_slug = processed.args[0];
+  }
+  return ret;
+};
+
+const doPrompt = async (metadata: ConfigMetadata): Promise<string> =>
+  input({ message: metadata.prompt, default: metadata.default });
+
+const promptRemainder = async (config: Partial<Config>): Promise<Config> => {
+  const ret: Partial<Config> = { ...config };
+  for (const metadata of metadatas) {
+    if (metadata.key in ret) {
+      continue;
+    }
+    ret[metadata.key] = await doPrompt(metadata);
+  }
+  // Note that we've filled in all of config here, since metadatas must contain all configs!
+  // It would be cool to check this in ts but I don't know how
+  return ret as Config;
+};
+
+export const getConfig = async (argv?: readonly string[]): Promise<Config> =>
+  await promptRemainder(await fromCli(argv));

package/src/index.ts

@@ -0,0 +1,16 @@
+#!/usr/bin/env bun
+
+import { getConfig, toEnv } from "./config";
+import { stampTemplate } from "./stamp";
+import path from "node:path";
+import { $ } from "bun";
+
+const config = await getConfig();
+const dest = config.proj_slug;
+await stampTemplate(
+  dest,
+  path.join(path.dirname(import.meta.path), "..", "template"),
+  toEnv(config),
+);
+
+await $`git init`.cwd(dest);

package/src/stamp.ts

@@ -0,0 +1,46 @@
+import { promises as fs } from "node:fs";
+import path from "node:path";
+import { compile } from "handlebars";
+
+const dirExists = async (dir: string) => {
+  try {
+    await fs.readdir(dir);
+    return true;
+  } catch {
+    return false;
+  }
+};
+
+export const stampTemplate = async (
+  dest: string,
+  templateDir: string,
+  env: Record<string, string>,
+) => {
+  if (await dirExists(dest)) {
+    throw new Error(`Directory already exists: ${dest}`);
+  }
+
+  const files = await fs.readdir(templateDir, {
+    recursive: true,
+    withFileTypes: true,
+  });
+  for (const file of files) {
+    const srcPath = path.join(file.path, file.name);
+    const destPath = path.join(
+      dest,
+      compile(path.relative(templateDir, srcPath))(env),
+    );
+
+    if (file.isDirectory()) {
+      continue;
+    }
+
+    if (await Bun.file(destPath).exists()) {
+      throw new Error(`File already exists: ${destPath}`);
+    }
+
+    await fs.mkdir(path.dirname(destPath), { recursive: true });
+    const srcContent = await Bun.file(srcPath).text();
+    await Bun.write(destPath, compile(srcContent)(env));
+  }
+};

package/src/template.test.ts

@@ -0,0 +1,69 @@
+import { describe, test, expect } from "bun:test";
+import { withDir } from "tmp-promise";
+import path from "node:path";
+import { $ } from "bun";
+import { Config, toEnv } from "./config";
+import { stampTemplate } from "./stamp";
+
+const TEST_CONFIG: Config = {
+  proj_slug: "test",
+  plug_slug: "test_plug",
+  plug_name: "Test Plug",
+  vendor_name: "Test Project",
+};
+
+const MINUTE = 60_000;
+
+describe("create-conformal template", () => {
+  test(
+    "passes CI",
+    async () => {
+      await withDir(
+        async ({ path: tmpDir }) => {
+          const workspacePath = path.join(
+            import.meta.path,
+            "..",
+            "..",
+            "..",
+            "..",
+          );
+
+          // Note that bun skips dependencies when installing packages from local paths :'(,
+          // so instead, we use `npm pack` to create tarballs.
+
+          const localDependencies = ["scripts", "plugin"];
+          for (const dep of localDependencies) {
+            await $`npm pack --pack-destination=${tmpDir}`.cwd(
+              path.join(workspacePath, "web", dep),
+            );
+            expect(
+              Bun.file(
+                path.join(tmpDir, `conformal-${dep}-0.0.0.tgz`),
+              ).exists(),
+            ).resolves.toBe(true);
+          }
+
+          // stamp the template
+          const dest = path.join(tmpDir, TEST_CONFIG.proj_slug);
+          await stampTemplate(
+            dest,
+            path.join(workspacePath, "web", "create", "template"),
+            toEnv(TEST_CONFIG, { skipTodo: true }),
+          );
+          await $`git init`.cwd(dest);
+
+          // Note we use perl as a sed replacement because of https://github.com/oven-sh/bun/issues/13197,
+          // which makes sed unusable on macOS.
+          const perl_command = `s/"\\@conformal\\/([^"]+)": "workspace:\\*"/"\\@conformal\\/$1": "file:..\\/conformal-$1-0.0.0.tgz"/`;
+          await $`perl -pi -e ${perl_command} package.json`.cwd(dest);
+
+          // Make sure CI would pass.
+          await $`bun install`.cwd(dest);
+          await $`bun run ci`.cwd(dest);
+        },
+        { unsafeCleanup: true },
+      );
+    },
+    3 * MINUTE,
+  );
+});

package/src/uuid.ts

@@ -0,0 +1,4 @@
+const uuidHex = () =>
+  crypto.randomUUID().replace(/-/g, "").replace(/../g, "0x$&, ").slice(0, -1);
+
+export default uuidHex;

package/template/.gitattributes

@@ -0,0 +1,2 @@
+*.wav filter=lfs diff=lfs merge=lfs -text
+*.woff2 filter=lfs diff=lfs merge=lfs -text

package/template/.github/actions/bootstrap/action.yml

@@ -0,0 +1,11 @@
+name: "Bootstrap"
+description: "Get ready to run ci or release"
+runs:
+  using: "composite"
+  steps:
+    - run: brew install oven-sh/bun/bun
+      shell: bash
+    - run: bun install --frozen-lockfile
+      shell: bash
+    - run: bun run bootstrap
+      shell: bash

package/template/.github/workflows/ci.yml

@@ -0,0 +1,17 @@
+name: CI
+run-name: CI
+
+on:
+  push:
+    branches:
+      - "*"
+
+jobs:
+  ci:
+    runs-on: macos-14
+    steps:
+      - uses: actions/checkout@v4
+        with:
+          lfs: "true"
+      - uses: ./.github/actions/bootstrap
+      - run: bun run ci

package/template/.github/workflows/release.yml

@@ -0,0 +1,68 @@
+name: Release
+run-name: Release
+
+on:
+  push:
+    tags:
+      - "v*.*.*"
+
+jobs:
+  release:
+    permissions:
+      contents: write
+    runs-on: macos-14
+    steps:
+      - uses: actions/checkout@v4
+        with:
+          lfs: "true"
+      # This is from https://docs.github.com/en/actions/use-cases-and-examples/deploying/installing-an-apple-certificate-on-macos-runners-for-xcode-development
+      - name: Install the Apple certificate and provisioning profile
+        env:
+          APPLICATION_P12_BASE64: $\{{ secrets.APPLICATION_P12_BASE64 }}
+          APPLICATION_P12_PASSWORD: $\{{ secrets.APPLICATION_P12_PASSWORD }}
+          INSTALLER_P12_BASE64: $\{{ secrets.INSTALLER_P12_BASE64 }}
+          INSTALLER_P12_PASSWORD: $\{{ secrets.INSTALLER_P12_PASSWORD }}
+          KEYCHAIN_PASSWORD: $\{{ secrets.KEYCHAIN_PASSWORD }}
+        run: |
+          # create variables
+          APPLICATION_PATH=$RUNNER_TEMP/application.p12
+          INSTALLER_PATH=$RUNNER_TEMP/installer.p12
+          KEYCHAIN_PATH=$RUNNER_TEMP/app-signing.keychain-db
+
+          # import certificate and provisioning profile from secrets
+          echo -n "$APPLICATION_P12_BASE64" | base64 --decode -o $APPLICATION_PATH
+          echo -n "$INSTALLER_P12_BASE64" | base64 --decode -o $INSTALLER_PATH
+
+          # create temporary keychain
+          security create-keychain -p "$KEYCHAIN_PASSWORD" $KEYCHAIN_PATH
+          security set-keychain-settings -lut 21600 $KEYCHAIN_PATH
+          security unlock-keychain -p "$KEYCHAIN_PASSWORD" $KEYCHAIN_PATH
+
+          # import certificate to keychain
+          security import $APPLICATION_PATH -P "$APPLICATION_P12_PASSWORD" -A -t cert -f pkcs12 -k $KEYCHAIN_PATH
+          security import $INSTALLER_PATH -P "$INSTALLER_P12_PASSWORD" -A -t cert -f pkcs12 -k $KEYCHAIN_PATH
+          security set-key-partition-list -S apple-tool:,apple: -k "$KEYCHAIN_PASSWORD" $KEYCHAIN_PATH
+          security list-keychain -d user -s $KEYCHAIN_PATH > /dev/null
+      - name: Log in to notarytool
+        env:
+          NOTARYTOOL_CREDENTIALS_KEYCHAIN_ITEM: $\{{ secrets.NOTARYTOOL_CREDENTIALS_KEYCHAIN_ITEM }}
+          NOTARYTOOL_APPLE_ID: $\{{ secrets.NOTARYTOOL_APPLE_ID }}
+          NOTARYTOOL_DEVELOPER_TEAM_ID: $\{{ secrets.NOTARYTOOL_DEVELOPER_TEAM_ID }}
+          NOTARYTOOL_PASSWORD: $\{{ secrets.NOTARYTOOL_PASSWORD }}
+        run: |
+          KEYCHAIN_PATH=$RUNNER_TEMP/app-signing.keychain-db        
+          xcrun notarytool store-credentials "$NOTARYTOOL_CREDENTIALS_KEYCHAIN_ITEM" --apple-id "$NOTARYTOOL_APPLE_ID" --team-id "$NOTARYTOOL_DEVELOPER_TEAM_ID" --password "$NOTARYTOOL_PASSWORD" --keychain "$KEYCHAIN_PATH"
+      - uses: ./.github/actions/bootstrap
+      - run: bun run ci
+      - run: NOTARYTOOL_KEYCHAIN_PATH=$RUNNER_TEMP/app-signing.keychain-db bun run package {{plug_slug}} --dist
+        env:
+          DEVELOPER_ID_APPLICATION: $\{{ secrets.DEVELOPER_ID_APPLICATION }}
+          DEVELOPER_ID_INSTALLER: $\{{ secrets.DEVELOPER_INSTALLER_ID }}
+          NOTARYTOOL_CREDENTIALS_KEYCHAIN_ITEM: $\{{ secrets.NOTARYTOOL_CREDENTIALS_KEYCHAIN_ITEM }}
+      - name: Release
+        uses: softprops/action-gh-release@v2
+        with:
+          prerelease: $\{{ contains(github.ref, '-') }}
+          body: "Release $\{{ github.ref_name }}" # Prevent auto generation of release notes
+          files: |
+            target/release/{{plug_name}}.dmg

package/template/Cargo.toml

@@ -0,0 +1,6 @@
+[workspace]
+resolver = "2"
+members = [
+    "rust/{{plug_slug}}/component",
+    "rust/{{plug_slug}}/vst",
+]

package/template/package.json

@@ -0,0 +1,47 @@
+{
+  "name": "{{proj_slug}}",
+  "private": true,
+  "workspaces": [
+    "web/*"
+  ],
+  "scripts": {
+    "bootstrap": "conformal-scripts bootstrap",
+    "ci": "conformal-scripts ci",
+    "check-lfs": "conformal-scripts check-lfs",
+    "check-todo": "conformal-scripts check-todo",
+    "check-format": "conformal-scripts check-format",
+    "format": "conformal-scripts format",
+    "web-dev": "conformal-scripts web-script -s dev",
+    "web-build": "conformal-scripts web-script -s build",
+    "web-lint": "conformal-scripts web-script -s lint",
+    "web-test": "bun test",
+    "rust-miri": "PROPTEST_DISABLE_FAILURE_PERSISTENCE=true MIRIFLAGS='-Zmiri-env-forward=PROPTEST_DISABLE_FAILURE_PERSISTENCE' conformal-scripts cargo +nightly miri test",
+    "rust-build": "conformal-scripts cargo build",
+    "rust-lint": "conformal-scripts cargo clippy",
+    "rust-test": "conformal-scripts cargo test",
+    "rust-bench": "conformal-scripts cargo bench",
+    "package": "conformal-scripts web-script -s package",
+    "validate": "conformal-scripts web-script -s validate"
+  },
+  "devDependencies": {
+    "@types/bun": "1.1.0",
+    "@typescript-eslint/eslint-plugin": "^7.7.0",
+    "@typescript-eslint/parser": "^7.7.0",
+    "@vitejs/plugin-react-swc": "^3.6.0",
+    "@types/react": "^18.2.79",
+    "@types/react-dom": "^18.2.25",
+    "eslint": "^8.57.0",
+    "eslint-plugin-prefer-arrow-functions": "^3.3.2",
+    "eslint-plugin-react": "^7.34.1",
+    "eslint-plugin-react-hooks": "^4.6.0",
+    "eslint-plugin-react-refresh": "^0.4.6",
+    "prettier": "^3.2.5",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "typescript": "^5.4.5",
+    "vite": "^5.2.9",
+    "@conformal/scripts": "^0.1.3",
+    "@conformal/plugin": "^0.1.3",
+    "rollup-plugin-license": "^3.4.0"
+  }
+}

package/template/prettier.config.mjs

@@ -0,0 +1 @@
+export default {};

package/template/rust/{{plug_slug}}/component/Cargo.toml

@@ -0,0 +1,9 @@
+[package]
+name = "{{plug_slug}}_component"
+edition = "2021"
+rust-version = "1.79.0"
+publish = false
+
+[dependencies]
+conformal_vst_wrapper = "0.1.0"
+conformal_component = "0.1.0"

package/template/rust/{{plug_slug}}/component/src/lib.rs

@@ -0,0 +1,82 @@
+#![warn(
+    nonstandard_style,
+    rust_2018_idioms,
+    future_incompatible,
+    clippy::pedantic,
+    clippy::todo
+)]
+#![allow(
+    clippy::type_complexity,
+    clippy::cast_sign_loss,
+    clippy::cast_possible_wrap,
+    clippy::default_trait_access
+)]
+
+use conformal_component::audio::{channels, channels_mut, Buffer, BufferMut};
+use conformal_component::effect::Effect as EffectTrait;
+use conformal_component::parameters::{self, BufferStates, Flags, InfoRef, TypeSpecificInfoRef};
+use conformal_component::pzip;
+use conformal_component::{Component as ComponentTrait, ProcessingEnvironment, Processor};
+
+const PARAMETERS: [InfoRef<'static, &'static str>; 2] = [
+    InfoRef {
+        title: "Bypass",
+        short_title: "Bypass",
+        unique_id: "bypass",
+        flags: Flags { automatable: true },
+        type_specific: TypeSpecificInfoRef::Switch { default: false },
+    },
+    InfoRef {
+        title: "Gain",
+        short_title: "Gain",
+        unique_id: "gain",
+        flags: Flags { automatable: true },
+        type_specific: TypeSpecificInfoRef::Numeric {
+            default: 100.,
+            valid_range: 0f32..=100.,
+            units: "%",
+        },
+    },
+];
+
+#[derive(Clone, Debug, Default)]
+pub struct Component {}
+
+#[derive(Clone, Debug, Default)]
+pub struct Effect {}
+
+impl Processor for Effect {
+    fn set_processing(&mut self, _processing: bool) {}
+}
+
+impl EffectTrait for Effect {
+    fn handle_parameters<P: parameters::States>(&mut self, _: P) {}
+    fn process<P: BufferStates, I: Buffer, O: BufferMut>(
+        &mut self,
+        parameters: P,
+        input: &I,
+        output: &mut O,
+    ) {
+        for (input_channel, output_channel) in channels(input).zip(channels_mut(output)) {
+            for ((input_sample, output_sample), (gain, bypass)) in input_channel
+                .iter()
+                .zip(output_channel.iter_mut())
+                .zip(pzip!(parameters[numeric "gain", switch "bypass"]))
+            {
+                *output_sample = *input_sample * (if bypass { 1.0 } else { gain / 100.0 });
+            }
+        }
+    }
+}
+
+impl ComponentTrait for Component {
+    type Processor = Effect;
+
+    fn parameter_infos(&self) -> Vec<parameters::Info> {
+        parameters::to_infos(&PARAMETERS)
+    }
+
+    fn create_processor(&self, _env: &ProcessingEnvironment) -> Self::Processor {
+        Default::default()
+    }
+}

package/template/rust/{{plug_slug}}/vst/Cargo.toml

@@ -0,0 +1,13 @@
+[package]
+name = "{{plug_slug}}_vst"
+edition = "2021"
+rust-version = "1.79.0"
+publish = false
+
+[lib]
+crate-type = ["cdylib"]
+
+[dependencies]
+conformal_vst_wrapper = "0.1.0"
+vst3 = "0.1.2"
+{{plug_slug}}_component = { path = "../component" }

package/template/rust/{{plug_slug}}/vst/about.hbs

@@ -0,0 +1,13 @@
+{{task_marker}}: Add end-user license information here! This file will be shown
+in the installer. This program was created using a variety of open source
+software, whose licenses are listed below. All distributions of this software
+must contain these license notices.
+
+\{{#each licenses}}
+\{{#each used_by}} -----
+\{{crate.name}}
+\{{crate.version}} (\{{{../name}}})
+
+\{{{../text}}}
+\{{/each}}
+\{{/each}}

package/template/rust/{{plug_slug}}/vst/about.toml

@@ -0,0 +1,10 @@
+accepted = [
+    "MIT",
+    "ISC",
+    "MPL-2.0",
+    "Apache-2.0 WITH LLVM-exception",
+    "Apache-2.0",
+    "Unicode-DFS-2016",
+]
+
+ignore-dev-dependencies = true

package/template/rust/{{plug_slug}}/vst/src/lib.rs

@@ -0,0 +1,49 @@
+#![warn(
+    nonstandard_style,
+    rust_2018_idioms,
+    future_incompatible,
+    clippy::pedantic,
+    clippy::todo
+)]
+#![allow(
+    clippy::type_complexity,
+    clippy::cast_sign_loss,
+    clippy::cast_possible_wrap,
+    clippy::default_trait_access
+)]
+
+use {{plug_slug}}_component::Component;
+
+use conformal_vst_wrapper::{ClassID, ClassInfo, EffectClass, HostInfo, Info};
+
+const CID: ClassID = [
+    {{class_id}}
+];
+const EDIT_CONTROLLER_CID: ClassID = [
+    {{edit_class_id}}
+];
+
+conformal_vst_wrapper::wrap_factory!(
+    &const {
+        [&EffectClass {
+            info: ClassInfo {
+                name: "{{plug_name}}",
+                cid: CID,
+                edit_controller_cid: EDIT_CONTROLLER_CID,
+                ui_initial_size: conformal_vst_wrapper::UiSize {
+                    width: 400,
+                    height: 400,
+                },
+            },
+            factory: |_: &HostInfo| -> Component { Default::default() },
+            category: "Fx",
+            bypass_id: "bypass",
+        }]
+    },
+    Info {
+        vendor: "{{vendor_name}}",
+        url: "{{task_marker}} add URL",
+        email: "test@example.com",
+        version: "1.0.0",
+    }
+);

package/template/web/eslint-config-custom/config.cjs

@@ -0,0 +1,45 @@
+module.exports = {
+  root: true,
+  env: { browser: true, es2020: true },
+  extends: [
+    "eslint:recommended",
+    "plugin:@typescript-eslint/recommended-type-checked",
+    "plugin:@typescript-eslint/stylistic-type-checked",
+    "plugin:react-hooks/recommended",
+    "plugin:react/recommended",
+    "plugin:react/jsx-runtime",
+  ],
+  ignorePatterns: ["dist", ".eslintrc.cjs"],
+  parser: "@typescript-eslint/parser",
+  parserOptions: {
+    ecmaVersion: "latest",
+    sourceType: "module",
+  },
+  plugins: ["react-refresh", "prefer-arrow-functions"],
+  rules: {
+    "@typescript-eslint/no-unused-vars": [
+      "error",
+      {
+        argsIgnorePattern: "^_",
+      },
+    ],
+    "react-refresh/only-export-components": [
+      "warn",
+      { allowConstantExport: true },
+    ],
+    "react-hooks/exhaustive-deps": "error",
+    "prefer-arrow-functions/prefer-arrow-functions": [
+      "error",
+      {
+        returnStyle: "implicit",
+      },
+    ],
+    "@typescript-eslint/consistent-type-definitions": ["error", "type"],
+    "no-warning-comments": "error",
+  },
+  settings: {
+    react: {
+      version: "detect",
+    },
+  },
+};

package/template/web/eslint-config-custom/package.json

@@ -0,0 +1,5 @@
+{
+  "name": "eslint-config-custom",
+  "main": "config.cjs",
+  "private": true
+}

package/template/web/tsconfig/package.json

@@ -0,0 +1,4 @@
+{
+  "name": "tsconfig",
+  "private": true
+}

package/template/web/tsconfig/tsconfig.json

@@ -0,0 +1,20 @@
+{
+  "compilerOptions": {
+    "target": "es2020",
+    "useDefineForClassFields": true,
+    "lib": ["es2020", "dom", "dom.iterable"],
+    "module": "esnext",
+    "skipLibCheck": true,
+    /* Bundler mode */
+    "moduleResolution": "bundler",
+    "allowImportingTsExtensions": true,
+    "isolatedModules": true,
+    "noEmit": true,
+    "jsx": "react-jsx",
+    /* Linting */
+    "strict": true,
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
+    "noFallthroughCasesInSwitch": true
+  }
+}

package/template/web/{{plug_slug}}/.eslintrc.cjs

@@ -0,0 +1,8 @@
+module.exports = {
+  root: true,
+  extends: ["eslint-config-custom"],
+  parserOptions: {
+    project: ["./tsconfig.json"],
+    tsconfigRootDir: __dirname,
+  },
+};

package/template/web/{{plug_slug}}/bundle.json

@@ -0,0 +1,7 @@
+{
+  "rustPackage": "{{plug_slug}}_vst",
+  "name": "{{plug_name}}",
+  "id": "com.{{task_marker}}.{{plug_slug}}",
+  "sig": "{{task_marker}}",
+  "version": "0.0.0"
+}

package/template/web/{{plug_slug}}/index.html

@@ -0,0 +1,10 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+  </head>
+  <body>
+    <div id="root"></div>
+    <script type="module" src="src/main.tsx"></script>
+  </body>
+</html>

package/template/web/{{plug_slug}}/package.json

@@ -0,0 +1,15 @@
+{
+  "name": "{{plug_slug}}",
+  "private": true,
+  "scripts": {
+    "dev": "vite",
+    "build": "tsc && vite build",
+    "lint": "tsc && eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
+    "preview": "vite preview",
+    "check-format": "prettier --ignore-path .gitignore -c .",
+    "format": "prettier --ignore-path .gitignore --write .",
+    "package": "conformal-scripts package",
+    "validate": "conformal-scripts validate"
+  },
+  "type": "module"
+}

package/template/web/{{plug_slug}}/src/App.tsx

@@ -0,0 +1,11 @@
+import { DevModeTools } from "@conformal/plugin";
+import Layout from "./Layout.tsx";
+
+const App = () => (
+  <div>
+    <Layout />
+    <DevModeTools />
+  </div>
+);
+
+export default App;

package/template/web/{{plug_slug}}/src/Layout.tsx

@@ -0,0 +1,29 @@
+import { useNumericParam } from "@conformal/plugin";
+
+const Layout = () => {
+  const { value: gain, set: setGain } = useNumericParam("gain");
+
+  return (
+    <div>
+      <p>Current gain: {gain}%</p>
+      <p>
+        <span
+          onClick={() => {
+            setGain(Math.max(0, gain - 10));
+          }}
+        >
+          -
+        </span>
+        <span
+          onClick={() => {
+            setGain(Math.min(100, gain + 10));
+          }}
+        >
+          +
+        </span>
+      </p>
+    </div>
+  );
+};
+
+export default Layout;

package/template/web/{{plug_slug}}/src/main.tsx

@@ -0,0 +1,29 @@
+// Temporary workaround for https://github.com/oven-sh/bun/issues/4890
+/// <reference lib="dom" />
+/// <reference lib="dom.iterable" />
+
+import App from "./App.tsx";
+import * as Jotai from "jotai";
+import { StrictMode, Suspense } from "react";
+import * as Client from "react-dom/client";
+import { Provider } from "@conformal/plugin";
+import "./index.css";
+import infos from "./mock_infos.ts";
+
+const domElement = document.querySelector("#root");
+
+if (!(domElement == null)) {
+  Client.createRoot(domElement).render(
+    <StrictMode>
+      <Jotai.Provider>
+        <Provider mockInfos={infos}>
+          <Suspense fallback={<></>}>
+            <App />
+          </Suspense>
+        </Provider>
+      </Jotai.Provider>
+    </StrictMode>,
+  );
+}
+
+export {};

package/template/web/{{plug_slug}}/src/mock_infos.ts

@@ -0,0 +1,24 @@
+import { Info } from "@conformal/plugin";
+
+const infos = new Map<string, Info>(
+  Object.entries({
+    bypass: {
+      title: "Bypass",
+      type_specific: {
+        t: "switch",
+        default: false,
+      },
+    },
+    gain: {
+      title: "Gain",
+      type_specific: {
+        t: "numeric",
+        default: 100,
+        valid_range: [0, 100],
+        units: "%",
+      },
+    },
+  }),
+);
+
+export default infos;

package/template/web/{{plug_slug}}/tsconfig.json

@@ -0,0 +1,7 @@
+{
+  "extends": "tsconfig/tsconfig.json",
+  "include": ["src", "vite.config.ts"],
+  "compilerOptions": {
+    "types": ["vite/client"]
+  }
+}

package/template/web/{{plug_slug}}/vite.config.ts

@@ -0,0 +1,33 @@
+import react from "@vitejs/plugin-react-swc";
+import license from "rollup-plugin-license";
+import { join } from "path";
+
+/** @type {import('vite').UserConfig} */
+export default {
+  plugins: [
+    react(),
+    license({
+      thirdParty: {
+        output: {
+          file: join(__dirname, "installer_resources", "license.txt"),
+          template: (dependencies) =>
+            dependencies
+              .map(
+                (dependency) =>
+                  `-----
+${dependency.name} ${dependency.version} (${dependency.license})
+
+${dependency.licenseText}
+`,
+              )
+              .join("\n"),
+        },
+        allow: {
+          failOnUnlicensed: true,
+          failOnViolation: true,
+          test: "(MIT OR ISC)",
+        },
+      },
+    }),
+  ],
+};

package/tsconfig.json

@@ -0,0 +1,4 @@
+{
+  "extends": "tsconfig/tsconfig.json",
+  "include": ["src"]
+}