kirbyup 3.1.0 → 3.1.1

package/README.md

@@ -9,17 +9,13 @@ The fastest and leanest way to bundle your Kirby Panel plugins. No configuration
 
 - 🍂 Lightweight, robust and tested
 - ⚡️ Fast compilation with Vite/esbuild
-- 🔄 Hot Module Replacement and watch mode (requires Kirby v3.7.4+)
+- 🔄 Hot module replacement and watch mode
 - \*️⃣ `kirbyup.import` to [auto-import blocks & fields](#auto-import-blocks-and-fields)
 - 🎒 [PostCSS support](#postcss)
 - 🧭 [Path resolve aliases](#path-resolve-aliases)
 - 🔌 [Env variables support](#env-variables)
 - 🦔 [Extendable configuration with `kirbyup.config.js`](#extendable-configuration-with-kirbyupconfigjs)
 
-## Requirements
-
-- Latest Node.js LTS version (currently v18)
-
 ## Get Started Right Away
 
 … With one of the following Panel plugin kits:
@@ -36,8 +32,7 @@ If you want to use kirbyup right away, there is no need to install it. Simply ca
 ```json
 {
   "scripts": {
-    "dev": "npx -y kirbyup src/index.js --watch",
-    "serve": "npx -y kirbyup serve src/index.js",
+    "dev": "npx -y kirbyup serve src/index.js",
     "build": "npx -y kirbyup src/index.js"
   }
 }
@@ -57,8 +52,7 @@ Example package configuration:
 ```json
 {
   "scripts": {
-    "dev": "kirbyup src/index.js --watch",
-    "serve": "kirbyup serve src/index.js",
+    "dev": "kirbyup serve src/index.js",
     "build": "kirbyup src/index.js"
   },
   "devDependencies": {
@@ -75,9 +69,6 @@ Global installation is supported as well, but not recommended.
 
 Start a development server for the Panel plugin:
 
-> [!NOTE]
-> This feature requires Kirby v3.7.4+.
-
 ```bash
 kirbyup serve src/index.js
 ```
@@ -163,9 +154,9 @@ window.panel.plugin('kirbyup/example', {
 
 kirbyup exposes env variables on the special `import.meta.env` object. Some built-in variables are available in all cases:
 
-- **`import.meta.env.MODE`**: {`development` | `production`} the mode kirbyup is running in.
-- **`import.meta.env.PROD`**: {boolean} whether kirbyup is running in production.
-- **`import.meta.env.DEV`**: {boolean} whether kirbyup is running in development (always the opposite of `import.meta.env.PROD`)
+- **`import.meta.env.MODE`** (`development` | `production`): the mode kirbyup is running in.
+- **`import.meta.env.PROD`** (`boolean`): whether kirbyup is running in production.
+- **`import.meta.env.DEV`** (`boolean`): whether kirbyup is running in development (always the opposite of `import.meta.env.PROD`)
 
 During production, these env variables are **statically replaced**. It is therefore necessary to always reference them using the full static string. For example, dynamic key access like `import.meta.env[key]` will not work.
 
@@ -189,20 +180,19 @@ Only `KIRBYUP_SOME_KEY` will be exposed as `import.meta.env.VITE_SOME_KEY` to yo
 Create a `kirbyup.config.js` or `kirbyup.config.ts` configuration file the root-level of your project to customize kirbyup.
 
 ```js
+import { fileURLToPath } from 'node:url'
 import { resolve } from 'node:path'
 import { defineConfig } from 'kirbyup/config'
 
-const currentDir = new URL('.', import.meta.url).pathname
+const currentDir = fileURLToPath(new URL('.', import.meta.url))
 
 export default defineConfig({
   alias: {
-    '#deep/': `${resolve(currentDir, 'src/deep')}/`
+    '#plugin/': `${resolve(currentDir, 'src/plugin')}/`
   },
   extendViteConfig: {
-    build: {
-      lib: {
-        name: 'myPlugin'
-      }
+    define: {
+      __PLAYGROUND__: JSON.stringify(process.env.PLAYGROUND)
     }
   }
 })

package/dist/node/cli.mjs

@@ -1,5 +1,5 @@
 import { cac } from 'cac';
-import { n as name, b as build, s as serve, v as version, h as handleError } from '../shared/kirbyup.9b5c1ecd.mjs';
+import { n as name, b as build, s as serve, v as version, h as handleError } from '../shared/kirbyup.90533c57.mjs';
 import 'node:fs';
 import 'node:fs/promises';
 import 'pathe';
@@ -20,7 +20,7 @@ import 'node:util';
 import 'node:buffer';
 import 'c12';
 import 'magic-string';
-import 'detect-package-manager';
+import 'node:module';
 
 async function startCli(cwd = process.cwd(), argv = process.argv) {
   const cli = cac(name);

package/dist/node/index.mjs

@@ -13,10 +13,10 @@ import 'rollup-plugin-external-globals';
 import 'postcss-load-config';
 import 'postcss-logical';
 import 'postcss-dir-pseudo-class';
-export { b as build, s as serve } from '../shared/kirbyup.9b5c1ecd.mjs';
+export { b as build, s as serve } from '../shared/kirbyup.90533c57.mjs';
 import 'node:zlib';
 import 'node:util';
 import 'node:buffer';
 import 'c12';
 import 'magic-string';
-import 'detect-package-manager';
+import 'node:module';

package/dist/shared/{kirbyup.9b5c1ecd.mjs → kirbyup.90533c57.mjs}

@@ -1,6 +1,6 @@
 import { existsSync, unlinkSync } from 'node:fs';
-import { writeFile, readFile } from 'node:fs/promises';
-import { normalize, relative, resolve, dirname, basename } from 'pathe';
+import { readFile, writeFile } from 'node:fs/promises';
+import { normalize, relative, resolve, join, dirname, basename } from 'pathe';
 import { consola } from 'consola';
 import { colors } from 'consola/utils';
 import { debounce } from 'perfect-debounce';
@@ -18,10 +18,10 @@ import { promisify } from 'node:util';
 import { Buffer } from 'node:buffer';
 import { loadConfig as loadConfig$1 } from 'c12';
 import MagicString from 'magic-string';
-import { detect } from 'detect-package-manager';
+import 'node:module';
 
 const name = "kirbyup";
-const version = "3.1.0";
+const version = "3.1.1";
 
 class PrettyError extends Error {
   constructor(message) {
@@ -88,7 +88,8 @@ for (const methodName of ['rerender', 'reload']) {
 
     if (key) {
       const pluginComponents = window.panel.plugins.components
-      const usedComponentDefs = window.panel.$vue._vnode.componentInstance.$options.components
+      // const usedComponentDefs = window.panel.app.$options.components
+      const usedComponentDefs = window.panel.app._vnode.componentInstance.$options.components // #33
 
       for (const componentName in pluginComponents) {
         if (updatedDef[key] === pluginComponents[componentName][key]) {
@@ -110,7 +111,7 @@ for (const methodName of ['rerender', 'reload']) {
 }
 
 function $_applyKirbyModifications(activeDef, newDef) {
-  const usedComponentDefs = window.panel.$vue.$options.components
+  const usedComponentDefs = window.panel.app.$options.components
 
   if (newDef.template)
     newDef.render = null
@@ -170,6 +171,92 @@ function kirbyupAutoImportPlugin() {
   };
 }
 
+async function findup(cwd, match, options = {}) {
+  const segments = normalize(cwd).split("/");
+  while (segments.length > 0) {
+    const path = segments.join("/");
+    const result = await match(path);
+    if (result || !options.includeParentDirs) {
+      return result;
+    }
+    segments.pop();
+  }
+}
+
+const packageManagers = [
+  { name: "npm", command: "npm", lockFile: "package-lock.json" },
+  {
+    name: "pnpm",
+    command: "pnpm",
+    lockFile: "pnpm-lock.yaml",
+    files: ["pnpm-workspace.yaml"]
+  },
+  {
+    name: "bun",
+    command: "bun",
+    lockFile: "bun.lockb"
+  },
+  {
+    name: "yarn",
+    command: "yarn",
+    majorVersion: "1.0.0",
+    lockFile: "yarn.lock"
+  },
+  {
+    name: "yarn",
+    command: "yarn",
+    majorVersion: "3.0.0",
+    lockFile: "yarn.lock",
+    files: [".yarnrc.yml"]
+  }
+];
+async function detectPackageManager(cwd, options = {}) {
+  const detected = await findup(
+    cwd,
+    async (path) => {
+      if (!options.ignorePackageJSON) {
+        const packageJSONPath = join(path, "package.json");
+        if (existsSync(packageJSONPath)) {
+          const packageJSON = JSON.parse(
+            await readFile(packageJSONPath, "utf8")
+          );
+          if (packageJSON?.packageManager) {
+            const [name, version = "0.0.0"] = packageJSON.packageManager.split("@");
+            const majorVersion = version.split(".")[0];
+            const packageManager = packageManagers.find(
+              (pm) => pm.name === name && pm.majorVersion === majorVersion
+            ) || packageManagers.find((pm) => pm.name === name);
+            return {
+              ...packageManager,
+              name,
+              command: name,
+              version,
+              majorVersion
+            };
+          }
+        }
+      }
+      if (!options.ignoreLockFile) {
+        for (const packageManager of packageManagers) {
+          const detectionsFiles = [
+            packageManager.lockFile,
+            ...packageManager.files || []
+          ].filter(Boolean);
+          if (detectionsFiles.some((file) => existsSync(resolve(path, file)))) {
+            return {
+              ...packageManager
+            };
+          }
+        }
+      }
+    },
+    {
+      includeParentDirs: options.includeParentDirs ?? true
+    }
+  );
+  return detected;
+}
+
 function kirbyupHmrPlugin(options) {
   let config;
   let entry;
@@ -200,7 +287,7 @@ function kirbyupHmrPlugin(options) {
         const hostname = family === "IPv6" ? `[${address}]` : address;
         const baseUrl = `http://${hostname}:${port}${config.base}`;
         const entryUrl = new URL(entryPath, baseUrl).href;
-        const pm = await detect().catch(() => "npm");
+        const pm = await detectPackageManager(config.root);
         await writeFile(indexMjs, getViteProxyModule(entryUrl, pm));
       });
     },
@@ -210,7 +297,8 @@ function kirbyupHmrPlugin(options) {
     }
   };
 }
-function getViteProxyModule(entryUrl, pm) {
+function getViteProxyModule(entryUrl, packageManager) {
+  const pm = packageManager?.name || "npm";
   return `
 try {
   await import("${entryUrl}");
@@ -291,7 +379,11 @@ function getViteConfig(command, options) {
       minify: mode === "production",
       outDir: options.outDir,
       emptyOutDir: false,
-      rollupOptions: { output: { assetFileNames: "index.[ext]" } }
+      rollupOptions: {
+        output: {
+          assetFileNames: "index.[ext]"
+        }
+      }
     }
   });
   return mergeConfig(buildConfig, extendViteConfig);
@@ -343,7 +435,6 @@ async function build(options) {
     if (!/No PostCSS Config found/.test(err.message))
       throw err;
     resolvedPostCssConfig = {
-      // @ts-expect-error: types won't match
       plugins: [postcssLogical(), postcssDirPseudoClass()]
     };
   }
@@ -406,7 +497,6 @@ async function serve(options) {
     if (!/No PostCSS Config found/.test(err.message))
       throw err;
     resolvedPostCssConfig = {
-      // @ts-expect-error: types won't match
       plugins: [postcssLogical(), postcssDirPseudoClass()]
     };
   }

package/package.json

@@ -1,8 +1,8 @@
 {
   "name": "kirbyup",
   "type": "module",
-  "version": "3.1.0",
-  "packageManager": "pnpm@8.11.0",
+  "version": "3.1.1",
+  "packageManager": "pnpm@8.15.1",
   "description": "Zero-config bundler for Kirby Panel plugins",
   "author": {
     "name": "Johann Schopplich",
@@ -64,45 +64,45 @@
     "lint": "eslint .",
     "lint:fix": "eslint . --fix",
     "release": "bumpp --commit --push --tag",
-    "test": "vitest",
+    "test": "vitest --no-isolate",
     "test:types": "tsc --noEmit",
     "prepare": "simple-git-hooks"
   },
   "dependencies": {
     "@vitejs/plugin-vue2": "2.2.0",
     "@vitejs/plugin-vue2-jsx": "1.1.0",
-    "@vue/compiler-sfc": "^2.7.15",
-    "c12": "^1.5.1",
+    "@vue/compiler-sfc": "^2.7.16",
+    "c12": "^1.6.1",
     "cac": "^6.7.14",
     "chokidar": "^3.5.3",
     "consola": "^3.2.3",
-    "detect-package-manager": "^3.0.1",
     "magic-string": "^0.30.5",
-    "pathe": "^1.1.1",
+    "pathe": "^1.1.2",
     "perfect-debounce": "^1.0.0",
-    "postcss": "^8.4.32",
-    "postcss-dir-pseudo-class": "^8.0.0",
+    "postcss": "^8.4.33",
+    "postcss-dir-pseudo-class": "^8.0.1",
     "postcss-load-config": "^5.0.2",
-    "postcss-logical": "^7.0.0",
-    "rollup-plugin-external-globals": "^0.9.1",
-    "sass": "^1.69.5",
-    "vite": "^5.0.6",
+    "postcss-logical": "^7.0.1",
+    "rollup-plugin-external-globals": "^0.9.2",
+    "sass": "^1.70.0",
+    "vite": "^5.0.12",
     "vite-plugin-full-reload": "^1.1.0",
-    "vue": "^2.7.15"
+    "vue": "^2.7.16"
   },
   "devDependencies": {
-    "@antfu/eslint-config": "^2.3.4",
+    "@antfu/eslint-config": "^2.6.3",
     "@types/fs-extra": "^11.0.4",
-    "@types/node": "^20.10.4",
+    "@types/node": "^20.11.10",
     "@types/prompts": "^2.4.9",
-    "bumpp": "^9.2.0",
-    "eslint": "^8.55.0",
+    "bumpp": "^9.3.0",
+    "eslint": "^8.56.0",
     "fast-glob": "^3.3.2",
     "fs-extra": "^11.2.0",
+    "nypm": "^0.3.6",
     "simple-git-hooks": "^2.9.0",
     "typescript": "~5.3.3",
     "unbuild": "^2.0.0",
-    "vitest": "^1.0.1"
+    "vitest": "^1.2.2"
   },
   "simple-git-hooks": {
     "commit-msg": "node scripts/verifyCommit.mjs $1"