stacks 0.56.24 → 0.58.18

package/core/src/vite-plugin-vue-layouts/dist/index.js

@@ -0,0 +1,271 @@
+// src/index.ts
+import {resolve} from "node:path";
+import process from "node:process";
+
+// src/clientSide.ts
+import {posix} from "node:path";
+import {getPackageInfo} from "local-pkg";
+var normalizePath = function(path) {
+  path = path.startsWith("/") ? path : `/${path}`;
+  return posix.normalize(path);
+};
+async function isVite2() {
+  const info = await getPackageInfo("vite");
+  if (info)
+    return /.?2/.test(info.version);
+  return false;
+}
+async function createVirtualGlob(target, isSync) {
+  const g = `"${target}/**/*.stx"`;
+  if (await isVite2())
+    return isSync ? `import.meta.globEager(${g})` : `import.meta.glob(${g})`;
+  return `import.meta.glob(${g}, { eager: ${isSync} })`;
+}
+async function createVirtualModuleCode(options) {
+  const { layoutDir, defaultLayout, importMode } = options;
+  const normalizedTarget = normalizePath(layoutDir);
+  const isSync = importMode === "sync";
+  return `
+  export const createGetRoutes = (router, withLayout = false) => {
+      const routes = router.getRoutes()
+      if (withLayout) {
+          return routes
+      }
+      return () => routes.filter(route => !route.meta.isLayout)
+  }
+
+  export const setupLayouts = routes => {
+      const layouts = {}
+
+      const modules = ${await createVirtualGlob(normalizedTarget, isSync)}
+
+      Object.entries(modules).forEach(([name, module]) => {
+          let key = name.replace("${normalizedTarget}/", '').replace('.stx', '')
+          layouts[key] = ${isSync ? "module.default" : "module"}
+      })
+
+    function deepSetupLayout(routes, top = true) {
+      return routes.map(route => {
+        if (route.children?.length > 0) {
+          route.children = deepSetupLayout(route.children, false)
+        }
+
+        if (top && route.meta?.layout !== false) {
+          return {
+            path: route.path,
+            component: layouts[route.meta?.layout || '${defaultLayout}'],
+            children: [ {...route, path: ''} ],
+            meta: {
+              isLayout: true
+            }
+          }
+        }
+
+        if (route.meta?.layout) {
+          return {
+            path: route.path,
+            component: layouts[route.meta?.layout],
+            children: [ {...route, path: ''} ],
+            meta: {
+              isLayout: true
+            }
+          }
+        }
+
+        return route
+      })
+    }
+
+      return deepSetupLayout(routes)
+  }`;
+}
+
+// src/files.ts
+import {glob} from "@stacksjs/storage";
+
+// src/utils.ts
+import Debug from "debug";
+function extensionsToGlob(extensions) {
+  return extensions.length > 1 ? `{${extensions.join(",")}}` : extensions[0] || "";
+}
+function normalizePath2(str) {
+  return str.replace(/\\/g, "/");
+}
+var debug = Debug("vite-plugin-layouts");
+
+// src/files.ts
+async function getFilesFromPath(path, options) {
+  const {
+    exclude,
+    extensions
+  } = options;
+  const ext = extensionsToGlob(extensions);
+  debug(extensions);
+  const files = await glob(`**/*.${ext}`, {
+    ignore: ["node_modules", ".git", "**/__*__/*", ...exclude],
+    onlyFiles: true,
+    cwd: path
+  });
+  return files;
+}
+
+// src/importCode.ts
+import {join, parse} from "node:path";
+function getImportCode(files, options) {
+  const imports = [];
+  const head = [];
+  let id = 0;
+  for (const __ of files) {
+    for (const file of __.files) {
+      const path = __.path.substr(0, 1) === "/" ? `${__.path}/${file}` : `/${__.path}/${file}`;
+      const parsed = parse(file);
+      const name = join(parsed.dir, parsed.name).replace(/\\/g, "/");
+      if (options.importMode(name) === "sync") {
+        const variable = `__layout_${id}`;
+        head.push(`import ${variable} from '${path}'`);
+        imports.push(`'${name}': ${variable},`);
+        id += 1;
+      } else {
+        imports.push(`'${name}': () => import('${path}'),`);
+      }
+    }
+  }
+  const importsCode = `
+${head.join("\n")}
+export const layouts = {
+${imports.join("\n")}
+}`;
+  return importsCode;
+}
+
+// src/RouteLayout.ts
+var getClientCode = function(importCode, options) {
+  const code = `
+${importCode}
+
+export function setupLayouts(routes) {
+  return routes.map(route => {
+    const isBoolean = typeof route.meta?.layout === 'boolean'
+    if(isBoolean && !route.meta?.layout) {
+      return route
+    } else {
+      let componentName = !isBoolean && route.meta?.layout ? route.meta?.layout : '${options.defaultLayout}'
+      return {
+        path: route.path,
+        component: layouts[componentName],
+        children: route.path === '/' ? [route] : [{...route, path: ''}]
+      }
+    }
+  })
+}
+`;
+  return code;
+};
+var RouteLayout_default = getClientCode;
+
+// src/index.ts
+function defaultImportMode(name) {
+  if (process.env.VITE_SSG)
+    return "sync";
+  return name === "default" ? "sync" : "async";
+}
+var resolveOptions = function(userOptions) {
+  return Object.assign({
+    defaultLayout: "default",
+    layoutsDirs: "src/layouts",
+    extensions: ["stx", "vue"],
+    exclude: [],
+    importMode: defaultImportMode
+  }, userOptions);
+};
+function ClientSideLayout(options) {
+  const {
+    layoutDir = "src/layouts",
+    defaultLayout = "default",
+    importMode = process.env.VITE_SSG ? "sync" : "async"
+  } = options || {};
+  return {
+    name: "vite-plugin-vue-layouts",
+    resolveId(id) {
+      return MODULE_IDS.includes(id) || MODULE_IDS.some((i) => id.startsWith(i)) ? MODULE_ID_VIRTUAL : null;
+    },
+    async load(id) {
+      if (id === MODULE_ID_VIRTUAL) {
+        return createVirtualModuleCode({
+          layoutDir,
+          importMode,
+          defaultLayout
+        });
+      }
+    }
+  };
+}
+var MODULE_IDS = ["layouts-generated", "virtual:generated-layouts"];
+var MODULE_ID_VIRTUAL = "/@vite-plugin-vue-layouts/generated-layouts";
+function Layout(userOptions = {}) {
+  let config;
+  const options = resolveOptions(userOptions);
+  return {
+    name: "vite-plugin-vue-layouts",
+    enforce: "pre",
+    configResolved(_config) {
+      config = _config;
+    },
+    configureServer({ moduleGraph, watcher, ws }) {
+      watcher.add(options.layoutsDirs);
+      const reloadModule = (module, path = "*") => {
+        if (module) {
+          moduleGraph.invalidateModule(module);
+          if (ws) {
+            ws.send({
+              path,
+              type: "full-reload"
+            });
+          }
+        }
+      };
+      const updateVirtualModule = () => {
+        const module = moduleGraph.getModuleById(MODULE_ID_VIRTUAL);
+        reloadModule(module);
+      };
+      watcher.on("add", () => {
+        updateVirtualModule();
+      });
+      watcher.on("unlink", () => {
+        updateVirtualModule();
+      });
+      watcher.on("change", (path) => {
+        path = `/${normalizePath2(path)}`;
+        moduleGraph.getModuleByUrl(path).then((module) => {
+          reloadModule(module, path);
+        }).catch((error) => {
+          console.error("Error while getting module by URL:", error);
+        });
+      });
+    },
+    resolveId(id) {
+      return MODULE_IDS.includes(id) || MODULE_IDS.some((i) => id.startsWith(i)) ? MODULE_ID_VIRTUAL : null;
+    },
+    async load(id) {
+      if (id === MODULE_ID_VIRTUAL) {
+        const layoutDirs = Array.isArray(options.layoutsDirs) ? options.layoutsDirs : [options.layoutsDirs];
+        const container = [];
+        for (const dir of layoutDirs) {
+          const layoutsDirPath = dir.substr(0, 1) === "/" ? normalizePath2(dir) : normalizePath2(resolve(config.root, dir));
+          debug("Loading Layout Dir: %O", layoutsDirPath);
+          const _f = await getFilesFromPath(layoutsDirPath, options);
+          container.push({ path: layoutsDirPath, files: _f });
+        }
+        const importCode2 = getImportCode(container, options);
+        const clientCode = RouteLayout_default(importCode2, options);
+        debug("Client code: %O", clientCode);
+        return clientCode;
+      }
+    }
+  };
+}
+export {
+  defaultImportMode,
+  Layout as default,
+  ClientSideLayout
+};

