@ynput/ayon-addon-dev 0.0.0-stage → 0.1.1

package/dist/vite.js

@@ -0,0 +1,147 @@
+// ayonAddon(): the Vite setup of an AYON addon frontend in one plugin.
+//   build: module federation (remote `name`, ./manifest exposed, every package AYON provides
+//          shared, @ynput/ayon-addon with import: false), output in dist/modules/<name>
+//   `ayon-addon dev --ayon`: the same build, watched, plus /ayon-addon.json for AYON's dev override
+//   `ayon-addon dev`: the Vite dev server with the dev shell (standalone.ts)
+import { existsSync, readFileSync, writeFileSync } from 'fs';
+import path from 'path';
+import { findPackageDir, importFromProject, installedVersion, readAddonProject } from './project.js';
+import { standalonePlugin } from './standalone.js';
+// packages AYON provides to addons (vite federation config and src/remote/hostSharedModules.ts)
+export const HOST_PACKAGES = [
+    'react',
+    'react-dom',
+    'styled-components',
+    '@ynput/ayon-react-components',
+    '@reduxjs/toolkit',
+    'react-redux',
+    'react-router',
+    'react-router-dom',
+    'react-toastify',
+];
+export const SHARED_PACKAGE = '@ynput/ayon-frontend-shared';
+export const ADDON_API = '@ynput/ayon-addon';
+const readJson = (file) => JSON.parse(readFileSync(file, 'utf8'));
+// the build's entry when the addon has no index.html: AYON loads remoteEntry.js, nothing else
+const BUILD_ENTRY = '\0ayon-addon-build-entry';
+const buildShared = (root, extra = []) => {
+    const pkg = readJson(path.join(root, 'package.json'));
+    const declared = { ...pkg.devDependencies, ...pkg.dependencies };
+    const range = (name) => {
+        const declaredRange = declared[name];
+        if (declaredRange && /^[\^~><=\d]/.test(declaredRange))
+            return declaredRange;
+        const version = installedVersion(root, name);
+        return version ? `^${version}` : false;
+    };
+    const shared = {};
+    for (const name of [...HOST_PACKAGES, ...extra]) {
+        if (!installedVersion(root, name))
+            continue;
+        shared[name] = { singleton: true, requiredVersion: range(name) };
+    }
+    // every entry of @ynput/ayon-frontend-shared: an entry left out would bring its own api and contexts
+    const sharedDir = findPackageDir(root, SHARED_PACKAGE);
+    if (sharedDir) {
+        const exportsMap = readJson(path.join(sharedDir, 'package.json')).exports;
+        for (const [subpath, entry] of Object.entries(exportsMap)) {
+            // skip entries the published package lists but doesn't ship
+            if (!entry.import || !existsSync(path.join(sharedDir, entry.import)))
+                continue;
+            shared[path.posix.join(SHARED_PACKAGE, subpath)] = {
+                singleton: true,
+                requiredVersion: range(SHARED_PACKAGE),
+            };
+        }
+    }
+    // always AYON's own copy: the addon bundles none, so it can't end up with a second registry
+    const addonApiVersion = installedVersion(root, ADDON_API);
+    if (!addonApiVersion)
+        throw new Error(`${ADDON_API} is not installed in ${root}`);
+    shared[ADDON_API] = { import: false, singleton: true, requiredVersion: `^${addonApiVersion}` };
+    return shared;
+};
+/** The Vite plugins of an AYON addon frontend. Use with @vitejs/plugin-react. */
+export const ayonAddon = async (options) => {
+    const root = process.cwd();
+    const project = readAddonProject(root);
+    const manifest = options.manifest || './src/manifest.ts';
+    const exposes = { './manifest': manifest, ...options.exposes };
+    const outDir = path.join('dist', 'modules', options.name);
+    const { federation } = await importFromProject(root, '@module-federation/vite');
+    const federationPlugins = [].concat(federation({
+        name: options.name,
+        filename: 'remoteEntry.js',
+        exposes,
+        remotes: {},
+        // AYON loads the modules at runtime, it needs no federation type declarations
+        dts: false,
+        // use what AYON already loaded (its store, api and contexts), even when this addon was
+        // built against a newer version
+        shareStrategy: 'loaded-first',
+        shared: buildShared(root, options.shared),
+    }));
+    // federation only makes sense for the build AYON loads; the dev server runs on its own
+    federationPlugins.forEach((plugin) => (plugin.apply = plugin.apply || 'build'));
+    const config = {
+        name: 'ayon-addon',
+        // the CLI reads the options from the addon's vite.config.ts (generate-rest)
+        api: { options },
+        config(_config, { command, mode }) {
+            return {
+                base: '',
+                resolve: {
+                    // a linked SDK must use the addon's React, router and store, never the checkout's
+                    dedupe: [...HOST_PACKAGES, SHARED_PACKAGE, ADDON_API],
+                },
+                build: command === 'build'
+                    ? {
+                        target: 'chrome89',
+                        outDir,
+                        emptyOutDir: true,
+                        cssCodeSplit: false,
+                        minify: mode !== 'development',
+                        sourcemap: mode === 'development',
+                        ...(existsSync(path.join(root, 'index.html'))
+                            ? {}
+                            : { rollupOptions: { input: { 'ayon-addon': BUILD_ENTRY } } }),
+                    }
+                    : undefined,
+            };
+        },
+        resolveId(id) {
+            if (id === BUILD_ENTRY)
+                return id;
+        },
+        load(id) {
+            if (id === BUILD_ENTRY)
+                return 'export {}';
+        },
+    };
+    // `ayon-addon dev --ayon` sets AYON_ADDON_DEV: after each rebuild, tell AYON's dev override about it
+    const devInfo = {
+        name: 'ayon-addon:dev-info',
+        apply: 'build',
+        writeBundle(outputOptions) {
+            if (process.env.AYON_ADDON_DEV !== '1' || !outputOptions.dir)
+                return;
+            const info = {
+                name: project.name,
+                version: project.version,
+                remote: options.name,
+                modules: Object.keys(exposes).map((key) => key.replace(/^\.\//, '')),
+                buildId: Date.now().toString(36),
+            };
+            writeFileSync(path.join(outputOptions.dir, 'ayon-addon.json'), JSON.stringify(info, null, 2));
+        },
+    };
+    const standalone = standalonePlugin({
+        root,
+        project,
+        remote: options.name,
+        manifest,
+        fixtures: options.fixtures || 'dev/fixtures',
+    });
+    return [...federationPlugins, config, devInfo, standalone];
+};
+export default ayonAddon;

package/package.json

@@ -1,6 +1,65 @@
 {
   "name": "@ynput/ayon-addon-dev",
-  "version": "0.0.0-stage",
-  "stub": true,
-  "description": "Temporary package placeholder for staged publishing"
-}
+  "version": "0.1.1",
+  "description": "Dev tooling for AYON addon frontends: Vite plugin, dev server, CLI, lint preset",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/ynput/ayon-frontend.git",
+    "directory": "addon-dev"
+  },
+  "license": "FSL-1.1-ALv2",
+  "type": "module",
+  "bin": {
+    "ayon-addon": "./dist/cli.js"
+  },
+  "exports": {
+    "./vite": {
+      "types": "./dist/vite.d.ts",
+      "import": "./dist/vite.js"
+    },
+    "./eslint": {
+      "types": "./dist/eslint.d.ts",
+      "import": "./dist/eslint.js"
+    },
+    "./AGENTS.md": "./AGENTS.md",
+    "./shell": "./dist/shell/index.js",
+    "./shell/style.css": "./dist/shell/style.css"
+  },
+  "files": [
+    "dist",
+    "AGENTS.md"
+  ],
+  "publishConfig": {
+    "access": "public"
+  },
+  "scripts": {
+    "build": "tsc -p tsconfig.json && chmod +x dist/cli.js && vite build --config shell/vite.config.ts",
+    "typecheck:shell": "tsc -p shell/tsconfig.json"
+  },
+  "dependencies": {
+    "@tanstack/react-table": "^8.21.3"
+  },
+  "peerDependencies": {
+    "@module-federation/vite": ">=1.14",
+    "@ynput/ayon-addon": "^0.1.1",
+    "vite": ">=6",
+    "@ynput/ayon-frontend-shared": ">=0.7.5",
+    "@ynput/ayon-react-components": "^1.24.0",
+    "primereact": ">=9",
+    "react": ">=18",
+    "react-dom": ">=18",
+    "react-redux": ">=9",
+    "react-router-dom": ">=7",
+    "react-toastify": ">=9",
+    "playwright": ">=1.40",
+    "@rtk-query/codegen-openapi": ">=2"
+  },
+  "peerDependenciesMeta": {
+    "playwright": {
+      "optional": true
+    },
+    "@rtk-query/codegen-openapi": {
+      "optional": true
+    }
+  }
+}

package/README.md

@@ -1,3 +0,0 @@
-# Temporary Holding Version
-
-This version is a temporary placeholder for this package. An operational version to replace this has been submitted for review and is awaiting a staged release.