vitral 0.7.1 → 0.8.0

package/dist/iframe.js

@@ -1,18 +1,20 @@
-import {
-  splitName
-} from "./chunk-4NSPG6NK.js";
 import {
   verifyIntegrity
 } from "./chunk-UYOPJ4XQ.js";
 import {
-  events,
-  navigate,
+  splitName
+} from "./chunk-PQXS2UDM.js";
+import {
   setFrameMounter,
   track
-} from "./chunk-O7DV3EVB.js";
+} from "./chunk-NTXMEZIZ.js";
+import {
+  events,
+  navigate
+} from "./chunk-EQZOJU3B.js";
 import {
   resolveEntry
-} from "./chunk-72H4FXMD.js";
+} from "./chunk-6T25WKNK.js";
 import "./chunk-KU6HF2EW.js";
 import {
   fetchBytes,

package/dist/index.d.ts

@@ -1,9 +1,10 @@
-import { V as VitralConfig, c as RemoteEntry, P as Props, a as RemoteModule, I as Isolation, d as StyleOptions, M as MountedRemote, E as EventBus, R as RemoteContext, e as SharedValue } from './types-EOz1rOHs.js';
-export { f as Channel, g as ChannelContext, C as CheckedProps, D as DevOverrides, H as Handler, h as McpAppBridge, i as PropsOf, j as ProvideOptions, k as ProvidedValue, l as RemoteContract, m as RemoteManifest, n as RemoteMetric, o as Remotes, p as RollbackInfo, S as Shared, q as SharedApi, b as SharedModules, r as SharedType, s as batch, t as provide, u as shared } from './types-EOz1rOHs.js';
+import { V as VitralConfig, c as RemoteEntry, I as Isolation, d as StyleOptions, P as Props, M as MountedRemote, a as RemoteModule, E as EventBus, R as RemoteContext, e as SharedValue } from './types-wsKR1gfx.js';
+export { f as Channel, g as ChannelContext, C as CheckedProps, D as DevOverrides, H as Handler, h as McpAppBridge, i as PropsOf, j as ProvideOptions, k as ProvidedValue, l as RemoteContract, m as RemoteManifest, n as RemoteMetric, o as Remotes, p as RollbackInfo, S as Shared, q as SharedApi, b as SharedModules, r as SharedType, s as batch, t as provide, u as shared } from './types-wsKR1gfx.js';
 import { R as RemoteError } from './errors-kjBv6IH_.js';
 export { a as RemoteErrorCode } from './errors-kjBv6IH_.js';
-export { R as RemoteSlot, a as SlotOptions, S as SlotStatus, c as createSlot } from './slot-Ddzp7AgL.js';
-export { e as events } from './events-DLdbFqBM.js';
+export { P as PreloadOptions, l as loadModule, a as loadRemote, p as preload } from './loader-BIXjuvvp.js';
+export { R as RemoteSlot, a as SlotOptions, S as SlotStatus, c as createSlot } from './slot-Dhczjs1E.js';
+export { e as events } from './events-Cieg_far.js';
 export { n as navigate } from './navigate-BRG1WJUM.js';
 export { r as __reset } from './state-BDdCwc21.js';
 
@@ -60,20 +61,6 @@ declare function register(name: string, entry: string | RemoteEntry): void;
  */
 declare function registerSrc(src: string, name?: string, trusted?: boolean): string;
 
-/** Baixa (uma vez só) e devolve o módulo de um remote. */
-declare function loadRemote<P extends Props = Props>(name: string): Promise<RemoteModule<P>>;
-/**
- * Carrega um módulo sem UI que um remote expõe (funções, stores, constantes),
- * com a mesma verificação de SRI e de origem dos componentes.
- *
- *   const api = await loadModule<typeof import('./tipos/carrinho-api')>('carrinho/api')
- *
- * Sem `/`, devolve os exports do arquivo principal do remote.
- */
-declare function loadModule<T = Record<string, unknown>>(name: string): Promise<T>;
-/** Começa a baixar um remote (JS e CSS) sem montar (ex.: no hover de um link). */
-declare function preload(name: string): void;
-
 interface MountOptions {
     isolate?: Isolation;
     /** `'high'` para o remote que aparece logo ao abrir a página: vira `fetchpriority` nos downloads. */
@@ -185,4 +172,4 @@ declare function syncTabs<V extends SharedValue<any>>(value: V): V;
  */
 declare function serializeShared(values: Record<string, unknown>): string;
 
-export { type ComponentOptions, EventBus, Isolation, type MountOptions, MountedRemote, type PersistOptions, Props, RemoteContext, RemoteEntry, RemoteError, RemoteModule, type RenderFn, type SharedEntry, type SharedStore, SharedValue, StyleOptions, type Template, type View, VitralConfig, checkUpdates, component, configure, createEventBus, defineRemote, html, loadModule, loadRemote, mountRemote, persist, preload, refresh, register, registerSrc, render, serializeShared, syncTabs, unsafeHTML, watchUpdates };
+export { type ComponentOptions, EventBus, Isolation, type MountOptions, MountedRemote, type PersistOptions, Props, RemoteContext, RemoteEntry, RemoteError, RemoteModule, type RenderFn, type SharedEntry, type SharedStore, SharedValue, StyleOptions, type Template, type View, VitralConfig, checkUpdates, component, configure, createEventBus, defineRemote, html, mountRemote, persist, refresh, register, registerSrc, render, serializeShared, syncTabs, unsafeHTML, watchUpdates };

package/dist/index.js

@@ -4,10 +4,8 @@ import {
   component,
   createSlot,
   defineRemote,
-  events,
   html,
   mountRemote,
-  navigate,
   persist,
   provide,
   refresh,
@@ -17,7 +15,11 @@ import {
   syncTabs,
   unsafeHTML,
   watchUpdates
-} from "./chunk-O7DV3EVB.js";
+} from "./chunk-NTXMEZIZ.js";
+import {
+  events,
+  navigate
+} from "./chunk-EQZOJU3B.js";
 import {
   configure,
   loadModule,
@@ -25,7 +27,7 @@ import {
   preload,
   register,
   registerSrc
-} from "./chunk-72H4FXMD.js";
+} from "./chunk-6T25WKNK.js";
 import "./chunk-KU6HF2EW.js";
 import "./chunk-TW7KYJQ6.js";
 import {

package/dist/loader-BIXjuvvp.d.ts

@@ -0,0 +1,25 @@
+import { P as Props, a as RemoteModule } from './types-wsKR1gfx.js';
+
+/** Baixa (uma vez só) e devolve o módulo de um remote. */
+declare function loadRemote<P extends Props = Props>(name: string): Promise<RemoteModule<P>>;
+/**
+ * Carrega um módulo sem UI que um remote expõe (funções, stores, constantes),
+ * com a mesma verificação de SRI e de origem dos componentes.
+ *
+ *   const api = await loadModule<typeof import('./tipos/carrinho-api')>('carrinho/api')
+ *
+ * Sem `/`, devolve os exports do arquivo principal do remote.
+ */
+declare function loadModule<T = Record<string, unknown>>(name: string): Promise<T>;
+/** Começa a baixar um remote (JS e CSS) sem montar (ex.: no hover de um link). */
+declare function preload(name: string, options?: PreloadOptions): void;
+interface PreloadOptions {
+    /**
+     * Depois do remote, aquece no cache HTTP, com o navegador ocioso, os
+     * chunks que ele só carrega depois (`import()` das rotas). Não baixa as
+     * cópias de `dedupe`. Padrão: false.
+     */
+    routes?: boolean;
+}
+
+export { type PreloadOptions as P, loadRemote as a, loadModule as l, preload as p };

package/dist/next-config.d.ts

@@ -0,0 +1,95 @@
+import { ZoneRoute } from './next.js';
+import 'react';
+
+interface NextRemoteConfig {
+    /** URL do `vitral.json`. Num caminho do próprio host (`/x/vitral.json`), ganha os headers de cache. */
+    url: string;
+    /**
+     * Página do host que renderiza o `NextRemote` (`pages/<basePath>/[[...slug]]`),
+     * e o `basePath` que o remote vê, como no `next.config` da zona.
+     */
+    basePath: string;
+    /** Rotas públicas que abrem o remote, como os `rewrites` do Multi-Zones. */
+    routes?: ZoneRoute[];
+    /**
+     * Quando baixar o remote antes de alguém abrir: `'idle'` com o navegador
+     * ocioso, `'route'` só ao abrir uma rota dele. Padrão: `'idle'`.
+     */
+    preload?: 'idle' | 'route' | false;
+    /**
+     * Depois do preload, aquece também os chunks das rotas do remote
+     * (`import()`), com o navegador ocioso: a primeira tela de cada rota abre
+     * sem download. Padrão: false.
+     */
+    warmRoutes?: boolean;
+    /**
+     * `false` dispensa a conferência de hash (SRI) do `vitral.json`. Só para
+     * remote servido pela mesma origem do host.
+     */
+    integrity?: false;
+    /**
+     * Em `next dev`, o dev server do remote (`http://localhost:5173`): o
+     * remote vem dele, com HMR, sem `?vitral=`. A CSP de dev do host precisa
+     * liberar essa origem em `script-src` e em `connect-src` (`ws:` do HMR).
+     */
+    devUrl?: string;
+}
+interface WithVitralOptions {
+    remotes: Record<string, NextRemoteConfig>;
+    /**
+     * Dependências que o host oferece aos remotes com `dedupe`, só baixadas
+     * quando um remote pede. `pacote/*` oferece o pacote e cada subpath do
+     * `exports`. O React o `NextRemote` já oferece.
+     */
+    share?: string[];
+    /** Pasta do app. Padrão: `process.cwd()`. */
+    dir?: string;
+}
+/** Id do módulo gerado; o `vitral/next-host` importa dele. */
+declare const HOST_CONFIG = "vitral-next-host-config";
+type Rewrite = {
+    source: string;
+    destination: string;
+};
+type Rewrites = Rewrite[] | {
+    beforeFiles?: Rewrite[];
+    afterFiles?: Rewrite[];
+    fallback?: Rewrite[];
+};
+type Header = {
+    source: string;
+    headers: {
+        key: string;
+        value: string;
+    }[];
+};
+type NextConfig = Record<string, any> & {
+    distDir?: string;
+    rewrites?: () => Promise<Rewrites> | Rewrites;
+    headers?: () => Promise<Header[]> | Header[];
+    webpack?: (config: any, context: any) => any;
+    turbopack?: {
+        resolveAlias?: Record<string, string>;
+    };
+};
+/** Grupos de `dedupe` do host: versão instalada e especificadores. */
+declare function sharedGroups(dir: string, share: string[]): Record<string, {
+    version: string;
+    specs: string[];
+}>;
+/**
+ * O especificador como o webpack do app vai achar. Um alias do pacote para a
+ * pasta dele (`'@empresa/ui': '/app/node_modules/@empresa/ui'`) faz o webpack
+ * procurar `pasta/subpath` sem olhar o `exports`: aí o subpath vira o arquivo
+ * que o `exports` aponta.
+ */
+declare function throughAlias(spec: string, alias?: Record<string, unknown>): string;
+/** Código do módulo gerado: configuração dos remotes e ofertas que só importam quando pedidas. */
+declare function hostModule(remotes: Record<string, NextRemoteConfig>, groups: ReturnType<typeof sharedGroups>, alias?: Record<string, unknown>, from?: string): string;
+/** Em dev, `devUrl` no lugar de `url` (o manifesto do dev server, em `/vitral.json`). */
+declare function devRemotes(remotes: Record<string, NextRemoteConfig>, dev: boolean): Record<string, NextRemoteConfig>;
+declare function remoteRewrites(remotes: Record<string, NextRemoteConfig>): Rewrite[];
+declare function remoteHeaders(remotes: Record<string, NextRemoteConfig>): Header[];
+declare function withVitral(nextConfig: NextConfig, options: WithVitralOptions): NextConfig;
+
+export { HOST_CONFIG, type NextRemoteConfig, type WithVitralOptions, ZoneRoute, devRemotes, hostModule, remoteHeaders, remoteRewrites, sharedGroups, throughAlias, withVitral };

package/dist/next-config.js

@@ -0,0 +1,149 @@
+import {
+  subpaths
+} from "./chunk-6AFVJCQG.js";
+
+// src/next-config.ts
+import { existsSync, mkdirSync, readFileSync, writeFileSync } from "fs";
+import { createRequire } from "module";
+import { dirname, isAbsolute, join, relative, resolve } from "path";
+var HOST_CONFIG = "vitral-next-host-config";
+var pkgOf = (spec) => spec.split("/").slice(0, spec.startsWith("@") ? 2 : 1).join("/");
+var REACT = /^(react|react-dom|scheduler)(\/|$)/;
+function installed(dir, pkg) {
+  const req = createRequire(join(dir, "package.json"));
+  let file;
+  try {
+    file = req.resolve(`${pkg}/package.json`);
+  } catch {
+    file = req.resolve(pkg);
+  }
+  for (let d = dirname(file); d !== dirname(d); d = dirname(d)) {
+    const json = join(d, "package.json");
+    if (!existsSync(json)) continue;
+    const data = JSON.parse(readFileSync(json, "utf8"));
+    if (data.name === pkg) return data;
+  }
+  throw new Error(`[vitral] ${pkg} n\xE3o est\xE1 instalado no app`);
+}
+function sharedGroups(dir, share) {
+  const out = {};
+  for (const spec of share) {
+    const name = pkgOf(spec);
+    if (REACT.test(name)) continue;
+    const data = installed(dir, name);
+    const g = out[name] ??= { version: data.version, specs: [] };
+    for (const s of spec.endsWith("/*") ? subpaths(name, data) : [spec]) if (!g.specs.includes(s)) g.specs.push(s);
+  }
+  return out;
+}
+function throughAlias(spec, alias = {}) {
+  for (const [key, value] of Object.entries(alias)) {
+    if (typeof value !== "string" || key.endsWith("$") || !spec.startsWith(key + "/")) continue;
+    const json = join(value, "package.json");
+    if (!existsSync(json)) continue;
+    const exp = JSON.parse(readFileSync(json, "utf8")).exports;
+    const target = exp?.["." + spec.slice(key.length)];
+    const file = typeof target === "string" ? target : target?.import ?? target?.default;
+    if (typeof file === "string") return resolve(value, file);
+  }
+  return spec;
+}
+function hostModule(remotes, groups, alias, from) {
+  const spec = (s) => {
+    const t = throughAlias(s, alias);
+    if (!from || !isAbsolute(t)) return t;
+    const r = relative(from, t).replace(/\\/g, "/");
+    return r.startsWith(".") ? r : "./" + r;
+  };
+  const shared = Object.entries(groups).map(([name, g]) => {
+    const imports = g.specs.map((s) => `import(${JSON.stringify(spec(s))})`).join(", ");
+    const modules = g.specs.map((s, i) => `${JSON.stringify(s)}: m[${i}]`).join(", ");
+    return `  ${JSON.stringify(name)}: { version: ${JSON.stringify(g.version)}, modules: () => Promise.all([${imports}]).then((m) => ({ ${modules} })) },`;
+  });
+  return `export const remotes = ${JSON.stringify(remotes, null, 2)}
+export const shared = {
+${shared.join("\n")}
+}
+`;
+}
+var localDir = (url) => url.startsWith("/") && !url.startsWith("//") ? url.slice(0, url.lastIndexOf("/") + 1) : void 0;
+function devRemotes(remotes, dev) {
+  if (!dev) return remotes;
+  return Object.fromEntries(
+    Object.entries(remotes).map(([name, r]) => [name, r.devUrl ? { ...r, url: /\.json(\?|$)/.test(r.devUrl) ? r.devUrl : r.devUrl.replace(/\/?$/, "/vitral.json") } : r])
+  );
+}
+function remoteRewrites(remotes) {
+  return Object.values(remotes).flatMap(
+    (r) => (r.routes ?? []).filter((x) => x.public !== x.zone).map((x) => ({ source: `${x.public}/:path*`, destination: `${x.zone}/:path*` }))
+  );
+}
+function remoteHeaders(remotes) {
+  const immutable = [{ key: "Cache-Control", value: "public, max-age=31536000, immutable" }];
+  return Object.values(remotes).flatMap((r) => {
+    const dir = localDir(r.url);
+    if (!dir) return [];
+    return [
+      // O manifesto muda a cada deploy; os arquivos têm hash no nome.
+      { source: r.url, headers: [{ key: "Cache-Control", value: "no-cache" }] },
+      { source: `${dir}:file(remote-.*)`, headers: immutable },
+      { source: `${dir}split/:file*`, headers: immutable }
+    ];
+  });
+}
+function writeChanged(file, text) {
+  try {
+    if (readFileSync(file, "utf8") === text) return;
+  } catch {
+  }
+  writeFileSync(file, text);
+}
+function withVitral(nextConfig, options) {
+  const dir = resolve(options.dir ?? process.cwd());
+  const file = join(dir, ".vitral", "host-config.mjs");
+  const groups = sharedGroups(dir, options.share ?? []);
+  const emit = (alias) => {
+    try {
+      mkdirSync(dirname(file), { recursive: true });
+      writeChanged(join(dirname(file), ".gitignore"), "*\n");
+      writeChanged(file, hostModule(devRemotes(options.remotes, process.env.NODE_ENV === "development"), groups, alias, dirname(file)));
+    } catch (e) {
+      console.warn(`[vitral] n\xE3o consegui gravar ${file} (${e.message}). No build ele \xE9 necess\xE1rio; no next start, n\xE3o.`);
+    }
+  };
+  emit(Object.fromEntries(Object.entries(nextConfig.turbopack?.resolveAlias ?? {}).map(([k, v]) => [k, typeof v === "string" && v.startsWith(".") ? resolve(dir, v) : v])));
+  const ours = remoteRewrites(options.remotes);
+  const headers = remoteHeaders(options.remotes);
+  return {
+    ...nextConfig,
+    // O webpack do app empacota o vitral também no servidor: senão o Node não acha o módulo gerado.
+    transpilePackages: [.../* @__PURE__ */ new Set([...nextConfig.transpilePackages ?? [], "vitral"])],
+    async rewrites() {
+      const user = await nextConfig.rewrites?.() ?? [];
+      return Array.isArray(user) ? { beforeFiles: ours, afterFiles: user, fallback: [] } : { ...user, beforeFiles: [...ours, ...user.beforeFiles ?? []] };
+    },
+    async headers() {
+      return [...headers, ...await nextConfig.headers?.() ?? []];
+    },
+    webpack(config, context) {
+      const out = nextConfig.webpack ? nextConfig.webpack(config, context) : config;
+      if (out.resolve.alias && !Array.isArray(out.resolve.alias)) emit(out.resolve.alias);
+      out.resolve.alias = { ...out.resolve.alias, [`${HOST_CONFIG}$`]: file };
+      return out;
+    },
+    turbopack: {
+      ...nextConfig.turbopack,
+      resolveAlias: { ...nextConfig.turbopack?.resolveAlias, [HOST_CONFIG]: "./" + relative(dir, file).replace(/\\/g, "/") }
+    }
+  };
+}
+export {
+  HOST_CONFIG,
+  devRemotes,
+  hostModule,
+  remoteHeaders,
+  remoteRewrites,
+  sharedGroups,
+  throughAlias,
+  withVitral
+};

package/dist/next-host.d.ts

@@ -0,0 +1,26 @@
+import { ReactNode } from 'react';
+import { RemoteProps } from './react.js';
+import './host-slot-Cz6EiGsB.js';
+import 'react/jsx-runtime';
+import './types-wsKR1gfx.js';
+import './errors-kjBv6IH_.js';
+import './loader-BIXjuvvp.js';
+import './events-Cieg_far.js';
+
+/** O remote dono do caminho público `path`, se houver. */
+declare function remoteFor(path: string): string | undefined;
+/** Navegação de página inteira para uma rota de remote vira `Router.push`. Devolve a função que desliga. */
+declare function interceptNavigation(): () => void;
+/** Coloque uma vez, no `_app`. */
+declare function VitralNext(): null;
+type NextRemoteProps = Omit<RemoteProps, 'name' | 'src'> & {
+    name: string;
+};
+/**
+ * O remote na página do host. Passa o roteador do Next ao remote (prop
+ * `__next`, lida pelo plugin no modo `next`): `useRouter`, `<Link>` e
+ * `router.push` do remote usam o do host, com as rotas públicas.
+ */
+declare function NextRemote({ name, props, fallback, ...rest }: NextRemoteProps): ReactNode;
+
+export { NextRemote, type NextRemoteProps, VitralNext, interceptNavigation, remoteFor };

package/dist/next-host.js

@@ -0,0 +1,92 @@
+"use client";
+import {
+  Remote,
+  preload
+} from "./chunk-4IWZIFAL.js";
+import "./chunk-B2MPYF4M.js";
+import "./chunk-ZJ4IM2PZ.js";
+import "./chunk-NTXMEZIZ.js";
+import "./chunk-EQZOJU3B.js";
+import {
+  configure
+} from "./chunk-6T25WKNK.js";
+import "./chunk-KU6HF2EW.js";
+import "./chunk-TW7KYJQ6.js";
+import "./chunk-463H6B56.js";
+import "./chunk-GNPFWISJ.js";
+
+// src/next-host.tsx
+import Router, { useRouter } from "next/router";
+import { createElement, useEffect, useMemo } from "react";
+import { remotes, shared } from "vitral-next-host-config";
+var under = (path, prefix) => path === prefix || path.startsWith(prefix + "/");
+function remoteFor(path) {
+  for (const [name, r] of Object.entries(remotes)) if (under(path, r.basePath) || r.routes?.some((x) => under(path, x.public))) return name;
+}
+var configured = false;
+function setup() {
+  if (configured || typeof window === "undefined") return;
+  configured = true;
+  configure({
+    remotes: Object.fromEntries(Object.entries(remotes).map(([name, r]) => [name, { url: r.url, ...r.integrity === false && { integrity: false } }])),
+    dedupe: shared
+  });
+}
+function interceptNavigation() {
+  const nav = globalThis.navigation;
+  if (!nav) return () => {
+  };
+  let last;
+  const done = () => last = void 0;
+  const on = (e) => {
+    if (e.destination.sameDocument || !e.cancelable || e.hashChange || e.downloadRequest || e.formData) return;
+    if (e.navigationType !== "push" && e.navigationType !== "replace") return;
+    const url = new URL(e.destination.url);
+    const path = url.pathname + url.search + url.hash;
+    if (url.origin !== location.origin || !remoteFor(url.pathname) || last === path) return;
+    e.preventDefault();
+    last = path;
+    void (e.navigationType === "replace" ? Router.replace(path) : Router.push(path));
+  };
+  nav.addEventListener("navigate", on);
+  Router.events.on("routeChangeComplete", done);
+  return () => {
+    nav.removeEventListener("navigate", on);
+    Router.events.off("routeChangeComplete", done);
+  };
+}
+function VitralNext() {
+  setup();
+  useEffect(() => {
+    const here = remoteFor(location.pathname);
+    const go = (name) => preload(name, { routes: !!remotes[name].warmRoutes });
+    if (here) go(here);
+    const idle = [];
+    for (const [name, r] of Object.entries(remotes))
+      if (name !== here && (r.preload ?? "idle") === "idle")
+        idle.push(typeof requestIdleCallback === "function" ? requestIdleCallback(() => go(name), { timeout: 5e3 }) : window.setTimeout(() => go(name), 2e3));
+    const stop = interceptNavigation();
+    return () => {
+      stop();
+      for (const id of idle) typeof cancelIdleCallback === "function" ? cancelIdleCallback(id) : clearTimeout(id);
+    };
+  }, []);
+  return null;
+}
+var push = (url, options) => void Router.push(url, void 0, options);
+var replace = (url, options) => void Router.replace(url, void 0, options);
+function NextRemote({ name, props, fallback = null, ...rest }) {
+  setup();
+  const router = useRouter();
+  const r = remotes[name];
+  const host = useMemo(() => ({ asPath: router.asPath, basePath: r?.basePath, routes: r?.routes, push, replace, events: Router.events }), [router.asPath, r]);
+  const all = useMemo(() => ({ ...props, __next: host }), [props, host]);
+  if (!router.isReady) return fallback;
+  return createElement(Remote, { ...rest, name, fallback, props: all });
+}
+export {
+  NextRemote,
+  VitralNext,
+  interceptNavigation,
+  remoteFor
+};