package/core/src/vite-plugin-vue-layouts/package.json

@@ -0,0 +1,64 @@
+{
+  "name": "@stacksjs/vite-plugin-vue-layouts",
+  "type": "module",
+  "version": "0.58.18",
+  "description": "Router based layout plugin for Vite and Vue.",
+  "authors": [
+    "johncampionjr <npm@relate.dev>",
+    "chrisbbreuer <chris@stacksjs.org>"
+  ],
+  "license": "MIT",
+  "funding": "https://github.com/sponsors/chrisbbreuer",
+  "homepage": "https://github.com/stacksjs/stacks/tree/main/storage/framework/core/src/vite-plugin-vue-layouts#readme",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/stacksjs/stacks.git",
+    "directory": "./storage/framework/core/src/vite-plugin-vue-layouts"
+  },
+  "bugs": {
+    "url": "https://github.com/stacksjs/stacks/issues"
+  },
+  "keywords": [
+    "vite-plugin-vue-layouts",
+    "stacks"
+  ],
+  "exports": {
+    ".": {
+      "bun": "./src/index.ts",
+      "import": "./dist/index.js"
+    },
+    "./client": {
+      "types": "./client.d.ts"
+    },
+    "./*": {
+      "bun": "./src/*",
+      "import": "./dist/*"
+    }
+  },
+  "module": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "contributors": [
+    "Chris Breuer <chris@stacksjs.org>"
+  ],
+  "files": [
+    "README.md",
+    "dist"
+  ],
+  "scripts": {
+    "build": "bun --bun build.ts",
+    "typecheck": "bun --bun tsc --noEmit",
+    "prepublishOnly": "bun --bun run build"
+  },
+  "peerDependencies": {
+    "@stacksjs/storage": "workspace:*"
+  },
+  "dependencies": {
+    "@stacksjs/storage": "workspace:*",
+    "local-pkg": "^0.5.0"
+  },
+  "devDependencies": {
+    "@stacksjs/development": "workspace:*",
+    "@types/debug": "^4.1.12",
+    "vite": "^5.0.11"
+  }
+}

