astro 3.4.3 → 3.5.0

package/dist/i18n/vite-plugin-i18n.js

@@ -0,0 +1,62 @@
+import * as vite from "vite";
+const virtualModuleId = "astro:i18n";
+const resolvedVirtualModuleId = "\0" + virtualModuleId;
+function astroInternationalization({
+  settings
+}) {
+  return {
+    name: "astro:i18n",
+    enforce: "pre",
+    async resolveId(id) {
+      if (id === virtualModuleId) {
+        return resolvedVirtualModuleId;
+      }
+    },
+    load(id) {
+      if (id === resolvedVirtualModuleId) {
+        return `
+					import { 
+						getLocaleRelativeUrl as _getLocaleRelativeUrl, 
+						getLocaleRelativeUrlList as _getLocaleRelativeUrlList,
+						getLocaleAbsoluteUrl as _getLocaleAbsoluteUrl, 
+						getLocaleAbsoluteUrlList as _getLocaleAbsoluteUrlList,
+						 
+					} from "astro/i18n";
+					
+					const base =  ${JSON.stringify(settings.config.base)};
+					const trailingSlash =  ${JSON.stringify(settings.config.trailingSlash)};
+					const format =  ${JSON.stringify(settings.config.build.format)};
+					const site = ${JSON.stringify(settings.config.site)};
+					const i18n = ${JSON.stringify(settings.config.experimental.i18n)};
+					
+					export const getRelativeLocaleUrl = (locale, path = "", opts) => _getLocaleRelativeUrl({ 
+						locale,
+						path, 
+						base, 
+						trailingSlash, 
+						format,
+						...i18n,
+						...opts 
+					});
+					export const getAbsoluteLocaleUrl = (locale, path = "", opts) => _getLocaleAbsoluteUrl({ 
+						locale, 
+						path, 
+						base, 
+						trailingSlash, 
+						format, 
+						site, 
+						...i18n,
+						...opts 
+					});
+					
+					export const getRelativeLocaleUrlList = (path = "", opts) => _getLocaleRelativeUrlList({ 
+						base, path, trailingSlash, format, ...i18n, ...opts });
+					export const getAbsoluteLocaleUrlList = (path = "", opts) => _getLocaleAbsoluteUrlList({ base, path, trailingSlash, format, site, ...i18n, ...opts });
+				`;
+      }
+    }
+  };
+}
+export {
+  astroInternationalization as default
+};

package/dist/integrations/astroFeaturesValidation.js