package/core/src/vite-plugin-vue-layouts/src/RouteLayout.ts

@@ -0,0 +1,26 @@
+import type { ResolvedOptions } from './types'
+
+function getClientCode(importCode: string, options: ResolvedOptions) {
+  const code = `
+${importCode}
+
+export function setupLayouts(routes) {
+  return routes.map(route => {
+    const isBoolean = typeof route.meta?.layout === 'boolean'
+    if(isBoolean && !route.meta?.layout) {
+      return route
+    } else {
+      let componentName = !isBoolean && route.meta?.layout ? route.meta?.layout : '${options.defaultLayout}'
+      return {
+        path: route.path,
+        component: layouts[componentName],
+        children: route.path === '/' ? [route] : [{...route, path: ''}]
+      }
+    }
+  })
+}
+`
+  return code
+}
+
+export default getClientCode

package/core/src/vite-plugin-vue-layouts/src/clientSide.ts

@@ -0,0 +1,99 @@
+import { posix } from 'node:path'
+import { getPackageInfo } from 'local-pkg'
+
+function normalizePath(path: string) {
+  path = path.startsWith('/') ? path : `/${path}`
+  return posix.normalize(path)
+}
+
+export async function isVite2() {
+  const info = await getPackageInfo('vite')
+  if (info)
+    return /.?2/.test(info.version)
+
+  return false
+}
+
+interface VirtualModuleCodeOptions {
+  layoutDir: string
+  defaultLayout: string
+  importMode: 'sync' | 'async'
+}
+
+async function createVirtualGlob(
+  target: string,
+  isSync: boolean,
+) {
+  const g = `"${target}/**/*.stx"` // TODO: ensure ..vue is also captured as part of this glob
+  if (await isVite2())
+    return isSync ? `import.meta.globEager(${g})` : `import.meta.glob(${g})`
+
+  return `import.meta.glob(${g}, { eager: ${isSync} })`
+}
+
+export async function createVirtualModuleCode(
+  options: VirtualModuleCodeOptions,
+) {
+  const { layoutDir, defaultLayout, importMode } = options
+
+  const normalizedTarget = normalizePath(layoutDir)
+
+  const isSync = importMode === 'sync'
+
+  return `
+  export const createGetRoutes = (router, withLayout = false) => {
+      const routes = router.getRoutes()
+      if (withLayout) {
+          return routes
+      }
+      return () => routes.filter(route => !route.meta.isLayout)
+  }
+
+  export const setupLayouts = routes => {
+      const layouts = {}
+
+      const modules = ${await createVirtualGlob(
+    normalizedTarget,
+    isSync,
+  )}
+
+      Object.entries(modules).forEach(([name, module]) => {
+          let key = name.replace("${normalizedTarget}/", '').replace('.stx', '')
+          layouts[key] = ${isSync ? 'module.default' : 'module'}
+      })
+
+    function deepSetupLayout(routes, top = true) {
+      return routes.map(route => {
+        if (route.children?.length > 0) {
+          route.children = deepSetupLayout(route.children, false)
+        }
+
+        if (top && route.meta?.layout !== false) {
+          return {
+            path: route.path,
+            component: layouts[route.meta?.layout || '${defaultLayout}'],
+            children: [ {...route, path: ''} ],
+            meta: {
+              isLayout: true
+            }
+          }
+        }
+
+        if (route.meta?.layout) {
+          return {
+            path: route.path,
+            component: layouts[route.meta?.layout],
+            children: [ {...route, path: ''} ],
+            meta: {
+              isLayout: true
+            }
+          }
+        }
+
+        return route
+      })
+    }
+
+      return deepSetupLayout(routes)
+  }`
+}

package/core/src/vite-plugin-vue-layouts/src/files.ts

@@ -0,0 +1,24 @@
+import { glob } from '@stacksjs/storage'
+import type { ResolvedOptions } from './types'
+import { debug, extensionsToGlob } from './utils'
+
+/**
+ * Resolves the files that are valid pages for the given context.
+ */
+export async function getFilesFromPath(path: string, options: ResolvedOptions): Promise<string[]> {
+  const {
+    exclude,
+    extensions,
+  } = options
+
+  const ext = extensionsToGlob(extensions)
+  debug(extensions)
+
+  const files = await glob(`**/*.${ext}`, {
+    ignore: ['node_modules', '.git', '**/__*__/*', ...exclude],
+    onlyFiles: true,
+    cwd: path,
+  })
+
+  return files
+}

package/core/src/vite-plugin-vue-layouts/src/importCode.ts

@@ -0,0 +1,32 @@
+import { join, parse } from 'node:path'
+import type { FileContainer, ResolvedOptions } from './types'
+
+export function getImportCode(files: FileContainer[], options: ResolvedOptions) {
+  const imports: string[] = []
+  const head: string[] = []
+  let id = 0
+
+  for (const __ of files) {
+    for (const file of __.files) {
+      const path = __.path.substr(0, 1) === '/' ? `${__.path}/${file}` : `/${__.path}/${file}`
+      const parsed = parse(file)
+      const name = join(parsed.dir, parsed.name).replace(/\\/g, '/')
+      if (options.importMode(name) === 'sync') {
+        const variable = `__layout_${id}`
+        head.push(`import ${variable} from '${path}'`)
+        imports.push(`'${name}': ${variable},`)
+        id += 1
+      }
+      else {
+        imports.push(`'${name}': () => import('${path}'),`)
+      }
+    }
+  }
+
+  const importsCode = `
+${head.join('\n')}
+export const layouts = {
+${imports.join('\n')}
+}`
+  return importsCode
+}

package/core/src/vite-plugin-vue-layouts/src/index.ts