@@ -11,7 +11,10 @@ const ALL_UNSUPPORTED = {
   serverOutput: UNSUPPORTED,
   staticOutput: UNSUPPORTED,
   hybridOutput: UNSUPPORTED,
-  assets: UNSUPPORTED_ASSETS_FEATURE
+  assets: UNSUPPORTED_ASSETS_FEATURE,
+  i18n: {
+    detectBrowserLanguage: UNSUPPORTED
+  }
 };
 function validateSupportedFeatures(adapterName, featureMap = ALL_UNSUPPORTED, config, logger) {
   const {

package/dist/integrations/index.js

@@ -94,6 +94,18 @@ async function runHookConfigSetup({
           }
           addedClientDirectives.set(name, buildClientDirectiveEntrypoint(name, entrypoint));
         },
+        addMiddleware: ({ order, entrypoint }) => {
+          if (typeof updatedSettings.middlewares[order] === "undefined") {
+            throw new Error(
+              `The "${integration.name}" integration is trying to add middleware but did not specify an order.`
+            );
+          }
+          logger.debug(
+            "middleware",
+            `The integration ${integration.name} has added middleware that runs ${order === "pre" ? "before" : "after"} any application middleware you define.`
+          );
+          updatedSettings.middlewares[order].push(entrypoint);
+        },
         logger: integrationLogger
       };
       Object.defineProperty(hooks, "addPageExtension", {

package/dist/prefetch/index.d.ts

@@ -0,0 +1,31 @@
+interface InitOptions {
+    defaultStrategy?: string;
+    prefetchAll?: boolean;
+}
+/**
+ * Initialize the prefetch script, only works once.
+ *
+ * @param defaultOpts Default options for prefetching if not already set by the user config.
+ */
+export declare function init(defaultOpts?: InitOptions): void;
+export interface PrefetchOptions {
+    /**
+     * How the prefetch should prioritize the URL. (default `'link'`)
+     * - `'link'`: use `<link rel="prefetch">`, has lower loading priority.
+     * - `'fetch'`: use `fetch()`, has higher loading priority.
+     */
+    with?: 'link' | 'fetch';
+}
+/**
+ * Prefetch a URL so it's cached when the user navigates to it.
+ *
+ * @param url A full or partial URL string based on the current `location.href`. They are only fetched if:
+ *   - The user is online
+ *   - The user is not in data saver mode
+ *   - The URL is within the same origin
+ *   - The URL is not the current page
+ *   - The URL has not already been prefetched
+ * @param opts Additional options for prefetching.
+ */
+export declare function prefetch(url: string, opts?: PrefetchOptions): void;
+export {};

package/dist/prefetch/index.js

@@ -0,0 +1,176 @@
+const debug = import.meta.env.DEV ? console.debug : void 0;
+const inBrowser = import.meta.env.SSR === false;
+const prefetchedUrls = /* @__PURE__ */ new Set();
+const listenedAnchors = /* @__PURE__ */ new WeakSet();
+let prefetchAll = __PREFETCH_PREFETCH_ALL__;
+let defaultStrategy = __PREFETCH_DEFAULT_STRATEGY__;
+let inited = false;
+function init(defaultOpts) {
+  if (!inBrowser)
+    return;
+  if (inited)
+    return;
+  inited = true;
+  debug?.(`[astro] Initializing prefetch script`);
+  prefetchAll ??= defaultOpts?.prefetchAll ?? false;
+  defaultStrategy ??= defaultOpts?.defaultStrategy ?? "hover";
+  initTapStrategy();
+  initHoverStrategy();
+  initViewportStrategy();
+}
+function initTapStrategy() {
+  for (const event of ["touchstart", "mousedown"]) {
+    document.body.addEventListener(
+      event,
+      (e) => {
+        if (elMatchesStrategy(e.target, "tap")) {
+          prefetch(e.target.href, { with: "fetch" });
+        }
+      },
+      { passive: true }
+    );
+  }
+}
+function initHoverStrategy() {
+  let timeout;
+  document.body.addEventListener(
+    "focusin",
+    (e) => {
+      if (elMatchesStrategy(e.target, "hover")) {
+        handleHoverIn(e);
+      }
+    },
+    { passive: true }
+  );
+  document.body.addEventListener("focusout", handleHoverOut, { passive: true });
+  onPageLoad(() => {
+    for (const anchor of document.getElementsByTagName("a")) {
+      if (listenedAnchors.has(anchor))
+        continue;
+      if (elMatchesStrategy(anchor, "hover")) {
+        listenedAnchors.add(anchor);
+        anchor.addEventListener("mouseenter", handleHoverIn, { passive: true });
+        anchor.addEventListener("mouseleave", handleHoverOut, { passive: true });
+      }
+    }
+  });
+  function handleHoverIn(e) {
+    const href = e.target.href;
+    if (timeout) {
+      clearTimeout(timeout);
+    }
+    timeout = setTimeout(() => {
+      prefetch(href, { with: "fetch" });
+    }, 80);
+  }
+  function handleHoverOut() {
+    if (timeout) {
+      clearTimeout(timeout);
+      timeout = 0;
+    }
+  }
+}
+function initViewportStrategy() {
+  let observer;
+  onPageLoad(() => {
+    for (const anchor of document.getElementsByTagName("a")) {
+      if (listenedAnchors.has(anchor))
+        continue;
+      if (elMatchesStrategy(anchor, "viewport")) {
+        listenedAnchors.add(anchor);
+        observer ??= createViewportIntersectionObserver();
+        observer.observe(anchor);
+      }
+    }
+  });
+}
+function createViewportIntersectionObserver() {
+  const timeouts = /* @__PURE__ */ new WeakMap();
+  return new IntersectionObserver((entries, observer) => {
+    for (const entry of entries) {
+      const anchor = entry.target;
+      const timeout = timeouts.get(anchor);
+      if (entry.isIntersecting) {
+        if (timeout) {
+          clearTimeout(timeout);
+        }
+        timeouts.set(
+          anchor,
+          setTimeout(() => {
+            observer.unobserve(anchor);
+            timeouts.delete(anchor);
+            prefetch(anchor.href, { with: "link" });
+          }, 300)
+        );
+      } else {
+        if (timeout) {
+          clearTimeout(timeout);
+          timeouts.delete(anchor);
+        }
+      }
+    }
+  });
+}
+function prefetch(url, opts) {
+  if (!canPrefetchUrl(url))
+    return;
+  prefetchedUrls.add(url);
+  const priority = opts?.with ?? "link";
+  debug?.(`[astro] Prefetching ${url} with ${priority}`);
+  if (priority === "link") {
+    const link = document.createElement("link");
+    link.rel = "prefetch";
+    link.setAttribute("href", url);
+    document.head.append(link);
+  } else {
+    fetch(url).catch((e) => {
+      console.log(`[astro] Failed to prefetch ${url}`);
+      console.error(e);
+    });
+  }
+}
+function canPrefetchUrl(url) {
+  if (!navigator.onLine)
+    return false;
+  if ("connection" in navigator) {
+    const conn = navigator.connection;
+    if (conn.saveData || /(2|3)g/.test(conn.effectiveType))
+      return false;
+  }
+  try {
+    const urlObj = new URL(url, location.href);
+    return location.origin === urlObj.origin && location.pathname !== urlObj.pathname && !prefetchedUrls.has(url);
+  } catch {
+  }
+  return false;
+}
+function elMatchesStrategy(el, strategy) {
+  if (el?.tagName !== "A")
+    return false;
+  const attrValue = el.dataset.astroPrefetch;
+  if (attrValue === "false") {
+    return false;
+  }
+  if (attrValue == null && prefetchAll || attrValue === "") {
+    return strategy === defaultStrategy;
+  }
+  if (attrValue === strategy) {
+    return true;
+  }
+  return false;
+}
+function onPageLoad(cb) {
+  cb();
+  let firstLoad = false;
+  document.addEventListener("astro:page-load", () => {
+    if (!firstLoad) {
+      firstLoad = true;
+      return;
+    }
+    cb();
+  });
+}
+export {
+  init,
+  prefetch
+};

package/dist/prefetch/vite-plugin-prefetch.d.ts

@@ -0,0 +1,5 @@
+import * as vite from 'vite';
+import type { AstroSettings } from '../@types/astro.js';
+export default function astroPrefetch({ settings }: {
+    settings: AstroSettings;
+}): vite.Plugin;

package/dist/prefetch/vite-plugin-prefetch.js

@@ -0,0 +1,43 @@
+import * as vite from "vite";
+const virtualModuleId = "astro:prefetch";
+const resolvedVirtualModuleId = "\0" + virtualModuleId;
+const prefetchInternalModuleFsSubpath = "astro/dist/prefetch/index.js";
+const prefetchCode = `import { init } from 'astro/prefetch';init()`;
+function astroPrefetch({ settings }) {
+  const prefetchOption = settings.config.prefetch;
+  const prefetch = prefetchOption ? typeof prefetchOption === "object" ? prefetchOption : {} : void 0;
+  if (prefetch && settings.scripts.every((s) => s.content !== prefetchCode)) {
+    settings.scripts.push({
+      stage: "page",
+      content: `import { init } from 'astro/prefetch';init()`
+    });
+  }
+  const throwPrefetchNotEnabledError = () => {
+    throw new Error("You need to enable the `prefetch` Astro config to import `astro:prefetch`");
+  };
+  return {
+    name: "astro:prefetch",
+    async resolveId(id) {
+      if (id === virtualModuleId) {
+        if (!prefetch)
+          throwPrefetchNotEnabledError();
+        return resolvedVirtualModuleId;
+      }
+    },
+    load(id) {
+      if (id === resolvedVirtualModuleId) {
+        if (!prefetch)
+          throwPrefetchNotEnabledError();
+        return `export { prefetch } from "astro/prefetch";`;
+      }
+    },
+    transform(code, id) {
+      if (id.includes(prefetchInternalModuleFsSubpath)) {
+        return code.replace("__PREFETCH_PREFETCH_ALL__", JSON.stringify(prefetch?.prefetchAll)).replace("__PREFETCH_DEFAULT_STRATEGY__", JSON.stringify(prefetch?.defaultStrategy));
+      }
+    }
+  };
+}
+export {
+  astroPrefetch as default
+};

package/dist/runtime/client/dev-overlay/entrypoint.js

@@ -49,12 +49,12 @@ document.addEventListener("DOMContentLoaded", async () => {
       }
       target.querySelector(".notification")?.toggleAttribute("data-active", newState);
     });
-    eventTarget.addEventListener("toggle-plugin", (evt) => {
+    eventTarget.addEventListener("toggle-plugin", async (evt) => {
       let newState = void 0;
       if (evt instanceof CustomEvent) {
         newState = evt.detail.state ?? true;
       }
-      overlay.togglePluginStatus(plugin, newState);
+      await overlay.togglePluginStatus(plugin, newState);
     });
     return plugin;
   };

package/dist/runtime/client/dev-overlay/overlay.d.ts

@@ -22,12 +22,20 @@ export declare class AstroDevOverlay extends HTMLElement {
     getPluginTemplate(plugin: DevOverlayPlugin): string;
     getPluginIcon(icon: Icon): string | undefined;
     getPluginById(id: string): DevOverlayPlugin | undefined;
-    getPluginCanvasById(id: string): Element | null;
-    togglePluginStatus(plugin: DevOverlayPlugin, status?: boolean): void;
+    getPluginCanvasById(id: string): HTMLElement | null;
+    /**
+     * @param plugin The plugin to toggle the status of
+     * @param newStatus Optionally, force the plugin into a specific state
+     */
+    togglePluginStatus(plugin: DevOverlayPlugin, newStatus?: boolean): Promise<void>;
+    /**
+     * @param newStatus Optionally, force the minimize button into a specific state
+     */
     toggleMinimizeButton(newStatus?: boolean): void;
     toggleOverlay(newStatus?: boolean): void;
 }
 export declare class DevOverlayCanvas extends HTMLElement {
     shadowRoot: ShadowRoot;
     constructor();
+    connectedCallback(): void;
 }

package/dist/runtime/client/dev-overlay/overlay.js

@@ -38,7 +38,7 @@ class AstroDevOverlay extends HTMLElement {
 				display: flex;
 				gap: 8px;
 				align-items: center;
-				transition: bottom 0.2s ease-in-out;
+				transition: bottom 0.35s cubic-bezier(0.485, -0.050, 0.285, 1.505);
 				pointer-events: none;
 			}
 
@@ -59,11 +59,10 @@ class AstroDevOverlay extends HTMLElement {
 				height: 56px;
 				overflow: hidden;
 				pointer-events: auto;
-
 				background: linear-gradient(180deg, #13151A 0%, rgba(19, 21, 26, 0.88) 100%);
-				box-shadow: 0px 0px 0px 0px #13151A4D;
 				border: 1px solid #343841;
 				border-radius: 9999px;
+				box-shadow: 0px 0px 0px 0px rgba(19, 21, 26, 0.30), 0px 1px 2px 0px rgba(19, 21, 26, 0.29), 0px 4px 4px 0px rgba(19, 21, 26, 0.26), 0px 10px 6px 0px rgba(19, 21, 26, 0.15), 0px 17px 7px 0px rgba(19, 21, 26, 0.04), 0px 26px 7px 0px rgba(19, 21, 26, 0.01);
 			}
 
 			#dev-bar .item {
@@ -174,16 +173,6 @@ class AstroDevOverlay extends HTMLElement {
 				width: 1px;
 			}
 
-			astro-dev-overlay-plugin-canvas {
-				position: absolute;
-				top: 0;
-				left: 0;
-			}
-
-			astro-dev-overlay-plugin-canvas:not([data-active]) {
-				display: none;
-			}
-
 			#minimize-button {
 				width: 32px;
 				height: 32px;
@@ -242,14 +231,14 @@ class AstroDevOverlay extends HTMLElement {
       this.devOverlay = this.shadowRoot.querySelector("#dev-overlay");
       this.attachEvents();
     }
-    this.plugins.forEach((plugin) => {
+    this.plugins.forEach(async (plugin) => {
       if (!this.hasBeenInitialized) {
         console.log(`Creating plugin canvas for ${plugin.id}`);
         const pluginCanvas = document.createElement("astro-dev-overlay-plugin-canvas");
         pluginCanvas.dataset.pluginId = plugin.id;
         this.shadowRoot?.append(pluginCanvas);
       }
-      this.togglePluginStatus(plugin, plugin.active);
+      await this.togglePluginStatus(plugin, plugin.active);
     });
     if ("requestIdleCallback" in window) {
       window.requestIdleCallback(async () => {
@@ -278,7 +267,7 @@ class AstroDevOverlay extends HTMLElement {
         if (plugin.status === "loading") {
           await this.initPlugin(plugin);
         }
-        this.togglePluginStatus(plugin);
+        await this.togglePluginStatus(plugin);
       });
     });
     const minimizeButton = this.shadowRoot.querySelector("#minimize-button");
@@ -367,27 +356,47 @@ class AstroDevOverlay extends HTMLElement {
     return this.plugins.find((plugin) => plugin.id === id);
   }
   getPluginCanvasById(id) {
-    return this.shadowRoot.querySelector(`astro-dev-overlay-plugin-canvas[data-plugin-id="${id}"]`);
+    return this.shadowRoot.querySelector(
+      `astro-dev-overlay-plugin-canvas[data-plugin-id="${id}"]`
+    );
   }
-  togglePluginStatus(plugin, status) {
-    plugin.active = status ?? !plugin.active;
+  /**
+   * @param plugin The plugin to toggle the status of
+   * @param newStatus Optionally, force the plugin into a specific state
+   */
+  async togglePluginStatus(plugin, newStatus) {
+    const pluginCanvas = this.getPluginCanvasById(plugin.id);
+    if (!pluginCanvas)
+      return;
+    if (plugin.active && !newStatus && plugin.beforeTogglingOff) {
+      const shouldToggleOff = await plugin.beforeTogglingOff(pluginCanvas.shadowRoot);
+      if (!shouldToggleOff)
+        return;
+    }
+    plugin.active = newStatus ?? !plugin.active;
     const target = this.shadowRoot.querySelector(`[data-plugin-id="${plugin.id}"]`);
     if (!target)
       return;
     target.classList.toggle("active", plugin.active);
-    this.getPluginCanvasById(plugin.id)?.toggleAttribute("data-active", plugin.active);
-    plugin.eventTarget.dispatchEvent(
-      new CustomEvent("plugin-toggled", {
-        detail: {
-          state: plugin.active,
-          plugin
-        }
-      })
-    );
+    pluginCanvas.style.display = plugin.active ? "block" : "none";
+    window.requestAnimationFrame(() => {
+      pluginCanvas.toggleAttribute("data-active", plugin.active);
+      plugin.eventTarget.dispatchEvent(
+        new CustomEvent("plugin-toggled", {
+          detail: {
+            state: plugin.active,
+            plugin
+          }
+        })
+      );
+    });
     if (import.meta.hot) {
       import.meta.hot.send(`${WS_EVENT_NAME}:${plugin.id}:toggled`, { state: plugin.active });
     }
   }
+  /**
+   * @param newStatus Optionally, force the minimize button into a specific state
+   */
   toggleMinimizeButton(newStatus) {
     const minimizeButton = this.shadowRoot.querySelector("#minimize-button");
     if (!minimizeButton)
@@ -435,6 +444,16 @@ class DevOverlayCanvas extends HTMLElement {
     super();
     this.shadowRoot = this.attachShadow({ mode: "open" });
   }
+  connectedCallback() {
+    this.shadowRoot.innerHTML = `
+		<style>
+			:host {
+				position: absolute;
+				top: 0;
+				left: 0;
+			}
+		</style>`;
+  }
 }
 export {
   AstroDevOverlay,

package/dist/runtime/client/dev-overlay/plugins/astro.d.ts

@@ -3,5 +3,6 @@ declare const _default: {
     name: string;
     icon: "astro:logo";
     init(canvas: ShadowRoot): void;
+    beforeTogglingOff(canvas: ShadowRoot): Promise<boolean>;
 };
 export default _default;

package/dist/runtime/client/dev-overlay/plugins/astro.js

@@ -3,10 +3,37 @@ var astro_default = {
   name: "Astro",
   icon: "astro:logo",
   init(canvas) {
-    const astroWindow = document.createElement("astro-dev-overlay-window");
-    astroWindow.windowTitle = "Astro";
-    astroWindow.windowIcon = "astro:logo";
-    astroWindow.innerHTML = `
+    createWindow();
+    document.addEventListener("astro:after-swap", createWindow);
+    function createWindow() {
+      const style = document.createElement("style");
+      style.textContent = `
+			:host {
+				opacity: 0;
+				transition: opacity 0.15s ease-in-out;
+			}
+
+			:host([data-active]) {
+				opacity: 1;
+			}
+
+			@media screen and (prefers-reduced-motion: no-preference) {
+				:host astro-dev-overlay-window {
+					transform: translateY(55px) translate(-50%, -50%);
+					transition: transform 0.15s ease-in-out;
+					transform-origin: center bottom;
+				}
+
+				:host([data-active]) astro-dev-overlay-window {
+					transform: translateY(0) translate(-50%, -50%);
+				}
+			}
+		`;
+      canvas.append(style);
+      const astroWindow = document.createElement("astro-dev-overlay-window");
+      astroWindow.windowTitle = "Astro";
+      astroWindow.windowIcon = "astro:logo";
+      astroWindow.innerHTML = `
 			<style>
 				#buttons-container {
 					display: flex;
@@ -48,17 +75,25 @@ var astro_default = {
 				<div>
 					<p>Welcome to Astro!</p>
 					<div id="buttons-container">
-						<astro-dev-overlay-card icon="astro:logo" link="https://github.com/withastro/astro/issues/new/choose">Report an issue</astro-dev-overlay-card>
-						<astro-dev-overlay-card icon="astro:logo" link="https://docs.astro.build/en/getting-started/">View Astro Docs</astro-dev-overlay-card>
+						<astro-dev-overlay-card icon="bug" link="https://github.com/withastro/astro/issues/new/choose">Report an issue</astro-dev-overlay-card>
+						<astro-dev-overlay-card icon="file-search" link="https://docs.astro.build/en/getting-started/">View Astro Docs</astro-dev-overlay-card>
 					</div>
 				</div>
 				<footer>
-					<a href="https://discord.gg/astro" target="_blank">Join the Astro Discord</a>
-					<a href="https://astro.build" target="_blank">Visit Astro.build</a>
+					<a href="https://astro.build/chat" target="_blank">Join us on Discord</a>
+					<a href="https://astro.build" target="_blank">Visit the Astro website</a>
 				</footer>
 			</div>
 		`;
-    canvas.append(astroWindow);
+      canvas.append(astroWindow);
+    }
+  },
+  async beforeTogglingOff(canvas) {
+    canvas.host?.removeAttribute("data-active");
+    await new Promise((resolve) => {
+      canvas.host.addEventListener("transitionend", resolve);
+    });
+    return true;
   }
 };
 export {

package/dist/runtime/client/dev-overlay/plugins/audit.d.ts

@@ -2,6 +2,7 @@ declare const _default: {
     id: string;
     name: string;
     icon: "<svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 16\"><path fill=\"#fff\" d=\"M.6 2A1.1 1.1 0 0 1 1.7.9h16.6a1.1 1.1 0 1 1 0 2.2H1.6A1.1 1.1 0 0 1 .8 2Zm1.1 7.1h6a1.1 1.1 0 0 0 0-2.2h-6a1.1 1.1 0 0 0 0 2.2ZM9.3 13H1.8a1.1 1.1 0 1 0 0 2.2h7.5a1.1 1.1 0 1 0 0-2.2Zm11.3 1.9a1.1 1.1 0 0 1-1.5 0l-1.7-1.7a4.1 4.1 0 1 1 1.6-1.6l1.6 1.7a1.1 1.1 0 0 1 0 1.6Zm-5.3-3.4a1.9 1.9 0 1 0 0-3.8 1.9 1.9 0 0 0 0 3.8Z\"/></svg>";
-    init(canvas: ShadowRoot, eventTarget: EventTarget): void;
+    init(canvas: ShadowRoot, eventTarget: EventTarget): Promise<void>;
+    beforeTogglingOff(canvas: ShadowRoot): Promise<boolean>;
 };
 export default _default;