@@ -0,0 +1,150 @@
+import { resolve } from 'node:path'
+import process from 'node:process'
+import type { ModuleNode, Plugin, ResolvedConfig } from 'vite'
+import { createVirtualModuleCode } from './clientSide'
+import { getFilesFromPath } from './files'
+import { getImportCode } from './importCode'
+import getClientCode from './RouteLayout'
+import { debug, normalizePath } from './utils'
+
+import type {
+  FileContainer,
+  ResolvedOptions,
+  UserOptions,
+  clientSideOptions,
+} from './types'
+
+const MODULE_IDS = ['layouts-generated', 'virtual:generated-layouts']
+const MODULE_ID_VIRTUAL = '/@vite-plugin-vue-layouts/generated-layouts'
+
+export function defaultImportMode(name: string) {
+  if (process.env.VITE_SSG)
+    return 'sync'
+
+  return name === 'default' ? 'sync' : 'async'
+}
+
+function resolveOptions(userOptions: UserOptions): ResolvedOptions {
+  return Object.assign(
+    {
+      defaultLayout: 'default',
+      layoutsDirs: 'src/layouts',
+      extensions: ['stx', 'vue'],
+      exclude: [],
+      importMode: defaultImportMode,
+    },
+    userOptions,
+  )
+}
+
+export default function Layout(userOptions: UserOptions = {}): Plugin {
+  let config: ResolvedConfig
+
+  const options: ResolvedOptions = resolveOptions(userOptions)
+
+  return {
+    name: 'vite-plugin-vue-layouts',
+    enforce: 'pre',
+    configResolved(_config) {
+      config = _config
+    },
+    configureServer({ moduleGraph, watcher, ws }) {
+      watcher.add(options.layoutsDirs)
+
+      const reloadModule = (module: ModuleNode | undefined, path = '*') => {
+        if (module) {
+          moduleGraph.invalidateModule(module)
+          if (ws) {
+            ws.send({
+              path,
+              type: 'full-reload',
+            })
+          }
+        }
+      }
+
+      const updateVirtualModule = () => {
+        const module = moduleGraph.getModuleById(MODULE_ID_VIRTUAL)
+
+        reloadModule(module)
+      }
+
+      watcher.on('add', () => {
+        updateVirtualModule()
+      })
+
+      watcher.on('unlink', () => {
+        updateVirtualModule()
+      })
+
+      watcher.on('change', (path) => {
+        path = `/${normalizePath(path)}`
+        moduleGraph.getModuleByUrl(path)
+          .then((module) => {
+            reloadModule(module, path)
+          })
+          .catch((error) => {
+            console.error('Error while getting module by URL:', error)
+          })
+      })
+    },
+    resolveId(id) {
+      return MODULE_IDS.includes(id) || MODULE_IDS.some(i => id.startsWith(i))
+        ? MODULE_ID_VIRTUAL
+        : null
+    },
+    async load(id) {
+      if (id === MODULE_ID_VIRTUAL) {
+        const layoutDirs = Array.isArray(options.layoutsDirs)
+          ? options.layoutsDirs
+          : [options.layoutsDirs]
+        const container: FileContainer[] = []
+
+        for (const dir of layoutDirs) {
+          const layoutsDirPath = dir.substr(0, 1) === '/'
+            ? normalizePath(dir)
+            : normalizePath(resolve(config.root, dir))
+
+          debug('Loading Layout Dir: %O', layoutsDirPath)
+
+          const _f = await getFilesFromPath(layoutsDirPath, options)
+          container.push({ path: layoutsDirPath, files: _f })
+        }
+
+        const importCode = getImportCode(container, options)
+
+        const clientCode = getClientCode(importCode, options)
+
+        debug('Client code: %O', clientCode)
+        return clientCode
+      }
+    },
+  }
+}
+
+export function ClientSideLayout(options?: clientSideOptions): Plugin {
+  const {
+    layoutDir = 'src/layouts',
+    defaultLayout = 'default',
+    importMode = process.env.VITE_SSG ? 'sync' : 'async',
+  } = options || {}
+  return {
+    name: 'vite-plugin-vue-layouts',
+    resolveId(id) {
+      return MODULE_IDS.includes(id) || MODULE_IDS.some(i => id.startsWith(i))
+        ? MODULE_ID_VIRTUAL
+        : null
+    },
+    async load(id) {
+      if (id === MODULE_ID_VIRTUAL) {
+        return createVirtualModuleCode({
+          layoutDir,
+          importMode,
+          defaultLayout,
+        })
+      }
+    },
+  }
+}
+
+export * from './types'